/* DANANG2NITE | Step03 PC magazine VIEW only | 2026-10-18
   Desktop-only detail spacing, masthead typography, unclipped sticky TOC.
   Mobile CSS and article metadata are unchanged. */
@media (min-width:821px){
  html[lang] body.page-magazine-view .site-main{overflow:visible!important}
  html[lang] body.page-magazine-view .magazine-masthead{
    width:min(1360px,calc(100% - 56px))!important;
    margin-top:26px;
  }
  html[lang] body.page-magazine-view .magazine-masthead__grid{
    grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr)!important;
    min-height:500px;
  }
  html[lang] body.page-magazine-view .magazine-masthead__copy{
    min-width:0;
    padding:34px clamp(24px,2.8vw,42px)!important;
  }
  html[lang] body.page-magazine-view .magazine-masthead h1{
    max-width:100%;
    margin-top:16px;
    font-size:clamp(38px,3.05vw,50px)!important;
    line-height:1.08!important;
    letter-spacing:-1.2px;
    overflow-wrap:break-word;
    text-wrap:pretty;
  }
  html[lang] body.page-magazine-view .is-title-long .magazine-masthead h1{
    font-size:clamp(35px,2.7vw,44px)!important;
    line-height:1.1!important;
  }
  html[lang] body.page-magazine-view .is-title-xlong .magazine-masthead h1{
    font-size:clamp(32px,2.3vw,39px)!important;
    line-height:1.14!important;
  }
  html[lang] body.page-magazine-view .magazine-masthead__subtitle{
    margin-top:15px;
    font-size:clamp(14px,1.1vw,17px)!important;
    line-height:1.45;
  }
  html[lang] body.page-magazine-view .magazine-masthead__summary{
    margin-top:12px;
    font-size:12px!important;
    line-height:1.64!important;
  }
  html[lang] body.page-magazine-view .magazine-masthead__foot{margin-top:17px}
  html[lang] body.page-magazine-view .magazine-masthead__media{
    display:grid;
    place-items:center;
    background:#100d12;
  }
  html[lang] body.page-magazine-view .magazine-masthead__media img{
    min-height:0!important;
    width:100%;
    height:100%;
    display:block;
    object-fit:contain!important;
    object-position:center;
  }
  html[lang] body.page-magazine-view .magazine-reading{
    width:min(1240px,calc(100% - 64px));
    grid-template-columns:minmax(0,1fr) 295px;
    gap:clamp(30px,4vw,58px);
    align-items:start;
    margin-top:42px;
  }
  html[lang] body.page-magazine-view .magazine-reading__intro{margin-bottom:27px}
  html[lang] body.page-magazine-view .magazine-paragraph p{
    font-size:15.5px;
    line-height:1.84;
  }
  html[lang] body.page-magazine-view .magazine-section-heading{
    margin-top:48px!important;
    margin-bottom:23px!important;
    scroll-margin-top:180px;
  }
  html[lang] body.page-magazine-view .magazine-section-heading h2{
    font-size:clamp(25px,2vw,30px);
    line-height:1.18;
    overflow-wrap:break-word;
  }
  /* Phase79/80 set sticky top:118px, which hides index behind desktop header. */
  html[lang] body.page-magazine-view .magazine-reading__rail{
    position:sticky!important;
    top:156px!important;
    align-self:start!important;
    z-index:3!important;
  }
  html[lang] body.page-magazine-view .magazine-toc{
    max-height:clamp(200px,calc(100dvh - 310px),610px)!important;
    scrollbar-gutter:stable;
  }
  html[lang] body.page-magazine-view .magazine-toc a{
    grid-template-columns:25px minmax(0,1fr);
    padding:10px 9px;
    gap:8px;
  }
  html[lang] body.page-magazine-view .magazine-toc a>strong{
    font-size:11.5px;
    line-height:1.4;
    overflow-wrap:anywhere;
  }
  html[lang] body.page-magazine-view .magazine-toc a>span{font-size:10px}
  html[lang] body.page-magazine-view .magazine-article-end{
    margin-top:44px!important;
    padding-bottom:38px!important;
  }
  html[dir="rtl"] body.page-magazine-view .magazine-section-heading{
    direction:rtl;
  }
  html[dir="rtl"] body.page-magazine-view .magazine-toc a{direction:rtl}
}
@media (min-width:821px) and (max-width:1120px){
  html[lang] body.page-magazine-view .magazine-masthead__grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    min-height:0;
  }
  html[lang] body.page-magazine-view .magazine-masthead h1{font-size:clamp(30px,3.4vw,39px)!important}
  html[lang] body.page-magazine-view .magazine-masthead__copy{padding:28px!important}
  html[lang] body.page-magazine-view .magazine-reading{
    grid-template-columns:minmax(0,1fr) 260px;
    gap:30px;
    width:min(1040px,calc(100% - 40px));
  }
}
@media (min-width:821px) and (max-width:980px){
  /* Existing Phase39 intentionally hides the desktop TOC at narrow widths. */
  html[lang] body.page-magazine-view .magazine-reading{grid-template-columns:minmax(0,1fr)!important}
  html[lang] body.page-magazine-view .magazine-reading__rail{display:none}
}
@media (prefers-reduced-motion:reduce){
  html[lang] body.page-magazine-view .magazine-toc a{transition:none!important}
}