:root{--display-background:#fff;color:#111;background:var(--display-background);font-family:system-ui,sans-serif}:root:has(#stage[data-background=black]){--display-background:#000}#stage[data-background=black]{--portrait-ink:#f3f0e7;--portrait-paper:#000;--mouth-fill:#000;--mouth-outline:#f3f0e7;--mouth-paper:#f3f0e7;--tongue-ink:#000}html,body{background:var(--display-background);width:100%;height:100%;margin:0;overflow:hidden}#app{background:var(--display-background);width:100%;height:100%;position:fixed;inset:0;overflow:hidden}#app:focus{outline:none}#stage{background:var(--display-background);width:100%;height:100%;display:block;overflow:hidden}::backdrop{background:var(--display-background)}:fullscreen{background:var(--display-background)}#app.playback-cursor-hidden,#app.playback-cursor-hidden *{cursor:none}#playback-help{box-sizing:border-box;background:#fff;border:1px solid #111;border-radius:.5rem;width:min(28rem,100% - 2rem);max-height:calc(100% - 2rem);padding:1rem;font-size:.875rem;line-height:1.5;position:absolute;bottom:1rem;right:1rem;overflow:auto}#playback-help h2{margin:0;font-size:1rem}#playback-help p{margin:.5rem 0}.playback-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.playback-actions button{min-height:2.75rem;color:inherit;font:inherit;text-align:left;cursor:pointer;background:#fff;border:1px solid #111;border-radius:.25rem;justify-content:space-between;align-items:center;gap:.5rem;padding:.5rem .75rem;display:flex}#playback-help :focus-visible{outline-offset:2px;outline:2px solid #111}.playback-actions button:disabled{opacity:.6;cursor:wait}.display-settings fieldset{border:0;min-width:0;margin:.75rem 0 0;padding:0}.display-settings legend{padding:0 0 .5rem;font-weight:600}.settings-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;display:grid}.settings-fields>div{gap:.25rem;display:grid}.settings-fields input,.settings-fields select{box-sizing:border-box;width:100%;min-width:0;min-height:2.5rem;color:inherit;font:inherit;background:#fff;border:1px solid #666;border-radius:.25rem;padding:.35rem}.settings-fields [aria-invalid=true]{border:2px solid #a00000}.settings-status{overflow-wrap:anywhere}.settings-actions button:first-child{grid-column:1/-1}@media (width<=380px){.playback-actions,.settings-fields{grid-template-columns:minmax(0,1fr)}}.performance-preview{flex-wrap:wrap;align-items:center;gap:.65rem;margin:1rem 0;display:flex}.performance-preview select,.performance-preview button{font:inherit;padding:.45rem .6rem}#playback-help [hidden]{display:none!important}#playback-help[data-mode=debug]{width:min(23rem,100% - 2rem)}#playback-help[data-mode=debug] .performance-preview{gap:.5rem;display:grid}#playback-help[data-mode=debug] .performance-preview select{width:100%;min-width:0}#playback-help[data-mode=debug] .performance-preview button{color:#fff;cursor:pointer;background:#111;border:1px solid #111;border-radius:.25rem;min-height:2.75rem}.animation-debug-status{color:#444;min-height:1.5em}#playback-help[data-mode=debug] .animation-debug-actions{grid-template-columns:repeat(2,minmax(0,1fr))}#playback-help[data-mode=background]{width:min(32rem,100% - 2rem)}#playback-help[data-mode=background]>.playback-note{display:none}.background-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin:.9rem 0;display:grid}.background-choice{color:#222;text-align:left;min-width:0;font:inherit;cursor:pointer;background:#fff;border:1px solid #deded8;border-radius:.35rem;flex-direction:column;gap:.15rem;padding:.3rem;display:flex;overflow:hidden}.background-choice[aria-pressed=true]{border-color:#111;box-shadow:0 0 0 1px #111}.background-choice img{aspect-ratio:16/9;object-fit:cover;pointer-events:none;border-radius:.15rem;width:100%;height:auto}.background-choice span{padding-top:.2rem;font-size:.75rem;line-height:1.2}.background-choice small{color:#777;font-size:.65rem}.background-weather{border-top:1px solid #ddd;margin:1rem 0;padding-top:.8rem}.background-weather label{margin-bottom:.35rem;font-weight:600;display:block}.background-weather select,.background-weather button{font:inherit;color:#111;background:#fff;border:1px solid #999;border-radius:.25rem;min-height:2.5rem;padding:.4rem .6rem}.background-weather select{width:100%;min-width:0}.background-weather button{cursor:pointer}.background-weather button:disabled{opacity:.5;cursor:default}.weather-status{color:#444}.weather-credit{color:#666;font-size:.7rem}.weather-credit a{color:inherit}.background-picker>.playback-actions>button{grid-column:1/-1}@media (width<=440px){.background-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
