:root{--bg-0: #0f0c29;--bg-1: #1a1440;--bg-2: #24145a;--surface: rgba(255, 255, 255, .06);--surface-strong: rgba(255, 255, 255, .1);--border: rgba(255, 255, 255, .12);--text: #f4f1ff;--text-dim: #b7b0d8;--primary: #7c4dff;--primary-2: #b388ff;--danger: #ff4d6d;--civil: #34d399;--undercover: #ffb020;--mrwhite: #64d2ff;--radius: 18px;--shadow: 0 18px 40px rgba(0, 0, 0, .45);--font: "Segoe UI", system-ui, -apple-system, Roboto, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{font-family:var(--font);color:var(--text);background:var(--bg-0);overscroll-behavior:none}.app{position:relative;min-height:100%;min-height:100dvh;display:flex;justify-content:center;overflow-x:hidden}.app__bg{position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 20% 10%,rgba(124,77,255,.35),transparent 45%),radial-gradient(circle at 85% 20%,rgba(255,77,109,.25),transparent 40%),radial-gradient(circle at 50% 100%,rgba(100,210,255,.22),transparent 45%),linear-gradient(160deg,var(--bg-0),var(--bg-2));z-index:-1}.screen{width:100%;max-width:480px;padding:24px 20px calc(28px + env(safe-area-inset-bottom));padding-top:calc(24px + env(safe-area-inset-top));display:flex;flex-direction:column;gap:18px}.title{font-size:1.6rem;font-weight:800;text-align:center;margin:0;letter-spacing:-.02em}.hint{color:var(--text-dim);font-size:.92rem;text-align:center;margin:0;line-height:1.45}.counter{text-align:center;color:var(--text-dim);font-weight:600;margin:0}.error{color:var(--danger);text-align:center;font-weight:600;margin:0}.btn{border:none;border-radius:14px;font-family:inherit;font-weight:700;font-size:1rem;padding:14px 18px;color:var(--text);cursor:pointer;transition:transform .12s ease,opacity .12s ease,box-shadow .2s ease;background:var(--surface-strong)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--lg{padding:17px 20px;font-size:1.08rem}.btn--primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 12px 26px #7c4dff66}.btn--danger{background:linear-gradient(135deg,var(--danger),#ff7a95);box-shadow:0 12px 26px #ff4d6d61}.btn--ghost{background:transparent;border:1px solid var(--border);color:var(--text-dim)}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.panel{padding:16px;display:flex;flex-direction:column;gap:10px}.setup{gap:20px}.brand{text-align:center;margin-top:8px}.brand__mask{font-size:3.2rem;filter:drop-shadow(0 6px 16px rgba(124,77,255,.6))}.brand__title{font-size:2.4rem;font-weight:900;letter-spacing:.12em;margin:6px 0 2px;background:linear-gradient(135deg,#fff,var(--primary-2));-webkit-background-clip:text;background-clip:text;color:transparent}.brand__subtitle{color:var(--text-dim);margin:0;letter-spacing:.05em}.stepper{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:14px;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--border)}.stepper--civil{border-left-color:var(--civil)}.stepper--undercover{border-left-color:var(--undercover)}.stepper--mrwhite{border-left-color:var(--mrwhite)}.stepper__label{font-weight:700}.stepper__controls{display:flex;align-items:center;gap:14px}.stepper__btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--border);background:var(--surface-strong);color:var(--text);font-size:1.5rem;line-height:1;cursor:pointer;display:grid;place-items:center}.stepper__btn:disabled{opacity:.3}.stepper__value{min-width:26px;text-align:center;font-size:1.3rem;font-weight:800}.repartition{display:flex;gap:10px;margin-top:4px}.chip{flex:1;text-align:center;padding:10px 6px;border-radius:12px;background:var(--surface);border:1px solid var(--border)}.chip__value{display:block;font-size:1.4rem;font-weight:800}.chip__label{font-size:.72rem;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}.chip--civil .chip__value{color:var(--civil)}.chip--undercover .chip__value{color:var(--undercover)}.chip--mrwhite .chip__value{color:var(--mrwhite)}.deal__head{display:flex;flex-direction:column;gap:8px}.progress{height:8px;border-radius:6px;background:var(--surface-strong);overflow:hidden}.progress__bar{height:100%;background:linear-gradient(90deg,var(--primary),var(--primary-2))}.cards-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.gamecard{aspect-ratio:3 / 4;border-radius:16px;border:1px solid var(--border);background:linear-gradient(160deg,#2a1e63,#1a1440);color:var(--text);font-weight:800;cursor:pointer;position:relative;overflow:hidden;display:grid;place-items:center;box-shadow:var(--shadow)}.gamecard:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 50% 30%,rgba(179,136,255,.35),transparent 60%)}.gamecard__face{font-size:1.8rem;position:relative;opacity:.85}.gamecard--taken{background:linear-gradient(160deg,#1c3b2f,#16241f);cursor:default;border-color:#34d39966}.gamecard--taken:before{background:radial-gradient(circle at 50% 30%,rgba(52,211,153,.3),transparent 60%)}.gamecard__owner{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.85rem;padding:4px;text-align:center;word-break:break-word}.gamecard__check{font-size:1.4rem;color:var(--civil)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#060414b8;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-items:center;padding:20px;z-index:50}.modal{width:100%;max-width:360px;background:linear-gradient(165deg,var(--bg-1),var(--bg-2));border:1px solid var(--border);border-radius:22px;padding:24px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:16px}.modal__title{text-align:center;margin:0;font-size:1.25rem}.modal__actions{display:flex;gap:10px}.modal__actions .btn{flex:1}.input{width:100%;padding:14px 16px;border-radius:14px;border:1px solid var(--border);background:#00000040;color:var(--text);font-size:1.1rem;font-family:inherit;outline:none}.input:focus{border-color:var(--primary-2);box-shadow:0 0 0 3px #7c4dff40}.input--center{text-align:center}.reveal-word{display:flex;flex-direction:column;gap:18px;align-items:center}.reveal-word__hello{margin:0;color:var(--text-dim);font-weight:600}.word-box{width:100%;border-radius:18px;padding:26px 18px;text-align:center;background:linear-gradient(150deg,#7c4dff40,#b388ff1f);border:1px solid rgba(179,136,255,.4);display:flex;flex-direction:column;gap:8px}.word-box--white{background:linear-gradient(150deg,#64d2ff33,#64d2ff0f);border-color:#64d2ff66}.word-box__eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.72rem;color:var(--text-dim)}.word-box__word{font-size:2.2rem;font-weight:900;letter-spacing:-.01em}.word-box__note{font-size:.82rem;color:var(--text-dim);line-height:1.4}.order,.discuss,.vote,.reveal,.mrwhite,.gameover{display:flex;flex-direction:column;gap:18px;align-items:center}.order-list{list-style:none;padding:0;margin:0;width:100%;display:flex;flex-direction:column;gap:10px}.order-item{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--border)}.order-item__num{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:grid;place-items:center;font-weight:800}.order-item__name{font-weight:700;font-size:1.1rem}.round-badge{align-self:center;padding:6px 16px;border-radius:999px;background:var(--surface-strong);border:1px solid var(--border);font-weight:700;font-size:.85rem;letter-spacing:.05em}.pulse-icon{font-size:3.5rem}.order-recap{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px}.order-recap__title{margin:0 0 8px;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);text-align:center}.order-recap__names{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.order-recap__name{padding:6px 12px;border-radius:999px;background:var(--surface-strong);font-weight:600;font-size:.9rem}.vote-list{width:100%;display:flex;flex-direction:column;gap:10px}.vote-item{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:14px;background:var(--surface);border:1px solid var(--border);color:var(--text);cursor:pointer;font-family:inherit;text-align:left;transition:border-color .15s ease,background .15s ease}.vote-item--selected{border-color:var(--danger);background:#ff4d6d24}.vote-item__avatar{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:grid;place-items:center;font-weight:800;font-size:1.1rem}.vote-item__name{font-weight:700;font-size:1.05rem;flex:1}.vote-item__mark{font-size:1.2rem}.vote-confirm{position:sticky;bottom:12px;width:100%}.vote-confirm .btn{width:100%}.role-card{width:220px;aspect-ratio:3 / 4;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;border:2px solid var(--border);box-shadow:var(--shadow);text-align:center;padding:16px}.role-card--civil{background:linear-gradient(160deg,#34d39947,#34d39914);border-color:var(--civil)}.role-card--undercover{background:linear-gradient(160deg,#ffb02047,#ffb02014);border-color:var(--undercover)}.role-card--mrwhite{background:linear-gradient(160deg,#64d2ff47,#64d2ff14);border-color:var(--mrwhite)}.role-card__emoji{font-size:3.5rem}.role-card__role{font-size:1.5rem;font-weight:900}.role-card__word{color:var(--text-dim);font-weight:600}.reveal__flash{font-weight:800;font-size:1.05rem;text-align:center;margin:0}.reveal__flash--win{color:var(--mrwhite)}.mrwhite__icon{font-size:4rem}.gameover{position:relative}.gameover__banner{text-align:center;margin-top:8px}.gameover__emoji{font-size:4rem;display:block}.gameover__title{font-size:2rem;font-weight:900;margin:8px 0 0}.wordpair{display:flex;gap:10px;width:100%}.wordpair__item{flex:1;text-align:center;padding:12px;border-radius:14px;background:var(--surface);border:1px solid var(--border);font-size:.9rem}.wordpair__item--civil{border-color:#34d39966}.wordpair__item--undercover{border-color:#ffb02066}.roster{list-style:none;padding:0;margin:0;width:100%;display:flex;flex-direction:column;gap:8px}.roster__item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-radius:12px;background:var(--surface);border-left:4px solid var(--border)}.roster__item--civil{border-left-color:var(--civil)}.roster__item--undercover{border-left-color:var(--undercover)}.roster__item--mrwhite{border-left-color:var(--mrwhite)}.roster__item--out .roster__name{text-decoration:line-through;opacity:.6}.roster__name{font-weight:700}.roster__role{font-size:.85rem;color:var(--text-dim);font-weight:600}.gameover__actions{width:100%;display:flex;flex-direction:column;gap:10px}.gameover__actions .btn{width:100%}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.confetti__piece{position:absolute;top:0;width:9px;height:14px;border-radius:2px;background:var(--primary-2)}.confetti__piece:nth-child(3n){background:var(--danger)}.confetti__piece:nth-child(3n+1){background:var(--civil)}.confetti__piece:nth-child(4n){background:var(--undercover)}.setup .btn--primary,.order>.btn,.discuss>.btn,.reveal>.btn,.mrwhite>.btn{width:100%}