/* Provider-authored art is the entire visual skin. These rules fit live text,
   native inputs and invisible hit areas into the measured Higgsfield regions. */
*{box-sizing:border-box}body{margin:0;background:#050c12;color:#e1f7ff;font-family:Arial,sans-serif}main{max-width:1920px;margin:auto}#viewport{overflow:auto}#screen{position:relative;width:100%;min-width:0;aspect-ratio:1344/752;container-type:inline-size}.skin{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.region{position:absolute}.hit{border:0;background:transparent;color:inherit;cursor:pointer;padding:0;font:inherit}.hit:focus-visible{outline:2px solid white;outline-offset:2px}.hit[aria-pressed=true]{backdrop-filter:brightness(1.18)}.copy{font-size:1.1cqw;line-height:1.3;margin:0;overflow:hidden}.small{font-size:.85cqw}.large{font-size:1.7cqw}.center{text-align:center}.portrait{object-fit:cover;object-position:50% 12%;pointer-events:none}.gallery-picture{overflow:hidden;pointer-events:none}.gallery-picture img{width:100%;height:100%;object-fit:cover;object-position:50% 4%;transform:scale(2.1);transform-origin:50% 10%}.field{margin:0;padding:.25cqw .65cqw;border:0;color:#e1f7ff;background:transparent;font-size:1cqw;line-height:1.25;appearance:none}.field option{background:#10232e;color:#e1f7ff}.grid-cell{font-size:2cqw;text-align:center;line-height:1;white-space:pre-line}.grid-cell[aria-pressed=true]{backdrop-filter:brightness(1.2)}#status,#mode{font-size:13px;line-height:1.45;margin:8px 16px}#status:empty{display:none}#mode{opacity:.8}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){video.skin{display:none}}

#screen[data-loading] .region{visibility:hidden}.hit[id^="mastery-"][aria-pressed="false"]{backdrop-filter:brightness(.62)}

.trim-motion{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 93%,99% 93%,99% 8%,1% 8%,1% 93%,0 93%)}

/* Fit the authored board and its measured hit areas to the available viewport. */
html,body{height:100%;overflow:hidden}body{background:transparent}main{width:100%;height:100dvh;min-height:0;display:flex;flex-direction:column}
#viewport{flex:1;min-height:0;min-width:0;display:grid;place-items:center;overflow:hidden;container-type:size}
#screen{width:min(100cqw,calc(100cqh * 1.787234));min-width:0;flex:none}
#status,#mode{flex:none;font-size:12px;margin:5px 12px;overflow-wrap:anywhere}#mode{line-height:1.3}

:root{color-scheme:dark}html{background:transparent}
@media(max-width:600px){.copy{font-size:max(8px,1.1cqw)}.small{font-size:max(7px,.85cqw)}.large{font-size:max(10px,1.7cqw)}.field{font-size:max(9px,1cqw)}#status,#mode{font-size:10px}}

/* Full phone canvas: the authored board is the screen, not a card over a second backdrop. */
@media(orientation:landscape) and (max-height:600px){
html.touch-game,html.touch-game body{background:#050c12}
html.touch-game main{height:calc(100dvh - var(--switchbar-height,0px));position:relative}
html.touch-game #viewport{width:100%;height:100%;display:block}
html.touch-game #screen{width:100%;height:100%;aspect-ratio:auto}
html.touch-game #mode{display:none}
html.touch-game #status:not(:empty){position:absolute;left:20%;right:20%;bottom:0;background:#071722f0;padding:6px;z-index:30}
}