:root{--bg: #1c1712;--panel: #271f18;--panel2: #2f261d;--ink: #f3e9dd;--muted: #b8a48f;--accent: #c07a4a;--accent2: #e0a76e;--ok: #5fae6a;--bad: #c25b4e;--line: #3d3024}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:Segoe UI,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}#app{min-height:100vh;display:flex;justify-content:center;padding:18px 14px 60px}.wrap{width:100%;max-width:720px}header{text-align:center;margin-bottom:14px}h1{margin:0;font-size:30px;letter-spacing:4px;font-weight:800;color:var(--accent2)}.sub{margin:4px 0 0;color:var(--muted);font-size:14px}.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:center;margin-bottom:12px}.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg button{background:transparent;color:var(--muted);border:none;padding:8px 12px;font-size:13px;cursor:pointer;font-weight:600}.seg button.active{background:var(--accent);color:#1c1712}.seg button:not(.active):hover{color:var(--ink)}.stat{color:var(--muted);font-size:13px}.stat .lbl{opacity:.75}#timer{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}.storytitle{text-align:center;margin:8px 0 2px;font-size:20px;color:var(--accent2)}.hint{text-align:center;color:var(--muted);font-size:12.5px;margin:0 0 12px}.scenes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.scene{display:flex;gap:12px;align-items:stretch;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;cursor:pointer;transition:border-color .12s,transform .06s}.scene:hover{border-color:var(--accent)}.scene.sel{border-color:var(--accent2);box-shadow:0 0 0 2px #e0a76e4d}.scene.ok{border-color:var(--ok)}.scene.bad{border-color:var(--bad)}.num{flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:var(--panel2);color:var(--accent2);font-weight:800;display:flex;align-items:center;justify-content:center;font-size:16px;border:1px solid var(--line)}.body{flex:1;display:flex;flex-direction:column;gap:8px}.text{font-size:15px;line-height:1.4}.tagrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}button.move{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:8px;width:30px;height:30px;cursor:pointer;font-size:12px}button.move:hover{border-color:var(--accent);color:var(--accent2)}select.stagesel{background:var(--panel2);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:13px;cursor:pointer;flex:1;min-width:150px}select.stagesel.chosen{border-color:var(--accent);color:var(--accent2)}select.stagesel.tag-ok{border-color:var(--ok);color:var(--ok)}select.stagesel.tag-bad{border-color:var(--bad);color:var(--bad)}.actions{display:flex;gap:10px;justify-content:center;margin-top:16px}.actions button,.overlay button{border:1px solid var(--line);background:var(--panel);color:var(--ink);padding:10px 18px;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer}.actions button:hover,.overlay button:hover{border-color:var(--accent)}.primary{background:var(--accent)!important;color:#1c1712!important;border-color:var(--accent)!important}.primary:hover{background:var(--accent2)!important}.result{margin:14px auto 0;max-width:520px;text-align:center;padding:12px;background:var(--panel);border:1px solid var(--line);border-radius:10px;font-size:14px}.result .perfect{color:var(--ok);font-weight:800}.hidden{display:none!important}.overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:26px;max-width:380px;text-align:center}.card h2{margin:0 0 10px;color:var(--accent2)}.card p{margin:0 0 18px;line-height:1.6;color:var(--ink)}
