@import url('https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap');

:root{--lg-or:#ff6a00;--lg-am:#ffb000;--lg-line:rgba(255,255,255,.1);--lg-ease:cubic-bezier(.16,1,.3,1)}
html{scroll-behavior:smooth}

/* ---------- scroll progress + back to top (all pages) ---------- */
.lg-prog{position:fixed;top:0;left:0;right:0;height:3px;z-index:300;pointer-events:none;background:linear-gradient(90deg,var(--lg-or),var(--lg-am));transform:scaleX(0);transform-origin:left}
.lg-top{position:fixed;right:22px;bottom:22px;z-index:200;width:44px;height:44px;border-radius:50%;border:1px solid var(--lg-line);background:rgba(17,17,20,.85);color:#f5f5f4;font-size:18px;cursor:pointer;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .35s,transform .35s var(--lg-ease),background .25s,color .25s;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.lg-top.on{opacity:1;transform:none;pointer-events:auto}
.lg-top:hover{background:var(--lg-or);color:#150900}

/* ---------- staggered reveal (only when JS is running) ---------- */
.js .lg-rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--lg-ease),transform .8s var(--lg-ease)}
.js .lg-rv.in{opacity:1;transform:none}

/* ---------- header injected on card-style pages ---------- */
.lg-nav{position:sticky;top:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:16px 32px;border-bottom:1px solid transparent;transition:background .3s,border-color .3s,padding .3s}
.lg-nav.s{background:rgba(8,8,10,.8);border-color:var(--lg-line);padding:11px 32px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.lg-brand{display:flex;align-items:center;gap:10px;font:600 19px 'Inter Tight',sans-serif;letter-spacing:-.02em;color:#f5f5f4;text-decoration:none}
.lg-brand i{width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,var(--lg-or),var(--lg-am));display:grid;place-items:center;font:700 13px 'Inter Tight',sans-serif;color:#150900;font-style:normal}
.lg-back{font:500 12.5px 'DM Mono',monospace;letter-spacing:.05em;text-transform:uppercase;color:#a3a3a0;text-decoration:none;position:relative;padding:4px 0}
.lg-back::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .45s var(--lg-ease)}
.lg-back:hover{color:#f5f5f4;text-decoration:none}
.lg-back:hover::after{transform:scaleX(1);transform-origin:left}

/* ---------- editorial layout for card-style pages ---------- */
.container{max-width:1180px;display:grid;grid-template-columns:240px minmax(0,1fr);column-gap:64px;align-items:start;padding-top:56px;font-family:'Inter Tight',-apple-system,sans-serif}
.container>.hero,.container>.footer{grid-column:1/-1}
.container>.card{grid-column:2}
.container .hero{text-align:left;margin-bottom:56px}
.container .hero h1{font-weight:600;font-size:clamp(38px,6.2vw,76px);line-height:1;letter-spacing:-.045em;margin-bottom:22px;background:linear-gradient(90deg,var(--lg-or),var(--lg-am));-webkit-background-clip:text;background-clip:text;color:transparent}
.container .hero p{font:500 12.5px 'DM Mono',monospace;letter-spacing:.05em;text-transform:uppercase}
.container .hero::after{content:"";display:block;height:2px;width:0;margin-top:30px;background:linear-gradient(90deg,var(--lg-or),var(--lg-am));transition:width 1.2s .35s var(--lg-ease)}
.container .hero.in::after{width:120px}
.container .card{background:none;border:0;border-top:1px solid var(--lg-line);border-radius:0;padding:40px 0 32px;margin:0;position:relative}
.container .card::before{content:"";position:absolute;left:-24px;top:44px;bottom:36px;width:2px;background:linear-gradient(var(--lg-or),var(--lg-am));transform:scaleY(0);transform-origin:top;transition:transform .6s var(--lg-ease)}
.container .card:hover::before{transform:scaleY(1)}
.container .card h2{font-weight:600;font-size:clamp(22px,2.4vw,30px);letter-spacing:-.03em;color:#f5f5f4}
.container .card h2::after{content:"";display:block;height:2px;width:0;margin-top:12px;background:linear-gradient(90deg,var(--lg-or),var(--lg-am));transition:width .9s .25s var(--lg-ease)}
.container .card.in h2::after{width:44px}
.container .card h3{font-weight:600;font-size:17px;margin:26px 0 10px;color:#f5f5f4;letter-spacing:-.01em}
.container .card p,.container .card li{color:#a9a9a6;line-height:1.75}
.container .card strong{color:#f5f5f4}
.container .notice{transition:transform .4s var(--lg-ease),box-shadow .4s}
.container .notice:hover{transform:translateX(4px);box-shadow:0 10px 40px rgba(255,106,0,.08)}
.container .footer{border-top:1px solid var(--lg-line);padding-top:30px;margin-top:40px}

/* ---------- sticky table of contents with scroll-spy ---------- */
.lg-toc{grid-column:1;grid-row:2/span 200;position:sticky;top:84px;max-height:calc(100vh - 110px);overflow:auto;scrollbar-width:thin;padding-right:6px}
.lg-toc .l{font:500 11.5px 'DM Mono',monospace;letter-spacing:.09em;text-transform:uppercase;color:var(--lg-am);margin-bottom:14px}
.lg-toc ol{list-style:none;border-left:1px solid var(--lg-line)}
.lg-toc a{display:block;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;color:#8d8d8a;font-size:13px;line-height:1.4;text-decoration:none;transition:color .25s,border-color .25s,padding-left .3s var(--lg-ease)}
.lg-toc a:hover{color:#f5f5f4;text-decoration:none}
.lg-toc a.act{color:#f5f5f4;border-left-color:var(--lg-or);padding-left:20px}

/* ---------- cross-page legal links in footer ---------- */
.lg-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 26px;margin:0 0 22px}
.lg-links a{font:500 12.5px 'DM Mono',monospace;letter-spacing:.04em;text-transform:uppercase;color:#8d8d8a;text-decoration:none;transition:color .2s}
.lg-links a:hover,.lg-links a.cur{color:var(--lg-am);text-decoration:none}

@media(max-width:900px){
 .container{grid-template-columns:1fr;padding-top:32px}
 .container>.card{grid-column:1}
 .lg-toc{display:none}
 .container .card::before{display:none}
 .lg-nav,.lg-nav.s{padding-left:20px;padding-right:20px}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 .js .lg-rv{opacity:1;transform:none;transition:none}
 *{transition-duration:.001ms!important}
}

/* ---------- base styles for full pages (<body class="lg">) ---------- */
body.lg{--bg:#08080A;--card:#111114;--accent:#FFB000;--text:#ECECEC;--muted:#9F9F9F;--border:#262626;margin:0;background:var(--bg);color:var(--text);font-family:'Inter Tight',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.8;-webkit-font-smoothing:antialiased}
.lg *{box-sizing:border-box}
.lg h1,.lg h2,.lg h3,.lg p,.lg ul{margin:0}
.lg .container{margin:0 auto;padding-left:24px;padding-right:24px;padding-bottom:80px}
.lg .card h2{margin-bottom:16px}
.lg p{margin-bottom:18px}
.lg ul{padding-left:24px;margin-bottom:12px}
.lg li{margin-bottom:12px}
.lg a{color:var(--accent);text-decoration:none}
.lg .hero p{color:var(--muted);margin:0}
.lg .notice{background:rgba(255,176,0,.08);border-left:4px solid var(--accent);padding:20px;border-radius:12px;margin-top:20px}
.lg .footer{text-align:center;color:var(--muted);margin-top:50px}