:root{--ink:#181127;--yellow:#ffe44f;--orange:#ff8e3c;--pink:#ff5fbc;--purple:#6c40c9;--navy:#161128;--paper:#fffaf0;--sky:#7ee8ff;--mint:#70eec6;--border:3px solid #26163d;--shadow:5px 6px 0 #190f2a;--font:system-ui,-apple-system,'Segoe UI',Arial,sans-serif}*{box-sizing:border-box}html{font-family:var(--font);background:#180e28;color:var(--paper);scroll-behavior:smooth}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 5% 0%,#5330a0aa,transparent 36%),radial-gradient(ellipse at 95% 30%,#a3297777,transparent 32%),linear-gradient(135deg,#171026,#221038 70%);background-attachment:fixed}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.48}button:focus-visible,input:focus-visible{outline:4px solid #fff;outline-offset:3px}img{max-width:100%}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.08}#app{min-height:100vh}.loader{padding:30vh 10px;text-align:center;font-size:clamp(2rem,7vw,5rem);color:var(--yellow);font-weight:1000;text-shadow:4px 4px #1e112b}.loader span{display:block;font-size:1rem;color:#fff}#toast{position:fixed;bottom:calc(14px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:99;background:#21123e;border:2px solid #f0cb70;border-radius:16px;color:#fff;padding:12px 18px;max-width:95vw;box-shadow:0 8px 25px #0009;font-weight:750;opacity:0;pointer-events:none;transition:.15s}#toast.show{opacity:1}.brand{font-weight:1000;letter-spacing:-.05em;font-style:italic;text-shadow:3px 3px 0 #241136,-2px -1px 0 #241136;color:var(--yellow)}.brand .white{color:#fff}.brand small{display:block;font-style:normal;font-size:.43em;letter-spacing:.1em;color:#e8d5ff;text-shadow:none}.topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 24px;background:#170f26df;border-bottom:3px solid #fbc846;position:relative;z-index:5}.topbar .brand{font-size:1.45rem}.top-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.chip{background:#3e255f;color:white;border:2px solid #9f76e2;border-radius:999px;padding:7px 11px;font-weight:800;font-size:.76rem}.chip.live{border-color:#5bd6a4}.chip.solo{border-color:#f6a66d}.smallbtn{border:2px solid #9b75db;border-radius:13px;color:#fff;background:#34224e;padding:8px 10px;font-size:.8rem;font-weight:850}.smallbtn:hover{background:#4c2c7a}.btn{border:var(--border);border-radius:14px;padding:12px 17px;color:#24142f;background:#fff;font-weight:950;box-shadow:var(--shadow);text-transform:uppercase;letter-spacing:.015em;transition:transform .11s,box-shadow .11s;line-height:1.25}.btn:hover:not(:disabled){transform:translate(-1px,-2px);box-shadow:7px 8px 0 #190f2a}.btn:active:not(:disabled){transform:translate(4px,5px);box-shadow:1px 1px 0 #190f2a}.btn.yellow{background:var(--yellow)}.btn.pink{background:#ff8dc9}.btn.blue{background:#71d8fa}.btn.green{background:#7ceabe}.btn.ghost{background:#3d245d;color:white;border-color:#c9a5fc;box-shadow:3px 4px 0 #140b22}.btn.wide{width:100%}.btn.big{font-size:1.15rem;padding:16px}.btnrow{display:flex;flex-wrap:wrap;gap:12px}.home{max-width:1280px;margin:auto;padding:24px 20px 44px}.hero{position:relative;min-height:clamp(340px,49vw,620px);border:5px solid #100c1c;border-radius:24px;overflow:hidden;background:#24193d;box-shadow:10px 12px 0 #12091e}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0e0d1df2 0%,#1c0e2bd7 38%,#0000 73%),linear-gradient(0deg,#140b2c 0%,transparent 48%);pointer-events:none}.hero>img{position:absolute;width:100%;height:100%;object-fit:cover}.hero-content{position:relative;z-index:2;padding:clamp(24px,4vw,52px);width:min(650px,87%);display:flex;flex-direction:column;gap:18px;justify-content:center;min-height:clamp(340px,49vw,620px)}.eyebrow{font-size:.76rem;letter-spacing:.19em;font-weight:900;color:#f9cf54}.hero .brand{font-size:clamp(3.25rem,9vw,7.7rem);line-height:.87}.hero h2{font-size:clamp(1.4rem,3vw,2.6rem);color:#fff;font-weight:1000;max-width:500px;text-shadow:2px 3px #23162f}.hero p{color:#f4e5fa;line-height:1.52;font-weight:600;max-width:490px}.home-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:30px 0}.card,.panel{border:var(--border);background:#2d1b44;border-radius:18px;padding:19px;box-shadow:var(--shadow)}.home-cards .card{background:#fff6dd;color:#24152f;min-height:170px}.card h3{font-size:1.2rem;margin:8px 0}.card p,.muted{color:#b9adc7;font-size:.92rem;line-height:1.5}.home-cards .card p{color:#554760}.sticker{background:var(--yellow);color:#302038;border:2px solid #2c1e3d;font-weight:1000;display:inline-block;padding:5px 10px;border-radius:8px;transform:rotate(-2deg);font-size:.75rem}.mini{font-size:.82rem}.game-wrap{max-width:1500px;margin:auto;padding:18px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:18px}.game-wrap.solo{grid-template-columns:minmax(0,1fr) minmax(320px,400px)}.stack{display:flex;flex-direction:column;gap:15px;min-width:0}.panel h2{font-size:1.35rem;margin-bottom:10px}.panel label{font-weight:900;display:block;font-size:.9rem;margin:10px 0 8px}.screen{overflow:hidden;border:5px solid #131020;border-radius:20px;box-shadow:7px 8px 0 #090716;background:#130e21;position:relative;aspect-ratio:16/9}.screen img{display:block;width:100%;height:100%;object-fit:cover}.screen.shade:after{content:'';position:absolute;inset:0;background:linear-gradient(to top,#130e26e8,transparent 56%);pointer-events:none}.screen-overlay{position:absolute;bottom:0;left:0;right:0;padding:clamp(12px,2.5vw,30px);z-index:1;pointer-events:none}.screen-overlay .speech{display:inline-block;max-width:min(690px,97%);font-weight:800;font-size:clamp(.85rem,1.55vw,1.25rem);color:#fff;line-height:1.5;text-shadow:1px 2px 2px #0009}.overline{display:block;background:#ffe45d;color:#25163a;font-weight:1000;font-size:clamp(.66rem,1.1vw,.9rem);padding:6px 10px;border:2px solid #23122d;border-radius:9px;max-width:max-content;transform:rotate(-1deg);margin-bottom:5px}.scene-title{color:white;font-weight:1000;font-size:clamp(1.5rem,3.7vw,4.3rem);letter-spacing:-.04em;text-shadow:3px 4px #180e24,0 0 9px #180e24}.hud{display:flex;align-items:stretch;gap:12px;flex-wrap:wrap}.meter{border:3px solid #f3b84e;border-radius:14px;background:#27183c;padding:9px 12px;flex:1;min-width:170px}.meter-head{display:flex;justify-content:space-between;font-size:.8rem;font-weight:1000;margin-bottom:8px}.track{height:14px;border:2px solid #190f27;background:#1c122a;border-radius:50px;overflow:hidden}.fill{height:100%;transition:width .35s}.fill.ready{background:linear-gradient(90deg,#45d6d6,#a8ed77)}.fill.chaos{background:linear-gradient(90deg,#ffbe3c,#ff566c)}.role-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.role-status{border:2px solid #6e538b;padding:11px 5px;text-align:center;border-radius:12px;background:#30214c;color:#fff}.role-status b{display:block;font-size:1.45rem}.role-status span{display:block;font-size:.7rem;font-weight:850;margin:4px 0 2px}.role-status em{font-style:normal;font-size:.62rem;opacity:.78}.role-status.done{border-color:#6be2b5;background:#124639}.role-status.assist{border-color:#f3c55b}.aside{display:flex;flex-direction:column;gap:15px;min-width:0}.story-card{background:var(--paper);color:#2d2139;padding:16px 18px;border:var(--border);border-radius:14px;box-shadow:var(--shadow)}.story-card h3{font-size:1.2rem;margin:6px 0 8px}.story-card p{font-size:.95rem;line-height:1.45}.roomcode{font-size:2rem;font-weight:1000;letter-spacing:.16em;color:var(--yellow);text-align:center;background:#1a1228;border:2px dashed #af9ec1;border-radius:15px;padding:14px 9px;user-select:all}.invite{text-align:center;font-size:.82rem}.qr{background:#fff;border-radius:8px;padding:8px;display:block;margin:12px auto;width:172px;max-width:100%;min-height:172px;object-fit:contain}.url{background:#1b122b;color:#cfc1e8;border-radius:7px;padding:10px;word-break:break-all;font-size:.68rem}.phone{border:6px solid #120a1b;border-radius:30px;background:#231639;padding:15px;box-shadow:0 0 0 3px #9f7dce,6px 8px 0 #080511;color:white;min-height:565px}.phone-notch{width:100px;height:7px;border-radius:99px;background:#796b89;margin:0 auto 16px}.phone-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:13px}.phone h3{font-weight:1000;font-size:1.5rem;line-height:1.05;margin:10px 0}.phone p{color:#e2d7f2;line-height:1.5;font-size:.94rem}.role-picker{display:flex;flex-direction:column;gap:10px}.role-btn{width:100%;display:flex;align-items:center;gap:10px;padding:12px;background:#3c2857;border:2px solid #8561b4;border-radius:13px;color:white;text-align:left;font-weight:1000}.role-btn.selected{border-color:var(--yellow);background:#6c3e9b}.role-btn .emoji{font-size:1.6rem}.role-btn .copy{font-size:.7rem;font-weight:650;opacity:.75;display:block;margin-top:2px}.role-btn:disabled{opacity:.35}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin:20px 0}.option{display:flex;min-height:102px;gap:6px;flex-direction:column;justify-content:center;align-items:center;background:#ffeff9;border:3px solid #2b183b;border-radius:14px;color:#291936;font-weight:1000;padding:10px;box-shadow:3px 4px 0 #0d0916}.option:nth-child(3){grid-column:1/-1}.option .option-icon{font-size:2.3rem;line-height:1.1}.option strong{font-size:.85rem}.option.selected{border-color:#fff19a;background:#ffe476}.option.used{opacity:.4;filter:grayscale(.5)}.sequence-chosen{min-height:46px;background:#463061;border:2px dashed #b992e8;border-radius:12px;padding:10px;margin:10px 0;color:#fff;text-align:center;font-weight:850}.submit{margin-top:16px;width:100%}.statusline{background:#2c1d44;border-radius:10px;padding:12px;color:#ffe69e;font-weight:850;text-align:center}.dev-role{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-bottom:9px}.dev-role .smallbtn{font-size:1.25rem;padding:6px 1px;min-width:0}.dev-role .smallbtn.active{background:var(--yellow);color:#1a0a20}.phone-footer{margin-top:15px;display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap}.controller-progress{font-size:.78rem;color:#fff;padding:8px;background:#392250;border:1px solid #a678c9;border-radius:9px;margin:10px 0}.result-grade{display:inline-block;background:var(--yellow);border:3px solid #191029;padding:8px 14px;color:#241339;font-size:1.4rem;font-weight:1000;transform:rotate(-2deg);border-radius:10px;margin-bottom:10px}.result-grade.silver{background:#a7d7ec}.result-grade.comedy{background:#ff9f80}.recap{display:flex;flex-direction:column;gap:8px}.recap .row{display:flex;gap:8px;justify-content:space-between;border-bottom:1px solid #674b87;padding:6px 0}.footer{font-size:.75rem;color:#b7a4ca;text-align:center;margin:24px auto;max-width:850px;padding:14px}.input{width:100%;padding:15px;text-transform:uppercase;letter-spacing:.12em;background:#fff;color:#281838;font-weight:950;font-size:1.35rem;border:3px solid #130d20;border-radius:12px}.mobile-view{max-width:475px;margin:22px auto 55px;padding:0 16px}.mobile-view .phone{min-height:calc(100vh - 120px)}.error{background:#713648;border:2px solid #f8909e;border-radius:12px;padding:10px;margin:10px 0;font-size:.82rem}.call-banner{background:#fff3d7;color:#251532;padding:13px;border:3px solid #24172c;border-radius:12px;display:flex;align-items:center;gap:13px}.call-banner .ico{font-size:2rem}.badge{background:#f6bf50;color:#211126;display:inline-block;border-radius:9px;border:2px solid #1e132c;font-size:.7rem;padding:4px 8px;font-weight:900}.quiet{color:#a898bd;font-size:.8rem}.big-hold{width:100%;border-radius:50%;height:185px;max-width:185px;display:flex;align-items:center;justify-content:center;flex-direction:column;margin:26px auto;border:6px solid #fff0a7;background:#fa5169;color:#fff;font-size:2.2rem;font-weight:1000;box-shadow:0 0 0 7px #48265a;touch-action:none;user-select:none;-webkit-user-select:none}.holdprogress{margin-top:14px;background:#42275f;border-radius:13px;height:13px;overflow:hidden}.holdprogress i{display:block;background:#ffe25f;height:100%;width:0}.top-toggle{display:flex;align-items:center;gap:8px;font-size:.8rem}.top-toggle input{accent-color:#ffe45c}#joinNotice{font-size:.74rem}@media(max-width:1050px){.game-wrap{grid-template-columns:1fr}.game-wrap.solo{grid-template-columns:1fr}.aside{display:grid;grid-template-columns:1fr 1fr}.phone{max-width:520px;width:100%;margin:auto}}@media(max-width:720px){.home{padding:12px 10px}.hero-content{width:100%;min-height:420px;padding:22px}.hero:after{background:linear-gradient(90deg,#0e0d1de8,#200f34ad 75%,#0002)}.hero .brand{font-size:4.6rem}.hero h2{font-size:1.8rem}.home-cards{grid-template-columns:1fr}.topbar{padding:10px;align-items:flex-start}.topbar .brand{font-size:1.1rem}.top-actions .smallbtn{padding:6px;font-size:.69rem}.game-wrap{padding:12px;gap:11px}.game-wrap.solo{padding:8px}.panel{padding:12px}.aside{display:flex}.role-grid{gap:4px}.role-status{padding:8px 1px}.role-status b{font-size:1rem}.role-status span{font-size:.58rem}.role-status em{font-size:.5rem}.hud{gap:6px}.meter{min-width:130px}.scene-title{font-size:1.7rem}.screen-overlay{padding:9px}.screen-overlay .speech{font-size:.72rem}.mobile-view{margin-top:12px}.phone{padding:12px;min-height:430px}.btn.big{font-size:1rem;padding:13px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

.task-titlebar{display:flex;align-items:center;gap:12px;margin:10px 0 12px}.task-titlebar img{background:#fff9e9;border:3px solid #f4ba42;border-radius:15px;width:72px;height:72px;object-fit:contain;padding:5px;flex-shrink:0}.task-titlebar h3{margin:0;font-size:1.32rem}