/* Quick/private room creation dialogs */
#quick-play-modal,#create-room-modal { background:rgba(1,7,13,.84); backdrop-filter:blur(5px); }
.game-create-modal { position:relative; width:min(620px,100%); max-width:620px; padding:25px 30px 22px; overflow:hidden auto; border:1px solid #b38a11; border-radius:20px; background:linear-gradient(145deg,#07131d,#0b1a25 60%,#07111a); box-shadow:0 28px 80px #000d,0 0 35px #e7b90012; color:#f6f8fb; }
.creation-intro { display:flex; align-items:center; gap:16px; min-height:76px; padding:0 58px 15px 0; border-bottom:1px solid #ffffff12; }
.creation-intro img { width:72px; height:72px; object-fit:contain; filter:drop-shadow(0 6px 10px #0008); }
.creation-intro h2 { margin:0 0 5px; font-size:27px; line-height:1.05; }
.creation-intro p { margin:0; color:#aeb9c7; font-size:14px; }
.creation-intro + .modal-header { position:absolute; top:25px; right:27px; margin:0; }
.creation-intro + .modal-header > span { display:none; }
.creation-intro + .modal-header .modal-close { width:43px; height:43px; display:grid; place-items:center; border:2px solid #d1a72c; background:#101c26; font-size:0; }
.creation-intro + .modal-header .modal-close::before { content:"×"; color:white; font-size:28px; font-weight:300; line-height:1; }
.game-create-modal .creation-section-label,.game-create-modal > .field-label { margin:18px 0 9px !important; color:#eef2f7; font-size:15px; font-weight:800; letter-spacing:.1px; }
.game-create-modal .creation-section-label::before,.game-create-modal > .field-label:not(.creation-section-label)::before { content:""; display:inline-block; width:16px; height:16px; margin-right:9px; vertical-align:-3px; border:2px solid #ffda00; border-radius:50%; box-shadow:inset 0 0 0 3px #0a1721; background:#ffda00; }
.creation-stakes,#qp-stakes-pre,#cr-stakes { display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important; gap:8px !important; }
.game-create-modal .stake-btn { min-height:45px; padding:8px 5px; border:1px solid #485b6b; border-radius:10px; background:#101e29; color:#f4f6f8; font-size:14px; font-weight:800; }
.game-create-modal .stake-btn:hover { border-color:#d7ae1f; background:#182835; }
.game-create-modal .stake-btn.active { border-color:#ffe000; background:linear-gradient(#ffe42b,#ffc900); color:#171300; box-shadow:0 0 18px #ffd80038; }
.game-create-modal > div[style*="display:flex"] { margin-top:10px !important; }
.game-create-modal > div[style*="display:flex"] > .field-label { display:none; }
.game-create-modal .lobby-input { width:100%; min-height:48px; border:1px solid #4c5e6d; border-radius:10px; background:#0e1b26; color:white; font-size:14px; }
.game-create-modal .lobby-input:focus { border-color:#d4ac22; box-shadow:0 0 0 3px #d4ac2222; outline:none; }
.game-create-modal .lobby-input::placeholder { color:#738292; }
.game-create-modal select.lobby-input { cursor:pointer; color:#f7f8fa; }
.game-create-modal .modal-native-select { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.room-player-options { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.room-player-options button { min-height:46px; border:1px solid #4b5d6c; border-radius:10px; background:#101e29; color:#eef2f6; font-weight:800; cursor:pointer; }
.room-player-options button:hover { border-color:#d7ae1f; }
.room-player-options button.active { border-color:#ffe000; background:linear-gradient(#ffe42b,#ffc900); color:#171300; box-shadow:0 0 18px #ffd80030; }
.game-create-modal .quick-modal-note { margin-top:13px; padding:10px 12px; border:1px solid #bd9b281f; border-radius:9px; background:#caa8000d; color:#aeb9c5; font-size:11px; }
.game-create-modal .lobby-btn.primary { width:100% !important; min-height:53px; margin-top:15px !important; border-radius:10px; background:linear-gradient(#ffe62b,#ffd000); color:#141100; font-size:17px; font-weight:900; box-shadow:0 8px 20px #ffd60020; }
.creation-cancel { width:100%; min-height:36px; margin-top:7px; border:0; background:transparent; color:#aeb8c4; font-weight:700; cursor:pointer; }
.creation-cancel:hover { color:white; }

@media (max-width:640px) {
  #quick-play-modal,#create-room-modal { align-items:flex-end; padding:8px; }
  .game-create-modal { max-height:calc(100dvh - 12px); padding:18px 15px 16px; border-radius:18px 18px 10px 10px; }
  .creation-intro { min-height:61px; gap:10px; padding-right:48px; }
  .creation-intro img { width:54px; height:54px; }
  .creation-intro h2 { font-size:21px; }
  .creation-intro p { font-size:11px; line-height:1.3; }
  .creation-intro + .modal-header { top:17px; right:15px; }
  .creation-intro + .modal-header .modal-close { width:40px; height:40px; }
  .creation-stakes,#qp-stakes-pre,#cr-stakes { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .game-create-modal .stake-btn { min-height:41px; }
  .game-create-modal .creation-section-label,.game-create-modal > .field-label { margin-top:14px !important; }
}

/* Compact creation dialogs use the same 1280 x 598 scale as the dashboard. */
@media (min-width:641px) {
  #quick-play-modal .game-create-modal,#create-room-modal .game-create-modal{width:440px;max-width:calc(100vw - 24px);max-height:calc(100dvh / var(--creation-scale,1) - 20px);padding:16px 18px 14px;transform:scale(var(--creation-scale,1));transform-origin:center;border-radius:16px}
  #quick-play-modal .creation-intro,#create-room-modal .creation-intro{min-height:56px;gap:11px;padding:0 48px 9px 0}
  #quick-play-modal .creation-intro img,#create-room-modal .creation-intro img{width:52px;height:52px}
  #quick-play-modal .creation-intro h2,#create-room-modal .creation-intro h2{margin-bottom:3px;font-size:21px}
  #quick-play-modal .creation-intro p,#create-room-modal .creation-intro p{font-size:11px}
  #quick-play-modal .creation-intro+.modal-header,#create-room-modal .creation-intro+.modal-header{top:15px;right:17px}
  #quick-play-modal .creation-intro+.modal-header .modal-close,#create-room-modal .creation-intro+.modal-header .modal-close{width:34px;height:34px;border-width:1px}
  #quick-play-modal .creation-intro+.modal-header .modal-close::before,#create-room-modal .creation-intro+.modal-header .modal-close::before{content:"×";font-size:23px}
  #quick-play-modal .creation-section-label,#quick-play-modal>.field-label,#create-room-modal .creation-section-label,#create-room-modal>.field-label{margin:10px 0 6px!important;font-size:12px}
  #quick-play-modal .creation-section-label::before,#quick-play-modal>.field-label:not(.creation-section-label)::before,#create-room-modal .creation-section-label::before,#create-room-modal>.field-label:not(.creation-section-label)::before{width:13px;height:13px;margin-right:7px}
  #quick-play-modal .creation-stakes,#quick-play-modal #qp-stakes-pre,#create-room-modal #cr-stakes{gap:5px!important}
  #quick-play-modal .stake-btn,#create-room-modal .stake-btn{min-height:36px;padding:6px 3px;border-radius:8px;font-size:11px}
  #quick-play-modal .game-create-modal>div[style*="display:flex"],#create-room-modal .game-create-modal>div[style*="display:flex"]{margin-top:6px!important}
  #quick-play-modal .lobby-input,#create-room-modal .lobby-input{min-height:38px;border-radius:8px;font-size:11px}
  #quick-play-modal .room-player-options,#create-room-modal .room-player-options{gap:6px}
  #quick-play-modal .room-player-options button,#create-room-modal .room-player-options button{min-height:37px;border-radius:8px;font-size:11px}
  #quick-play-modal .quick-modal-note{margin-top:8px;padding:7px 9px;border-radius:7px;font-size:9px}
  #quick-play-modal .lobby-btn.primary,#create-room-modal .lobby-btn.primary{min-height:42px;margin-top:10px!important;border-radius:8px;font-size:14px}
  #quick-play-modal .creation-cancel,#create-room-modal .creation-cancel{min-height:27px;margin-top:4px;font-size:11px}
}
