:root{--bg-color: #0b3d2e;--panel-bg: rgba(0, 0, 0, .4);--text-color: #f0f0f0;--accent-color: #4ade80;--danger-color: #f87171;--font-base: system-ui, -apple-system, sans-serif}html,body{margin:0;padding:0;min-height:100%;background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-base);overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;user-select:none;-webkit-user-select:none}#root{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}*{box-sizing:border-box}button{font-family:inherit;cursor:pointer;border:none;border-radius:6px;background:var(--accent-color);color:#000;font-weight:600;padding:8px 16px;transition:opacity .2s,transform .1s;touch-action:manipulation}button:active{transform:scale(.96)}button:disabled{opacity:.5;cursor:not-allowed;transform:none}button.danger{background:var(--danger-color)}input[type=text],input[type=email],input[type=password],select{padding:10px 12px;border-radius:6px;border:1px solid #555;background:#111;color:#fff;font-family:inherit;font-size:16px}h1,h2,h3,h4{margin-top:0}.app-container{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}.app-header{display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:#00000059;border-bottom:1px solid rgba(255,255,255,.1);flex-wrap:wrap;gap:8px;position:sticky;top:0;z-index:100;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.app-main{flex:1;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}.welcome-screen{flex:1;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:20px 16px calc(32px + env(safe-area-inset-bottom,0px));gap:18px;width:100%}.lobby-screen{flex:1;display:flex;flex-direction:column;align-items:center;padding:18px 14px calc(32px + env(safe-area-inset-bottom,0px));gap:18px;width:100%}.game-screen{flex:1;display:flex;flex-direction:column;justify-content:space-between;min-height:0;overflow-x:hidden;overflow-y:auto}.game-table-area{flex:1;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:260px;padding:16px 12px 36px}.opponents-container{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.opponent-badge{position:absolute;display:flex;flex-direction:column;align-items:center;gap:5px;z-index:10;pointer-events:auto}.opponent-badge-top{top:12px;left:50%;transform:translate(-50%)}.opponent-badge-left{left:16px;top:50%;transform:translateY(-50%)}.opponent-badge-right{right:16px;top:50%;transform:translateY(-50%)}.opponent-pill{padding:6px 12px;border-radius:20px;font-weight:700;display:flex;align-items:center;gap:6px;box-shadow:0 2px 10px #00000059;max-width:170px;font-size:.9em}.opponent-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.opponent-fan{display:flex;justify-content:center;align-items:center;height:46px;margin-top:2px}.center-trick-area{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:5;padding:8px}.player-area{background:#00000059;padding:12px 14px calc(16px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:10px;border-top:1px solid rgba(255,255,255,.12)}.player-controls{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}.player-controls-secondary{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.player-controls-primary{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-left:auto}.hand-scroll-container{width:100%;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;padding:18px 8px 6px;scrollbar-width:thin}.hand-cards-row{display:flex;align-items:center;width:max-content;margin:0 auto;min-height:106px}.hand-card-overlap{margin-left:-22px}@media (max-width: 768px){.app-header{padding:8px 10px;gap:6px}.welcome-screen,.lobby-screen{padding:12px 10px calc(28px + env(safe-area-inset-bottom,0px));gap:14px}.game-table-area{justify-content:flex-start;padding:10px 8px 34px;gap:12px;min-height:230px}.opponents-container{position:static;display:flex;justify-content:space-around;align-items:flex-start;width:100%;gap:6px;flex-wrap:wrap}.opponent-badge,.opponent-badge-top,.opponent-badge-left,.opponent-badge-right{position:relative;top:auto;left:auto;right:auto;transform:none;flex:1 1 95px;max-width:32%}.opponent-pill{padding:4px 8px;font-size:.78em;max-width:100%}.opponent-fan{height:36px;transform:scale(.82);transform-origin:top center}.center-trick-area{margin:auto 0;min-height:110px}.player-area{padding:10px 10px calc(14px + env(safe-area-inset-bottom,0px));gap:8px}.player-controls{flex-direction:column;align-items:stretch;gap:8px}.player-controls-secondary{justify-content:space-between;width:100%}.player-controls-primary{justify-content:space-between;width:100%;margin-left:0}.hand-scroll-container{padding:16px 4px 4px}.hand-cards-row{min-height:92px}.hand-card-item{width:60px!important;height:86px!important}.hand-card-overlap{margin-left:-18px}.reaction-popover{position:fixed!important;left:50%!important;right:auto!important;bottom:90px!important;top:auto!important;transform:translate(-50%)!important;width:calc(100vw - 24px)!important;max-width:340px!important;max-height:68vh!important;overflow-y:auto!important}.modal-overlay{padding:12px 10px 32px!important}.modal-card{padding:16px!important}}@keyframes reactionFloat{0%{opacity:0;transform:translateY(14px) scale(.55)}14%{opacity:1;transform:translateY(-4px) scale(1.08)}26%{opacity:1;transform:translateY(0) scale(1)}82%{opacity:1;transform:translateY(-8px) scale(1)}to{opacity:0;transform:translateY(-22px) scale(.9)}}.reaction-animate{animation:reactionFloat 3.2s ease-out forwards;pointer-events:none}@keyframes confettiFall{0%{transform:translate3d(0,-40px,0) rotate(var(--confetti-rot-start, 0deg));opacity:1}75%{opacity:1}to{transform:translate3d(0,110vh,0) rotate(var(--confetti-rot-end, 360deg));opacity:.75}}@keyframes winModalSpringIn{0%{opacity:0;transform:scale(.85) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes winBackdropFadeIn{0%{opacity:0}to{opacity:1}}.win-confetti-piece{position:absolute;top:0;will-change:transform,opacity;animation-name:confettiFall;animation-timing-function:cubic-bezier(.4,0,1,1);animation-fill-mode:forwards}.win-settlement-backdrop{animation:winBackdropFadeIn .25s ease-out forwards}.win-settlement-card{animation:winModalSpringIn .42s cubic-bezier(.34,1.56,.64,1) forwards}
