:root{--bg-color: #3A1C1A;--container-bg: #6B3E2E;--info-box-bg: #4D2A20;--border-color: #C79A5F;--text-color: #F5E7D3;--input-text-color: #3B2A24;--button-bg: #B4644D;--button-hover-bg: #C8745D;--input-bg: #F7E8D9;--outline-color: #A0774A;--shadow-color: rgba(199, 154, 95, .5)}body{font-family:Gloock,serif;display:flex;justify-content:center;align-items:center;height:100vh;background-color:var(--bg-color);color:var(--text-color);margin:0}button,input{font-family:Montserrat,sans-serif;font-weight:700}.info-box{height:180px;overflow-y:scroll;padding:0;background-color:var(--info-box-bg);border:2px solid var(--border-color);border-radius:5px;box-shadow:0 0 10px var(--shadow-color)}@keyframes blink{0%,to{opacity:.2}50%{opacity:1}}@keyframes pulseGlow{0%{box-shadow:0 0 #c79a5f00}50%{box-shadow:0 0 8px #c79a5f66}to{box-shadow:0 0 #c79a5f00}}@keyframes fadeInHighlight{0%{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.button-container{width:100%;display:flex;flex-direction:column;align-items:center;gap:15px}.menu-button{width:100%;max-width:300px;padding:12px;font-size:18px;background-color:var(--button-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:5px;cursor:pointer;transition:all .05s ease-in-out}.menu-button:hover{background-color:var(--button-hover-bg);transform:scale(1.05)}#nameSubmitButton{width:100%;padding:10px;font-size:16px;font-weight:600;background-color:var(--button-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;transition:all .1s ease-in-out}#nameSubmitButton:hover{background-color:var(--button-hover-bg);transform:scale(1.03)}.name-submit-button{width:100%;padding:12px;font-size:18px;background-color:var(--button-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:5px;cursor:pointer;transition:all .05s ease-in-out;font-weight:700}.name-submit-button:hover,#nameTableSubmitButton:hover{background-color:var(--button-hover-bg);transform:scale(1.05)}.action-buttons{display:contents}.action-button{padding:12px 20px;font-size:16px;background-color:var(--button-bg);color:var(--text-color);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;transition:all .1s ease-in-out;min-width:90px;text-transform:uppercase;box-shadow:0 3px 6px var(--shadow-color)}.action-button:hover:not(:disabled){background-color:var(--button-hover-bg);transform:scale(1.05)}.action-button:active:not(:disabled){transform:scale(.95);box-shadow:inset 0 2px 4px #0000004d}.action-button:disabled{background-color:#8b5e52;color:#ddd;cursor:not-allowed;opacity:.6}#quitButton{background-color:#8b2e2e}#quitButton:hover:not(:disabled){background-color:#a43a3a}.back-button{position:absolute;top:16px;left:16px;z-index:1;width:40px;height:40px;background-color:var(--border-color);border:2px solid var(--text-color);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;box-shadow:0 4px 10px #0000004d,inset 0 0 8px var(--shadow-color)}.back-button:hover{background-color:var(--text-color);transform:scale(1.1)}.back-button:active{transform:scale(.95);box-shadow:inset 0 2px 6px #00000080}.copy-button{background-color:transparent;border:none;cursor:pointer;font-size:22px;color:var(--border-color);transition:color .2s ease-in-out,transform .1s ease-in-out}.copy-icon{font-size:22px;color:var(--border-color);transition:color .2s ease-in-out,transform .1s ease-in-out}.session-id-container:hover .copy-icon{color:var(--text-color)}.copy-icon:active{transform:scale(.9)}:root{--card-width: 4.5rem;--card-height: 6.5rem;--card-padding: 6px;--card-radius: 10px;--card-shadow: 0 3px 8px rgba(0, 0, 0, .3);--card-hover-translate: -4px}.card-hand-container{display:flex;justify-content:center;gap:12px;margin-top:16px}.card{width:var(--card-width);height:var(--card-height);background-color:#fff;border-radius:var(--card-radius);box-shadow:var(--card-shadow);position:relative;font-family:Georgia,serif;padding:var(--card-padding);display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s ease-in-out,box-shadow .2s ease-in-out}.card:hover{transform:translateY(var(--card-hover-translate));box-shadow:0 6px 12px #0006}.card .corner.top{position:absolute;top:6px;left:6px;font-size:1rem;line-height:1}.card .corner.bottom{position:absolute;bottom:6px;right:6px;font-size:1rem;line-height:1;transform:rotate(180deg)}.card .suit{font-size:24px;align-self:center;margin-top:18px}.card.red .corner,.card.red .suit{color:#dc143c}.card.black .corner,.card.black .suit{color:#000}.pot-display{margin-top:10px;font-size:16px;color:var(--text-color);font-weight:700;text-align:center}.input-container{margin-top:15px}input{width:100%;padding:10px;font-size:18px;border:1px solid var(--border-color);border-radius:5px;background-color:var(--input-bg);color:var(--input-text-color);text-align:center}.name-form-container h2,#nameTableFormContainer h2{font-size:24px;color:var(--border-color);text-shadow:2px 2px 5px var(--shadow-color);margin-bottom:15px}.form-group{display:flex;flex-direction:column;width:100%;max-width:100%;align-items:center}.form-group label{font-size:18px;margin-bottom:5px;color:var(--text-color);text-align:left}.form-group input{width:100%;max-width:90%;padding:12px;font-size:18px;border:1px solid var(--border-color);border-radius:5px;background-color:var(--input-bg);color:var(--input-text-color);text-align:center;box-shadow:inset 0 2px 5px #0000001a}#nameFormContainer{display:none;flex-direction:column;align-items:center;background-color:var(--container-bg);padding:24px;border-radius:10px;width:100%;max-width:380px;margin:0 auto;gap:18px}#nameFormContainer label{font-size:26px;font-weight:500;color:var(--text-color);text-align:center;line-height:1.3}#nameInput{padding:12px 14px;font-size:16px;border:1px solid var(--border-color);border-radius:6px;background-color:var(--input-bg);color:var(--input-text-color);width:100%;box-sizing:border-box;box-shadow:inset 0 1px 3px #00000014;transition:box-shadow .2s ease}#nameInput:focus{outline:none;box-shadow:0 0 0 2px var(--outline-color)}.table-id-container{display:flex;justify-content:center;gap:8px}.table-id-input{width:40px;height:50px;font-size:48px;text-align:center;border:2px solid var(--border-color);border-radius:5px;background-color:var(--input-bg);color:var(--input-text-color);outline:none;transition:all .1s ease-in-out}.table-id-input:focus{border-color:var(--outline-color);box-shadow:0 0 5px var(--shadow-color)}.game-container{width:100%;max-width:420px;background-color:var(--container-bg);padding:25px;border-radius:10px;box-shadow:0 4px 15px var(--shadow-color);border:2px solid var(--border-color);text-align:center;animation:fadeIn .1s ease-in-out;position:relative;margin:5vh auto}.game-container.game-container--expanded{max-width:900px;padding:30px 40px}@media (min-width: 768px){.game-container.game-container--expanded{max-width:900px;padding:30px 40px}}.game-title{font-size:36px;margin-bottom:8px}.welcome-message{font-size:18px;margin-bottom:12px;color:var(--text-color);opacity:.85}.game-interaction{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;flex-direction:row;gap:30px;width:100%}.game-left-panel{flex:1;display:flex;flex-direction:column;gap:20px}.game-right-panel{width:200px;display:flex;flex-direction:column;align-items:center;gap:20px;position:relative;top:20px}#mainMenuContainer{max-width:400px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:20px}#lobbyPlayers{display:flex;flex-wrap:wrap;gap:15px;justify-content:center;padding:10px}.player-card{display:flex;align-items:center;justify-content:space-between;background-color:var(--info-box-bg);border-radius:8px;padding:12px 16px;width:200px;transition:transform .1s ease-in-out}.player-card:hover{transform:scale(1.05)}.player-name{font-size:18px;font-weight:700;color:var(--text-color)}.session-id-container{display:flex;align-items:center;justify-content:center;gap:12px;font-size:20px;font-weight:700;color:var(--border-color);background-color:var(--info-box-bg);border:2px solid var(--border-color);border-radius:8px;padding:12px 18px;box-shadow:0 4px 10px var(--shadow-color);text-shadow:1px 1px 3px var(--shadow-color);width:fit-content;margin:0 auto 15px;cursor:pointer;transition:background-color .2s ease-in-out,transform .1s ease-in-out}.session-id-container:hover{background-color:var(--button-hover-bg);transform:scale(1.02)}.session-id-container:active{transform:scale(.98)}.narration-list{height:auto;width:100%;padding:12px;list-style:none;margin:0;display:flex;flex-direction:column;gap:10px;text-align:left;font-family:Cormorant Garamond,serif;font-size:16px;line-height:1.4;overflow:visible;box-sizing:border-box}.narration-list li{color:#fff6;transition:all .3s ease-in-out;white-space:pre-wrap;padding-left:4px;padding-right:4px;list-style:none}.narration-list li.latest{color:var(--text-color);font-weight:500;background:#ffffff0d;border-left:3px solid var(--border-color);padding-left:8px;animation:fadeInHighlight .3s ease-in-out,pulseGlow .6s ease-in-out}.narration-list li.typing:after{content:"|";animation:blink 1s infinite;margin-left:4px;font-weight:400;font-size:1em;color:var(--border-color);opacity:.7}.narration-list li:after{content:""}.info-box::-webkit-scrollbar{width:10px}.info-box::-webkit-scrollbar-track{background:var(--info-box-bg)}.info-box::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:6px;border:2px solid var(--info-box-bg)}.info-box{scrollbar-width:thin;scrollbar-color:var(--border-color) var(--info-box-bg)}.horizontal-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;width:100%}.bet-slider-wrapper{grid-column:span 4;display:flex;flex-direction:column;align-items:center;width:100%;padding:0;margin:0}.bet-slider{-webkit-appearance:none;margin:0;width:100%;height:6px;background:var(--input-bg);border-radius:5px;outline:none;box-shadow:inset 0 1px 3px #0003;transition:background .2s ease;cursor:pointer;box-sizing:border-box}.bet-slider::-webkit-slider-runnable-track{height:6px;background:var(--input-bg);border-radius:5px;border:1px solid var(--border-color)}.bet-slider::-webkit-slider-thumb{-webkit-appearance:none;height:20px;width:20px;background-color:var(--button-bg);border:2px solid var(--border-color);border-radius:50%;margin-top:-7px;box-shadow:0 2px 6px var(--shadow-color);transition:background-color .2s ease,transform .2s ease}.bet-slider::-webkit-slider-thumb:hover{background-color:var(--button-hover-bg);transform:scale(1.1)}.bet-slider::-moz-range-track{height:6px;background:var(--input-bg);border:1px solid var(--border-color);border-radius:5px}.bet-slider::-moz-range-thumb{height:20px;width:20px;background-color:var(--button-bg);border:2px solid var(--border-color);border-radius:50%;box-shadow:0 2px 6px var(--shadow-color);transition:background-color .2s ease,transform .2s ease}.bet-slider::-moz-range-thumb:hover{background-color:var(--button-hover-bg);transform:scale(1.1)}.bet-slider:focus{outline:none;box-shadow:0 0 0 2px var(--outline-color)}.bet-value{font-weight:700;font-size:14px;color:var(--border-color)}
