/* 17c — dense, accessible, responsive editorial interface */
:root{color-scheme:light;--red:#D92338;--red-dark:#B9142B;--ink:#1E293B;--stone:#1A202C;--night:#0D1117;--muted:#64748B;--bg:#F4F6F9;--surface:#fff;--line:#E2E7EE;--pale:#EAEEF3;--green:#00C853;--shadow:0 3px 12px rgba(22,31,44,.045);--max:1240px;--radius:5px}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--bg);font:15px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;text-rendering:optimizeLegibility}h1,h2,h3,p,figure{margin-top:0}h1,h2,h3{letter-spacing:-.025em;line-height:1.35}a{color:inherit;text-decoration:none}a:hover{color:var(--red)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #e76575;outline-offset:3px}button,input,select,textarea{font:inherit}img{display:block;max-width:100%;height:auto}.wrap{width:min(calc(100% - 36px),var(--max));margin-inline:auto}.mono{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-variant-numeric:tabular-nums}.skip-link{position:absolute;left:16px;top:-80px;z-index:100;background:#fff;padding:8px 16px}.skip-link:focus{top:8px}.masthead{background:var(--stone);color:#fff;border-bottom:4px solid var(--red)}.top-line{background:#0F1420;border-bottom:1px solid #333a49;font-size:11px;color:#CBD5E1}.top-inner{height:31px;display:flex;align-items:center;gap:8px;font-weight:600;letter-spacing:.03em}.top-note{margin-left:auto;color:#94A3B8;font-weight:400}.live-point{display:inline-block;width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 0 3px rgba(0,200,83,.13);flex:none}.head-main{display:flex;align-items:center;min-height:78px;gap:18px}.brand{display:flex;align-items:center;gap:8px;flex:none;color:#fff}.brand:hover{color:#fff}.brand img{width:42px;height:42px;object-fit:contain;border-radius:5px}.brand-word{font-size:36px;line-height:1;font-weight:900;letter-spacing:-.075em}.brand-word span,.foot-brand span{color:#FF4059}.brand-caption{display:flex;flex-direction:column;border-left:1px solid #475063;padding-left:17px;gap:2px;white-space:nowrap}.brand-caption b{font-size:14px;letter-spacing:.13em}.brand-caption span{font-size:11px;color:#AFB8C7}.primary-nav{margin-left:auto;display:flex;align-items:center;gap:4px}.primary-nav a{padding:10px 14px;border-radius:4px;color:#CDD5E0;font-weight:700;font-size:13px}.primary-nav a:hover,.primary-nav a[aria-current=page]{background:#303848;color:#fff}.primary-nav .nav-emphasis{background:var(--red);color:white;margin-left:8px}.primary-nav .nav-emphasis:hover{background:#c81d32}.menu-toggle{display:none;background:transparent;color:#fff;border:1px solid #566071;padding:6px 10px;border-radius:4px;font-size:15px;cursor:pointer}.breadcrumb{min-height:48px;display:flex;align-items:center;gap:9px;font-size:12px;color:#8190A2}.breadcrumb a{color:#64748B}.hero-intro{background:white;border:1px solid var(--line);border-left:4px solid var(--red);display:flex;justify-content:space-between;align-items:center;gap:24px;padding:19px 22px;margin-bottom:15px;box-shadow:var(--shadow)}.section-kicker{display:block;color:var(--red);font-size:11px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}.hero-intro h1{font-size:25px;margin:5px 0 7px;color:#111827;font-weight:850}.hero-intro p{font-size:13px;color:var(--muted);margin:0;max-width:780px}.hero-cta{background:var(--red);color:#fff;padding:11px 15px;border-radius:4px;white-space:nowrap;font-size:13px;font-weight:800;display:inline-flex;gap:16px;align-items:center}.hero-cta:hover{background:var(--red-dark);color:white}.main-grid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px;align-items:start}.feed-main,.feed-aside,.community-primary,.community-aside{min-width:0;display:grid;gap:16px}.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.section-head h2{font-size:19px;color:#131D2D;font-weight:850;margin:3px 0 0}.section-note{font-size:11px;color:#8290A1;text-align:right}.status{font-size:11px;color:#12934A;font-weight:750;display:flex;align-items:center;gap:8px;white-space:nowrap}.focus-panel{padding:17px}.focus-layout{display:grid;grid-template-columns:1.12fr 1fr;gap:16px}.focus-image{position:relative;aspect-ratio:16/9;align-self:start;background:var(--pale);overflow:hidden;border-radius:3px}.focus-image img,.media img,.library-thumb img{width:100%;height:100%;object-fit:cover}.focus-image img{transition:transform .25s ease}.focus-image:hover img{transform:scale(1.035)}.focus-image>span{position:absolute;left:10px;top:10px;background:var(--red);color:#fff;padding:3px 9px;font-weight:800;font-size:11px}.focus-category{color:var(--red);font-weight:850;font-size:11px;margin:0 0 6px}.focus-text h3{font-size:21px;color:#121B29;margin:0 0 10px;line-height:1.42;font-weight:850}.focus-text>p:not(.focus-category){font-size:13px;color:#556578;margin:0 0 10px;line-height:1.78}.line-block{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:12px 0}.line-block b{font-size:11px;color:#334155;margin-right:6px}.line-block span{border:1px solid #e5e9ef;background:#f7f8fa;padding:2px 6px;font-size:10px;color:#63748C}.filled-link,.outline-button{display:inline-flex;align-items:center;justify-content:center;padding:9px 13px;border-radius:4px;font-size:12px;font-weight:800;white-space:nowrap}.filled-link{background:var(--red);color:#fff}.filled-link:hover{color:#fff;background:var(--red-dark)}.outline-button{border:1px solid var(--red);color:var(--red);background:#fff}.outline-button:hover{background:#fff1f3;color:var(--red-dark)}.flow{min-width:0}.flow>.section-head{border-left:3px solid var(--red);padding:0 0 0 12px;margin:2px 0 12px}.card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.topic-card{min-width:0;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}.topic-card .media{aspect-ratio:16/9;overflow:hidden;background:#EBEFF4}.topic-card .media img{transition:transform .25s ease}.topic-card .media:hover img{transform:scale(1.03)}.topic-card-copy{padding:12px 13px 13px;display:flex;flex-direction:column;flex:1;min-width:0}.eyebrow{display:flex;align-items:center;gap:7px;margin-bottom:8px}.tag{display:inline-block;font-size:10px;font-weight:800;color:var(--red);background:#FDEDEF;padding:2px 7px;border-left:2px solid var(--red);white-space:nowrap}.eyebrow .mono{font-size:10px;color:#8B98AA}.topic-card h3{font-size:16px;font-weight:850;line-height:1.48;margin:0 0 8px}.topic-card h3 a{display:block}.topic-card p{font-size:12px;color:#64748B;margin:0 0 13px;line-height:1.7;flex:1}.subtle-link{font-size:12px;color:var(--red);font-weight:850}.subtle-link:hover{color:var(--red-dark)}.leaderboard{position:relative}.board-title{background:var(--stone);color:#fff;padding:17px 17px 14px;border-top:3px solid var(--red)}.board-title>span{color:#F58E9A;font-size:10px;letter-spacing:.11em;font-weight:900}.board-title h2{font-size:20px;margin:4px 0}.board-title h2 small{font-size:11px;font-weight:700;color:#FFB0B9}.board-title p{font-size:10px;color:#B8C1CD;margin:2px 0 0}.rank-list{list-style:none;padding:0 13px;margin:0}.rank-list li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:0 9px;padding:12px 0;border-bottom:1px solid var(--line);align-items:start}.rank-list li:last-child{border-bottom:0}.rank{font-weight:900;color:#9DA8B7;font-size:16px;line-height:1.55}.top-rank{color:var(--red)}.rank-list a{font-size:12px;font-weight:800;line-height:1.5}.rank-tag{grid-column:2;color:#98A2B2;font-size:10px;margin-top:4px}.side-community{padding:17px}.side-heading h2{font-size:18px;margin:4px 0 9px}.side-community>p{font-size:12px;color:#64748B;line-height:1.75}.side-community .outline-button{width:100%;margin-top:5px}.side-divider{height:1px;background:var(--line);margin:18px 0 14px}.side-community h3{font-size:13px;margin:0 0 8px}.side-community ul{padding:0 0 0 18px;margin:0}.side-community li{font-size:12px;color:#66758B;padding:2px 0}.community-sample{padding:16px 17px}.community-sample .section-head{margin-bottom:10px}.discussion-preview{border-top:1px solid var(--line)}.discussion-row{display:grid;grid-template-columns:30px minmax(0,1fr) 15px;gap:9px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}.discussion-row:last-child{border:0;padding-bottom:0}.row-number{color:var(--red);font-weight:900;font-size:15px}.discussion-row strong{display:block;font-size:13px;font-weight:850;line-height:1.4;margin-bottom:4px}.discussion-row small{display:block;font-size:11px;color:#8995A6;line-height:1.5}.go-arrow{color:var(--red);font-size:17px}.last-flow{margin-bottom:22px}.topic-card.compact{display:grid;grid-template-columns:125px 1fr;min-height:144px}.topic-card.compact .media{height:100%;aspect-ratio:auto}.topic-card.compact .topic-card-copy{padding:10px}.topic-card.compact h3{font-size:13px}.topic-card.compact p{font-size:11px;margin-bottom:7px}.topic-card.compact .eyebrow{margin-bottom:4px}.site-footer{margin-top:32px;color:#C5CDD8;background:var(--night);border-top:4px solid #202B3B;padding:30px 0 0}.footer-grid{display:grid;grid-template-columns:1.3fr .6fr 1fr;gap:35px}.foot-brand{font-size:31px;color:#fff;font-weight:900;line-height:1}.foot-brand small{font-size:12px;font-weight:500;margin-left:5px;letter-spacing:0}.footer-grid h2{font-size:13px;color:#fff;margin-bottom:10px}.footer-grid p{font-size:12px;line-height:1.8;color:#AAB5C4;margin:11px 0}.footer-grid a{color:#D4DCE7}.footer-grid a:hover{color:#fff}.footer-grid .mono{overflow-wrap:anywhere;color:#F4B3BA}.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:25px;padding:14px 0;border-top:1px solid #2F3846;color:#8C99A9;font-size:11px}
/* Community landing and topic detail */
.community-banner{position:relative;overflow:hidden;color:#fff;background:linear-gradient(110deg,#1A202C 4%,#293449 85%);border-top:4px solid var(--red);border-radius:4px;padding:26px 30px;margin-bottom:16px}.community-banner:after{content:"17c";position:absolute;right:2%;top:-55px;font-size:210px;font-weight:900;line-height:1;color:rgba(255,255,255,.035);pointer-events:none}.community-banner .section-kicker{color:#FF8291;position:relative;z-index:1}.community-banner h1{position:relative;z-index:1;font-size:31px;margin:7px 0}.community-banner p{position:relative;z-index:1;color:#CED5E0;max-width:780px;font-size:14px;margin-bottom:18px;line-height:1.8}.banner-actions{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:9px}.community-banner .outline-button{background:transparent;border-color:#A5ACB9;color:#fff}.community-banner .outline-button:hover{background:#39455A}.community-grid{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:16px;align-items:start}.conversation-panel,.topic-library,.submit-section,.rules-panel,.aside-spotlight{padding:18px}.thread{display:grid;grid-template-columns:40px 1fr;gap:11px;border-top:1px solid var(--line);padding:15px 0}.thread:last-child{padding-bottom:0}.thread-icon{width:36px;height:36px;background:#F7E8EB;border:1px solid #F6D2D8;border-radius:4px;color:var(--red);font-family:ui-monospace,monospace;font-size:14px;display:flex;justify-content:center;align-items:center;font-weight:900}.thread h3{font-size:15px;margin:0 0 5px;font-weight:850}.thread p{font-size:12px;color:#65768B;margin:0 0 7px}.rules-panel{background:#FFF}.rules-panel h2,.aside-spotlight h2{font-size:17px;margin:5px 0 12px}.rules-panel ol{padding:0 0 0 21px;margin:0}.rules-panel li{font-size:12px;color:#5D6C80;padding:8px 0;border-bottom:1px solid var(--line)}.rules-panel li:last-child{border-bottom:0}.aside-spotlight p{font-size:12px;color:#65758B}.aside-spotlight .subtle-link{display:block;margin-top:11px}.library-list{display:grid;gap:0}.library-item{border-top:1px solid var(--line);padding:12px 0;display:grid;grid-template-columns:155px minmax(0,1fr);gap:14px}.library-item:last-child{padding-bottom:0}.library-thumb{aspect-ratio:16/9;background:var(--pale);border-radius:3px;overflow:hidden}.library-item h3{font-size:14px;margin:5px 0;line-height:1.48}.library-item p{font-size:11px;color:#7B8A9B;margin:0}.submit-intro{font-size:13px;color:#68788B;line-height:1.75;margin-bottom:15px}.submission-form{display:grid;gap:8px}.submission-form label{font-weight:800;font-size:12px;margin-top:7px}.submission-form label span{color:#8793A4;font-weight:400}.submission-form input,.submission-form select,.submission-form textarea{width:100%;padding:10px 12px;border:1px solid #D4DDE8;color:#243447;border-radius:4px;background:#fff;outline-offset:1px}.submission-form input:focus,.submission-form textarea:focus,.submission-form select:focus{border-color:#d92338}.submission-form textarea{resize:vertical;min-height:120px}.privacy-hint{padding:10px 12px;background:#F5F7F9;border-left:3px solid #8E9AAC;color:#68788A;font-size:11px;margin-top:6px}.submit-button{justify-self:start;cursor:pointer;border:0;border-radius:4px;background:var(--red);color:#fff;font-weight:850;font-size:13px;padding:11px 24px;margin-top:7px}.submit-button:hover{background:var(--red-dark)}.submit-button:disabled{opacity:.6;cursor:wait}.notice{padding:11px 14px;margin:14px 0;font-size:13px;border-radius:3px}.notice.success{border-left:4px solid #10A34A;background:#EFFAF2;color:#116E34}.notice.error{border-left:4px solid #E33548;background:#FFF0F2;color:#982435}.detail-panel{padding:0}.detail-header{padding:23px 25px 17px;border-bottom:1px solid var(--line)}.detail-header h1{font-size:28px;margin:6px 0 10px;font-weight:900}.detail-lead{font-size:15px;color:#607187;line-height:1.8;margin-bottom:10px}.detail-meta{display:flex;align-items:center;gap:12px;font-size:11px;color:#8191A1}.detail-image{margin:0 25px}.detail-image img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#EAEEF3}.detail-image figcaption{padding:8px 0;color:#8A97A8;font-size:10px}.detail-body{padding:13px 25px 26px}.detail-body h2{font-size:18px;margin:14px 0 9px;padding-left:10px;border-left:3px solid var(--red)}.detail-body>p{color:#45556C;font-size:14px;line-height:2}.question-box{background:#F4F6F9;border:1px solid #E4E9F0;padding:15px;border-radius:4px}.question-box strong{font-size:15px}.question-box p{font-size:12px;color:#7B8999;margin:8px 0 15px}.detail-footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:15px;padding:16px 25px;font-size:12px;font-weight:800}.detail-footer a{color:var(--red)}.detail-related{padding:18px}.mini-link{display:grid;gap:7px;padding:12px 0;border-bottom:1px solid var(--line)}.mini-link:last-child{border:0}.mini-link .tag{justify-self:start}.mini-link strong{font-size:13px;line-height:1.55}.error-page{padding-top:55px;padding-bottom:100px}.error-panel{text-align:center;max-width:680px;margin:0 auto;padding:50px 30px}.error-code{color:var(--red);font-family:ui-monospace,monospace;font-size:70px;font-weight:900;line-height:1}.error-panel h1{font-size:24px;margin:8px 0}.error-panel p{color:var(--muted);font-size:13px}.error-panel .banner-actions{justify-content:center;margin-top:20px}
/* Tablet: preserve reading order; compress secondary rail. */
@media (max-width:1120px){.wrap{width:min(calc(100% - 28px),var(--max))}.main-grid{grid-template-columns:minmax(0,1fr) 285px;gap:13px}.community-grid{grid-template-columns:minmax(0,1fr) 275px;gap:13px}.focus-layout{grid-template-columns:1fr}.focus-image{aspect-ratio:16/8}.focus-text h3{font-size:19px}.brand-caption span{display:none}.brand-caption{padding-left:12px}.primary-nav a{padding:10px}.rank-list{padding:0 10px}.rank-list li{padding:10px 0}.topic-card.compact{grid-template-columns:105px 1fr}}
@media (max-width:880px){.main-grid,.community-grid{grid-template-columns:1fr}.feed-aside{grid-template-columns:1fr 1fr;align-items:start}.leaderboard{grid-row:1}.side-community{grid-row:1}.community-aside{grid-template-columns:1fr 1fr}.focus-layout{grid-template-columns:1fr 1fr}.focus-image{aspect-ratio:16/9}.brand-caption span{display:block}.hero-intro h1{font-size:23px}.topic-card.compact{grid-template-columns:115px 1fr}}
/* Mobile: reading and core links work even with scripts disabled. */
@media (max-width:640px){body{font-size:14px}.wrap{width:calc(100% - 22px)}.top-note{display:none}.top-inner{height:27px}.head-main{min-height:66px;gap:11px;flex-wrap:wrap;padding-top:8px;padding-bottom:8px}.brand img{width:36px;height:36px}.brand-word{font-size:30px}.brand-caption{padding-left:10px}.brand-caption b{font-size:12px}.brand-caption span{font-size:9px}.menu-toggle{display:flex;align-items:center;gap:5px;margin-left:auto;font-size:13px}.primary-nav{display:flex;order:10;flex-basis:100%;width:100%;margin:0;gap:4px;flex-wrap:wrap;padding-top:5px;border-top:1px solid #374154}.primary-nav a{font-size:11px;padding:7px 10px}.primary-nav .nav-emphasis{margin-left:0}.breadcrumb{min-height:40px;font-size:11px;flex-wrap:wrap}.hero-intro{padding:14px;display:block;margin-bottom:11px}.hero-intro h1{font-size:21px}.hero-intro p{font-size:12px}.hero-cta{margin-top:12px;font-size:12px}.main-grid,.feed-main,.feed-aside,.community-primary,.community-aside{gap:11px}.focus-panel{padding:12px}.focus-layout{grid-template-columns:1fr;gap:12px}.focus-text h3{font-size:19px}.section-head h2{font-size:17px}.focus-image{aspect-ratio:16/9}.card-grid{gap:9px}.topic-card-copy{padding:10px}.topic-card h3{font-size:13px;line-height:1.5}.topic-card p{font-size:11px}.topic-card .subtle-link{font-size:11px}.eyebrow{flex-wrap:wrap}.feed-aside{grid-template-columns:1fr}.leaderboard,.side-community{grid-row:auto}.rank-list li{padding:12px 0}.community-sample{padding:13px}.footer-grid{grid-template-columns:1fr 1fr;gap:18px}.footer-grid>div:first-child{grid-column:1/-1}.site-footer{margin-top:20px}.foot-bottom{margin-top:18px;display:grid;gap:4px}.community-banner{padding:22px 17px}.community-banner h1{font-size:26px}.community-banner p{font-size:12px}.community-banner:after{font-size:130px;top:-25px}.community-aside{grid-template-columns:1fr}.conversation-panel,.topic-library,.submit-section,.rules-panel,.aside-spotlight{padding:13px}.library-item{grid-template-columns:110px minmax(0,1fr);gap:10px}.library-item h3{font-size:12px}.library-item p{font-size:11px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.detail-header{padding:18px 15px 13px}.detail-header h1{font-size:22px}.detail-lead{font-size:13px}.detail-image{margin:0 15px}.detail-body{padding:10px 15px 20px}.detail-body>p{font-size:13px}.detail-footer{padding:14px 15px}.error-page{padding-top:35px;padding-bottom:60px}.error-panel{padding:34px 15px}}
@media (max-width:390px){.brand-caption span{display:none}.brand-caption{border:0;padding:0}.brand-caption b{font-size:10px}.card-grid{grid-template-columns:1fr}.topic-card{display:grid;grid-template-columns:110px minmax(0,1fr)}.topic-card .media{aspect-ratio:auto;height:100%}.topic-card-copy{padding:9px}.topic-card p{margin-bottom:5px}.topic-card.compact{grid-template-columns:110px minmax(0,1fr)}.library-item{grid-template-columns:90px minmax(0,1fr)}.section-head{align-items:start}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media print{.masthead{background:#fff;color:#111;border-bottom:1px solid #ccc}.top-line,.menu-toggle,.primary-nav,.site-footer,.hero-cta,.submit-button{display:none!important}.wrap{width:100%}.main-grid,.community-grid{display:block}.feed-aside,.community-aside{display:none}.panel,.topic-card{box-shadow:none;border:1px solid #ccc;break-inside:avoid}.card-grid{grid-template-columns:1fr 1fr}a{color:#111}.brand-word{color:#111}}