:root{color-scheme:dark;font-family:system-ui,sans-serif;color:var(--tone-e7e5de,#e7e5de);background:var(--tone-101615,#101615);--accent:var(--tone-b7e89b,#b7e89b)}
#chain-preview{display:flex;gap:12px}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top right,var(--tone-263c32,#263c32),transparent 65%)}main{max-width:1050px;margin:auto;padding:36px 24px 60px}a{color:var(--accent);text-decoration:none}.eyebrow{font-size:11px;letter-spacing:.18em;color:var(--tone-a2b4a8,#a2b4a8);margin-top:30px}h1{font-size:clamp(32px,6vw,64px);letter-spacing:-.05em;margin:12px 0}h1 em{font-weight:300;color:var(--accent)}.intro{color:var(--tone-a8b8ae,#a8b8ae);margin-bottom:30px}#controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}label{display:grid;grid-template-columns:1fr auto;gap:18px;padding:20px;border:1px solid var(--tone-395045,#395045);border-radius:18px;background:var(--tone-17251fe0,#17251fe0)}label span{font-size:13px;color:var(--tone-adbbb1,#adbbb1)}output{color:var(--accent);font-size:12px;text-align:right}input{grid-column:1/-1;width:100%;accent-color:var(--accent);cursor:pointer}.preview{border:1px solid var(--tone-48604d,#48604d);border-radius:24px;background:var(--tone-15241f,#15241f);margin:22px 0;padding:24px}.preview .eyebrow{margin:0}h2{font-size:25px;font-weight:500}#chain{display:flex;gap:12px}.scene{flex:1;padding:18px;border:1px solid var(--tone-5d785f,#5d785f);background:linear-gradient(145deg,var(--tone-354b37,#354b37),var(--tone-203629,#203629));border-radius:14px;font-size:32px;color:var(--accent)}small{display:block;font-size:11px;color:var(--tone-b8c4b9,#b8c4b9);margin-top:8px}#summary,#status,.note{font-size:12px;line-height:1.7;color:var(--tone-a5b5a9,#a5b5a9)}#status{color:var(--accent)}.actions{display:flex;flex-wrap:wrap;gap:10px}button{font:inherit;font-size:13px;border:1px solid var(--tone-526857,#526857);background:var(--tone-203128,#203128);color:var(--tone-e7e5de,#e7e5de);border-radius:12px;padding:14px 18px;cursor:pointer}.primary{background:var(--accent);color:var(--tone-142018,#142018);margin-left:auto}.note{max-width:760px;margin-top:22px}:focus-visible{outline:2px solid var(--tone-d7f8ae,#d7f8ae);outline-offset:4px}@media(max-width:700px){#controls{grid-template-columns:repeat(2,minmax(0,1fr))}label{grid-template-columns:1fr;gap:12px}output{text-align:left}.primary{margin-left:0}}@media(max-width:420px){main{padding:24px 16px}#controls{grid-template-columns:1fr}#chain{gap:6px}.scene{padding:12px}}