*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--color-bg);color:var(--color-ink);font-family:var(--font-body);font-size:var(--text-body);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit}
img,svg{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}
:focus:not(:focus-visible){outline:none}
::selection{background:var(--color-brand);color:var(--color-on-brand)}

.wrap{max-width:var(--container);margin-inline:auto;padding-inline:var(--space-5)}
.section{padding-block:var(--space-8)}
.rule{flex:1;height:1px;background:var(--color-line)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.eyebrow-spec{font-family:var(--font-mono);font-size:11px;font-weight:var(--weight-bold);letter-spacing:var(--ls-spec-wide);color:var(--color-brand);text-transform:uppercase}
.lab{font-family:var(--font-body);font-size:var(--text-note);font-weight:var(--weight-heavy);letter-spacing:.04em;color:var(--color-brand)}
.mono{font-family:var(--font-mono)}

.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap-min);padding:var(--pad-pill);border-radius:var(--radius-pill);border:none;font-family:var(--font-body);font-weight:var(--weight-heavy);font-size:var(--text-small);line-height:1;transition:background var(--motion-fast) var(--ease),border-color var(--motion-fast) var(--ease),transform var(--motion-fast) var(--ease)}
.pill--brand{background:var(--color-brand);color:var(--color-on-brand)}
.pill--brand:hover{background:var(--color-brand-strong)}
.pill--ghost{background:none;color:var(--color-ink);border:1px solid var(--color-line-strong);font-weight:var(--weight-bold)}
.pill--ghost:hover{border-color:var(--color-ink)}
.pill:active{transform:translateY(1px)}
.pill:disabled,.pill[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.pill--sm{min-height:auto;padding:var(--pad-pill-sm);font-size:var(--text-note)}
.pill--lg{padding:var(--pad-pill-lg);font-size:var(--text-lede)}
.pill--block{width:100%}

.chip-cap{display:inline-flex;align-items:center;gap:7px;background:var(--color-surface);border:1px solid var(--color-line-strong);border-radius:var(--radius-md);padding:9px 14px;font-family:var(--font-mono);font-size:var(--text-spec);letter-spacing:var(--ls-mono-tight);color:var(--color-ink);white-space:nowrap}
.chip-cap i{font-style:normal;color:var(--color-brand);font-weight:var(--weight-bold)}
.chip-cap--pending i{color:var(--color-ink-2)}
.chip-part{display:inline-flex;align-items:center;gap:7px;background:var(--color-surface);border:1px solid var(--color-line-strong);border-radius:var(--radius-md);padding:8px 13px;font-family:var(--font-body);font-size:11.5px;font-weight:var(--weight-medium);color:var(--color-ink);white-space:nowrap}
.chip-part i{font-style:normal;color:var(--color-brand);font-weight:var(--weight-bold)}
.chip-part--pending i{color:var(--color-ink-2)}

.tag{display:inline-flex;align-items:center;font-family:var(--font-body);font-size:11px;font-weight:var(--weight-bold);padding:4px 11px;border-radius:var(--radius-pill);border:1px solid var(--color-line);color:var(--color-ink-2);white-space:nowrap}
.tag--ok{color:var(--color-success);border-color:var(--color-success-line)}
.tag--warn{color:var(--color-warning);border-color:var(--color-warning-line)}
.tag--soon{color:var(--color-ink-2);border-color:var(--color-line)}

.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-body);font-size:var(--text-note);font-weight:var(--weight-bold);padding:var(--pad-badge);border-radius:var(--radius-pill);border:1px solid var(--color-line)}
.badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.badge.done{color:var(--color-success);border-color:var(--color-success-line);background:var(--color-success-soft)}
.badge.running{color:var(--color-warning);border-color:var(--color-warning-line);background:var(--color-warning-soft)}
.badge.running::before{animation:badge-blink 1.4s ease-in-out infinite}
.badge.failed{color:var(--color-error);border-color:var(--color-error-line);background:var(--color-error-soft)}
.badge.degraded{color:var(--color-warning);border-color:var(--color-warning-line);background:var(--color-warning-soft)}
.badge.idle{color:var(--color-ink-2);border-color:var(--color-line)}
@keyframes badge-blink{50%{opacity:.35}}

.card{background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius-card)}
.card--s2{background:var(--color-surface-2)}
.card--interactive{transition:border-color var(--motion-fast) var(--ease)}
.card--interactive:hover{border-color:var(--color-line-strong)}
.card.is-selected{border-color:var(--color-brand)}

.specbox{position:relative;background:var(--color-surface);border:1px solid var(--color-block);border-radius:var(--radius-card)}
.specbox::before,.specbox::after{content:'';position:absolute;width:14px;height:14px;border:2px solid var(--color-brand-line)}
.specbox::before{top:-6px;inset-inline-start:-6px;border-bottom:none;border-inline-end:none}
.specbox::after{bottom:-6px;inset-inline-end:-6px;border-top:none;border-inline-start:none}
.specbox .top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:var(--pad-head-sm);border-bottom:1px solid var(--color-line);font-family:var(--font-mono);font-size:var(--text-spec);letter-spacing:var(--ls-spec);color:var(--color-ink-2)}
.specbox .top b{color:var(--color-brand);display:flex;align-items:center;gap:7px}
.specbox .top b::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--color-brand);animation:spec-pulse 2.2s ease-in-out infinite}
.specbox .top span:last-child{font-family:var(--font-body);letter-spacing:0;font-size:11.5px;font-weight:var(--weight-medium)}
.specbox .bd{padding:16px;font-size:var(--text-body);line-height:var(--leading-snug)}
@keyframes spec-pulse{50%{opacity:.25}}
.specbox--typewriter .bd{display:flex;align-items:center;gap:14px;min-height:26px}
.caret{display:inline-block;width:2px;height:1.05em;background:var(--color-brand);vertical-align:-2px;animation:caret-blink 1s steps(1) infinite}
@keyframes caret-blink{50%{opacity:0}}
.specbox--doc .bd{line-height:1.7;font-size:14.5px}
.specbox--doc .att{display:flex;gap:8px;padding:0 16px 16px}
.specbox--doc .att span{font-family:var(--font-body);font-size:11.5px;font-weight:var(--weight-medium);color:var(--color-ink-2);border:1px dashed var(--color-line-strong);border-radius:var(--radius-sm);padding:5px 10px}
.specbox--log{overflow:hidden}
.specbox--log .top b{color:var(--color-brand)}
.specbox--log .top b::before{background:var(--color-brand)}
.specbox--log .log{padding:16px;font-family:var(--font-mono);font-size:11px;line-height:2.1;color:var(--color-ink-2)}
.specbox--log .log i{font-style:normal;color:var(--color-success)}
.specbox--log .log .cur{color:var(--color-ink)}
.specbox--log .log .cur::after{content:'▊';color:var(--color-brand);animation:caret-blink 1s steps(1) infinite}
.specbox--log .progress{height:5px;background:var(--color-line)}
.specbox--log .progress i{display:block;height:100%;background:var(--color-brand)}

.stage-ind{display:flex;flex-wrap:wrap;gap:10px;list-style:none;font-family:var(--font-mono);font-size:var(--text-spec);letter-spacing:var(--ls-spec)}
.stage-ind li{display:flex;align-items:center;gap:10px;color:var(--color-ink-2)}
.stage-ind li::after{content:'→';color:var(--color-dim)}
.stage-ind li:last-child::after{content:none}
.stage-ind .is-done{color:var(--color-ink)}
.stage-ind .is-now{color:var(--color-brand);display:flex;align-items:center;gap:7px}
.stage-ind .is-now::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--color-brand);animation:spec-pulse 2.2s ease-in-out infinite}
.stage-ind .is-next{color:var(--color-ink-2)}
.stage-ind .is-failed{color:var(--color-error)}

.paper{background:var(--color-paper);color:var(--color-paper-ink);border-radius:var(--radius-lg);position:relative;box-shadow:var(--shadow-stage)}
.paper::before{content:'';position:absolute;inset-inline:0;top:0;height:6px;border-radius:var(--radius-lg) var(--radius-lg) 0 0;background:var(--color-brand)}
.paper .pin{padding:28px 30px 26px}
.paper .cl{font-family:var(--font-mono);font-size:10px;letter-spacing:var(--ls-spec-wide);color:var(--color-paper-muted);display:flex;justify-content:space-between}
.paper h3{font-family:var(--font-display);font-weight:var(--weight-black);font-size:26px;margin-top:10px}
.paper .trow{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border-top:1px solid var(--color-paper-line);padding-block:11px;margin-top:6px;font-size:14px}
.paper .trow .k{color:var(--color-paper-muted)}
.paper .trow .v{font-family:var(--font-body);font-size:13px;font-weight:var(--weight-bold)}
.paper .trow .v .num,.paper .trow .v.num{font-family:var(--font-mono);direction:ltr;letter-spacing:var(--ls-mono-tight)}
.paper .trow .v.o{color:var(--color-paper-ink);font-weight:var(--weight-black)}
.paper .cap{font-family:var(--font-body);font-size:var(--text-note);color:var(--color-paper-muted);display:flex;justify-content:space-between}
.paper .pn{margin-top:12px;text-align:center;font-size:var(--text-note);font-weight:var(--weight-medium);color:var(--color-paper-muted)}
.cert .seal{position:absolute;top:20px;inset-inline-end:20px;width:54px;height:54px;border-radius:50%;background:var(--color-brand);color:var(--color-on-brand);display:flex;align-items:center;justify-content:center;font-weight:var(--weight-black);font-size:22px;box-shadow:0 0 30px var(--color-brand-soft);transform:rotate(-8deg)}
.cert .cl{color:var(--color-paper-muted)}
.cert .row{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:var(--text-spec);color:var(--color-paper-muted);border-top:1px solid var(--color-paper-line);padding-block:9px;margin-top:8px}
.cert .row b{color:var(--color-paper-ink)}

.field{display:flex;flex-direction:column;gap:7px}
.field .label{font-size:var(--text-small);font-weight:var(--weight-medium);color:var(--color-ink-2)}
.field .input,.field .textarea,.field .select{width:100%;background:var(--color-field);border:1px solid var(--color-line-strong);border-radius:var(--radius-md);padding:var(--pad-field);font-family:var(--font-body);font-size:var(--text-body);color:var(--color-ink)}
.field .textarea{min-height:110px;resize:vertical}
.field .input::placeholder,.field .textarea::placeholder{color:var(--color-ink-2)}
.field .input:focus,.field .textarea:focus,.field .select:focus{outline:none;border-color:var(--color-ink);box-shadow:0 0 0 3px var(--color-brand-soft)}
.field .input[aria-invalid="true"],.field .textarea[aria-invalid="true"]{border-color:var(--color-error)}
.field .input:disabled,.field .textarea:disabled{opacity:.5;cursor:not-allowed}
.form-error{font-size:var(--text-note);color:var(--color-error)}
.field--paper .input,.field--paper .textarea{background:var(--color-paper);color:var(--color-paper-ink);border-color:var(--color-paper-line)}

.spec-table{width:100%;border-collapse:collapse;font-size:var(--text-small)}
.spec-table th{text-align:start;font-family:var(--font-body);font-size:var(--text-note);letter-spacing:.02em;color:var(--color-ink-2);font-weight:var(--weight-bold);padding:12px 14px;border-bottom:1px solid var(--color-line)}
.spec-table td{padding:13px 14px;border-bottom:1px solid var(--color-line)}
.spec-table td.num{font-family:var(--font-mono);font-size:var(--text-spec-lg)}
.spec-table-empty{padding:40px 14px;text-align:center;color:var(--color-ink-2);font-size:var(--text-small)}

.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:var(--space-4);background:rgba(var(--color-bg-rgb),.72)}
.modal-card{width:min(440px,100%);background:var(--color-surface-2);border:1px solid var(--color-line-strong);border-radius:var(--radius-card);padding:24px;animation:modal-in var(--motion-mid) var(--ease-out)}
.modal-card .pill--brand.is-destructive{background:var(--color-error);color:var(--color-on-brand)}
@keyframes modal-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.toast{display:flex;align-items:center;gap:10px;background:var(--color-surface-2);border:1px solid var(--color-line);border-radius:var(--radius-md);padding:13px 16px;font-size:var(--text-small);position:relative;overflow:hidden}
.toast::before{content:'';position:absolute;inset-inline-start:0;inset-block:0;width:2px;background:var(--color-ink-2)}
.toast--success::before{background:var(--color-success)}
.toast--error::before{background:var(--color-error)}
.toast--info::before{background:var(--color-brand)}
.toast--in{animation:toast-in var(--motion-mid) var(--ease-out)}
@keyframes toast-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

.site-nav{position:sticky;top:0;z-index:50;background:rgba(var(--color-bg-rgb),.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-line)}
.site-nav .in{display:flex;align-items:center;gap:26px;height:66px}
.site-nav .nl{display:flex;gap:22px;font-size:var(--text-small);font-weight:var(--weight-medium);color:var(--color-ink-2)}
.site-nav .nl a:hover{color:var(--color-ink)}
.site-nav .nl a.on{color:var(--color-ink);box-shadow:inset 0 -2px 0 var(--color-brand);padding-bottom:4px}
.site-nav .sp{margin-inline-start:auto;display:flex;align-items:center;gap:14px}
.wm{font-family:'Archivo',sans-serif;font-weight:var(--weight-black);font-size:17px;letter-spacing:var(--ls-wordmark);color:var(--color-ink);direction:ltr;unicode-bidi:isolate}
.wm i{font-style:normal;color:var(--color-brand)}
.lang{display:flex;border:1px solid var(--color-line);border-radius:var(--radius-pill);overflow:hidden}
.lang span{font-family:var(--font-mono);font-weight:var(--weight-bold);font-size:11px;letter-spacing:.1em;padding:7px 13px;color:var(--color-ink-2);min-height:var(--tap-min);display:flex;align-items:center}
.lang span.on{background:var(--color-ink);color:var(--color-bg)}

.site-foot{border-top:1px solid var(--color-line);background:var(--color-ink-deep);padding-block:56px 34px}
.site-foot .fg{display:grid;gap:36px}
.site-foot .fg p{margin-top:14px;color:var(--color-ink-2);font-size:var(--text-small);max-width:30ch}
.site-foot .fc h3{font-family:var(--font-body);font-size:var(--text-note);font-weight:var(--weight-heavy);letter-spacing:.02em;color:var(--color-ink-2);margin-bottom:16px}
.site-foot .fc a{display:block;color:var(--color-ink-2);font-size:var(--text-small);padding-block:5px}
.site-foot .fc a:hover{color:var(--color-ink)}
.site-foot .fb{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:46px;padding-top:22px;border-top:1px solid var(--color-line);font-family:var(--font-body);font-size:var(--text-note);color:var(--color-ink-2)}

@media(min-width:760px){.site-foot .fg{grid-template-columns:2fr 1fr 1fr 1fr}}
@media(max-width:640px){
  .wrap{padding-inline:var(--space-4)}
  .site-nav .nl{display:none}
  .section{padding-block:var(--space-7)}
}
@media(max-width:390px){
  .wrap{padding-inline:var(--space-3)}
}
@media (prefers-reduced-motion:reduce){
  .caret,.specbox .top b::before,.stage-ind .is-now::before,.specbox--log .log .cur::after,.badge.running::before{animation:none}
  .modal-card,.toast--in{animation:none}
}
