:root{--ink:#14110f;--ink-soft:#1e1a17;--ink-raised:#272220;--washi:#e8e0d0;--washi-dim:#9c9284;--washi-faint:#635b52;--vermillion:#c1362f;--vermillion-bright:#e0554a;--gold:#c9a227;--jade:#4f8a6b;--edge:#352f2a;--tier-critical:#d4af37;--tier-success:#5f9e77;--tier-mixed:#a8905a;--tier-failure:#a85f4a;--tier-disaster:#8f2f28;--font-display:"Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;--font-body:"Inter", "Segoe UI", system-ui, -apple-system, sans-serif;--font-mono:"JetBrains Mono", "SF Mono", Menlo, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(ellipse 80% 60% at 50% -10%, #c1362f17, transparent 70%), radial-gradient(ellipse 60% 50% at 100% 100%, #c9a2270d, transparent 70%), var(--ink);min-height:100vh;color:var(--washi);font-family:var(--font-body);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.55}#app{max-width:1140px;margin:0 auto;padding:32px 24px 64px}.masthead{border-bottom:1px solid var(--edge);flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:28px;padding-bottom:20px;display:flex}.masthead h1{font-family:var(--font-display);letter-spacing:.02em;font-size:30px;font-weight:600}.masthead h1 .kanji{color:var(--vermillion);margin-right:10px;font-weight:400}.masthead .tagline{color:var(--washi-dim);letter-spacing:.04em;text-transform:uppercase;font-size:13px}.board{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:start;gap:20px;display:grid}@media (width<=860px){.board{grid-template-columns:minmax(0,1fr)}}.panel{background:linear-gradient(180deg, var(--ink-raised), var(--ink-soft));border:1px solid var(--edge);border-radius:4px;padding:20px;box-shadow:inset 0 1px #e8e0d00a,0 8px 24px #00000059}.panel+.panel{margin-top:20px}.panel h2{font-family:var(--font-display);letter-spacing:.16em;text-transform:uppercase;color:var(--washi-dim);border-bottom:1px solid var(--edge);margin-bottom:16px;padding-bottom:12px;font-size:12px;font-weight:700}.who{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:4px;display:flex}.who .name{font-family:var(--font-display);letter-spacing:.01em;font-size:24px}.who .meta{color:var(--washi-faint);font-size:13px}.standing{border-left:2px solid var(--vermillion);background:#00000040;border-radius:3px;flex-wrap:wrap;gap:20px;margin:16px 0 20px;padding:12px 14px;display:flex}.standing div{flex-direction:column;gap:2px;display:flex}.standing .label{letter-spacing:.12em;text-transform:uppercase;color:var(--washi-faint);font-size:10px}.standing .value{font-family:var(--font-mono);color:var(--washi);font-size:17px}.stat{grid-template-columns:96px 1fr 62px;align-items:center;gap:12px;padding:5px 0;display:grid}.stat .stat-name{color:var(--washi-dim);text-transform:capitalize;font-size:13px}.stat .track{background:#0006;border-radius:3px;height:6px;position:relative;overflow:hidden}.stat .fill{background:linear-gradient(90deg, var(--vermillion), var(--vermillion-bright));border-radius:3px;transition:width .35s;position:absolute;inset:0 auto 0 0}.stat .fill.buffed{background:linear-gradient(90deg, var(--jade), #6fb08c)}.stat .numbers{font-family:var(--font-mono);text-align:right;white-space:nowrap;font-size:13px}.stat .delta{margin-left:3px;font-size:11px}.delta.up{color:var(--jade)}.delta.down{color:var(--vermillion-bright)}.traits{border-top:1px solid var(--edge);flex-wrap:wrap;gap:7px;margin-top:18px;padding-top:16px;display:flex}.trait{border:1px solid var(--edge);color:var(--washi-dim);cursor:pointer;-webkit-user-select:none;user-select:none;background:#0000004d;border-radius:2px;padding:4px 10px;font-size:12px;transition:all .15s}.trait:hover{border-color:var(--washi-faint);color:var(--washi)}.trait[aria-pressed=true]{border-color:var(--gold);color:var(--gold);background:#c9a2271a}.field{margin-bottom:16px}.field>label{letter-spacing:.12em;text-transform:uppercase;color:var(--washi-faint);margin-bottom:7px;font-size:10px;display:block}.segmented{flex-wrap:wrap;gap:6px;display:flex}.segmented button{text-transform:capitalize;min-width:84px;min-height:40px;color:var(--washi-dim);border:1px solid var(--edge);cursor:pointer;background:#0000004d;border-radius:3px;flex:auto;padding:8px 12px;font-family:inherit;font-size:13px;transition:all .15s}.segmented button:hover{border-color:var(--washi-faint);color:var(--washi)}.segmented button[aria-pressed=true]{border-color:var(--vermillion);color:var(--washi);background:#c1362f29}input[type=range]{width:100%;accent-color:var(--vermillion);height:24px}.slider-head{justify-content:space-between;align-items:baseline;display:flex}.slider-head .readout{font-family:var(--font-mono);color:var(--washi);font-size:13px}.actions{flex-wrap:wrap;gap:10px;margin-top:20px;display:flex}button.primary,button.ghost{min-height:44px;font-family:var(--font-display);letter-spacing:.06em;cursor:pointer;border-radius:3px;padding:11px 20px;font-size:14px;transition:all .15s}button.primary{background:linear-gradient(180deg, var(--vermillion-bright), var(--vermillion));border:1px solid var(--vermillion-bright);color:#fff;flex:auto;font-weight:600}button.primary:hover{filter:brightness(1.12)}button.primary:active{transform:translateY(1px)}button.ghost{border:1px solid var(--edge);color:var(--washi-dim);background:0 0}button.ghost:hover{border-color:var(--washi-faint);color:var(--washi)}.result{text-align:center;border:1px solid var(--edge);background:#0000004d;border-left-width:3px;border-radius:3px;padding:22px 16px}.result.empty{color:var(--washi-faint);padding:30px 16px;font-style:italic}.result .tier{font-family:var(--font-display);letter-spacing:.02em;margin-bottom:6px;font-size:27px;font-weight:600}.result .math{font-family:var(--font-mono);color:var(--washi-dim);font-size:12px}.result .flavor{border-top:1px solid var(--edge);font-family:var(--font-display);color:var(--washi-dim);margin-top:12px;padding-top:12px;font-size:15px;font-style:italic}.tier-critical-success{border-left-color:var(--tier-critical)}.tier-critical-success .tier{color:var(--tier-critical)}.tier-success{border-left-color:var(--tier-success)}.tier-success .tier{color:var(--tier-success)}.tier-mixed{border-left-color:var(--tier-mixed)}.tier-mixed .tier{color:var(--tier-mixed)}.tier-failure{border-left-color:var(--tier-failure)}.tier-failure .tier{color:var(--tier-failure)}.tier-disaster{border-left-color:var(--tier-disaster)}.tier-disaster .tier{color:var(--tier-disaster)}.log{max-height:260px;font-family:var(--font-mono);font-size:12px;overflow-y:auto}.log .entry{color:var(--washi-dim);border-bottom:1px solid #352f2a8c;justify-content:space-between;gap:12px;padding:7px 2px;display:flex}.log .entry:last-child{border-bottom:none}.log .entry .outcome{white-space:nowrap;font-weight:600}.log .empty{color:var(--washi-faint);font-style:italic;font-family:var(--font-body);padding:8px 2px}.seedbar{border:1px solid var(--edge);color:var(--washi-faint);background:#00000040;border-radius:3px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:24px;padding:12px 16px;font-size:12px;display:flex}.seedbar .rng-state{font-family:var(--font-mono);color:var(--washi-dim)}.seedbar .group{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.seedbar button{min-height:34px;font-family:var(--font-body);color:var(--washi-dim);border:1px solid var(--edge);cursor:pointer;background:0 0;border-radius:3px;padding:6px 12px;font-size:12px}.seedbar button:hover{border-color:var(--washi-faint);color:var(--washi)}.hint{color:var(--washi-faint);margin-top:14px;font-size:12px;line-height:1.6}.create-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:20px;display:grid}@media (width<=860px){.create-grid{grid-template-columns:minmax(0,1fr)}}.name-row{gap:8px;display:flex}.name-row input{min-height:44px;font-family:var(--font-display);color:var(--washi);border:1px solid var(--edge);background:#00000059;border-radius:3px;flex:1;padding:10px 14px;font-size:18px}.name-row input:focus{border-color:var(--vermillion);outline:none}.name-row .ghost{min-width:46px;padding:10px;font-size:16px}.trait-card{text-align:left;flex-direction:column;align-items:flex-start;gap:2px;padding:8px 12px;display:flex}.trait-card .trait-name{font-size:13px}.trait-card .trait-mods{font-family:var(--font-mono);color:var(--washi-faint);font-size:10px}.trait-card[aria-pressed=true] .trait-mods{color:var(--gold)}.pool{border-left:2px solid var(--vermillion);background:#00000047;border-radius:3px;align-items:baseline;gap:10px;margin-bottom:18px;padding:12px 14px;display:flex}.pool.spent{border-left-color:var(--jade)}.pool-num{font-family:var(--font-mono);color:var(--washi);font-size:26px}.pool.spent .pool-num{color:var(--jade)}.pool-label{color:var(--washi-faint);font-size:12px}.alloc{border-bottom:1px solid #352f2a80;padding:10px 0}.alloc:last-child{border-bottom:none}.alloc-head{justify-content:space-between;align-items:baseline;margin-bottom:6px;display:flex}.alloc-val{font-family:var(--font-mono);font-size:15px}.alloc-row{align-items:center;gap:10px;display:flex}.step{width:40px;height:40px;color:var(--washi-dim);border:1px solid var(--edge);cursor:pointer;background:#0000004d;border-radius:3px;flex:none;font-size:19px}.step:hover:not(:disabled){border-color:var(--vermillion);color:var(--washi)}.step:disabled{opacity:.3;cursor:not-allowed}.alloc .track{background:#0006;border-radius:3px;flex:1;height:6px;position:relative;overflow:hidden}.alloc .fill{background:linear-gradient(90deg, var(--vermillion), var(--vermillion-bright));transition:width .15s;position:absolute;inset:0 auto 0 0}.blurb{color:var(--washi-faint);margin-top:6px;font-size:11px}.begin-bar{background:linear-gradient(180deg, var(--ink-raised), var(--ink-soft));border:1px solid var(--edge);border-radius:4px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:22px;padding:16px 20px;display:flex}.begin-err{color:var(--washi-dim);font-size:13px;font-style:italic}.begin-bar .primary{flex:none;min-width:160px}.begin-bar .primary:disabled{opacity:.4;cursor:not-allowed;filter:none}.game{flex-direction:column;gap:12px;display:flex}.hud{background:linear-gradient(180deg, var(--ink-raised), var(--ink-soft));border:1px solid var(--edge);border-radius:4px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;padding:10px 16px;display:flex}.hud-name{align-items:baseline;gap:10px;display:flex}.hud-name .name{font-family:var(--font-display);font-size:19px}.hud-name .meta{color:var(--washi-faint);font-size:12px}.hud-stats{font-family:var(--font-mono);flex-wrap:wrap;gap:16px;font-size:13px;display:flex}.hud-stats span{align-items:baseline;gap:6px;display:flex}.hud-stats i{font-style:normal;font-family:var(--font-body);letter-spacing:.1em;text-transform:uppercase;color:var(--washi-faint);font-size:10px}.stage{border:1px solid var(--edge);background:#000;border-radius:4px;line-height:0;overflow:hidden}#view{width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:none;display:block}.controls-hint{text-align:center}.touch{display:none}@media (hover:none) and (pointer:coarse){.touch{-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;gap:20px;padding:4px 6px;display:flex}.controls-hint{display:none}}.dpad{flex-direction:column;align-items:center;gap:6px;display:flex}.dpad-mid{gap:6px;display:flex}.dpad button,.act-btn{width:58px;height:58px;color:var(--washi);border:1px solid var(--edge);touch-action:none;cursor:pointer;background:#272220f2;border-radius:6px;font-size:18px}.dpad button:active,.act-btn:active{background:var(--vermillion);border-color:var(--vermillion-bright)}.act-btn{width:74px;height:74px;font-family:var(--font-display);border-color:var(--vermillion);color:var(--vermillion-bright);border-radius:50%;font-size:24px;font-weight:600}.modal{z-index:50;background:#0a0807c7;place-items:center;padding:20px;display:grid;position:fixed;inset:0;overflow-y:auto}.modal-card{width:min(520px,100%);margin:auto}.modal-body .segmented{margin-bottom:14px}.modal-body .mono{font-family:var(--font-mono);color:var(--washi-faint);font-size:11px}.modal-actions{justify-content:flex-end;margin-top:18px;display:flex}.outcome-slot:empty{display:none}body{touch-action:manipulation;-webkit-touch-callout:none;overscroll-behavior:none}.game,.creation,.hud,.touch,.modal{-webkit-user-select:none;user-select:none}input,textarea{-webkit-user-select:text;user-select:text;-webkit-touch-callout:default}.pool-actions{flex-wrap:wrap;gap:6px;margin-left:auto;display:flex}.pool-actions .ghost{min-height:36px;font-family:var(--font-body);letter-spacing:0;padding:6px 12px;font-size:12px}.pool{flex-wrap:wrap}
