@charset "UTF-8";

:root{
 --black:#17191D;
 --black-2:#1E2126;
 --black-3:#262A30;
 --graphite:#31363D;
 --smoke:#424850;

 --bg:#F1F1EF;
 --bg-2:#E9E9E6;
 --bg-3:#F7F7F5;
 --surface:#FFFFFF;
 --surface-dark:#202329;
 --surface-dark-2:#292D34;

 --gold:#C6A15B;
 --gold-2:#DEC382;
 --gold-soft:#F3E9D3;
 --wine:#7A2638;
 --wine-2:#96344A;
 --blue-gray:#65798A;
 --green:#66816F;

 --text:#202227;
 --text-2:#555B63;
 --text-3:#8A9097;
 --text-light:#F4F4F1;
 --text-light-2:#C8CBD0;

 --line:rgba(32,34,39,.10);
 --line-dark:rgba(255,255,255,.08);
 --line-gold:rgba(198,161,91,.32);

 --shadow:0 6px 24px rgba(18,20,24,.10);
 --shadow-dark:0 16px 40px rgba(0,0,0,.24);

 --radius:10px;
 --radius-card:14px;
 --radius-large:20px;
 --wrap:1320px;
}

*{
 box-sizing:border-box;
}

html{
 scroll-behavior:smooth;
}

body{
 margin:0;
 background:var(--bg);
 color:var(--text);
 font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
 line-height:1.68;
 overflow-x:hidden;
}

body.search-open,
body.drawer-open{
 overflow:hidden;
}

a{
 color:inherit;
 text-decoration:none;
}

a:hover{
 color:var(--wine);
}

img{
 display:block;
 max-width:100%;
}

button,
input{
 font:inherit;
}

.wrap{
 width:min(calc(100% - 40px),var(--wrap));
 margin:0 auto;
}

.sr-only{
 position:absolute;
 width:1px;
 height:1px;
 padding:0;
 margin:-1px;
 overflow:hidden;
 clip:rect(0,0,0,0);
 white-space:nowrap;
 border:0;
}

.skip-link{
 position:fixed;
 left:16px;
 top:-60px;
 z-index:9999;
 background:var(--black);
 color:white;
 padding:10px 16px;
 border-radius:8px;
}

.skip-link:focus{
 top:10px;
}

.fineprint{
 font-size:13px;
 color:var(--text-3);
}

.brief-bar{
 height:30px;
 background:var(--black);
 color:var(--text-light);
 font-size:12px;
 letter-spacing:.02em;
}

.brief-bar .wrap{
 height:100%;
 display:flex;
 align-items:center;
 gap:26px;
 white-space:nowrap;
 overflow:hidden;
}

.brief-bar strong{
 color:var(--gold-2);
 letter-spacing:.12em;
}

.site-header{
 position:sticky;
 top:0;
 z-index:300;
 background:rgba(241,241,239,.94);
 backdrop-filter:blur(16px);
 border-bottom:1px solid var(--line);
 transition:.2s;
}

.site-header.scrolled{
 background:rgba(255,255,255,.97);
 box-shadow:0 8px 28px rgba(18,20,24,.05);
}

.header-inner{
 height:68px;
 display:flex;
 align-items:center;
 gap:24px;
}

.brand{
 display:flex;
 align-items:center;
 gap:10px;
 flex:0 0 auto;
}

.brand img{
 width:42px;
 height:42px;
 object-fit:contain;
}

.brand span{
 display:flex;
 flex-direction:column;
 line-height:1.2;
}

.brand b{
 font-size:19px;
 letter-spacing:.08em;
}

.brand small{
 font-size:10px;
 color:var(--text-3);
 margin-top:4px;
 letter-spacing:.06em;
}

.main-nav{
 display:flex;
 gap:20px;
 align-self:stretch;
 align-items:center;
 margin-left:auto;
}

.main-nav a{
 position:relative;
 font-size:14px;
 color:var(--text-2);
 white-space:nowrap;
}

.main-nav a:hover,
.main-nav a.active{
 color:var(--black);
}

.main-nav a.active:after{
 content:"";
 position:absolute;
 left:25%;
 right:25%;
 height:2px;
 bottom:-24px;
 background:var(--gold);
}

.header-actions{
 display:flex;
 align-items:center;
 gap:6px;
}

.icon-action,
.menu-toggle{
 height:40px;
 border:0;
 background:transparent;
 border-radius:9px;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:5px;
 color:var(--text-2);
 cursor:pointer;
 padding:0 8px;
}

.icon-action b{
 font-size:11px;
 font-weight:500;
}

.icon-action span{
 font-size:17px;
}

.icon-action:hover,
.menu-toggle:hover{
 background:white;
 color:var(--black);
}

.menu-toggle{
 width:40px;
 flex-direction:column;
 gap:4px;
}

.menu-toggle span{
 width:18px;
 height:1px;
 background:var(--black);
 display:block;
}

.drawer[hidden]{
 display:none!important;
}

.drawer{
 position:fixed;
 inset:0;
 z-index:600;
 background:rgba(23,25,29,.42);
 display:flex;
 justify-content:flex-end;
}

.drawer-panel{
 width:min(390px,92vw);
 height:100%;
 padding:28px;
 background:var(--surface);
 box-shadow:var(--shadow-dark);
 overflow:auto;
}

.drawer-close{
 float:right;
 border:0;
 background:var(--bg-2);
 width:38px;
 height:38px;
 border-radius:50%;
 font-size:22px;
 cursor:pointer;
}

.drawer-brand{
 font-size:26px;
 font-weight:800;
 margin:24px 0 30px;
}

.drawer-brand small{
 display:block;
 color:var(--gold);
 font-size:11px;
 letter-spacing:.12em;
}

.drawer nav{
 display:grid;
 grid-template-columns:1fr 1fr;
 border-top:1px solid var(--line);
}

.drawer nav a{
 padding:16px 5px;
 border-bottom:1px solid var(--line);
 font-weight:600;
}

.search-modal{
 display:none;
 position:fixed;
 inset:0;
 z-index:700;
 background:rgba(23,25,29,.55);
 align-items:flex-start;
 justify-content:center;
 padding:12vh 20px 30px;
}

.search-modal.is-open{
 display:flex;
}

.search-modal[hidden]{
 display:none!important;
}

.search-dialog{
 position:relative;
 width:min(780px,100%);
 background:var(--surface);
 border-radius:var(--radius-large);
 padding:40px;
 box-shadow:var(--shadow-dark);
 border-top:3px solid var(--gold);
}

.search-close{
 position:absolute;
 right:22px;
 top:20px;
 width:40px;
 height:40px;
 border:0;
 background:var(--bg);
 border-radius:50%;
 font-size:23px;
 cursor:pointer;
}

.search-dialog h2{
 font-size:34px;
 margin:4px 0 22px;
}

.search-form label{
 display:block;
 font-size:13px;
 color:var(--text-2);
 margin-bottom:7px;
}

.search-form>div{
 display:flex;
 border:1px solid var(--line);
 border-radius:12px;
 overflow:hidden;
 background:white;
}

.search-form input{
 flex:1;
 border:0;
 padding:16px 18px;
 outline:0;
 min-width:0;
}

.search-form>div:focus-within{
 border-color:var(--gold);
 box-shadow:0 0 0 3px rgba(198,161,91,.12);
}

.search-form button{
 border:0;
 background:var(--black);
 color:white;
 padding:0 22px;
 cursor:pointer;
}

.search-form button:hover{
 background:var(--gold);
 color:var(--black);
}

.search-suggestions{
 display:flex;
 gap:10px;
 align-items:center;
 margin-top:20px;
 flex-wrap:wrap;
}

.search-suggestions span{
 font-size:12px;
 color:var(--text-3);
}

.search-suggestions a{
 font-size:13px;
 padding:7px 11px;
 border:1px solid var(--line);
 border-radius:30px;
 background:var(--bg-3);
}

.section{
 padding:64px 0;
}

.section:nth-of-type(even){
 background:var(--bg-3);
}

.section-head{
 display:flex;
 justify-content:space-between;
 align-items:flex-end;
 gap:30px;
 margin-bottom:28px;
}

.section-head>div{
 max-width:860px;
}

.section-head h2{
 font-family:Georgia,"Songti SC",serif;
 font-size:clamp(26px,3vw,40px);
 line-height:1.2;
 margin:5px 0 8px;
 letter-spacing:-.02em;
}

.section-head p{
 margin:0;
 color:var(--text-2);
 max-width:760px;
}

.eyebrow{
 display:inline-block;
 color:var(--wine);
 font-size:11px;
 font-weight:800;
 letter-spacing:.14em;
 text-transform:uppercase;
}

.text-link{
 font-size:13px;
 font-weight:700;
 border-bottom:1px solid var(--gold);
 padding-bottom:3px;
 white-space:nowrap;
}

.page-hero{
 padding:52px 0 58px;
 background:linear-gradient(135deg,#F4F4F1 0%,#E9E9E6 58%,#D9D8D3 100%);
}

.page-hero-grid{
 display:grid;
 grid-template-columns:minmax(0,1.3fr) minmax(320px,.7fr);
 gap:48px;
 align-items:center;
}

.breadcrumb{
 display:flex;
 gap:8px;
 color:var(--text-3);
 font-size:12px;
 margin-bottom:26px;
}

.breadcrumb a{
 color:var(--text-2);
}

.page-hero h1{
 font-family:Georgia,"Songti SC",serif;
 font-size:clamp(40px,5vw,70px);
 line-height:1.05;
 margin:10px 0 18px;
 letter-spacing:-.045em;
}

.lead{
 font-size:18px;
 color:var(--text-2);
 max-width:720px;
}

.hero-actions{
 display:flex;
 gap:10px;
 flex-wrap:wrap;
 margin-top:26px;
}

.btn{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 min-height:44px;
 padding:0 18px;
 border-radius:8px;
 font-size:13px;
 font-weight:700;
 transition:.18s;
}

.btn.primary{
 background:var(--black);
 color:white;
}

.btn.primary:hover{
 background:var(--gold);
 color:var(--black);
}

.btn.secondary{
 background:white;
 border:1px solid var(--line-gold);
}

.hero-note{
 background:var(--surface-dark);
 color:var(--text-light);
 border-radius:var(--radius-large);
 padding:34px;
 box-shadow:var(--shadow-dark);
 border-top:1px solid var(--line-gold);
}

.hero-note span{
 color:var(--gold-2);
 font-size:11px;
 letter-spacing:.14em;
}

.hero-note strong{
 display:block;
 font-family:Georgia,"Songti SC",serif;
 font-size:32px;
 margin:7px 0 12px;
}

.hero-note p{
 color:var(--text-light-2);
 margin:0;
}

.media{
 margin:0;
}

.media img{
 width:100%;
 aspect-ratio:var(--ratio);
 object-fit:cover;
 border-radius:var(--radius-card);
 background:var(--bg-2);
}

.media figcaption{
 font-size:12px;
 line-height:1.55;
 color:var(--text-3);
 margin-top:8px;
}

.page-hero-media img{
 box-shadow:var(--shadow);
 border:1px solid rgba(255,255,255,.8);
}

.home-hero{
 padding:58px 0 66px;
 background:linear-gradient(135deg,#F4F4F1 0%,#E9E9E6 58%,#D9D8D3 100%);
}

.hero-grid{
 display:grid;
 grid-template-columns:1.45fr 1fr;
 gap:46px;
 align-items:center;
}

.hero-copy .eyebrow{
 color:var(--gold);
 background:var(--black);
 padding:6px 9px;
 border-radius:4px;
}

.hero-copy h1{
 font-family:Georgia,"Songti SC",serif;
 font-size:clamp(44px,6vw,78px);
 line-height:1.04;
 letter-spacing:-.055em;
 margin:18px 0 18px;
 max-width:800px;
}

.hero-copy .lead{
 font-size:18px;
 max-width:680px;
}

.hero-status{
 display:flex;
 gap:10px;
 align-items:center;
 margin-top:20px;
 flex-wrap:wrap;
}

.hero-status small{
 color:var(--text-3);
}

.hero-story{
 margin-top:28px;
 padding-top:20px;
 border-top:1px solid var(--line);
}

.hero-story h2{
 font-size:20px;
 margin:0 0 7px;
}

.hero-story p{
 margin:0;
 color:var(--text-2);
}

.hero-side{
 position:relative;
}

.hero-side .media img{
 aspect-ratio:4/5;
}

.hero-overlay{
 position:absolute;
 left:22px;
 right:22px;
 bottom:48px;
 background:rgba(23,25,29,.88);
 color:white;
 padding:20px;
 border-radius:12px;
 backdrop-filter:blur(10px);
}

.hero-overlay span{
 color:var(--gold-2);
 font-size:11px;
}

.hero-overlay strong{
 display:block;
 font-size:19px;
 margin:5px 0;
}

.hero-overlay p{
 margin:0;
 color:var(--text-light-2);
 font-size:13px;
}

.status{
 display:inline-flex;
 align-items:center;
 min-height:24px;
 padding:3px 8px;
 border-radius:5px;
 font-size:11px;
 font-weight:700;
 white-space:nowrap;
}

.status-focus{
 background:var(--black);
 color:var(--gold-2);
}

.status-hot{
 background:#F4E4E7;
 color:var(--wine);
}

.status-response{
 background:#E6EDF1;
 color:#4A6475;
}

.status-reverse{
 background:var(--gold-soft);
 color:#705823;
}

.status-pending{
 background:#F3E9D8;
 color:#856D2E;
}

.status-partial{
 background:#ECE8DC;
 color:#6D6144;
}

.status-clear{
 background:#E5ECE7;
 color:#4D6957;
}

.status-new{
 background:#EEE7E9;
 color:var(--wine);
}

.status-neutral{
 background:var(--bg-2);
 color:var(--text-2);
}

.radar{
 display:flex;
 flex-wrap:wrap;
 gap:11px;
}

.radar-chip{
 display:flex;
 align-items:center;
 gap:9px;
 background:white;
 border:1px solid var(--line);
 padding:10px 14px;
 border-radius:999px;
 font-size:13px;
}

.radar-chip i{
 width:7px;
 height:7px;
 border-radius:50%;
 background:var(--gold);
}

.radar-chip.hot i{
 background:var(--wine);
}

.radar-chip.response i{
 background:var(--blue-gray);
}

.radar-chip.clear i{
 background:var(--green);
}

.radar-chip span{
 color:var(--text-3);
}

.rank-list{
 list-style:none;
 margin:0;
 padding:0;
 border-top:1px solid var(--line);
}

.rank-list li{
 display:grid;
 grid-template-columns:70px minmax(0,1fr) 120px;
 gap:22px;
 align-items:center;
 padding:20px 0;
 border-bottom:1px solid var(--line);
}

.rank-no{
 font-family:Georgia,serif;
 font-size:31px;
 color:var(--text-3);
 text-align:center;
}

.rank-list li:nth-child(1) .rank-no{
 color:var(--gold);
}

.rank-list li:nth-child(2) .rank-no{
 color:var(--gold-2);
}

.rank-list li:nth-child(3) .rank-no{
 color:#A68A54;
}

.rank-main h3{
 font-size:18px;
 line-height:1.35;
 margin:4px 0 5px;
}

.rank-main p{
 font-size:13px;
 color:var(--text-2);
 margin:0;
 display:-webkit-box;
 -webkit-line-clamp:2;
 -webkit-box-orient:vertical;
 overflow:hidden;
}

.event-meta{
 display:flex;
 gap:10px;
 font-size:11px;
 color:var(--text-3);
}

.rank-side{
 display:grid;
 grid-template-columns:auto auto;
 gap:4px 10px;
 justify-content:end;
 align-items:center;
}

.rank-side strong{
 font-family:Georgia,serif;
 font-size:24px;
}

.rank-side .status{
 grid-column:1/-1;
}

.card-grid{
 display:grid;
 grid-template-columns:repeat(4,minmax(0,1fr));
 gap:18px;
}

.card-grid.asym{
 grid-template-columns:1.25fr 1fr 1fr;
}

.card-grid.asym .featured{
 grid-row:span 2;
}

.event-card{
 background:white;
 border:1px solid var(--line);
 border-radius:var(--radius-card);
 padding:20px;
 box-shadow:0 3px 14px rgba(18,20,24,.03);
 display:flex;
 flex-direction:column;
 min-height:250px;
}

.event-card.featured{
 background:var(--surface-dark);
 color:white;
 border-color:transparent;
 box-shadow:var(--shadow-dark);
}

.event-card h3{
 font-family:Georgia,"Songti SC",serif;
 font-size:20px;
 line-height:1.35;
 margin:12px 0 10px;
}

.event-card p{
 font-size:13px;
 color:var(--text-2);
 margin:0 0 20px;
}

.event-card.featured p,
.event-card.featured .event-meta{
 color:var(--text-light-2);
}

.event-foot{
 display:flex;
 justify-content:space-between;
 align-items:center;
 gap:10px;
 margin-top:auto;
 font-size:11px;
 color:var(--text-3);
 flex-wrap:wrap;
}

.favorite-button{
 border:1px solid var(--line);
 background:transparent;
 border-radius:20px;
 padding:4px 8px;
 font-size:10px;
 cursor:pointer;
}

.favorite-button.saved{
 border-color:var(--gold);
 background:var(--gold-soft);
 color:#6E5522;
}

.event-card.editorial{
 border-radius:0;
 border:0;
 border-top:2px solid var(--black);
 box-shadow:none;
 background:transparent;
 padding:16px 0;
}

.event-card.plain{
 min-height:0;
 margin-bottom:14px;
}

.flash-stream,
.stack-list,
.archive-list{
 border-top:1px solid var(--line);
}

.mini-event{
 display:grid;
 grid-template-columns:minmax(0,1fr) 100px;
 gap:18px;
 padding:18px 0;
 border-bottom:1px solid var(--line);
 align-items:start;
}

.mini-event>div{
 display:grid;
 grid-template-columns:auto 1fr;
 gap:8px 14px;
 align-items:start;
}

.mini-event .status{
 grid-row:1/3;
}

.mini-event h3{
 margin:0;
 font-size:17px;
 line-height:1.35;
}

.mini-event p{
 grid-column:2;
 margin:0;
 color:var(--text-2);
 font-size:13px;
}

.mini-event time{
 font-size:11px;
 color:var(--text-3);
 text-align:right;
}

.magazine .mini-event:nth-child(2) .status,
.magazine .mini-event:nth-child(5) .status{
 box-shadow:inset 3px 0 0 var(--wine);
}

.timeline{
 position:relative;
 margin-left:12px;
}

.timeline:before{
 content:"";
 position:absolute;
 left:84px;
 top:10px;
 bottom:10px;
 width:1px;
 background:linear-gradient(var(--gold),var(--line),var(--gold));
}

.timeline-node{
 display:grid;
 grid-template-columns:70px 30px minmax(0,1fr);
 position:relative;
 gap:0 16px;
 margin:0 0 26px;
}

.node-mark{
 grid-column:2;
 width:11px;
 height:11px;
 border:2px solid var(--gold);
 background:var(--bg-3);
 border-radius:50%;
 margin:8px 0 0 10px;
 z-index:1;
}

.node-time{
 grid-column:1;
 grid-row:1;
 font-size:11px;
 color:var(--text-3);
 padding-top:4px;
 text-align:right;
}

.node-body{
 grid-column:3;
 grid-row:1/3;
 background:white;
 border:1px solid var(--line);
 border-radius:12px;
 padding:16px 18px;
}

.node-body h3{
 margin:7px 0 4px;
}

.node-body p{
 margin:0 0 7px;
 color:var(--text-2);
 font-size:13px;
}

.node-body a{
 font-size:12px;
 border-bottom:1px solid var(--gold);
}

.media-split,
.split-feature,
.archive-highlight{
 display:grid;
 grid-template-columns:1fr 1.2fr;
 gap:30px;
 align-items:center;
}

.media-split.reverse{
 grid-template-columns:1.2fr 1fr;
}

.split-feature{
 align-items:stretch;
}

.split-feature>.media img{
 height:100%;
 min-height:460px;
}

.archive-highlight{
 background:var(--surface-dark);
 padding:24px;
 border-radius:var(--radius-large);
 color:white;
}

.archive-highlight p{
 color:var(--text-light-2);
}

.archive-highlight .media figcaption{
 color:var(--text-light-2);
}

.people-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:18px;
}

.person-card{
 background:white;
 border:1px solid var(--line);
 border-radius:var(--radius-card);
 padding:20px;
 display:grid;
 grid-template-columns:54px 1fr;
 gap:14px;
}

.avatar-letter{
 width:54px;
 height:54px;
 border-radius:50%;
 background:var(--black);
 color:var(--gold-2);
 display:flex;
 align-items:center;
 justify-content:center;
 font-family:Georgia,serif;
 font-size:22px;
}

.person-card h3{
 font-size:20px;
 margin:3px 0;
}

.person-card p{
 font-size:13px;
 color:var(--text-2);
 margin:4px 0;
}

.person-card .focus{
 color:var(--text);
 font-weight:600;
}

.person-card a{
 font-size:12px;
 border-bottom:1px solid var(--gold);
}

.works-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:18px;
}

.work-card{
 position:relative;
 background:#E7E7E3;
 border-radius:var(--radius-card);
 padding:24px;
 overflow:hidden;
 border:1px solid rgba(32,34,39,.06);
}

.work-no{
 position:absolute;
 right:-2px;
 top:-15px;
 font-family:Georgia,serif;
 font-size:64px;
 color:rgba(32,34,39,.06);
}

.work-card h3{
 font-family:Georgia,"Songti SC",serif;
 font-size:23px;
 margin:7px 0;
}

.work-card p{
 font-size:13px;
 color:var(--text-2);
}

.topic-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:20px;
}

.topic-card{
 background:white;
 border-radius:var(--radius-card);
 overflow:hidden;
 border:1px solid var(--line);
}

.topic-card .media img{
 border-radius:0;
}

.topic-card .media figcaption{
 padding:0 18px;
}

.topic-copy{
 padding:20px;
}

.topic-copy h3{
 font-family:Georgia,"Songti SC",serif;
 font-size:22px;
 line-height:1.35;
 margin:7px 0;
}

.topic-copy p{
 font-size:13px;
 color:var(--text-2);
}

.verify-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:18px;
}

.verify-card{
 background:white;
 border-top:4px solid var(--gold);
 padding:22px;
 border-radius:0 0 12px 12px;
 box-shadow:var(--shadow);
}

.verify-label{
 font-size:10px;
 color:var(--wine);
 font-weight:800;
 letter-spacing:.14em;
}

.verify-card h3{
 font-family:Georgia,"Songti SC",serif;
 font-size:20px;
 line-height:1.4;
}

.verify-card dl{
 margin:0;
}

.verify-card dl>div{
 padding:10px 0;
 border-top:1px solid var(--line);
}

.verify-card dt{
 font-size:11px;
 color:var(--text-3);
}

.verify-card dd{
 margin:3px 0 0;
 font-size:13px;
 color:var(--text-2);
}

.verify-card>a{
 font-size:12px;
 border-bottom:1px solid var(--gold);
}

.source-list{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:16px;
}

.source-list article{
 display:grid;
 grid-template-columns:48px 1fr;
 gap:14px;
 background:white;
 border:1px solid var(--line);
 padding:18px;
 border-radius:12px;
}

.source-icon{
 width:48px;
 height:48px;
 background:var(--black);
 color:var(--gold-2);
 display:flex;
 align-items:center;
 justify-content:center;
 border-radius:8px;
}

.source-list h3{
 margin:0 0 5px;
}

.source-list p{
 margin:0;
 color:var(--text-2);
 font-size:13px;
}

.source-list a{
 font-size:12px;
 border-bottom:1px solid var(--gold);
}

.compare-grid{
 display:grid;
 grid-template-columns:1fr 1fr;
 gap:18px;
}

.compare-card{
 display:grid;
 grid-template-columns:1fr 40px 1fr;
 gap:15px;
 align-items:center;
 background:white;
 border:1px solid var(--line);
 padding:22px;
 border-radius:14px;
}

.compare-card>div>span:first-child{
 font-size:11px;
 color:var(--text-3);
 font-weight:700;
}

.compare-card p{
 font-size:13px;
 color:var(--text-2);
}

.compare-card>b{
 font-family:Georgia,serif;
 color:var(--gold);
 font-size:30px;
 text-align:center;
}

.lesson-grid{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:14px;
}

.lesson-grid article,
.lesson-grid a{
 background:white;
 border:1px solid var(--line);
 padding:18px;
 border-radius:12px;
}

.lesson-grid span{
 color:var(--gold);
 font-family:Georgia,serif;
 font-size:25px;
}

.lesson-grid p{
 margin:8px 0 0;
 font-size:13px;
}

.principle-panel{
 background:var(--surface-dark);
 color:white;
 padding:34px;
 border-radius:var(--radius-large);
 border-left:4px solid var(--gold);
}

.principle-panel strong{
 font-family:Georgia,"Songti SC",serif;
 font-size:28px;
}

.principle-panel p{
 max-width:900px;
 color:var(--text-light-2);
}

.editor-note{
 display:grid;
 grid-template-columns:64px 1fr;
 gap:20px;
 padding:26px;
 background:#E7E7E3;
 border-radius:16px;
}

.editor-mark{
 width:64px;
 height:64px;
 border:1px solid var(--gold);
 display:flex;
 align-items:center;
 justify-content:center;
 font-family:Georgia,serif;
 font-size:26px;
}

.editor-note h3{
 margin:0;
}

.editor-note p{
 margin:6px 0 0;
 color:var(--text-2);
}

.cta-panel{
 background:linear-gradient(135deg,#202329,#17191D);
 color:white;
 padding:34px;
 border-radius:var(--radius-large);
 display:flex;
 justify-content:space-between;
 gap:30px;
 align-items:center;
}

.cta-panel p{
 color:var(--text-light-2);
}

.code-wall{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:1px;
 background:var(--line);
}

.code-wall article{
 background:white;
 padding:24px;
}

.code-wall b{
 font-family:Georgia,"Songti SC",serif;
 font-size:22px;
}

.code-wall p{
 font-size:13px;
 color:var(--text-2);
}

.editorial-columns{
 display:grid;
 grid-template-columns:1.4fr 1fr 1fr;
 gap:24px;
}

.relation-map{
 min-height:280px;
 background:#E6E5E0;
 border-radius:var(--radius-large);
 display:flex;
 align-items:center;
 justify-content:center;
 gap:0;
 position:relative;
 padding:30px;
}

.relation-node{
 background:white;
 border:1px solid var(--line);
 padding:14px 18px;
 border-radius:9px;
 box-shadow:var(--shadow);
 font-size:13px;
}

.relation-node.major{
 background:var(--black);
 color:white;
}

.relation-line{
 width:54px;
 height:1px;
 background:var(--gold);
}

.relation-note{
 position:absolute;
 bottom:20px;
 font-size:11px;
 color:var(--text-3);
}

.comment-grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:16px;
}

.comment-card{
 background:white;
 padding:20px;
 border-radius:14px;
 border:1px solid var(--line);
}

.comment-top{
 display:flex;
 justify-content:space-between;
 font-size:11px;
 color:var(--text-3);
}

.stance{
 color:var(--wine);
 font-weight:700;
}

.comment-card p{
 font-size:14px;
}

.like-button{
 border:0;
 background:var(--bg);
 padding:6px 10px;
 border-radius:20px;
 font-size:11px;
 cursor:pointer;
}

.like-button.liked{
 background:var(--gold-soft);
 color:#6E5522;
}

.week-grid{
 display:grid;
 grid-template-columns:repeat(7,1fr);
 gap:8px;
}

.week-grid article{
 background:white;
 border-top:2px solid var(--black);
 padding:14px;
 min-height:160px;
}

.week-grid span{
 font-size:11px;
 color:var(--gold);
 font-weight:800;
}

.week-grid a{
 display:block;
 font-size:12px;
 line-height:1.45;
 margin-top:11px;
}

.calendar-strip{
 display:grid;
 grid-template-columns:40px 1fr 40px;
 gap:10px;
 align-items:stretch;
}

.calendar-strip>button{
 border:1px solid var(--line);
 background:white;
 border-radius:8px;
 cursor:pointer;
}

.calendar-days{
 display:grid;
 grid-template-columns:repeat(7,1fr);
 gap:8px;
}

.calendar-days div{
 background:white;
 padding:16px 8px;
 border-radius:10px;
 text-align:center;
 border:1px solid var(--line);
}

.calendar-days strong{
 display:block;
 font-family:Georgia,serif;
}

.calendar-days span{
 font-size:11px;
 color:var(--text-2);
}

.editor-picks{
 display:grid;
 gap:12px;
}

.editor-picks article{
 display:grid;
 grid-template-columns:80px 1fr;
 gap:18px;
 background:white;
 padding:20px;
 border-left:3px solid var(--gold);
}

.pick-no{
 font-family:Georgia,serif;
 color:var(--gold);
 letter-spacing:.1em;
}

.editor-picks h3{
 margin:0 0 4px;
}

.editor-picks p{
 margin:0;
 color:var(--text-2);
 font-size:13px;
}

.trend-bars{
 display:grid;
 gap:13px;
}

.trend-bars>div{
 display:grid;
 grid-template-columns:120px 1fr 50px;
 gap:14px;
 align-items:center;
}

.trend-bars span{
 font-size:13px;
}

.trend-bars strong{
 font-family:Georgia,serif;
}

.bar{
 height:10px;
 background:#DEDEDA;
 border-radius:20px;
 overflow:hidden;
}

.bar i{
 display:block;
 height:100%;
 background:linear-gradient(90deg,var(--graphite),var(--gold));
}

.principle-grid{
 display:grid;
 grid-template-columns:repeat(4,1fr);
 gap:14px;
}

.principle-grid article{
 padding:22px;
 background:var(--surface-dark);
 color:white;
 border-radius:12px;
}

.principle-grid strong{
 color:var(--gold-2);
}

.principle-grid p{
 font-size:13px;
 color:var(--text-light-2);
}

.product-showcase{
 display:grid;
 grid-template-columns:.8fr 1.2fr;
 gap:36px;
 align-items:center;
 background:var(--surface-dark);
 color:white;
 padding:32px;
 border-radius:var(--radius-large);
}

.product-copy h3{
 font-family:Georgia,"Songti SC",serif;
 font-size:33px;
 line-height:1.25;
}

.product-copy p{
 color:var(--text-light-2);
}

.phone-shots{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:14px;
 align-items:end;
}

.phone-shot img{
 border-radius:18px;
 border:1px solid var(--line-dark);
}

.phone-shot figcaption{
 color:var(--text-light-2);
 font-size:10px;
}

.phone-shots .phone-shot:nth-child(2){
 transform:translateY(-16px);
}

.faq-list{
 border-top:1px solid var(--line);
}

.faq-item{
 border-bottom:1px solid var(--line);
 background:transparent;
}

.faq-item summary{
 list-style:none;
 cursor:pointer;
 display:grid;
 grid-template-columns:50px 1fr;
 gap:12px;
 align-items:center;
 padding:20px 0;
 font-weight:700;
}

.faq-item summary::-webkit-details-marker{
 display:none;
}

.faq-item summary span{
 font-family:Georgia,serif;
 color:var(--gold);
 font-size:20px;
}

.faq-answer{
 padding:0 0 22px 62px;
 max-width:980px;
}

.faq-answer p{
 margin:0;
 color:var(--text-2);
}

.search-page-form{
 display:flex;
 gap:8px;
 max-width:850px;
}

.search-page-form input{
 flex:1;
 padding:14px 16px;
 border:1px solid var(--line);
 border-radius:10px;
 outline:0;
}

.search-page-form input:focus{
 border-color:var(--gold);
 box-shadow:0 0 0 3px rgba(198,161,91,.12);
}

.search-page-form button{
 border:0;
 background:var(--black);
 color:white;
 border-radius:10px;
 padding:0 22px;
}

.filter-row{
 display:flex;
 gap:8px;
 flex-wrap:wrap;
 margin-bottom:22px;
}

.filter-row a,
.filter-row button{
 background:white;
 border:1px solid var(--line);
 padding:7px 11px;
 border-radius:20px;
 font-size:12px;
 cursor:pointer;
}

.filter-row .active{
 background:var(--black);
 color:white;
}

.empty-state{
 padding:36px;
 border:1px dashed var(--line);
 border-radius:14px;
 background:white;
}

.empty-state h2{
 margin-top:0;
}

.app-stage{
 background:var(--surface-dark);
 color:white;
 border-radius:20px;
 padding:34px;
}

.app-stage p{
 color:var(--text-light-2);
}

.device-grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:22px;
}

.device-card{
 background:white;
 border-radius:16px;
 padding:14px;
 border:1px solid var(--line);
}

.device-card h3{
 padding:0 6px;
 margin-bottom:4px;
}

.device-card p{
 padding:0 6px;
 font-size:13px;
 color:var(--text-2);
}

.device-card .media img{
 border-radius:11px;
}

.browser-grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:18px;
}

.browser-card{
 background:white;
 padding:16px;
 border-radius:14px;
 border:1px solid var(--line);
}

.site-footer{
 background:linear-gradient(135deg,#202329,#17191D);
 color:var(--text-light);
 border-top:1px solid var(--gold);
 padding:54px 0 90px;
}

.footer-grid{
 display:grid;
 grid-template-columns:1.7fr repeat(3,1fr);
 gap:48px;
}

.footer-brand{
 font-family:Georgia,"Songti SC",serif;
 font-size:30px;
 color:white;
}

.footer-about p{
 color:var(--text-light-2);
 max-width:500px;
}

.footer-about span{
 color:var(--gold-2);
 font-size:12px;
}

.footer-grid h2{
 font-size:13px;
 color:var(--text-light);
 margin:0 0 14px;
}

.footer-grid>div:not(:first-child) a{
 display:block;
 font-size:13px;
 color:var(--text-light-2);
 padding:4px 0;
}

.footer-grid a:hover{
 color:var(--gold-2);
}

.footer-bottom{
 display:flex;
 gap:24px;
 justify-content:space-between;
 border-top:1px solid var(--line-dark);
 padding-top:20px;
 margin-top:34px;
 color:var(--text-light-2);
 font-size:11px;
}

.mobile-tabbar{
 display:none;
}

.back-top{
 position:fixed;
 right:22px;
 bottom:24px;
 width:42px;
 height:42px;
 border:0;
 border-radius:50%;
 background:var(--black);
 color:white;
 box-shadow:var(--shadow);
 cursor:pointer;
 z-index:250;
 opacity:0;
 pointer-events:none;
 transform:translateY(8px);
 transition:.18s;
}

.back-top.show{
 opacity:1;
 pointer-events:auto;
 transform:none;
}

/*
 * 修复：
 * 原先这里使用 opacity:.01，
 * 需要 JS 给 section 添加 .in-view 才会恢复显示。
 * 当 JS 未正常触发时，首页首屏之后的全部区域会变成近乎透明。
 *
 * 现在统一保持正常显示，避免内容被“隐藏”。
 */
.reveal-ready .section:not(.home-hero):not(.page-hero){
 opacity:1;
 transform:none;
 transition:opacity .35s ease,transform .35s ease;
}

.reveal-ready .section.in-view{
 opacity:1;
 transform:none;
}

@media(max-width:1200px){
 .main-nav{
  gap:13px;
 }

 .main-nav a{
  font-size:13px;
 }

 .desktop-only{
  display:none;
 }

 .card-grid{
  grid-template-columns:repeat(3,1fr);
 }

 .week-grid{
  grid-template-columns:repeat(4,1fr);
 }

 .footer-grid{
  gap:30px;
 }
}

@media(max-width:1024px){
 .main-nav{
  display:none;
 }

 .header-actions{
  margin-left:auto;
 }

 .page-hero-grid,
 .hero-grid{
  grid-template-columns:1fr 1fr;
 }

 .people-grid,
 .works-grid,
 .verify-grid,
 .topic-grid{
  grid-template-columns:repeat(2,1fr);
 }

 .comment-grid{
  grid-template-columns:repeat(2,1fr);
 }

 .lesson-grid,
 .principle-grid,
 .code-wall{
  grid-template-columns:repeat(2,1fr);
 }

 .card-grid,
 .card-grid.asym{
  grid-template-columns:repeat(2,1fr);
 }

 .card-grid.asym .featured{
  grid-row:auto;
 }

 .editorial-columns{
  grid-template-columns:1fr 1fr;
 }

 .footer-grid{
  grid-template-columns:1.5fr 1fr 1fr;
 }

 .footer-grid>div:last-child{
  grid-column:2/4;
 }
}

@media(max-width:900px){
 .section{
  padding:52px 0;
 }

 .page-hero-grid,
 .hero-grid,
 .media-split,
 .media-split.reverse,
 .split-feature,
 .archive-highlight,
 .product-showcase{
  grid-template-columns:1fr;
 }

 .hero-side .media img{
  aspect-ratio:16/9;
  max-height:560px;
 }

 .source-list{
  grid-template-columns:1fr;
 }

 .compare-grid{
  grid-template-columns:1fr;
 }

 .week-grid{
  grid-template-columns:repeat(3,1fr);
 }

 .calendar-days{
  overflow:auto;
  grid-template-columns:repeat(7,110px);
  padding-bottom:6px;
 }

 .relation-map{
  overflow:auto;
  justify-content:flex-start;
 }

 .footer-grid{
  grid-template-columns:1fr 1fr;
 }

 .footer-grid>div:last-child{
  grid-column:auto;
 }

 .phone-shots{
  max-width:650px;
  margin:auto;
 }
}

@media(max-width:768px){
 .wrap{
  width:min(calc(100% - 28px),var(--wrap));
 }

 .brief-bar .wrap{
  gap:16px;
 }

 .brief-bar .wrap span:nth-of-type(n+3){
  display:none;
 }

 .header-inner{
  height:62px;
 }

 .brand small{
  display:none;
 }

 .section-head{
  align-items:flex-start;
  flex-direction:column;
  gap:10px;
 }

 .page-hero{
  padding-top:32px;
 }

 .page-hero h1{
  font-size:42px;
 }

 .hero-copy h1{
  font-size:48px;
 }

 .rank-list li{
  grid-template-columns:48px 1fr;
 }

 .rank-side{
  grid-column:2;
  grid-row:2;
  display:flex;
  justify-content:flex-start;
 }

 .rank-main p{
  display:none;
 }

 .rank-no{
  text-align:left;
 }

 .people-grid,
 .works-grid,
 .verify-grid,
 .topic-grid,
 .comment-grid,
 .card-grid,
 .card-grid.asym,
 .editorial-columns,
 .device-grid,
 .browser-grid{
  grid-template-columns:1fr 1fr;
 }

 .timeline{
  margin-left:0;
 }

 .timeline:before{
  left:16px;
 }

 .timeline-node{
  grid-template-columns:34px 1fr;
 }

 .node-mark{
  grid-column:1;
  margin-left:11px;
 }

 .node-time{
  grid-column:2;
  grid-row:1;
  text-align:left;
  padding-left:0;
 }

 .node-body{
  grid-column:2;
  grid-row:2;
 }

 .mini-event{
  grid-template-columns:1fr;
 }

 .mini-event time{
  text-align:left;
  padding-left:38px;
 }

 .mini-event>div{
  grid-template-columns:auto 1fr;
 }

 .week-grid{
  grid-template-columns:repeat(2,1fr);
 }

 .footer-grid{
  grid-template-columns:1fr 1fr;
 }

 .footer-about{
  grid-column:1/-1;
 }

 .footer-bottom{
  flex-direction:column;
  gap:6px;
 }

 .site-footer{
  padding-bottom:110px;
 }

 .mobile-tabbar{
  position:fixed;
  left:10px;
  right:10px;
  bottom:10px;
  z-index:450;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  background:rgba(32,35,41,.97);
  color:white;
  border:1px solid var(--line-dark);
  border-radius:16px;
  box-shadow:var(--shadow-dark);
  padding:7px 4px calc(7px + env(safe-area-inset-bottom));
 }

 .mobile-tabbar a{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2px;
  font-size:14px;
 }

 .mobile-tabbar span{
  font-size:10px;
  color:var(--text-light-2);
 }

 .back-top{
  bottom:84px;
 }

 .search-dialog{
  padding:32px 22px;
 }

 .search-dialog h2{
  font-size:28px;
 }

 .product-showcase{
  padding:22px;
 }

 .phone-shots{
  gap:8px;
 }
}

@media(max-width:600px){
 .wrap{
  width:min(calc(100% - 22px),var(--wrap));
 }

 .section{
  padding:44px 0;
 }

 .hero-copy h1{
  font-size:42px;
 }

 .hero-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
 }

 .hero-actions .btn:first-child:nth-last-child(3){
  grid-column:1/-1;
 }

 .hero-overlay{
  position:static;
  margin-top:-10px;
  border-radius:0 0 12px 12px;
 }

 .hero-side .media img{
  border-radius:12px 12px 0 0;
 }

 .people-grid,
 .works-grid,
 .verify-grid,
 .topic-grid,
 .comment-grid,
 .card-grid,
 .card-grid.asym,
 .editorial-columns,
 .device-grid,
 .browser-grid{
  grid-template-columns:1fr;
 }

 .lesson-grid,
 .principle-grid,
 .code-wall{
  grid-template-columns:1fr;
 }

 .rank-list li{
  grid-template-columns:42px 1fr;
  gap:10px;
 }

 .rank-main h3{
  font-size:15px;
 }

 .rank-side strong{
  font-size:17px;
 }

 .mini-event>div{
  grid-template-columns:1fr;
 }

 .mini-event .status{
  grid-row:auto;
  width:max-content;
 }

 .mini-event p{
  grid-column:1;
 }

 .mini-event time{
  padding-left:0;
 }

 .compare-card{
  grid-template-columns:1fr;
 }

 .compare-card>b{
  transform:rotate(90deg);
 }

 .week-grid{
  grid-template-columns:1fr 1fr;
 }

 .relation-node{
  min-width:130px;
 }

 .source-list article{
  grid-template-columns:40px 1fr;
 }

 .source-icon{
  width:40px;
  height:40px;
 }

 .faq-answer{
  padding-left:0;
 }

 .faq-item summary{
  grid-template-columns:38px 1fr;
 }

 .footer-grid{
  grid-template-columns:1fr 1fr;
  gap:28px 18px;
 }

 .search-form>div{
  display:grid;
  grid-template-columns:1fr;
 }

 .search-form button{
  min-height:44px;
 }

 .product-copy h3{
  font-size:28px;
 }

 .phone-shots{
  grid-template-columns:repeat(3,1fr);
 }

 .phone-shot figcaption{
  display:none;
 }

 .phone-shots .phone-shot:nth-child(2){
  transform:translateY(-8px);
 }
}