:root{--bg: #17132a;--panel: #241f3d;--panel-2: #2e2850;--ink: #f2ecff;--ink-dim: #b3a9d6;--teal: #35d6c4;--pink: #ff77c2;--yellow: #ffd15c;--purple: #9b8cff;--green: #79e0a0;--red: #ff7c7c;--font: "Segoe UI Rounded", "SF Pro Rounded", "Baloo 2", "Nunito", "Segoe UI", system-ui, sans-serif;--shadow: 0 10px 30px rgba(0, 0, 0, .35);--shadow-pop: 0 18px 50px rgba(20, 10, 45, .55)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--bg)}body{font-family:var(--font);color:var(--ink)}#app{position:relative;width:100vw;height:100vh}#game{position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer;touch-action:none}#hud,#overlay{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}#hud>*,#overlay>*{pointer-events:auto}@keyframes pop{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes floaty{0%{transform:translateY(8px);opacity:0}to{transform:translateY(0);opacity:1}}button{font-family:var(--font);font-weight:700;color:#1a1330;background:linear-gradient(180deg,var(--yellow),#f6b73f);border:none;padding:10px 20px;border-radius:999px;font-size:14.5px;cursor:pointer;box-shadow:0 5px #c98f22,0 8px 18px #00000040;transition:transform .09s ease,box-shadow .09s ease,filter .12s ease}button:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.05)}button:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px #c98f22,0 4px 10px #00000040}button:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.4)}.hud-bar{position:absolute;top:12px;left:12px;right:12px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 14px;background:linear-gradient(180deg,#2e2850eb,#241f3deb);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:2px solid rgba(155,140,255,.35);border-radius:22px;box-shadow:var(--shadow);font-size:14px}.hud-bar .stat{position:relative;display:inline-flex;align-items:center;gap:5px;background:#17132a8c;padding:5px 12px;border-radius:999px;border:1.5px solid rgba(155,140,255,.18)}.ic{width:18px;height:18px;vertical-align:middle}#h-center{margin-left:auto;padding:8px 14px;font-size:18px;line-height:1;color:#1a1330;background:linear-gradient(180deg,var(--purple),#7f70e8);box-shadow:0 5px #5f52c2,0 8px 18px #00000040}#h-center:active:not(:disabled){box-shadow:0 2px #5f52c2}#h-center+#h-end{margin-left:0}@keyframes deltaUp{0%{transform:translateY(0);opacity:0}15%{opacity:1}to{transform:translateY(-26px);opacity:0}}.delta{position:absolute;left:50%;top:-6px;transform:translate(-50%);font-weight:800;font-size:13px;pointer-events:none;animation:deltaUp 1.2s ease-out forwards;text-shadow:0 2px 6px rgba(0,0,0,.6)}.delta.up{color:var(--green)}.delta.down{color:var(--red)}.hud-bar .stat b{color:var(--yellow);font-weight:800}.hud-bar .stat small{color:var(--green);font-weight:700}#h-end{margin-left:auto;color:#10231f;background:linear-gradient(180deg,var(--teal),#1fb7a6);box-shadow:0 5px #159183,0 8px 18px #00000040}#h-end:active:not(:disabled){box-shadow:0 2px #159183,0 4px 10px #00000040}.hud-toasts{position:absolute;left:16px;bottom:44px;display:flex;flex-direction:column;gap:8px;max-width:440px}.toast{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:2px solid rgba(155,140,255,.3);border-left:6px solid var(--teal);border-radius:16px;padding:10px 14px;font-size:13.5px;font-weight:600;box-shadow:var(--shadow);animation:floaty .25s ease;transition:opacity .8s}.toast.fade{opacity:0}.hud-tooltip{position:absolute;z-index:10;background:var(--panel);border:2px solid rgba(155,140,255,.4);border-radius:12px;padding:6px 12px;font-size:13px;font-weight:600;pointer-events:none!important;max-width:240px;box-shadow:var(--shadow)}.hud-footer{position:absolute;right:12px;bottom:10px;font-size:11px;color:var(--ink-dim)}.hud-footer code{color:var(--purple)}.hud-quests{position:absolute;right:14px;top:78px;width:258px;background:linear-gradient(180deg,#2e2850eb,#241f3deb);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:2px solid rgba(155,140,255,.3);border-radius:18px;padding:10px 14px;font-size:13px;box-shadow:var(--shadow)}.hud-quests:empty{display:none}.hud-quests h4{margin:2px 0 8px;color:var(--pink);font-size:12px;text-transform:uppercase;letter-spacing:1px}.hud-quests .quest{padding:4px 0;color:var(--ink-dim);font-weight:600;border-top:1.5px solid rgba(155,140,255,.15)}.hud-quests .quest.done{color:var(--green)}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;background:radial-gradient(ellipse at 50% 40%,#2e285080,#0a0714b8)}.modal{width:min(560px,calc(100vw - 40px));background:linear-gradient(180deg,var(--panel-2),var(--panel));border:2.5px solid rgba(155,140,255,.4);border-radius:26px;padding:24px 28px;box-shadow:var(--shadow-pop);animation:pop .22s cubic-bezier(.22,1.4,.5,1)}.modal h2{margin:0 0 12px;font-size:1.4rem;font-weight:800;color:var(--yellow)}.modal-head{display:flex;align-items:center;gap:14px}.modal-head h2{margin:0 0 8px}.modal-portrait{width:56px;height:56px;flex:none;border-radius:999px;background:#17132a99;border:2.5px solid rgba(155,140,255,.45);padding:4px;box-shadow:var(--shadow)}.timer-bar{height:12px;border-radius:999px;overflow:hidden;margin:0 0 14px;background:#17132ab3;border:1.5px solid rgba(155,140,255,.25)}.timer-bar i{display:block;height:100%;width:100%;border-radius:999px;background:linear-gradient(90deg,var(--teal),var(--green))}.timer-bar.urgent i{background:linear-gradient(90deg,#ff9a6b,var(--red))}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.modal.timed{border-color:var(--red);animation:pop .22s cubic-bezier(.22,1.4,.5,1),shake .4s .25s}.modal p{line-height:1.55;color:var(--ink-dim);margin:0 0 14px;font-weight:500}.modal-options{display:flex;flex-direction:column;gap:10px}.modal-options button,.onboard-card button{color:var(--ink);background:linear-gradient(180deg,var(--panel-2),#29234a);border:2px solid rgba(155,140,255,.35);border-radius:16px;padding:12px 16px;font-size:14.5px;font-weight:700;text-align:left;box-shadow:0 4px #140e2899}.modal-options button:hover:not(:disabled),.onboard-card button:hover:not(:disabled){border-color:var(--teal);filter:brightness(1.08)}.modal>button,.modal.results button{display:block;margin:18px auto 0;color:#10231f;background:linear-gradient(180deg,var(--teal),#1fb7a6);box-shadow:0 5px #159183,0 8px 18px #00000040}.ending-stats{color:var(--ink-dim);line-height:1.75;padding-left:20px;font-weight:600}.ending-stats li::marker{color:var(--pink)}.muted{color:var(--ink-dim)!important;font-size:13px;font-weight:500}.onboard-card.ipip{width:min(980px,100%)}.ipip-table{border-collapse:collapse;width:100%;margin-top:12px}.ipip-table th{font-size:11px;color:var(--ink-dim);font-weight:700;padding:4px 6px;text-align:center}.ipip-table td{border-top:1.5px solid rgba(155,140,255,.14);padding:8px 6px}.ipip-table td.stmt{font-size:13.5px;color:var(--ink);font-weight:600;max-width:340px}.ipip-table td.cell{text-align:center}.ipip-table input[type=radio]{width:19px;height:19px;cursor:pointer;accent-color:var(--teal)}.ipip-nav{display:flex;align-items:center;justify-content:space-between;margin-top:18px}.modal.results{max-height:88vh;overflow-y:auto}.modal.results h3{margin:18px 0 8px;font-size:13px;color:var(--pink);text-transform:uppercase;letter-spacing:1px}.modal.results code{color:var(--green)}.ocean{display:grid;gap:9px}.ocean-row{display:grid;grid-template-columns:150px 1fr;gap:10px;align-items:center;font-size:13.5px;font-weight:700}.ocean-row .bar{height:18px;background:#17132ab3;border-radius:999px;overflow:hidden;position:relative;border:1.5px solid rgba(155,140,255,.2)}.ocean-row .bar i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;transition:width .5s cubic-bezier(.22,1.4,.5,1)}.ocean-row .bar b{position:absolute;right:10px;top:0;font-size:12px;line-height:18px;color:#fff}.o-O i{background:linear-gradient(90deg,#8f83ff,var(--purple))}.o-C i{background:linear-gradient(90deg,#57cf88,var(--green))}.o-E i{background:linear-gradient(90deg,#ffb24d,var(--yellow))}.o-A i{background:linear-gradient(90deg,#33c9bb,var(--teal))}.o-N i{background:linear-gradient(90deg,#ff9a6b,var(--red))}.battle{width:min(760px,calc(100vw - 32px));background:linear-gradient(180deg,var(--panel-2),var(--panel));border:2.5px solid rgba(155,140,255,.4);border-radius:24px;padding:20px 24px;box-shadow:var(--shadow-pop);animation:pop .22s cubic-bezier(.22,1.4,.5,1)}.battle-head{display:flex;justify-content:space-between;align-items:baseline}.battle-head h2{margin:0 0 12px;color:var(--yellow);font-size:1.3rem;font-weight:800}.battle-head span{color:var(--ink-dim);font-size:13px;font-weight:700}.battle-field{display:grid;grid-template-columns:1fr 1fr;gap:18px}.battle-side h4{margin:4px 0 8px;color:var(--ink-dim);font-size:12px;text-transform:uppercase;letter-spacing:1px}.stack-card{display:flex;align-items:center;gap:10px;border:2px solid rgba(155,140,255,.25);border-radius:16px;background:#17132a80;padding:9px 11px;margin-bottom:9px;font-size:14px;font-weight:700;transition:transform .1s,border-color .12s,opacity .2s}.stack-card small{display:block;color:var(--ink-dim);font-size:11.5px;font-weight:600}.stack-card.active{border-color:var(--yellow);transform:scale(1.03)}.stack-card.dead{opacity:.25}.stack-card.targetable{border-color:var(--red);cursor:crosshair;background:#3c191e80}.stack-card.targetable:hover{border-color:#ff9a8a;transform:scale(1.04)}.stack-card img{border-radius:12px;flex:none}.battle-log{min-height:54px;margin:12px 0 8px;font-size:12.5px;color:var(--ink-dim);font-weight:600}.battle-log div{padding:1.5px 0}.battle-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.battle-actions .prompt{color:var(--ink);font-size:13.5px;font-weight:700;margin-right:4px}.battle-actions button{padding:9px 16px;font-size:13.5px}.onboard{position:absolute;top:0;right:0;bottom:0;left:0;overflow-y:auto;display:grid;place-items:start center;background:radial-gradient(ellipse at 50% -10%,#33294f,var(--bg) 60%);padding:40px 16px}.onboard-card{width:min(860px,100%);background:linear-gradient(180deg,var(--panel-2),var(--panel));border:2.5px solid rgba(155,140,255,.4);border-radius:28px;padding:30px 36px;box-shadow:var(--shadow-pop);animation:pop .25s cubic-bezier(.22,1.3,.5,1)}.onboard-card h1{margin:0 0 8px;font-size:1.7rem;font-weight:800;color:var(--yellow)}.onboard-card h3{margin:18px 0 8px;font-size:1.02rem;color:var(--teal)}.onboard-card p{color:var(--ink-dim);line-height:1.55;font-weight:500}.onboard-card>button{margin-top:22px;text-align:center;width:100%;font-size:16px}.consent-box{border:2px solid rgba(155,140,255,.3);border-radius:18px;background:#17132a80;padding:16px 20px;font-size:14px}.consent-box code{color:var(--green);word-break:break-all}.check{display:flex;gap:9px;align-items:baseline;padding:5px 0;cursor:pointer;color:var(--ink);font-weight:600}.check input{accent-color:var(--teal);width:17px;height:17px}.opt-col{display:flex;flex-direction:column}.opt-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.pill{border:2px solid rgba(155,140,255,.3);border-radius:999px;padding:6px 16px;transition:border-color .12s}.pill:hover{border-color:var(--teal)}.char-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(184px,1fr));gap:14px;margin-top:16px}.char-card{border:2.5px solid rgba(155,140,255,.25);border-radius:20px;padding:16px;background:#17132a80;cursor:pointer;transition:transform .12s,border-color .12s}.char-card:hover{border-color:var(--teal);transform:translateY(-4px) scale(1.02)}.char-card.selected{border-color:var(--yellow);background:#2e2850b3;transform:translateY(-2px)}.char-card img{border-radius:16px;display:block;margin-bottom:8px}.char-card h3{margin:0;color:var(--ink)}.char-card h3 small{display:block;color:var(--ink-dim);font-weight:500;font-size:12px}.char-card .blurb{font-size:12.5px;margin:6px 0;color:var(--ink-dim);font-weight:500}.char-card ul{margin:6px 0;padding-left:18px;font-size:12.5px;line-height:1.5;font-weight:600}.char-card .pros li{color:var(--green)}.char-card .pros li::marker{color:var(--green)}.char-card .cons li{color:var(--red)}.char-card .cons li::marker{color:var(--red)}