/* SectorZero — halaman dokumen (docs, terms, privacy, transparency, 404) */
.doc-hero { position: relative; padding: 150px var(--g) 50px; overflow: hidden; border-bottom: 1px solid var(--line); isolation: isolate; }
.doc-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; opacity: .5; }
.doc-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(4, 6, 10, .96), rgba(4, 6, 10, .7) 50%, rgba(4, 6, 10, .3)), linear-gradient(0deg, var(--bg), transparent 60%); }
.doc-hero .micro { margin: 0 0 18px; }
.doc-hero .micro b { color: var(--ice); margin-right: 6px; }
.doc-hero h1 { margin: 0; font: 400 clamp(32px, 4.6vw, 70px)/1.04 var(--display); letter-spacing: -.02em; text-transform: uppercase; }
.doc-hero h1 em { font-style: normal; color: transparent; background: linear-gradient(180deg, #9aa7bd, #5b667b); -webkit-background-clip: text; background-clip: text; }
.doc-hero p.lede { margin: 20px 0 0; }
.doc { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: clamp(30px, 5vw, 80px); padding: 50px var(--g) 110px; }
.toc { position: sticky; top: 92px; align-self: start; display: grid; gap: 2px; }
.toc .micro { margin: 0 0 12px; }
.toc a { padding: 7px 0 7px 14px; border-left: 1px solid var(--line); color: var(--mute); font-size: 13.5px; transition: color .2s, border-color .2s; }
.toc a:hover, .toc a.on { color: var(--text); border-left-color: var(--ice); }
.prose { max-width: 760px; }
.prose section { padding-top: 10px; margin-bottom: 54px; scroll-margin-top: 90px; }
.prose h2 { margin: 0 0 18px; font: 400 clamp(17px, 1.75vw, 24px)/1.1 var(--display); text-transform: uppercase; letter-spacing: -.01em; display: flex; gap: 14px; align-items: baseline; }
.prose h2 .n { font: 400 11px/1 var(--display); color: var(--ice); }
.prose h3 { margin: 28px 0 10px; font: 700 15px/1.3 var(--sans); }
.prose p, .prose li { color: #aab4c6; font-size: 15px; line-height: 1.75; }
.prose p strong, .prose li strong { color: var(--text); }
.prose a { color: var(--ice); border-bottom: 1px solid rgba(180, 208, 255, .3); }
.prose ul, .prose ol { padding-left: 20px; }
.prose code { font: 500 13px var(--mono); color: var(--ice); background: rgba(127, 168, 242, .08); padding: 1px 6px; border-radius: 5px; }
.prose pre { margin: 16px 0; padding: 18px 20px; border-radius: 14px; border: 1px solid var(--line2); background: rgba(6, 9, 15, .8); overflow-x: auto; font: 500 12.5px/1.7 var(--mono); color: #c6d0e0; }
.prose pre code { background: none; padding: 0; color: inherit; font-size: inherit; }
.prose table { width: 100%; border-collapse: collapse; margin: 16px 0; font-size: 14px; }
.prose th { text-align: left; font: 600 9.5px/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--dim); padding: 0 12px 12px 0; }
.prose td { padding: 11px 12px 11px 0; border-top: 1px solid var(--line); color: #aab4c6; vertical-align: top; }
.prose td:first-child { color: var(--text); font-weight: 600; white-space: nowrap; }
.callout { padding: 16px 18px; border-radius: 12px; border: 1px solid rgba(180, 208, 255, .25); background: rgba(127, 168, 242, .06); color: #c3cee0; font-size: 14px; line-height: 1.65; margin: 18px 0; }
.updated { color: var(--dim); font-size: 13px; }
@media (max-width: 900px) { .doc { grid-template-columns: 1fr; } .toc { position: static; display: none; } .doc-hero { padding-top: 130px; } }

/* 404 */
.lost { position: relative; min-height: 100svh; display: grid; place-items: center; text-align: center; padding: 120px var(--g) 60px; overflow: hidden; isolation: isolate; }
.lost > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 70%; z-index: -2; }
.lost::after { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 50% 40%, rgba(4, 6, 10, .3), rgba(4, 6, 10, .9) 70%); }
.lost .code { font: 400 clamp(80px, 15vw, 200px)/.9 var(--display); letter-spacing: -.04em; color: transparent; background: linear-gradient(180deg, rgba(232, 237, 246, .9), rgba(232, 237, 246, .15)); -webkit-background-clip: text; background-clip: text; margin: 0; }
.lost h1 { margin: 18px 0 10px; font: 400 clamp(16px, 1.9vw, 24px)/1.1 var(--display); text-transform: uppercase; }
.lost p { color: var(--mute); margin: 0 auto 26px; max-width: 30em; }
.doc > *, .prose section { min-width: 0; }
@media (max-width: 700px) { .prose table { display: block; overflow-x: auto; } }
