/* Programmatic page-heading focus is retained for screen readers, without a frame. */
#commander-table .ct-navigation-heading:focus{outline:none!important}
#commander-table #ct-messages .op-chat-composer{flex-wrap:nowrap;align-items:center}
#commander-table #ct-messages .op-chat-composer textarea{flex:1 1 0;min-height:44px;height:44px;max-height:100px;font-size:16px;line-height:22px;padding:10px;outline-offset:-2px}
#commander-table #ct-messages .op-chat-composer button{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;min-height:44px;margin:0;padding:10px}
#commander-table #ct-messages .op-message-list{gap:12px;justify-content:flex-start}
#commander-table #ct-messages .op-message-list>li{margin:0!important}
#commander-table .ct-app-nav button:not(#ct-nav-play)[aria-current=page]>svg{border-radius:50%;overflow:visible;box-sizing:content-box;padding:5px;margin:-5px;background-clip:padding-box}
/* Only the content scrolls; the bar is anchored to the shell, never the document. */
html:has(#commander-table[data-device-view=smartphone]:not([data-screen=tracker]) .ct-app-nav),
body:has(#commander-table[data-device-view=smartphone]:not([data-screen=tracker]) .ct-app-nav){overflow:hidden;height:100%;overscroll-behavior:none}
#commander-table[data-device-view=smartphone]:has(.ct-app-nav):not([data-screen=tracker]){position:fixed;inset:var(--op-visible-top,0px) 0 auto;box-sizing:border-box;width:100%;height:var(--op-visible-height,100dvh)!important;min-height:0!important;padding:env(safe-area-inset-top,0px) 0 calc(100px + env(safe-area-inset-bottom,0px))!important;overflow:hidden}
#commander-table[data-device-view=smartphone]:not([data-screen=tracker]) #ct-lobby{height:100%!important;min-height:0!important;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;padding:8px 16px 24px!important}
#commander-table[data-device-view=smartphone] .ct-app-nav{position:absolute;top:auto;bottom:0;height:calc(76px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);box-sizing:border-box}
#commander-table[data-device-view=smartphone] .ct-profiles-page.op-own-profile{min-height:0}
#commander-table[data-device-view=smartphone] #ct-lobby:has(#ct-messages){overflow:hidden}
#commander-table[data-device-view=smartphone] .ct-profiles-page:has(#ct-messages){height:100%;padding:0}
#commander-table[data-device-view=smartphone] #ct-messages.op-messages-layout{height:100%;min-height:0}
#commander-table[data-device-view=smartphone][data-keyboard=true]:not([data-screen=tracker]){padding-bottom:8px!important}
#commander-table[data-device-view=smartphone][data-keyboard=true] .ct-app-nav{display:none}

#orbunity-content:has(#commander-table[data-device-view=smartphone]:not([data-screen=tracker]) .ct-app-nav){min-height:100dvh}
/* Status markers face the table centre; tax faces the outer edge. */
#commander-table[data-tableau=commander] .ct-panel[data-status-edge=left]>.ct-head>.ct-name-status{order:0;margin-left:0;margin-right:auto}
#commander-table[data-tableau=commander] .ct-panel[data-status-edge=left]>.ct-head>.ct-shared-tax{order:2;margin-left:auto}
#commander-table[data-tableau=commander] .ct-panel[data-status-edge=right]>.ct-head>.ct-name-status{order:2;margin-left:auto;margin-right:0}
#commander-table[data-tableau=commander] .ct-panel[data-status-edge=right]>.ct-head>.ct-shared-tax{order:0;margin-left:0}
#commander-table .ct-panel .ct-head>.ct-damage-strip{height:calc(var(--ct-top-control-size)*.75);gap:3px}
#commander-table .ct-damage-strip>.ct-damage-seat{width:calc(var(--ct-top-control-size)*.75);height:calc(var(--ct-top-control-size)*.75)}
#commander-table .ct-damage-strip::before{inset:-4px;border-radius:8px}
/* Tracker popups share one translucent window; the tableau behind stays clear. */
#commander-table[data-screen=tracker] .ct-overlay:not(:has(.ct-counter-dialog)){background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
#commander-table[data-screen=tracker] .ct-dialog:not(.ct-counter-dialog){background:rgba(16,22,46,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid #929ab477;padding:16px;text-align:center;box-sizing:border-box}
#commander-table[data-screen=tracker] .ct-player-dialog:not(.ct-counter-dialog){display:flex;flex-direction:column;justify-content:center;gap:8px}
#commander-table[data-screen=tracker] .ct-dialog:not(.ct-counter-dialog)>:is(h3,p){text-align:center;margin:4px 24px}
#commander-table[data-screen=tracker] .ct-dialog:not(.ct-counter-dialog) .ct-row{justify-content:center}
#commander-table .ct-player-dialog #ct-assign-damage{flex:0 1 auto;gap:10px;min-height:0;align-items:center}
#commander-table .ct-damage-wheels{display:flex;justify-content:center;gap:14px;width:min(100%,440px);min-height:0}
#commander-table .ct-damage-wheel-column{flex:0 0 calc((100% - 14px)/2);min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px}
#commander-table .ct-damage-wheel-column h4{font-size:clamp(12px,2vw,18px);line-height:1.2;margin:0;overflow-wrap:anywhere}
#commander-table .ct-damage-wheel-column .ct-damage-wheel{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:none;width:100%;height:clamp(90px,calc(var(--menu-height,400px)*.44),180px);min-height:0;padding:0;touch-action:none;user-select:none;cursor:ns-resize;background:rgba(17,26,74,.35);border:1px solid #929ab477;border-radius:12px;line-height:1}
#commander-table .ct-damage-wheel-column .ct-damage-wheel>output{font-size:clamp(48px,calc(var(--menu-height,400px)*.24),100px)!important;line-height:1;font-weight:700;color:#E5C84A}
#commander-table .ct-damage-wheel-column .ct-damage-wheel>span{font-size:clamp(14px,calc(var(--menu-height,400px)*.06),24px);min-height:16px;line-height:1;opacity:.4}
#commander-table #ct-assign-damage>button{width:min(100%,440px)}
#commander-table[data-screen=tracker] .ct-player-dialog:has(#ct-assign-damage){display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:4px;padding:8px}
#commander-table[data-screen=tracker] .ct-player-dialog:has(#ct-assign-damage)>:is(h3,p){margin:0 24px;font-size:clamp(11px,calc(var(--menu-height)*.07),18px);line-height:1.15}
#commander-table .ct-player-dialog #ct-assign-damage{display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;align-items:stretch;gap:4px}
#commander-table .ct-damage-wheels{height:100%;max-height:220px;align-self:start}
#commander-table .ct-damage-wheel-column{min-height:0;gap:2px}
#commander-table .ct-damage-wheel-column h4{font-size:clamp(10px,calc(var(--menu-height)*.065),18px);width:100%;min-width:0;max-height:1.2em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;flex-shrink:0}
#commander-table .ct-damage-wheel-column .ct-damage-wheel{flex:1;min-height:0;height:auto;max-height:180px}
#commander-table .ct-damage-wheel-column .ct-damage-wheel>output{font-size:clamp(28px,calc(var(--menu-height)*.20),100px)!important}
#commander-table .ct-damage-wheel-column .ct-damage-wheel>span{min-height:10px;font-size:clamp(10px,calc(var(--menu-height)*.05),24px)}
#commander-table #ct-assign-damage>button{min-height:28px;padding:4px 8px;font-size:clamp(11px,calc(var(--menu-height)*.06),16px)}
/* Keep wheel columns within their grid row, including labels and borders. */
#commander-table .ct-damage-wheels{box-sizing:border-box;overflow:hidden}
#commander-table .ct-damage-wheel-column{margin:0;padding:0;border:0;background:none;box-sizing:border-box;display:grid;grid-template-rows:auto minmax(0,1fr)}
#commander-table .ct-damage-wheel-column .ct-damage-wheel{box-sizing:border-box;height:100%;width:100%;margin:0;min-height:0;min-width:0;overflow:hidden}
#commander-table .ct-damage-wheel:focus{outline-offset:-3px}
/* A game owns the full phone viewport, including the camera/home safe areas. */
#commander-table[data-screen=tracker] #ct-lobby{display:none!important}
html:has(#commander-table[data-device-view=smartphone][data-screen=tracker]),body:has(#commander-table[data-device-view=smartphone][data-screen=tracker]){background:#000!important;overflow:hidden;overscroll-behavior:none}
#commander-table[data-device-view=smartphone][data-screen=tracker]{position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;min-height:0!important;max-width:none!important;margin:0!important;padding:0!important;background:#000!important;background-image:none!important;border:0;border-radius:0;z-index:100;isolation:isolate;overflow:hidden}
#commander-table[data-device-view=smartphone][data-screen=tracker] .ct-phone-table{background:#000}
#commander-table[data-phone-table] .ct-seat .ct-panel{--ct-damage-height:44px}
#commander-table[data-phone-table] .ct-player-menu-trigger .ct-menu-six{grid-template-columns:repeat(3,5px);grid-template-rows:repeat(2,5px);gap:2px}
#commander-table[data-phone-table] .ct-menu-six>span{width:5px;height:5px}
#commander-table .ct-panel>.ct-life .ct-number{display:flex;align-items:center;justify-content:center}
/* All opponent damage controls fit the owning tableau without scrolling. */
#commander-table .ct-player-dialog:has(.ct-damage-editor){display:grid!important;grid-template-rows:auto minmax(0,1fr) auto;gap:5px;padding:8px!important;overflow:hidden}
#commander-table .ct-player-dialog:has(.ct-damage-editor)>h3{font-size:clamp(10px,calc(18px*var(--editor-unit)),18px);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 24px!important}
#commander-table .ct-damage-editor{display:grid;grid-template-columns:repeat(var(--editor-columns,3),minmax(0,1fr));grid-template-rows:repeat(var(--editor-rows,1),minmax(0,1fr));gap:5px;margin:0;min-height:0;min-width:0}
#commander-table .ct-damage-editor section{display:flex;flex-direction:column;gap:3px;min-height:0;min-width:0;padding:4px;overflow:hidden}
#commander-table .ct-damage-editor h4{font-size:clamp(9px,calc(16px*var(--editor-unit)),16px);line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;flex:none}
#commander-table .ct-damage-correction{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:2px}
#commander-table .ct-damage-correction+.ct-damage-correction{margin-top:0}
#commander-table .ct-damage-correction>span{font-size:clamp(8px,calc(12px*var(--editor-unit)),12px);line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none}
#commander-table .ct-damage-correction>div{grid-template-columns:minmax(18px,1fr) minmax(0,1fr) minmax(18px,1fr);gap:2px;margin:0;min-height:0}
#commander-table .ct-damage-correction button{width:100%;min-width:0;height:clamp(18px,calc(36px*var(--editor-unit)),36px);min-height:0;padding:0;font-size:clamp(14px,calc(24px*var(--editor-unit)),24px);line-height:1}
#commander-table .ct-damage-correction output{font-size:clamp(13px,calc(26px*var(--editor-unit)),26px);line-height:1}
#commander-table .ct-player-dialog .ct-damage-coupling{display:flex;align-items:center;justify-content:center;gap:5px;font-size:12px;line-height:1.2;margin:0}
#commander-table .ct-damage-coupling input{width:16px;height:16px;min-height:0;margin:0}
#commander-table .ct-damage-editor section{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto minmax(0,1fr);gap:3px}
#commander-table .ct-damage-editor section>h4{grid-column:1/-1}
#commander-table .ct-damage-editor section>.ct-damage-correction:only-of-type{grid-column:1/-1}
#commander-table .ct-damage-correction>div{grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr)}
