/* Shared glass panels: transparency without full-screen blur layers. */
:root{--vg-glass:rgba(31,28,37,.76);--vg-glass-strong:rgba(31,28,37,.94);--vg-glass-line:rgba(216,195,210,.25)}
.starter-tile,.active-summary,.deck-entry,.play-entry{background:var(--vg-glass);border-color:var(--vg-glass-line)}
.starter-tile.chosen,.play-entry{border-color:#e7817280}
.topbar,.fight-header{background:rgba(20,21,28,.72)}
dialog{background:var(--vg-glass-strong)}
dialog::backdrop{background:#100e1b66;backdrop-filter:none}
.dialog-head,.card-actions{background:var(--vg-glass-strong)}
.setup-panel,.prompt-dock,.log-panel{background:var(--vg-glass);border-color:var(--vg-glass-line);backdrop-filter:none}
.editor-head{background:var(--vg-glass-strong)}
input,select{min-width:0;max-width:100%}
select option{background:#211d29;color:#f6edf3}
.dialog-head>span{min-width:0;overflow-wrap:anywhere}
.dialog-head .language{flex:none}
.printed-name,.card-caption,.deck-entry h2,.ability-block{overflow-wrap:anywhere}
#toast{max-width:calc(100vw - 24px);width:max-content;text-align:center;overflow-wrap:anywhere;bottom:calc(20px + env(safe-area-inset-bottom))}
.control-bar label{min-height:44px;display:inline-flex;align-items:center;gap:6px}
.control-bar input[type=checkbox]{width:20px;height:20px}
.prompt-panel [data-confirm-choice],.prompt-dock [data-confirm-choice]{position:sticky;bottom:0;margin-top:10px;z-index:2}
@media(max-width:900px),(pointer:coarse){
  button:not(.unit-slot):not(.pile):not(.hand-card):not(.damage-card):not(.card-open):not(.notice-card):not(.check-preview),.back{min-height:44px}
  .back{min-width:44px;align-items:center;justify-content:center}
  .language button,.close,.notice-close{min-width:44px;min-height:44px}
  .active-summary>a,.dialog-head>a,.setup-panel>a,.control-bar>a{display:inline-flex;align-items:center;min-height:44px}
  .toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  .toolbar #search,.toolbar #set-filter{grid-column:1/-1;width:100%}
  .toolbar input,.toolbar select{width:100%;min-height:44px;font-size:16px}
  input,select{font-size:16px} /* Avoid Safari's automatic input zoom. */
  .editor-head{position:static;padding:12px;border-radius:14px}
  .editor-line{gap:8px;min-width:0}
  .editor-line:first-child{display:grid;grid-template-columns:1fr 1fr}
  .editor-line #deck-name{grid-column:1/-1;grid-row:1;min-width:0;width:100%}
  .editor-line #first-vanguard{flex:1;min-width:0}
  .stats{gap:8px 14px}
  .counter button{min-width:44px;padding:3px 9px}
  .card-meta{flex-wrap:wrap;gap:4px}
  #card-detail:not(.compact-card) .detail-grid{display:block}
  #card-detail:not(.compact-card) .detail-image{display:none}
  #card-detail:not(.compact-card) .printed-info{padding:12px}
  #card-detail:not(.compact-card) .ability-block{font-size:13px}
  .dialog-head{gap:6px;padding:8px 10px}
  .dialog-head>span{font-size:9px;letter-spacing:.6px}
  .room-form{padding:16px;gap:10px}
  .starter-tile .hero-card{filter:drop-shadow(0 4px 5px #0006)}
  #card-detail.compact-card,.ability-notice,.intro-banner{backdrop-filter:none}
  #card-detail.compact-card{background:rgba(31,26,38,.9)}
  .ability-notice{background:rgba(37,32,45,.9)}
  .notice-close{top:2px;right:2px;padding:10px!important}
  .notice-stage{padding-right:36px}.notice-copy h3{margin-right:34px}
  .unit-slot img,.hand-card,.opponent-hand img,.guardian-stack img,.notice-card img{filter:none}
  .unit-slot.targetable,.pile.draw-ready{animation:none}
  .fight-board{box-shadow:0 6px 18px #0005}
  .choice{min-width:0;overflow-wrap:anywhere;font-size:12px}
  .prompt-dock h2{font-size:14px}.prompt-dock p{font-size:12px}
  .choice-field{display:block}
  #zone-cards{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px;padding:14px}
  .setup-panel{max-height:calc(100% - 16px);overflow:auto;overscroll-behavior:contain}
  .prompt-dock{max-height:calc(100% - 44px);overflow:auto;overscroll-behavior:contain}
  .choice-grid{overscroll-behavior:contain}
  .log-panel{font-size:12px;overscroll-behavior:contain}
}
@media(max-width:600px){
  .topbar{gap:5px;padding-inline:max(8px,env(safe-area-inset-left))}
  .logo{width:74px}.edition{letter-spacing:1px;font-size:9px}
  .language{gap:2px}.language button{padding-inline:8px}
  .starter-grid{grid-template-columns:1fr}
  .starter-tile{padding:14px;gap:12px}.starter-tile .hero-card{width:82px;flex-basis:82px}
  .active-summary{gap:12px}
  .deck-list{grid-template-columns:minmax(0,1fr)}
  .deck-entry{padding:16px}
  .tabs{gap:0;padding-inline:12px}.tabs button{flex:1;padding-inline:4px;font-size:12px}
  .play-entry{flex-wrap:wrap}.play-entry button{width:100%}
  .fight-header button{padding-inline:6px}
  .fight-header #log-toggle .button-label,.fight-header #zoom .button-label{display:none}
  .control-bar .hint{flex:1 1 140px;min-width:0}
}
@media(max-width:900px) and (max-height:600px) and (orientation:landscape){
  .fight-header{height:48px;padding-block:2px;padding-right:max(8px,env(safe-area-inset-right))}
  .fight-table{height:calc(100dvh - 48px)}
  .fight-header #log-toggle .button-label,.fight-header #zoom .button-label{display:none}
  .control-bar{min-height:44px;max-width:100%;padding-inline:8px}
  .control-bar .hint{max-width:65vw;font-size:10px}
  .fight-board{width:min(calc((100dvh - 188px)*.982318),92vw)}
  .setup-layer{bottom:130px}
  .setup-panel{padding:12px;margin:8px;width:min(510px,calc(100% - 16px))}
  .setup-panel .coin-wrap{width:48px;height:48px}
  .coin-pair{margin:6px}
  .prompt-dock{top:28px;width:min(320px,40vw);max-width:none;max-height:calc(100% - 36px)}
  .choice-grid{max-height:110px!important}
  .setup-panel .choice-grid{max-height:110px!important}
  .ability-notices{top:58px}
}
