:root{--bg: #15100e;--panel: #241a16;--line: #3a2a23;--ink: #f4ece8;--dim: #b39b90;--accent: #c0533a;--accent2: #e0a06a;--good: #6fae7c;--bad: #d2705a}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:radial-gradient(900px 560px at 50% -8%,#2a1c16,var(--bg));color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,sans-serif;display:flex;justify-content:center}#app{width:100%;max-width:560px;padding:14px 14px 30px}header{text-align:center;margin-bottom:6px}h1{margin:0;font-size:28px;letter-spacing:5px;font-weight:800;color:var(--accent)}.sub{margin:4px 0 0;color:var(--dim);font-size:13px}.bar{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;align-items:center;margin:12px 0}.seg{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:999px;overflow:hidden}.seg button{background:none;border:none;color:var(--dim);padding:6px 15px;font:600 13px system-ui;cursor:pointer}.seg button.active{background:var(--accent);color:#1a0c08}.btn{background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:8px 16px;border-radius:999px;font:700 13px system-ui;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:#1a0c08;border-color:var(--accent)}.progress{display:flex;gap:6px;justify-content:center;margin:8px 0 14px}.pip{width:20px;height:6px;border-radius:4px;background:var(--line)}.pip.done{background:var(--accent2)}.pip.cur{background:var(--accent)}.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px 20px}.dtitle{margin:0 0 8px;font-size:18px;color:var(--accent2)}.scenario{margin:0 0 16px;color:var(--ink);font-size:15px;line-height:1.55}.choices{display:flex;flex-direction:column;gap:10px}.choice{text-align:left;background:#1c130f;border:1px solid var(--line);color:var(--ink);padding:13px 15px;border-radius:12px;font:600 15px system-ui;cursor:pointer;line-height:1.4}.choice:hover{border-color:var(--accent);background:#221611}.reveal{margin-top:4px}.tag{display:inline-block;background:#321f17;border:1px solid var(--line);color:var(--accent2);padding:3px 10px;border-radius:999px;font:700 12px system-ui;margin:0 6px 6px 0}.rationale{color:var(--dim);font-size:14px;line-height:1.55;margin:10px 0 0}.picked{color:var(--ink);font-weight:700;margin:0 0 8px;font-size:15px}.conflict{margin-top:14px;border:1px solid var(--bad);background:#2a1411;border-radius:12px;padding:13px 15px}.conflict h3{margin:0 0 6px;color:var(--bad);font-size:15px}.conflict p{margin:6px 0;color:var(--dim);font-size:14px;line-height:1.5}.recbtns{display:flex;flex-direction:column;gap:8px;margin-top:10px}.actions{display:flex;gap:10px;justify-content:center;margin-top:18px}.summary{text-align:center}.summary h2{color:var(--accent);margin:4px 0 10px;font-size:24px}.bigframe{font-size:22px;font-weight:800;color:var(--accent2);margin:6px 0}.profile{display:flex;flex-direction:column;gap:7px;margin:16px 0}.prow{display:flex;align-items:center;gap:10px}.plabel{width:118px;text-align:right;font-size:13px;color:var(--dim)}.pbar{flex:1;height:12px;background:var(--line);border-radius:6px;overflow:hidden}.pfill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}.pnum{width:22px;font:700 13px ui-monospace,monospace;color:var(--ink)}.note{color:var(--dim);font-size:12px;line-height:1.6;margin-top:14px;text-align:center}.scoreline{font:800 20px ui-monospace,monospace;color:var(--accent2);margin:8px 0}
