:root{
  --ink:#292821;
  --ink-2:#47443A;
  --bg:#FBFAF4;
  --bg-2:#F6F0D9;
  --surface:#FFFFFF;
  --surface-raised:#FFFDF7;
  --surface-soft:#F3E8B8;
  --yellow:#E8C95A;
  --yellow-dark:#B58C20;
  --yellow-soft:rgba(232,201,90,.20);
  --champagne:#D8B86A;
  --cream:#FFF3BF;
  --sage:#71866B;
  --sage-soft:rgba(113,134,107,.13);
  --text:#292821;
  --text-2:#615E53;
  --text-3:#918C7C;
  --line:#E6DFC9;
  --line-strong:#CFC3A0;
  --shadow:0 14px 34px rgba(93,78,39,.09);
  --shadow-strong:0 24px 60px rgba(93,78,39,.14);
  --radius:8px;
  --radius-card:18px;
  --radius-large:30px;
  --wrap:1320px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);color:var(--text)}
body{margin:0;overflow-x:hidden;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;background:var(--bg);color:var(--text);font-size:16px;line-height:1.72}
body.menu-open,body.overlay-open{overflow:hidden}
img{display:block;max-width:100%;height:auto;object-fit:cover}
a{color:inherit;text-decoration:none}
a:hover{color:var(--yellow-dark)}
button,input,select,textarea{font:inherit}
button{color:inherit}
button,a,input,select{outline:none}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(181,140,32,.42);outline-offset:3px}
.wrap{width:min(calc(100% - 48px),var(--wrap));margin-inline:auto}
section{position:relative;padding:76px 0}
.section-white{background:var(--surface)}
.section-ivory{background:var(--bg)}
.section-cream{background:var(--bg-2)}
.skip-link{position:fixed;left:16px;top:-60px;z-index:1000;padding:10px 14px;background:var(--ink);color:white;border-radius:8px}
.skip-link:focus{top:14px;color:white}
.eyebrow{margin:0 0 10px;color:var(--yellow-dark);font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.section-head{max-width:760px;margin-bottom:28px}
.section-head h2{margin:0 0 10px;font-size:clamp(28px,3vw,46px);line-height:1.12;letter-spacing:-.035em}
.section-head p:last-child{margin:0;color:var(--text-2);max-width:700px}
h1,h2,h3,strong{font-weight:760}
h1{margin:0 0 20px;font-size:clamp(40px,5vw,72px);line-height:1.02;letter-spacing:-.045em}
h2,h3{letter-spacing:-.025em}
h3{line-height:1.3}
p{margin:0 0 18px}
.lede{font-size:clamp(18px,2vw,23px);line-height:1.7;color:var(--text-2);max-width:760px}
.lede-small{font-size:18px;color:var(--text-2)}
.caption,.micro-note,.micro-note-panel,figcaption{font-size:13px;color:var(--text-3);line-height:1.6}
.text-link{font-weight:700;color:var(--yellow-dark)}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 18px;border-radius:12px;border:1px solid var(--line-strong);font-weight:700;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.button:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.button.primary{background:var(--yellow);border-color:var(--yellow);color:var(--ink)}
.button.secondary{background:var(--surface);color:var(--ink)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.tag-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tag-row span,.tag-row a,.footer-tags span,.scenario-pills span{display:inline-flex;padding:5px 10px;border-radius:999px;background:var(--yellow-soft);border:1px solid rgba(181,140,32,.18);font-size:12px;color:var(--ink-2)}
.badge{display:inline-flex;padding:4px 9px;border-radius:999px;font-size:12px;font-weight:700}
.badge-gold{background:var(--yellow-soft);color:#7B5A0D}
.badge-sage{background:var(--sage-soft);color:#496244}
.badge-muted{background:#F1EEE5;color:var(--text-2)}
.badge-ink{background:var(--ink);color:white}

/* Inspiration + header */
.inspiration-strip{height:30px;background:var(--yellow);border-bottom:1px solid rgba(86,64,13,.12);font-size:12px}
.strip-inner{height:30px;display:flex;align-items:center;gap:10px;overflow:hidden}
.status-dot{width:7px;height:7px;border-radius:50%;background:var(--sage);box-shadow:0 0 0 3px rgba(113,134,107,.15);flex:none}
.strip-rotator{display:grid;flex:1;height:30px;overflow:hidden}
.strip-rotator span{grid-area:1/1;display:flex;align-items:center;opacity:0;transform:translateY(8px);transition:.35s ease}
.strip-rotator span.is-active{opacity:1;transform:none}
.strip-inner>a{font-weight:700;white-space:nowrap}
.site-header{position:sticky;top:0;z-index:90;background:rgba(251,250,244,.94);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);box-shadow:0 6px 20px rgba(93,78,39,.05)}
.header-inner{height:74px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:10px;min-width:165px}
.brand img{width:42px;height:42px;border-radius:12px;object-fit:cover}
.brand span{display:grid;line-height:1.2}
.brand strong{font-size:19px;letter-spacing:.04em}
.brand small{font-size:10px;color:var(--text-3);margin-top:4px}
.desktop-nav{display:flex;align-items:center;gap:4px;flex:1;justify-content:center}
.desktop-nav a{padding:9px 10px;border-radius:10px;font-size:14px;color:var(--ink-2);position:relative;white-space:nowrap}
.desktop-nav a.active{background:var(--yellow-soft);color:var(--ink);font-weight:700}
.desktop-nav a.active:after{content:"";position:absolute;left:30%;right:30%;bottom:3px;height:2px;background:var(--champagne);border-radius:2px}
.header-actions{display:flex;align-items:center;gap:9px;font-size:12px}
.header-actions>a,.icon-button,.menu-toggle{border:0;background:transparent;padding:8px 6px;cursor:pointer;white-space:nowrap}
.menu-toggle{display:none}
.mobile-menu{border-top:1px solid var(--line);background:var(--surface-raised);padding:24px 0 34px}
.mobile-menu-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.mobile-menu section{padding:0}
.mobile-menu h2{font-size:14px;margin:0 0 10px}
.mobile-menu a{display:block;padding:6px 0;color:var(--text-2);font-size:14px}
.search-overlay{position:fixed;inset:0;z-index:120;background:rgba(41,40,33,.46);backdrop-filter:blur(8px);padding:10vh 24px}
.search-panel{max-width:720px;margin:auto;background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-large);padding:38px;box-shadow:var(--shadow-strong);position:relative}
.search-panel h2{font-size:34px;margin:0 0 6px}
.search-panel>p{color:var(--text-2)}
.search-close{position:absolute;right:22px;top:20px;border:1px solid var(--line);background:white;border-radius:999px;padding:6px 12px;cursor:pointer}
.search-line,.inline-search>div,.search-page-form>div{display:flex;gap:8px}
.search-line input,.inline-search input,.search-page-form input{flex:1;min-width:0;border:1px solid var(--line-strong);background:white;border-radius:12px;padding:12px 14px}
.search-line button,.inline-search button,.search-page-form button{border:0;background:var(--yellow);border-radius:12px;padding:10px 18px;font-weight:700;cursor:pointer}

/* Hero systems */
.home-hero{padding-top:44px}
.hero-magazine{display:grid;grid-template-columns:5.3fr 4.1fr 2.6fr;gap:28px;align-items:stretch}
.hero-cover{margin:0;position:relative;background:var(--surface);padding:12px;border:1px solid var(--line);box-shadow:var(--shadow)}
.hero-cover img{width:100%;height:650px;aspect-ratio:4/5}
.hero-cover figcaption{padding:12px 6px 2px}
.hero-copy{padding:58px 12px 30px}
.author-line{display:flex;align-items:center;gap:12px;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.author-line div{display:grid}
.author-line small{color:var(--text-3)}
.avatar-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--cream);font-weight:800}
.hero-index{padding:32px 24px;background:var(--bg-2);border:1px solid var(--line);border-radius:0 var(--radius-large) var(--radius-large) 0}
.hero-index ol{list-style:none;margin:20px 0;padding:0;border-top:1px solid var(--line-strong)}
.hero-index li{border-bottom:1px solid var(--line-strong)}
.hero-index li a{display:flex;gap:12px;padding:13px 0;font-size:14px}
.hero-index li span{color:var(--yellow-dark);font-weight:800}
.hero-count{margin:26px 0;display:grid}
.hero-count strong{font-size:54px;line-height:1}
.hero-count span{color:var(--text-2);font-size:12px;margin-top:6px}
.page-intro,.category-hero,.ranking-hero,.search-page-hero{padding-top:54px}
.intro-grid,.ranking-hero-grid{display:grid;grid-template-columns:8fr 4fr;gap:54px;align-items:center}
.intro-grid>img{border-radius:var(--radius-card);aspect-ratio:3/2}
.news-focus-grid,.video-hero-grid,.shorts-hero-grid{display:grid;grid-template-columns:7fr 5fr;gap:26px;align-items:center}
.news-focus-grid>figure,.video-hero-grid>figure,.shorts-hero-grid>figure{margin:0}
.news-focus-grid>figure img,.video-hero-grid>figure img{aspect-ratio:7/5;border-radius:var(--radius-card)}
.news-focus-grid>div,.video-hero-grid>div{padding:20px}
.news-focus-grid>div{order:-1}
.news-focus-grid>figure{grid-row:1;grid-column:1}
.news-focus-grid>div{grid-row:1;grid-column:2}
.video-hero-grid{grid-template-columns:4.5fr 5.5fr 2fr}
.video-hero-grid>figure img{height:520px}
.video-hero-grid>aside,.shorts-hero-grid>aside{align-self:stretch;padding:28px 18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);display:flex;flex-direction:column;gap:10px}
.video-hero-grid>aside a,.shorts-hero-grid>aside span{padding:9px 0;border-bottom:1px solid var(--line)}
.shorts-hero-grid{grid-template-columns:5fr 4fr 3fr}
.shorts-hero-grid figure img{aspect-ratio:3/4;border-radius:var(--radius-card);max-height:620px;width:100%}
.learning-three{display:grid;grid-template-columns:2.2fr 7fr 2.8fr;gap:28px;align-items:start}
.course-menu,.exercise-card,.parameter-card,.rank-note,.source-note,.favorites-preview{background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-card);padding:24px;box-shadow:var(--shadow)}
.course-menu{display:grid;gap:7px;position:sticky;top:120px}
.course-menu a{padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.learning-three>div>img{border-radius:var(--radius-card);margin-top:28px;aspect-ratio:16/9;width:100%}
.theater-hero-grid{display:grid;grid-template-columns:5fr 5fr 2.4fr;gap:30px;align-items:center}
.theater-hero-grid figure{margin:0}
.theater-hero-grid figure img{border-radius:var(--radius-card);aspect-ratio:4/3}
.parameter-card dl{margin:0}
.parameter-card dl div{padding:10px 0;border-bottom:1px solid var(--line)}
.parameter-card dt{font-size:12px;color:var(--text-3)}
.parameter-card dd{margin:3px 0 0;font-weight:700}
.topic-hero-grid,.community-hero-grid,.discover-hero-grid,.product-hero-grid,.app-hero-grid,.about-grid,.contact-grid{display:grid;grid-template-columns:5fr 7fr;gap:46px;align-items:center}
.topic-hero-grid figure,.community-hero-grid figure,.discover-hero-grid figure,.about-grid figure,.contact-grid figure{margin:0}
.topic-hero-grid img,.community-hero-grid img,.discover-hero-grid img,.about-grid img,.contact-grid img{border-radius:var(--radius-card);aspect-ratio:4/3}
.product-hero-grid{grid-template-columns:4.5fr 7.5fr}
.browser-window{background:var(--surface);border:1px solid var(--line-strong);border-radius:24px;padding:14px;box-shadow:var(--shadow-strong)}
.browser-window:before{content:"●  ●  ●";display:block;color:var(--champagne);font-size:12px;letter-spacing:4px;padding:0 0 10px 4px}
.browser-window img{border-radius:14px;aspect-ratio:16/10}
.app-hero-grid{grid-template-columns:4.3fr 7.7fr}
.app-overview-stage{position:relative;min-height:600px}
.app-overview-stage>img:first-child{width:82%;margin-left:auto;border-radius:28px;box-shadow:var(--shadow-strong)}
.app-overview-stage>img:nth-child(2){position:absolute;width:32%;left:2%;bottom:0;border:10px solid white;border-radius:34px;box-shadow:var(--shadow-strong)}
.app-overview-stage>p{position:absolute;right:4%;bottom:3%;max-width:250px;background:var(--cream);padding:12px 15px;border-radius:12px;font-size:13px}
.detail-hero-grid{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:center}
.detail-hero-grid figure{margin:0}
.detail-hero-grid figure img{border-radius:var(--radius-card);aspect-ratio:3/2}
.detail-badges{display:flex;gap:8px;margin:14px 0}
.detail-meta{display:flex;flex-wrap:wrap;gap:9px 16px;color:var(--text-2);font-size:14px;margin:18px 0}
.breadcrumb{display:flex;gap:7px;flex-wrap:wrap;font-size:12px;color:var(--text-3);margin-bottom:18px}
.breadcrumb a:hover{color:var(--yellow-dark)}

/* Content layouts */
.metric-row{display:grid;grid-template-columns:repeat(8,1fr);border:1px solid var(--line-strong);background:var(--surface);border-radius:var(--radius-card);overflow:hidden}
.metric{padding:18px 12px;text-align:center;border-right:1px solid var(--line)}
.metric:last-child{border:0}
.metric strong{display:block;font-size:28px}
.metric span{font-size:12px;color:var(--text-2)}
.collage-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.collage-large{grid-column:span 6}
.collage-small{grid-column:span 3}
.video-card{height:100%;background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;transition:transform .2s ease,box-shadow .2s ease}
.video-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.video-card img{width:100%;aspect-ratio:16/9}
.video-card.compact img{aspect-ratio:4/3}
.video-card .card-body{padding:17px}
.video-card .card-meta{display:flex;justify-content:space-between;gap:10px;color:var(--text-3);font-size:12px}
.video-card h3{font-size:20px;margin:8px 0}
.video-card p{color:var(--text-2);font-size:14px;margin-bottom:14px}
.favorite-button,.reminder-button,.like-button{border:1px solid var(--line-strong);background:var(--surface);border-radius:999px;padding:6px 11px;font-size:12px;cursor:pointer;margin-top:12px}
.favorite-button.is-active,.reminder-button.is-active,.like-button.is-active{background:var(--sage-soft);border-color:rgba(113,134,107,.35);color:#496244}
.split-title{display:flex;justify-content:space-between;gap:20px;align-items:end}
.timeline-list{border-top:1px solid var(--line-strong)}
.timeline-item{display:grid;grid-template-columns:160px 1fr 120px;gap:28px;padding:20px 0;border-bottom:1px solid var(--line)}
.timeline-item.is-key{border-left:3px solid var(--champagne);padding-left:18px}
.timeline-item time,.timeline-item>strong{font-size:12px;color:var(--text-3)}
.timeline-item h3{margin:2px 0 6px}
.timeline-item p{margin:0;color:var(--text-2)}
.topic-band-grid{display:grid;grid-template-columns:5fr 7fr;gap:50px}
.topic-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.topic-mini{background:rgba(255,255,255,.58);border:1px solid var(--line-strong);padding:18px;border-radius:14px;display:grid;gap:8px}
.topic-mini span{font-weight:700}
.topic-mini small{color:var(--text-3)}
.masonry-grid{columns:4 270px;column-gap:18px}
.masonry-cell{break-inside:avoid;margin-bottom:18px}
.masonry-cell:nth-child(3n) .video-card img{aspect-ratio:4/5}
.masonry-cell:nth-child(4n) .video-card img{aspect-ratio:4/3}
.rail-section{overflow:hidden}
.rail-controls{display:flex;gap:8px}
.rail-control{width:42px;height:42px;border-radius:50%;background:var(--surface);border:1px solid var(--line-strong);cursor:pointer}
.rail-controls.centered{justify-content:center;margin-top:20px}
.film-rail,.app-rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;scrollbar-width:thin;overscroll-behavior-inline:contain}
.film-card{min-width:240px;width:240px;scroll-snap-align:start}
.film-card a{display:block;background:var(--surface);border:1px solid var(--line);padding:9px;border-radius:18px}
.film-card img{width:100%;aspect-ratio:3/4;border-radius:12px}
.film-card h3{font-size:17px;margin:9px 4px 6px}
.film-card p{font-size:13px;color:var(--text-2);margin:0 4px 8px}
.film-time{display:inline-flex;background:var(--ink);color:white;border-radius:999px;padding:3px 8px;font-size:11px;margin:9px 4px 0}
.offset-grid,.story-57,.guide-grid,.safety-grid,.privacy-grid,.interview-grid,.micro-doc-grid,.course-detail-grid,.sound-grid,.subtitle-grid,.review-grid,.export-grid,.role-grid,.rhythm-grid,.tag-layout,.cross-device-grid,.favorite-drawer-layout,.notification-grid,.device-grid,.article-layout,.search-product-grid{display:grid;gap:46px;align-items:center}
.offset-grid,.guide-grid,.safety-grid,.privacy-grid,.interview-grid,.micro-doc-grid{grid-template-columns:7fr 5fr}
.offset-grid figure,.story-57 figure,.guide-grid figure,.safety-grid figure,.privacy-grid figure,.micro-doc-grid figure{margin:0}
.offset-grid figure img,.story-57 figure img,.guide-grid figure img,.safety-grid figure img,.privacy-grid figure img,.micro-doc-grid figure img{border-radius:var(--radius-card)}
.story-list{display:grid;border-top:1px solid var(--line)}
.story-list>a{display:grid;grid-template-columns:70px 1fr;gap:14px;padding:16px 0;border-bottom:1px solid var(--line)}
.story-list h3{margin:0 0 5px}
.story-list p{margin:0;color:var(--text-2);font-size:14px}
.editorial-73{display:grid;grid-template-columns:7fr 3fr;gap:46px;align-items:start}
.side-poster{margin:0;position:sticky;top:120px}
.side-poster img{border-radius:var(--radius-card);aspect-ratio:3/4}
.line-card,.editor-row{display:grid;grid-template-columns:120px 1fr;gap:18px;padding:18px 0;border-top:1px solid var(--line)}
.line-card h3,.editor-row h3{margin:0 0 5px}
.line-card p,.editor-row p{margin:0;color:var(--text-2)}
.avatar-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
.avatar-track article{min-width:260px;scroll-snap-align:start;background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-card);padding:18px;display:grid;grid-template-columns:64px 1fr;gap:14px}
.avatar-track img{width:64px;height:64px;aspect-ratio:1;border-radius:50%}
.avatar-track h3{margin:2px 0}
.avatar-track span{font-size:11px;color:var(--yellow-dark)}
.avatar-track p{font-size:12px;color:var(--text-2);margin:0}
.series-grid{display:grid;grid-template-columns:7fr 5fr;gap:46px;align-items:center}
.series-grid figure{margin:0}
.series-grid img{border-radius:var(--radius-card);aspect-ratio:3/2}
.progress{height:7px;background:white;border-radius:999px;overflow:hidden;margin:20px 0 6px}
.progress span{display:block;height:100%;background:var(--champagne);border-radius:inherit}
.learning-48{display:grid;grid-template-columns:4fr 8fr;gap:54px}
.lesson-index{padding:30px;background:var(--ink);color:white;border-radius:var(--radius-card)}
.lesson-index>span{font-size:68px;color:var(--yellow)}
.lesson-index h3{font-size:28px}
.lesson-index p{color:#DAD7CD}
.lesson-index a{color:var(--cream);font-weight:700}
.practice-cards,.cards-3,.cards-4,.source-cards,.digest-cards,.role-cards,.device-cards,.setting-cards,.scenario-grid,.rule-grid,.process-cards,.theme-card-grid{display:grid;gap:16px}
.practice-cards,.cards-3,.digest-cards,.scenario-grid,.theme-card-grid{grid-template-columns:repeat(3,1fr)}
.cards-4,.source-cards,.rule-grid,.process-cards{grid-template-columns:repeat(4,1fr)}
.practice-cards article,.idea-card,.source-cards article,.digest-cards article,.role-cards article,.device-cards article,.setting-cards article,.scenario-grid article,.rule-grid article,.process-cards article,.theme-card-grid article,.feature-card{background:var(--surface-raised);border:1px solid var(--line);padding:20px;border-radius:var(--radius-card)}
.practice-cards strong{font-size:30px;color:var(--yellow-dark)}
.practice-cards span{display:block;font-weight:700}
.practice-cards p,.cards-3 p,.source-cards p,.digest-cards p,.scenario-grid p,.rule-grid p,.process-cards p,.theme-card-grid p{color:var(--text-2);font-size:14px;margin-bottom:0}
.zigzag-steps{max-width:1000px;margin:auto;display:grid;gap:14px}
.zigzag-steps article{width:74%;display:grid;grid-template-columns:90px 1fr;gap:18px;padding:22px;background:rgba(255,255,255,.62);border:1px solid var(--line);border-radius:var(--radius-card)}
.zigzag-steps article:nth-child(even){margin-left:auto}
.zigzag-steps>article>span{font-size:38px;color:var(--yellow-dark);font-weight:800}
.zigzag-steps h3{margin:0 0 5px}
.zigzag-steps p{margin:0;color:var(--text-2)}
.workbench-84{display:grid;grid-template-columns:8fr 4fr;gap:34px;align-items:start}
.workflow-row{display:grid;gap:10px}
.workflow-row>a{display:grid;grid-template-columns:60px 220px 1fr;gap:18px;padding:16px 0;border-top:1px solid var(--line)}
.workflow-row>a>span{font-size:26px;color:var(--yellow-dark);font-weight:800}
.workflow-row h3{margin:2px 0;font-size:16px}
.workflow-row p{margin:0;color:var(--text-2);font-size:13px}
.feature-check{list-style:none;padding:0;margin:18px 0;display:grid;gap:8px}
.feature-check li:before{content:"✓";display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--sage-soft);color:var(--sage);font-weight:800;margin-right:8px;font-size:11px}
.guide-dl{display:grid;gap:0;margin:0}
.guide-dl div{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:14px 0;border-top:1px solid var(--line)}
.guide-dl dt{font-weight:800;color:var(--yellow-dark)}
.guide-dl dd{margin:0;color:var(--text-2)}
.story-57{grid-template-columns:5fr 7fr}
.story-note{padding:15px 0;border-top:1px solid var(--line)}
.story-note span{font-size:11px;color:var(--text-3)}
.story-note h3{margin:3px 0}
.story-note p{color:var(--text-2);margin:0}
.vertical-timeline{list-style:none;margin:0;padding:0 0 0 160px;position:relative}
.vertical-timeline:before{content:"";position:absolute;left:128px;top:0;bottom:0;width:1px;background:var(--line-strong)}
.vertical-timeline li{position:relative;display:grid;grid-template-columns:1fr;min-height:92px;padding-bottom:26px}
.vertical-timeline li:before{content:"";position:absolute;left:-38px;top:10px;width:13px;height:13px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 5px var(--bg-2)}
.vertical-timeline li>span{position:absolute;right:calc(100% + 52px);top:5px;width:105px;text-align:right;color:var(--yellow-dark);font-size:12px;font-weight:700}
.vertical-timeline h3{margin:0 0 4px}
.vertical-timeline p{margin:0;color:var(--text-2)}
.ranking-layout{display:grid;grid-template-columns:9fr 3fr;gap:32px;align-items:start}
.rank-list{border-top:1px solid var(--line-strong)}
.rank-list>a{display:grid;grid-template-columns:58px 120px 1fr 90px;gap:16px;align-items:center;padding:13px 0;border-bottom:1px solid var(--line)}
.rank-list>a>strong{font-size:28px;color:var(--champagne)}
.rank-list img{width:120px;height:72px;border-radius:8px}
.rank-list h3{margin:0 0 3px;font-size:17px}
.rank-list p,.rank-list small{margin:0;color:var(--text-2);font-size:12px}
.heat-meter{font-size:12px;text-align:right}
.heat-meter i{display:block;width:var(--heat);max-width:100%;height:4px;background:var(--sage);border-radius:999px;margin-bottom:5px}
.rank-note{position:sticky;top:120px}
.rank-note h3{margin-top:0}
.rank-note a,.collaboration-grid aside>a,.parameter-card>a{display:block;padding:9px 0;border-bottom:1px solid var(--line);font-weight:700}
.tag-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.tag-wall.compact{margin-top:18px}
.tag-wall a{padding:14px;border:1px solid var(--line);background:var(--surface-raised);border-radius:12px;font-weight:700;font-size:14px}
.tag-wall span{display:block;color:var(--champagne);font-size:11px;margin-bottom:12px}
.calendar-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.calendar-grid article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-card);padding:18px}
.calendar-grid time{display:flex;justify-content:space-between;color:var(--yellow-dark);font-weight:800}
.calendar-grid time small{color:var(--text-3);font-weight:500}
.calendar-grid h3{font-size:17px;margin:14px 0 8px}
.calendar-grid p{font-size:13px;color:var(--text-2)}
.dialogue-grid{display:grid;grid-template-columns:7fr 5fr;gap:46px;align-items:start}
.dialogue-grid>figure{margin:0;position:sticky;top:120px}
.dialogue-grid>figure img{border-radius:var(--radius-card);aspect-ratio:4/5}
.comment-card{padding:18px 0;border-top:1px solid var(--line)}
.comment-card header{display:flex;justify-content:space-between;font-size:12px;color:var(--text-3)}
.comment-card p{margin:8px 0;color:var(--text-2)}
.annotation-grid{display:grid;grid-template-columns:6fr 6fr;gap:46px;align-items:center}
.annotation-grid figure{margin:0}
.annotation-grid img{border-radius:var(--radius-card);aspect-ratio:4/3}
.margin-notes{display:grid;gap:12px}
.margin-notes article{display:grid;grid-template-columns:70px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.margin-notes span{color:var(--yellow-dark);font-weight:800}
.margin-notes p{margin:0;color:var(--text-2)}
.product-stage{display:grid;grid-template-columns:5fr 7fr;gap:46px;align-items:center}
.product-stage.reverse{grid-template-columns:7fr 5fr}
.browser-stack{position:relative;padding-bottom:70px}
.browser-stack img{border-radius:var(--radius-card);box-shadow:var(--shadow)}
.browser-stack .browser-float{position:absolute;width:56%;right:-3%;bottom:0;border:8px solid white}
.browser-stack p{margin-top:10px}
.app-stage{display:grid;grid-template-columns:4fr 8fr;gap:38px;align-items:center}
.device-collage{position:relative;min-height:620px}
.app-overview{width:72%;border-radius:28px;box-shadow:var(--shadow-strong)}
.device-collage .screen{position:absolute;width:24%;border:7px solid white;border-radius:22px;box-shadow:var(--shadow)}
.device-collage .s1{left:52%;top:4%}.device-collage .s2{left:67%;top:18%}.device-collage .s3{left:44%;top:28%}
.history-grid,.collaboration-grid,.compare-grid{display:grid;grid-template-columns:5fr 7fr;gap:46px;align-items:start}
.history-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.history-cards article{padding:24px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface-raised)}
.principle-list{display:grid;gap:10px}
.principle-list article{display:grid;grid-template-columns:54px 1fr;gap:12px;padding:14px 0;border-top:1px solid var(--line)}
.principle-list strong{font-size:24px;color:var(--champagne)}
.principle-list h3{margin:0}
.principle-list p{margin:4px 0;color:var(--text-2)}
.collaboration-grid aside{background:rgba(255,255,255,.55);border:1px solid var(--line-strong);border-radius:var(--radius-card);padding:24px}
.discover-panel{display:grid;grid-template-columns:7fr 5fr;gap:44px;align-items:center;border:1px solid var(--line);border-radius:var(--radius-large);padding:20px;background:var(--surface-raised)}
.discover-panel figure{margin:0}.discover-panel img{border-radius:20px;aspect-ratio:3/2}
.faq-layout{display:grid;grid-template-columns:4fr 8fr;gap:48px;align-items:start}
.faq-list{border-top:1px solid var(--line-strong)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item h3{margin:0}
.faq-button{width:100%;display:flex;justify-content:space-between;gap:20px;text-align:left;padding:18px 0;border:0;background:transparent;font-weight:740;cursor:pointer}
.faq-button span{font-size:20px;color:var(--yellow-dark)}
.faq-answer{padding:0 30px 18px 0;color:var(--text-2)}
.faq-answer p{margin:0}

/* Channel-specific */
.focus-index{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin-top:24px;padding-top:14px;border-top:1px solid var(--line)}
.focus-index strong{grid-column:1/-1;margin-bottom:7px}
.focus-index a{padding:6px 0;font-size:13px;color:var(--text-2)}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.news-card{padding:20px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface-raised)}
.news-status{display:flex;justify-content:space-between;align-items:center}
.news-status time{font-size:11px;color:var(--text-3)}
.news-card h3{margin:14px 0 8px}
.news-card p{color:var(--text-2);font-size:14px}
.news-card small{color:var(--text-3)}
.filter-row{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:end}
.filter-links{display:flex;flex-wrap:wrap;gap:9px}
.filter-links a{padding:9px 13px;border-radius:999px;background:var(--surface);border:1px solid var(--line-strong);font-size:13px}
.digest-cards strong,.process-cards strong{font-size:30px;color:var(--champagne)}
.event-timeline{display:grid;gap:22px}
.event-timeline article{display:grid;grid-template-columns:4fr 8fr;gap:30px;padding:24px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface-raised)}
.event-timeline header h3{font-size:20px}.event-timeline header time{font-size:12px;color:var(--text-3)}
.event-timeline ol{margin:0;padding-left:20px}.event-timeline li{padding:6px 0}.event-timeline li span{font-size:12px;color:var(--yellow-dark);font-weight:700}.event-timeline li p{margin:0;color:var(--text-2)}
.response-grid{display:grid;grid-template-columns:8fr 4fr;gap:40px;align-items:start}
.response-card{padding:22px 0;border-top:1px solid var(--line)}
.response-card>span{font-size:11px;color:var(--yellow-dark)}
.response-card h3{margin:5px 0}.response-card p{color:var(--text-2)}
.source-grid{display:grid;grid-template-columns:4fr 8fr;gap:40px}
.verify-table{border:1px solid var(--line-strong);border-radius:var(--radius-card);overflow:hidden;background:var(--surface)}
.verify-row{display:grid;grid-template-columns:2.5fr 1.5fr 1.5fr 1fr;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);align-items:center;font-size:13px}
.verify-row:last-child{border:0}.verify-row.head{background:var(--cream);font-weight:800}.verify-row>span{color:var(--text-2)}
.topic-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.topic-cards article{background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-card);overflow:hidden;padding-bottom:18px}
.topic-cards img{width:100%;aspect-ratio:3/2}.topic-cards h3,.topic-cards p,.topic-cards>article>span{margin-left:17px;margin-right:17px}.topic-cards h3{font-size:17px;margin-top:12px}.topic-cards p{color:var(--text-2);font-size:13px}.topic-cards>article>span{display:block;margin-top:12px;color:var(--yellow-dark);font-size:11px}
.safety-rules{display:grid;grid-template-columns:8fr 4fr;gap:42px;align-items:start}.safety-rules>img{border-radius:var(--radius-card)}
.feature-spread{display:grid;grid-template-columns:8fr 4fr;gap:22px}.feature-notes{display:grid;gap:12px}.feature-notes article{padding:18px;border:1px solid var(--line);border-radius:var(--radius-card)}.feature-notes span{font-size:11px;color:var(--yellow-dark)}.feature-notes h3{margin:4px 0}.feature-notes p{font-size:13px;color:var(--text-2);margin:0}
.chapter-list{list-style:none;margin:20px 0;padding:0;border-top:1px solid var(--line)}.chapter-list li{display:flex;gap:16px;padding:10px 0;border-bottom:1px solid var(--line)}.chapter-list span{color:var(--yellow-dark);font-weight:800}
.quote-card{padding:24px;border-left:3px solid var(--champagne);background:var(--surface-raised);margin-bottom:16px}.quote-card p{font-size:20px;line-height:1.7}.quote-card span{color:var(--text-3);font-size:13px}
.duration-lanes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.duration-lanes article{padding:20px;border:1px solid var(--line);border-radius:var(--radius-card);background:rgba(255,255,255,.5)}.duration-lanes strong{font-size:21px}.duration-lanes p{color:var(--text-2);font-size:14px}.duration-lanes a{font-weight:700;color:var(--yellow-dark)}
.playlist-table{border-top:1px solid var(--line-strong)}.playlist-table>a{display:grid;grid-template-columns:60px 1fr 80px;gap:18px;padding:16px 0;border-bottom:1px solid var(--line);align-items:center}.playlist-table>a>strong{font-size:27px;color:var(--champagne)}.playlist-table h3{margin:0}.playlist-table p{margin:2px 0;color:var(--text-2)}.playlist-table>a>span{text-align:right;font-size:12px;color:var(--text-3)}
.practice-strip{display:grid;gap:10px}.practice-strip article{display:grid;grid-template-columns:80px 1fr;gap:18px;padding:20px;border:1px solid var(--line);border-radius:var(--radius-card);background:rgba(255,255,255,.55)}.practice-strip strong{font-size:34px;color:var(--champagne)}.practice-strip h3{margin:0}.practice-strip p{margin:5px 0;color:var(--text-2)}
.creator-strip{display:grid;grid-template-columns:4fr 8fr;gap:36px}
.path-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.path-steps article{padding:20px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface-raised)}.path-steps span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--cream);font-weight:800}.path-steps h3{font-size:17px}.path-steps p{font-size:13px;color:var(--text-2)}.path-steps a{font-size:13px;color:var(--yellow-dark);font-weight:700}
.course-detail-grid{grid-template-columns:5fr 4fr 3fr;align-items:start}.lecture-note{padding:26px;border-left:2px solid var(--champagne)}.lecture-note h3{margin-top:0}.lecture-note p,.lecture-note li{color:var(--text-2)}
.sound-grid{grid-template-columns:7fr 5fr}.sound-grid>img{border-radius:var(--radius-card);max-height:700px}.sound-meters article{display:grid;grid-template-columns:100px 1fr 2fr;gap:15px;align-items:center;padding:14px 0;border-top:1px solid var(--line)}.sound-meters article>span{height:6px;background:white;border-radius:999px;overflow:hidden}.sound-meters i{display:block;height:100%;background:var(--sage)}.sound-meters p{margin:0;font-size:13px;color:var(--text-2)}
.script-board{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.script-board article{padding:26px;background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--radius-card)}.script-board>article>span{color:var(--yellow-dark);font-weight:800}.script-board p{color:var(--text-2)}
.edit-workspace{display:grid;grid-template-columns:7fr 5fr;gap:34px;align-items:start}.creator-card{padding:20px;border:1px solid var(--line);border-radius:var(--radius-card)}.creator-card img{width:100%;aspect-ratio:1;border-radius:14px}.creator-card h3{margin-bottom:0}.creator-card>strong{font-size:12px;color:var(--yellow-dark)}
.learning-record{display:grid;grid-template-columns:4fr 8fr;gap:40px}.copyright-note{display:grid;grid-template-columns:7fr 5fr;gap:40px;align-items:start}.copyright-note>img{border-radius:var(--radius-card)}
.role-grid{grid-template-columns:7fr 5fr}.role-cards{grid-template-columns:1fr 1fr}.workspace-timeline{display:grid;gap:8px}.workspace-timeline article{display:grid;grid-template-columns:60px 1fr 90px;gap:15px;align-items:center;padding:16px;border:1px solid var(--line);background:rgba(255,255,255,.58);border-radius:14px}.workspace-timeline>article>span{font-size:24px;color:var(--champagne);font-weight:800}.workspace-timeline h3{margin:0}.workspace-timeline p{margin:4px 0;color:var(--text-2);font-size:13px}.workspace-timeline a{font-size:12px;font-weight:700;color:var(--yellow-dark)}
.before-after{display:grid;grid-template-columns:1fr 1fr;gap:14px}.before-after article{padding:22px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface-raised)}.before-after span{font-size:11px;color:var(--yellow-dark)}.fake-slider{height:6px;border-radius:999px;background:#EEE9DA;overflow:hidden;margin-bottom:16px}.fake-slider i{display:block;height:100%;background:var(--champagne)}.parameter-card label{display:flex;justify-content:space-between;font-size:12px;margin-bottom:5px}.parameter-card label span{color:var(--text-3)}
.subtitle-grid{grid-template-columns:4fr 8fr}.subtitle-grid>figure{margin:0}.subtitle-grid img{border-radius:var(--radius-card);max-height:680px}.subtitle-lines{display:grid;gap:12px}.subtitle-lines article{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--surface-raised)}.subtitle-lines strong{font-size:12px;color:var(--yellow-dark)}.subtitle-lines p{margin:6px 0 0}.rhythm-grid{grid-template-columns:7fr 5fr}.rhythm-bars{display:grid;gap:16px}.rhythm-bars span{position:relative;display:flex;align-items:center;width:var(--w);min-width:180px;height:44px;padding:0 14px;background:var(--yellow-soft);border-left:4px solid var(--champagne);font-weight:700}
.review-grid{grid-template-columns:7fr 5fr}.review-grid>img{border-radius:var(--radius-card)}.review-list{list-style:none;padding:0;margin:0}.review-list li{padding:14px 0;border-top:1px solid var(--line)}.review-list p{margin:4px 0;color:var(--text-2)}
.export-grid{grid-template-columns:8fr 4fr}.export-grid figure{margin:0}.export-grid figure img{border-radius:var(--radius-card);max-height:660px}.export-table{display:grid;grid-template-columns:1fr 1fr;gap:14px}.export-table>div{padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--surface-raised)}.export-table span{display:block;color:var(--yellow-dark);font-size:11px}.export-table strong{display:block;margin:5px 0}.export-table p{font-size:13px;color:var(--text-2);margin:0}
.topic-collage{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.topic-collage article{position:relative;border:1px solid var(--line);background:var(--surface-raised);padding:12px;border-radius:var(--radius-card)}.topic-wide{grid-column:span 7}.topic-portrait{grid-column:span 5}.topic-wide.small{grid-column:span 12;display:grid;grid-template-columns:5fr 7fr}.topic-collage img{width:100%;border-radius:12px}.topic-wide img{aspect-ratio:16/8}.topic-portrait img{aspect-ratio:3/4}.topic-collage span{display:block;color:var(--yellow-dark);font-size:11px;margin-top:10px}.topic-collage h2,.topic-collage h3{margin:6px 0}.topic-collage p{color:var(--text-2);font-size:14px}
.version-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.version-cards article{padding:22px;border-top:3px solid var(--champagne);background:rgba(255,255,255,.58)}.version-cards strong{font-size:28px;color:var(--yellow-dark)}.creator-method-grid{display:grid;grid-template-columns:4fr 8fr;gap:46px;align-items:center}.creator-method-grid figure{margin:0}.creator-method-grid img{border-radius:var(--radius-card)}
.rank-big-number{padding:32px;background:var(--cream);border-radius:var(--radius-large)}.rank-big-number strong{font-size:82px;line-height:1}.rank-big-number span{display:block;font-weight:700}.rank-big-number p{font-size:13px;color:var(--text-2);margin:14px 0 0}.trend-bars{display:grid;gap:14px}.trend-bars span{display:flex;justify-content:space-between;width:var(--w);min-width:180px;background:var(--yellow-soft);border-left:4px solid var(--champagne);padding:11px 14px;font-weight:700}.compare-grid{grid-template-columns:6fr 6fr}
.community-hero-grid{grid-template-columns:5fr 7fr}.category-wall{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.category-wall>a,.category-wall>article{padding:20px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface-raised)}.category-wall span{font-size:11px;color:var(--yellow-dark);text-transform:uppercase}.category-wall h3{margin:6px 0}.category-wall p{font-size:13px;color:var(--text-2);margin:0}
.theme-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}.theme-filter button{border:1px solid var(--line-strong);background:var(--surface);border-radius:999px;padding:7px 12px;cursor:pointer}.theme-filter button.active{background:var(--cream);border-color:var(--champagne)}.theme-card-grid article[hidden]{display:none}
.search-page-form{margin-top:30px;max-width:920px}.search-page-form label,.inline-search label{display:block;font-weight:700;margin-bottom:7px}.search-page-form select,.filter-bar select{border:1px solid var(--line-strong);background:white;border-radius:12px;padding:11px 12px}.search-group+.search-group{border-top:1px solid var(--line)}.empty-state{padding:60px 0;text-align:center;max-width:760px;margin:auto}.filter-bar{display:flex;gap:14px;align-items:end;flex-wrap:wrap}.filter-bar label{display:grid;gap:6px;font-size:12px}.filter-bar button{border:0;border-radius:12px;background:var(--yellow);padding:11px 18px;font-weight:700;cursor:pointer}.pagination{display:flex;justify-content:center;gap:7px;margin-top:30px}.pagination a,.pagination span{min-width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.pagination .current{background:var(--yellow);border-color:var(--yellow);font-weight:800}.pagination .disabled{opacity:.45}
.article-layout{grid-template-columns:8fr 4fr;align-items:start}.article-body>p{font-size:17px;line-height:1.9;color:var(--ink-2)}.source-note dl div{padding:10px 0;border-bottom:1px solid var(--line)}.source-note dt{font-size:11px;color:var(--text-3)}.source-note dd{margin:3px 0;font-weight:700}
.app-rail article{min-width:280px;width:280px;scroll-snap-align:start;background:var(--surface-raised);border:1px solid var(--line);border-radius:var(--radius-card);padding:12px}.app-rail img{width:100%;aspect-ratio:1/1.85;border-radius:14px}.app-rail h3{margin:12px 4px 6px}.app-rail p{font-size:13px;color:var(--text-2);margin:0 4px 8px}.feature-23{display:grid;grid-template-columns:4fr 8fr;gap:58px;align-items:center}.feature-23.reverse{grid-template-columns:8fr 4fr}.feature-23>div>img{max-height:650px;margin:auto;border-radius:28px;box-shadow:var(--shadow)}.feature-23>div>p:last-child{font-size:13px;color:var(--text-3)}
.triple-screens{display:grid;grid-template-columns:5fr 4fr 3fr;gap:34px;align-items:center}.triple-screens figure{margin:0}.triple-screens img{max-height:640px;margin:auto;border-radius:28px;box-shadow:var(--shadow)}.triple-screens aside{padding:24px;background:rgba(255,255,255,.55);border-radius:var(--radius-card);border:1px solid var(--line)}
.search-product-grid{grid-template-columns:7fr 5fr}.search-product-grid>img{max-height:680px;margin:auto;border-radius:28px;box-shadow:var(--shadow)}.micro-note-panel{margin-top:18px;text-align:right}.favorite-drawer-layout{grid-template-columns:5fr 7fr}.favorite-drawer-layout figure{margin:0}.favorite-drawer-layout img{max-height:660px;margin:auto;border-radius:28px;box-shadow:var(--shadow)}.notification-grid{grid-template-columns:6fr 6fr}.setting-cards{grid-template-columns:1fr 1fr}.device-grid{grid-template-columns:6fr 6fr}.device-cards{grid-template-columns:repeat(3,1fr)}
.about-grid,.contact-grid{grid-template-columns:5fr 7fr}.not-found{text-align:center;min-height:60vh;display:grid;align-items:center}.not-found .wrap{max-width:800px}

/* Footer */
.site-footer{background:var(--bg);border-top:1px solid var(--champagne);padding:54px 0 90px}
.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:38px}
.footer-grid section{padding:0}.footer-grid h2{font-size:14px;margin:0 0 12px}.footer-grid a{display:block;color:var(--text-2);font-size:13px;padding:4px 0}.footer-brand img{border-radius:14px}.footer-brand h2{font-size:26px;margin:10px 0 5px}.footer-brand p{max-width:440px;color:var(--text-2);font-size:13px}.footer-tags{display:flex;flex-wrap:wrap;gap:8px;padding:26px 0;border-top:1px solid var(--line);margin-top:34px}.footer-notice{display:flex;justify-content:space-between;gap:40px;padding-top:20px;border-top:1px solid var(--line);color:var(--text-3);font-size:12px}.footer-notice p{margin:0}.mobile-bottom{display:none}.back-to-top{position:fixed;right:20px;bottom:24px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);background:var(--surface);box-shadow:var(--shadow);z-index:70;opacity:0;pointer-events:none;transform:translateY(8px);transition:.2s ease}.back-to-top.show{opacity:1;pointer-events:auto;transform:none}
.favorites-drawer{position:fixed;inset:0;z-index:130;background:rgba(41,40,33,.44);display:flex;justify-content:flex-end}.favorites-drawer[hidden]{display:none}.favorites-drawer>div{width:min(430px,90vw);height:100%;background:var(--surface-raised);padding:28px;overflow:auto;box-shadow:var(--shadow-strong)}.favorites-drawer>div>button{border:1px solid var(--line);background:white;border-radius:999px;padding:6px 12px}.favorites-drawer ul{list-style:none;margin:20px 0;padding:0}.favorites-drawer li{padding:12px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px}.favorites-drawer li a{font-weight:700}.favorites-drawer li button{border:0;background:transparent;color:var(--yellow-dark);cursor:pointer}

@media (max-width:1200px){
 .wrap{width:min(calc(100% - 36px),var(--wrap))}.desktop-nav{gap:0}.desktop-nav a{font-size:12px;padding:8px 6px}.header-actions>a:nth-of-type(1),.header-actions>a:nth-of-type(2){display:none}
 .hero-magazine{grid-template-columns:5fr 4fr 3fr}.hero-cover img{height:560px}.metric-row{grid-template-columns:repeat(4,1fr)}.metric:nth-child(4){border-right:0}.metric:nth-child(-n+4){border-bottom:1px solid var(--line)}
 .tag-wall{grid-template-columns:repeat(4,1fr)}.cards-4,.topic-cards{grid-template-columns:repeat(2,1fr)}.calendar-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:992px){
 section{padding:62px 0}.desktop-nav{display:none}.menu-toggle{display:inline-flex}.header-actions{margin-left:auto}.header-actions>a{display:none!important}
 .hero-magazine{grid-template-columns:1fr 1fr}.hero-index{grid-column:1/-1;border-radius:var(--radius-card);display:grid;grid-template-columns:1fr 1fr}.hero-index ol{grid-column:1/-1}.hero-index .tag-row{align-content:start}.hero-cover img{height:500px}
 .collage-large{grid-column:span 12}.collage-small{grid-column:span 6}.masonry-grid{columns:2}.topic-band-grid,.offset-grid,.story-57,.guide-grid,.series-grid,.learning-48,.workbench-84,.dialogue-grid,.annotation-grid,.product-stage,.app-stage,.history-grid,.safety-grid,.discover-panel,.faq-layout,.editorial-73,.ranking-layout,.response-grid,.source-grid,.feature-spread,.creator-strip,.course-detail-grid,.sound-grid,.edit-workspace,.learning-record,.copyright-note,.role-grid,.rhythm-grid,.review-grid,.export-grid,.creator-method-grid,.compare-grid,.community-hero-grid,.discover-hero-grid,.product-hero-grid,.app-hero-grid,.detail-hero-grid,.article-layout,.feature-23,.feature-23.reverse,.search-product-grid,.favorite-drawer-layout,.notification-grid,.device-grid,.about-grid,.contact-grid,.filter-row,.privacy-grid,.interview-grid,.micro-doc-grid{grid-template-columns:1fr}
 .learning-three,.theater-hero-grid,.video-hero-grid,.shorts-hero-grid,.news-focus-grid{grid-template-columns:1fr 1fr}.learning-three>aside:last-child,.theater-hero-grid>aside,.video-hero-grid>aside,.shorts-hero-grid>aside{grid-column:1/-1}.course-menu{position:static}.news-focus-grid>figure,.news-focus-grid>div{grid-column:auto;grid-row:auto}.side-poster,.rank-note,.dialogue-grid>figure{position:static}.side-poster img{max-height:520px}.cards-3,.practice-cards,.scenario-grid{grid-template-columns:repeat(2,1fr)}.path-steps{grid-template-columns:repeat(3,1fr)}.duration-lanes{grid-template-columns:repeat(2,1fr)}.topic-collage .topic-wide,.topic-collage .topic-portrait{grid-column:span 6}.topic-wide.small{grid-column:1/-1}.category-wall{grid-template-columns:repeat(2,1fr)}.topic-cards{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:2fr 1fr 1fr}.footer-grid section:last-child{grid-column:2}.app-overview-stage{min-height:500px}.device-collage{min-height:520px}
}
@media (max-width:768px){
 body{padding-bottom:66px}.wrap{width:min(calc(100% - 28px),var(--wrap))}.inspiration-strip{height:30px}.strip-inner>a{display:none}.header-inner{height:66px}.brand small{display:none}.brand{min-width:auto}.brand img{width:38px;height:38px}.header-actions .icon-button{display:inline-flex}.header-actions{gap:3px}
 .mobile-menu-grid{grid-template-columns:1fr 1fr}.search-overlay{padding:7vh 14px}.search-panel{padding:28px 20px}.search-line{flex-direction:column}
 section{padding:52px 0}h1{font-size:42px}.section-head h2{font-size:32px}.lede{font-size:17px}.hero-magazine{display:flex;flex-direction:column}.hero-copy{order:-1;padding:12px 0}.hero-cover img{height:auto;aspect-ratio:4/5}.hero-index{display:block}.hero-index ol{display:grid;grid-template-columns:1fr 1fr}.metric-row{grid-template-columns:repeat(2,1fr)}.metric:nth-child(2n){border-right:0}.metric:nth-child(-n+6){border-bottom:1px solid var(--line)}
 .collage-small{grid-column:span 12}.masonry-grid{columns:1}.timeline-item{grid-template-columns:1fr;gap:5px}.timeline-item>strong{justify-self:start}.topic-mini-grid{grid-template-columns:1fr}.film-card{min-width:210px;width:210px}.avatar-track article{min-width:235px}.workflow-row>a{grid-template-columns:42px 1fr}.workflow-row p{grid-column:2}.zigzag-steps article{width:100%}.vertical-timeline{padding-left:42px}.vertical-timeline:before{left:12px}.vertical-timeline li:before{left:-36px}.vertical-timeline li>span{position:static;width:auto;text-align:left;margin-bottom:4px}.rank-list>a{grid-template-columns:42px 82px 1fr}.rank-list img{width:82px;height:54px}.rank-list>a>span{grid-column:3;text-align:left}.tag-wall{grid-template-columns:repeat(2,1fr)}.calendar-grid{grid-template-columns:1fr 1fr}.history-cards{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid section:last-child{grid-column:auto}.footer-brand{grid-column:1/-1}.footer-notice{display:grid;gap:8px}.mobile-bottom{position:fixed;z-index:80;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,1fr);background:rgba(255,253,247,.97);border-top:1px solid var(--line-strong);padding:7px max(8px,env(safe-area-inset-right)) calc(7px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));box-shadow:0 -8px 24px rgba(93,78,39,.08)}.mobile-bottom a,.mobile-bottom button{border:0;background:transparent;text-align:center;font-size:11px;padding:7px 2px}.back-to-top{bottom:78px}
 .news-grid{grid-template-columns:1fr 1fr}.event-timeline article{grid-template-columns:1fr}.verify-row{grid-template-columns:1fr 1fr}.verify-row.head{display:none}.topic-cards{grid-template-columns:1fr 1fr}.duration-lanes{grid-template-columns:1fr 1fr}.practice-strip article{grid-template-columns:55px 1fr}.path-steps{grid-template-columns:1fr 1fr}.sound-meters article{grid-template-columns:90px 1fr}.sound-meters article p{grid-column:1/-1}.script-board,.version-cards,.export-table{grid-template-columns:1fr 1fr}.before-after{grid-template-columns:1fr}.topic-collage{display:grid;grid-template-columns:1fr}.topic-collage .topic-wide,.topic-collage .topic-portrait,.topic-wide.small{grid-column:auto}.topic-wide.small{display:block}.category-wall{grid-template-columns:1fr 1fr}.intro-grid,.ranking-hero-grid{grid-template-columns:1fr}.learning-three,.theater-hero-grid,.video-hero-grid,.shorts-hero-grid,.news-focus-grid{grid-template-columns:1fr}.app-overview-stage{min-height:430px}.app-overview-stage>img:first-child{width:86%}.app-overview-stage>img:nth-child(2){width:34%}.device-collage{min-height:430px}.device-collage .screen{width:28%}.triple-screens{grid-template-columns:1fr 1fr}.triple-screens>div:first-child{grid-column:1/-1}.device-cards{grid-template-columns:1fr 1fr}.source-cards,.rule-grid,.process-cards{grid-template-columns:1fr 1fr}.theme-card-grid{grid-template-columns:1fr}.search-page-form>div{flex-wrap:wrap}.search-page-form input{flex-basis:100%}
}
@media (max-width:520px){
 .wrap{width:min(calc(100% - 22px),var(--wrap))}.brand strong{font-size:17px}.header-actions .icon-button{font-size:11px}.menu-toggle{font-size:11px}h1{font-size:36px}.section-head h2{font-size:29px}.hero-index ol{grid-template-columns:1fr}.hero-actions{display:grid}.button{width:100%}.metric-row{grid-template-columns:1fr 1fr}.topic-cards,.cards-3,.cards-4,.practice-cards,.calendar-grid,.news-grid,.script-board,.version-cards,.export-table,.category-wall,.source-cards,.rule-grid,.process-cards,.device-cards,.role-cards,.scenario-grid{grid-template-columns:1fr}.tag-wall{grid-template-columns:1fr 1fr}.path-steps{grid-template-columns:1fr}.duration-lanes{grid-template-columns:1fr}.line-card,.editor-row{grid-template-columns:1fr}.guide-dl div{grid-template-columns:1fr}.rank-list>a{grid-template-columns:38px 1fr}.rank-list img{display:none}.rank-list>a>span{grid-column:2}.topic-wide.small{display:block}.app-overview-stage{min-height:340px}.device-collage{min-height:350px}.triple-screens{grid-template-columns:1fr}.triple-screens>div:first-child{grid-column:auto}.search-page-form select,.search-page-form button{flex:1}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.mobile-menu-grid{grid-template-columns:1fr 1fr}.faq-layout{gap:10px}.faq-button{font-size:15px}.filter-bar{display:grid}.filter-bar label{width:100%}.filter-bar select{width:100%}.workspace-timeline article{grid-template-columns:42px 1fr}.workspace-timeline a{grid-column:2}.verify-row{grid-template-columns:1fr}.device-collage .screen{width:30%}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}