:root{--table-color: #277714;--table-border: #4a3b2b;--card-width: clamp(55px, 8.5vmin, 90px);--card-height: calc(var(--card-width) * 1.4);--card-bg: white;--text-color: white;--modal-bg: rgba(0, 0, 0, .85);--font-dynamic: clamp(.8rem, 1.5vmin, 1.2rem);--info-bg: rgba(0, 0, 0, .4)}*{box-sizing:border-box;-webkit-user-select:none;user-select:none}body{margin:0;padding:0;font-family:Roboto,sans-serif;background-color:#1a1a1a;color:var(--text-color);overflow:hidden;height:100vh;display:flex;justify-content:center;align-items:center}#game-container{width:100vw;height:100vh;background:radial-gradient(circle,#358c20,#1e5210);position:relative;display:flex;flex-direction:column;align-items:center;box-shadow:inset 0 0 100px #00000080}#info-bar{height:clamp(30px,5vh,45px);background:#1e1e1ee6;display:flex;justify-content:center;align-items:center;font-size:var(--font-dynamic);font-weight:700;border-bottom:2px solid #e6b800;z-index:100}#info-bar>div{margin:0 15px}#table{flex-grow:1;position:relative;display:grid;grid-template-rows:1fr 2fr 1fr;grid-template-columns:minmax(100px,1fr) minmax(350px,1.5fr) minmax(100px,1fr);padding:1vmin;width:100%;max-width:1400px;margin:0 auto}.player-area{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}#player-top{grid-column:2;grid-row:1}#player-bottom{grid-column:2;grid-row:3;justify-content:flex-end}#player-left{grid-column:1;grid-row:2;flex-direction:row;justify-content:flex-end}#player-right{grid-column:3;grid-row:2;flex-direction:row;justify-content:flex-start}.player-info{font-size:var(--font-dynamic);font-weight:700;text-shadow:1px 1px 3px black;margin:4px;background:var(--info-bg);padding:4px 8px;border-radius:10px;white-space:nowrap}.player-bid{font-size:calc(var(--font-dynamic) * .9);font-weight:700;color:gold;text-shadow:1px 1px 2px black;min-height:1.2rem;margin:2px}.trick-counter{font-size:.9rem;color:#ddd;background:#00000080;padding:2px 6px;border-radius:4px;margin-top:2px}.total-score{font-size:.85rem;color:gold;font-weight:700;margin-top:2px}.player-area.active .player-info{background:#e6b800;color:#000;box-shadow:0 0 10px #e6b800}.hand{display:flex;justify-content:center;height:var(--card-height);transition:all .3s;width:100%}#player-bottom .hand{margin-bottom:20px}#player-right{flex-direction:row;align-items:center}#player-right .hand-container{transform:rotate(-90deg);width:250px;height:100px;display:flex;justify-content:center;align-items:center;margin-right:-40px;margin-left:-40px}#player-right .info-container{display:flex;flex-direction:column;align-items:center;margin-left:20px}#player-left{flex-direction:row;align-items:center}#player-left .hand-container{transform:rotate(90deg);width:250px;height:100px;display:flex;justify-content:center;align-items:center;margin-left:-40px;margin-right:-40px}#player-left .info-container{display:flex;flex-direction:column;align-items:center;margin-right:20px}#trick-area{grid-column:2;grid-row:2;display:grid;grid-template-columns:1fr 2fr 1fr;grid-template-rows:1fr 2fr 1fr;gap:10px;position:relative}.grid-cell{display:flex;justify-content:center;align-items:center}.bid-area{font-size:1rem;font-weight:700;color:gold;text-shadow:1px 1px 2px black}.bid-area-content{text-align:center}.dealer-badge{background-color:#ff9800;color:#000;font-size:.8rem;font-weight:700;padding:4px 10px;border-radius:12px;border:2px solid white;margin-bottom:5px;display:inline-block}.bid-text{color:gold;font-weight:700;font-size:1rem;text-shadow:1px 1px 2px black}.bid-text.active-bidder{border:2px solid #e6b800;padding:4px 8px;border-radius:6px;background-color:#00000080;display:inline-block}#center-play-area{position:relative;display:flex;justify-content:center;align-items:center;pointer-events:auto}.card-slot{position:absolute;width:var(--card-width);height:var(--card-height);display:flex;justify-content:center;align-items:center;transition:transform .3s,opacity .3s;margin:0;pointer-events:none}#slot-top{transform:translateY(-60px)}#slot-bottom{transform:translateY(60px)}#slot-left{transform:translate(-80px)}#slot-right{transform:translate(80px)}.card{width:var(--card-width);height:var(--card-height);background-color:var(--card-bg);border-radius:8px;box-shadow:-2px 0 5px #0003;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:2px;font-family:Cinzel,serif;font-weight:700;color:#000;border:1px solid #ccc;cursor:pointer;transition:transform .2s,margin-top .2s;-webkit-user-select:none;user-select:none;margin-left:0}.hand .card{margin-left:calc(var(--card-width) * -.5)}.hand .card:first-child{margin-left:0}#player-bottom .card:hover{transform:translateY(-30px);z-index:100;box-shadow:0 0 10px #ffffff80}.card.red{color:#d40000}.card.black{color:#000}.card-top-left{position:absolute;top:2px;left:2px;font-size:calc(var(--card-width) * .2);display:flex;flex-direction:column;align-items:center;line-height:1;background:#fff;border-radius:4px;padding:1px}.card-center{font-size:calc(var(--card-width) * .35);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-bottom-right{display:none}.card-back{background:repeating-linear-gradient(45deg,#606dbc,#606dbc 10px,#465298 10px,#465298 20px);border:2px solid white}.modal{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center;z-index:1000;pointer-events:auto;width:100%;height:100%}.hidden{display:none!important}.modal-content{background:#141414fa;padding:10px;border-radius:8px;text-align:center;box-shadow:0 0 40px #000;border:2px solid #ffd700;width:200px;pointer-events:auto;z-index:1001}.modal-content h2,.modal-content h3{margin:5px 0;font-size:1.1rem;color:gold}#bidding-options select{background:#333;color:#fff;border:1px solid #ffd700;padding:2px;margin-bottom:5px;font-size:.9rem}#controls-area{height:120px;background:#0009;display:flex;justify-content:center;align-items:center;padding:10px;border-top:1px solid rgba(255,255,255,.1);position:relative;z-index:500}#message-box{background:#0a0a0ae6;padding:8px 15px;border-radius:4px;border:2px solid #ffd700;font-family:Cinzel,serif;font-size:.9rem;font-weight:700;color:gold;text-transform:uppercase;text-shadow:1px 1px 2px black;box-shadow:2px 2px 5px #00000080;max-width:80%;text-align:center;transition:all .3s;letter-spacing:1px;position:fixed;bottom:15px;left:15px;z-index:2000}.message-update{animation:message-pop .3s ease-out}@keyframes message-pop{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.modal-content button{padding:5px 10px;font-size:.8rem;margin:2px}button{background:#e6b800;border:none;padding:10px 20px;font-size:1rem;font-weight:700;cursor:pointer;margin:5px;border-radius:5px;transition:background .2s}button:hover{background:#fc0}button:disabled{background:#666;cursor:not-allowed}.suit-selection button,.ace-selection button{font-size:1.5rem;padding:8px;width:50px}@media(max-height:700px){:root{--card-width: clamp(45px, 7vmin, 70px);--font-dynamic: clamp(.7rem, 1.2vmin, .9rem)}#info-bar{height:25px}#table{grid-template-rows:auto 1fr auto;padding:5px}.player-info{padding:2px 6px;margin:2px}.player-bid{margin:0}#player-bottom .hand{margin-bottom:5px}.modal-content{padding:8px;width:180px}.modal-content h2,.modal-content h3{font-size:.9rem}.modal-content button{padding:3px 6px;font-size:.75rem}}