/* Layout: 左に学年ピッカーと条件、右に時間グリッド。1学年なら時間割、複数なら「全員空き」を光らせる */
:root{
  --bg:#f5f6f7; --surface:#ffffff; --fg:#1c2228; --muted:#65707b; --line:#e0e4e8; --line-strong:#c6ccd2;
  --accent:#1f5f8b; --accent-soft:#e2edf5; --today:#c2402f; --band:#f0f3f5;
  --glow:#12a37a; --glow-soft:#d9f5ea; --glow-ring:rgba(18,163,122,.45); --check:#b7791f; --check-soft:#fbf0dc;
  --near:#eef1f4; --busy:#e6e9ed; --busy-fg:#5b6570;
  --ev-s:60%; --ev-l:90%; --ev-edge-l:38%; --ev-fg:#1c2228;
  --hatch:#d6dade; --shadow:0 10px 30px rgba(20,30,40,.18);
  --d-KH:hsl(24 70% 46%); --d-CF:hsl(142 45% 36%); --d-KN:hsl(212 60% 46%); --star:#d99a00;
  --font-body:"BIZ UDPGothic","Hiragino Sans","Yu Gothic UI","Meiryo",sans-serif;
  --font-num:"BIZ UDGothic","Hiragino Sans","Yu Gothic UI","Meiryo",monospace;
  --hour:58px;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#13171b; --surface:#1a1f25; --fg:#e6eaee; --muted:#9aa4ae; --line:#2a3138; --line-strong:#3a434c;
  --accent:#7fb6dd; --accent-soft:#1f3242; --today:#ff7a66; --band:#171c21;
  --glow:#3ddc9f; --glow-soft:#123a2e; --glow-ring:rgba(61,220,159,.5); --check:#f0b55c; --check-soft:#3a2d17;
  --near:#20262c; --busy:#22282e; --busy-fg:#9aa4ae;
  --ev-s:36%; --ev-l:26%; --ev-edge-l:62%; --ev-fg:#eef2f5; --hatch:#2c333a; --shadow:0 10px 30px rgba(0,0,0,.5);
  --d-KH:hsl(24 75% 62%); --d-CF:hsl(142 45% 58%); --d-KN:hsl(212 70% 68%); --star:#ffc53d; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#13171b; --surface:#1a1f25; --fg:#e6eaee; --muted:#9aa4ae; --line:#2a3138; --line-strong:#3a434c;
  --accent:#7fb6dd; --accent-soft:#1f3242; --today:#ff7a66; --band:#171c21;
  --glow:#3ddc9f; --glow-soft:#123a2e; --glow-ring:rgba(61,220,159,.5); --check:#f0b55c; --check-soft:#3a2d17;
  --near:#20262c; --busy:#22282e; --busy-fg:#9aa4ae;
  --ev-s:36%; --ev-l:26%; --ev-edge-l:62%; --ev-fg:#eef2f5; --hatch:#2c333a; --shadow:0 10px 30px rgba(0,0,0,.5);
  --d-KH:hsl(24 75% 62%); --d-CF:hsl(142 45% 58%); --d-KN:hsl(212 70% 68%); --star:#ffc53d; color-scheme:dark}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:14px;padding-inline:16px;padding-block:12px 24px}
button{font:inherit;color:inherit}
.app{display:grid;grid-template-columns:260px minmax(0,1fr);gap:16px;max-width:1440px;margin:0 auto}
header.top{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.brand{display:flex;flex-direction:column;gap:2px;margin-right:auto;min-width:0}
.brand h1{font-size:18px;margin:0;font-weight:700;letter-spacing:.02em;text-wrap:balance}
.brand small{color:var(--muted);font-size:12px}
.nav{display:flex;align-items:center;gap:6px}
.btn{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:6px 12px;cursor:pointer;line-height:1.2}
.btn:hover{background:var(--accent-soft)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.icon{width:34px;height:34px;padding:0;display:grid;place-items:center;border-radius:50%}
.range{font-size:17px;font-weight:700;min-width:0}
.range .wk{font-size:12px;font-weight:400;color:var(--muted);margin-left:8px;font-family:var(--font-num)}
.seg{display:inline-flex;border:1px solid var(--line-strong);border-radius:8px;overflow:hidden;background:var(--surface)}
.seg button{border:0;background:none;padding:6px 11px;cursor:pointer}
.seg button+button{border-left:1px solid var(--line)}
.seg button[aria-pressed="true"]{background:var(--accent);color:var(--surface)}
aside{display:flex;flex-direction:column;gap:18px;min-width:0}
.panel h2{font-size:12px;letter-spacing:.08em;color:var(--muted);margin:0 0 8px;font-weight:700}
/* cohort picker */
.picker{display:grid;grid-template-columns:44px repeat(4,minmax(0,1fr));gap:4px;align-items:center}
.picker .dl{font-size:12px;font-weight:700;color:var(--dc)}
.picker .yh{font-size:11px;color:var(--muted);text-align:center}
.co{border:1.5px solid var(--line-strong);background:var(--surface);border-radius:7px;padding:5px 0;cursor:pointer;font-family:var(--font-num);font-size:13px}
.co[aria-pressed="true"]{background:var(--dc);border-color:var(--dc);color:var(--surface);font-weight:700}
.co:hover{border-color:var(--dc)}
.presets{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.presets button{font-size:12px;padding:4px 8px;border-radius:6px}
.mode-note{font-size:12px;color:var(--muted);margin-top:8px;line-height:1.5}
.opts{display:flex;flex-direction:column;gap:8px;font-size:13px}
.opts label{display:flex;gap:8px;align-items:flex-start;line-height:1.4;cursor:pointer}
.opts input{margin-top:3px;accent-color:var(--accent)}
.opts small{color:var(--muted);display:block;font-size:11.5px}
.mini{width:100%;border-collapse:collapse;font-family:var(--font-num);font-size:12px}
.mini th{color:var(--muted);font-weight:400;padding:2px 0}
.mini td{text-align:center;padding:1px}
.mini td button{width:28px;height:28px;border:0;background:none;border-radius:50%;cursor:pointer;font-size:12px;position:relative}
.mini td button:hover{background:var(--accent-soft)}
.mini td button.out{color:var(--muted);opacity:.5}
.mini td button.has::after{content:"";position:absolute;left:50%;bottom:3px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--muted)}
.mini td button.freeday::after{background:var(--glow);width:6px;height:6px;margin-left:-3px;bottom:2px}
.mini td button.inweek{background:var(--accent-soft)}
.mini td button.today{background:var(--today);color:#fff}
.mini-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;font-weight:700}
.mini-head .btn{padding:2px 8px}
.legend{display:grid;gap:6px;font-size:12px;color:var(--muted)}
.legend span{display:flex;align-items:center;gap:8px}
.legend i{width:22px;height:12px;border-radius:3px;flex:none;display:inline-block}
.cnote{font-size:12px;line-height:1.55;background:var(--check-soft);border-radius:8px;padding:8px 10px;color:var(--fg)}

main{background:var(--surface);border:1px solid var(--line);border-radius:12px;min-width:0;overflow:hidden}
.summary{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);font-size:13px}
.summary b{font-family:var(--font-num)}
.summary .chip{display:inline-flex;align-items:center;gap:6px}
.sw{width:14px;height:14px;border-radius:4px;display:inline-block;flex:none}
.sw.free{background:var(--glow-soft);box-shadow:inset 0 0 0 2px var(--glow),0 0 6px var(--glow-ring)}
.sw.check{background:var(--check-soft);box-shadow:inset 0 0 0 2px var(--check)}
.sw.near{background:var(--near);box-shadow:inset 0 0 0 1px var(--line-strong)}
.sw.busy{background:var(--busy)}
.sw.closed{background:repeating-linear-gradient(45deg,var(--hatch) 0 3px,transparent 3px 6px);box-shadow:inset 0 0 0 1px var(--line-strong)}
/* week / day grid */
.wv{display:grid;grid-template-columns:56px repeat(var(--cols),minmax(0,1fr))}
.wv .corner{border-bottom:1px solid var(--line)}
.dh{border-bottom:1px solid var(--line);border-left:1px solid var(--line);padding:8px 4px 6px;text-align:center;cursor:pointer;background:none;border-top:0;border-right:0}
.dh:hover{background:var(--band)}
.dh .dow{font-size:11px;color:var(--muted);display:block}
.dh .dnum{font-family:var(--font-num);font-size:20px;display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;margin-top:2px}
.dh.today .dnum{background:var(--today);color:#fff}
.dh.sat .dow{color:#3b72b8}.dh.sun .dow,.dh.hol .dow{color:#c2402f}
.ad-gut{font-size:10px;color:var(--muted);text-align:right;padding:4px 6px 4px 0;border-bottom:1px solid var(--line-strong)}
.ad{border-left:1px solid var(--line);border-bottom:1px solid var(--line-strong);padding:3px;display:flex;flex-direction:column;gap:2px;min-width:0}
.gut{position:relative;height:calc(var(--hour)*9.5)}
.gut .p{position:absolute;right:6px;left:0;text-align:right;font-family:var(--font-num);color:var(--muted);font-size:10px;line-height:1.15}
.gut .p b{display:block;font-size:13px;color:var(--fg);font-family:var(--font-body)}
.col{position:relative;border-left:1px solid var(--line);height:calc(var(--hour)*9.5);min-width:0}
.col .band{position:absolute;left:0;right:0;background:var(--band)}
.col .hr{position:absolute;left:0;right:0;border-top:1px dashed var(--line)}
.col.today{background:var(--accent-soft)}
.nowline{position:absolute;left:0;right:0;border-top:2px solid var(--today);z-index:5}
.nowline::before{content:"";position:absolute;left:-5px;top:-6px;width:10px;height:10px;border-radius:50%;background:var(--today)}
.ev{position:absolute;border-radius:6px;padding:3px 5px;overflow:hidden;cursor:pointer;border:0;text-align:left;
  background:hsl(var(--h) var(--ev-s) var(--ev-l));color:var(--ev-fg);box-shadow:inset 3px 0 0 hsl(var(--h) 55% var(--ev-edge-l));
  font-size:12px;line-height:1.25;display:flex;flex-direction:column;gap:1px;z-index:2}
.ev:hover{filter:brightness(.97);z-index:4}
.ev .t{font-weight:700;overflow-wrap:anywhere}
.ev .m{font-size:11px;opacity:.8;font-family:var(--font-num);overflow-wrap:anywhere}
.ev.k-x{box-shadow:inset 0 0 0 2px var(--fg)}
.ev.k-H,.ev.k-C{background:repeating-linear-gradient(45deg,var(--hatch) 0 6px,transparent 6px 12px);box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--muted)}
.ev.k-C{background:repeating-linear-gradient(45deg,hsl(52 80% 70% / .55) 0 6px,transparent 6px 12px)}
.ev.k-O{box-shadow:inset 0 0 0 1px hsl(var(--h) 55% var(--ev-edge-l))}
.tag{display:inline-block;font-size:10px;font-weight:700;border-radius:3px;padding:0 4px;margin-right:3px;vertical-align:1px;line-height:1.5}
.tag.x{background:var(--fg);color:var(--surface)}
.tag.r{background:#c2402f;color:#fff}
/* finder tiles */
.tile{position:absolute;left:3px;right:3px;border-radius:8px;border:0;cursor:pointer;text-align:left;padding:4px 6px;display:flex;flex-direction:column;gap:2px;overflow:hidden;font-size:12px;line-height:1.25;z-index:2}
.tile .tt{font-weight:700}
.tile .ts{font-size:11px;opacity:.85;overflow-wrap:anywhere}
.tile.free{background:var(--glow-soft);box-shadow:inset 0 0 0 2px var(--glow),0 0 12px var(--glow-ring);color:var(--fg)}
.tile.free .tt{color:var(--glow)}
.tile.check{background:var(--check-soft);box-shadow:inset 0 0 0 2px var(--check);border:0;color:var(--fg)}
.tile.check .tt{color:var(--check)}
.tile.near{background:var(--near);box-shadow:inset 0 0 0 1px var(--line-strong);color:var(--fg)}
.tile.busy{background:transparent;color:var(--busy-fg);box-shadow:inset 0 0 0 1px var(--line)}
.tile.busy .tt{font-weight:400}
.tile.closed{background:repeating-linear-gradient(45deg,var(--hatch) 0 6px,transparent 6px 12px);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line-strong)}
.tile:hover{filter:brightness(.97)}
.dots{display:flex;flex-wrap:wrap;gap:2px;margin-top:auto}
.dots i{width:8px;height:8px;border-radius:2px;background:var(--line-strong)}
.dots i.b{background:var(--dc)}
.dots i.m{background:transparent;box-shadow:inset 0 0 0 1.5px var(--check)}
.dots i.o{background:transparent;box-shadow:inset 0 0 0 1px var(--line-strong)}
@media (prefers-reduced-motion:no-preference){
  .tile.free{animation:breathe 3.2s ease-in-out infinite}
  @keyframes breathe{0%,100%{box-shadow:inset 0 0 0 2px var(--glow),0 0 6px var(--glow-ring)}50%{box-shadow:inset 0 0 0 2px var(--glow),0 0 16px var(--glow-ring)}}
}
/* day matrix */
.mx-wrap{overflow-x:auto}
.mx{border-collapse:separate;border-spacing:0;width:100%;min-width:640px;font-size:12px}
.mx th,.mx td{border-bottom:1px solid var(--line);border-left:1px solid var(--line);padding:6px;vertical-align:top}
.mx thead th{position:sticky;top:0;background:var(--surface);font-weight:700;text-align:center;z-index:1}
.mx thead th .dbar{display:block;height:3px;border-radius:2px;background:var(--dc);margin-top:4px}
.mx th.ph{width:64px;text-align:left;font-family:var(--font-num);color:var(--muted);font-weight:400}
.mx th.ph b{display:block;color:var(--fg);font-family:var(--font-body);font-size:13px}
.mx td.st{min-width:84px}
.mx td.rowfree{background:var(--glow-soft)}
.mx td.rowcheck{background:var(--check-soft)}
.cell-it{display:block;border:0;background:hsl(var(--h) var(--ev-s) var(--ev-l));box-shadow:inset 3px 0 0 hsl(var(--h) 55% var(--ev-edge-l));color:var(--ev-fg);border-radius:5px;padding:3px 5px;margin-bottom:3px;text-align:left;width:100%;cursor:pointer;overflow-wrap:anywhere}
.cell-it.k-H,.cell-it.k-C{background:repeating-linear-gradient(45deg,var(--hatch) 0 5px,transparent 5px 10px);box-shadow:none;color:var(--muted)}
.cell-it.k-x{box-shadow:inset 0 0 0 2px var(--fg)}
.cell-free{color:var(--glow);font-weight:700}
.cell-maybe{color:var(--check);font-weight:700}
.cell-off{color:var(--muted)}
.mx .rowhead{display:flex;flex-direction:column;gap:3px}
.pill{display:inline-block;font-size:11px;font-weight:700;border-radius:999px;padding:1px 8px}
.pill.free{background:var(--glow);color:var(--surface)}
.pill.check{background:var(--check);color:var(--surface)}
/* month view */
.mv{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
.mv .mh{font-size:11px;color:var(--muted);text-align:center;padding:6px 0;border-bottom:1px solid var(--line)}
.mc{border-left:1px solid var(--line);border-bottom:1px solid var(--line);min-height:124px;padding:4px;display:flex;flex-direction:column;gap:2px;min-width:0}
.mc:nth-child(7n+1){border-left:0}
.mc.out{background:var(--band)}
.mc.out .mnum{opacity:.45}
.mnum{border:0;background:none;font-family:var(--font-num);font-size:12px;width:24px;height:24px;border-radius:50%;cursor:pointer;align-self:center;display:grid;place-items:center}
.mnum:hover{background:var(--accent-soft)}
.mc.today .mnum{background:var(--today);color:#fff}
.mi{border:0;background:none;text-align:left;padding:1px 4px;border-radius:4px;font-size:11.5px;cursor:pointer;display:flex;gap:4px;align-items:baseline;white-space:nowrap;overflow:hidden;min-width:0}
.mi:hover{background:var(--band)}
.mi .dot{width:8px;height:8px;border-radius:2px;background:hsl(var(--h) 55% var(--ev-edge-l));flex:none;align-self:center}
.mi .pn{font-family:var(--font-num);color:var(--muted);flex:none}
.mi span.nm{overflow:hidden;text-overflow:ellipsis}
.mi.k-x .nm{font-weight:700;text-decoration:underline}
.alld{border-radius:5px;padding:2px 6px;font-size:12px;cursor:pointer;border:0;text-align:left;background:repeating-linear-gradient(45deg,var(--hatch) 0 6px,transparent 6px 12px);box-shadow:inset 3px 0 0 var(--line-strong);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;color:var(--muted)}
.strip{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;margin-top:4px}
.strip button{height:26px;border-radius:5px;border:0;cursor:pointer;font-family:var(--font-num);font-size:11px;color:var(--muted);padding:0}
.strip .free{background:var(--glow-soft);box-shadow:inset 0 0 0 2px var(--glow),0 0 6px var(--glow-ring);color:var(--glow);font-weight:700}
.strip .check{background:var(--check-soft);box-shadow:inset 0 0 0 1.5px var(--check);color:var(--check)}
.strip .near{background:var(--near);box-shadow:inset 0 0 0 1px var(--line-strong)}
.strip .busy{background:var(--busy)}
.strip .closed{background:repeating-linear-gradient(45deg,var(--hatch) 0 3px,transparent 3px 6px)}
.strip .off{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
.mlabel{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* list */
.ag{padding:6px 0}
.ag-day{display:grid;grid-template-columns:84px minmax(0,1fr);gap:10px;padding:10px 16px;border-bottom:1px solid var(--line)}
.ag-day.today .ag-d b{background:var(--today);color:#fff}
.ag-d{display:flex;flex-direction:column;align-items:flex-start;gap:2px}
.ag-d b{font-family:var(--font-num);font-size:20px;display:inline-grid;place-items:center;min-width:36px;height:36px;border-radius:50%;padding:0 4px}
.ag-d span{font-size:11px;color:var(--muted)}
.ag-list{display:flex;flex-direction:column;gap:4px;min-width:0}
.ag-it{display:grid;grid-template-columns:110px 12px minmax(0,1fr);gap:8px;align-items:baseline;border:0;background:none;text-align:left;padding:4px 6px;border-radius:6px;cursor:pointer}
.ag-it:hover{background:var(--band)}
.ag-it .tm{font-family:var(--font-num);font-size:12px;color:var(--muted)}
.ag-it .dot{width:10px;height:10px;border-radius:50%;background:hsl(var(--h) 55% var(--ev-edge-l));align-self:center}
.ag-it .dot.free{background:var(--glow);box-shadow:0 0 6px var(--glow-ring)}
.ag-it .dot.check{background:var(--check)}
.ag-it .ds{min-width:0}
.ag-it .ds small{display:block;color:var(--muted);font-size:12px}
.empty{padding:40px 16px;color:var(--muted);text-align:center;line-height:1.7}
/* weekday x period summary */
.gs{padding:16px;display:flex;flex-direction:column;gap:14px}
.gs p{margin:0;color:var(--muted);font-size:13px;line-height:1.6;max-width:70ch}
.gtab-wrap{overflow-x:auto}
.gtab{border-collapse:separate;border-spacing:6px;width:100%;min-width:560px}
.gtab th{font-weight:700;font-size:13px;color:var(--muted)}
.gtab th.ph{text-align:right;font-family:var(--font-num);font-weight:400;font-size:11px;width:70px}
.gtab th.ph b{display:block;font-family:var(--font-body);font-size:14px;color:var(--fg)}
.gbtn{width:100%;min-height:74px;border:0;border-radius:10px;cursor:pointer;padding:8px;text-align:left;display:flex;flex-direction:column;gap:4px;background:var(--busy);color:var(--fg)}
.gbtn .n{font-family:var(--font-num);font-size:20px;font-weight:700}
.gbtn .n small{font-size:12px;font-weight:400;color:var(--muted)}
.gbtn .bar{height:5px;border-radius:3px;background:var(--line);overflow:hidden;display:flex}
.gbtn .bar i{display:block;height:100%}
.gbtn .bar i.f{background:var(--glow)}
.gbtn .bar i.c{background:var(--check)}
.gbtn .s{font-size:11px;color:var(--muted)}
.gbtn.hot{background:var(--glow-soft);box-shadow:inset 0 0 0 2px var(--glow),0 0 12px var(--glow-ring)}
.gbtn.warm{background:var(--glow-soft)}
.gbtn[aria-pressed="true"]{outline:2px solid var(--accent);outline-offset:2px}
.gdetail{border-top:1px solid var(--line);padding-top:12px}
.gdetail h3{margin:0 0 8px;font-size:15px}
.gl{display:flex;flex-wrap:wrap;gap:6px}
.gl button{border:0;border-radius:6px;padding:4px 8px;cursor:pointer;font-family:var(--font-num);font-size:12px}
.gl button.free{background:var(--glow-soft);box-shadow:inset 0 0 0 1.5px var(--glow)}
.gl button.check{background:var(--check-soft);box-shadow:inset 0 0 0 1.5px var(--check)}
.gl button.near{background:var(--near);box-shadow:inset 0 0 0 1px var(--line-strong)}
.gl button.busy{background:var(--busy);color:var(--busy-fg)}
.gl button.closed{background:repeating-linear-gradient(45deg,var(--hatch) 0 3px,transparent 3px 6px);color:var(--muted)}
.blockers{margin-top:10px;font-size:12.5px;color:var(--muted);line-height:1.6}
/* sheet */
.scrim{position:fixed;inset:0;background:rgba(10,15,20,.35);z-index:20;display:grid;place-items:center;padding:16px}
.sheet{background:var(--surface);color:var(--fg);border-radius:14px;box-shadow:var(--shadow);width:min(520px,100%);padding:18px 20px 20px;display:flex;flex-direction:column;gap:12px;max-height:88vh;overflow:auto}
.sheet header{display:flex;gap:12px;align-items:flex-start}
.sheet .sq{width:16px;height:16px;border-radius:4px;margin-top:5px;flex:none;background:hsl(var(--h) 55% var(--ev-edge-l))}
.sheet h3{margin:0;font-size:18px;line-height:1.35;flex:1;text-wrap:balance}
.sheet .close{border:0;background:none;font-size:22px;line-height:1;cursor:pointer;color:var(--muted);padding:2px 6px;border-radius:6px}
.sheet dl{display:grid;grid-template-columns:56px minmax(0,1fr);gap:8px 10px;margin:0;font-size:14px}
.sheet dt{color:var(--muted);font-size:12px;padding-top:2px}
.sheet dd{margin:0;overflow-wrap:anywhere}
.sheet .num{font-family:var(--font-num)}
.note{font-size:13px;background:var(--band);border-radius:8px;padding:8px 10px;line-height:1.55}
.crow{display:grid;grid-template-columns:76px 74px minmax(0,1fr);gap:8px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px}
.crow .cn{font-weight:700;color:var(--dc)}
.crow .cs{font-size:12px}
.crow .cs.free{color:var(--glow);font-weight:700}
.crow .cs.maybe{color:var(--check);font-weight:700}
.crow .cs.busy{color:var(--fg)}
.crow .cs.off,.crow .cs.closed{color:var(--muted)}
.crow .cl{min-width:0;overflow-wrap:anywhere}
.crow .cl small{display:block;color:var(--muted);font-size:11.5px}
.foot{grid-column:1/-1;color:var(--muted);font-size:12px;line-height:1.7}
@media (max-width:960px){
  .app{grid-template-columns:minmax(0,1fr)}
  aside{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
  aside .mini-panel,aside .legend-panel{display:none}
}
@media (max-width:600px){
  body{padding-inline:10px}
  .wv{grid-template-columns:36px repeat(var(--cols),minmax(0,1fr))}
  .gut .p{font-size:9px;right:3px}
  .gut .p b{font-size:12px}
  .gut .p .tt{display:none}
  .ev{padding:2px 3px;font-size:11px}
  .ev .m{display:none}
  .tile{padding:3px;font-size:10.5px}
  .tile .ts{display:none}
  .dh .dnum{font-size:16px;width:30px;height:30px}
  .mc{min-height:84px;padding:2px}
  .mi{padding:1px 2px;font-size:10px}
  .mi .pn{display:none}
  .strip button{height:20px;font-size:9px}
  .mlabel{display:none}
  .ag-day{grid-template-columns:56px minmax(0,1fr);padding:10px}
  .ag-it{grid-template-columns:76px 10px minmax(0,1fr)}
  .range{font-size:15px;width:100%;order:5}
  .range .wk{display:block;margin:2px 0 0}
  .crow{grid-template-columns:62px 64px minmax(0,1fr)}
  .mode-note,.opts small{display:none}
  aside{gap:10px}
}
@media (prefers-reduced-motion:no-preference){.ev,.btn,.co,.tile{transition:background-color .12s,filter .12s}}

/* ---- app shell additions ---- */
.topbar{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;justify-content:space-between;padding-bottom:2px}
.termsel{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.termsel select{font:inherit;color:var(--fg);background:var(--surface);border:1px solid var(--line-strong);border-radius:8px;padding:5px 8px}
.who{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);min-width:0}
.who img{width:24px;height:24px;border-radius:50%}
.who .nm{max-width:16em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.linkbtn{border:0;background:none;color:var(--accent);cursor:pointer;padding:2px 4px;text-decoration:underline;font-size:12.5px}
.gate{min-height:70vh;display:grid;place-items:center;padding:24px 0}
.gate-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:28px 28px 24px;max-width:420px;width:100%;display:flex;flex-direction:column;gap:14px;text-align:center}
.gate-card h1{margin:0;font-size:20px}
.gate-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}
.gate-card .gbtn-wrap{display:flex;justify-content:center;min-height:44px}
.gate-card .err{color:#c2402f;font-size:13px}
.starbtn{border:1px solid var(--line-strong);background:var(--surface);border-radius:8px;padding:6px 12px;cursor:pointer;display:inline-flex;gap:6px;align-items:center}
.starbtn[aria-pressed="true"]{border-color:var(--star);color:var(--star);font-weight:700}
.starmark{position:absolute;right:4px;top:3px;color:var(--star);font-size:13px;line-height:1;z-index:3;pointer-events:none}
.strip button{position:relative}
.strip button .st{position:absolute;right:1px;top:-2px;font-size:10px;color:var(--star)}
.ag-it .star{color:var(--star)}
/* admin */
.adm{padding:16px;display:flex;flex-direction:column;gap:14px}
.adm-tabs{display:flex;gap:6px;flex-wrap:wrap}
.adm table{border-collapse:collapse;width:100%;font-size:12.5px}
.adm-wrap{overflow-x:auto}
.adm th,.adm td{border-bottom:1px solid var(--line);padding:7px 8px;text-align:left;vertical-align:middle;white-space:nowrap}
.adm th{color:var(--muted);font-weight:700;font-size:12px}
.adm td.num{font-family:var(--font-num);text-align:right}
.adm .tg{border:1px solid var(--line-strong);background:var(--surface);border-radius:999px;padding:3px 10px;cursor:pointer;font-size:12px}
.adm .tg.on{background:var(--glow-soft);border-color:var(--glow);color:var(--fg)}
.adm .tg.off{background:#fde8e5;border-color:#c2402f;color:#8b2a1e}
.adm .muted{color:var(--muted)}
.adm h3{margin:0;font-size:15px}
.adm p{margin:0;color:var(--muted);font-size:13px;line-height:1.6;max-width:70ch}
.hist{font-size:12.5px;color:var(--muted);line-height:1.7;margin:4px 0 0;padding-left:1.2em}

#app.admin{grid-template-columns:minmax(0,1fr)}
.adm-tabs.seg{align-self:flex-start;flex-wrap:nowrap}

/* ---- 2026-10-23 レビュー対応：注意の印・昼休み・順位一覧・書き出し・スマホの折りたたみ・管理の案内 ---- */
.caut{display:inline-block;font-size:10px;font-weight:700;line-height:1;padding:2px 4px;border-radius:4px;background:var(--check-soft);color:var(--check);margin-left:4px;vertical-align:middle;font-family:var(--font-body)}
.col .band.lunch{background:repeating-linear-gradient(135deg,var(--glow-soft) 0 4px,transparent 4px 8px);color:var(--glow);font-size:10px;text-align:center;line-height:1.1;padding-top:2px;overflow:hidden}
.gut .p.lp b{color:var(--glow);font-size:11px}
.muted{color:var(--muted)}
.gs p.muted{font-size:12.5px}
.rank{display:flex;flex-direction:column;gap:6px;margin:4px 0 14px}
.rank h3{margin:0 0 2px;font-size:13px;color:var(--muted);letter-spacing:.04em}
.rk{display:grid;grid-template-columns:28px minmax(0,1fr);gap:2px 8px;align-items:baseline;text-align:left;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:var(--surface);cursor:pointer;font:inherit;color:inherit}
.rk:hover{border-color:var(--accent)}
.rk[aria-pressed="true"]{outline:2px solid var(--accent);outline-offset:1px}
.rk b{grid-row:1/4;font-family:var(--font-num);font-size:18px;color:var(--accent)}
.rk .rk-t{font-weight:700;font-size:14px}
.rk .rk-t small{font-weight:400;color:var(--muted);font-family:var(--font-num);margin-left:4px}
.rk .rk-n{font-size:12.5px;color:var(--glow);font-weight:700}
.rk .rk-b{font-size:12px;color:var(--muted);line-height:1.5;overflow-wrap:anywhere}
.exp{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:12px 16px 0;font-size:12.5px}
.pick-toggle{display:flex;align-items:center;gap:8px;width:100%;border:0;background:none;padding:0;font:inherit;color:inherit;font-weight:700;letter-spacing:.08em;cursor:default;text-align:left}
.pick-toggle .pick-sum,.pick-toggle .chev{display:none}
#pickBody.closed{display:none}
.pre{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12.5px;padding:10px 12px;border:1px dashed var(--line-strong);border-radius:10px}
.pre label{color:var(--muted);flex-basis:100%}
.pre input{font:inherit;padding:6px 8px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--fg);min-width:0;flex:1 1 240px}
.adm-msg{margin:0;padding:8px 12px;border-radius:8px;background:var(--accent-soft);font-size:13px}
.gate-card .gate-help{font-size:12px}
.empty .btn{margin-top:10px}
@media (max-width:600px){
  .pick-toggle{cursor:pointer}
  .pick-toggle .pick-sum{display:inline;font-weight:400;letter-spacing:0;color:var(--accent);margin-left:auto;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pick-toggle .chev{display:inline-block;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin:0 4px 3px}
  .pick-toggle[aria-expanded="true"] .chev{transform:rotate(-135deg);margin-bottom:-2px}
  .mcnt{border:0;border-radius:6px;padding:2px 1px;font-size:10px;line-height:1.15;font-weight:700;cursor:pointer;background:var(--busy);color:var(--busy-fg);margin-top:2px;white-space:normal;overflow:hidden;font-family:var(--font-body)}
  .mcnt.free{background:var(--glow-soft);color:var(--glow);box-shadow:inset 0 0 0 1.5px var(--glow)}
  .mcnt.check{background:var(--check-soft);color:var(--check)}
  .mcnt.near{background:var(--near);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line-strong)}
  .rk{grid-template-columns:22px minmax(0,1fr)}
  .exp{padding:10px 10px 0}
  .col .band.lunch{font-size:0}
}