:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#edf7ed;background:#081412}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input,select{font:inherit}button{border:0;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.5}.homeShell,.appShell{position:relative;min-height:100vh;padding:26px;overflow:hidden;background:radial-gradient(circle at 18% 12%,rgba(138,186,59,.18),transparent 34%),radial-gradient(circle at 82% 18%,rgba(88,121,56,.2),transparent 30%),linear-gradient(145deg,#07110f,#10211e 48%,#071210)}.homeShell:before,.appShell:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.55;background:linear-gradient(rgba(149,191,71,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(149,191,71,.05) 1px,transparent 1px);background-size:42px 42px;-webkit-mask-image:linear-gradient(to bottom,#000,transparent 82%);mask-image:linear-gradient(to bottom,#000,transparent 82%)}.homeShell:after,.appShell:after{content:"";position:fixed;width:520px;height:520px;right:-180px;top:-190px;pointer-events:none;border-radius:999px;background:radial-gradient(circle,rgba(149,191,71,.22),transparent 68%);filter:blur(4px)}.homeShell{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:28px;align-items:center}.heroPanel,.joinPanel,.playersHud,.mainCard,.rightHud{position:relative;z-index:1;border:1px solid rgba(174,219,91,.16);border-radius:18px;background:linear-gradient(180deg,#122420db,#0a1614e0);box-shadow:0 24px 70px #00000057,inset 0 1px #ffffff0d;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.heroPanel{min-height:500px;padding:clamp(30px,6vw,72px);display:flex;flex-direction:column;justify-content:center;overflow:hidden}.heroPanel:before{content:"";position:absolute;inset:18px;border:1px solid rgba(149,191,71,.14);border-radius:14px;pointer-events:none}.heroPanel:after{content:"";position:absolute;right:7%;bottom:8%;width:170px;height:170px;border:1px solid rgba(149,191,71,.2);border-radius:30px;transform:rotate(12deg);background:linear-gradient(145deg,rgba(149,191,71,.1),transparent)}.brandBadge,.eyebrow{color:#9bbf45;font-size:.78rem;font-weight:900;text-transform:uppercase}.heroPanel h1{max-width:780px;margin:14px 0;color:#edf7ed;font-size:clamp(3.6rem,10vw,7.8rem);line-height:.9;letter-spacing:0}.heroPanel h1:first-line{color:#f5fff4}.heroPanel p{max-width:560px;color:#95a8a0;font-size:clamp(1rem,2vw,1.28rem);font-weight:600}.joinPanel,.playersHud,.rightHud,.mainCard{padding:18px}label{display:grid;gap:8px;color:#c9d7d1;font-weight:800}input,select{width:100%;min-height:52px;border:1px solid rgba(174,219,91,.18);border-radius:12px;padding:0 14px;outline:none;background:#050d0cb8;color:#edf7ed;font-weight:800}input::placeholder{color:#6f817a}input:focus,select:focus{border-color:#9bbf45;box-shadow:0 0 0 4px #9bbf451f}.joinForm{display:grid;gap:12px;margin-top:14px}.primaryAction,.secondaryAction,.dangerAction,.ownerSmall,.advanceForm button,.voteButtons button,.leaveButton{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border-radius:12px;font-weight:900;transition:transform .14s ease,filter .14s ease,border-color .14s ease}.primaryAction,.advanceForm button{width:100%;margin-top:14px;color:#07110f;background:#9bbf45;box-shadow:0 14px 32px #9bbf4533}.secondaryAction{color:#eaf6e8;background:#9bbf4514;border:1px solid rgba(155,191,69,.28)}.dangerAction{width:100%;color:#fff0ee;background:#b84035}.primaryAction:active,.secondaryAction:active,.dangerAction:active,.ownerSmall:active,.advanceForm button:active,.voteButtons button:active,.leaveButton:active,.kickPlayerButton:active{transform:scale(.98);filter:brightness(.94)}.wide{width:100%}.errorBox,.hintBox,.waitingBox{margin-top:14px;border-radius:12px;padding:12px;font-weight:750}.errorBox{background:#b8403524;color:#ffb9b2;border:1px solid rgba(184,64,53,.25)}.hintBox,.waitingBox{background:#9bbf451a;color:#d9ef9a;border:1px solid rgba(155,191,69,.18)}.topBar{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;max-width:1240px;margin:0 auto 18px;color:#edf7ed}.topBar span{display:block;color:#9bbf45;font-size:.78rem;font-weight:900;text-transform:uppercase}.topBar strong{display:block;font-size:clamp(1.7rem,4vw,2.6rem);line-height:1}.leaveButton{min-height:42px;padding:0 14px;color:#eaf6e8;background:#9bbf4514;border:1px solid rgba(155,191,69,.2)}.kickPlayerButton{min-height:34px;padding:0 10px;border-radius:9px;color:#fff0ee;background:#b840352e;border:1px solid rgba(255,97,92,.28);font-size:.76rem;font-weight:900}.gameGrid{position:relative;z-index:1;max-width:1240px;margin:0 auto;display:grid;grid-template-columns:280px minmax(360px,1fr) 250px;gap:18px;align-items:start}.hudTitle{display:flex;align-items:center;gap:8px;margin-bottom:14px;color:#edf7ed;font-weight:900}.playerChip{display:grid;grid-template-columns:44px 1fr auto;gap:10px;align-items:center;min-height:58px;margin-bottom:8px;padding:8px;border:1px solid rgba(174,219,91,.12);border-radius:12px;background:#050d0c6b;transition:transform .14s ease,border-color .14s ease,background .14s ease}.playerChip.current{transform:translateY(-1px);border-color:#9bbf457a;background:#9bbf451a}.playerChip strong,.playerChip span{display:block}.playerChip span{color:#91a59c;font-size:.78rem;font-weight:800;line-height:1.15}.playerChip b{width:30px;height:30px;display:grid;place-items:center;border:1px solid rgba(174,219,91,.16);border-radius:9px;background:#9bbf451a;color:#c8ed76}.avatar{position:relative;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--avatar);color:#07110f;font-weight:900}.avatar.active{outline:2px solid #9bbf45;outline-offset:3px}.avatarCrown{position:absolute;top:-14px;color:#c8ed76;fill:#c8ed76}.mainCard{min-height:500px}.lobby{text-align:center}.gameCode{margin:8px 0;color:#c8ed76;font-size:clamp(4rem,12vw,7rem);line-height:.9;font-weight:950}.lobby p,.rightHud p,.voteHud p,.endedHud p{color:#95a8a0;font-weight:650}.lobby p strong{color:#edf7ed;overflow-wrap:anywhere}.statusGrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.statusGrid div{border:1px solid rgba(174,219,91,.12);border-radius:12px;padding:18px;background:#050d0c6b}.statusGrid strong,.statusGrid span{display:block}.statusGrid strong{color:#c8ed76;font-size:2.2rem}.statusGrid span{color:#91a59c;font-weight:800}.wordTile{min-height:190px;border:1px solid rgba(174,219,91,.18);border-radius:16px;display:grid;place-items:center;padding:22px;text-align:center;color:#edf7ed;background:linear-gradient(135deg,#9bbf4529,#050d0c40),#101f1c}.wordTile.impostorTile{border-color:#b840356b;background:linear-gradient(135deg,#b8403542,#050d0c59),#101f1c}.roleBadge{display:inline-flex;justify-content:center;justify-self:center;margin-bottom:8px;border-radius:999px;padding:7px 12px;color:#07110f;background:#9bbf45;font-size:.86rem;font-style:normal;font-weight:900}.roleBadge.impostor{color:#fff4f2;background:#b84035}.roleBadge.group{color:#07110f;background:#9bbf45}.wordTile span,.wordTile strong,.wordTile b{display:block}.wordTile span{color:#9bbf45;font-weight:900;text-transform:uppercase}.wordTile strong{color:#edf7ed;font-size:clamp(3rem,9vw,6rem);line-height:.9}.impostorTile strong{color:#fff4f2;font-size:clamp(3rem,9vw,6.5rem)}.wordTile b{margin-top:6px;color:#c8ed76;font-size:clamp(1.5rem,5vw,3rem);line-height:1}.turnBox{margin-top:16px;border:1px solid rgba(174,219,91,.12);border-radius:14px;padding:16px;background:#050d0c6b}.turnBox>span{color:#9bbf45;font-weight:900;text-transform:uppercase;font-size:.8rem}.turnBox div{display:flex;align-items:center;gap:12px;margin-top:10px}.turnBox strong{font-size:clamp(1.8rem,5vw,3rem)}.advanceForm{display:grid;grid-template-columns:1fr 180px;gap:10px;margin-top:16px;align-items:stretch}.advanceForm>div{border:1px solid rgba(174,219,91,.12);border-radius:14px;padding:14px;background:#050d0c6b}.advanceForm strong,.advanceForm span{display:block}.advanceForm strong{font-size:1.2rem}.advanceForm span{margin-top:4px;color:#91a59c;font-weight:650}.advanceForm button{margin-top:0}.clueList{display:grid;gap:8px;margin-top:16px}.clueList>span{color:#91a59c;font-weight:750}.clueBubble{display:flex;justify-content:space-between;gap:12px;border:1px solid rgba(174,219,91,.12);border-radius:12px;padding:12px;background:#050d0c6b}.clueBubble strong,.clueBubble span{font-weight:800}.clueBubble span{color:#91a59c}.ownerSmall{margin-top:16px;padding:0 16px;color:#07110f;background:#9bbf45}.voteHud h2,.endedHud h2{margin:8px 0 16px;font-size:clamp(2rem,6vw,3.6rem);line-height:.95}.voteButtons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.voteButtons button{min-height:72px;padding:10px;justify-content:flex-start;color:#edf7ed;background:#050d0c6b;border:1px solid rgba(174,219,91,.12)}.voteButtons .skipVoteButton{grid-column:1 / -1;display:grid;grid-template-columns:auto 1fr;align-content:center;column-gap:10px;row-gap:2px;border-color:#c8ed7657;background:#9bbf451f}.skipVoteButton svg{grid-row:span 2;color:#c8ed76}.skipVoteButton small{color:#95a8a0;font-weight:800}.voteButtons button.selectedVote{border-color:#c8ed76;box-shadow:inset 0 0 0 1px #c8ed765c,0 10px 28px #9bbf451f}.voteButtons button span{font-weight:900}.voteBars{display:grid;gap:10px;margin-top:18px}.voteBars div{display:grid;grid-template-columns:minmax(88px,120px) 1fr 24px;align-items:center;gap:10px;font-weight:800}.voteBars .skipVoteRow{color:#c8ed76}.voteBars i{height:14px;overflow:hidden;border-radius:999px;background:#ffffff1a}.voteBars b{display:block;height:100%;border-radius:inherit;transition:width .25s ease}.voteBars em{color:#c8ed76;font-style:normal}.endedHud{display:grid;align-content:center;justify-items:center;text-align:center}.endedHud svg{color:#c8ed76;fill:#9bbf4538}.serverCodeMini{margin-bottom:12px;border:1px solid rgba(174,219,91,.18);border-radius:14px;padding:16px;text-align:center;color:#c8ed76;background:#050d0c6b;font-size:2.2rem;line-height:1;font-weight:950}@media(max-width:1000px){.homeShell,.gameGrid{grid-template-columns:1fr}.heroPanel{min-height:320px}.playersHud{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.hudTitle{grid-column:1 / -1}.playerChip{margin-bottom:0}}@media(max-width:620px){.homeShell,.appShell{padding:14px}.topBar{align-items:flex-start;gap:12px}.playersHud,.voteButtons,.advanceForm{grid-template-columns:1fr}.mainCard{min-height:auto}.clueBubble{display:grid}}
