:root{--p:#2f5bea;--bg:#fff;--fg:#16202c;--line:color-mix(in srgb,var(--fg) 16%,transparent);--soft:color-mix(in srgb,var(--fg) 5%,transparent)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}
header{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:14px max(16px,calc((100vw - 1040px)/2));border-bottom:1px solid var(--line)}
#brand{font-weight:700;margin-right:auto;color:inherit;text-decoration:none}#nav{display:flex;gap:14px;flex-wrap:wrap}#nav a{color:inherit;text-decoration:none}#nav a:hover{text-decoration:underline}
main{max-width:1040px;margin:auto;padding:22px 16px 60px}h1{font-size:26px;line-height:1.2;margin:6px 0 16px}h2{font-size:18px;margin:26px 0 10px}a{color:var(--p)}
form{display:grid;gap:12px;max-width:560px;margin:8px 0}.field{display:grid;gap:4px;font-weight:600;font-size:14px}.field>*:last-child{font-weight:400}
input,select,textarea{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:8px 10px;width:100%}input[type=color]{padding:2px;height:36px;width:64px}textarea.mono{font:13px ui-monospace,monospace}:focus-visible{outline:2px solid var(--p);outline-offset:1px}
.btn{display:inline-block;font:inherit;border:1px solid var(--p);background:var(--p);color:#fff;padding:8px 14px;border-radius:6px;cursor:pointer;text-decoration:none;width:fit-content}.btn.alt{background:transparent;color:var(--p)}.btn:disabled{opacity:.5}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.msg{color:#b3261e;margin:0;min-height:0}.msg.ok{color:#1c7c43}.muted{opacity:.7}.pre{white-space:pre-wrap;overflow-wrap:anywhere;margin:4px 0 0}.price{font-size:24px;font-weight:700}.price small{font-size:14px;font-weight:400}
.card{border:1px solid var(--line);border-radius:8px;padding:14px;margin:10px 0}.card.staff{background:var(--soft)}.facts{display:grid;grid-template-columns:minmax(120px,200px) minmax(0,1fr);gap:6px 14px;margin:0 0 16px}.facts dt{opacity:.7}.facts dd{margin:0;overflow-wrap:anywhere}
.scroll{overflow-x:auto;border:1px solid var(--line);border-radius:8px}table{border-collapse:collapse;width:100%;font-size:14px}th{text-align:left;font-size:12px;background:var(--soft)}th,td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}tr:last-child td{border-bottom:0}
.tabs{display:flex;gap:4px;overflow-x:auto;border-bottom:1px solid var(--line);margin-bottom:14px}.tabs a{padding:7px 10px;text-decoration:none;color:inherit;white-space:nowrap;border-bottom:2px solid transparent}.tabs a.on{border-color:var(--p);color:var(--p)}
.screen{height:70vh;background:#000;border-radius:6px;overflow:hidden}code{overflow-wrap:anywhere}li.done{opacity:.6;text-decoration:line-through}footer{padding:18px;text-align:center;opacity:.6;font-size:13px}
@media (prefers-reduced-motion:no-preference){.btn{transition:opacity .15s}}
.editor{display:grid;gap:10px;max-width:none}.editor .row>.field{flex:1 1 200px}.card.section{background:var(--soft)}form:has(.editor){max-width:none}dialog{border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--fg);padding:20px;max-width:min(92vw,420px)}
main:has(.studio){max-width:1560px}.studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}.studio form{max-width:none}.stage{position:sticky;top:10px;display:grid;gap:8px;justify-items:center}.stage>.row{justify-self:stretch}.preview{width:100%;height:calc(100vh - 80px);border:1px solid var(--line);border-radius:8px;background:#fff;max-width:100%}@media(max-width:980px){.studio{grid-template-columns:minmax(0,1fr)}.stage{position:static}.preview{height:70vh}}
.pills{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.pill{font:inherit;font-size:13px;border:1px solid var(--line);background:transparent;color:inherit;border-radius:999px;padding:4px 12px;cursor:pointer}.pill.on{background:var(--p);border-color:var(--p);color:#fff}
.grip{cursor:grab;user-select:none;padding:2px 6px;opacity:.6}.card.section,.row.item{position:relative}.row.item{align-items:end;padding:6px 0}.row.item>.field{flex:1 1 150px}.drop-before{box-shadow:0 -3px 0 var(--p)}.drop-after{box-shadow:0 3px 0 var(--p)}
.fold{border:1px solid var(--line);border-radius:8px;padding:12px 14px;display:block}.fold>summary{font-weight:600;cursor:pointer}.fold>*+*{margin-top:10px}.fold .fold{border-style:dashed}.check{display:flex;gap:8px;align-items:center;font-size:14px;font-weight:400}.check input{width:auto}
.themes{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}.theme{font:inherit;font-size:14px;font-weight:600;display:flex;gap:8px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:8px;cursor:pointer}.theme.on{outline:2px solid var(--p);outline-offset:1px}.dot{width:14px;height:14px;border-radius:50%;flex:none}textarea.mono{width:100%}
