/* ============================================================
   led.css — 電光掲示板専用
   スコープ: 掲示板本体・枠・好きな文字入力中（.led-* / body.led-editing）
   ============================================================ */
/* 電光掲示板（v213：高さ半分に合わせて枠の余白も半分にし、ネジはなくした） */
.led-frame{position:relative;box-sizing:border-box;margin:0 0 6px;padding:5px;border-radius:10px;background:linear-gradient(145deg,#9aa0a9 0%,#4d525a 26%,#2b2e34 50%,#5b606a 76%,#3b3f46 100%);box-shadow:0 2px 7px rgba(0,0,0,.5),inset 0 1px 1px rgba(255,255,255,.4),inset 0 -1px 2px rgba(0,0,0,.65)}
.led-panel{background:#03040a;border-radius:5px;box-shadow:inset 0 2px 9px #000,inset 0 0 0 1px rgba(255,255,255,.07);overflow:hidden;line-height:0}
.led-panel canvas{display:block;width:100%}
.led-textarea{display:block;width:100%;height:48px;min-height:0;margin-top:4px;padding:12px;border-radius:8px;font-size:1.1rem;line-height:1.35;resize:none;overflow:hidden}
.led-text-sub{display:none;align-items:center;justify-content:space-between;margin-top:8px;color:var(--sub)}
.led-text-btns{display:flex;gap:8px}
.led-sbtn{padding:10px 18px;border:1px solid var(--input-border);border-radius:12px;background:var(--card-bg);color:var(--btn-text);font-size:1rem;font-weight:bold;font-family:inherit;cursor:pointer}
.led-sbtn.main{background:var(--primary);border-color:var(--primary);color:var(--on-primary)}
/* 入力中だけ枠を広げ（3行）、下のタブを隠す */
body.led-editing .led-textarea{height:108px;overflow:auto}
body.led-editing .led-text-sub{display:flex}
body.led-editing .tab-bar{display:none!important}
body.led-editing .container{padding-bottom:calc(12px + env(safe-area-inset-bottom))}
/* 掲示板をタップすると、真ん中にオン/オフのボタンが出る。
   v213：半分になった板（パネル約58px＋枠の余白5px×2）でも、46pxのボタンはそのまま収まる（計算で確認。実機は 5-65 で確認） */
.led-frame{cursor:pointer}
.led-pop{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;min-width:140px;height:46px;padding:0 22px;border:1px solid rgba(255,255,255,.3);border-radius:23px;background:rgba(10,12,20,.85);color:var(--led-c,#ffb62e);font-size:1.05rem;font-weight:bold;font-family:inherit;white-space:nowrap;box-shadow:0 2px 12px rgba(0,0,0,.6);-webkit-appearance:none;appearance:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);cursor:pointer}
.led-pop.is-visible{display:block}
.led-pop:active{opacity:.75}
/* 入力中：設定の「電光掲示板」カードを画面の上に固定し、後ろを暗くする（色・文字のしかたの行は隠して小さくする） */
.led-edit-bg{position:fixed;left:0;right:0;top:0;bottom:0;z-index:205;background:rgba(0,0,0,.6)}
.led-card-pinned{position:fixed!important;left:12px;right:12px;top:calc(var(--led-top,0px) + env(safe-area-inset-top,0px) + 8px);margin:0 auto!important;max-width:616px;z-index:210;box-shadow:0 8px 30px rgba(0,0,0,.55)}
.led-card-pinned #ledColorSeg,.led-card-pinned #ledColorLbl,.led-card-pinned .led-tgl,.led-card-pinned #ledStyleSeg,.led-card-pinned #ledStyleLbl,.led-card-pinned #ledTodaySeg,.led-card-pinned #ledTodayLbl{display:none}
/* ホワイトの枠（標準。#FFFEF2を明るい基調に、影は暖かいベージュ） */
.led-frame.white{background:linear-gradient(145deg,#fffef2 0%,#f3efdc 24%,#d9d3bc 50%,#fbf9ec 76%,#e6e1cc 100%);box-shadow:0 2px 7px rgba(0,0,0,.45),inset 0 1px 1px rgba(255,255,255,.95),inset 0 -1px 2px rgba(110,100,70,.55)}
/* 立体感（v141）：好きな文字の入力欄はへこみ、ボタンは浮く。トークンは theme.css（掲示板の枠・文字は変更なし） */
.led-textarea{box-shadow:var(--sunk)}
.led-textarea:focus{outline:none;border-color:var(--primary);box-shadow:var(--sunk),var(--ring)}
.led-sbtn{background-image:var(--face);box-shadow:var(--elev-1)}
.led-sbtn.main{background-image:var(--face-pri);box-shadow:var(--elev-pri)}
.led-sbtn:active{box-shadow:var(--press)}
/* 掲示板の表示／非表示（v159）。v170：隠しても高さは残す（見えなくするだけ。非表示で記録入力の高さが変わると、下タブがゆれた）。v171：非表示のあいだは、js/led-settings.js（ledHiddenShow）が、この見えない掲示板を記録入力の一番下へ移す。動きは ledToggleShow */
.led-frame.led-gone{visibility:hidden;pointer-events:none}
/* 設定の「電光掲示板」の見出しの右のトグル（「∨／∧」ボタンの左）。カードを閉じても使える */
#ledColorLbl{margin-top:0}
.led-tgl{flex:none;display:flex;align-items:center;gap:8px;margin:0 0 0 auto;padding:0;border:0;background:transparent;color:var(--sub);font:inherit;font-size:.9rem;font-weight:bold;cursor:pointer}
.led-tgl .led-tgl-t{min-width:3.4em;text-align:right}
.led-tgl i{position:relative;display:block;flex:none;width:50px;height:30px;box-sizing:border-box;border:1px solid var(--input-border);border-radius:15px;background:var(--pill-bg);box-shadow:var(--sunk);transition:background .15s,border-color .15s}
.led-tgl i::after{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;border-radius:50%;background:var(--card-bg);box-shadow:var(--elev-1);transition:transform .15s}
.led-tgl[aria-checked=true] i{background:var(--primary);border-color:var(--primary)}
.led-tgl[aria-checked=true] i::after{transform:translateX(20px)}
.led-tgl+.set-fold{margin-left:10px}
/* 狭い画面では見出し行が収まらないので、トグルの「表示」の字を省いてスイッチだけにする（状態はスイッチの色とつまみの位置で分かる。v198：初代SE幅320px＋文字「大」では見出しが縦書きになっていた） */
@media (max-width:359px){
 .led-tgl .led-tgl-t{display:none}
}
@media (min-width:360px) and (max-width:389px){
 html[data-fs="l"] .led-tgl .led-tgl-t{display:none}
}
