/* V110 slate-rose research desk */
:root { --slate-950:#171922; --slate-850:#252936; --slate-700:#454b5c; --paper:#f6f1eb; --paper-2:#fffaf4; --rose:#a95368; --rose-dark:#713746; --rose-soft:#ead1d7; --ink:#25232a; --line:#d7cfc5; font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; overflow-x:hidden; }
body { margin:0; background:linear-gradient(90deg,rgba(169,83,104,.035) 1px,transparent 1px),linear-gradient(rgba(69,75,92,.035) 1px,transparent 1px),var(--paper); background-size:26px 26px; overflow-x:hidden; overflow-wrap:anywhere; }
a { color:inherit; text-decoration-thickness:.08em; text-underline-offset:.18em; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid #d2768d; outline-offset:3px; }
.skip-link { position:fixed; left:1rem; top:-6rem; z-index:99; background:#fff; padding:.75rem 1rem; }
.skip-link:focus { top:1rem; }
.site-header { position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:1.3rem; min-height:74px; padding:.65rem clamp(1rem,3vw,3rem); color:#fff; background:rgba(23,25,34,.96); border-bottom:3px solid var(--rose); }
.brand { display:flex; align-items:center; gap:.7rem; min-width:14rem; text-decoration:none; font-weight:800; }
.brand-number { display:grid; place-items:center; width:42px; height:42px; border:1px solid #dca0af; color:#f3d7de; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.brand small { display:block; margin-top:.15rem; color:#bebfca; font-size:.68rem; font-weight:500; letter-spacing:.08em; }
.top-nav { display:flex; align-items:center; gap:.25rem; overflow-x:auto; padding:.3rem; }
.top-nav a { flex:none; padding:.48rem .62rem; color:#e3e0e4; text-decoration:none; font-size:.86rem; border-radius:999px; }
.top-nav a:hover { background:#373b49; color:#fff; }
.rail-toggle { display:none; margin-left:auto; border:1px solid #dca0af; background:transparent; color:#fff; padding:.6rem .8rem; font:inherit; }
main { width:min(1440px,100%); margin:0 auto; padding:0 clamp(1rem,3vw,3rem) 5rem; }
.page-hero { position:relative; display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:2rem; align-items:end; min-height:330px; padding:clamp(3rem,8vw,7rem) 0 2.6rem; border-bottom:1px solid #c7cad3; }
.page-hero:before { content:""; position:absolute; right:7rem; top:2rem; width:180px; height:180px; border:1px solid var(--rose-soft); border-radius:50%; box-shadow:0 0 0 22px rgba(169,83,104,.04),0 0 0 52px rgba(69,75,92,.03); z-index:-1; }
.eyebrow,.rail-kicker,.footer-mark,.tool-label { margin:0 0 .75rem; color:var(--rose-dark); font:700 .74rem/1.2 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.16em; }
.page-hero h1 { max-width:950px; margin:0; font-family:Georgia,"Songti SC",serif; font-size:clamp(2.25rem,6vw,5.5rem); font-weight:500; line-height:1.06; letter-spacing:-.035em; }
.hero-lead { max-width:790px; margin:1.3rem 0 0; color:var(--slate-700); font-size:clamp(1rem,1.8vw,1.2rem); line-height:1.85; }
.editor-stamp { display:grid; place-items:center; align-content:center; width:150px; height:150px; color:var(--rose-dark); border:2px solid var(--rose); border-radius:50%; transform:rotate(-7deg); background:rgba(255,250,244,.7); text-align:center; }
.editor-stamp span,.editor-stamp small { font:.65rem ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.1em; }
.editor-stamp strong { font:700 1.25rem Georgia,"Songti SC",serif; }
.desk-layout { display:grid; grid-template-columns:240px minmax(0, 1fr); gap:clamp(1.5rem,4vw,4rem); align-items:start; padding-top:2rem; }
.section-rail { position:sticky; top:100px; min-width:0; padding:1.3rem; background:var(--slate-850); color:#fff; box-shadow:10px 10px 0 var(--rose-soft); }
.section-rail h2 { margin:.2rem 0 1rem; font:500 1.45rem Georgia,"Songti SC",serif; }
.section-rail ol { list-style:none; margin:0; padding:0; }
.section-rail li+li { border-top:1px solid #424756; }
.section-rail li a { display:flex; gap:.7rem; padding:.8rem 0; text-decoration:none; }
.section-rail li span { color:#da9bac; font:700 .7rem ui-monospace,SFMono-Regular,Menlo,monospace; }
.rail-kicker { color:#da9bac; }
.rail-note { margin-top:1.2rem; padding-top:1rem; border-top:2px solid var(--rose); }
.rail-note p { margin:.45rem 0 0; color:#c6c7d0; font-size:.84rem; line-height:1.65; }
.desk-content { min-width:0; }
.desk-content>section,.longform>section { margin:0 0 2rem; }
.desk-content h2,.longform h2 { margin:.1rem 0 .8rem; font:600 clamp(1.55rem,3vw,2.25rem)/1.25 Georgia,"Songti SC",serif; }
.desk-content h3,.longform h3 { font:600 1.12rem/1.45 Georgia,"Songti SC",serif; }
.desk-content p,.desk-content li,.longform p,.longform li { color:#49454d; line-height:1.85; }
.editor-note { position:relative; padding:clamp(1.3rem,3vw,2.2rem); background:var(--paper-2); border:1px solid var(--line); box-shadow:0 18px 50px rgba(43,38,49,.12); }
.editor-note:before { content:""; position:absolute; left:1.2rem; top:-7px; width:74px; height:14px; background:rgba(203,169,127,.43); transform:rotate(-2deg); }
.note-grid { display:grid; grid-template-columns:repeat(2,minmax(0, 1fr)); gap:1rem; margin-top:1rem; }
.note-grid p { margin:0; padding:1rem; background:#f0e7e2; border-left:3px solid var(--rose); }
.section-heading { display:flex; justify-content:space-between; gap:2rem; align-items:end; margin-bottom:1rem; }
.section-heading>p { max-width:34rem; }
.tile-grid { display:grid; grid-template-columns:repeat(3,minmax(0, 1fr)); gap:1rem; }
.editorial-tile { position:relative; min-width:0; padding:1.25rem; background:#fff; border:1px solid var(--line); box-shadow:4px 4px 0 #e4dcd2; }
.editorial-tile:nth-child(3n+2) { transform:translateY(8px); }
.editorial-tile h3 { margin:.4rem 0; }
.editorial-tile p { font-size:.92rem; }
.tile-index { color:var(--rose); font:700 .72rem ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.12em; }
.intent { padding-top:.7rem; border-top:1px dashed var(--line); }
.reading-ledger { display:grid; grid-template-columns:minmax(190px,.45fr) minmax(0, 1fr); gap:2rem; padding:2rem; background:var(--slate-850); color:#fff; }
.reading-ledger h2,.reading-ledger p { color:#fff; }
.reading-ledger ol { margin:0; padding:0; list-style:none; }
.reading-ledger li { display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:1rem; padding:.65rem 0; color:#e5e2e6; border-bottom:1px solid #444957; }
.reading-ledger li a { color:#fff; }
.reading-ledger li span { color:#d3a0ac; font-size:.75rem; }
.tag-cloud { display:flex; flex-wrap:wrap; gap:.65rem; }
.tag-chip { display:inline-flex; padding:.5rem .75rem; background:#efe0e4; color:var(--rose-dark); border:1px solid #d6aab5; border-radius:999px; text-decoration:none; }
.author-grid,.tool-grid { display:grid; grid-template-columns:repeat(2,minmax(0, 1fr)); gap:1rem; }
.author-grid article,.tool-card { padding:1.25rem; background:#fff; border-top:3px solid var(--rose); box-shadow:4px 4px 0 #e4dcd2; }
.steps { padding-left:1.3rem; }
.steps li { padding:.35rem .2rem; }
.faq details { margin:.7rem 0; background:#fff; border:1px solid var(--line); }
.faq summary { padding:1rem; font-weight:700; cursor:pointer; }
.faq details p { padding:0 1rem 1rem; }
.byline { padding-top:.8rem; border-top:1px dashed var(--line); font-size:.88rem; }
.example { padding:1rem; background:#eee6df; border-left:4px solid var(--rose); }
.pager { display:grid; grid-template-columns:repeat(2,minmax(0, 1fr)); gap:1rem; margin-top:1.2rem; }
.pager a { padding:1rem; background:#fff; border:1px solid var(--line); }
.route-card { display:grid; grid-template-columns:repeat(3,minmax(0, 1fr)); gap:1rem; list-style:none; padding:0; }
.route-card li { min-width:0; padding:1rem; background:#fff; border:1px solid var(--line); }
.route-card li span { display:grid; place-items:center; width:32px; height:32px; background:var(--rose); color:#fff; }
.copy-button { border:0; background:var(--slate-850); color:#fff; padding:.75rem 1rem; font:inherit; cursor:pointer; }
.copy-status { min-height:1.4em; }
.worksheet { max-width:100%; overflow:auto; padding:1rem; background:#242732; color:#f9f3ec; white-space:pre-wrap; }
.text-link { color:var(--rose-dark); font-weight:700; }
.site-footer { display:grid; grid-template-columns:minmax(0,.7fr) minmax(0, 1fr); gap:2rem; padding:2.5rem clamp(1rem,3vw,3rem); background:var(--slate-950); color:#d9d7dc; }
.site-footer p { line-height:1.7; }
.site-footer nav { display:flex; flex-wrap:wrap; align-content:center; justify-content:flex-end; gap:.65rem 1rem; }
.footer-mark { color:#e1a6b4; }
.site-footer a { color:#fff; }
code { padding:.1em .3em; background:#e9e2db; border-radius:3px; }
@media (max-width:1050px) { .tile-grid { grid-template-columns:repeat(2,minmax(0, 1fr)); } .top-nav a:nth-child(n+6) { display:none; } }
@media (max-width:900px) { .site-header { flex-wrap:wrap; } .top-nav { order:3; width:100%; } .rail-toggle { display:block; } .desk-layout { grid-template-columns:minmax(0, 1fr); } .section-rail { position:static; display:none; } .section-rail[data-open="true"] { display:block; } .page-hero { grid-template-columns:minmax(0, 1fr); min-height:290px; } .editor-stamp { display:none; } .reading-ledger { grid-template-columns:minmax(0, 1fr); } .route-card { grid-template-columns:minmax(0, 1fr); } }
@media (max-width:640px) { .site-header { gap:.7rem; padding:.65rem 1rem; } .brand { min-width:0; flex:1; } .brand-number { width:36px; height:36px; } .brand small { font-size:.6rem; } .rail-toggle { font-size:.82rem; } .top-nav { width:100%; gap:.1rem; padding:.1rem 0; } .top-nav a { padding:.4rem .5rem; font-size:.78rem; } .top-nav a:nth-child(n+5) { display:none; } main { padding:0 1rem 3rem; } .page-hero { padding:2.5rem 0 1.8rem; } .page-hero h1 { font-size:clamp(2rem,12vw,3.25rem); letter-spacing:-.045em; } .desk-layout { padding-top:1rem; } .tile-grid,.author-grid,.tool-grid,.note-grid,.pager { grid-template-columns:minmax(0, 1fr); } .editorial-tile:nth-child(3n+2) { transform:none; } .reading-ledger { padding:1.2rem; } .reading-ledger li { grid-template-columns:minmax(0, 1fr); } .site-footer { grid-template-columns:minmax(0, 1fr); } .site-footer nav { justify-content:flex-start; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { animation:none!important; transition:none!important; } }