:root{--bg:#17102a;--bg-soft:#241640;--panel:#2d1d4e;--text:#f4efff;--text-dim:#b3a6d5;--accent:#ffd166;--accent-2:#ef476f;--good:#06d6a0;--radius:16px;--font:"Fredoka", "PingFang SC", "Noto Sans SC", "Noto Sans Thai", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{min-height:100%}body{font-family:var(--font);background:radial-gradient(1200px 600px at 80% -10%, #3d2566 0%, transparent 60%), radial-gradient(900px 500px at -10% 110%, #3a1c4f 0%, transparent 55%), var(--bg);color:var(--text);line-height:1.5}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}input{font-family:inherit}.app{flex-direction:column;max-width:520px;min-height:100dvh;margin:0 auto;padding:12px 16px 24px;display:flex}.app-header{justify-content:space-between;align-items:center;gap:8px;display:flex}.header-spacer{width:64px}.lang-switch{background:var(--bg-soft);border-radius:999px;gap:2px;padding:4px;display:flex}.lang-switch button{color:var(--text-dim);border-radius:999px;padding:6px 12px;font-size:.85rem;transition:background .15s,color .15s}.lang-switch button.active{background:var(--accent);color:#241640;font-weight:600}.btn-back{color:var(--text-dim);align-items:center;gap:4px;padding:8px 4px;font-size:1rem;display:flex}.hero{text-align:center;padding:28px 0 8px}.logo{letter-spacing:.5px;color:var(--accent);text-shadow:0 4px 24px #ffd16659;font-size:clamp(2.6rem,10vw,3.4rem);font-weight:700}.logo span{color:var(--accent-2);text-shadow:0 4px 24px #ef476f59}.tagline{color:var(--text-dim);margin-top:4px}.section-title{color:var(--text-dim);margin:20px 0 12px;font-size:1.05rem;font-weight:600}.game-grid{grid-template-columns:1fr 1fr;gap:14px;display:grid}.game-card{text-align:left;border-radius:var(--radius);color:#fff;flex-direction:column;align-items:flex-start;gap:10px;min-height:168px;padding:18px 16px;transition:transform .15s,box-shadow .15s;display:flex;box-shadow:0 8px 20px #00000040}.game-card:active{transform:scale(.97)}.card-croc{background:linear-gradient(145deg,#2f9e44,#1b6e33)}.card-wheel{background:linear-gradient(145deg,#7048b6,#46277e)}.card-truth{background:linear-gradient(145deg,#e53888,#a4246b)}.card-bomb{background:linear-gradient(145deg,#e85d26,#b03a12)}.card-liar{background:linear-gradient(145deg,#c1121f,#780000)}.game-card.wide{grid-column:1/-1;min-height:120px}.game-card-title{font-size:1.15rem;font-weight:700}.game-card-desc{opacity:.88;font-size:.82rem;line-height:1.45}.page-title{text-align:center;margin:10px 0 4px;font-size:1.5rem}.game-panel{flex-direction:column;flex:1;align-items:stretch;gap:14px;padding:16px 0 8px;display:flex}.game-hint{text-align:center;color:var(--text-dim);font-size:.95rem}.muted{color:var(--text-dim);text-align:center;font-size:.85rem}.entry-row{gap:8px;display:flex}.entry-row input{background:var(--bg-soft);min-width:0;color:var(--text);border:2px solid #0000;border-radius:12px;outline:none;flex:1;padding:12px 14px;font-size:1rem}.entry-row input:focus{border-color:var(--accent)}.entry-row input::placeholder{color:var(--text-dim)}.btn-primary{background:linear-gradient(135deg, var(--accent), #ffb84d);color:#3a2a00;border-radius:14px;padding:14px 24px;font-size:1.15rem;font-weight:700;transition:transform .12s,opacity .12s;box-shadow:0 6px 18px #ffd1664d}.btn-primary:active{transform:scale(.97)}.btn-primary:disabled{opacity:.4;box-shadow:none}.btn-secondary{background:var(--bg-soft);color:var(--text);white-space:nowrap;border-radius:12px;padding:12px 16px;font-weight:600}.btn-secondary:active{transform:scale(.96)}.btn-drink{background:linear-gradient(135deg, var(--accent-2), #d90452);color:#fff;border-radius:14px;padding:14px 24px;font-size:1.1rem;font-weight:700;box-shadow:0 6px 18px #ef476f59}.btn-drink:active{transform:scale(.97)}.chip-list{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.chip{background:var(--bg-soft);border-radius:999px;align-items:center;gap:6px;padding:6px 8px 6px 14px;font-size:.95rem;display:inline-flex}.chip button{width:22px;height:22px;color:var(--text-dim);background:#ffffff1f;border-radius:50%;font-size:.9rem;line-height:1}.chip-preset{background:#ffd16629;border:1px solid #ffd16673}.tab-row{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.tab{background:var(--bg-soft);color:var(--text-dim);border-radius:999px;padding:9px 18px;font-size:.95rem;font-weight:600}.tab.active{background:var(--accent);color:#241640}.tab-mode-truth.active{background:var(--good);color:#03301f}.tab-mode-dare.active{background:var(--accent-2);color:#fff}.overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;background:#0a0518d1;justify-content:center;align-items:center;padding:24px;animation:.25s fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}}.overlay-card{background:var(--panel);text-align:center;border-radius:22px;flex-direction:column;gap:16px;width:100%;max-width:360px;padding:32px 24px;animation:.3s cubic-bezier(.2,1.4,.4,1) popIn;display:flex;box-shadow:0 20px 60px #00000080}@keyframes popIn{0%{opacity:0;transform:scale(.7)}}.overlay-card h2{color:var(--accent);font-size:1.8rem}.overlay-msg{color:var(--text);font-size:1.1rem}.overlay-actions{flex-direction:column;gap:10px;display:flex}.turn-banner{text-align:center;background:var(--bg-soft);border-radius:12px;padding:10px 16px;font-size:1.1rem;font-weight:600}.croc{width:100%;max-width:380px;margin:0 auto;overflow:visible}.croc-panel{position:relative}.croc-mouth-rect{transform-box:fill-box;transform-origin:50%;transition:transform .13s ease-in}.croc-teeth{transition:transform .13s ease-in}.croc-mouth.snap .croc-mouth-rect{transform:scaleY(.04)}.croc-mouth.snap .croc-tongue{opacity:0;transition:opacity .1s}.croc-mouth.snap .croc-teeth-top{transform:translateY(112px)}.croc-mouth.snap .croc-teeth-bottom{transform:translateY(-112px)}.croc-mouth.snap .croc-teeth-left{transform:translate(88px)}.croc-mouth.snap .croc-teeth-right{transform:translate(-88px)}.croc-panel.croc-bitten{animation:.4s shake}.croc-panel.croc-bitten:after{content:"";pointer-events:none;background:#d6282847;border-radius:12px;animation:.7s ease-out forwards fadeOut;position:absolute;inset:0}@keyframes fadeOut{to{opacity:0}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-8px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(5px)}}.croc-tooth{cursor:pointer}.croc-tooth .tooth{fill:url(#toothGrad);stroke:#3c281459;stroke-width:1.5px;transform-box:fill-box;transform-origin:50%;transition:transform .1s,filter .1s}.croc-tooth:hover .tooth{filter:drop-shadow(0 0 6px #fffc)}.croc-tooth .tooth.down{filter:brightness(.72);transform:scale(.5)}.wheel-wrap{width:min(78vw,340px);margin:6px auto;position:relative}.wheel{filter:drop-shadow(0 10px 24px #00000073);width:100%;height:auto;display:block}.wheel-label{fill:#fff;pointer-events:none;font-size:15px;font-weight:600}.wheel-pointer{border-left:14px solid #0000;border-right:14px solid #0000;border-top:24px solid var(--accent);filter:drop-shadow(0 3px 4px #0006);width:0;height:0;position:absolute;top:-6px;left:50%;transform:translate(-50%)}.btn-spin{align-self:center;min-width:200px}.result-banner{text-align:center;background:var(--bg-soft);border-radius:14px;flex-direction:column;gap:4px;padding:16px;animation:.3s cubic-bezier(.2,1.4,.4,1) popIn;display:flex}.result-name{color:var(--accent);font-size:1.6rem;font-weight:700}.result-msg{color:var(--text-dim)}.td-card{perspective:900px;cursor:pointer;height:280px}.td-card.empty{cursor:default}.td-card-inner{width:100%;height:100%;transform-style:preserve-3d;transition:transform .55s cubic-bezier(.3,1.3,.4,1);position:relative}.td-card.revealed .td-card-inner{transform:rotateY(180deg)}.td-face{backface-visibility:hidden;text-align:center;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:28px;display:flex;position:absolute;inset:0}.td-back-face{background:repeating-linear-gradient(45deg,#3a2563 0 14px,#33205a 14px 28px);border:3px solid #4b3183}.td-back-logo{color:var(--accent);font-size:4rem;font-weight:700}.td-back-hint{color:var(--text-dim)}.td-front-face{border:3px solid #fff3;transform:rotateY(180deg)}.td-truth .td-front-face{background:linear-gradient(160deg,#0b8f6a,#065f46)}.td-dare .td-front-face{background:linear-gradient(160deg,#d6336c,#8f1d4e)}.td-type{letter-spacing:2px;text-transform:uppercase;opacity:.85;border:2px solid #ffffff80;border-radius:999px;padding:4px 14px;font-size:.85rem;font-weight:700}.td-text{font-size:1.25rem;font-weight:600;line-height:1.55}.td-refuse{margin-top:-4px}.bomb-panel{justify-content:flex-start;align-items:center}.bomb-stage{width:min(60vw,240px);margin:10px auto 0;position:relative}.bomb{width:100%;height:auto;display:block}.bomb-shadow{background:radial-gradient(closest-side,#00000073,#0000);border-radius:50%;width:60%;height:16px;margin:-6px auto 0}.bomb-spark{transform-origin:140px 40px;transform-box:view-box;animation:.5s infinite alternate sparkPulse}@keyframes sparkPulse{0%{transform:scale(.8)}to{transform:scale(1.25)}}.bomb-panel.phase-running .bomb{animation:.9s ease-in-out infinite bob}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}.bomb-panel.bomb-urgent .bomb-stage{animation:.35s infinite shake}.bomb-flash{animation:.6s ease-out flashPop}@keyframes flashPop{0%{opacity:.4;transform:scale(.3)}}.bomb-pass{text-align:center}.bomb-pass-text{color:var(--accent);font-size:1.35rem;font-weight:700;animation:.8s ease-in-out infinite pulseText;display:inline-block}@keyframes pulseText{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(1.08)}}.overlay-boom h2{color:var(--accent-2);font-size:2.2rem;animation:.4s cubic-bezier(.2,1.6,.4,1) popIn}.bomb-stage{position:relative}.bomb-stage.boom{animation:.5s shake}.bomb-stage .exp-flash{pointer-events:none;z-index:2;background:radial-gradient(circle at 50% 45%,#fffffff2 0%,#ffb30080 45%,#0000 70%);border-radius:50%;animation:.55s ease-out forwards expFlash;position:absolute;inset:-30px}@keyframes expFlash{0%{opacity:1}to{opacity:0}}.bomb-stage .exp-ring{opacity:0;pointer-events:none;z-index:2;border:5px solid #ffd166;border-radius:50%;width:90px;height:90px;margin:-45px 0 0 -45px;animation:.9s ease-out forwards expRing;position:absolute;top:58%;left:50%}.bomb-stage .exp-ring.r2{border-color:#fff3b0;animation-delay:.12s}.bomb-stage .exp-ring.r3{border-color:#ff8c42;animation-delay:.24s}@keyframes expRing{0%{opacity:1;transform:scale(.2)}to{opacity:0;transform:scale(3.2)}}.bomb-stage .exp-spark{pointer-events:none;z-index:2;background:#ffd166;border-radius:50%;width:9px;height:9px;margin:-5px 0 0 -5px;animation:.8s ease-out forwards expSpark;position:absolute;top:58%;left:50%;box-shadow:0 0 8px #ffd166}@keyframes expSpark{0%{opacity:1;transform:translate(0)scale(1)}to{transform:translate(var(--dx), var(--dy)) scale(0);opacity:0}}.bomb-result{text-align:center;flex-direction:column;gap:10px;animation:.35s cubic-bezier(.2,1.4,.4,1) .2s backwards popIn;display:flex}.bomb-result h2{color:var(--accent-2);font-size:2.2rem}.bomb-result-actions,.dice-row{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.dice-row.small{gap:4px}.die rect{fill:#fdfaf3;stroke:#c9c2b6;stroke-width:2px}.die .pip{fill:#22201d}.die.hot rect{fill:#e6fff3;stroke:var(--good);stroke-width:3px}.bid-display{background:var(--bg-soft);border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:14px;font-size:1.05rem;display:flex}.bid-display strong{color:var(--accent);font-size:2rem}.stepper-row{justify-content:center;align-items:center;gap:12px;display:flex}.stepper-label{min-width:44px;color:var(--text-dim);font-weight:600}.stepper-btn{background:var(--bg-soft);border-radius:50%;width:44px;height:44px;font-size:1.4rem;font-weight:700}.stepper-btn:active{transform:scale(.92)}.stepper-value{text-align:center;min-width:48px;font-size:1.5rem;font-weight:700}.face-chips .tab{padding:8px 14px}.bid-actions{gap:12px;display:flex}.bid-actions button{flex:1}.showdown-list{flex-direction:column;gap:8px;display:flex}.showdown-row{background:var(--bg-soft);border:2px solid #0000;border-radius:12px;justify-content:space-between;align-items:center;gap:10px;padding:8px 14px;display:flex}.showdown-row.loser{border-color:var(--accent-2);background:#ef476f1f}.showdown-name{font-weight:600}.showdown-name em{color:var(--text-dim);margin-left:6px;font-size:.78rem;font-style:normal}.app-footer{text-align:center;color:var(--text-dim);margin-top:auto;padding-top:24px;font-size:.78rem}