/* Valermine Docs page (2026-10-19): website colours, pixel headings, readable tables. */
@font-face{font-family:WebsitePixel;src:url('/assets/fonts/pixelify-sans-v2.ttf') format('truetype');font-weight:400 700;font-display:swap}
:root{color-scheme:dark;--ink:#0b0712;--panel:#160d24;--panel-2:#1d1130;--gold:#edc986;--gold-hot:#ffd56a;--purple:#c695f6;--text:#e9dff5;--muted:#b5a6c6;--line:#bea0db2a;--font:Inter,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:radial-gradient(120% 60% at 50% -10%,#3a1d6a 0,#140a24 45%,var(--ink) 100%) fixed;color:var(--text);font:16px/1.7 var(--font)}
a{color:var(--gold)}a:hover{color:var(--gold-hot)}
.skip-link{position:absolute;left:-999px}.skip-link:focus{left:16px;top:12px;z-index:10;background:var(--gold);color:#241610;padding:8px 12px;border-radius:8px}
.docs-header{position:sticky;top:0;z-index:5;background:#0d0717e6;backdrop-filter:blur(8px);border-bottom:1px solid #e4aa3555}
.docs-header-inner{max-width:1240px;margin:auto;display:flex;align-items:center;gap:14px;padding:10px 24px}
.docs-brand img{display:block;width:150px;height:auto}
.docs-badge{font:700 13px WebsitePixel,monospace;letter-spacing:.12em;color:#241610;background:var(--gold);padding:3px 9px;border-radius:6px}
.docs-header nav{margin-left:auto;display:flex;align-items:center;gap:18px}
.docs-header nav a{text-decoration:none;font-weight:600}
.docs-play{display:inline-block;padding:9px 16px;border-radius:10px;border:2px solid #fff1b8;background:linear-gradient(180deg,#ffd769 0 52%,#f0a21f 52%);color:#2a1300!important;font:700 15px WebsitePixel,monospace;text-decoration:none;box-shadow:0 4px 0 #6a3500}
.docs-play:hover{filter:brightness(1.08)}
.docs-layout{max-width:1240px;margin:auto;display:grid;grid-template-columns:240px minmax(0,1fr);gap:48px;padding:40px 24px 24px}
.docs-toc{position:sticky;top:96px;align-self:start;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 18px 14px}
.docs-toc-title{margin:0 0 8px;font:700 12px WebsitePixel,monospace;letter-spacing:.14em;color:var(--gold)}
.docs-toc ol{margin:0;padding:0;list-style:none;counter-reset:t}
.docs-toc li{counter-increment:t}
.docs-toc a{display:block;padding:6px 8px;border-radius:8px;color:var(--muted);text-decoration:none;font-size:14px}
.docs-toc a::before{content:counter(t,decimal-leading-zero)" ";color:#7d5fa6;font:600 12px WebsitePixel,monospace}
.docs-toc a:hover{background:var(--panel-2);color:var(--text)}
.docs-main{min-width:0;max-width:860px}
.docs-eyebrow{margin:0;font:700 13px WebsitePixel,monospace;letter-spacing:.16em;color:var(--purple)}
h1{margin:6px 0 4px;font:700 clamp(38px,5vw,56px)/1.1 WebsitePixel,monospace;color:#fff4dc;text-shadow:0 3px 0 #3a1a05}
.docs-updated{margin:0 0 28px;color:var(--muted);font-size:14px}
section{background:linear-gradient(180deg,#1b0f2dcc,#130a20cc);border:1px solid var(--line);border-radius:16px;padding:26px 30px;margin:0 0 22px}
h2{margin:0 0 12px;font:700 28px/1.2 WebsitePixel,monospace;color:var(--gold-hot);text-shadow:0 2px 0 #3a1a05}
p{margin:0 0 12px}ul,ol{margin:0 0 12px;padding-left:22px}li{margin:4px 0}
strong{color:#fff4dc}
.docs-steps{counter-reset:s;list-style:none;padding:0}
.docs-steps li{counter-increment:s;position:relative;padding:10px 12px 10px 52px;margin:8px 0;background:var(--panel-2);border-radius:12px}
.docs-steps li::before{content:counter(s);position:absolute;left:12px;top:10px;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--gold);color:#241610;font:700 15px WebsitePixel,monospace}
.docs-table{overflow-x:auto;margin:6px 0 14px;border:1px solid var(--line);border-radius:12px}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th{background:#24143b;color:var(--gold);text-align:left;font:700 13px WebsitePixel,monospace;letter-spacing:.04em;padding:10px 12px;white-space:nowrap}
td{padding:9px 12px;border-top:1px solid var(--line);white-space:nowrap}
tbody tr:nth-child(even) td{background:#ffffff05}
.num{text-align:right;font-variant-numeric:tabular-nums}
.rarity{color:var(--r);font-weight:700}
.docs-faq dt{margin:14px 0 4px;font-weight:700;color:#fff4dc}.docs-faq dd{margin:0;color:var(--text)}
.docs-cta{text-align:center;padding:30px 0 10px}.docs-cta p{font:700 22px WebsitePixel,monospace;color:var(--purple);margin:0 0 14px}
.docs-footer{max-width:1240px;margin:20px auto 0;padding:22px 24px 36px;display:flex;gap:22px;flex-wrap:wrap;color:var(--muted);font-size:14px;border-top:1px solid var(--line)}
@media(max-width:900px){.docs-layout{grid-template-columns:1fr;gap:20px;padding:24px 16px}.docs-toc{position:static}.docs-toc ol{display:grid;grid-template-columns:1fr 1fr}section{padding:20px 18px}h2{font-size:24px}.docs-header-inner{padding:10px 16px}.docs-brand img{width:120px}.docs-header nav a:not(.docs-play){display:none}}
@media(max-width:480px){.docs-toc ol{grid-template-columns:1fr}}
/* Fit the wide depth table and keep the phone layout short. */
.docs-main{max-width:940px}
th{white-space:normal;vertical-align:bottom;line-height:1.25}
td,th{padding-left:10px;padding-right:10px}
@media(max-width:900px){.docs-toc{padding:10px 12px;border-radius:12px}.docs-toc-title{display:none}.docs-toc ol{display:flex!important;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}.docs-toc ol::-webkit-scrollbar{display:none}.docs-toc a{white-space:nowrap;background:var(--panel-2);padding:6px 10px}.docs-toc a::before{content:none}}
@media(max-width:900px){.docs-layout{grid-template-columns:minmax(0,1fr)}.docs-toc{min-width:0;max-width:100%}}
body{overflow-x:hidden}