/* Stable slots shared by phones and in-page landscape fallback. */
:root{color-scheme:only light}html,body{width:100%;height:100%;overflow:hidden;background:#111820;color:#f9edce;overscroll-behavior:none;-webkit-text-size-adjust:100%;text-size-adjust:100%}
#board{forced-color-adjust:none;overflow:clip}#board img{background-color:transparent!important}button{touch-action:manipulation}
#rotate-hint{display:none!important}.portrait-gate #board{visibility:hidden}.portrait-gate #rotate-hint{position:fixed;inset:0;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#111820;color:#f9edce;padding:24px;text-align:center;z-index:100;font-size:18px}.portrait-gate #rotate-hint button{font-size:20px;padding:14px 28px}
#decision-timer{display:none!important}
.turn-ring{position:absolute;width:76px;height:132px;left:calc(100% + 37px);right:auto;top:-35px;bottom:auto;background:none;mask:none;-webkit-mask:none;border-radius:0;animation:none;pointer-events:none;z-index:7;filter:drop-shadow(0 0 4px #ffb334)}
.turn-ring svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.turn-ring path{fill:none;stroke-linecap:round;stroke-width:4}.clock-track{stroke:#d5b27835}.clock-progress{stroke:#ffca62;transition:stroke-dasharray .1s linear}.clock-label{position:absolute;left:0;right:10px;top:43%;font:700 26px Georgia,serif;color:#ffe5a0;text-align:center;text-shadow:0 2px 3px #000}
#opponents>.player:nth-child(3) .turn-ring,#opponents>.player:nth-child(4) .turn-ring{left:auto;right:calc(100% + 37px)}
#opponents>.player:nth-child(3) .turn-ring svg,#opponents>.player:nth-child(4) .turn-ring svg{transform:scaleX(-1)}
#self .turn-ring{top:-75px;left:auto;right:-65px;width:70px;height:122px}
.compact-board #board{background-size:100% 100%}
.compact-board #oracle-bar{left:485px;width:660px;height:64px;top:6px;padding:6px 18px}.compact-board #oracle{font-size:23px}.compact-board #top-status{right:85px;top:14px;font-size:23px}.compact-board #settings-open{top:9px;width:55px;height:55px}
.compact-board .player{width:240px;height:220px}.compact-board .portrait{width:265px;height:265px;left:-12px;bottom:-18px}
.compact-board #opponents>.player:nth-child(1){left:70px;top:326px}.compact-board #opponents>.player:nth-child(2){left:285px;top:76px}.compact-board #opponents>.player:nth-child(3){right:285px;top:76px}.compact-board #opponents>.player:nth-child(4){right:70px;top:326px}
.compact-board .player-info{left:0;right:0}.compact-board .nameplate{height:42px}.compact-board .nameplate strong{font-size:25px;padding:0 38px}.compact-board .faction,.compact-board .light-badge{width:36px;height:36px}.compact-board .light-badge>.light-symbol{width:28px;height:28px}
.compact-board .resource-row{bottom:48px}.compact-board .gem{width:26px;height:26px}.compact-board .equipment-strip{left:-51px;top:35px;gap:3px}.compact-board .equipment-slot{width:46px;height:46px}.compact-board #opponents>.player:nth-child(3) .equipment-strip,.compact-board #opponents>.player:nth-child(4) .equipment-strip{left:auto;right:-51px}
.compact-board .state-icons{bottom:44px;max-height:110px;gap:4px}.compact-board .state{width:40px;height:40px}.compact-board .state b{font-size:18px}
.compact-board #self{left:706px;width:260px;height:265px;bottom:1px}.compact-board #self .portrait{width:290px;height:290px;left:-15px;bottom:-18px}.compact-board #self .equipment-strip{left:-624px;top:28px}.compact-board #self .equipment-slot{width:60px;height:60px}.compact-board #self .state-icons{right:-48px;bottom:150px}
.compact-board #altar{left:762px;top:29%;height:68px}.compact-board .altar-card{width:48px;height:72px;left:calc(var(--i)*27px)}.compact-board #flame{top:38%;font-size:27px}
.compact-board #action-card{left:627px;top:44%;width:160px;height:230px}.compact-board #action-card .resolved-card{width:150px;height:225px}.compact-board #notice{left:823px;top:44%;width:370px;max-height:160px;font-size:24px;padding:10px 14px}.compact-board #prompt{font-size:inherit}
.compact-board .hand-side{height:310px;bottom:12px}.compact-board #cards-left{left:150px;width:480px}.compact-board #cards-right{left:1050px;width:382px}.compact-board .card{--card-width:207px;width:207px;height:310px}.compact-board #hand .card-title{font-size:min(27px,calc(145px / var(--name-length,7)))}.compact-board #hand .card-cost{font-size:38px}.compact-board .card-info{font-size:23px;opacity:1;padding:8px;bottom:23px;right:17px}
.compact-board #controls{width:213px;bottom:14px;right:8px}.compact-board #options{max-height:190px;gap:7px}.compact-board #options button,.compact-board #options button:first-child{min-height:74px;font-size:25px}.compact-board #skills{bottom:226px;right:12px;width:203px;gap:12px}.compact-board #skills button{width:75px;height:75px}.compact-board #skills button span{font-size:18px;bottom:-24px;white-space:normal}
.compact-board #history{font-size:22px;left:6px;bottom:4px}.compact-board #private-open{top:6px;font-size:23px;padding:7px}.compact-board #autoplay-return{bottom:214px;left:12px;font-size:19px}

/* Quiet three-quarter arc hugging the inner edge of the portrait. */
.turn-ring{width:82px;height:82px;left:auto;right:-24px;top:20px;filter:drop-shadow(0 0 2px #ffba4b)}
.turn-ring path{stroke-width:3}.clock-label{display:none}
#opponents>.player:nth-child(3) .turn-ring,#opponents>.player:nth-child(4) .turn-ring{right:auto;left:-24px}
#self .turn-ring{width:82px;height:82px;right:0;top:-8px;left:auto}
.compact-board .turn-ring{width:78px;height:78px;top:10px}.compact-board #self .turn-ring{top:0;right:0}
[data-inspect]{-webkit-touch-callout:none;user-select:none}

#skills button[aria-disabled="true"]{filter:grayscale(.8);opacity:.48;cursor:default}
/* 2026-10-04: head-facing opening; isolated badge and hand-count lanes. */
.turn-ring{right:50px;top:-10px;width:82px;height:82px}
#opponents>.player:nth-child(3) .turn-ring,#opponents>.player:nth-child(4) .turn-ring{left:50px;right:auto}
#self .turn-ring{right:50px;top:-10px}
.compact-board .turn-ring{right:20px;top:-37px}
.compact-board #opponents>.player:nth-child(3) .turn-ring,.compact-board #opponents>.player:nth-child(4) .turn-ring{left:20px;right:auto}
.compact-board #self .turn-ring{right:24px;top:-37px}
.nameplate,.compact-board .nameplate{margin:0 21px}
.faction,.light-badge,.compact-board .faction,.compact-board .light-badge{width:48px;height:48px;top:50%;transform:translateY(-50%)}
.faction,.compact-board .faction{right:-26px}.light-badge,.compact-board .light-badge{left:-26px}
.nameplate strong,.compact-board .nameplate strong{padding:0 25px;font-size:23px}
.light-badge>.light-symbol,.compact-board .light-badge>.light-symbol{inset:13px;width:22px;height:22px}
.light-badge.flame-bearer>.light-symbol,.compact-board .light-badge.flame-bearer>.light-symbol{inset:2px;width:44px;height:44px}
.player>.hand-count{left:calc(100% + 8px);bottom:2px}
#opponents>.player:nth-child(3)>.hand-count,#opponents>.player:nth-child(4)>.hand-count{right:calc(100% + 8px);left:auto}
.resource-row{left:calc(100% - 26px)}
#opponents>.player:nth-child(3) .resource-row,#opponents>.player:nth-child(4) .resource-row{right:calc(100% - 26px);left:auto}
#self .resource-row{right:12px;left:auto}
#autoplay-return{top:86px;bottom:auto}.compact-board #autoplay-return{top:66px;bottom:auto}
#arrows .target-sprite{fill:none;stroke:#ffda82;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 3px #bf8930)}
/* Quarter arc follows the head; status stack sits directly above hand count. */
.turn-ring{right:20px;top:15px}
#self .turn-ring{right:6px;top:15px}
#opponents>.player:nth-child(3) .turn-ring,#opponents>.player:nth-child(4) .turn-ring{left:20px;right:auto}
.compact-board .turn-ring{right:21px;top:-14px}
.compact-board #opponents>.player:nth-child(3) .turn-ring,.compact-board #opponents>.player:nth-child(4) .turn-ring{left:21px;right:auto}
.compact-board #self .turn-ring{right:6px;top:-9px}
.player .state-icons,.compact-board .player .state-icons,#self .state-icons,.compact-board #self .state-icons{left:calc(100% + 5px);right:auto;bottom:48px;gap:4px}
#opponents>.player:nth-child(3) .state-icons,#opponents>.player:nth-child(4) .state-icons{left:auto;right:calc(100% + 5px)}
#autoplay-return{left:73px;top:auto;bottom:249px}
.compact-board #autoplay-return{left:82px;top:auto;bottom:248px}

.turn-ring .clock-progress{stroke:#ffda82;stroke-width:4;filter:drop-shadow(0 0 3px #bf8930)}
/* Lobby stays outside the scaled battlefield and scrolls on short landscape screens. */
#room-lobby{width:min(680px,90vw);max-height:86dvh;font-size:16px}
#room-lobby .room-field{display:flex;align-items:center;gap:10px;margin:12px 0}
#room-lobby .room-field input{flex:1;min-width:0;width:auto;font-size:16px;padding:8px}
#room-lobby details{margin:14px 0;border:1px solid #947348;border-radius:7px;padding:10px}
#room-lobby summary{cursor:pointer;color:#ffda82}
#room-lobby .room-list-heading{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#room-lobby .room-list-heading h3{margin-right:auto}
#room-lobby .room-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 12px;align-items:center;border-top:1px solid #665237;padding:12px 0}
#room-lobby .room-row strong{overflow-wrap:anywhere}
#room-lobby .room-row span{grid-column:1;font-size:14px;color:#ddd1b4}
#room-lobby .room-row button{grid-column:2;grid-row:1 / 3;min-height:40px}
#room-lobby .room-help{font-size:13px;line-height:1.5;color:#c3b797}
#room-lobby #room-message{color:#ffda82}
#room-lobby #room-join-form{border:1px solid #947348;padding:12px;margin:12px 0;border-radius:7px}
#room-lobby button{min-height:38px}
/* Expanded altar cards share the central play area; original stack stays put. */
#altar-picker{position:absolute;left:836px;top:43%;width:620px;height:264px;transform:translateX(-50%);z-index:13;pointer-events:none}
#altar-picker[hidden]{display:none}
.altar-choice{position:absolute;top:0;width:176px;height:264px;padding:0;background:none;border:0;border-radius:6px;pointer-events:auto;cursor:pointer;transition:transform .12s,filter .12s}
.altar-choice .card-title{font-size:min(23px,calc(118px / var(--name-length,7)))}.altar-choice .card-cost{font-size:32px}
.altar-choice:hover,.altar-choice:focus-visible,.altar-choice.selected{z-index:30!important;transform:translateY(-12px);filter:drop-shadow(0 0 6px #ffda82)}
.altar-picking #action-card{visibility:hidden}
.altar-picking #notice,.compact-board.altar-picking #notice{left:526px;top:calc(43% - 65px);width:620px;text-align:center;max-height:60px;font-size:22px}
#altar-picker[data-overflow="true"]{overflow-x:auto;overflow-y:hidden;height:292px;pointer-events:auto;overscroll-behavior:contain;scrollbar-color:#947348 #172329;scrollbar-width:thin}
#altar-picker[data-overflow="true"] .altar-choice{top:14px}