@import url("./theme.css");
@import url("./components.css");

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;padding:18px 0;background:var(--s-canvas-texture),var(--bg);color:var(--text);font-family:var(--s-font-body);line-height:1.55}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
.wrap{width:min(var(--max),calc(100% - 36px));margin:auto}
body>header.wrap{width:min(calc(var(--max) + 44px),calc(100% - 36px));padding:20px 22px 18px;background:var(--s-paper-texture),var(--s-color-surface);border:var(--s-rule) solid var(--line);border-bottom:0;border-radius:var(--radius) var(--radius) 0 0;box-shadow:var(--s-shadow-soft)}
body>main{width:min(calc(var(--max) + 44px),calc(100% - 36px));margin:auto;background:var(--s-paper-texture),var(--s-color-surface);border-left:var(--s-rule) solid var(--line);border-right:var(--s-rule) solid var(--line)}
body>main>.wrap{width:min(var(--max),calc(100% - 44px))}
body>footer.wrap{width:min(calc(var(--max) + 44px),calc(100% - 36px));padding:38px 22px 46px;background:var(--s-paper-texture),var(--s-color-surface);border:var(--s-rule) solid var(--line);border-top:0;border-radius:0 0 var(--radius) var(--radius);box-shadow:var(--s-shadow-soft)}
.nav{display:flex;align-items:center;justify-content:space-between;border-bottom:var(--s-rule) solid var(--line)}
.brand{display:flex;align-items:center;gap:11px;font-family:var(--s-font-display);font-size:22px;font-weight:700;color:var(--s-color-heading);letter-spacing:-.015em}
.mark{width:31px;height:31px;border:var(--s-rule) solid var(--accent);border-radius:var(--s-radius-small);display:grid;place-items:center;color:var(--accent);font-family:var(--s-font-body);font-size:14px;font-weight:800;background:var(--s-color-accent-soft)}
.navlinks{display:flex;gap:22px;align-items:center;color:var(--muted);font-size:14px}.navlinks a:hover{color:var(--s-color-heading)}
.pill{padding:9px 14px;border-radius:999px;border:var(--s-rule) solid var(--line);background:var(--s-color-surface-raised)}
.pill.primary{border-color:var(--accent);background:var(--accent);color:var(--s-color-accent-contrast);font-weight:750}
.hero{padding:82px 0 62px;display:grid;grid-template-columns:1.22fr .78fr;gap:60px;align-items:center}
.kicker{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-weight:800}
h1,h2,h3{font-family:var(--s-font-display);color:var(--s-color-heading);font-weight:700}
.hero h1{font-size:clamp(48px,7vw,84px);line-height:1;letter-spacing:-.045em;margin:13px 0 24px;max-width:850px}
.hero p{font-size:20px;color:var(--text);max-width:720px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;border-radius:var(--s-radius-small);border:var(--s-rule) solid var(--line);font-weight:750;background:var(--s-color-surface-raised);color:var(--s-color-heading)}
.btn.primary{background:var(--accent);color:var(--s-color-accent-contrast);border-color:var(--accent)}
.hero-card,.card{background:var(--s-paper-texture),var(--s-color-surface-raised);border:var(--s-rule) solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.hero-card{padding:22px}
.statushead{display:flex;justify-content:space-between;align-items:center;padding-bottom:18px;border-bottom:var(--s-rule) solid var(--line)}
.statusdot{width:8px;height:8px;background:var(--accent);border-radius:50%;box-shadow:0 0 0 4px var(--s-color-accent-soft)}
.timeline{display:grid;gap:8px;margin-top:16px}.event{display:grid;grid-template-columns:60px 1fr auto;gap:12px;padding:12px;border-radius:var(--s-radius-small);background:var(--s-color-surface-soft)}
.event small,.muted{color:var(--muted)}
.section{padding:66px 0}.section h2{font-size:clamp(34px,4vw,52px);line-height:1.08;letter-spacing:-.03em;margin:8px 0 18px}.lead{font-size:18px;color:var(--text);max-width:760px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px}.card{padding:24px}.card h3{margin:8px 0 10px;font-size:21px}.card p{color:var(--muted)}
.num{color:var(--accent);font:700 12px var(--s-font-mono)}
.modules{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:30px}.module{padding:22px;border:var(--s-rule) solid var(--line);border-radius:var(--radius);background:var(--s-color-surface-raised);display:flex;justify-content:space-between;gap:20px}.module strong{display:block;margin-bottom:5px}.tag{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);font-weight:800}
.flow{display:flex;gap:0;align-items:stretch;overflow:auto;margin-top:34px;padding-bottom:6px}.flowbox{min-width:145px;padding:18px;border:var(--s-rule) solid var(--line);background:var(--s-color-surface-raised);border-radius:var(--radius)}.arrow{display:grid;place-items:center;color:var(--accent);padding:0 9px}
.band{margin:40px 0;padding:32px;border:var(--s-rule) solid var(--line);border-radius:var(--radius);background:var(--s-color-accent-soft)}
.metricgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric{padding:18px;border:var(--s-rule) solid var(--line);border-radius:var(--radius);background:var(--s-color-surface-raised)}.metric .value{font-size:28px;font-weight:800;letter-spacing:-.04em}.metric .label{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
.good{color:var(--s-color-success)}.warning{color:var(--s-color-warning)}.bad{color:var(--s-color-exception)}
.footer{color:var(--muted);font-size:13px}
.pagehead{padding:66px 0 36px}.pagehead h1{font-size:clamp(42px,6vw,70px);letter-spacing:-.04em;line-height:1.03;margin:10px 0}
.table{width:100%;border-collapse:collapse;margin-top:24px}.table th,.table td{text-align:left;padding:13px;border-bottom:var(--s-rule) solid var(--line);font-size:14px}.table th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.threadhead{display:flex;justify-content:space-between;gap:20px;align-items:end}.threadid{font-family:var(--s-font-mono);color:var(--muted);font-size:12px}
.threshold{display:grid;grid-template-columns:180px 1fr 110px;gap:12px;align-items:center;padding:14px 0;border-bottom:var(--s-rule) solid var(--line)}.bar{height:7px;background:var(--s-color-surface-soft);border-radius:999px;overflow:hidden}.bar i{height:100%;display:block;background:var(--accent);border-radius:999px}
.schema{font-family:var(--s-font-mono);font-size:12px;color:var(--text);background:var(--s-color-surface-soft);border:var(--s-rule) solid var(--line);border-radius:var(--radius);padding:18px;overflow:auto}
.notice{padding:13px 15px;border-left:3px solid var(--warn);background:var(--s-overlay-warning);color:var(--text);border-radius:var(--s-radius-small)}
.form{display:grid;gap:13px;max-width:680px}.form label{font-size:13px;color:var(--text)}.form input,.form textarea,.form select{width:100%;margin-top:6px;background:var(--s-color-surface-raised);border:var(--s-rule) solid var(--line);color:var(--text);border-radius:var(--s-radius-small);padding:12px}.form input:focus,.form textarea:focus,.form select:focus{outline:2px solid var(--s-color-accent-soft);border-color:var(--accent)}.form textarea{min-height:130px;resize:vertical}.small{font-size:12px;color:var(--muted)}
.emptybucket{border-style:dashed!important;border-color:var(--s-color-empty)!important;color:var(--s-color-empty)!important;background:var(--s-color-surface)!important}
.compactvalue{font-size:16px!important;line-height:1.2;overflow-wrap:anywhere}
.adminplane{border:var(--s-rule) solid var(--accent);background:var(--s-color-accent-soft);padding:24px;border-radius:var(--radius)}
.badge{display:inline-flex;padding:4px 8px;border:var(--s-rule) solid var(--line);border-radius:999px;font-size:11px;text-transform:uppercase;letter-spacing:.08em;background:var(--s-color-surface-raised)}
.spine{border-left:2px solid var(--line);padding-left:18px}.spineitem{position:relative;padding:10px 0}.spineitem:before{content:"";position:absolute;left:-24px;top:17px;width:10px;height:10px;border-radius:50%;background:var(--accent)}
.tiny{padding:7px 10px;font-size:12px;border-radius:var(--s-radius-small);cursor:pointer}.badge.direct{border-color:var(--s-color-info);color:var(--s-color-info)}.badge.seam{border-color:var(--warn);color:var(--warn)}.badge.verified{border-color:var(--s-color-success);color:var(--s-color-success)}
.formstatus{padding:12px 14px;border-radius:var(--s-radius-small);border:var(--s-rule) solid var(--line);display:none}.formstatus.show{display:block}.formstatus.success{border-color:var(--s-color-success);color:var(--s-color-success);background:var(--s-color-accent-soft)}.formstatus.error{border-color:var(--bad);color:var(--bad);background:var(--s-overlay-exception)}
.trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.calmbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:12px 0}.stack{display:grid;gap:14px}.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}

@media(max-width:820px){body{padding:10px 0}body>header.wrap,body>main,body>footer.wrap{width:calc(100% - 20px)}body>main>.wrap{width:calc(100% - 30px)}.hero{grid-template-columns:1fr;padding-top:55px;gap:30px}.navlinks a:not(.pill){display:none}.grid3,.metricgrid{grid-template-columns:1fr 1fr}.modules{grid-template-columns:1fr}.threadhead{align-items:start;flex-direction:column}.threshold{grid-template-columns:1fr}.hero h1{font-size:54px}.two{grid-template-columns:1fr}}
@media(max-width:520px){.grid3,.metricgrid{grid-template-columns:1fr}.hero h1{font-size:46px}.event{grid-template-columns:50px 1fr}.event>span:last-child{display:none}}