*{box-sizing:border-box}body{margin:0;background:#10151c;color:#eef3f7;font-family:system-ui,-apple-system,sans-serif}main{max-width:1000px;margin:auto;padding:18px}header,.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px}h1{margin:0;font-size:24px}header p{margin:4px 0;color:#9eabb7}.panel{max-width:480px;margin:30px auto;padding:22px;background:#18212b;border:1px solid #2d3945;border-radius:16px}label{display:block;margin:12px 0;color:#b8c4ce}input,select,button{width:100%;min-height:44px;border-radius:10px;border:1px solid #3a4856;padding:10px 12px;font-size:16px;background:#0f151b;color:#eef3f7}button{cursor:pointer;background:#243443;font-weight:700}button:hover{filter:brightness(1.12)}button:disabled{opacity:.6}.or{text-align:center;margin:12px;color:#8493a0}.hint{color:#9eabb7;font-size:14px}.notice{min-height:24px;color:#b9d8ff;margin:10px 0}.videoBar{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap;margin:14px 0}.videoBox,.remoteVideo{width:150px;height:105px;object-fit:cover;background:#090d11;border:1px solid #33414d;border-radius:12px}.videoBox{position:relative}.videoBox video{width:100%;height:100%;object-fit:cover;border-radius:12px}.videoBox span{position:absolute;bottom:4px;left:5px;font-size:12px;background:#0009;padding:2px 5px;border-radius:5px}.remoteVideos{display:flex;gap:8px;flex-wrap:wrap}.videoBar>button{width:auto}.table{min-height:300px;background:#174d3c;border:8px solid #2d1f16;border-radius:28px;padding:20px;position:relative;box-shadow:inset 0 0 0 2px #8d6b42}.players{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.player{padding:8px 10px;background:#102e26;border:1px solid #39725e;border-radius:10px}.player.active{outline:2px solid #e6c76b}.center{display:flex;justify-content:center;align-items:center;gap:20px;margin:55px 0}.deck,.discard{width:90px;height:125px;border-radius:10px;display:flex;align-items:center;justify-content:center;text-align:center;background:#17222c;border:2px solid #9aa8b4}.discard{background:#f2f2ee;color:#18212b}.dealer{text-align:center}.actions{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.actions button{width:auto}.hand{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.card{width:86px;min-height:118px;background:#f3f0e8;color:#18212b;border:2px solid #c5c0b4;border-radius:10px}.card.red{color:#9d2934}
