/* ficklestudio26 · LED sign (builds on /timer/timer.css) */
.l-board { padding:14px; background:#0b0b0d; border:6px solid #2b2b30; border-radius:18px; box-shadow:inset 0 0 30px rgba(0,0,0,.8); }
.l-board canvas { display:block; width:100%; }
.l-controls { display:grid; gap:12px; margin-top:16px; text-align:left; }
.l-controls label { display:grid; gap:4px; font:700 12px system-ui,sans-serif; color:#5b5b66; text-transform:uppercase; letter-spacing:.05em; }
.l-controls input[type=text], .l-controls select { padding:12px; border:2px solid #e8e8ec; border-radius:12px; font:600 18px system-ui,sans-serif; background:#fff; width:100%; }
.l-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; align-items:end; }
.l-colors { display:flex; gap:10px; flex-wrap:wrap; }
.l-colors button { width:44px; height:44px; border-radius:50%; border:4px solid #fff; box-shadow:0 0 0 2px #dee2e6; cursor:pointer; } .l-colors button.is-on { box-shadow:0 0 0 4px #1d1d22; }
.l-chk { display:flex !important; gap:8px; align-items:center; text-transform:none !important; letter-spacing:0 !important; font:700 16px system-ui,sans-serif !important; color:#1d1d22 !important; }
.l-note { display:none; margin:12px 0 0; padding:10px 14px; background:#fff4e6; border-radius:12px; font-weight:700; text-align:left; }
.l-msg .l-controls, .l-msg .answer, .l-msg .seo { display:none; } .l-msg .l-note { display:block; }
#t-card:fullscreen .l-controls, #t-card.fs-pseudo .l-controls, #t-card:fullscreen .l-note, #t-card.fs-pseudo .l-note { display:none !important; }
#t-card:fullscreen .l-board, #t-card.fs-pseudo .l-board { background:#0b0b0d; border-color:#0b0b0d; }

.l-rotbtn { display:none; }
#t-card:fullscreen .l-rotbtn, #t-card.fs-pseudo .l-rotbtn { display:inline-flex; position:fixed; left:10px; top:calc(10px + env(safe-area-inset-top)); z-index:100000; padding:6px; min-height:0; border:1px solid transparent; background:transparent; color:#fff; opacity:.28; transition:opacity .2s; }
#t-card:fullscreen .l-rotbtn:hover, #t-card.fs-pseudo .l-rotbtn:hover, .l-rotbtn:focus-visible { opacity:1; background:#222; border-color:#555; }
.l-board.l-rot { position:fixed; left:50%; top:50%; transform:translate(-50%,-50%) rotate(90deg); z-index:2; }
.l-board { background:linear-gradient(180deg,#17171a,#0b0b0d); }
body[data-mode="led"] #t-card:fullscreen, body[data-mode="led"] #t-card.fs-pseudo { background:#000; }
body[data-mode="led"] #t-card:fullscreen .fsb, body[data-mode="led"] #t-card.fs-pseudo .fsb { background:#111; }
