/* ficklestudio26 · Screen colours (builds on /timer/timer.css) */
.sc-stage { position:relative; min-height:min(58vh,520px); border-radius:18px; border:3px solid #d0d0d6; cursor:pointer; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; transition:background .15s; }
.sc-stage:focus-visible { outline:4px solid #1d1d22; outline-offset:3px; }
#sc-label { margin:0 0 18px; padding:6px 16px; border-radius:99px; background:rgba(128,128,128,.25); font:700 clamp(16px,2.6vw,26px) system-ui,sans-serif; opacity:0; transition:opacity .4s; pointer-events:none; }
#sc-label.on { opacity:1; }
.sc-stage:fullscreen, .sc-stage.sc-pseudo { border:0; border-radius:0; min-height:0; width:100%; height:100%; }
.sc-stage.sc-pseudo { position:fixed; inset:0; z-index:99999; }
body.fs-lock { overflow:hidden; }
.sc-bar { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin:14px 0; }
.sc-sw { width:48px; height:48px; border-radius:50%; border:3px solid #9a9aa5; cursor:pointer; padding:0; }
.sc-sw.is-on { border-color:#e8590c; box-shadow:0 0 0 3px #fff, 0 0 0 6px #e8590c; }
.sc-warn { margin:12px 0; padding:12px 14px; background:#fff5f5; border-left:5px solid #e03131; border-radius:8px; font:600 15px/1.5 system-ui,sans-serif; color:#8a1c1c; text-align:left; }
.sc-hub { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; }
.sc-hub a { display:block; padding:14px 16px; background:#fff4e6; border-radius:12px; font:700 17px system-ui,sans-serif; text-decoration:none; color:#d9480f; }