@import "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap";*{box-sizing:border-box;color:var(--text);margin:0;padding:0}::-webkit-input-placeholder{color:var(--hidden-text)}:-ms-placeholder-shown{color:var(--hidden-text)}::placeholder{color:var(--hidden-text)}:root{--background:#141619;--border:#ffffff14;--border-strong:#ffffff24;--card-width:102px;--card-height:142px;--text:#ffffffeb;--text-secondary:#ffffff80;--hidden-text:#ffffff59;--cyan:#3ab8d8;--cyan-bright:#5dd4f0;--cyan-dim:#2a9db3}body{background-color:var(--background);min-height:100vh;font-family:DM Sans,sans-serif;overflow:hidden}.screen{min-height:100vh;display:flex}.hidden{display:none!important}input,label{width:100%;display:block}input{border:1px solid var(--border-strong);background-color:var(--surface-solid);height:48px;color:var(--text);outline:none;flex-shrink:0;padding:0 16px;font-size:16px;line-height:24px}input:focus{outline:none}button{cursor:pointer;box-sizing:border-box;border:none;justify-content:center;align-items:center;height:48px;padding:8px 24px;font-size:16px;font-weight:600;transition:transform .12s,filter .12s,background-color .12s,color .12s,border-color .12s,box-shadow .12s;display:flex}button:not(:disabled):hover{filter:brightness(1.06);transform:translateY(-1px)}button:not(:disabled):active{filter:brightness(.98);transform:translateY(0)}button:disabled{cursor:not-allowed}.btn-primary{background-color:var(--cyan);color:#0c1132}.btn-primary:hover{background:var(--cyan-bright)}.btn-secondary{border:1px solid var(--border-strong);background:var(--surface-solid);color:var(--text-secondary);align-self:stretch}.btn-white-transparent{color:#fff;background:#ffffff1a}.btn-white-transparent:hover{background:#ffffff2e}.btn-white-transparent:disabled{color:#ffffff6b;background:#ffffff0f}#menu{background-color:var(--background);flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh}.menu-content{flex-direction:column;align-items:flex-start;gap:32px;width:960px;padding:0 160px;display:flex}.menu-header{align-items:center;margin-bottom:0}.game-title{color:#fff;align-items:center;margin:0;font-size:40px;font-weight:500;line-height:1.2;display:flex}.menu-subtitle{color:#fff;margin-bottom:24px;font-size:36px;font-weight:400;line-height:44px;display:flex}.menu-main{flex-direction:column;align-items:flex-start;gap:12px;width:640px;display:flex}.name-group{margin-bottom:8px}.menu-description{color:var(--text-muted);margin-bottom:24px;font-size:16px;font-weight:400;line-height:24px}.input-group{flex-direction:row;align-items:center;gap:12px;width:640px;height:48px;margin-bottom:0;display:flex}.input-group input{flex:2}.input-group button{flex:1}.divider{width:640px;color:var(--text-secondary);flex-direction:row;align-items:center;gap:16px;font-size:14px;font-weight:500;line-height:18px;display:flex}.divider:before,.divider:after{background-color:var(--border-strong);content:"";flex:1;height:1px}#menu-error{color:#d0302f;text-align:center;white-space:nowrap;background:#d0302f4d;padding:10px 20px;font-size:14px;font-weight:600;position:absolute;bottom:2rem;left:50%;transform:translate(-50%)}#menu-error:empty{display:none}.modal{z-index:1000;background:#0009;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal.hidden{display:none}.modal-content{background:#1a1d21;flex-direction:column;align-items:flex-start;gap:20px;width:540px;padding:40px;display:flex}.modal-content h2{color:#fff;font-size:28px;font-weight:600;line-height:36px}.modal-content p{font-size:14px;line-height:25px}.form-group{flex-direction:column;gap:16px;width:100%;margin:0;display:flex}#modal-error{color:#d0302f;margin-top:-20px;font-size:14px}.modal-content input{width:100%}.modal-buttons{align-self:stretch;gap:12px;width:100%;display:flex}.modal-buttons button{flex:1;justify-content:center;align-items:center;height:40px;display:inline-flex}#game{background:var(--background);flex-direction:row;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}#game-area{flex-direction:column;flex:1;gap:24px;width:100%;min-width:0;height:100vh;padding:24px 0;display:flex;overflow:hidden}#notification-area,#action-area{flex:0 0 48px;justify-content:center;align-items:center;width:100%;min-height:48px;display:flex}#game-area-table{--table-width:600px;--table-height:320px;z-index:1;background:0 0;flex:auto;min-height:0;display:flex;position:relative;overflow:hidden}.game-top-notification,#turn-banner{z-index:10;box-sizing:border-box;color:#fff;white-space:nowrap;background:#0d0f10;flex-direction:row;align-items:center;gap:16px;width:fit-content;height:48px;padding:12px 16px;font-size:12px;font-weight:400;line-height:18px;display:flex}.game-field{z-index:1;box-sizing:border-box;background:#00597b;justify-content:center;align-items:center;width:600px;height:360px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.game-field-text{color:var(--text-secondary);letter-spacing:.15px;align-items:center;margin:0;font-size:18px;font-weight:500;line-height:28px;display:flex;position:absolute;top:21px;left:25px}.game-field-center{z-index:1;color:var(--text-secondary);letter-spacing:.15px;flex-direction:row;justify-content:center;align-items:center;padding-top:189px;font-size:18px;font-weight:500;line-height:28px;display:flex}.player-nameplate{z-index:5;pointer-events:none;text-align:center;background:#a6b0f233;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:auto;min-width:80px;height:auto;padding:16px 24px;display:flex;position:absolute}.player-nameplate.no-detail{gap:0}.player-nameplate.is-empty{background:0 0;width:60px;min-width:60px;height:60px;min-height:60px;padding:0}.player-nameplate.is-empty:before{clip-path:polygon(50% 0%,100% 50%,50% 100%,0% 50%);box-sizing:border-box;content:"";background:#ffffff05;width:100%;height:100%;display:block}.nameplate-inner{display:contents}.player-nameplate.is-turn{box-shadow:none}.player-nameplate.is-own{z-index:7}.player-nameplate.nameplate-own{bottom:0;left:50%;transform:translate(-50%)}.player-nameplate.nameplate-right{top:50%;left:calc(75% + (var(--table-width) / 4));transform:translate(-50%,-50%)}.player-nameplate.nameplate-left{top:50%;left:calc(25% - (var(--table-width) / 4));transform:translate(-50%,-50%)}.player-nameplate.nameplate-top{top:0;left:50%;transform:translate(-50%)}.nameplate-name{width:100%;color:var(--text-primary);white-space:nowrap;justify-content:center;align-items:center;gap:8px;font-size:14px;font-weight:700;line-height:20px;display:flex}.nameplate-cards{width:100%;color:var(--text-secondary);text-align:center;white-space:nowrap;font-size:12px;font-weight:600;line-height:18px}.game-player-active-icon{clip-path:polygon(0 50%,100% 0,100% 100%);background:var(--cyan);width:14px;height:14px;position:absolute;top:20px;left:-6px}.game-player-passed-icon{z-index:1;clip-path:polygon(20% 0%,0% 20%,30% 50%,0% 80%,20% 100%,50% 70%,80% 100%,100% 80%,70% 50%,100% 20%,80% 0%,50% 30%);color:red;background:red;width:14px;height:14px;position:absolute;top:20px;left:-6px}.game-player-landlord-icon{box-sizing:border-box;color:#e2b42b;letter-spacing:.15px;background:#391c08;border:1.5px solid #e2b42b;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;width:45px;height:24px;padding:0 6px;font-size:14px;font-weight:600;line-height:20px;display:flex}.game-player-you{position:absolute;top:384px;left:50%;transform:translate(-50%)}.game-player-right{position:absolute;top:50%;left:624px;transform:translateY(-50%)}.game-player-top{position:absolute;bottom:384px;left:50%;transform:translate(-50%)}.game-player-left{position:absolute;top:50%;right:624px;transform:translateY(-50%)}.game-field-bidding,#table-center-message .game-field-bidding,#table-center-message{z-index:1;box-sizing:border-box;background:#1a1d21f5;width:600px;height:320px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.game-field-cards{z-index:1;flex-direction:row;align-items:center;padding-left:30px;display:flex}.game-field-combination-text{color:var(--text-primary);letter-spacing:.15px;align-items:center;font-size:14px;font-weight:500;line-height:20px;position:absolute;bottom:21px;right:25px}#table-center-message{pointer-events:none;flex-direction:column;justify-content:flex-start;gap:8px;padding:21px 25px;display:flex}.table-played-cards{width:100%;height:var(--card-height);min-height:var(--card-height);flex-direction:row;justify-content:center;align-items:center;gap:8px;max-width:100%;margin:auto 0;display:flex}.table-played-cards[data-layout-mode=overlap] .table-card-img+.table-card-img{margin-left:calc(var(--table-overlap,0px) * -1)}.table-card-img{flex:0 0 var(--card-width);width:var(--card-width);height:var(--card-height);object-fit:cover;background:0 0;border-radius:6px;margin-left:0;display:block}.table-play-type{color:var(--text-secondary);text-transform:uppercase;align-self:flex-end;font-size:12px;font-weight:600;line-height:18px}#card-hand-area,.game-card-hand{z-index:6;box-sizing:border-box;width:100%;max-width:100%;height:var(--card-height);flex-direction:row;justify-content:center;align-items:center;gap:8px;display:flex;position:relative;left:auto;right:auto;transform:none}.hand-card,.game-card{z-index:1;cursor:pointer;box-sizing:border-box;background:0 0;flex-direction:row;flex:0 0 102px;align-items:center;width:102px;min-width:102px;max-width:102px;height:142px;margin-left:0;transition:transform .12s;display:flex;position:relative;overflow:visible}#card-hand-area[data-layout-mode=overlap] .hand-card+.hand-card,.game-card-hand[data-layout-mode=overlap] .game-card+.game-card{margin-left:calc(var(--hand-overlap,0px) * -1)}.hand-card:hover{transform:translateY(-2px)}.hand-card.selected,.card-selected,.hand-card.selected:hover,.card-selected:hover{transform:translateY(-24px)!important}.hand-card-face{object-fit:contain;pointer-events:none;background:0 0;width:100%;height:100%;display:block}.hand-card:hover .hand-card-face,.hand-card.selected .hand-card-face{box-shadow:none}#game-actions,.game-actions-container,#action-buttons{z-index:10;box-sizing:border-box;pointer-events:none;flex-direction:row;flex:auto;justify-content:center;align-items:center;gap:8px;width:100%;height:100%;padding:0 20px;display:flex;position:relative;left:auto;right:auto}#action-buttons>*{pointer-events:auto}#game-sidebar{background:#0f1012b3;flex-direction:column;width:320px;display:flex}#sidebar-header{border-bottom:1px solid var(--border);padding:20px;font-size:36px;font-weight:500}.game-room-title{height:auto;color:var(--text-primary);font:inherit;appearance:none;-webkit-user-select:none;user-select:none;background:0 0;border-radius:8px;align-items:center;gap:8px;padding:4px 8px;font-weight:500;line-height:1;transition:background-color .12s,border-color .12s,box-shadow .12s;display:inline-flex}.game-room-title.is-clickable{cursor:pointer}.game-room-title.is-clickable:hover,.game-room-title.is-clickable:focus-visible{background:#ffffff0f;outline:none}.game-room-title.is-clickable:active,.game-room-title:active{background:#ffffff1a}.game-room-title:disabled{cursor:default;opacity:.6}.game-room-title:disabled:hover,.game-room-title:disabled:focus-visible{color:var(--text-primary);background:0 0}#scoreboard-section{box-sizing:border-box;border-bottom:1px solid var(--border);flex-direction:column;gap:14px;height:auto;padding:20px;display:flex}.sidebar-section-title{color:var(--text-primary);font-size:18px;font-weight:500;display:flex}#player-list{flex-direction:column;width:100%;display:flex}.player-item{box-sizing:border-box;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;width:100%;padding:5px 20px;display:grid}.landlord-indicator{vertical-align:middle;color:#e2b42b;background:#391c08;border:1.5px solid #e2b42b;border-radius:4px;justify-content:center;align-items:center;width:20px;height:20px;margin-left:8px;font-size:11px;font-weight:800;line-height:16px;display:inline-flex}.player-name{min-width:0;color:var(--text-primary);text-overflow:ellipsis;white-space:nowrap;font-size:14px;font-weight:500;line-height:20px;display:block;overflow:hidden}.card-count{box-sizing:border-box;border:1px solid var(--border);border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;min-width:28px;padding:4px 8px;font-size:12px;font-weight:600;line-height:18px;display:flex;color:var(--text-primary)!important}#chat-section{box-sizing:border-box;flex-direction:column;flex:1;align-items:flex-start;gap:14px;width:100%;min-height:0;padding:20px;display:flex}#chat-messages{box-sizing:border-box;width:100%;min-height:0;color:var(--text-secondary);letter-spacing:.15px;word-wrap:anywhere;overflow-wrap:break-word;flex-direction:column;flex:1;align-items:flex-start;gap:10px;padding:0 0 8px;font-size:14px;font-weight:600;line-height:20px;display:flex;overflow:hidden auto}#chat-input-container{border-top:1px solid var(--border);flex-shrink:0;width:100%;padding:12px}#chat-input{border:1px solid var(--border-strong);background:var(--surface-solid);width:100%;height:40px;color:var(--text-primary);outline:none;padding:20px;font-size:14px}.chat-message{box-sizing:border-box;flex-direction:column;gap:6px;width:100%;padding:5px 20px;display:flex}.chat-sender{color:var(--text-primary);font-size:13px;font-weight:700}.chat-message.server .chat-sender{color:var(--cyan)}.chat-message.own .chat-sender{color:#9ad37f}.chat-message-body{flex-direction:column;gap:4px;width:100%;display:flex}.chat-text{max-width:100%;color:var(--text-secondary);word-wrap:anywhere;white-space:normal;overflow-wrap:break-word;background:0 0;margin:0;padding:0;font-size:14px;font-weight:500;line-height:20px;display:block}