*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",Roboto,sans-serif;
  background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
.wrap{max-width:440px;margin:0 auto;padding:20px 16px 64px;position:relative}
.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;position:relative}
.brandwrap{display:flex;align-items:center;min-width:0}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:inherit;cursor:pointer}
.brand:hover .bname{color:#0e7d8f}
/* ロゴの角丸マーク。**必ず `.brand` の中に閉じる。** 単語1つの class 名を素で置くと、
   他の部品の修飾子（`class='ogchip ai'` の `ai` など）に当たる。実際、出所の札が
   34×34の四角に潰され、文字がはみ出して隣の札と重なっていた（承認画面で発覚）。 */
.brand .ai{width:34px;height:34px;border-radius:11px;background:#0e7d8f;color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:800;font-size:13px}
.bname{font-weight:700;font-size:15.5px}
.av{width:34px;height:34px;border-radius:50%;background:#dbe3ea;color:#33506a;display:flex;
  align-items:center;justify-content:center;font-weight:700;cursor:pointer;border:2px solid var(--card);
  box-shadow:0 1px 4px rgba(0,0,0,.12)}
.appbar{background:var(--card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:45}
.bar-inner{padding:13px 22px;display:flex;align-items:center;
  justify-content:space-between;position:relative}
.crumb{color:#9aa3b2;font-weight:500;font-size:13px;margin-left:8px}
.menu{position:absolute;top:54px;right:18px;width:236px;background:var(--card);border:1px solid var(--border);
  border-radius:13px;box-shadow:0 14px 36px rgba(12,18,38,.16);overflow:hidden;display:none;z-index:9}
.menu.show{display:block}
.menu .acct{display:flex;flex-wrap:nowrap;align-items:center;gap:10px;padding:12px 14px}
.menu .dot{width:32px;height:32px;border-radius:50%;background:#7e57c2;color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:700;flex:0 0 32px}
.menu .nm{font-weight:700;font-size:13px}.menu .em{font-size:11.5px;color:#8a93a6}
.menu .sep{height:1px;background:var(--bg)}
/* Defensive resets: pages may declare GENERIC form/button rules for their own body content
   (e.g. operator console, members). The shared menu lives OUTSIDE .wrap, so harden it here
   rather than scoping every page (class selectors beat the leaking element selectors). */
.menu form{margin:0;padding:0;background:none;border:0;border-radius:0;display:block}
.menu .lo{display:block;width:100%;text-align:left;background:none;border:0;margin:0;border-radius:0;
  padding:12px 14px;font-size:13.5px;color:#c0392b;font-weight:700;cursor:pointer}
.nf-panel button{margin:0}   /* same leak (button{margin-top:14px}) into the bell panel */
.tb-right{display:flex;align-items:center;gap:14px}
/* ── お知らせ bell + panel (Claude Design: 通知・ベル 再設計) ── */
.bell{position:relative;width:40px;height:40px;border-radius:11px;border:none;background:none;cursor:pointer;margin:0;
  display:flex;align-items:center;justify-content:center;color:var(--gray-ink);transition:background .14s,color .14s}
.bell:hover{background:var(--gray-bg);color:var(--ink)}
.bell.active{background:var(--teal-soft);color:var(--teal)}
.bell-badge{position:absolute;top:4px;right:4px;min-width:17px;height:17px;padding:0 4px;border-radius:99px;
  background:var(--teal);border:2px solid var(--card);color:#fff;font-size:10.5px;font-weight:800;line-height:1;
  font-variant-numeric:tabular-nums;display:flex;align-items:center;justify-content:center}
.bell-badge.dot{min-width:0;width:10px;height:10px;padding:0;top:7px;right:8px}
.nf-wrap{position:relative}
.nf-veil{position:fixed;inset:0;z-index:40;background:rgba(20,32,45,.04)}
.nf-panel{position:absolute;top:46px;right:0;z-index:41;width:384px;max-width:calc(100vw - 24px);background:var(--card);
  border:1px solid var(--border);border-radius:16px;box-shadow:0 18px 48px rgba(22,40,47,.18),0 2px 6px rgba(22,40,47,.06);
  overflow:hidden;display:flex;flex-direction:column;max-height:min(560px,80vh)}
.nf-panel[hidden]{display:none}   /* `hidden` attr must beat the display:flex above (else it never closes) */
.nf-head{display:flex;align-items:center;gap:10px;padding:15px 16px 12px}
.nf-head .t{font-size:15.5px;font-weight:800;letter-spacing:.01em;white-space:nowrap}
.nf-head .grow{flex:1}
.nf-close{border:0;background:none;cursor:pointer;color:#8a93a6;font-size:17px;line-height:1;padding:3px 8px;border-radius:7px;font:inherit;flex-shrink:0}
.nf-close:hover{background:var(--teal-soft);color:var(--ink)}
.nf-mark{background:none;border:none;font:inherit;font-size:12.5px;font-weight:700;color:var(--teal);cursor:pointer;
  padding:6px 8px;border-radius:8px;white-space:nowrap}
.nf-mark:hover{background:var(--teal-soft)}
.nf-mark:disabled{color:#8fa0a8;cursor:default;background:none}
.nf-tabs{display:flex;gap:7px;padding:0 16px 12px;border-bottom:1px solid var(--border)}
.nf-tab{border:1px solid var(--border);background:var(--card);border-radius:99px;cursor:pointer;font:inherit;font-size:12.5px;
  font-weight:700;color:var(--muted);padding:6px 14px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.nf-tab:hover{border-color:#cdd8dd}
.nf-tab.on{background:var(--ink);border-color:var(--ink);color:#fff}
.nf-tab .pip{font-size:10.5px;font-weight:800;background:var(--teal);color:#fff;border-radius:99px;padding:0 6px;line-height:1.6}
.nf-tab.on .pip{background:rgba(255,255,255,.24)}
.nf-list{flex:1;overflow-y:auto}
.nf-group{font-size:11px;font-weight:800;letter-spacing:.05em;color:#8fa0a8;padding:13px 16px 6px;position:sticky;top:0;
  background:linear-gradient(#fff 72%,rgba(255,255,255,0));z-index:1}
.nf-item{display:grid;grid-template-columns:38px 1fr;gap:12px;width:100%;text-align:left;padding:12px 16px 12px 13px;
  border:none;background:none;cursor:pointer;font:inherit;border-left:3px solid transparent;color:inherit;
  text-decoration:none;transition:background .12s}
.nf-item:hover{background:#f7fafb}
.nf-item.unread{background:color-mix(in srgb,var(--teal) 5%,#fff);border-left-color:var(--teal)}
.nf-item.unread:hover{background:color-mix(in srgb,var(--teal) 8%,#fff)}
.nf-item+.nf-item{border-top:1px solid #eef2f4}
.nf-show-unread .nf-item:not(.unread),.nf-show-unread .nf-group{display:none}
.nf-ic{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.nf-ic.draft,.nf-ic.revised{background:var(--teal-soft);color:var(--teal)}
.nf-ic.merge{background:var(--amber-bg);color:var(--amber-ink)}
.nf-ic.published{background:var(--green-bg);color:var(--green)}
.nf-ic.ingest,.nf-ic.report,.nf-ic.info{background:#eef2f4;color:#5e7884}
.nf-body{min-width:0}
.nf-top{display:flex;align-items:baseline;gap:8px}
.nf-title{font-size:13.5px;font-weight:700;line-height:1.5;color:var(--ink);flex:1;min-width:0}
.nf-time{font-size:11px;color:#8fa0a8;flex-shrink:0;font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.nf-dot{width:7px;height:7px;border-radius:50%;background:var(--teal);flex-shrink:0}
.nf-sub{font-size:12.5px;line-height:1.6;color:var(--muted);margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nf-sub .quote{color:var(--ink)}
.nf-act{margin-top:9px;display:inline-flex;align-items:center;gap:6px}
.nf-btn{border:none;font:inherit;font-size:12px;font-weight:700;border-radius:8px;padding:7px 13px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.nf-btn.primary{background:var(--teal);color:#fff}
.nf-btn.amber{background:var(--amber-ink);color:#fff}
.nf-btn:hover{filter:brightness(.95)}
.nf-foot{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--border);background:var(--surface)}
.nf-foot .grow{flex:1}
.nf-foot a{background:none;border:none;font:inherit;font-size:12.5px;font-weight:700;color:var(--teal);cursor:pointer;
  padding:8px 10px;border-radius:8px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;text-decoration:none}
.nf-foot a:hover{background:#eef2f4}
.nf-empty{padding:40px 28px 44px;text-align:center}
.nf-empty .ring{width:56px;height:56px;border-radius:50%;background:var(--green-bg);border:1.5px solid var(--green-line);
  display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.nf-empty .et{font-size:14px;font-weight:800}
.nf-empty .es{font-size:12.5px;color:var(--muted);line-height:1.7;margin-top:6px}
/* Phone: the panel goes full-screen, which makes .nf-veil unreachable (and, once the bell moved
   into the rail drawer, actively harmful — the veil is a body child at z-index 40 while the drawer
   lives inside .op-shell's z-index:1 context, so it painted OVER the panel). 700px = the drawer
   breakpoint, so the two agree. Closing is the ✕ / Escape here, not an outside tap. */
@media (max-width:700px){.nf-veil{display:none}
  .nf-panel{position:fixed;top:0;right:0;left:0;bottom:0;width:auto;max-width:none;max-height:none;border-radius:0}
  .nf-close,.nf-mark{min-height:44px;display:inline-flex;align-items:center}
  .nf-close{min-width:44px;justify-content:center}}
.h2{font-size:21px;font-weight:800;margin:0 0 4px;line-height:1.45}
.lead{color:var(--gray-ink);font-size:13.5px;line-height:1.7;margin:0 0 16px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px;margin:12px 0;
  box-shadow:0 1px 3px rgba(12,18,38,.04)}
.prog .ptop{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:8px}
.prog .pk{font-weight:700}.prog .pv{color:#0e7d8f;font-weight:700}
.bar{height:8px;background:var(--border);border-radius:6px;overflow:hidden}
.bar>div{height:100%;background:#0e7d8f;transition:width .3s ease}
.ic{width:40px;height:40px;border-radius:11px;flex:0 0 40px;display:flex;align-items:center;
  justify-content:center;color:#fff;font-weight:800}
.cn{font-weight:700;font-size:14px}.cd{color:#8a93a6;font-size:12.5px;line-height:1.55;margin-top:2px}
.hint{color:#a6abca;font-size:11.5px}
.badge-ok{color:#0a7d34;font-weight:700;font-size:12.5px}
.btn{border:0;border-radius:10px;font-weight:700;font-size:13.5px;padding:10px 16px;cursor:pointer;
  text-decoration:none;display:inline-block;text-align:center;white-space:nowrap}
.btn-connect{background:#1e40af;color:#fff}
.btn-teal{background:var(--teal);color:#fff}
.btn-primary{display:block;width:100%;background:#0e7d8f;color:#fff;padding:14px;border-radius:12px;
  font-size:15px;margin-top:6px}
.btn-primary[disabled],.btn-primary.off{background:#c6ccd6;color:#fff;pointer-events:none}
.btn-google{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--card);
  border:1px solid var(--border);color:var(--ink);padding:13px;border-radius:12px;width:100%}
.btn-line{display:flex;align-items:center;justify-content:center;gap:8px;background:#06c755;color:#fff;
  width:100%;padding:14px;border-radius:12px;font-size:15px}
.btn-disc{background:var(--card);border:1px solid #e3b7b7;color:#c0392b;padding:8px 13px;font-size:13px}
.gG{font-weight:800;color:#4285f4;font-size:16px}
.trust .tr{display:flex;gap:10px;padding:7px 0;font-size:12.5px;color:var(--gray-ink);line-height:1.5}
.trust .ti{color:#0e7d8f;flex:0 0 18px}
.center{text-align:center}
.check{width:64px;height:64px;border-radius:50%;background:#e7f6ec;color:#0a7d34;display:flex;
  align-items:center;justify-content:center;font-size:30px;margin:6px auto 12px}
.skip{display:block;text-align:center;color:#8a93a6;font-size:13px;margin-top:12px;text-decoration:underline}
.footer{color:#a6abca;font-size:11.5px;text-align:center;margin-top:18px;line-height:1.6}
.link{color:#1e40af;font-size:13px;text-decoration:none}
.steps .st{display:flex;gap:11px;padding:9px 0}
.sn{width:24px;height:24px;border-radius:50%;background:#0e7d8f;color:#fff;font-size:12px;font-weight:700;
  display:flex;align-items:center;justify-content:center;flex:0 0 24px}
.stt{font-weight:700;font-size:13.5px}.std{color:#8a93a6;font-size:12px;margin-top:1px}
.pv-pill{display:inline-block;background:#e7f1fb;color:#1e6fb8;font-size:11px;font-weight:700;
  padding:3px 9px;border-radius:7px}
.tw{display:flex;gap:9px;align-items:center;margin:8px 0 6px}
.tw .ta{width:34px;height:34px;border-radius:50%;background:#0e7d8f;color:#fff;display:flex;
  align-items:center;justify-content:center;font-weight:700;flex:0 0 34px}
.tw .tn{font-weight:700;font-size:13px}.tw .th{color:#8a93a6;font-size:11.5px}
.tbody{font-size:13px;line-height:1.6;white-space:pre-wrap}
.tmeta{color:#a6abca;font-size:11px;margin-top:8px}
.hero{display:block}
.pv-grid{display:block}
.qr{width:208px;margin:6px auto 0}.qr svg{width:100%;height:auto;display:block}
.flash{background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);border-radius:12px;
  padding:12px 14px;font-size:13px;margin-bottom:14px}
.flash.err{background:#fdecec;border-color:#f4c4c4;color:#a02525}
html.dark .flash.err{background:#3a1c1c;border-color:#5e2b2b;color:#f0a3a3}
.sec-h{font-weight:700;font-size:13.5px;color:var(--ink);margin:22px 2px 10px}
.sec-h .sub{font-weight:500;color:#9aa1b5;font-size:12px;margin-left:8px}
.hero-act{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.hero-act .ha-l{font-size:14px}
.hero-act .ha-l b{font-size:22px}
.btn-test{background:var(--card);border:1px solid var(--teal);color:var(--teal);border-radius:10px;
  padding:10px 14px;font-weight:700;font-size:13px;cursor:pointer;white-space:nowrap}
.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.stat{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:13px 14px}
.stat .sv{font-size:24px;font-weight:800;color:var(--ink);line-height:1.1}
.stat .sl{font-size:11.5px;color:#8a93a6;margin-top:3px}
.sched-row{display:flex;align-items:center;gap:11px;padding:11px 0;border-top:1px solid var(--border)}
.sched-row:first-child{border-top:0}
.sched-row .si{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;
  justify-content:center;font-weight:800;color:#fff;font-size:13px;flex:0 0 30px}
.sched-row .sbody{flex:1;min-width:0}
.sched-row .stitle{font-size:13px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sched-row .ssub{font-size:11.5px;color:#9aa1b5;margin-top:2px}
.pill{font-size:11px;padding:3px 9px;border-radius:999px;white-space:nowrap;flex:0 0 auto}
.pill.wait{background:var(--amber-bg);color:var(--amber-ink)}.pill.ok{background:var(--green-bg);color:var(--green)}
.kv{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--border);font-size:13px}
.kv:first-child{border-top:0}.kv .kk{color:var(--gray-ink)}.kv .vv{color:var(--ink);font-weight:600;max-width:60%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kv .vv.miss{color:#b9770e;font-weight:500}
.empty{color:#9aa1b5;font-size:13px;padding:6px 0}
.kpi{padding:12px 0;border-top:1px solid var(--border)}.kpi:first-child{border-top:0}
.kpi-h{display:flex;justify-content:space-between;align-items:center;gap:10px}
.kpi-h .kn{font-size:13px;font-weight:700;color:var(--ink)}
.kpi-b{font-size:12px;color:var(--gray-ink);margin-top:4px}
.kpi-b .arrow{color:#b6bccb;margin:0 7px}.kpi-b .kt{color:#0e7d8f;font-weight:600}
.kpill{font-size:11px;padding:3px 10px;border-radius:999px;white-space:nowrap;flex:0 0 auto}
.kpill.live{background:var(--green-bg);color:var(--green)}.kpill.soon{background:var(--gray-bg);color:var(--gray-ink)}
.kbar{height:6px;background:var(--gray-bg);border-radius:999px;margin-top:8px;overflow:hidden}
.kbar>div{height:100%;background:#0e7d8f;border-radius:999px}
/* ===== Content Plan & KPI (from design handoff) ===== */
/* プラム&アンバー（design/plum-console.html）— オペレーターコンソールと同じ token 層。
   --teal は「主アクセント」の意味で残す（204箇所の参照名を変えずに配色だけ差し替える）。 */
:root{--teal:#5e2b5e;--teal-soft:#f6ebf4;--teal-line:#e3cbe0;--teal-deep:#48214a;--amber:#a06f18;--amber-bg:#fdf4df;
  --amber-line:#f2dfae;--amber-ink:#a06f18;--green:#1e7a56;--green-bg:#e7f5ef;--green-line:#c2e5d6;
  --gray-bg:#edeaf1;--gray-ink:#6f6880;--border:#e9e6ef;--muted:#8d8699;--ink:#282331;--card:#fff;
  --bg:#f2f1f6;--surface:#fbfafc;--info:#4a5fd0;--violet:#6a4fbf;--rose:#b0374a;
  --rose-bg:#fdf2f3;--rose-line:#eecdd2;color-scheme:light}
/* ── dark mode: re-map the token layer (Claude Design palette) + component patches ── */
html.dark{color-scheme:dark;--teal:#c07fbd;--teal-soft:#2c1b2c;--teal-line:#4a3149;--teal-deep:#e3bbdf;
  --amber:#e3b75a;--amber-bg:#392f18;--amber-line:#5d4a20;--amber-ink:#e3b75a;
  --green:#5fd6a0;--green-bg:#16302a;--green-line:#27604a;
  --gray-bg:#282130;--gray-ink:#a79fb5;--border:#2f2837;--muted:#948ca2;--ink:#ece7f2;
  --card:#1b1621;--bg:#141019;--surface:#221c29;--info:#8f9cf0;--violet:#a394f0;--rose:#e88a96;
  --rose-bg:#39191d;--rose-line:#5e2b32}
html.dark body{background:var(--bg);color:var(--ink)}
html.dark .appbar{background:var(--card);border-color:var(--border)}
html.dark .card,html.dark .menu,html.dark .bell-menu,html.dark .nf-panel,html.dark .mg-modal,html.dark .ed-modal{box-shadow:0 10px 32px rgba(0,0,0,.5)}
html.dark .p-dot,html.dark .pdot{box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
html.dark .wp-shimmer{background:linear-gradient(90deg,#1c2630 25%,#28333f 37%,#1c2630 63%);background-size:320px 100%}
html.dark .wp-confirm,html.dark .nf-btn.amber{color:#2a1c05}
html.dark .nf-veil,html.dark .mg-veil,html.dark .rv-veil{background:rgba(0,0,0,.55)}
html.dark input,html.dark textarea,html.dark select{background:var(--surface);color:var(--ink);border-color:var(--border)}
html.dark .qr-code,html.dark .qr svg{background:#fff;padding:6px;border-radius:8px}
html.dark .ai,html.dark .brand-tile{color:#fff}
/* red-tinted warning/danger surfaces: keep light-mode pink, give dark mode a readable dark-red (cf .flash.err) */
html.dark .rv-warn{background:#3a1c1c;border-color:#5e2b2b;color:#f0a3a3}
html.dark .rv-danger{color:#f0a3a3}
html.dark .rv-danger:hover{background:#3a1c1c;border-color:#5e2b2b}
html.dark .fill-count.over{background:#3a1c1c;border-color:#5e2b2b;color:#f0a3a3}
html.dark .suc .conn-disc{color:#f0a3a3}
html.dark .suc .conn-disc:hover{background:#3a1c1c}
/* Dark-mode fixes for menu / error / badge states the main-page render didn't surface. */
html.dark .menu .lo{color:#f0a3a3}                  /* logout: was dark-red (#c0392b) on the dark menu */
html.dark .menu .em{color:var(--muted)}             /* menu email subtext (hardcoded light --muted) */
html.dark .btn-disc{color:#f0a3a3;border-color:#5e2b2b}              /* LINE disconnect button */
html.dark .ed-count.over,html.dark .af-err,html.dark .suc .af-err{color:#f0a3a3}  /* red error text */
html.dark .link{color:#7aa7e0}                      /* dark-blue (#1e40af) links → readable on dark */
html.dark .btn-primary.off{background:var(--gray-bg);color:var(--muted)}   /* disabled CTA */
html.dark .check{background:var(--green-bg);color:var(--green)}            /* 連携完了 ✓ circle */
html.dark .pv-pill{background:var(--teal-soft);color:var(--teal-deep)}     /* preview pill */
html.dark .rv-ph:hover,html.dark .rv-ph.sel{background:var(--amber-line)}  /* 差し込み token highlight */
html.dark .fill-ai:hover{background:var(--teal-soft)}                      /* AIにおまかせ hover */
/* notification panel: hardcoded light values (#fff / #f7fafb / #eef2f4) → dark equivalents */
html.dark .nf-group{background:linear-gradient(var(--card) 72%,transparent)}
html.dark .nf-item:hover{background:var(--gray-bg)}
html.dark .nf-item.unread{background:color-mix(in srgb,var(--teal) 13%,var(--card))}
html.dark .nf-item.unread:hover{background:color-mix(in srgb,var(--teal) 20%,var(--card))}
html.dark .nf-item+.nf-item{border-top-color:var(--border)}
html.dark .nf-ic.ingest,html.dark .nf-ic.report,html.dark .nf-ic.info{background:var(--gray-bg);color:var(--gray-ink)}
html.dark .nf-foot a:hover{background:var(--gray-bg)}
html.dark .nf-tab:hover{border-color:#3a4a59}                       /* active tab = light pill → use DARK text */
html.dark .nf-tab.on{color:var(--bg)}
html.dark .nf-tab.on .pip{background:rgba(0,0,0,.18);color:var(--bg)}
.t-toggle{width:40px;height:40px;border-radius:11px;border:none;background:none;cursor:pointer;margin:0;display:flex;align-items:center;justify-content:center;color:var(--gray-ink);transition:background .14s,color .14s}
.t-toggle:hover{background:var(--gray-bg);color:var(--ink)}
.t-toggle svg,.bell svg{width:30px;height:30px;flex:none}   /* flex:none stops the button's flexbox shrinking the glyph to ~8px */
.page-sub{font-size:12.5px;color:var(--muted);margin:6px 0 0;line-height:1.7}
.approval-note{display:inline-flex;align-items:center;gap:7px;margin-top:10px;padding:6px 12px;border-radius:99px;
  background:var(--teal-soft);border:1px solid var(--teal-line);color:var(--teal);font-size:12px;font-weight:600}
.plan-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.seg{display:flex;background:var(--gray-bg);border-radius:9px;padding:3px;gap:2px}
.seg button{border:none;background:none;font:inherit;font-size:12.5px;font-weight:600;color:var(--muted);
  padding:7px 16px;border-radius:7px;cursor:pointer;white-space:nowrap}
.seg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(20,32,45,.12)}
/* 一覧の表示切替はリンク（JSを使わずURLで状態が決まる）。見た目はボタン版に揃える。 */
.seg{align-self:flex-start;width:max-content}
.seg-b{font-size:12.5px;font-weight:600;color:var(--muted);padding:7px 16px;border-radius:7px;
  white-space:nowrap;text-decoration:none}
.seg-b.on{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(20,32,45,.12)}
.pill.pending{background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber-ink)}
.pill.scheduled{background:var(--teal-soft);border:1px solid var(--teal-line);color:var(--teal)}
.pill.mergefill{background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber-ink);font-weight:700}
/* 差し込み待ち — home digest banner + on-card summary */
.merge-banner{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin:14px 0 16px;padding:12px 14px;
  border:1px solid var(--amber-line);background:var(--amber-bg);border-radius:11px;text-decoration:none;cursor:pointer;transition:filter .12s}
.merge-banner:hover{filter:brightness(.985)}
.mb-ic{flex-shrink:0;width:30px;height:30px;border-radius:8px;background:var(--card);border:1px solid var(--amber-line);
  display:flex;align-items:center;justify-content:center;font-size:15px;color:var(--amber-ink)}
.mb-tx{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.mb-tx b{font-size:12.5px;font-weight:800;color:var(--amber-ink)}
.mb-tx span{font-size:11px;color:#8a6a2a;line-height:1.4}
.mb-go{flex-shrink:0;font-size:12px;font-weight:800;color:var(--teal);white-space:nowrap}
.mg-summary{display:flex;flex-direction:column;gap:10px}
.mg-sum-h{font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.6}
.mg-sum-h b{color:var(--amber-ink)}
.mg-sum-list{display:flex;flex-direction:column;gap:2px;border:1px solid var(--border);border-radius:9px;background:var(--card);padding:5px}
.mg-sum-row{display:flex;align-items:flex-start;gap:9px;padding:7px 8px;border-radius:7px}
.mg-sum-dot{width:15px;height:15px;border-radius:50%;flex-shrink:0;margin-top:1px;border:1.5px dashed var(--amber)}
.mg-sum-row.full .mg-sum-dot{border-style:solid;border-color:var(--green);background:var(--green)}
.mg-sum-l{font-size:12px;font-weight:700;color:var(--ink);flex:1;min-width:0;line-height:1.45;word-break:break-word}
.mg-sum-v{font-size:11px;color:var(--amber-ink);flex-shrink:0;white-space:nowrap;margin-top:1px;padding-left:8px}
.rv-merge-cta{align-self:flex-start;text-decoration:none}
.mg-sum-note{display:flex;align-items:flex-start;gap:6px;font-size:11px;color:var(--muted);line-height:1.6;
  background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:8px;padding:8px 10px}
/* 差し込み入力 modal dialog (raised over the unit on panel=fill) */
.mg-veil{position:fixed;inset:0;background:rgba(20,32,45,.5);z-index:200;animation:mgFade .16s ease}
.mg-modal{position:fixed;inset:24px;z-index:201;max-width:1080px;margin:auto;display:flex;flex-direction:column;
  background:var(--card);border-radius:16px;overflow:hidden;box-shadow:0 24px 70px rgba(20,32,45,.34);
  animation:mgPop .18s cubic-bezier(.22,.61,.36,1)}
@keyframes mgFade{from{opacity:0}}
@keyframes mgPop{from{opacity:0;transform:scale(.985)}}
.mg-head{display:flex;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--border);flex-shrink:0}
.mg-h-t{font-size:15px;font-weight:800;color:var(--ink)}
.mg-head .fill-bars{width:120px;flex:0 0 auto}
.mg-sp{flex:1}
.mg-x{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--muted);
  display:flex;align-items:center;justify-content:center;font-size:15px;text-decoration:none;flex-shrink:0}
.mg-x:hover{background:var(--gray-bg);color:var(--ink)}
.mg-form{display:flex;flex-direction:column;min-height:0;flex:1}
.mg-cols{display:grid;grid-template-columns:minmax(0,1fr) 358px;min-height:0;flex:1;overflow:hidden}
.mg-main{overflow-y:auto;padding:18px 22px}
.mg-help{font-size:12px;color:var(--muted);line-height:1.7;margin:0 0 12px}
.mg-help b{color:var(--ink)}
.mg-rail{border-left:1px solid var(--border);background:var(--bg);display:flex;flex-direction:column;min-height:0;overflow:hidden}
.mg-rail-h{padding:14px 16px 10px;border-bottom:1px solid var(--border);flex-shrink:0}
.mg-rail-h .t{font-size:13px;font-weight:800}
.mg-rail-h .s{font-size:11.5px;color:var(--muted);margin-top:2px}
.mg-rail .fill-checklist{margin:10px 12px;flex-shrink:0;max-height:172px}
.mg-rail .fill-editors{flex:1;overflow-y:auto;padding:0 14px 14px;min-height:0}
.mg-rail-foot{border-top:1px solid var(--border);padding:11px 14px;display:flex;flex-shrink:0}
.mg-foot{display:flex;align-items:center;gap:12px;padding:12px 18px;border-top:1px solid var(--border);background:var(--card);flex-shrink:0}
.mg-foot-lede{font-size:11.5px;color:var(--muted)}
.mg-foot .fill-apply{min-height:42px}
@media (max-width:860px){
  .mg-modal{inset:0;border-radius:0;max-width:none}
  .mg-cols{grid-template-columns:1fr;overflow-y:auto}
  .mg-main{overflow:visible}
  .mg-rail{border-left:none;border-top:1px solid var(--border);overflow:visible}
  .mg-rail .fill-editors{overflow:visible}
  /* footer: let the full-width submit drop below the lede instead of squeezing in a nowrap row */
  .mg-foot{flex-wrap:wrap;gap:8px}
  /* the checklist had its own 172px scroll inside the already-scrolling column → nested-scroll trap */
  .mg-rail .fill-checklist{max-height:none;overflow:visible}
}
.pill.done,.pill.locked{background:var(--gray-bg);border:1px solid var(--border);color:var(--gray-ink)}
.aud{display:inline-block;padding:2px 8px;border-radius:6px;background:var(--gray-bg);color:var(--gray-ink);font-size:11px;font-weight:600;white-space:nowrap}
.list-card{overflow:hidden;padding:0}
.row-title{font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row-title+.row-excerpt{font-size:11.5px;font-weight:500;color:var(--muted);margin-top:1px}
.group-note{font-size:10.5px;color:var(--muted);font-weight:600}
.pill.none{background:var(--gray-bg);color:var(--gray-ink)}
.plan-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.plan-bar .plan-filter{flex:1;min-width:0;margin:0}
.group-head{display:flex;align-items:center;gap:10px;padding:12px 18px 10px;font-size:12px;font-weight:700;
  color:var(--muted);border-bottom:1px solid var(--border);background:var(--surface)}
.group-head .line-cta{margin-left:auto;border:none;background:none;font:inherit;font-size:12px;font-weight:700;color:var(--teal);cursor:pointer;padding:4px 6px;text-decoration:none}
.row{display:flex;align-items:center;gap:14px;padding:13px 18px;border-bottom:1px solid var(--border)}
.row:last-child{border-bottom:none}
.p-icon{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.row-main{flex:1;min-width:0}
.row-excerpt{font-size:13.5px;font-weight:600;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.row-meta{display:flex;align-items:center;gap:8px;margin-top:4px;font-size:11.5px;color:var(--muted)}
.row-side{display:flex;align-items:center;gap:10px;flex-shrink:0}
.cal-card{padding:16px 16px 18px}
.cal-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;padding:0 4px;gap:10px;flex-wrap:wrap}
.cal-month{font-size:15px;font-weight:700;min-width:84px;text-align:center}
.cal-nav{display:flex;align-items:center;gap:6px}
.cal-arrow{border:1px solid var(--border);background:var(--card);border-radius:7px;width:28px;height:28px;cursor:pointer;
  color:var(--gray-ink);font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;font-family:inherit}
.cal-arrow:hover{border-color:var(--border);color:var(--ink)}
.chip.more{font-size:9px;padding:1px 5px;background:var(--gray-bg);color:var(--gray-ink);font-weight:700}
.cal-legend{display:flex;align-items:center;gap:12px;font-size:11px;color:var(--muted);flex-wrap:wrap}
.cal-legend i{display:inline-block;width:8px;height:8px;border-radius:3px;margin-right:4px}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cal-wd{text-align:center;font-size:11px;font-weight:700;color:var(--muted);padding:4px 0 6px}
.cal-wd.sun{color:#c25555}.cal-wd.sat{color:#4a7dc9}
.day{min-height:56px;border:1px solid var(--border);border-radius:8px;background:var(--card);padding:3px 3px 5px;
  cursor:pointer;display:flex;flex-direction:column;gap:3px}
.day:hover{border-color:var(--border)}
.day.out{background:transparent;border-color:transparent;cursor:default}
.day.sel{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal)}
/* ドラッグ&ドロップ（仕様 13-1 ②）。**掴めるものにだけ掴める見た目**を与える —
   承認待ちは公開日時がまだ無く、公開済みは過去なので動かせない。 */
.chip.mov{cursor:grab}
.chip.dragging{opacity:.45}
/* 落とせる日だけを光らせる。落とせない日（過去・月外）は何も変えない —
   全部光ると、どこに落とせるのか分からなくなる。 */
.day.dropok{border-color:var(--teal);background:var(--teal-soft);box-shadow:0 0 0 2px var(--teal-line)}
/* 週表示（既定）: **7列 × 24時間**の格子。行が実際の時刻なので、縦に動かすと時刻が、
   横に動かすと日付が変わる。狭い画面では横スクロールさせる — 24時間分の行を潰すと
   どの行が何時か読めなくなり、格子である意味が消える。 */
.wkwrap{container-type:inline-size}
.wkg-scroll{position:relative;border:1px solid var(--border);border-radius:12px;overflow:auto;
  max-height:min(64vh,600px);background:var(--surface)}
/* 札1枚ぶんの高さ（時刻・状態の1行＋本文2行）。マスの床をこの2枚ぶんに固定する。 */
.wkg{--wkc-slot:52px;
  display:grid;grid-template-columns:104px repeat(var(--cols,7),minmax(112px,1fr));
  gap:6px;min-width:820px}
/* 行＝媒体（UIモック）。時刻の格子は週15本では9割が空欄で、週の形が読めなかった。 */
/* 媒体名は行の**頭**に置く（UIモック）。マスが2枚ぶんの高さを持つようになったので、
   真ん中に置くと1枚目の札と目線が合わない。 */
.wkg-p{display:flex;align-items:flex-start;gap:7px;padding:9px 8px 9px 2px;font-size:12px;
  border:none;position:sticky;left:0;background:var(--card);z-index:2;font-weight:700}
.wkg-p i{width:8px;height:8px;border-radius:50%;flex:0 0 auto;margin-top:5px}
.wkg-ev{font-size:10.5px;font-weight:700;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis}
.wkg-day.hasev{background:var(--teal-soft)}
.wkg-corner,.wkg-day{position:sticky;top:0;z-index:3;background:var(--card);
  height:38px;display:flex;align-items:center;justify-content:center}
.wkg-corner{left:0;z-index:4}
.wkg-day{padding:2px;text-align:center;border:none}
/* 曜日と行事は1つの札。**行事のある日だけ高さが変わると、列がずれる。** */
.wkg-dlab{display:inline-flex;align-items:baseline;gap:2px;padding:4px 10px;border-radius:99px;
  max-width:100%;overflow:hidden}
.wkg-day b{font-size:12px;font-weight:700;color:var(--muted);white-space:nowrap}
.wkg-day.hasev{background:none}
.wkg-day.hasev .wkg-dlab{background:var(--teal);color:var(--card)}
.wkg-day.hasev b{color:var(--card);font-weight:800}
.wkg-day.today .wkg-dlab{background:var(--teal-soft)}
.wkg-day.today b{color:var(--teal);font-weight:800}
/* （残置）月表示で使う帯。週表示は媒体×曜日になったので、こちらは使っていない。 */
.wkg-adl,.wkg-ad{position:sticky;top:46px;z-index:2;background:var(--surface);
  border-bottom:1px solid var(--border)}
.wkg-adl{left:0;z-index:3;font-size:9.5px;color:var(--muted);text-align:right;
  padding:6px 6px 4px 0;line-height:1.3}
.wkg-ad{border-left:1px solid var(--border);padding:4px;display:flex;flex-direction:column;
  gap:3px;min-height:24px}
.wkg-hr{position:sticky;left:0;z-index:2;background:var(--surface);border-top:1px solid var(--border);
  font-size:10px;color:var(--muted);text-align:right;padding:1px 6px 0 0;font-variant-numeric:tabular-nums}
/* **どのマスも2枚ぶんの高さを持つ。** 投稿の数で行の高さが変わると、週の形
   （どの媒体がどの日に出るか）が読めない — 空いている媒体の行が潰れて、
   「空いている」ことが見えなくなる。3枚目からは伸びる。 */
/* 罫線の表ではなく、並んだ面（UIモック）。線で区切ると格子が主役になり、札が沈む。 */
.wkg-cell{background:var(--gray-bg);border-radius:9px;border:none;
  min-height:calc(var(--wkc-slot,52px)*2 + 6px);
  padding:5px;display:flex;flex-direction:column;gap:4px;position:relative}
.wkg-cell.off,.wkg-hr.off{background:var(--gray-bg)}
.wkg-cell.dropok{background:var(--teal-soft);box-shadow:inset 0 0 0 2px var(--teal-line)}
/* いまの時刻の線。24行のうち今どこにいるのかが分からないと、格子はただの升目になる。 */
.wkg-cell.nowc::after{content:'';position:absolute;left:0;right:0;top:var(--np,0);height:2px;
  background:var(--rose);z-index:1;pointer-events:none}
.wk-ev{font-size:10.5px;font-weight:700;border-radius:6px;padding:3px 6px;line-height:1.4}
.wk-ev.event{background:var(--teal-soft);color:var(--teal-deep)}
.wk-ev.deadline{background:var(--amber-bg);color:var(--amber-ink)}
/* 札の地は**状態の色**（UIモック）。媒体は行が言っているので、左の帯は要らない。
   `--c` には状態の色が入る（色を混ぜる元をここ1つにして、地と縁がずれないようにする）。 */
.wkc{background:color-mix(in srgb, var(--c) 17%, var(--card));
  border:1px solid color-mix(in srgb, var(--c) 34%, var(--card));
  border-radius:7px;padding:5px 7px;font-size:10.5px;line-height:1.35;min-width:0}
.wkc[draggable=true]{cursor:grab}
/* 媒体間同期の印。**控えめでよい** — 束の存在を知らせるだけで、読ませる情報ではない。 */
.wk-sync{display:inline-block;margin-right:3px;opacity:.75;font-weight:700}
.wkc.faded{opacity:.6}
.wkc.dragging{opacity:.4}
/* 札の頭。時刻は左、状態は右。**幅が足りないときに削るのは状態のほう** — どの時刻に
   出るかは、状態より先に読まれる。 */
.wkc-hd{display:flex;align-items:baseline;justify-content:space-between;gap:4px;margin-bottom:2px}
.wkc-h{font-weight:800;font-size:10.5px;font-variant-numeric:tabular-nums;flex:none}
.wkc-h.und{color:var(--muted);font-weight:700}
.wkc-s{font-size:9.5px;font-weight:700;opacity:.72;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wkc-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  color:var(--ink);font-weight:600;word-break:break-word}
/* 日付＋時刻を1つの入力で。**ドラッグは同じ週の中にしか届かない。** */
.wk-timein{border:1px solid var(--teal-line);border-radius:6px;font:inherit;font-size:10px;
  padding:1px 3px;margin-top:3px;width:100%;background:var(--card);color:var(--ink)}
/* 週の集計と、時刻がどこで決まるかへの導線。**クラスを書いて CSS を書き忘れると、
   本文と同じ大きさで出て脚注に見えない**（実際にそうなっていた）。 */
/* 投稿を追加のモーダル（UIモック）。媒体は札で選ぶ — 選択肢が5つ以下なら、
   開かないと中身が見えない select より、全部見えている札のほうが速い。 */
.ap{max-width:500px}
/* 余白はモックに合わせる。**題と説明は1つの塊**なので、間に罫線を引かない
   （引くと「題」と「説明」が別の段に見え、説明が読み飛ばされる）。 */
.ap .mg-head{padding:20px 22px 0;border-bottom:none}
.ap .pm-body{padding:9px 22px 20px;gap:15px}
.ap .pm-sub{font-size:12px;line-height:1.65}
.ap .rv-ta{min-height:66px}
.ap .ap-alt{margin-top:-3px}
.ap .ap-foot{margin-top:5px}
.ap-pills{display:flex;gap:8px;flex-wrap:wrap}
.ap-pill{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;
  border:1px solid var(--border);background:var(--card);font-size:12.5px;font-weight:600;
  color:var(--ink);cursor:pointer;white-space:nowrap}
.ap-pill input{position:absolute;opacity:0;width:0;height:0}
.ap-pill:hover{border-color:var(--teal)}
.ap-pill.on{background:var(--teal);border-color:var(--teal);color:var(--card)}
.ap-dot{width:8px;height:8px;border-radius:50%;flex:none}
/* 選ばれた札の地は accent。Xの黒に近い印は明色テーマでその地に埋もれるので、
   印も文字と同じ対の側へ寄せる。**印だけ消えると、どの媒体か読めなくなる。** */
.ap-pill.on .ap-dot{background:var(--card)!important}
.ap-when{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ap-hint{display:flex;gap:8px;align-items:baseline;padding:10px 12px;border-radius:10px;
  background:var(--teal-soft);font-size:11.5px;line-height:1.65;color:var(--ink)}
.ap-hint b{color:var(--teal)}
.ap-hint.quiet{background:var(--gray-bg)}
.ap-hint.quiet b{color:var(--muted)}
.ap-alt{font-size:11.5px}
.ap-alt a{color:var(--teal);text-decoration:none;font-weight:600}
.ap-alt a:hover{text-decoration:underline}
.ap-foot{display:flex;gap:10px;margin-top:2px}
.ap-foot .rv-btn{width:auto;flex:1;text-decoration:none;display:inline-flex;
  align-items:center;justify-content:center}
/* キャンセルの枠。**`.rv-btn` は `border:none` を持ち、この行より後ろにある。**
   詳しさが同じなら後ろが勝つので、`.ap-cancel` 単独では枠が消える（2往復した）。
   面を区切る `--border` も白地では縁として見えないので、濃さは既存の2つから作る
   — 直値を置くとテーマを切り替えたときに片方だけ取り残される。 */
.ap-foot .ap-cancel{background:var(--card);color:var(--ink);
  border:1px solid color-mix(in srgb, var(--muted) 42%, var(--card))}
.ap-foot .ap-cancel:hover{border-color:var(--muted)}
.ap-go{flex:2}
.ap-said{margin-bottom:14px;padding:11px 14px;border-radius:11px;background:var(--teal-soft);
  color:var(--ink);font-size:12.5px;line-height:1.6}
.ap-said.bad{background:var(--amber-bg);color:var(--amber-ink)}
/* 媒体別表示の見出しと「＋ 投稿を追加」。 */
.cal-flabel{font-size:11.5px;color:var(--muted);margin-left:4px}
.cal-grow{flex:1}
.cal-add{width:auto;padding:8px 14px;text-decoration:none}
/* Scheduler の帯。**提案が出せるときだけ色を持たせる** — 出せないときに同じ強さで
   出すと、毎週「まだ足りません」が目立ち続けて、本当に出たときに気づけない。 */
.sched-note{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:12px;
  padding:11px 13px;border-radius:11px;background:var(--teal-soft);font-size:11.5px;
  line-height:1.65}
.sched-note b{color:var(--teal);white-space:nowrap}
.sched-note.quiet{background:var(--gray-bg)}
.sched-note.quiet b{color:var(--muted)}
/* 直さないと公開されないものは、提案ではなく警告の色で出す。 */
.sched-note.warn{background:var(--amber-bg)}
.sched-note.warn b,.sched-note.warn a{color:var(--amber-ink)}
.sched-note a{margin-left:auto;color:var(--teal);text-decoration:none;font-weight:600;
  white-space:nowrap}
/* レールの足元の組織名。**隣の会社の予定を自分のものとして読む事故を防ぐ。** */
.op-who{padding:0 12px 8px;font-size:11px;line-height:1.5;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis}
.op-org{font-weight:700}
/* 題の下の1行（画面の使い方）。**題の横に足すと題が読めなくなる。** */
.op-subline{margin:5px 0 0;font-size:11.5px;line-height:1.65;color:var(--muted);max-width:78ch}
.op-subline b{color:var(--ink);font-weight:700}
/* 0件の札。**あることは見せるが、押せない**（押しても空、を作らない）。 */
.rv-fch.none{opacity:.45;cursor:default;background:var(--gray-bg);color:var(--muted)}
/* 種別の札。**本文の題より先に読ませない** — 何の投稿かは題で分かるので、札は目印。 */
/* 種別は**四角の札**（UIモック）。幅を固定して、「ストーリーズ」のような長い名前が
   2行になっても列の頭が揃う（幅が揺れると、題の始まる位置が行ごとにずれる）。 */
.kchip{display:inline-flex;align-items:center;justify-content:center;
  width:52px;min-height:34px;text-align:center;font-size:10px;font-weight:700;
  padding:4px 5px;border-radius:9px;margin-right:11px;line-height:1.35;
  background:var(--gray-bg);color:var(--gray-ink);border:1px solid var(--border)}
.kchip.mail{background:var(--teal-soft);color:var(--teal);border-color:var(--teal-line)}
.kchip.video{background:var(--amber-bg);color:var(--amber-ink);border-color:var(--amber-line)}
/* 並べ替えは列の見出しから。押せることが見えないと押されない。 */
.dt-s a{color:inherit;text-decoration:none;white-space:nowrap}
.dt-s a:hover{color:var(--teal)}
.dt-s.on a{color:var(--teal);font-weight:800}
/* 絞り込みの見出し。札の列が3つ並ぶと、名前が無いかぎり色違いの集まりにしか見えない。 */
.lst-filters{display:grid;grid-template-columns:auto 1fr;align-items:center;
  column-gap:10px;row-gap:2px}
.flt-l{font-size:11.5px;font-weight:700;color:var(--muted);white-space:nowrap;
  justify-self:end}
.lst-filters .rv-filter{padding:0 0 4px;margin:0}
/* 却下は理由を聞く画面へ。承認と並べるが、色は持たせない（押し間違いを誘わない）。 */
.dt-rej{color:var(--rose)!important}
.dt-rej:hover{border-color:var(--rose)}
/* 説明の行と、その画面固有の操作。操作は下端で揃える（説明が2行でもボタンが浮かない）。 */
.op-subrow{display:flex;align-items:flex-end;gap:18px;margin-top:5px}
.op-subrow .op-subline{margin:0}
/* **右端は本文の右端に揃える。** 説明側は `max-width` で伸びきらないので、余りは行の
   末尾に溜まり、操作だけが内側に浮く（本番で測って気づいた）。説明の**次に来るもの**を
   右へ押せば、置くものが週送りでも表示切替でも同じように揃う。 */
.op-subrow > .op-subline + *{margin-left:auto}
.op-subrow .cal-nav,.op-subrow .cal-add{flex:none}
/* 足元の集計は、色・名前・数を1か所に。 */
.wf-s{display:inline-flex;align-items:center;gap:5px;margin-left:12px;white-space:nowrap}
.wf-s i{width:7px;height:7px;border-radius:50%}
/* 他の週へ跳ぶ札。**この週が空でも、投稿が無いわけではない。** */
.wk-jump{margin-left:auto;border:none;background:none;font:inherit;font-size:11.5px;
  font-weight:600;color:var(--teal);cursor:pointer;padding:0}
.wk-jump:hover{text-decoration:underline}
.wk-foot{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:12px;
  padding-top:11px;border-top:1px solid var(--border);font-size:11.5px;color:var(--muted)}
.wk-foot a{margin-left:auto;color:var(--teal);text-decoration:none;font-weight:600}
.wk-foot a:hover{text-decoration:underline}
.wk-note{margin:10px 0 0;font-size:11px;color:var(--muted);line-height:1.6}
/* AIが知りたいこと。答えの入力をその場に置く（別画面に送ると答えない）。 */
.asks-sec{margin-top:14px}
.asks-sec .bn{margin-left:7px}
.asks-list{display:flex;flex-direction:column;gap:8px}
.ask-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;
  background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 12px}
.ask-l{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:700;color:var(--ink);
  min-width:0}
.ask-f{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ask-f .rv-fin{flex:1;min-width:180px;font-weight:400}
.ask-f .rv-btn{width:auto;flex:0 0 auto}
.ask-row form{margin:0}
/* 人が登録した事実の一覧（連携・基本情報）。値が長いので3列にせず、名前の下に値を置く。 */
.vf-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.vf-row{display:grid;grid-template-columns:1fr auto;gap:4px 10px;align-items:center;
  background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:9px 11px}
.vf-l{font-size:12px;font-weight:700;color:var(--ink);min-width:0;word-break:break-word}
.vf-v{grid-column:1;font-size:11.5px;color:var(--muted);line-height:1.6;word-break:break-word}
.vf-row form{grid-row:1/3;grid-column:2;margin:0;display:flex;align-items:center}
/* 審査の指摘から事実を登録する入口。指摘の直後に置く（探させない）。 */
.rv-factadd{display:inline-block;margin-top:4px;font-size:11px;font-weight:800;color:var(--teal);
  text-decoration:none;cursor:pointer}
.rv-factadd:hover{text-decoration:underline}
.rv-flab{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;
  color:var(--ink);margin-bottom:9px}
.rv-fin{border:1px solid var(--border);border-radius:8px;padding:8px 10px;font:inherit;
  font-size:12.5px;background:var(--card);color:var(--ink);font-weight:400}
.rv-fin:focus{outline:2px solid var(--teal-line);border-color:var(--teal)}
/* 作成で折れた企画（要対応）。札は横に敷き詰める — 1件でも画面幅いっぱいの箱にしない。 */
.undone-sec{margin-top:14px}
.undone-sec .bn{margin-left:7px}
.undone-cards{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
  align-items:start}
/* 承認への入口。板が一覧へ移り、承認が1クリック先になったので、**ここが今日やること**。
   帯の直下に置き、件数を数字で大きく出す（帯の小さな数字だけでは動作の合図にならない）。 */
.todo-cta{display:flex;align-items:center;gap:14px;background:var(--card);
  border:1px solid var(--teal-line);border-radius:14px;padding:14px 16px;margin:12px 0 0;
  text-decoration:none;flex-wrap:wrap}
.todo-cta:hover{box-shadow:0 2px 10px rgba(94,43,94,.10)}
.todo-cta.done{border-color:var(--border)}
.tc-n{font-size:30px;font-weight:800;color:var(--teal);line-height:1;font-variant-numeric:tabular-nums}
.tc-t{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.tc-t b{font-size:14px;font-weight:800;color:var(--ink)}
.tc-t span{font-size:11.5px;color:var(--muted);line-height:1.6}
.tc-go{color:var(--teal);font-weight:800;font-size:12.5px;white-space:nowrap}
/* ダッシュボード → 一覧 の入口。**押せる形**にする（文字リンクにすると、締めの一文と
   同じ重さに見えて読み飛ばされる）。 */
.alldrafts{display:flex;align-items:center;gap:10px;justify-content:space-between;
  background:var(--card);border:1px solid var(--border);border-radius:12px;padding:12px 14px;
  margin-top:12px;font-size:12.5px;color:var(--muted);text-decoration:none;flex-wrap:wrap}
.alldrafts:hover{border-color:var(--teal-line)}
.alldrafts b{color:var(--ink);font-weight:800}
.ad-go{color:var(--teal);font-weight:800;white-space:nowrap}
/* 一覧の行は板の札ではなく1本の並び。区切り線だけ引いて、カードの入れ子にしない。 */
.list-card .hxr{border:none;border-radius:0;border-bottom:1px solid var(--border);box-shadow:none}
.list-card .hxr:last-child{border-bottom:none}
.cal-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.day-num{font-size:10.5px;font-weight:700;color:var(--ink);width:17px;height:17px;display:flex;align-items:center;justify-content:center;border-radius:50%}
.day.out .day-num{color:#c2c9d4}
.day-num.today{background:var(--teal);color:#fff}
.evt{font-size:0;padding:0;height:5px;border-radius:3px;overflow:hidden;white-space:nowrap}
.evt.oc{background:var(--teal)}.evt.deadline{background:#d99c10}
.chips-wrap{display:flex;gap:3px;flex-wrap:wrap;padding-left:2px}
.chip{display:flex;align-items:center;gap:2px;font-size:0;padding:0;border-radius:4px;overflow:hidden;white-space:nowrap}
.chip i{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.chip.faded{opacity:.55}
.day-detail{margin-top:14px;border-top:1px solid var(--border);padding-top:12px}
.day-detail .dd-head{font-size:13px;font-weight:700;margin-bottom:8px;padding:0 4px}
.dd-empty{font-size:12.5px;color:var(--muted);padding:4px}
.dd-evt{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;margin-bottom:6px;font-size:12.5px;font-weight:700}
.dd-evt.oc{background:var(--teal-soft);color:var(--teal)}
.dd-evt.deadline{background:var(--amber-bg);color:var(--amber-ink)}
.day-detail .row{border:1px solid var(--border);border-radius:8px;margin-bottom:6px;padding:10px 12px}
.preset-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:6px}
.preset-bar .lbl{font-size:12px;font-weight:600;color:var(--muted)}
.kpi-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}
.kpi-card{padding:18px 18px 16px;display:flex;flex-direction:column}
.kpi-card.locked{background:var(--surface)}
.kpi-name{font-size:14px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kpi-card.locked .kpi-name{color:var(--gray-ink)}
.kpi-exp{font-size:12px;color:var(--muted);line-height:1.7;margin:6px 0 0}
.kpi-preview{margin:14px 0 4px;font-size:13px;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.kpi-preview .cur,.kpi-preview .arrow{color:var(--muted)}
.kpi-preview .goal{font-size:19px;font-weight:800;color:var(--teal);font-variant-numeric:tabular-nums}
.kpi-preview .delta{font-size:11.5px;font-weight:700;color:var(--teal);background:var(--teal-soft);border-radius:99px;padding:2px 8px}
.kpi-hint{font-size:11.5px;color:var(--amber-ink);min-height:1.5em;margin-top:6px}
.range-shell{position:relative;height:30px;margin-top:8px}
.range-base{position:absolute;left:0;right:0;top:12px;height:6px;border-radius:99px;background:var(--gray-bg)}
.range-band{position:absolute;top:12px;height:6px;background:var(--teal-line)}
.range-shell input{position:absolute;inset:0;width:100%;margin:0;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}
.range-shell input::-webkit-slider-runnable-track{background:transparent;height:30px}
.range-shell input::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;margin-top:5px;border-radius:50%;background:var(--card);border:2.5px solid var(--teal);box-shadow:0 1px 4px rgba(20,32,45,.2)}
.range-shell input::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--card);border:2.5px solid var(--teal);box-shadow:0 1px 4px rgba(20,32,45,.2)}
.range-marks{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);margin-top:2px}
.range-marks .rec{color:var(--teal);font-weight:700}
.kpi-locked-intro{margin-top:26px}
.kpi-locked-intro h2{font-size:14px;font-weight:700;margin:0;display:flex;align-items:center;gap:8px}
.kpi-locked-intro p{font-size:12px;color:var(--muted);margin:5px 0 0;line-height:1.7}
.kpi-unlock{margin-top:12px;font-size:11.5px;color:var(--gray-ink);display:flex;align-items:center;gap:6px}
.save-bar{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-top:24px;flex-direction:column-reverse;align-items:stretch;text-align:center}
.save-bar .note{font-size:11.5px;color:var(--muted)}
.btn-save{border:none;background:var(--teal);color:#fff;font:inherit;font-size:13.5px;font-weight:700;
  border-radius:9px;padding:13px 28px;cursor:pointer;display:inline-block;text-decoration:none;text-align:center}
.btn-save:hover{filter:brightness(.96)}
.kpi-bottom{margin-top:auto}
/* ===== Home redesign (design handoff) ===== */
.sect-h{font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.04em;margin:0 0 8px;
  display:flex;align-items:baseline;justify-content:space-between}
.sect-h a{font-size:12px;font-weight:700;color:var(--teal);text-decoration:none}
.dcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin-bottom:12px}
.dcard{display:flex;align-items:center;gap:13px;padding:15px 16px;background:var(--surface);
       border:1px solid var(--border);border-radius:14px;text-decoration:none;color:inherit}
.dcard:hover{border-color:var(--teal-line)}
.dcard.bad{border-color:#f0c2c2}.dcard.bad .dc-n{color:#b4232a}
.dcard.quiet .dc-n{color:var(--muted)}
.dc-n{font-size:29px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.dc-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.dc-t b{font-size:13px}.dc-t span{font-size:11px;color:var(--muted);line-height:1.5}
.dc-go{margin-left:auto;color:var(--muted);font-size:17px}
.dtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:12px}
/* KPIレポートの数字（.kr-tile）と**同じ組み**にする。同じ4つの数字が2画面で違う
   見た目だと、別のものを見ている気になる。 */
a.dtile{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:13px 15px;
       display:flex;flex-direction:column;gap:3px;min-width:0;text-decoration:none;color:inherit}
a.dtile:hover{border-color:var(--teal-line)}
.dt-k{font-size:11.5px;color:var(--muted);line-height:1.4}
.dt-v{font-size:26px;font-weight:800;line-height:1.2;font-variant-numeric:tabular-nums;
  color:var(--ink)}
.dt-v.small{font-size:17px;font-weight:700;color:var(--muted)}
.dt-u{font-size:11px;color:var(--muted);margin-left:3px}
.dt-d{font-size:11px;color:var(--muted)}
.dt-d b.up{color:var(--green,#0a7d34)}.dt-d b.dn{color:#b4232a}
.dt-d.quiet{font-size:10.5px}
.ai-read{margin-top:12px;padding:11px 13px;background:var(--teal-soft);border-radius:11px;
         display:flex;flex-direction:column;gap:4px}
.ai-read b{font-size:12px}.ai-read span{font-size:11.5px;line-height:1.65;color:var(--ink)}
.ai-read i{font-size:10.5px;font-style:normal;color:var(--muted)}
.ai-read.stale{background:var(--amber-bg)}
.ai-read.stale i{color:var(--amber-ink);font-weight:700}
.home-grid{display:grid;grid-template-columns:1fr;gap:16px}
/* モックの2列（本文＋承認待ちキュー）。狭い画面では1列に落とす — キューを下に送るより、
   横に並べられないなら縦に積む方が読める。 */
@media(min-width:1180px){.home-grid.two{grid-template-columns:minmax(0,1fr) 340px}}
/* 今週の配信状況（媒体×曜日）。**折り返さない** — 折ると週の形が読めなくなるので、
   狭いときは横スクロールさせる。 */
.wb-head{display:flex;align-items:baseline;gap:10px;font-size:13px;margin-bottom:10px}
.wb-grow{flex:1}
.wb-legend{display:flex;gap:8px;font-size:10.5px}
.wb-lg{padding:1px 6px;border-radius:5px}
.wb-lg.done{background:var(--green-bg,#e7f6ec);color:var(--green,#0a7d34)}
.wb-lg.sched{background:#efe9fb;color:#5b3fa8}
.wb-lg.todo{background:var(--amber-bg,#fdf3e0);color:var(--amber-ink,#8a5a00)}
.wb-lg.err{background:#fdecec;color:#b4232a}
/* 媒体の名前と月曜の枠の間を空ける。**78pxでは "instagram" が収まらず、月曜の札に
   ぶつかっていた**（本番を見て気づいた）。列を広げるだけでなく、名前の側に余白を持たせて
   長い名前が来ても枠に触れないようにする。 */
.wb-grid{display:grid;grid-template-columns:112px repeat(var(--cols),minmax(74px,1fr));
         gap:4px;overflow-x:auto;align-items:start}
.wb-h{font-size:11px;color:var(--muted);padding:2px 0 4px;text-align:center}
.wb-h.now{color:var(--ink);font-weight:700}
.wb-p{display:flex;align-items:center;gap:5px;font-size:11.5px;padding-top:5px;
      padding-right:16px;min-width:0}
.wb-p span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 札1枚ぶんの高さ。**どのマスも2枚ぶんの床を持つ** — 本数でマスの高さが変わると、
   週の形（どの媒体がどの日に出るか）が読めない。3枚目からは伸びる。 */
.wb-grid{--wb-slot:18px}
.wb-cell{display:flex;flex-direction:column;gap:3px;
         min-height:calc(var(--wb-slot,18px)*2 + 7px);
         border-top:1px solid var(--border);padding-top:4px}
.wb-c{font-size:10px;padding:2px 5px;border-radius:5px;white-space:nowrap;
      overflow:hidden;text-overflow:ellipsis}
.wb-c.done{background:var(--green-bg,#e7f6ec);color:var(--green,#0a7d34)}
.wb-c.sched{background:#efe9fb;color:#5b3fa8}
.wb-c.todo{background:var(--amber-bg,#fdf3e0);color:var(--amber-ink,#8a5a00)}
.wb-c.err{background:#fdecec;color:#b4232a}
.wb-foot{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap;margin-top:11px;
         font-size:11.5px;color:var(--muted)}
.wb-foot a{color:var(--teal);text-decoration:none}
.wb-foot a:last-child{margin-left:auto;font-weight:600}
/* 承認待ちキュー（右） */
.qp-head{display:flex;align-items:baseline;gap:8px;font-size:13px;margin-bottom:10px}
.qp-n{font-size:11px;color:var(--muted)}
.qc{border-top:1px solid var(--border);padding:11px 0}
.qc:first-of-type{border-top:0;padding-top:0}
.qc-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:5px}
.qc-grow{flex:1}.qc-when{font-size:10.5px;color:var(--muted)}
a.qc-t{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
       font-size:12.5px;font-weight:600;line-height:1.5;color:var(--ink);text-decoration:none}
a.qc-t:hover{color:var(--teal)}
.qc-why{display:flex;gap:5px;align-items:flex-start;margin-top:5px;font-size:11px;
        line-height:1.55;color:var(--muted)}
.qc-why svg{width:12px;height:12px;flex:0 0 auto;margin-top:2px;opacity:.8}
.qc-acts{display:flex;gap:7px;margin-top:9px}
.qc-acts form{display:inline}
.qc-more{display:block;margin-top:10px;font-size:11.5px;color:var(--teal);text-decoration:none}
.home-grid .col{display:flex;flex-direction:column;gap:16px;min-width:0}
/* 本文の下に置く二次カード。**枚数に追従させる** — おまかせ運用をサイドバーへ移したあと
   2列指定だけが残り、セットアップが半分の幅で、隣に406pxの空白ができていた。
   auto-fit なら 1枚＝全幅 / 2枚＝横並び で、増減しても取り残しが出ない。 */
.home-sec{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;min-width:0}
.qhero{padding:22px 22px 20px}
.hero-top{display:flex;align-items:center;gap:10px}
.hero-count{font-size:40px;font-weight:800;line-height:1.1;font-variant-numeric:tabular-nums;margin:12px 0 2px}
.hero-count small{font-size:17px;font-weight:700;margin-left:2px}
.hero-sub{font-size:12.5px;color:var(--muted);line-height:1.7;margin:4px 0 0}
.hero-rows{margin-top:16px;border-top:1px solid var(--border)}
.hrow{display:flex;align-items:center;gap:10px;padding:10px 2px;border-bottom:1px solid var(--border)}
.hrow:last-child{border-bottom:none}
.p-dot{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
/* 札が3つ増えて（出所・状態・審査）、狭い行では見出しが幅0まで潰れ、日付が画面外へ出た。
   `min-width:0` のままだと flex は見出しを最初に削るので、下限を持たせて**入らなければ
   メタ側を次の行へ折り返させる**（.hx-mid / .hx-meta の flex-wrap と対で効く）。 */
.hrow-t{flex:1 1 9em;min-width:9em;font-size:12.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* AIがこの投稿を出す理由。承認の判断材料なので**開く前**に見える。1行で切る。 */
/* 媒体間同期の印。他の札と同じ高さに収める（行の高さを変えない）。 */
/* コンテンツドラフト一覧の表（UIモック）。**横に長いので、表だけを横スクロール**させる
   — ページごと横に流れると、レールまで動いて操作を見失う。 */
.dt-wrap{overflow-x:auto}
.bempty-more{margin-top:10px;font-size:11.5px;color:var(--muted)}
.bempty-more a{color:var(--teal);text-decoration:none;font-weight:600}
/* 絞り込みの行と表を離す。**くっついていると、札が表の見出しの一部に見える。** */
.list-card{margin-top:18px}
.dtab{width:100%;border-collapse:collapse;font-size:12.5px;min-width:860px}
.dtab th{text-align:left;font-size:11px;font-weight:700;color:var(--muted);
  padding:0 10px 9px;border-bottom:1px solid var(--border);white-space:nowrap}
.dtab td{padding:11px 10px;border-bottom:1px solid var(--border);vertical-align:middle}
.dtab tr:last-child td{border-bottom:0}
.dtab tbody tr:hover{background:var(--gray-bg)}
/* 種別の札と題は**横に並べる**。題は残りを使って、長ければ切る。
   **並べるのは中の入れ物で。** `<td>` 自体を flex にすると表のセルでなくなり、
   行の区切り線がその列だけ途中で切れる（本番を描いて気づいた）。 */
.dt-c{max-width:340px}
.dt-cw{display:flex;align-items:center}
.dt-cw .kchip{flex:none}
.dt-t{flex:1;min-width:0}
.dt-c a{color:var(--ink);text-decoration:none;font-weight:600;display:block;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dt-c a:hover{color:var(--teal)}
.dt-why{display:block;margin-top:2px;font-size:10.5px;color:var(--muted);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dt-why b{color:var(--gray-ink);margin-right:6px}
/* 日付と時刻は**同じ組み**で。片方だけ濃くすると、1つの値が2つに割れて見える。 */
.dt-w{white-space:nowrap;color:var(--ink);font-size:11.5px;font-variant-numeric:tabular-nums}
.dt-w b{font-weight:inherit;color:inherit}
.dt-un{color:var(--muted);font-weight:400}
/* 媒体は印と名前の組みなので、列の中で中央に置いたほうが縦に揃って読める。 */
.dtab td:nth-child(2),.dtab th:nth-child(2){text-align:center}
.dtab td:nth-child(2) .p-dot{margin:0 auto 3px}
/* 媒体は**印が主、名前は添え**。名前が本文と同じ大きさだと、列の中で名前が主役になる。 */
.dtab td:nth-child(2){font-size:10px;color:var(--muted);line-height:1.4}
.dt-a{white-space:nowrap;text-align:right}
.dt-a .rv-btn{width:auto;padding:6px 11px;margin-left:6px}
.dt-note{margin:12px 2px 0;font-size:11px;line-height:1.7;color:var(--muted)}
/* 審査スコア: 数字＋横棒。**最も低い観点**を出す（平均だと規約0.4が隠れる）。 */
.sb{display:flex;align-items:center;gap:7px}
.sb-v{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.sb-v.ok{color:var(--green)}.sb-v.warn{color:var(--amber-ink)}.sb-v.bad{color:var(--rose)}
.sb-t{position:relative;width:56px;height:5px;border-radius:3px;background:var(--gray-bg);
  overflow:hidden;flex:0 0 auto}
.sb-t i{position:absolute;left:0;top:0;bottom:0;border-radius:3px}
.sb-t i.ok{background:var(--green)}.sb-t i.warn{background:var(--amber)}
.sb-t i.bad{background:var(--rose)}
.sb-none{font-size:11px;color:var(--muted)}
.sync-chip{display:inline-flex;align-items:center;padding:1px 6px;border-radius:6px;font-size:10.5px;background:var(--teal-soft);color:var(--teal);font-weight:700}
.hx-why{display:flex;align-items:center;gap:5px;width:100%;margin-top:3px;font-size:11px;line-height:1.5;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hx-why svg{width:12px;height:12px;flex:0 0 auto;opacity:.8}
/* 札の日時。一覧と同じ組み（日付と時刻を1つの値として読ませる）。 */
.hrow-d{font-size:11px;color:var(--ink);flex-shrink:0;font-variant-numeric:tabular-nums;
  white-space:nowrap}
.hrow-d b{font-weight:inherit;color:inherit}
.hxr{border-bottom:1px solid var(--border)}
.hxr:last-child{border-bottom:none}
.hxhead{display:flex;align-items:center;gap:10px;padding:11px 2px;text-decoration:none;color:inherit;cursor:pointer}
/* 行のときの中身。板モード（.bcards 内）では下で縦積みに上書きする。
   基礎が無いと .hrow-t の flex:1 が効かず、日付が左に寄る。 */
.hx-mid{flex:1;min-width:0;display:flex;align-items:center;gap:9px;flex-wrap:wrap;row-gap:4px}
.hx-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;row-gap:4px;max-width:100%}
.hxhead:hover .hrow-t{color:var(--teal)}
.hxchev{color:var(--muted);flex-shrink:0;transition:transform .15s ease}
.hxr.open .hxchev{transform:rotate(180deg)}
.hxbody{padding:2px 2px 18px}
/* まとめて承認の行。**下にも余白を持たせる** — 上16px・下0pxで、すぐ下のチャネル
   絞り込みと隙間なく重なって見えていた（実測 gap 0px）。この規則はこの行でしか
   使っていないので、直接変えてよい。 */
.hero-actions{display:flex;align-items:center;gap:14px;margin:16px 0 14px;flex-wrap:wrap}
.btn-line{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;background:#06c755;
  color:#fff;font:inherit;font-size:14px;font-weight:700;border-radius:9px;padding:13px 26px;cursor:pointer;
  box-shadow:0 2px 8px rgba(6,199,85,.25);text-decoration:none;width:100%}
.hero-quiet{font-size:12px;font-weight:600;color:var(--muted);text-decoration:none}
.btn-rev{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;background:var(--teal);
  color:#fff;font:inherit;font-size:14px;font-weight:700;border-radius:9px;padding:13px 22px;cursor:pointer;
  box-shadow:0 2px 8px rgba(14,125,143,.22);text-decoration:none}
.btn-rev:hover{filter:brightness(.94)}
.lib-thumb{display:block;width:100%;height:90px;object-fit:cover;background:var(--bg)}
.hero-assure{display:flex;align-items:center;gap:6px;margin-top:16px;font-size:11.5px;color:var(--muted)}
.clear-wrap{display:flex;align-items:center;gap:16px;margin-top:14px}
.clear-ring{width:52px;height:52px;border-radius:50%;background:var(--green-bg);border:1.5px solid var(--green-line);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.clear-t{font-size:17px;font-weight:800}
.clear-s{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.6}
.glance{padding:16px 18px 14px}
.g-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.g-num{text-align:center;padding:8px 4px 10px;border-radius:9px;background:var(--surface);border:1px solid var(--border)}
.g-num .v{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums}
.g-num .k{font-size:10.5px;color:var(--muted);font-weight:600;margin-top:2px}
.g-kpis{margin-top:14px;display:flex;flex-direction:column;gap:11px}
.g-kpi .l{display:flex;justify-content:space-between;align-items:baseline;font-size:11.5px;font-weight:600;color:var(--gray-ink)}
.g-kpi .l b{color:var(--ink);font-variant-numeric:tabular-nums;font-size:12px}
.g-kpi .l b .ok{color:var(--green)}
.g-track{height:5px;border-radius:99px;background:var(--gray-bg);margin-top:5px;overflow:hidden}
.g-fill{height:100%;border-radius:99px;background:var(--teal)}
.g-fill.full{background:var(--green)}
.g-make-dot{width:7px;height:7px;border-radius:50%;background:var(--teal);position:relative;flex-shrink:0}
.g-make-dot::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--teal);opacity:.4;animation:wpPulse 1.4s ease-out infinite}
/* おまかせ運用 (home E): the one status card — rows + link row + folded 方針 editor */
.omk{padding:15px 17px 13px}
.omk-row{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.7;color:var(--ink);
  padding:8px 0;border-bottom:1px solid var(--border)}
.omk-row .g-make-dot{margin-top:7px}
.omk-dot{width:8px;height:8px;border-radius:50%;background:var(--gray-ink);opacity:.45;flex-shrink:0;margin-top:7px}
.omk-dot.bad{background:var(--rose);opacity:1}
.omk-dot.warn{background:var(--amber);opacity:1}.omk-dot.ok{background:var(--green);opacity:1}
.omk-btnrow{padding:10px 0 12px;border-bottom:1px solid var(--border)}
.omk-btnrow form{margin:0}
.omk-links{gap:6px 16px;flex-wrap:wrap}
.omk-links a{color:var(--teal);font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap}
.omk-links a:hover{text-decoration:underline;text-underline-offset:3px}
.omk-pol summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;
  padding:11px 0 3px;font-size:12.5px;font-weight:700;color:var(--ink)}
.omk-pol summary::-webkit-details-marker{display:none}
.omk-pv{font-weight:600;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.omk-pv.unset{color:var(--amber-ink)}
.omk-chev{margin-left:auto;color:var(--muted);font-size:11px;transition:transform .15s}
.omk-pol[open] .omk-chev{transform:rotate(180deg)}
.omk-pol form{margin:8px 0 4px}
.create-card{padding:16px 18px}
.cc-status{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--ink);line-height:1.5}
.cc-next{font-size:11.5px;color:var(--muted);margin:5px 0 12px;line-height:1.5}
.cc-btn{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:var(--teal);color:#fff;border:none;font:inherit;font-size:13px;font-weight:700;border-radius:10px;padding:11px;cursor:pointer}
.cc-btn:hover{filter:brightness(.95)}
.cc-btn:disabled{background:var(--gray-bg);color:var(--muted);cursor:default}
.create-card form{margin:0}
/* オープンキャンパス キャンペーン cockpit (/app/campaign) */
.camp-hd{display:flex;align-items:flex-start;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.camp-hd .oc-ic{width:46px;height:46px;border-radius:13px;background:var(--teal-soft);border:1px solid var(--teal-line);color:var(--teal-deep);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.camp-hd .ht{min-width:0;flex:1}
.camp-hd .kick{font-size:11px;font-weight:800;letter-spacing:.05em;color:var(--teal-deep)}
.camp-hd h2{font-size:21px;font-weight:800;margin:3px 0 0;line-height:1.3;color:var(--ink)}
.camp-hd .date{font-size:13px;color:var(--muted);margin-top:5px;font-variant-numeric:tabular-nums}
.camp .countdown{display:flex;flex-direction:column;align-items:center;background:var(--teal);color:#fff;border-radius:14px;padding:10px 18px;flex-shrink:0}
.camp .countdown .n{font-size:28px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.camp .countdown .l{font-size:10.5px;font-weight:700;margin-top:3px;opacity:.9}
.camp .strip{display:grid;grid-template-columns:repeat(3,1fr) auto;gap:12px;align-items:stretch;margin-bottom:20px}
.camp .stat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:3px}
.camp .stat .v{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1;color:var(--ink)}
.camp .stat .k{font-size:11.5px;color:var(--muted);font-weight:600}
.camp .stat.await .v{color:var(--amber-ink)}
.camp .stat.sched .v{color:var(--teal-deep)}
.camp .stat.pub .v{color:var(--green)}
.camp .strip-cta{display:flex;flex-direction:column;gap:8px;justify-content:center}
.camp .cbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;font:inherit;font-size:12px;font-weight:700;border-radius:9px;padding:0 13px;min-height:38px;cursor:pointer;white-space:nowrap;text-decoration:none}
.camp .cbtn.primary{background:var(--teal);color:#fff}
.camp .cbtn.primary:hover{background:var(--teal-deep)}
.camp .cbtn.ghost{background:var(--card);color:var(--teal-deep);border:1px solid var(--teal-line)}
.camp .cbtn.ghost:hover{background:var(--teal-soft)}
.camp .strip-cta form{margin:0;display:flex}.camp .strip-cta form .cbtn{flex:1}
.camp .timeline{display:flex;flex-direction:column;gap:12px}
.camp .phase{background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden}
.camp .phase-hd{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--border)}
.camp .phase-no{width:30px;height:30px;border-radius:9px;background:var(--teal-soft);color:var(--teal-deep);border:1px solid var(--teal-line);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:800;flex-shrink:0}
.camp .phase-tt{min-width:0;flex:1}
.camp .phase-tt .nm{font-size:14.5px;font-weight:800;color:var(--ink)}
.camp .phase-tt .win{font-size:11.5px;color:var(--muted);margin-top:2px;font-variant-numeric:tabular-nums}
.camp .phase-ct{font-size:11.5px;color:var(--muted);font-weight:700;flex-shrink:0}
.camp .draft-list{display:flex;flex-direction:column}
.camp .draft{display:grid;grid-template-columns:26px 84px 1fr auto;gap:12px;align-items:center;padding:12px 18px;border-bottom:1px solid var(--border)}
.camp .draft:last-child{border-bottom:none}
.camp .pdot{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.camp .draft-chan .lbl{font-size:12px;font-weight:700;white-space:nowrap;color:var(--ink)}
.camp .draft-mid{min-width:0;display:flex;flex-direction:column;gap:4px}
.camp .draft-theme{font-size:13.5px;font-weight:600;line-height:1.45;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.camp .draft-meta{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.camp .aud{display:inline-flex;align-items:center;font-size:10.5px;font-weight:700;color:var(--muted);background:var(--gray-bg);border:1px solid var(--border);border-radius:6px;padding:1px 7px;white-space:nowrap}
.camp .phase-empty{padding:13px 18px;font-size:12px;color:var(--muted)}
.camp .st{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;border-radius:99px;padding:5px 11px;white-space:nowrap;justify-self:end}
.camp .st svg{width:13px;height:13px}
.camp .st.plan{color:var(--muted);background:var(--gray-bg);border:1px solid var(--border)}
.camp .st.await{color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line);padding-right:5px}
.camp .st.sched{color:var(--teal-deep);background:var(--teal-soft);border:1px solid var(--teal-line)}
.camp .st.pub{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.camp .st-confirm{display:inline-flex;align-items:center;gap:3px;background:var(--amber-ink);color:#fff;border:none;font:inherit;font-size:11px;font-weight:800;border-radius:99px;padding:3px 9px 3px 10px;cursor:pointer;margin-left:2px;text-decoration:none}
.camp .st-confirm:hover{filter:brightness(1.08)}
.camp .camp-foot{margin-top:18px;font-size:11.5px;color:var(--muted);line-height:1.6;display:flex;align-items:center;gap:7px}
.camp .empty{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:40px 32px;text-align:center;max-width:520px;margin:8px auto}
.camp .empty .ring{width:56px;height:56px;border-radius:50%;background:var(--teal-soft);border:1px solid var(--teal-line);color:var(--teal-deep);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.camp .empty .et{font-size:16px;font-weight:800;color:var(--ink)}
.camp .empty .es{font-size:13px;color:var(--muted);line-height:1.75;margin:8px 0 18px}
.camp .empty .cbtn{min-height:44px;padding:0 18px;font-size:13px}
.camp-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px 18px;display:flex;align-items:center;gap:15px;text-decoration:none}
.camp-card .cc-cd{display:flex;flex-direction:column;align-items:center;background:var(--teal);color:#fff;border-radius:12px;padding:9px 14px;flex-shrink:0}
.camp-card .cc-cd .n{font-size:22px;font-weight:800;line-height:1;font-variant-numeric:tabular-nums}
.camp-card .cc-cd .l{font-size:9.5px;font-weight:700;margin-top:3px;opacity:.9}
.camp-card .cc-mid{flex:1;min-width:0}
.camp-card .cc-kick{font-size:10.5px;font-weight:800;letter-spacing:.04em;color:var(--teal-deep)}
.camp-card .cc-t{font-size:14.5px;font-weight:800;margin-top:2px;color:var(--ink)}
.camp-card .cc-s{font-size:12px;color:var(--muted);margin-top:3px}
.camp-card .cc-s b{color:var(--amber-ink);font-weight:800}
.camp-card .cc-go{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:var(--teal-deep);flex-shrink:0;white-space:nowrap}
@media(max-width:560px){.camp .strip{grid-template-columns:repeat(3,1fr)}.camp .strip-cta{grid-column:1/4;flex-direction:row}.camp .draft{grid-template-columns:26px 1fr;gap:9px;row-gap:6px;align-items:start}.camp .pdot{grid-column:1;grid-row:1}.camp .draft-chan{grid-column:2;grid-row:1;align-self:center}.camp .draft-mid{grid-column:1/3;grid-row:2}.camp .draft .st{grid-column:1/3;grid-row:3;justify-self:start}.camp-card{flex-wrap:wrap}}
.ocdlg-scrim{position:fixed;inset:0;background:rgba(10,16,22,.5);display:flex;align-items:center;justify-content:center;padding:24px;z-index:60}
.ocdlg-scrim[hidden]{display:none}
.ocdlg{width:100%;max-width:400px;background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden}
.ocdlg-hd{padding:18px 20px 4px}.ocdlg-hd .t{font-size:16px;font-weight:800;color:var(--ink)}.ocdlg-hd .s{font-size:12px;color:var(--muted);margin-top:4px;line-height:1.6}
.ocdlg-bd{padding:14px 20px 4px;display:flex;flex-direction:column;gap:13px}
.ocfld{display:flex;flex-direction:column;gap:6px}.ocfld label{font-size:11.5px;font-weight:700;color:var(--ink)}
.ocfld input,.ocfld select{font:inherit;font-size:13px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 12px;outline:none;min-height:42px}
.ocfld input:focus,.ocfld select:focus{border-color:var(--teal)}
.ocfld .hint{font-size:10.5px;color:var(--muted)}
.ocdlg-ft{display:flex;gap:9px;padding:16px 20px 18px}.ocdlg-ft .sp{flex:1}
.camp .cbtn.text{background:none;color:var(--muted);border:none}.camp .cbtn.text:hover{color:var(--ink)}
/* KPI目標設定 再設計 — 3 tiers, 従来→現在→目標 story, honest sliders */
.kpi{--gray-soft:var(--gray-bg);--gray-line:var(--border)}
.kpi-flash{display:inline-flex;align-items:center;gap:6px;background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);font-size:12.5px;font-weight:700;border-radius:10px;padding:9px 13px;margin-bottom:14px}
.kpi-hd h2{font-size:21px;font-weight:800;margin:0;color:var(--ink)}
.kpi-hd p{font-size:13px;color:var(--muted);margin:7px 0 0;line-height:1.7;max-width:640px}
.kpi .assure{display:flex;align-items:flex-start;gap:11px;background:var(--teal-soft);border:1px solid var(--teal-line);border-radius:13px;padding:13px 16px;margin:18px 0}
.kpi .assure svg{color:var(--teal-deep);flex-shrink:0;margin-top:1px}
.kpi .assure .t{font-size:12.5px;line-height:1.65;color:var(--ink)}
.kpi .preset{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.kpi .preset .lbl{font-size:12.5px;font-weight:700;color:var(--muted)}
.kpi .seg{display:inline-flex;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:3px;gap:2px}
.kpi .seg button{border:none;background:none;font:inherit;font-size:12.5px;font-weight:700;color:var(--muted);padding:9px 18px;border-radius:8px;cursor:pointer;white-space:nowrap}
.kpi .seg button.on{background:var(--teal);color:#fff}
.kpi .preset .ch{font-size:11.5px;color:var(--muted)}
.kpi .group{margin-bottom:26px}
.kpi .group-hd{display:flex;align-items:baseline;gap:10px;margin-bottom:11px;flex-wrap:wrap}
.kpi .group-hd .gt{font-size:14.5px;font-weight:800;color:var(--ink)}
.kpi .group-hd .gs{font-size:11.5px;color:var(--muted)}
.kpi .kcard{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px 18px;margin-bottom:11px}
.kpi .kcard.locked{background:var(--surface)}
.kpi .kc-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.kpi .kc-name{font-size:14.5px;font-weight:700;flex:1;min-width:0;color:var(--ink)}
.kpi .tier{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;border-radius:99px;padding:3px 10px;white-space:nowrap;flex-shrink:0}
.kpi .tier.measured{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.kpi .tier.pending{color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line)}
.kpi .tier.locked{color:var(--muted);background:var(--gray-soft);border:1px solid var(--gray-line)}
.kpi .story{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:13px 15px}
.kpi .story .cell{min-width:0}
.kpi .story .ck{font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--muted);margin-bottom:4px}
.kpi .story .cv{font-size:15px;font-weight:800;line-height:1.25;color:var(--ink)}
.kpi .story .cv small{font-size:11px;font-weight:600;color:var(--muted);display:block;margin-top:2px}
.kpi .story .cv.measuring{color:var(--amber-ink);font-size:13px}
.kpi .story .cv.target{color:var(--teal-deep)}
.kpi .story .arr{color:var(--muted);display:flex}
.kpi .prog{margin-top:12px}
.kpi .prog-bar{height:8px;border-radius:5px;background:var(--gray-soft);overflow:hidden}
.kpi .prog-bar .fill{height:100%;border-radius:5px;background:var(--green)}
.kpi .prog-row{display:flex;justify-content:space-between;margin-top:6px;font-size:11px;color:var(--muted)}
.kpi .prog-row b{color:var(--green);font-weight:700}
.kpi .sld{margin-top:14px}
.kpi .sld-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:9px}
.kpi .sld-head .sl{font-size:11.5px;font-weight:700;color:var(--muted)}
.kpi .sld-head .sv{font-size:14px;font-weight:800;color:var(--teal-deep)}
.kpi .track{position:relative;height:26px;display:flex;align-items:center}
.kpi .track .rail{position:absolute;left:0;right:0;height:6px;border-radius:4px;background:var(--gray-soft)}
.kpi .track .baseband{position:absolute;height:6px;border-radius:4px;background:var(--amber-line)}
.kpi .track .baseband.beyond{border-radius:4px 0 0 4px}
.kpi .track .band{position:absolute;height:6px;border-radius:4px;background:var(--teal-line)}
.kpi .sld-legend{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}
.kpi .lg-base{display:inline-flex;align-items:center;gap:4px;color:var(--amber-ink);font-weight:700}
.kpi .lg-base::before{content:'';width:9px;height:9px;border-radius:2px;background:var(--amber-line);display:inline-block}
.kpi .track input[type=range]{position:relative;width:100%;margin:0;background:none;-webkit-appearance:none;appearance:none;height:26px;cursor:pointer}
.kpi .track input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:var(--teal);border:3px solid var(--card);box-shadow:0 1px 4px rgba(0,0,0,.3)}
.kpi .track input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--teal);border:3px solid var(--card);box-shadow:0 1px 4px rgba(0,0,0,.3)}
.kpi .sld-foot{display:flex;justify-content:space-between;margin-top:7px;font-size:10.5px;color:var(--muted)}
.kpi .sld-band-tag{display:inline-flex;align-items:center;gap:4px;color:var(--teal-deep);font-weight:700}
.kpi .nudge{display:none;align-items:flex-start;gap:7px;margin-top:10px;background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:9px;padding:9px 12px;font-size:11.5px;line-height:1.55;color:var(--amber-ink)}
.kpi .nudge.show{display:flex}.kpi .nudge svg{flex-shrink:0;margin-top:1px}
.kpi .chan-note{margin-top:12px;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:11px 13px}
.kpi .chan-row{display:flex;align-items:center;gap:8px;font-size:12px;padding:3px 0}
.kpi .chan-row .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.kpi .chan-row .dot.live{background:var(--green)}.kpi .chan-row .dot.off{background:var(--muted);opacity:.5}
.kpi .chan-row .cn{font-weight:700;color:var(--ink)}.kpi .chan-row .cs{color:var(--muted);font-size:11px}
.kpi .chan-row .sp{flex:1}
.kpi .phase-pill{font-size:10px;font-weight:800;border-radius:99px;padding:2px 8px;white-space:nowrap}
.kpi .phase-pill.now{background:var(--green-bg);color:var(--green);border:1px solid var(--green-line)}
.kpi .phase-pill.later{background:var(--gray-soft);color:var(--muted);border:1px solid var(--gray-line)}
.kpi .lock-body{display:flex;align-items:flex-start;gap:11px;margin-top:4px}
.kpi .lock-body .lic{width:30px;height:30px;border-radius:9px;background:var(--gray-soft);color:var(--muted);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.kpi .lock-body .lt{font-size:12px;line-height:1.65;color:var(--muted)}.kpi .lock-body .lt b{color:var(--ink);font-weight:700}
.kpi .est-val{font-size:22px;font-weight:800;color:var(--teal-deep)}.kpi .est-val small{font-size:12px;color:var(--muted);font-weight:600;margin-left:6px}
.kpi .savebar{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:13px 16px;margin-top:8px;position:sticky;bottom:14px}
.kpi .savebar .st{font-size:12px;color:var(--muted);flex:1}.kpi .savebar .st b{color:var(--ink);font-weight:700}
.kpi .kbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;font:inherit;font-size:12.5px;font-weight:700;border-radius:9px;padding:0 18px;min-height:42px;cursor:pointer;white-space:nowrap}
.ana-card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px 18px;margin-top:18px}
.ana-hd{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:12px}
.ana-t{font-size:15px;font-weight:800}.ana-s{font-size:12px;color:var(--muted)}
.ana-wait{font-size:13px;color:var(--muted);padding:8px 0}
.ana-report{font-size:13.5px}
.ana-head{font-size:15px;font-weight:800;color:var(--teal-deep);line-height:1.5;margin-bottom:10px}
.ana-sec{margin:8px 0}.ana-sec>b{font-size:12px;color:var(--muted)}
.ana-sec ul{margin:4px 0 0;padding-left:20px}.ana-sec li{margin:3px 0}
.ana-cav{margin-top:10px;font-size:11.5px;color:var(--muted);border-top:1px solid var(--border);padding-top:8px}
.kpi .kbtn.primary{background:var(--teal);color:#fff}.kpi .kbtn.primary:hover{background:var(--teal-deep)}
.kpi .kpi-foot{margin-top:16px;font-size:11.5px;color:var(--muted)}
.kpi .conv-cta{display:inline-flex;align-items:center;gap:4px;margin-left:6px;font-weight:700;color:var(--teal-deep);text-decoration:none;white-space:nowrap}
.kpi .conv-cta:hover{text-decoration:underline;text-underline-offset:2px}
.kpi .edit-mini{background:none;border:none;font:inherit;font-size:10px;font-weight:700;color:var(--teal-deep);cursor:pointer;margin-left:6px;padding:1px 6px;border-radius:5px}
.kpi .edit-mini:hover{background:var(--teal-soft)}
.kpi .cell-input{width:100%;font:inherit;font-size:14px;font-weight:800;color:var(--ink);background:var(--card);border:1px solid var(--teal);border-radius:8px;padding:6px 9px;outline:none}
.kpi .cell-input:focus{box-shadow:0 0 0 3px var(--teal-soft)}
.kpi .self-chip{display:inline-flex;align-items:center;gap:3px;font-size:9.5px;font-weight:800;color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:99px;padding:1px 7px;margin-left:7px;vertical-align:middle}
.kpi .cv.reported{color:var(--amber-ink);font-size:14px}
.kpi .report-link{display:inline-block;margin-top:6px;font-size:10.5px;font-weight:700;color:var(--teal-deep);cursor:pointer}
.kpi .report-link:hover{text-decoration:underline;text-underline-offset:2px}
@media(max-width:640px){.kpi .story{grid-template-columns:1fr;gap:12px}.kpi .story .arr{transform:rotate(90deg)}}
/* 来場者→出願 転換率 (/app/conversion) */
.conv{--gray-soft:var(--gray-bg);--gray-line:var(--border)}
.conv-hd h2{font-size:21px;font-weight:800;margin:0;color:var(--ink)}
.conv-hd p{font-size:13px;color:var(--muted);margin:7px 0 0;line-height:1.7;max-width:620px}
.conv .assure{display:flex;align-items:flex-start;gap:11px;background:var(--teal-soft);border:1px solid var(--teal-line);border-radius:13px;padding:13px 16px;margin:16px 0}
.conv .assure svg{color:var(--teal-deep);flex-shrink:0;margin-top:1px}.conv .assure .t{font-size:12.5px;line-height:1.65;color:var(--ink)}
.conv .cn-flash{display:inline-flex;align-items:center;gap:6px;background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);font-size:12.5px;font-weight:700;border-radius:10px;padding:9px 13px;margin-bottom:14px}
.conv .tier{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:800;border-radius:99px;padding:3px 10px;white-space:nowrap;flex-shrink:0}
.conv .tier.measured{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.conv .tier.pending{color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line)}
.conv .tier.locked{color:var(--muted);background:var(--gray-soft);border:1px solid var(--gray-line)}
.conv .step{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px 18px;margin-bottom:12px}
.conv .step-hd{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.conv .step-no{width:28px;height:28px;border-radius:8px;background:var(--teal-soft);color:var(--teal-deep);border:1px solid var(--teal-line);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex-shrink:0}
.conv .step-tt{flex:1;min-width:0}.conv .step-tt .t{font-size:14.5px;font-weight:800;color:var(--ink)}.conv .step-tt .s{font-size:11.5px;color:var(--muted);margin-top:2px}
.conv .chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;border-radius:99px;padding:4px 11px;white-space:nowrap}
.conv .chip.todo{color:var(--muted);background:var(--gray-soft);border:1px solid var(--gray-line)}
.conv .chip.wait{color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line)}
.conv .chip.done{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.conv .opts{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:12px}
.conv .opt{border:1px solid var(--border);border-radius:13px;padding:14px;display:flex;flex-direction:column;gap:9px;background:var(--surface)}
.conv .opt.primary{border-color:var(--teal-line);background:var(--teal-soft)}.conv .opt.future{opacity:.6}
.conv .opt-top{display:flex;align-items:center;gap:9px}
.conv .opt-ic{width:34px;height:34px;border-radius:9px;background:var(--card);border:1px solid var(--border);color:var(--teal-deep);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.conv .opt-nm{font-size:13px;font-weight:700;flex:1;color:var(--ink)}
.conv .opt-badge{font-size:9.5px;font-weight:800;border-radius:99px;padding:2px 8px;white-space:nowrap}
.conv .opt-badge.rec{background:var(--teal);color:#fff}.conv .opt-badge.soon{background:var(--gray-soft);color:var(--muted);border:1px solid var(--gray-line)}
.conv .opt-desc{font-size:11.5px;line-height:1.6;color:var(--muted)}
.conv .done-row{display:flex;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px 14px}
.conv .done-row .ic{width:32px;height:32px;border-radius:9px;background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.conv .done-row .tx{flex:1;min-width:0}.conv .done-row .tx .a{font-size:13px;font-weight:700;color:var(--ink)}.conv .done-row .tx .b{font-size:11.5px;color:var(--muted);margin-top:2px}
.conv .match-note{display:flex;align-items:flex-start;gap:8px;background:var(--green-bg);border:1px solid var(--green-line);border-radius:10px;padding:10px 12px;font-size:11.5px;line-height:1.55;color:var(--green);margin-bottom:11px}
.conv .match-note.warn{background:var(--amber-bg);border-color:var(--amber-line);color:var(--amber-ink)}
.conv .match-note b{font-weight:700}.conv .match-note svg{flex-shrink:0;margin-top:1px}
.conv .funnel{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px;margin-bottom:12px}
.conv .funnel-hd{display:flex;align-items:baseline;gap:10px;margin-bottom:16px;flex-wrap:wrap}.conv .funnel-hd .t{font-size:14.5px;font-weight:800;color:var(--ink)}.conv .funnel-hd .s{font-size:11.5px;color:var(--muted)}
.conv .funnel-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:stretch}
.conv .stage{text-align:center;padding:6px 4px}.conv .stage .sk{font-size:11px;font-weight:700;color:var(--muted);margin-bottom:7px}
.conv .stage .bar{height:76px;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid var(--border)}
.conv .stage .bar.s1{background:var(--teal-soft);border-color:var(--teal-line)}
.conv .stage .bar.s2{background:var(--teal-soft);border-color:var(--teal-line)}
.conv .stage .bar.s3{background:var(--green-bg);border-color:var(--green-line)}
.conv .stage .bar.is-empty{background:var(--surface);border-style:dashed}
.conv .stage .num{font-size:24px;font-weight:800;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.conv .stage .num.measuring{font-size:12.5px;color:var(--amber-ink);font-weight:700;display:inline-flex;align-items:center;gap:4px}
.conv .stage .unit{font-size:10.5px;color:var(--muted)}
.conv .rate{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 6px;min-width:64px}
.conv .rate .rv{font-size:15px;font-weight:800;color:var(--teal-deep);font-variant-numeric:tabular-nums}.conv .rate .rv.head{color:var(--green)}.conv .rate .rv.dim{color:var(--muted)}
.conv .rate .rl{font-size:9.5px;color:var(--muted);margin-top:2px;text-align:center}.conv .rate .conn{width:100%;height:2px;background:var(--border);margin:6px 0}
.conv .kpi-card{border-radius:16px;padding:18px;border:1px solid var(--border)}.conv .kpi-card.locked{background:var(--surface)}.conv .kpi-card.pending,.conv .kpi-card.measured{background:var(--card)}
.conv .kc-top{display:flex;align-items:center;gap:10px;margin-bottom:14px}.conv .kc-name{font-size:14.5px;font-weight:700;flex:1;color:var(--ink)}
.conv .kc-locked-body{display:flex;align-items:flex-start;gap:11px}
.conv .kc-locked-body .ic{width:34px;height:34px;border-radius:10px;background:var(--gray-soft);color:var(--muted);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.conv .kc-locked-body.amber .ic{background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber-ink)}
.conv .kc-locked-body .tx{font-size:12.5px;line-height:1.65;color:var(--muted)}.conv .kc-locked-body .tx b{color:var(--ink);font-weight:700}
.conv .kc-measured{display:flex;align-items:flex-end;gap:16px}.conv .kc-big{font-size:44px;font-weight:800;color:var(--green);line-height:1;font-variant-numeric:tabular-nums}
.conv .kc-frac{font-size:13px;color:var(--muted);margin-bottom:6px}.conv .kc-frac b{color:var(--ink);font-weight:700}
.conv .kc-sub{font-size:11.5px;color:var(--muted);margin-top:10px;line-height:1.6}
.conv .sect-label{font-size:11px;font-weight:800;letter-spacing:.04em;color:var(--muted);margin:18px 0 8px}
.conv .cn-form{margin-top:11px}
.conv .cn-ta{width:100%;font:inherit;font-size:13px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:10px 12px;outline:none;resize:vertical;box-sizing:border-box}
.conv .cn-ta:focus{border-color:var(--teal)}
.conv .cn-form-foot{display:flex;align-items:center;gap:12px;margin-top:8px}.conv .cn-hint{font-size:11px;color:var(--muted);flex:1}
.conv .cn-more{margin-top:10px}.conv .cn-more summary{font-size:12px;font-weight:700;color:var(--teal-deep);cursor:pointer}
.conv .kbtn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;font:inherit;font-size:12.5px;font-weight:700;border-radius:9px;padding:0 16px;min-height:40px;cursor:pointer;white-space:nowrap;background:var(--teal);color:#fff}
.conv .kbtn:hover{background:var(--teal-deep)}
.conv .cn-foot{margin-top:16px}.conv .cn-foot .back{font-size:12.5px;font-weight:700;color:var(--teal-deep);text-decoration:none}
/* reception QR reveal + card */
.conv .cn-qr-reveal{margin-top:10px}.conv .cn-qr-reveal summary,.conv .cn-qr-btn{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#fff;background:var(--teal);border-radius:9px;padding:9px 14px}
.conv .cn-qr-reveal summary::-webkit-details-marker{display:none}.conv .cn-qr-btn:hover{background:var(--teal-deep)}
.conv .cn-qr-card{margin-top:12px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;text-align:center}
.conv .cn-qr-svg{width:188px;height:188px;margin:0 auto 12px;padding:10px;background:#fff;border:1px solid var(--border);border-radius:10px}
.conv .cn-qr-svg svg{width:100%;height:100%;display:block}
.conv .cn-qr-cap{font-size:12.5px;font-weight:700;color:var(--ink)}.conv .cn-qr-sub{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.55}
/* CSV import row */
.conv .cn-or{font-size:11px;color:var(--muted);margin:9px 0 7px;font-weight:600}
.conv .cn-csvrow{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:4px}
.conv .cn-file{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--teal-deep);background:var(--card);border:1px dashed var(--teal-line);border-radius:9px;padding:8px 13px;cursor:pointer}
.conv .cn-file input{display:none}
.conv .cn-colmap{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;color:var(--muted);font-weight:600}
.conv .cn-sel{font:inherit;font-size:12.5px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:7px 10px}
.conv .cn-follow{display:flex;flex-direction:column;gap:10px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.conv .cn-date{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted)}
.conv .cn-consent{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:12.5px;line-height:1.6}
.conv .cn-consent input{margin-top:3px;width:16px;height:16px;flex:0 0 auto;accent-color:var(--teal,#0e7d8f)}
.conv .cn-consent>span{display:flex;flex-direction:column;gap:3px}
.conv .cn-consent>span>span{color:var(--muted);font-size:11.5px}
@media(max-width:640px){.conv .opts{grid-template-columns:1fr}.conv .funnel-row{grid-template-columns:1fr;gap:8px}.conv .rate{flex-direction:row;gap:8px;min-width:0}.conv .rate .conn{display:none}}
/* public open-campus check-in page (/checkin/<token>) — single-purpose reception screen,
   so center the card in the viewport rather than letting it float at the top. */
.ci-wrap{max-width:420px;margin:0 auto;padding:24px 18px;min-height:calc(100vh - 57px);
  min-height:calc(100dvh - 57px);display:flex;flex-direction:column;justify-content:center}
.ci-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:28px 24px;text-align:center;box-shadow:0 10px 34px rgba(20,32,45,.08)}
.ci-evt{font-size:11px;font-weight:800;color:var(--teal-deep);letter-spacing:.04em;margin-bottom:8px}
.ci-h{font-size:19px;font-weight:800;color:var(--ink);text-wrap:balance;line-height:1.45}
.ci-p{font-size:13px;color:var(--muted);line-height:1.7;margin:9px 0 0;text-wrap:balance}
.ci-ok{width:54px;height:54px;border-radius:50%;background:var(--green-bg);color:var(--green);border:1px solid var(--green-line);font-size:26px;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.ci-bad{width:54px;height:54px;border-radius:50%;background:var(--amber-bg);color:var(--amber-ink);border:1px solid var(--amber-line);font-size:28px;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}
.ci-form{margin-top:18px;display:flex;flex-direction:column;gap:11px}
.ci-input{font:inherit;font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:13px 15px;outline:none}
.ci-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.ci-btn{font:inherit;font-size:15px;font-weight:800;color:#fff;background:var(--teal);border:none;border-radius:11px;padding:14px;cursor:pointer}
.ci-btn:hover{background:var(--teal-deep)}
.ci-err{font-size:12px;color:var(--rose);margin-top:10px;font-weight:700}
.ci-fine{font-size:11px;color:var(--muted);margin-top:14px;line-height:1.6}
.peek{overflow:hidden}
.peek .hrow{padding:11px 16px}
.peek .hxhead{padding:11px 16px}
.peek .hxbody{padding:2px 16px 18px}
.peek-evt{display:flex;align-items:center;gap:10px;padding:9px 16px;background:var(--teal-soft);
  border-bottom:1px solid var(--border);font-size:12px;font-weight:700;color:var(--teal)}
.setup{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:4px 8px}
.setup-item{display:flex;align-items:center;justify-content:space-between;gap:7px;font-size:12px;color:var(--gray-ink);
  font-weight:600;padding:11px 8px;border-radius:8px;text-decoration:none}
.setup-item:hover{background:var(--gray-bg)}
.setup-item .go{color:var(--teal);font-weight:700}
.setup-sep{display:none}
.exp-sec{padding:14px 16px}
.exp-sec summary{font-size:12.5px;font-weight:700;color:var(--muted);cursor:pointer}
.exp-list{display:flex;flex-direction:column;gap:8px}
.exp-row{display:flex;align-items:center;gap:10px;justify-content:space-between;
  border-top:1px solid var(--border);padding:9px 0}
.exp-row:first-child{border-top:none}
.exp-t{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--gray-ink);min-width:0}
.exp-t>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.exp-btn{flex:0 0 auto;border:1px solid var(--teal);background:var(--card);color:var(--teal);font:inherit;
  font-size:12px;font-weight:700;border-radius:8px;padding:6px 12px;cursor:pointer}
.exp-btn:hover{background:var(--teal-soft)}
.dt-tree{max-height:300px;overflow:auto;border:1px solid var(--border);border-radius:9px;padding:6px}
/* Drive folder tree (Claude Design): chevron + rounded checkbox + folder glyph + indent */
.suc .dt-tree .trow{display:flex;align-items:center;gap:9px;padding:9px 8px;border-radius:9px;cursor:pointer}
.suc .dt-tree .trow:hover{background:var(--gray-bg)}
.suc .dt-tree .tw-toggle{width:20px;height:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--muted);border:none;background:none;cursor:pointer;padding:0}
.suc .dt-tree .tw-toggle svg{transition:transform .15s ease}
.suc .dt-tree .tw-toggle.open svg{transform:rotate(90deg)}
.suc .dt-tree .tw-cbx{width:19px;height:19px;border-radius:6px;border:1.5px solid var(--border);background:var(--card);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .12s ease}
.suc .dt-tree .tw-cbx.on{background:var(--teal);border-color:var(--teal)}
.suc .dt-tree .tw-cbx svg{opacity:0}
.suc .dt-tree .tw-cbx.on svg{opacity:1}
.suc .dt-tree .tw-folder{flex-shrink:0;display:flex}
.suc .dt-tree .tw-name{font-size:13px;color:var(--ink);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.suc .dt-tree .tw-meta{font-size:11px;color:var(--muted);margin-left:auto;flex-shrink:0}
.suc .dt-tree .tchildren{margin-left:22px;border-left:1px solid var(--border);padding-left:4px}
.suc .dt-tree .tfile{display:flex;align-items:center;gap:8px;padding:6px 8px 6px 26px}
.suc .dt-tree .tfile-ic{flex-shrink:0;display:flex;color:var(--muted)}
.suc .dt-tree .tfile-name{font-size:12.5px;color:var(--gray-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.suc .dt-tree .tfile-type{font-size:10px;font-weight:700;color:var(--muted);margin-left:auto;flex-shrink:0;letter-spacing:.02em}
.suc .dt-tree .tfile-more{padding:4px 8px 6px 26px;font-size:11px;color:var(--muted)}
.dt-msg{font-size:12px;color:var(--muted);padding:6px 8px}
.dt-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
/* 入れ直しは破棄を伴うので、保存の並びから離して弱く出す。誤タップの代償は
   「もう一度取り込む」で済むが、保存と同じ強さで並べる操作ではない。 */
.dt-rebuild{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.dt-rebuild-btn{border:1px solid var(--border);background:transparent;color:var(--muted);border-radius:9px;font:inherit;font-size:12.5px;font-weight:700;padding:0 14px;min-height:40px;cursor:pointer}
.dt-rebuild-btn:hover{color:var(--ink);border-color:var(--muted)}
.dt-rebuild .mg-foot-lede{flex:1 1 16em;min-width:0}
.dt-count{font-size:12px;font-weight:700;color:var(--teal)}
@media (min-width:780px){
  .home-sec{align-items:start}
  .qhero{padding:22px 22px 20px}
  .btn-line{width:auto}
  .setup{flex-direction:row;align-items:center;gap:4px;padding:10px 16px;flex-wrap:wrap}
  .setup-item{justify-content:flex-start;padding:6px 10px}
  .setup-sep{display:block;width:1px;height:16px;background:var(--border);margin:0 4px}
  .kpi-grid{grid-template-columns:repeat(3,1fr)}
  .day{min-height:96px;padding:5px 5px 6px}
  .day-num{font-size:11.5px;width:20px;height:20px}
  .evt{font-size:10px;font-weight:700;line-height:1.3;padding:2px 5px 2px 6px;border-radius:4px;border-left:3px solid;height:auto}
  .evt.oc{background:var(--teal-soft);border-color:var(--teal);color:var(--teal)}
  .evt.deadline{background:var(--amber-bg);border-color:#d99c10;color:var(--amber-ink)}
  .chips-wrap{flex-direction:column}
  .chip{font-size:10px;font-weight:700;color:var(--gray-ink);background:var(--gray-bg);padding:1.5px 5px;gap:4px}
  .chip i{width:7px;height:7px}
  .save-bar{flex-direction:row;align-items:center;text-align:left}
}
@media (min-width:780px){
  .stat-grid{grid-template-columns:repeat(4,1fr)}
  .wrap.wide{max-width:1180px}
  .wrap.mid{max-width:620px}
  .wrap.center-v{min-height:calc(100vh - 80px);display:flex;flex-direction:column;justify-content:center}
  .hero{display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center;padding:36px 0 20px}
  .hero .h2{font-size:30px;line-height:1.4}
  /* dashboard: footer row (desktop) */
  .dash-foot{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px}
  .dash-foot .btn-primary{width:auto;margin:0;padding:14px 28px}
  /* preview: 3-column card grid (desktop) */
  .pv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start}
  .pv-grid .card{margin:0}
}
/* ─── 集中レビューモード (案C) ─── */
.rv-focus{display:grid;grid-template-columns:1fr;background:var(--card);border:1px solid var(--border);
  border-radius:12px;overflow:hidden;min-height:560px}
.rv-rail{background:var(--card);border-bottom:1px solid var(--border);padding:14px 12px;display:flex;flex-direction:column;gap:4px}
.rv-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;font:inherit;font-size:12.5px;
  font-weight:700;color:var(--gray-ink);cursor:pointer;padding:6px 8px;border-radius:8px;text-decoration:none}
.rv-back:hover{background:var(--gray-bg);color:var(--ink)}
.rv-prog{font-size:11.5px;font-weight:700;color:var(--muted);letter-spacing:.03em;padding:10px 8px 6px}
.rv-filter{display:flex;flex-wrap:wrap;gap:6px;padding:0 4px 8px}
.rv-fch{font-size:11.5px;font-weight:700;color:var(--gray-ink);background:var(--gray-bg);border:1px solid var(--border);
  border-radius:99px;padding:4px 11px;text-decoration:none;display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.rv-fch:hover{border-color:var(--teal);color:var(--teal)}
.rv-fch.on{background:var(--teal);border-color:var(--teal);color:#fff}
.rv-fcount{font-variant-numeric:tabular-nums;opacity:.85}
/* カレンダーの媒体別表示は媒体の色を持つ（UIモック）。承認画面の同じ札は色を持たない
   ので、印だけを足す形にして `.rv-fch` 本体には触らない。 */
.fch-dot{width:7px;height:7px;border-radius:50%;flex:none}
.rv-fch.ch{padding:5px 12px 5px 9px;cursor:pointer;user-select:none}
.rv-fch.ch input{width:13px;height:13px;margin:0;accent-color:var(--teal);flex:none;cursor:pointer}
.rv-fch.ch.on input{accent-color:var(--card)}   /* 濃い地の上では白い箱のほうが読める */
.rv-fch.ch:not(.on) .fch-dot{opacity:.35}
.rv-item{display:flex;gap:9px;align-items:flex-start;padding:10px;border-radius:10px;border:1px solid transparent;
  background:none;cursor:pointer;text-align:left;text-decoration:none;width:100%}
.rv-item:hover{background:var(--gray-bg)}
.rv-item.sel{background:var(--teal-soft);border-color:var(--teal-line)}
.rv-tx{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.rv-tx .t{font-size:12px;font-weight:600;line-height:1.5;color:var(--ink);display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rv-tx .d{font-size:10.5px;color:var(--muted)}
.rv-item.approved .t,.rv-item.rejected .t,.rv-item.scheduled .t,.rv-item.published .t,.rv-item.edited .t{color:var(--muted)}
.rv-st{flex-shrink:0;margin-top:2px}
.rv-circle{display:block;width:15px;height:15px;border-radius:50%;border:1.5px solid var(--border)}
.rv-railfoot{margin-top:14px;padding-top:12px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:8px}
.rv-main{padding:20px 22px 26px;min-width:0}
.rv-mhead{display:flex;align-items:baseline;gap:10px;margin:0 0 14px}
.rv-mhead .c{font-size:12.5px;font-weight:800;color:var(--muted)}
.rv-mhead .t{font-size:14.5px;font-weight:700}
.rv-unit{display:grid;grid-template-columns:1fr;gap:16px;align-items:start}
.rv-side{display:flex;flex-direction:column;gap:12px;min-width:0}
.rv-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rv-badges .pl{font-size:12.5px;font-weight:700}
.rv-sched{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--gray-ink);font-weight:600;
  background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:9px 12px}
.rv-sched b{color:var(--ink)}
.rv-sched a{color:var(--teal);font-weight:700;cursor:pointer;margin-left:auto;text-decoration:none}
.rv-acts{display:flex;flex-direction:column;gap:8px}
.rv-acts form{margin:0}
/* 修正依頼=AI / 微修正=手。アイコンは gap:7px（.rv-btn）でテキストと並ぶ。 */
.rv-row2 .rv-btn svg{flex:none;opacity:.85}
.rv-row2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rv-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:none;font:inherit;font-size:13px;
  font-weight:700;border-radius:9px;padding:11px 14px;cursor:pointer;white-space:nowrap;width:100%;text-decoration:none}
.rv-ok{background:var(--teal);color:#fff;box-shadow:0 2px 8px rgba(14,125,143,.22)}
.rv-ok:hover{filter:brightness(.94)}
.rv-btn:disabled,.rv-btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none;filter:none}
.rv-warn{background:#fdf2f2;border:1px solid #f0d4d5;border-radius:9px;padding:10px 12px;font-size:11.5px;color:#b4232a;line-height:1.6}
.rv-warn b{display:block;font-size:12px;margin-bottom:2px}
.rv-warn ul{margin:4px 0;padding-left:18px}
.rv-warn span{display:block;margin-top:4px;color:var(--gray-ink)}
.rv-okline{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--green);
  background:var(--green-bg);border:1px solid var(--green-line);border-radius:9px;padding:9px 12px}
.rv-okline b{font-variant-numeric:tabular-nums}
.rv-worknote{font-size:11.5px;color:var(--muted);line-height:1.7;margin:0}
#rvlive{position:relative}
#rvlive.rv-busy{pointer-events:none;opacity:.55;transition:opacity .1s}
#rvlive.rv-busy::after{content:"";position:absolute;top:14px;right:14px;width:18px;height:18px;
  border:2px solid var(--teal);border-top-color:transparent;border-radius:50%;animation:rvspin .8s linear infinite}
/* 微修正 modal (editor + live preview) */
.ed-veil{position:fixed;inset:0;background:rgba(20,32,45,.5);z-index:50;display:block;text-decoration:none}
.ed-modal{position:fixed;z-index:51;top:50%;left:50%;transform:translate(-50%,-50%);width:min(960px,94vw);
  max-height:90vh;background:var(--card);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 24px 64px rgba(20,32,45,.32)}
.ed-head{display:flex;align-items:center;gap:10px;padding:13px 18px;border-bottom:1px solid var(--border);flex:0 0 auto}
.ed-title{font-size:14px;font-weight:800;flex:1}
.ed-x{color:var(--muted);text-decoration:none;font-size:15px;font-weight:800;cursor:pointer;padding:2px 6px}
.ed-x:hover{color:var(--ink)}
.ed-grid{display:grid;grid-template-columns:1fr 1fr;min-height:0;overflow:hidden}
.ed-left{padding:16px 18px;display:flex;flex-direction:column;gap:6px;border-right:1px solid var(--border);overflow:auto}
.ed-left form{display:flex;flex-direction:column;gap:6px;height:100%}
.ed-right{padding:16px 18px;background:var(--surface);overflow:auto}
.ed-pvh{font-size:10.5px;font-weight:700;color:var(--muted);letter-spacing:.04em;margin:0 0 10px}
.ed-lbl{font-size:11.5px;font-weight:700;color:var(--gray-ink);margin-top:4px}
.ed-subj{border:1px solid #c8d2dc;border-radius:8px;padding:9px 11px;font:inherit;font-size:13.5px;font-weight:700;color:var(--ink)}
.ed-ta{flex:1;min-height:240px;border:1px solid #c8d2dc;border-radius:8px;padding:10px 12px;font:inherit;
  font-size:13px;line-height:1.8;resize:vertical;color:var(--ink)}
.ed-ta:focus,.ed-subj:focus{outline:2px solid var(--teal-line);border-color:var(--teal)}
.ed-count{font-size:11px;color:var(--muted);text-align:right}
.ed-count.over{color:#b4232a;font-weight:700}
.ed-foot{display:flex;gap:8px;justify-content:flex-end;margin-top:6px}
@media (max-width:779px){.ed-grid{grid-template-columns:1fr;overflow:auto}
  .ed-left{border-right:none;border-bottom:1px solid var(--border)}.ed-modal{width:96vw}}
.rv-ghost{background:var(--card);color:var(--ink);border:1px solid var(--border)}
.rv-ghost:hover{border-color:var(--border)}
.rv-ghost.on{background:var(--teal-soft);border-color:var(--teal-line);color:var(--teal)}
/* 枠なしの赤い中央寄せ文字は、押せるボタンではなく警告文に読める。枠を付けて
   「これは操作である」と形で示す。色は赤のままなので、他の枠2つとは区別が付く。 */
.rv-danger{background:none;color:#b4232a;border:1px solid var(--border)}
.rv-danger:hover{background:#fdf2f2;border-color:#f0d4d5}
.rv-danger-solid{background:#b4232a;color:#fff}
.rv-sm{padding:8px 13px;font-size:12px;border-radius:8px;width:auto}
.rv-panel{background:var(--bg);border:1px solid var(--border);border-radius:10px;padding:12px;display:flex;
  flex-direction:column;gap:10px}
.rv-panel-h{font-size:12px;font-weight:700}
.rv-chips{display:flex;flex-wrap:wrap;gap:6px}
.rv-chip{border:1px solid var(--border);background:var(--card);border-radius:99px;font-size:11.5px;font-weight:600;
  color:var(--gray-ink);padding:5px 11px;cursor:pointer;display:inline-flex;align-items:center}
.rv-chip input{display:none}
.rv-chip:has(input:checked){background:var(--teal-soft);border-color:var(--teal-line);color:var(--teal)}
.rv-ta{width:100%;border:1px solid #c8d2dc;border-radius:8px;padding:9px 11px;font:inherit;font-size:12.5px;
  line-height:1.7;resize:vertical;background:var(--card);color:var(--ink)}
.rv-panel-foot{display:flex;gap:8px;justify-content:flex-end}
/* 差し込みトークン — empty blank (yellow) ↔ filled (blue), edited directly on the preview */
.rv-ph{display:inline;border:none;font:inherit;font-size:12.5px;font-weight:700;background:var(--amber-bg);
  color:var(--amber-ink);border-radius:7px;padding:1px 8px;cursor:pointer;line-height:1.9;
  box-shadow:inset 0 0 0 1.5px var(--amber-line);transition:box-shadow .12s,background .12s}
.rv-ph:hover{background:#fbeaca}
.rv-ph.sel{box-shadow:inset 0 0 0 2px var(--amber);background:#fbeaca}
.rv-ph.filled{font-weight:400;color:var(--ink);background:var(--teal-soft);border-radius:6px;padding:1px 6px;
  box-shadow:inset 0 -2px 0 var(--teal-line)}
.rv-ph.filled:hover{box-shadow:inset 0 -2px 0 var(--teal)}
.rv-ph.filled.sel{box-shadow:inset 0 0 0 2px var(--teal)}
.rv-ph.targeted{outline:2px solid var(--teal);outline-offset:1px}
.fill-count{font-size:11px;font-weight:800;color:var(--amber-ink);background:var(--amber-bg);
  border:1px solid var(--amber-line);border-radius:99px;padding:2px 9px;margin-left:8px}
.fill-count.done{color:var(--green);background:var(--green-bg);border-color:var(--green-line)}
.fill-count.over{color:#b4232a;background:#fdf2f2;border-color:#f0d4d5}
@media (max-width:779px){
  .rv-sheet{position:fixed;left:0;right:0;bottom:0;z-index:60;max-height:82vh;overflow:auto;
    border-radius:16px 16px 0 0;box-shadow:0 -12px 36px rgba(20,32,45,.24);margin:0;
    padding-bottom:env(safe-area-inset-bottom)}   /* clear the home indicator on notched phones */
  .rv-sheet::before{content:"";display:block;width:36px;height:4px;border-radius:99px;
    background:var(--border);margin:2px auto 8px}
}
.fill-date{border:1px solid #c8d2dc;border-radius:8px;padding:8px 10px;font:inherit;font-size:12.5px;color:var(--ink);align-self:flex-start}
.rv-fillcta{align-self:flex-start;margin:2px 0 2px;text-decoration:none}
/* progress bars (one per blank) under the panel header */
.fill-prog{margin:-2px 0 0}
.fill-bars{display:flex;gap:3px}
.fill-bars i{flex:1;height:5px;border-radius:99px;background:var(--gray-bg)}
.fill-bars i.on{background:var(--teal)}
/* checklist of every blank — jump between them, see what's left */
.fill-checklist{display:flex;flex-direction:column;gap:2px;max-height:168px;overflow:auto;
  border:1px solid var(--border);border-radius:9px;background:var(--card);padding:5px}
.fill-ck{display:flex;align-items:center;gap:9px;padding:7px 8px;border-radius:8px;border:1px solid transparent;
  background:none;cursor:pointer;font:inherit;text-align:left;width:100%}
.fill-ck:hover{background:var(--gray-bg)}
.fill-ck.sel{background:var(--teal-soft);border-color:var(--teal-line)}
.fill-ckdot{width:16px;height:16px;border-radius:50%;flex-shrink:0;border:1.5px dashed var(--amber);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:10px;line-height:1}
.fill-ck.full .fill-ckdot{border-style:solid;border-color:var(--green);background:var(--green)}
.fill-cktx{flex:1;min-width:0;display:flex;flex-direction:column}
.fill-cktx .l{font-size:12px;font-weight:700;color:var(--ink)}
.fill-cktx .v{font-size:10.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fill-ck:not(.full) .fill-cktx .v{color:var(--amber-ink)}
/* one blank's focused editor; JS (.mf) shows only the selected one */
.fill-form{display:flex;flex-direction:column;gap:10px}
.fill-editors{display:flex;flex-direction:column;gap:10px}
.fill-field{display:flex;flex-direction:column;gap:7px;background:var(--card);border:1px solid var(--border);
  border-radius:9px;padding:11px}
.rv-fillpanel.mf .fill-field{display:none}
.rv-fillpanel.mf .fill-field.sel{display:flex}
.fill-fhd{font-size:13px;font-weight:800;color:var(--ink)}
.fill-hint{font-size:11px;color:var(--muted);line-height:1.5;margin:-3px 0 0}
.fill-in{width:100%;border:1px solid #c8d2dc;border-radius:8px;padding:9px 11px;font:inherit;font-size:12.5px;color:var(--ink);background:var(--card)}
.fill-in:focus{outline:2px solid var(--teal-line);border-color:var(--teal)}
textarea.fill-in{resize:vertical;line-height:1.7;min-height:60px}
.fill-frow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fill-fact{display:flex;align-items:center;gap:8px}
.fill-clear{border:none;background:none;color:var(--muted);font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;padding:4px 2px}
.fill-clear:hover{color:var(--ink)}
.fill-next{margin-left:auto}
/* 次回も使う toggle */
.fill-toggle{display:flex;align-items:center;gap:9px;cursor:pointer;margin-left:auto}
.fill-toggle input{display:none}
.fill-sw{width:34px;height:20px;border-radius:99px;background:var(--gray-bg);position:relative;flex-shrink:0;transition:background .15s}
.fill-sw::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--card);box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .15s}
.fill-toggle input:checked+.fill-sw{background:var(--teal)}
.fill-toggle input:checked+.fill-sw::after{transform:translateX(14px)}
.fill-tgl-tx{font-size:11px;font-weight:700;color:var(--ink);line-height:1.25}
.fill-tgl-h{display:block;font-size:10px;font-weight:500;color:var(--muted)}
.fill-ai{display:inline-flex;align-items:center;gap:5px;border:1px dashed var(--teal-line);background:var(--teal-soft);
  color:var(--teal);border-radius:99px;font:inherit;font-size:11px;font-weight:700;padding:5px 11px;cursor:pointer}
.fill-ai:hover{background:#d8ebee}
.fill-foot{display:flex;align-items:center;gap:10px;border-top:1px solid var(--border);padding-top:11px;flex-wrap:wrap}
.fill-aiall{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--teal-line);background:var(--card);
  color:var(--teal);border-radius:9px;font:inherit;font-size:12px;font-weight:700;padding:8px 12px;cursor:pointer}
.fill-aiall:hover{background:var(--teal-soft)}
.fill-foot .fill-apply{margin-left:auto}
.fill-spark{flex-shrink:0}
.fill-sgs{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.fill-sgl{font-size:10.5px;color:var(--muted);font-weight:700}
.fill-sg{border:1px dashed var(--teal-line);background:var(--teal-soft);color:var(--teal);border-radius:99px;
  font:inherit;font-size:11px;font-weight:700;padding:5px 11px;cursor:pointer;max-width:100%;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.fill-sg:hover{border-style:solid}
.fill-sg.on{border-style:solid;background:var(--teal);color:#fff}
.fill-choice{border-style:solid}
.rv-gennote code{background:var(--bg);padding:0 4px;border-radius:3px}
.rv-when{display:flex;flex-direction:column;gap:6px}
.rv-when button{display:flex;align-items:center;gap:8px;border:1px solid var(--border);background:var(--card);border-radius:8px;
  font:inherit;font-size:12.5px;font-weight:600;color:var(--ink);padding:9px 12px;cursor:pointer;text-align:left;width:100%}
.rv-when button:hover{border-color:var(--teal)}
.rv-when button.cur{background:var(--teal-soft);border-color:var(--teal-line);color:var(--teal)}
/* 出所の申告 — 選択肢は「何を選ぶべきか」の説明つき（境目を迷わせない）。 */
.rv-oglist{display:flex;flex-direction:column;gap:6px}
.rv-oglist button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;
  border:1px solid var(--border);background:var(--card);border-radius:8px;font:inherit;
  padding:9px 12px;cursor:pointer;text-align:left}
.rv-oglist button b{font-size:12.5px;font-weight:800;color:var(--ink)}
.rv-oglist button span{font-size:11px;color:var(--muted);line-height:1.55}
.rv-oglist button:hover{border-color:var(--teal)}
.rv-oglist button.on{background:var(--teal-soft);border-color:var(--teal-line)}
.rv-oglist button.on b{color:var(--teal)}
.rv-ognote{font-size:11px;color:var(--muted);line-height:1.6;margin:8px 0 0}
.rv-note{font-size:11.5px;color:var(--teal);background:var(--teal-soft);border:1px solid var(--teal-line);
  border-radius:8px;padding:8px 11px;line-height:1.6}
.rv-revising{display:flex;gap:10px;align-items:center;font-size:12.5px;font-weight:600;color:var(--amber);
  background:var(--amber-bg);border:1px solid var(--amber-line);padding:13px 14px;border-radius:10px}
.rv-spin{width:14px;height:14px;border:2px solid var(--amber);border-top-color:transparent;border-radius:50%;
  animation:rvspin .8s linear infinite;flex-shrink:0}
@keyframes rvspin{to{transform:rotate(360deg)}}
/* AI画像 generating: the 「3案つくる」 button shows a disabled 作成中 state (inline spinner) while
   the request is in flight; only the button is disabled, the rest of the screen stays usable. */
.rv-autogen button[disabled] .rv-spin{margin-right:2px;vertical-align:-2px}
.rv-done{background:var(--green-bg);border:1px solid var(--green-line);border-radius:10px;padding:14px;
  display:flex;flex-direction:column;gap:8px;max-width:460px}
.rv-done .h{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--green)}
.rv-done .s{font-size:12px;color:var(--green);line-height:1.7}
.rv-rejb{background:var(--gray-bg);border:1px solid var(--border);border-radius:10px;padding:14px;display:flex;
  flex-direction:column;gap:8px}
.rv-rejb .h{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--gray-ink)}
.rv-rejb .s{font-size:12px;color:var(--gray-ink);line-height:1.7}
.rv-bulk{display:flex;align-items:center;gap:10px;background:var(--amber-bg);border:1px solid var(--amber-line);
  border-radius:9px;padding:8px 12px;font-size:12px;font-weight:600;color:var(--amber);flex-wrap:wrap}
.rv-bulk form{margin:0}
.rv-pv{border:1px solid var(--border);border-radius:12px;background:var(--card);overflow:hidden}
.rv-pvcap{font-size:10.5px;font-weight:700;color:var(--muted);letter-spacing:.05em;margin:0 0 6px;display:flex;align-items:center;justify-content:space-between;gap:8px}
/* 投稿の見出しに並ぶ道具（本文をコピー・複製・共有リンク）。判断ではないので小さく。 */
.rv-pvtools{display:inline-flex;align-items:center;gap:6px}
.rv-pvtools .rv-ic{width:30px;height:30px;flex:0 0 30px}
.rv-pvtools .rv-ic svg{width:13px;height:13px}
.rv-copy{border:1px solid var(--border);background:var(--card);color:var(--muted);font:inherit;font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 9px;cursor:pointer;letter-spacing:0}
.rv-copy:hover{border-color:var(--teal);color:var(--teal)}
.rv-until{font-size:11px;font-weight:800;color:var(--teal);background:var(--teal-soft);border:1px solid var(--teal-line);border-radius:99px;padding:1px 9px;margin-left:2px}
/* 複製・共有リンクは「たまに使う道具」。枠付きボタンにすると 修正依頼／微修正 と
   同じ重さになり、レールが同格の箱4つに見える。テキストリンクに落として段を作る:
   塗り(承認) → 枠(修正・編集) → 赤文字(却下) → 淡い文字(道具)。 */
/* 承認以外のツールバー。**名前を出す** — 絵だけでは押す前に何が起きるか分からない。
   狭いときは折り返す（潰して読めなくするより、段を増やす方がまし）。 */
.rv-tools{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:12px;
  border-top:1px solid var(--border)}
/* `width:100%`（.rv-btn 既定）を打ち消すだけ。**min-width は既定のまま**にする —
   0 にすると縮める余地ができて、折り返さずに文字が潰れる（38px まで潰れた）。 */
.rv-tools .rv-btn{width:auto;flex:0 1 auto}
.rv-tools .rv-btn svg{flex:none;opacity:.85}
.rv-tools-sp{flex:1 1 0;min-width:0}
.rv-tools form{margin:0;display:flex}
.rv-ic{width:40px;height:40px;flex:0 0 40px;display:inline-flex;align-items:center;
  justify-content:center;border:1px solid var(--border);border-radius:50%;background:var(--card);
  color:var(--gray-ink);cursor:pointer;padding:0;font:inherit;text-decoration:none;
  transition:border-color .13s,color .13s,background .13s}
.rv-ic:hover{border-color:var(--teal-line);color:var(--teal);background:var(--teal-soft)}
.rv-ic:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.rv-ic.on{border-color:var(--teal-line);color:var(--teal);background:var(--teal-soft)}
/* 却下は右端に離し、色で区別する。隣が複製なので誤タップの代償が大きい。 */
.rv-ic-danger{color:#b4232a}
.rv-ic-danger:hover{border-color:#f0c8c8;color:#b4232a;background:#fdf2f2}
/* queue search/filter */
.qfilter{width:100%;border:1px solid #c8d2dc;border-radius:8px;padding:8px 11px;font:inherit;font-size:12.5px;color:var(--ink);background:var(--card);margin:2px 0 8px}
.qfilter:focus{outline:2px solid var(--teal-line);border-color:var(--teal)}
.hxr.hidden,.rv-item.hidden{display:none}
.qfilter-empty{font-size:12px;color:var(--muted);padding:10px 4px;display:none}
.qfilter-empty.on{display:block}
/* action toast */
.rv-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:300;display:flex;align-items:center;gap:8px;
  background:var(--ink);color:#fff;font-size:13px;font-weight:700;padding:11px 18px;border-radius:99px;
  box-shadow:0 8px 28px rgba(20,32,45,.3);animation:rvToastIn .25s ease-out}
.rv-toast.ok{background:var(--green)}.rv-toast.bad{background:#b4232a}
.rv-toast.out{animation:rvToastOut .3s ease-in forwards}
@keyframes rvToastIn{from{opacity:0;transform:translate(-50%,12px)}}
@keyframes rvToastOut{to{opacity:0;transform:translate(-50%,8px)}}
/* a11y: bigger touch targets on phones */
@media (max-width:779px){
  .mg-x,.ed-x{min-width:40px;min-height:40px}
  .fill-sg{min-height:40px}
  .fill-ck{padding:11px 10px}
  /* iOS Safari force-zooms the page when a focused field is <16px. Raise every editable control on
     phones (!important also beats the one inline-styled subscriber-import textarea). */
  input:not([type=checkbox]):not([type=radio]):not([type=file]),textarea,select{font-size:16px !important}
  /* App-bar controls to the 44px touch floor (avatar grows to a 44px circle; toggle/bell are flex glyphs). */
  .t-toggle,.bell,.av{min-width:44px;min-height:44px}
  .rv-ic{width:44px;height:44px;flex:0 0 44px}
  /* Other sub-44px tap targets on the review/connections surfaces. */
  .rv-pager button{min-height:44px;padding-left:16px;padding-right:16px}
  .cal-arrow{width:44px;height:44px}
  .rv-fch,.nf-tab{min-height:36px}
  .rv-copy{min-height:36px;display:inline-flex;align-items:center;padding-top:6px;padding-bottom:6px}
  .suc .dt-tree .tw-toggle{min-width:44px;min-height:44px}
  .suc .dt-tree .trow{min-height:44px}
}
.rv-ava{width:36px;height:36px;border-radius:50%;background:var(--teal-soft);border:1px solid var(--teal-line);
  color:var(--teal);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.rv-xhead{display:flex;align-items:center;gap:10px;padding:14px 14px 0}
.rv-xnames{display:flex;flex-direction:column;min-width:0}
.rv-xnames b{font-size:13px;font-weight:700}
.rv-xnames i{font-style:normal;font-size:11.5px;color:var(--muted)}
.rv-xtext{font-size:13px;line-height:1.8;margin:10px 14px 14px;white-space:pre-wrap}
.rv-mmeta{display:flex;gap:10px;padding:7px 16px;font-size:11.5px;border-bottom:1px solid var(--border)}
.rv-mmeta span{color:var(--muted);width:40px;flex-shrink:0;font-weight:600}
.rv-mmeta b{font-weight:600;color:var(--gray-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rv-msubj{font-size:13.5px;font-weight:800;padding:11px 16px;border-bottom:1px solid var(--border);line-height:1.5}
.rv-mbody{font-size:12.5px;line-height:1.9;padding:14px 16px 16px;color:var(--ink);white-space:pre-wrap}
.rv-pvimg{margin:10px 14px 14px}
/* Instagram preview — a faithful light embed (keeps its own look even in app dark mode) */
.rv-ig{max-width:380px;background:#fff;border:1px solid #dbdbdb;border-radius:10px;overflow:hidden;color:#262626}
.rv-ig-hd{display:flex;align-items:center;gap:9px;padding:10px 12px}
.rv-ig-av{width:32px;height:32px;border-radius:50%;padding:2px;flex:0 0 auto;background:linear-gradient(45deg,#f9ce34,#ee2a7b,#6228d7)}
.rv-ig-av span{display:flex;width:100%;height:100%;border-radius:50%;background:#0c6b43;color:#fff;align-items:center;justify-content:center;font-weight:800;font-size:11px;border:2px solid #fff}
.rv-ig-nm{font-weight:700;font-size:12.5px;color:#262626}
.rv-ig-sub{font-size:10.5px;color:#8e8e8e}
.rv-ig-dots{margin-left:auto;color:#262626;font-weight:800;letter-spacing:1px}
.rv-ig-img img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.rv-ig-ph{aspect-ratio:1/1;background:linear-gradient(135deg,#eef2f7,#dfe6ee);display:flex;align-items:center;justify-content:center;color:#8e8e8e;font-size:11.5px;font-weight:700}
.rv-ig-acts{display:flex;align-items:center;gap:15px;padding:10px 12px 5px;color:#262626}
.rv-ig-acts svg{width:22px;height:22px}.rv-ig-acts .sp{flex:1}
.rv-ig-cap{padding:2px 12px 13px;font-size:12.5px;line-height:1.5;color:#262626;white-space:pre-wrap}
.rv-ig-cap b{font-weight:700;margin-right:5px}
/* LinkedIn reference preview — collapsed under the primary card; faithful light embed */
.rv-li-tg{margin:12px 14px 2px}
.rv-li-tg>summary{cursor:pointer;font-size:12px;font-weight:700;color:#0a66c2;list-style:none;padding:5px 0}
.rv-li-tg>summary::-webkit-details-marker{display:none}
.rv-li{max-width:440px;margin-top:8px;background:#fff;border:1px solid #e4e6eb;border-radius:10px;overflow:hidden;color:#000000e6}
.rv-li-hd{display:flex;align-items:flex-start;gap:10px;padding:12px 14px 7px}
.rv-li-av{width:44px;height:44px;border-radius:50%;flex:0 0 auto;background:#0c6b43;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px}
.rv-li-nm{font-weight:700;font-size:14px;color:#000;line-height:1.2}
.rv-li-head{font-size:11.5px;color:#00000099;margin-top:1px}
.rv-li-meta{font-size:11.5px;color:#00000099;margin-top:1px}
.rv-li-text{padding:3px 14px 11px;font-size:13.5px;line-height:1.5;color:#000000e6;white-space:pre-wrap}
.rv-li-img img{display:block;width:100%;aspect-ratio:1.91/1;object-fit:cover;border-top:1px solid #e4e6eb;border-bottom:1px solid #e4e6eb}
.rv-li-ph{aspect-ratio:1.91/1;background:linear-gradient(135deg,#eaf1f8,#cfe0f3);display:flex;align-items:center;justify-content:center;color:#0a66c2;font-size:11.5px;font-weight:700;border-top:1px solid #e4e6eb;border-bottom:1px solid #e4e6eb}
.rv-li-bar{display:flex;border-top:1px solid #e4e6eb}
.rv-li-bar span{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:9px 0;color:#00000099;font-weight:600;font-size:12.5px}
.rv-li-bar svg{width:18px;height:18px}
.rv-cmpwrap{margin-top:16px}
.rv-cmpbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px;flex-wrap:wrap}
.rv-cmpbar-t{font-size:12.5px;font-weight:700;color:var(--teal-deep)}
.rv-revert{border:1px solid var(--teal-line);background:var(--card);color:var(--teal-deep);border-radius:8px;font:inherit;font-size:12.5px;font-weight:700;padding:7px 14px;cursor:pointer}
.rv-revert:hover{background:var(--teal-soft)}
.rv-cmp{display:flex;gap:12px;flex-wrap:wrap}
.rv-cmp-col{flex:1;min-width:220px;border:1px solid var(--border);border-radius:11px;padding:11px 13px;background:var(--surface)}
.rv-cmp-col.now{border-color:var(--teal-line);background:var(--teal-soft)}
.rv-cmp-lbl{font-size:11px;font-weight:800;color:var(--muted);margin:0 0 6px}
.rv-cmp-col.now .rv-cmp-lbl{color:var(--teal-deep)}
.rv-cmp-txt{font-size:12.5px;line-height:1.65;color:var(--ink);white-space:pre-wrap;word-break:break-word;max-height:320px;overflow:auto}
.rv-pvimg img{display:block;width:100%;max-height:280px;object-fit:cover;border-radius:10px;border:1px solid var(--border)}
.pv-mail .rv-pvimg,.rv-pv .rv-mmeta+.rv-pvimg{margin:12px 16px}
.rv-photo-ctl{display:inline-flex;align-items:center;margin-top:10px;font-size:12px;font-weight:700;
  color:var(--teal);text-decoration:none;cursor:pointer;padding:4px 2px}
.rv-photo-ctl:hover{text-decoration:underline;text-underline-offset:3px}
.rv-photo-ctl.on{color:var(--ink)}
.rv-photo-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.rv-photo-opt{display:flex;flex-direction:column;gap:0;border:1px solid var(--border);background:var(--card);border-radius:9px;
  overflow:hidden;cursor:pointer;font:inherit;padding:0;text-align:left}
.rv-photo-opt:hover{border-color:var(--teal)}
.rv-photo-opt.cur{border-color:var(--teal);box-shadow:0 0 0 2px var(--teal-line)}
.rv-photo-opt img{width:100%;height:64px;object-fit:cover;background:var(--bg)}
.rv-photo-opt .rv-photo-lbl{display:block;font-size:10.5px;font-weight:700;color:var(--ink);
  padding:5px 7px 6px;line-height:1.3}
.rv-photo-opt{position:relative;width:100%}
.rv-photo-none{display:block;width:100%;margin-top:10px;padding:10px;border:1px dashed var(--border);border-radius:9px;
  background:var(--card);font:inherit;font-size:12px;font-weight:700;color:var(--gray-ink);text-align:center;cursor:pointer}
.rv-photo-none:hover{border-color:var(--teal);color:var(--teal)}
.rv-photo-none.cur{border-style:solid;border-color:var(--teal);box-shadow:0 0 0 2px var(--teal-line);color:var(--teal)}
.rv-photo-cell{position:relative}
.rv-prompt-btn{position:absolute;top:4px;right:4px;width:20px;height:20px;border-radius:50%;border:none;
  background:rgba(20,32,45,.66);color:#fff;font-size:12px;font-weight:700;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;z-index:2}
.rv-prompt-btn:hover{background:var(--teal)}
.rv-pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:10px;font-size:12px;color:var(--muted)}
.rv-pager[hidden]{display:none}
.rv-use[hidden]{display:none}
.rv-pager button{border:1px solid var(--border);background:var(--card);border-radius:8px;padding:5px 12px;font:inherit;
  font-size:12px;cursor:pointer;color:var(--ink)}
.rv-pager button:disabled{opacity:.4;cursor:default}
.rv-use{width:100%;margin-top:12px}
.rv-modal{position:fixed;inset:0;background:rgba(20,32,45,.5);display:none;align-items:center;
  justify-content:center;z-index:200;padding:20px}
.rv-modal.open{display:flex}
.rv-modal-box{background:var(--card);border-radius:14px;max-width:460px;width:100%;max-height:80vh;overflow:auto;
  box-shadow:0 18px 50px rgba(20,32,45,.3);padding:18px 20px}
.rv-modal-h{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.rv-modal-t{font-size:14px}
.rv-modal-x{border:none;background:none;font-size:22px;line-height:1;color:var(--muted);cursor:pointer}
.rv-modal-p{font-size:13px;line-height:1.7;color:var(--ink);white-space:pre-wrap;margin:0 0 14px;
  background:var(--gray-bg);border-radius:8px;padding:11px 13px}
.rv-modal-foot{display:flex;gap:10px;justify-content:flex-end}
.rv-modal-foot button{border-radius:8px;padding:8px 14px;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.rv-modal-copy{border:1px solid var(--teal);background:var(--card);color:var(--teal)}
.rv-modal-close{border:none;background:var(--teal);color:#fff}
.ai-badge{position:absolute;top:4px;left:4px;background:rgba(20,32,45,.72);color:#fff;font-size:9px;
  font-weight:800;letter-spacing:.04em;border-radius:5px;padding:2px 5px}
.rv-photo-empty-msg{font-size:12px;color:var(--gray-ink);line-height:1.7;margin:0}
.rv-autogen{border-top:1px solid var(--border);padding-top:12px;margin-top:4px;display:flex;flex-direction:column;gap:6px}
.rv-autogen .rv-ok{width:100%}
.rv-gensum{font-size:12px;color:var(--muted);cursor:pointer;margin-top:2px;list-style:none}
.rv-gensum::-webkit-details-marker{display:none}
.rv-gensum::before{content:"＋ ";color:var(--teal);font-weight:700}
details[open] .rv-gensum::before{content:"− "}
.rv-genwrap{border-top:1px solid var(--border);padding-top:12px;margin-top:4px;display:flex;flex-direction:column;gap:8px}
.rv-genrow{display:flex;gap:8px;align-items:center}
.rv-sel{flex:1;border:1px solid #c8d2dc;border-radius:8px;padding:8px 10px;font:inherit;font-size:12.5px;background:var(--card);color:var(--ink)}
.rv-gennote{font-size:10.5px;color:var(--muted);line-height:1.6;margin:0}
.rv-cand{margin-bottom:12px;display:flex;flex-direction:column;gap:8px}
.rv-cand-h{font-size:12.5px;font-weight:700;color:var(--teal)}
.rv-promptview{font-size:11px;color:var(--muted);margin-top:2px}
.rv-promptview summary{cursor:pointer;color:var(--teal);font-weight:700}
.rv-promptview ul{margin:6px 0 0;padding-left:16px;line-height:1.5}
.rv-promptview li{margin:3px 0}
@media (min-width:780px){
  .rv-focus{grid-template-columns:300px minmax(0,1fr)}
  .rv-rail{border-bottom:none;border-right:1px solid var(--border)}
  .rv-railfoot{margin-top:auto}
}
/* レビュー画面も **器の幅**で切り替える。画面が1440pxでも、シェルのレール(74) + 待ち行列(300)
   + 文脈サイドバー を引いた作業領域は 518px しかなく、viewport の 780px 判定で2列にすると
   本文が212pxまで潰れていた（承認前に必ず読むテキストが2〜3語ずつ折り返す）。 */
.rv-main{container-type:inline-size}
@container (min-width:640px){ .rv-main .rv-unit{grid-template-columns:minmax(0,1fr) 290px} }
/* ホームで展開した投稿。切替は **この箱の幅**で判断する（画面幅ではない）— 行はホームの
   作業列の中にあり、1440pxの画面でも箱は864px。viewport メディアクエリだと「広いから2列」と
   判断して、承認前に必ず読む本文を152pxまで削っていた。
   290pxの判断列 + 16pxの余白 + 読める本文 ⇒ 640pxを境に2列、下回れば縦積み。 */
.hxbody{container-type:inline-size}
.hxbody .rv-unit{grid-template-columns:1fr}
@container (min-width:640px){ .hxbody .rv-unit{grid-template-columns:minmax(0,1fr) 290px} }
/* Subscribers table → stacked cards on phones (else 区分/状態/削除 get clipped). */
@media (max-width:560px){
  .subs-tbl thead{display:none}
  .subs-tbl, .subs-tbl tbody, .subs-tbl tr, .subs-tbl td{display:block;width:auto}
  .subs-tbl tr{position:relative;padding:10px 12px;border-top:1px solid var(--border)}
  .subs-tbl td{padding:1px 0!important;text-align:left!important}
  .subs-tbl td:nth-child(1){font-weight:600;padding-right:54px!important;word-break:break-all}
  .subs-tbl td:last-child{position:absolute;top:8px;right:8px;padding:0!important}
}
/* ── 連携・基本情報 setup hub (Claude Design: Setup - 連携・基本情報) ── */
.suc{display:flex;flex-direction:column;gap:26px}
.suc .card{margin:0}
.suc .sec{display:flex;flex-direction:column;gap:12px}
.suc .sec-head{display:flex;align-items:baseline;gap:12px;padding:0 2px}
.suc .sec-head h2{font-size:15px;font-weight:800;margin:0;letter-spacing:.01em;color:var(--ink)}
.suc .sec-note{font-size:12.5px;color:var(--muted);margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
.suc .sec-help{font-size:12px;line-height:1.7;color:var(--muted);margin:2px 2px 0}
/* foldable sections: configured sections start folded — the 設定済み pill is the summary */
.suc .sec-fold .sec-head{cursor:pointer;align-items:center}
.suc .sec-fold .fchev{margin-left:auto;width:26px;height:26px;border-radius:7px;border:1px solid var(--border);
  background:var(--surface);color:var(--muted);display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:transform .18s ease}
.suc .sec-fold:not(.folded) .fchev{transform:rotate(180deg)}
.suc .sec-fold.folded>*:not(.sec-head){display:none}
/* connection cards */
.suc .conn-card{display:flex;align-items:center;gap:16px;padding:18px 20px}
.suc .conn-card .ic{width:44px;height:44px;border-radius:12px;flex:0 0 44px;font-size:18px}
.suc .conn-main{flex:1;min-width:0}
.suc .conn-main .cn{font-size:14.5px;font-weight:700}
.suc .conn-main .cd{font-size:12.5px;line-height:1.6;color:var(--muted);margin-top:3px}
.suc .conn-side{display:flex;align-items:center;gap:12px;flex-shrink:0;margin:0}
.suc .conn-acct{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap}
.suc .conn-disc{background:none;border:none;color:#b4232a;font:inherit;font-size:12.5px;font-weight:600;cursor:pointer;padding:8px;border-radius:8px}
.suc .conn-disc:hover{background:#fdf1f1}
.suc .conn-card.is-connected{border-color:var(--green-line)}
.suc .badge-ok{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:99px;background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);font-size:12px;font-weight:700}
.suc .btn-connect{background:var(--teal);color:#fff;min-height:40px;padding:0 18px;border-radius:10px;display:inline-flex;align-items:center}
.suc /* 連携が切れている状態。**「連携済み」の緑と見分けが付く色**でないと意味がない。 */
.conn-exp{background:#fdf2f2;border-color:#f0d4d5;color:var(--rose)}
html.dark .conn-exp{background:#3a1d22;border-color:#5e2b33}
.conn-card.is-expired{border-color:#f0d4d5}
.badge-soon{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:99px;background:var(--gray-bg);border:1px solid var(--border);color:var(--muted);font-size:12px;font-weight:700;white-space:nowrap}
.suc .conn-card.is-soon{opacity:.66}
.suc .conn-card.is-soon .ic{filter:grayscale(.35)}
/* LINE QR (not connected) */
.suc .qr-wrap{display:flex;flex-direction:column;align-items:center;gap:12px;padding:8px 0 2px}
.suc .qr-wrap .qr{margin:0}
.suc .qr-cap{font-size:12px;color:var(--muted);line-height:1.6;text-align:center;max-width:340px}
.suc .qr-cap b{color:var(--ink);font-weight:700}
/* form */
.suc .form-card{padding:22px;display:flex;flex-direction:column;gap:16px}
.suc .field{display:flex;flex-direction:column;gap:6px}
.suc .field>label{font-size:12.5px;font-weight:700;color:var(--ink)}
.suc .inp{width:100%;min-height:44px;border:1px solid var(--border);border-radius:10px;background:var(--card);font:inherit;font-size:13.5px;color:var(--ink);padding:0 13px}
.suc .inp:focus{outline:2px solid var(--teal-line);border-color:var(--teal)}
.suc .inp::placeholder{color:#aeb9c0}
.suc .inp-adorn{display:flex;align-items:stretch;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--card)}
.suc .inp-adorn:focus-within{outline:2px solid var(--teal-line);border-color:var(--teal)}
.suc .inp-adorn .adorn{display:flex;align-items:center;padding:0 12px;background:var(--gray-bg);color:var(--muted);font-size:13.5px;font-weight:700;border-right:1px solid var(--border)}
.suc .inp-adorn .inp{border:none;border-radius:0}
.suc .inp-adorn .inp:focus{outline:none}
.suc .field-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vchips{display:flex;flex-wrap:wrap;gap:6px;margin:1px 0 2px}
.vchip{border:1px dashed var(--teal-line);background:var(--teal-soft);color:var(--teal);border-radius:99px;
  font:inherit;font-size:12px;font-weight:700;padding:5px 11px;cursor:pointer;white-space:nowrap}
.vchip:hover{border-style:solid;background:var(--teal-line)}
.suc .check-box{display:flex;gap:12px;align-items:flex-start;background:var(--gray-bg);border:1px solid var(--border);border-radius:12px;padding:14px 16px;cursor:pointer;position:relative}
.suc .check-box .cbx{width:20px;height:20px;border-radius:6px;border:1.5px solid var(--border);background:var(--card);flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:13px;line-height:1;transition:all .12s ease}
.suc .check-box input:checked+.cbx{background:var(--teal);border-color:var(--teal)}
.suc .check-box .cbx::after{content:"✓";opacity:0}
.suc .check-box input:checked+.cbx::after{opacity:1}
.suc .check-box input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.suc .check-box .ct{font-size:13px;font-weight:700}
.suc .check-box .ch{font-size:12px;line-height:1.65;color:var(--muted);margin-top:3px}
.suc .saved-flash{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:var(--green)}
.suc .form-save{align-self:flex-start;min-height:44px;width:auto;padding:0 26px;margin:0;border-radius:10px;display:inline-flex;align-items:center;justify-content:center}
/* 学校情報をまとめて取得 (AI autofill) */
.suc .autofill-box{background:var(--teal-soft);border:1px solid var(--teal-line);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.suc .af-head{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:800;color:var(--teal)}
.suc .af-help{font-size:12px;line-height:1.7;color:var(--muted);margin:0}
.suc .af-row{display:flex;gap:10px;align-items:stretch}
.suc .af-row .inp{flex:1;background:var(--card)}
.suc .af-btn{flex-shrink:0;min-height:44px;padding:0 20px;border:1px solid var(--teal-line);background:var(--card);color:var(--teal);font:inherit;font-size:13.5px;font-weight:700;border-radius:10px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px}
.suc .af-btn:hover{filter:brightness(.97)}
.suc .af-btn:disabled{opacity:.55;cursor:default}
.suc .af-spin{width:14px;height:14px;border:2px solid var(--teal-line);border-top-color:var(--teal);border-radius:50%;animation:af-rot .7s linear infinite}
@keyframes af-rot{to{transform:rotate(360deg)}}
.suc .af-err{font-size:12px;color:#b4232a;margin:0}
.suc .af-ok{font-size:12px;color:var(--green);font-weight:700;margin:0}
.suc .af-divider{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin:2px 0}
.suc .af-divider::before,.suc .af-divider::after{content:"";flex:1;height:1px;background:var(--border)}
@media (max-width:640px){.suc .af-row{flex-direction:column}.suc .af-btn{width:100%}}
/* single-row card (email list) */
.suc .row-card{display:flex;align-items:center;gap:18px;padding:18px 22px}
.suc .row-card .rc-main{flex:1;min-width:0}
.suc .row-card .rc-title{font-size:14px;font-weight:700}
.suc .row-card .rc-desc{font-size:12.5px;line-height:1.6;color:var(--muted);margin-top:3px}
.suc .row-card .btn-teal{width:auto;min-height:44px;padding:0 22px;flex-shrink:0;display:inline-flex;align-items:center;border-radius:10px}
/* drive folder tree */
.suc .drive-card{padding:18px 20px 16px;display:flex;flex-direction:column;gap:14px}
.suc .drive-card .dt-tree{border:1px solid var(--border);border-radius:12px;background:var(--surface);max-height:280px;padding:6px}
.suc .drive-card .dt-foot{display:flex;align-items:center;gap:14px;margin:0}
.suc .drive-card .dt-count{font-size:13px;font-weight:700;color:var(--teal);margin-right:auto}
.suc .drive-card .btn-save{min-height:44px;padding:0 22px}
/* メール配信先 — Drive folder picker (radio single-select, drill-in) + detail + consent gate.
   One picker pattern shared with block 2; here it's single-select with a "what's inside" preview. */
.suc .dp{border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.suc .dp-bar{display:flex;align-items:center;gap:10px;padding:9px 11px;border-bottom:1px solid var(--border)}
.suc .dp-crumbs{display:flex;align-items:center;gap:3px;min-width:0;flex:1;overflow:hidden}
.suc .dp-crumb{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:var(--teal-deep);background:none;border:none;font:inherit;cursor:pointer;padding:3px 5px;border-radius:6px;white-space:nowrap}
.suc .dp-crumb:hover{background:var(--teal-soft)}
.suc .dp-crumb.cur{color:var(--muted);cursor:default}
.suc .dp-crumb.cur:hover{background:none}
.suc .dp-sep{color:var(--muted);font-size:11px;flex-shrink:0}
.suc .dp-search{display:flex;align-items:center;gap:7px;background:var(--card);border:1px solid var(--border);border-radius:8px;padding:5px 10px;width:160px;flex-shrink:0}
.suc .dp-search input{background:none;border:none;outline:none;color:var(--ink);font:inherit;font-size:12px;width:100%}
.suc .dp-search input::placeholder{color:var(--muted)}
.suc .dp-search svg{color:var(--muted);flex-shrink:0}
.suc .dp-list{max-height:280px;overflow-y:auto}
.suc .dp-row{display:flex;align-items:center;gap:11px;padding:10px 12px;border-bottom:1px solid var(--border);cursor:pointer;position:relative}
.suc .dp-row:last-child{border-bottom:none}
.suc .dp-row:hover{background:var(--gray-bg)}
.suc .dp-row.sel{background:var(--teal-soft)}
.suc .dp-row.sel::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--teal)}
.suc .dp-ctrl{width:19px;height:19px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.suc .dp-radio{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--border);background:var(--card);position:relative}
.suc .dp-row.sel .dp-radio{border-color:var(--teal)}
.suc .dp-row.sel .dp-radio::after{content:"";position:absolute;inset:3.5px;border-radius:50%;background:var(--teal)}
.suc .dp-fic{flex-shrink:0;display:flex}
.suc .dp-name{flex:1;min-width:0;font-size:13px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.suc .dp-meta{display:flex;align-items:center;gap:7px;flex-shrink:0}
.suc .dp-chip{font-size:10.5px;font-weight:700;border-radius:6px;padding:2px 7px;white-space:nowrap}
.suc .dp-chip.list{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.suc .dp-chip.none{color:var(--muted);background:none;border:1px solid var(--border)}
.suc .dp-drill{width:26px;height:26px;border-radius:7px;border:none;background:none;color:var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.suc .dp-drill:hover{background:var(--gray-bg);color:var(--ink)}
.suc .dp-msg{padding:22px;text-align:center;color:var(--muted);font-size:12.5px}
.suc .dp-detail{margin-top:14px;border:1px solid var(--teal-line);background:var(--teal-soft);border-radius:11px;padding:13px 15px}
.suc .dp-detail.is-empty{border-style:dashed;border-color:var(--border);background:var(--surface)}
.suc .dp-dh{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--ink)}
.suc .dp-dh .ok{color:var(--green);display:flex}
.suc .dp-dh .warn{color:var(--amber-ink);display:flex}
.suc .dp-files{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.suc .dp-file{display:flex;align-items:center;gap:9px;font-size:12px}
.suc .dp-ft{min-width:38px;height:18px;border-radius:4px;font-size:9px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--green);background:var(--green-bg);border:1px solid var(--green-line);letter-spacing:.02em}
.suc .dp-fnm{flex:1;min-width:0;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.suc .dp-fct{color:var(--muted);flex-shrink:0;white-space:nowrap;font-variant-numeric:tabular-nums}
.suc .dp-total{margin-top:11px;padding-top:10px;border-top:1px solid var(--teal-line);font-size:12.5px;color:var(--muted)}
.suc .dp-total b{color:var(--teal-deep);font-weight:800}
.suc .dp-empt{font-size:12px;color:var(--muted);line-height:1.6}
.suc .dp-consent{margin-top:14px;display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--border);border-radius:11px;padding:13px 15px;cursor:pointer;transition:border-color .14s ease}
.suc .dp-consent:hover{border-color:var(--teal-line)}
.suc .dp-consent.on{border-color:var(--green-line);background:var(--green-bg)}
.suc .dp-cbx2{width:20px;height:20px;border-radius:6px;border:1.6px solid var(--border);background:var(--card);flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;color:#fff}
.suc .dp-consent.on .dp-cbx2{background:var(--green);border-color:var(--green)}
.suc .dp-cbx2 svg{opacity:0}
.suc .dp-consent.on .dp-cbx2 svg{opacity:1}
.suc .dp-ct{font-size:12.5px;font-weight:700;line-height:1.5;color:var(--ink)}
.suc .dp-req{color:#c4403a;font-weight:800;margin-left:6px;font-size:11px}
.suc .dp-ch{font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.65}
.suc .dp-foot{display:flex;align-items:center;gap:14px;margin-top:16px;flex-wrap:wrap}
.suc .dp-grow{flex:1}
.suc .dp-gate{font-size:11.5px;color:var(--amber-ink);display:inline-flex;align-items:center;gap:6px}
.suc .dp-gate.ok{color:var(--green)}
.suc .dp-badge{font-size:10.5px;font-weight:800;background:var(--gray-bg);border:1px solid var(--border);border-radius:99px;padding:1px 8px;color:var(--muted);white-space:nowrap}
/* block 2 (資料の取り込み): search bar + richer selection summary */
.suc .dt-bar{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.suc .dt-search{display:flex;align-items:center;gap:7px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:6px 10px;flex:1;max-width:260px}
.suc .dt-search input{background:none;border:none;outline:none;color:var(--ink);font:inherit;font-size:12.5px;width:100%}
.suc .dt-search input::placeholder{color:var(--muted)}
.suc .dt-search svg{color:var(--muted);flex-shrink:0}
.suc .dt-count .ex{color:var(--muted);opacity:.8;font-weight:600}
.suc .dt-count b{color:var(--teal-deep);font-weight:800;font-variant-numeric:tabular-nums}
/* 統合版: question-framed, collapse-when-configured Drive cards */
.suc .collapsible{padding:0;display:block}
.suc .collapsible .card-h{cursor:pointer;display:flex;align-items:flex-start;gap:12px;padding:16px 18px}
.suc .collapsible:not(.collapsed) .card-h{border-bottom:1px solid var(--border)}
.suc .collapsible .card-h .htext{flex:1;min-width:0}
.suc .qlabel{font-size:10.5px;font-weight:800;letter-spacing:.06em;color:var(--teal-deep);margin-bottom:5px}
.suc .collapsible .card-h .d{font-size:12px;color:var(--muted);margin:6px 0 0;line-height:1.7}
.suc .collapsible.collapsed .card-h .d{display:none}
.suc .collapsible .chev{width:30px;height:30px;border-radius:8px;border:1px solid var(--border);background:var(--surface);color:var(--muted);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .18s ease;margin-top:2px}
.suc .collapsible:not(.collapsed) .chev{transform:rotate(180deg)}
.suc .collapsible .card-b{padding:0 18px 18px;display:flex;flex-direction:column;gap:16px}
.suc .collapsible.collapsed .card-b{display:none}
.suc .status-pill{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;border-radius:99px;padding:3px 10px;flex-shrink:0;margin-top:1px}
.suc .status-pill svg{width:13px;height:13px}
.suc .status-pill.set{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.suc .status-pill.unset{color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line)}
.suc .summary{display:flex;align-items:center;gap:11px;padding:14px 18px}
.suc .collapsible:not(.collapsed) .summary{display:none}
.suc .summary .sic{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.suc .summary .sic.ok{background:var(--green-bg);border:1px solid var(--green-line);color:var(--green)}
.suc .summary .sic.warn{background:var(--amber-bg);border:1px solid var(--amber-line);color:var(--amber-ink)}
.suc .summary .sic svg{width:16px;height:16px}
.suc .summary .stext{flex:1;min-width:0}
.suc .summary .stext .st{display:block;font-size:13px;font-weight:700;color:var(--ink)}
.suc .summary .stext .ss{display:block;font-size:12px;color:var(--muted);margin-top:2px;line-height:1.5}
.suc .summary .stext .ss b{color:var(--teal-deep);font-weight:700}
.suc .summary .sedit{font-size:12.5px;font-weight:700;color:var(--teal);cursor:pointer;flex-shrink:0;display:inline-flex;align-items:center;gap:5px;background:none;border:none;font:inherit}
.suc .summary .sedit:hover{text-decoration:underline;text-underline-offset:3px}
.suc .dp-clear{font-size:11.5px;font-weight:700;color:var(--teal);background:none;border:none;cursor:pointer;font:inherit;white-space:nowrap;flex-shrink:0}
.suc .dp-clear:hover{text-decoration:underline;text-underline-offset:2px}
.suc .ml-title{font-size:14px;font-weight:700;color:var(--ink)}
.suc .ml-nightly{font-size:11px;font-weight:600;color:var(--muted)}
.ml-link{font-size:12.5px;font-weight:700;color:var(--teal-deep);text-decoration:none}
.ml-link:hover{text-decoration:underline}
.suc .dt-refresh{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--teal-line);background:var(--card);color:var(--teal);border-radius:9px;font:inherit;font-size:12.5px;font-weight:700;padding:0 13px;min-height:44px;cursor:pointer}
.suc .dt-refresh:hover{background:var(--teal-soft)}
.suc .dt-status{margin:8px 0 0}
/* photo library */
.suc .photo-card{padding:18px 20px;display:flex;flex-direction:column;gap:16px}
.suc .photo-head{display:flex;align-items:center;gap:12px}
.suc .photo-head .ph-title{font-size:13px;font-weight:700;margin-right:auto}
.suc .btn-clean{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 15px;border-radius:10px;background:var(--green-bg);border:1px solid var(--green-line);color:var(--green);font:inherit;font-size:12.5px;font-weight:700;cursor:pointer}
.suc .btn-clean:hover{filter:brightness(.97)}
.suc .photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.suc .photo{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--border);background:var(--surface);aspect-ratio:1/1;display:flex}
.suc .photo .lib-thumb{width:100%;height:100%;object-fit:cover;display:block}
.suc .ph-cap{position:absolute;left:0;right:0;bottom:0;padding:18px 10px 8px;background:linear-gradient(to top,rgba(15,30,36,.62),transparent);color:#fff;font-size:11px;font-weight:600;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
.suc .ph-badges{position:absolute;top:8px;left:8px;display:flex;gap:5px;z-index:1}
.suc .ph-badge{position:static;display:inline-flex;align-items:center;padding:3px 7px;border-radius:99px;font-size:10px;font-weight:800;letter-spacing:.02em;margin:0}
.suc .ph-badge.ai{background:rgba(14,125,143,.92);color:#fff}
.suc .ph-badge.unused{background:var(--amber-bg);color:var(--amber-ink);border:1px solid var(--amber-line)}
.suc .ph-del{position:absolute;top:7px;right:7px;width:26px;height:26px;border-radius:8px;border:none;background:rgba(15,30,36,.55);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .12s ease;font-size:12px;z-index:1}
.suc .photo:hover .ph-del{opacity:1}
.suc .ph-del:hover{background:#b4232a}
.suc .photo-empty{border:1.5px dashed var(--border);border-radius:12px;background:var(--surface);padding:34px 20px;text-align:center;font-size:12.5px;line-height:1.8;color:var(--muted)}
.suc .upload-row{display:flex;align-items:center;gap:10px;border-top:1px solid var(--border);padding-top:16px;margin:0;flex-wrap:wrap}
.suc .upload-row input[type=file]{font:inherit;font-size:13px;flex:0 0 auto;max-width:100%}
.suc .upload-row .inp{flex:1;min-width:180px}
.suc .upload-row .btn-save{min-height:44px;padding:0 22px;margin:0}
/* ロゴ。白抜きのロゴが白背景で消えるので、薄い下敷きの上に出す。 */
.suc .logo-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.suc .hr-grid{display:flex;gap:14px;flex-wrap:wrap}
/* NGワードの2段。**段の違いが見た目で分かること** — 同じ見た目だと、止まる語と
   止まらない語が混ざって読めない。 */
.suc .ng-card{margin-top:12px}
.suc .ng-col{margin-top:12px;padding-top:12px;border-top:1px solid var(--border)}
.suc .ng-h{font-size:12.5px;font-weight:700;display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.suc .ng-h span{font-weight:400;font-size:11px;color:var(--muted)}
.suc .ng-chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:9px}
.suc .ngw{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border:1px solid var(--border);border-radius:8px;font-size:12px;background:var(--surface)}
.suc .ngw button{border:0;background:none;cursor:pointer;color:var(--muted);font-size:12px;padding:0;line-height:1}
.suc .ngw button:hover{color:#b4232a}
.suc .ng-add{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.suc .ng-add .inp{flex:1;min-width:150px}
.suc .mt-card{margin-top:12px}
.suc .mt-head{font-size:13px;line-height:1.7}
.suc .mt-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.suc .mt-cell{display:flex;flex-direction:column;gap:2px;padding:8px 12px;border:1px solid var(--border);border-radius:9px;font-size:12px;min-width:88px}
.suc .mt-cell>span{color:var(--muted);font-size:11px}
.suc .mt-cell .mt-rate{color:var(--ink);font-size:13px;font-weight:700}
.suc .mt-note{color:var(--muted);font-size:11.5px;line-height:1.6;margin:10px 0 0}
.suc .hr-grid .field{flex:1;min-width:120px}
.suc .logo-prev{background:var(--gray-bg);border:1px solid var(--border);border-radius:10px;padding:10px 14px;display:flex;align-items:center}
.suc .logo-prev img{display:block;max-height:44px;max-width:220px;width:auto}
/* footer dock */
.suc .setup-foot{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px 22px;display:flex;align-items:center;gap:16px;margin:0}
.suc .setup-foot .grow{flex:1}
.suc .setup-foot .foot-hint{font-size:11.5px;color:var(--muted);text-align:right;max-width:280px;line-height:1.5;margin:0}
.suc .setup-foot .back{display:inline-flex;align-items:center;gap:6px;color:var(--muted);text-decoration:none;font-size:13px;font-weight:600}
.suc .setup-foot .back:hover{color:var(--ink)}
.suc .setup-foot .btn-primary{width:auto;margin:0;padding:0 24px;min-height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:12px}
@media (max-width:640px){
  .suc .conn-card{flex-direction:column;align-items:stretch;gap:14px}
  .suc .conn-side{justify-content:space-between}
  .suc .field-grid{grid-template-columns:1fr}
  .suc .row-card{flex-direction:column;align-items:stretch;gap:14px}
  .suc .row-card .btn-teal{width:100%}
  .suc .photo-grid{grid-template-columns:repeat(2,1fr)}
  .suc .drive-card .dt-foot{flex-wrap:wrap}
  .suc .drive-card .btn-save{width:100%}
  .suc .upload-row .inp,.suc .upload-row .btn-save{width:100%;flex:none}
  .suc .setup-foot{flex-direction:column-reverse;align-items:stretch;gap:12px}
  .suc .setup-foot .foot-hint{text-align:center;max-width:none}
  .suc .setup-foot .btn-primary,.suc .setup-foot .back{width:100%;justify-content:center}
  /* sub-44px tap targets in the connect cards + Drive picker */
  .suc .conn-disc{min-height:44px;padding:8px 12px;display:inline-flex;align-items:center;justify-content:center}
  .suc .dp-drill{min-width:44px;min-height:44px}
  .suc .dp-row{min-height:48px}
  .suc .summary .sedit{min-height:44px}
  .suc .dp-crumb{min-height:40px}
  /* the Drive search box was a fixed 160px next to the breadcrumbs — stack so each gets a full line */
  .suc .dp-bar{flex-direction:column;align-items:stretch;gap:8px}
  .suc .dp-search{width:auto}
}
/* ── 今週の予定 (Strategist's weekly plan block — Claude Design: 今週の予定) ── */
.wp{overflow:hidden;padding:0;margin:0}
.wp-head{padding:16px 18px 14px;border-bottom:1px solid var(--border);display:grid;grid-template-columns:1fr auto;gap:10px 14px;align-items:center}
.wp-titles{min-width:0}
.wp-title-row{display:flex;align-items:center;gap:9px}
.wp-strat{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:800;letter-spacing:.04em;color:var(--teal);background:var(--teal-soft);border:1px solid var(--teal-line);border-radius:99px;padding:2px 8px}
.wp-h-title{font-size:15px;font-weight:800;color:var(--ink)}
.wp-sub{font-size:12px;color:var(--muted);margin:4px 0 0;line-height:1.55}
.wp-head-right{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.wp-await{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:800;color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line);border-radius:99px;padding:4px 11px;white-space:nowrap}
.wp-await.zero{color:var(--gray-ink);background:var(--gray-bg);border-color:var(--border)}
.wp-prog{display:flex;align-items:center;gap:8px}
.wp-prog-tx{font-size:11px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.wp-track{width:96px;height:5px;border-radius:99px;background:var(--gray-bg);overflow:hidden}
.wp-fill{height:100%;border-radius:99px;background:var(--teal);transition:width .5s ease}
.wp-fill.full{background:var(--green)}
.wp-list{display:flex;flex-direction:column}
.wp-row{display:grid;grid-template-columns:104px 1fr auto;gap:13px;align-items:center;padding:13px 18px;border-bottom:1px solid var(--border)}
.wp-row:last-child{border-bottom:none}
.wp-row.dim{opacity:.62}
.wp-chan{display:flex;align-items:center;gap:7px;min-width:0}
.wp-chan .lbl{font-size:12px;font-weight:700;color:var(--ink);white-space:nowrap}
.wp-mid{min-width:0;display:flex;flex-direction:column;gap:4px}
.wp-theme{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.45;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wp-aud{display:inline-flex;align-items:center;font-size:10.5px;font-weight:700;color:var(--gray-ink);background:var(--gray-bg);border:1px solid var(--border);border-radius:6px;padding:1px 7px;white-space:nowrap;flex-shrink:0}
.wp-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.wp-why{min-width:0;font-size:11px;color:var(--muted);line-height:1.5}
.wp-why>summary{display:inline-flex;align-items:center;gap:5px;cursor:pointer;list-style:none;border-radius:6px;padding:1px 5px;margin-left:-5px;min-height:22px}
.wp-why>summary::-webkit-details-marker{display:none}
.wp-why>summary:hover{background:var(--gray-bg)}
.wp-why>summary:focus-visible{outline:2px solid var(--teal);outline-offset:1px}
.wp-why svg{flex-shrink:0}
.wp-why b{font-weight:800;font-size:10.5px;white-space:nowrap}
.wp-caret{opacity:.55;transition:transform .12s}
.wp-why[open] .wp-caret{transform:rotate(180deg)}
/* full rationale — never truncated. max-width keeps the measure readable on wide screens. */
.wp-why .wt{margin:5px 0 2px;padding-left:2px;max-width:62ch;white-space:pre-line}
/* レビュー画面（承認する場所）に置くときの見出し付きブロック */
.row.can-open{cursor:pointer}
.row.can-open:hover{background:var(--gray-bg)}
.row-gone{margin:3px 0 0;font-size:11.5px;line-height:1.55;color:var(--amber-ink)}
.row-gone .rg-d{display:block;color:var(--muted);font-size:11px}
.omk-see{margin-left:8px;white-space:nowrap;font-weight:700;text-decoration:none}
.wp-gone{margin-top:5px;font-size:11.5px;line-height:1.55;color:var(--amber-ink)}
.wp-gone .wp-gd{display:block;color:var(--muted);font-size:11px}
.hold-card{border-color:var(--amber-line);background:var(--amber-bg)}
.hold-hd{margin-bottom:8px}
.hold-s{font-size:13px;line-height:1.7;color:var(--ink);margin:0 0 12px}
/* 独自のボタン色を作らない。二次操作は rv-ghost（--ink の読める文字色）を使う —
   --muted で作ったら無効なボタンに見えた。印が付いた状態だけ琥珀で示す。 */
/* 投稿1本の履歴。専用の記録は持たず、監査ログ・下書き・post_results を組み立て直す。 */
/* 一覧の行: サムネイル ・ 企画の種類 ・ 一生の4段階。テキストだけでは、画像が本文に
   合っているかも、なぜこの投稿なのかも、いまどこまで進んだかも分からなかった。 */
/* 板（かんばん風）。**表示切替は作らない** — 同じHTMLで、広ければ4列・狭ければ縦一列。
   列の中身は「エージェントの工程」ではなく**いまある状態**にした。工程を列にすると、企画と
   作成は週に7分しか中身が無く左2列が常に空になる（実測 23:48:26→23:55:26）。 */
/* 器は**親**に置く。`.board` 自身に container-type を付けると、`.board` を対象にした
   @container は永久に一致しない（要素は自分自身を問い合わせられない）。1200pxでも
   grid-template-columns が none のままだったのは、これが理由。 */
.boardwrap{container-type:inline-size}
/* かんばん（一覧）は列が最大5つ。潰さずに横へ流す。**`@container` の中には書けない** —
   この要素自身がコンテナなので、コンテナクエリは自分には当たらない。 */
.boardwrap.wide{overflow-x:auto;padding-bottom:4px}
.board{display:grid;gap:12px;margin-top:4px}
.bcol{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:10px 11px;min-width:0}
.bhead{display:flex;align-items:center;gap:7px;margin:0 0 9px;font-size:12px;font-weight:800;color:var(--ink)}
.bn{font-size:11px;font-weight:700;color:var(--muted);background:var(--card);border:1px solid var(--border);border-radius:99px;padding:1px 8px}
.bcards{display:flex;flex-direction:column;gap:8px}
.bempty{display:flex;flex-direction:column;gap:4px;padding:14px 10px;font-size:11.5px;color:var(--muted);text-align:center}
.bempty b{color:var(--ink);font-size:12.5px}
/* 件数・絞り込みは列ではない。span しないと1マスを占め、列が1つ押し出されて
   最後の列だけ2段目に落ちる（実測: 未作成 だけ y460 に回り込んでいた）。 */
.board-top{grid-column:1/-1;margin-bottom:2px}
.board-assure{margin-top:14px;font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:7px}
/* 今週のサイクル（仕様9-1）。**横に長い9段**なので、狭い画面では横スクロールさせる —
   折り返すと段の順番が読めなくなる（順番そのものが情報）。 */
.cy-wrap{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:13px 15px 15px;margin-bottom:12px}
.cy-head{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;font-size:12.5px;margin-bottom:11px}
.cy-sub{color:var(--muted);font-size:11px}.cy-grow{flex:1}
.cy-note{font-size:12px;font-weight:700;color:var(--amber-ink,#8a5a00)}
a.cy-note{text-decoration:none}a.cy-note:hover{text-decoration:underline}
.cy-rail{display:flex;gap:0;overflow-x:auto;padding-bottom:2px}
.cy-s{flex:1 0 auto;min-width:74px;display:flex;flex-direction:column;align-items:center;gap:3px;position:relative;text-align:center}
.cy-s::before{content:'';position:absolute;top:11px;left:-50%;width:100%;height:2px;background:var(--border)}
.cy-s:first-child::before{display:none}
.cy-s.done::before,.cy-s.now::before{background:var(--teal,#0e7d8f)}
.cy-d{width:23px;height:23px;border-radius:50%;display:flex;align-items:center;justify-content:center;
      font-size:11px;font-weight:700;background:var(--surface);border:2px solid var(--border);color:var(--muted);position:relative;z-index:1}
.cy-s.done .cy-d{background:var(--teal,#0e7d8f);border-color:var(--teal,#0e7d8f);color:#fff}
.cy-s.now .cy-d{border-color:var(--amber,#d9930a);color:var(--amber-ink,#8a5a00);box-shadow:0 0 0 3px var(--amber-bg,#fdf3e0)}
.cy-l{font-size:11px;line-height:1.35}.cy-s.now .cy-l{font-weight:700}
a.cy-s{text-decoration:none;color:inherit}
a.cy-s.act .cy-l{text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px}
a.cy-s.act:hover .cy-d{border-color:var(--teal,#0e7d8f);color:var(--teal,#0e7d8f)}
.cy-w{font-size:10px;color:var(--muted)}
/* 方針入力のモーダル（週次サイクル①）。月1回の入力なので、1画面で終わる形にする。 */
/* 方針入力は**内容ぶんの高さで中央**に置く。`.mg-modal` の inset:24px は投稿レビュー
   （全画面で本文を読む）用の指定で、短いダイアログに当てると縦に引き伸ばされる。 */
.mg-modal.pm{inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);
  width:min(692px,calc(100% - 32px));max-height:calc(100vh - 48px);
  animation:pmPop .18s cubic-bezier(.22,.61,.36,1)}
@keyframes pmPop{from{opacity:0;transform:translate(-50%,-50%) scale(.985)}}
/* 承認画面（13-1 ④）— 左に一覧、右に1本。狭い画面では縦に積む。 */
.rvz{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:1100px){.rvz{grid-template-columns:320px minmax(0,1fr)}}
.rvz-list{background:var(--surface);border:1px solid var(--border);border-radius:14px;
  overflow:hidden;align-self:start;max-height:calc(100vh - 190px);overflow-y:auto}
.rvz-lh{padding:12px 14px;border-bottom:1px solid var(--border);display:flex;
  align-items:center;gap:10px}
.rvz-lh b{font-size:13px}.rvz-lh span{font-size:11px;color:var(--muted)}
.rvz-cnt{margin-left:auto;font-variant-numeric:tabular-nums}
.rvz-cnt b{font-size:11px;color:var(--ink)}
/* 丸と札は横に並べる（丸はリンクの外に置いたまま）。 */
.rvz-item{display:flex;align-items:flex-start;border-bottom:1px solid var(--border)}
.rvz-item.on{background:var(--teal-soft);box-shadow:inset 3px 0 0 var(--teal)}
.rvz-item>.rvz-row{flex:1;min-width:0;border-bottom:none;background:none;box-shadow:none}
.rvz-pick{display:block;padding:14px 4px 0 14px}
.rvz-pick input{width:16px;height:16px;accent-color:var(--teal)}
.rvz-pick input:disabled{opacity:.35}
.rvz-all{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;cursor:pointer}
.rvz-all input{width:15px;height:15px;accent-color:var(--teal)}
#rvzbulk{margin-top:8px}
.rv-th{margin-top:12px;border-top:1px solid var(--border);padding-top:11px}
.th-hd{font-size:12px;font-weight:700;margin-bottom:8px}
.th-i{margin-bottom:9px}
.th-h{display:flex;align-items:baseline;gap:7px;font-size:11px}
.th-h b{font-size:11.5px}
.th-k{padding:1px 6px;border-radius:5px;font-weight:700;font-size:10px;
  background:var(--gray-bg);color:var(--gray-ink)}
.th-k.reject{background:#fdecec;color:#b4232a}
.th-t{color:var(--muted);margin-left:auto}
.th-b{font-size:12px;line-height:1.65;margin-top:2px}
.th-f{display:flex;gap:7px;margin-top:10px}
.th-in{flex:1;min-width:0;border:1px solid var(--border);border-radius:8px;padding:8px 10px;
  font:inherit;font-size:12px;background:var(--card);color:var(--ink)}
.th-f .rv-btn{width:auto}
.rvz-row{display:flex;flex-direction:column;gap:5px;padding:11px 14px;text-decoration:none;
  color:inherit;border-bottom:1px solid var(--border)}
.rvz-row:hover{background:var(--gray-bg)}
.rvz-row.on{background:var(--teal-soft)}
.rvz-top{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.rvz-grow{flex:1}
.rvz-t{font-size:12.5px;font-weight:600;line-height:1.5;display:-webkit-box;
  -webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rvz-w{display:flex;align-items:center;gap:7px;font-size:10.5px;color:var(--muted)}
.rvz-main{min-width:0}
.rvz-empty{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.rvz-empty b{font-size:13.5px;display:block}
.rvz-empty span{font-size:12px;color:var(--muted)}
.pm-body{padding:16px 20px 18px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}
/* **モーダルのCSSは自己完結させる。** `.field` `.inp` は設定ページ（`.suc`）配下にしか
   定義が無く、モーダルでは素のブラウザ表示になっていた（ラベルと入力が同じ行に潰れ、
   枠も高さも付かない）。他の画面のCSSを当てにすると、こういう形で静かに崩れる。 */
.pm .field{display:flex;flex-direction:column;gap:6px}
/* 節の見出し（今月のテーマ / 重点KPI目標 / 補足指示(任意)）は**同じ組み**にする。
   3つが違う太さ・大きさだと、どれが同じ階層なのか読めない。 */
.pm .field>label{font-size:12.5px;font-weight:700;color:var(--ink);letter-spacing:.01em;
  line-height:1.5}
/* 題は本文より一段強く。モーダルが何の画面かを最初に読ませる。 */
.pm .mg-h-t{font-size:17px;font-weight:800;letter-spacing:.01em}
/* **入力済みの値は太字。** 今月のテーマは、この画面でいちばん読まれる1行。 */
.pm #pmtheme{font-weight:700}
.pm .inp{width:100%;min-height:42px;border:1px solid var(--border);border-radius:10px;
  background:var(--card);font:inherit;font-size:13.5px;color:var(--ink);padding:0 13px}
.pm .inp:focus{outline:2px solid var(--teal-line);border-color:var(--teal)}
.pm .rv-ta{width:100%;min-height:76px}
/* KPIカードの数値だけは狭く（`.pm .inp` より詳しいセレクタで上書き）。 */
.pm .pm-kin .inp{width:82px;min-height:38px;font-weight:700;text-align:center;padding:0 8px}
/* `.rv-btn` は全域で width:100%。脚注では**内容ぶんの幅**にして右へ寄せる。 */
.pm-foot .rv-btn{width:auto}
.pm-sub{margin:0;font-size:11.5px;color:var(--muted);line-height:1.6}
.pm-chips{display:flex;gap:7px;flex-wrap:wrap;margin-top:8px}
.pm-chip{border:1px solid var(--border);background:var(--surface);border-radius:8px;
  padding:5px 10px;font:inherit;font-size:11.5px;cursor:pointer;color:var(--ink)}
.pm-chip:hover{border-color:var(--teal)}
.pm-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(196px,1fr));gap:10px;
  align-items:stretch}
.pm-kpi{display:flex;flex-direction:column;gap:6px;border:1px solid var(--border);
  border-radius:11px;padding:10px 12px;cursor:pointer}
.pm-kpi.on{border-color:var(--teal);background:var(--teal-soft)}
.pm-kh{display:flex;align-items:center;gap:7px;font-size:12px}
.pm-kh input{width:15px;height:15px;accent-color:var(--teal)}
/* 単位と現状は**折り返させない**。1枚だけ2行になると、3枚の高さが揃わない。 */
.pm-kin{display:flex;align-items:baseline;gap:6px;flex-wrap:nowrap;white-space:nowrap}
.pm-kin .inp{width:76px;font-weight:700;text-align:center}
.pm-ku{font-size:11px;color:var(--muted)}
.pm-kc{font-size:11px;color:var(--muted)}
.pm-prev{background:var(--teal-soft);border-radius:11px;padding:12px 14px;
  display:flex;flex-direction:column;gap:6px}
.pm-prev b{color:var(--teal)}
.pm-prev b{font-size:12px}.pm-prev>span{font-size:11.5px;line-height:1.65}
.pm-note{color:var(--muted);font-size:10.5px}
.pm-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pm-log{font-size:10.5px;color:var(--muted);flex:1}
.pm-save{background:var(--teal);color:#fff;border-color:var(--teal);
  font-weight:700;padding:9px 20px}
.pm-save:hover{filter:brightness(1.12)}
/* ── 投稿の確認モーダル ───────────────────────────────────────────────
   板を押し下げずに「読む → 決める」を一枚で終わらせる。器は常に描いて、開いていないときは
   hidden。**[hidden] を明示する** — .mg-modal は display:flex なので、hidden 属性だけでは
   消えない（属性と表示指定が競合したときは表示指定が勝つ）。 */
.mg-veil[hidden],.mg-modal[hidden]{display:none}
/* モーダルが開いている間は背面を止める。覆いの上でスクロールすると板が動いてしまい、
   閉じたときに知らない場所に戻る。JSで class を付け外しすると、サーバーが開いた状態で
   返したときに初期化を1回ぶん書き足すことになるので、CSSだけで済ませる。 */
body:has(.rv-mo:not([hidden])){overflow:hidden}
/* 開くと**右から帯が出る**（UIモック）。一覧を隠さずに1本を読むための形で、
   閉じれば元の行がそこにある。 */
.rv-mo{inset:0 0 0 auto;top:0;left:auto;transform:none;width:min(520px,96vw);
  max-width:none;max-height:100vh;border-radius:16px 0 0 16px}
/* 題を持たない見出し（札が何の投稿かを言う）。閉じるだけを右端に。 */
.mg-head.slim{padding:14px 20px 0;border-bottom:none}
/* 決め終わった投稿の足元。**操作の代わりに、何ができるかを1行で。** */
.rv-nodec{margin:0;padding:14px 0 2px;border-top:1px solid var(--border);
  font-size:11.5px;color:var(--muted);text-align:center;line-height:1.8}
.rv-nodec a{display:block;color:var(--teal);text-decoration:none;font-weight:600}
/* 承認一覧の札の点。右上に置く（モック）。 */
.rvz-sc{font-size:12px;font-weight:800;font-variant-numeric:tabular-nums}
.rvz-sc.ok{color:var(--green)}.rvz-sc.warn{color:var(--amber-ink)}.rvz-sc.bad{color:var(--rose)}
/* 配信予定は札の行の右端へ。 */
.rv-hwhen{margin-left:auto;font-size:11.5px;color:var(--muted);white-space:nowrap}
/* 承認画面の組み: 左に出る姿、右に材料と操作。**腰を据えて順に見ていく画面**なので、
   本文と判断を同時に見せる（帯は狭いので1本の縦並びのまま）。 */
.rv-2col{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:20px;
  align-items:start}
.rv-2a,.rv-2b{display:flex;flex-direction:column;gap:16px;min-width:0}
@media (max-width:1080px){.rv-2col{grid-template-columns:1fr}}
/* 帯の頭の題と配信予定。 */
.rv-ttl{margin:2px 0 0;font-size:16px;font-weight:800;line-height:1.5;color:var(--ink)}
.rv-when{font-size:11.5px;color:var(--muted);margin-top:-10px}
/* 帯の頭の札。**中身と一緒に差し替わる場所**に置く（見出しは差し替えの外側）。 */
.rv-hchips{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin:-4px 0 2px}
.kchip.plat{width:auto;min-height:0;padding:4px 9px;border-radius:7px;margin-right:0;
  font-size:10.5px}
/* **札は縮めない。** 狭い列だと flex が幅を削り、`white-space:nowrap` の文字が隣の札に
   はみ出して重なって見えた（承認画面の右列で実際に起きた）。入らなければ折り返す。 */
.rv-hchips>*{flex:0 0 auto}
/* 上から順に1本。**2列にすると、承認の材料が横に散って目が往復する。** */
.rv-dr{display:flex;flex-direction:column;gap:16px}
.rv-sec h4{margin:0 0 8px;font-size:12px;font-weight:800;color:var(--ink)}
.rv-sec h4 b{color:var(--teal)}
.rv-sb{display:grid;grid-template-columns:104px 1fr 48px;align-items:center;gap:10px;
  font-size:11.5px;margin-bottom:8px}
.rv-sb-n{color:var(--muted)}
.rv-sb-t{height:9px;border-radius:99px;background:var(--gray-bg);overflow:hidden}
.rv-sb-t i{display:block;height:100%;background:var(--green);border-radius:99px}
.rv-sb b{text-align:right;font-variant-numeric:tabular-nums;color:var(--green);font-weight:800}
/* 単位は数字より小さく薄く。**読むのは数のほう。** */
.sb-u{font-size:.82em;font-weight:700;opacity:.72;margin-left:1px}
/* 提案理由の帯。**淡い色で、読ませはするが本文より前に出ない。** */
.rv-whyb{display:flex;gap:8px;padding:11px 13px;border-radius:10px;background:var(--teal-soft);
  font-size:11.5px;line-height:1.7;color:var(--ink)}
.rv-whyi{color:var(--teal);flex:none}
.rv-whyt{color:var(--teal);margin-right:7px}
.rv-as{display:flex;align-items:center;gap:9px;padding:10px 12px;background:var(--gray-bg);
  border-radius:9px;margin-bottom:6px;font-size:12px}
.rv-as-i{color:var(--muted)}
.rv-as-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-weight:600;color:var(--ink)}
/* ── 接続設定（UIモック）: 口ごとの状態 ─────────────────────────────────── */
.cnd-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
@media (max-width:900px){.cnd-grid{grid-template-columns:1fr}}
/* 状態は**左の縁**で言う。札だけだと、カードが並んだとき色が拾えない。 */
.cnd{padding:13px 15px 14px;display:flex;flex-direction:column;gap:9px;
  border-left:3px solid var(--border)}
.cnd.ok{border-left-color:var(--green)}
.cnd.warn{border-left-color:var(--amber-ink)}
.cnd.bad{border-left-color:var(--rose)}
.cnd.off,.cnd.soon{border-left-color:var(--border)}
.cnd-h{display:flex;align-items:center;gap:10px}
.cnd-ic{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;
  justify-content:center;flex:none;color:#fff}
.cnd-t{display:flex;flex-direction:column;min-width:0}
.cnd-t b{font-size:13px;font-weight:800}
.cnd-t i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--muted)}
.cnd.ok .cnd-t i{color:var(--green)}
.cnd.warn .cnd-t i{color:var(--amber-ink)}
.cnd.bad .cnd-t i{color:var(--rose)}
.cnd-b{margin-left:auto;display:flex;gap:6px;flex:none}
.cnd-b form{margin:0}
/* 名前と値。**値は右に寄せない** — 項目名の長さが揃わないので、列で読ませる。 */
.cnd-r{display:grid;grid-template-columns:88px minmax(0,1fr);gap:10px;font-size:11.5px;
  line-height:1.7}
.cnd-r>span{color:var(--muted)}
.cnd-r>b{font-weight:700;color:var(--ink);word-break:break-word}
.cnd-r>b.ok{color:var(--green)}
.cnd-r>b.warn{color:var(--amber-ink)}
.cnd-r>b.bad{color:var(--rose)}
.cnd-off{margin:0;font-size:11.5px;color:var(--muted);line-height:1.75}
.cnd-note{margin:2px 0 0;font-size:11px;line-height:1.7;border-radius:9px;padding:9px 11px;
  background:var(--gray-bg);color:var(--muted)}
.cnd-note.ok{background:var(--green-bg);color:var(--green)}
.cnd-note.warn{background:var(--amber-bg);color:var(--amber-ink)}
.cnd-note.bad{background:var(--rose-bg);color:var(--rose)}
.cnd-note a{color:inherit;font-weight:700}
/* 失敗の帯。**件数と、どこを見ればいいかを同じ行に。** */
.cnd-alert{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:var(--rose-bg);
  border:1px solid var(--rose-line);border-radius:12px;padding:11px 14px;margin:0 0 12px;
  font-size:12px;color:var(--rose)}
.cnd-alert b{font-size:12.5px}
.cnd-alert span{color:var(--muted)}
.cnd-alert a{margin-left:auto;color:var(--rose);font-weight:700;white-space:nowrap}
/* 引っ越した設定への入口。**何がどこへ行ったかを書く。** */
.cnd-more{display:block;background:var(--card);border:1px solid var(--border);
  border-radius:12px;padding:12px 15px;text-decoration:none;color:inherit;margin-top:14px}
.cnd-more:hover{border-color:var(--teal-line)}
.cnd-more b{display:block;font-size:12.5px;color:var(--teal)}
.cnd-more span{display:block;font-size:11px;color:var(--muted);line-height:1.7;margin-top:2px}
.cnd-legal{margin:12px 0 0;font-size:10.5px;color:var(--muted);line-height:1.8}
/* LINEのQR。**枠の中に収める** — 大きいまま置くと、この1枚だけ別の画面に見える。 */
.cnd-qr{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:4px;
  background:var(--gray-bg);border-radius:10px;padding:12px}
.cnd-qr .qr{width:132px;height:132px;background:#fff;border-radius:8px;padding:6px;
  display:flex;align-items:center;justify-content:center}
.cnd-qr .qr svg{width:100%;height:100%;display:block}
.cnd-qr p{margin:0;font-size:10.5px;color:var(--muted);line-height:1.7;text-align:center}
.cnd-qr .btn-line{display:inline-flex;align-items:center;justify-content:center;
  background:#06c755;color:#fff;border-radius:9px;padding:9px 14px;font-size:12.5px;
  font-weight:700;text-decoration:none}
/* ── ブランド設定（UIモック）────────────────────────────────────────────── */
/* 3列。カードは中身ぶんの高さで、伸ばして揃えない（空きが「未設定」に見える）。 */
.bp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
@media (max-width:1100px){.bp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.bp-grid{grid-template-columns:1fr}}
.bp-card{padding:15px 16px 16px;display:flex;flex-direction:column;gap:10px}
.bp-card h3{margin:0;font-size:13.5px;font-weight:800;color:var(--ink)}
.bp-sub{margin:-6px 0 2px;font-size:11px;color:var(--muted);line-height:1.6}
.bp-wide{grid-column:1/-1}
.bp-ta{width:100%;box-sizing:border-box;border:1px solid var(--border);border-radius:9px;
  padding:9px 11px;font:inherit;font-size:12.5px;line-height:1.7;background:var(--card);
  color:var(--ink);resize:vertical}
/* 目盛り。両端と真ん中に言葉を置く — 数字だけだと 70 が何なのか読めない。 */
.bp-axis{display:flex;flex-direction:column;gap:3px}
.bp-axl{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted)}
.bp-axl b{color:var(--ink);font-weight:700}
.bp-axis input[type=range]{width:100%;accent-color:var(--teal)}
.bp-axis input[data-unset]{opacity:.55}
/* 良い例・避ける例。**どちらも実データから作る**（作り話を例に出さない）。 */
.bp-ex{border:1px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;
  flex-direction:column;gap:9px;font-size:11.5px;line-height:1.7}
.bp-exg b{color:var(--green)}.bp-exb b{color:var(--rose)}
.bp-ex b{display:block;font-size:11px;margin-bottom:2px}
.bp-ex i{display:block;font-style:normal;font-size:10px;color:var(--muted);margin-top:2px}
/* 札。区分ごとに色を変える — 必須・推奨・禁止が同じ形だと、並べる意味が無い。 */
.bp-tag{display:inline-flex;align-items:center;gap:5px;padding:3px 4px 3px 9px;
  border-radius:8px;font-size:11.5px;font-weight:700;border:1px solid transparent}
.bp-tag form{display:inline;margin:0}
.bp-tag button{border:none;background:none;cursor:pointer;color:inherit;opacity:.5;
  font-size:11px;padding:0 3px;line-height:1}
.bp-tag button:hover{opacity:1}
.bp-tag.must{background:var(--teal-soft);color:var(--teal);border-color:var(--teal-line)}
.bp-tag.sug{background:var(--green-bg);color:var(--green);border-color:var(--green-line)}
.bp-tag.ban{background:var(--rose-bg);color:var(--rose);border-color:var(--rose-line)}
.bp-tag.warn{background:var(--amber-bg);color:var(--amber-ink);border-color:var(--amber-line)}
.bp-tgs{display:flex;flex-wrap:wrap;gap:6px}
.bp-tg{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}
.bp-tgh{font-size:11.5px;font-weight:800;color:var(--ink)}
.bp-tgh span{font-weight:400;color:var(--muted);margin-left:6px;font-size:10.5px}
.bp-ngh{font-size:11.5px;font-weight:800;margin-top:2px}
.bp-ngh .ban{color:var(--rose)}.bp-ngh .warn{color:var(--amber-ink)}
/* 追加の行。入力が伸び、区分のボタンは文字ぶん。 */
.bp-add{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.bp-add .inp{flex:1 1 130px;min-width:0;border:1px solid var(--border);border-radius:8px;
  padding:8px 10px;font:inherit;font-size:12px;background:var(--card);color:var(--ink)}
.bp-btn{flex:0 0 auto;border-radius:8px;padding:8px 11px;font:inherit;font-size:11.5px;
  font-weight:700;cursor:pointer;background:var(--card);border:1px solid var(--border);
  color:var(--ink)}
.bp-btn.must{color:var(--teal);border-color:var(--teal-line)}
.bp-btn.sug{color:var(--green);border-color:var(--green-line)}
.bp-btn.ban{color:var(--rose);border-color:var(--rose-line)}
.bp-btn.warn{color:var(--amber-ink);border-color:var(--amber-line)}
/* ロゴの3枠。押すとファイル選択が開く（枠そのものが入口）。 */
.bp-logos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.bp-lgbox{position:relative;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:2px;height:78px;border:1px dashed var(--border);border-radius:10px;
  background:var(--gray-bg);cursor:pointer;overflow:hidden;padding:6px;text-align:center}
.bp-logo.on .bp-lgbox{border-style:solid;background:var(--card)}
.bp-lgbox img{max-width:100%;max-height:100%;object-fit:contain}
.bp-lgbox input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.bp-lgbox form{display:contents}
.bp-lgt{font-size:11px;font-weight:700;color:var(--ink);line-height:1.4}
.bp-lgs,.bp-lgf{font-size:9.5px;color:var(--muted);line-height:1.4}
.bp-lgf{display:block;text-align:center;margin-top:4px}
.bp-logo .bp-lgbox>form:last-of-type{position:static}
.bp-logo form[action$='delete']{position:absolute;top:3px;right:3px;z-index:2;display:block}
.bp-logo form[action$='delete'] button{border:none;background:var(--card);border-radius:6px;
  width:18px;height:18px;font-size:10px;cursor:pointer;color:var(--muted);line-height:1}
/* 目安の但し書き。**実測ではないと書く。** */
.bp-note{margin:2px 0 0;font-size:10.5px;color:var(--muted);line-height:1.75;
  background:var(--gray-bg);border-radius:9px;padding:9px 11px}
.bp-note b{color:var(--ink)}
.bp-card .inp{width:100%;box-sizing:border-box;border:1px solid var(--border);
  border-radius:8px;padding:8px 10px;font:inherit;font-size:12.5px;background:var(--card);
  color:var(--ink)}
.bp-2col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:start}
@media (max-width:860px){.bp-2col{grid-template-columns:1fr}}
/* 媒体別の上限。印は媒体の色 — どの行がどの媒体かを、名前を読む前に決める。 */
.bp-cap{display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid var(--border);
  border-radius:9px;margin-bottom:7px;font-size:11.5px}
.bp-capd{width:8px;height:8px;border-radius:50%;flex:none}
.bp-cap b{flex:0 0 74px;font-weight:700}
.bp-cap input[type=range]{flex:1;min-width:0;accent-color:var(--teal)}
.bp-cap i{flex:0 0 62px;text-align:right;font-style:normal;color:var(--muted);
  font-variant-numeric:tabular-nums}
/* ── 承認画面（UIモック） ───────────────────────────────────────────────── */
/* 右側はひとつの器。**投稿と、それを決めるための材料が同じ紙の上にある**ことを
   枠で言う（前は地の上に散っていて、どこまでが1本ぶんか読めなかった）。 */
.rv-dr.split{background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:15px 17px 17px;gap:14px}
/* プレビューの見出しは**箱の中の帯**にする。外に浮かせると、どの箱の名前なのか
   （本文か、下の材料か）が読み手の推測になる。 */
.rv-dr.split .rv-pvcap{margin:0;padding:9px 13px;background:var(--gray-bg);
  border:1px solid var(--border);border-bottom:none;border-radius:12px 12px 0 0;
  font-size:10.5px;letter-spacing:.05em}
.rv-dr.split .rv-pvcap+.rv-pv,.rv-dr.split .rv-pvcap+.rv-ig{border-top-left-radius:0;
  border-top-right-radius:0}
.rv-dr.split .rv-2a{display:block}
.rv-dr.split .rv-2a>*{margin-top:14px}
.rv-dr.split .rv-2a>:first-child,.rv-dr.split .rv-pvcap+*{margin-top:0}
/* 節の見出しは同じ組みに（AIの提案理由 / コメント）。 */
.rv-dr.split .rv-th{margin:0;border-top:none;padding-top:0}
.rv-dr.split .th-hd{font-size:12px;font-weight:800;margin-bottom:8px}
/* 書き込みは1件ずつ箱に入れる。名前と時刻が上、本文が下。 */
.rv-dr.split .th-i{background:var(--gray-bg);border-radius:10px;padding:9px 11px;
  margin-bottom:8px}
/* 判断は1行。承認だけ幅を取り、残りの3つは文字ぶん。 */
.rv-actrow{display:flex;align-items:stretch;gap:4px;flex-wrap:wrap}
/* 承認は残りぜんぶを取る。**ただし字より狭くはしない** — `flex-basis` に固定値を置くと
   縮んで文字が箱からはみ出した（描いて分かった）。 */
.rv-actrow>form{flex:1 1 auto;min-width:min-content;margin:0}
.rv-actrow .rv-primary{width:100%;padding:9px 10px;font-size:12px}
.rv-actrow>.rv-primary{flex:1 1 auto;min-width:min-content}
.rv-actrow>a.rv-btn{flex:0 0 auto;white-space:nowrap;padding:8px 8px;font-size:11px;gap:3px}
.rv-actrow>a.rv-btn svg{width:12px;height:12px}
/* 押せないときは**灰色**にする（一括承認と同じ）。薄い紫のままだと、押せるものが
   単に薄いだけに見える。 */
/* 主ボタンは**濃い紫の塗り**。地と文字は入れ替わる対（--teal-deep / --card）なので、
   どちらのテーマでも「濃い地に薄い字」が保たれる。色は置き場所に依らない
   （承認画面の足元でも、ページの見出しでも同じ）。 */
.rv-primary{background:var(--teal-deep);color:var(--card);box-shadow:none}
.rv-primary:disabled{background:var(--gray-bg);color:var(--muted);
  opacity:1;box-shadow:none;cursor:not-allowed}
/* 微修正＝自分で直す（琥珀）、修正依頼＝AIに頼む（素）、却下＝出さない（赤）。
   **3つを1色にすると、取り返しの付く操作とそうでない操作が形で読めない。** */
.rv-actrow .rv-tweak{color:var(--amber-ink);border-color:var(--amber-line)}
.rv-actrow .rv-tweak:hover{background:var(--amber-bg)}
.rv-actrow .rv-rej{color:var(--rose);border-color:var(--rose-line)}
.rv-actrow .rv-rej:hover{background:var(--rose-bg)}
/* 送信も承認と同じ濃い紫（モック）。同じ「送る」操作なので色を分ける理由がない。 */
.rv-dr.split .th-f .rv-btn{background:var(--teal-deep);color:var(--card);box-shadow:none}
/* 押せない一括承認は**押せないように見せる**。出すことと、押せることは別。 */
#rvzgo:disabled{background:var(--gray-bg);color:var(--muted);border-color:var(--border);
  box-shadow:none;cursor:not-allowed}
/* 題の下の1行の中のリンク。 */
.op-sublink{color:var(--teal);font-weight:700;text-decoration:none}
.op-sublink:hover{text-decoration:underline}
/* #rvlive は AJAX の差し替え先。ここが本文とフッターの両方を包むので、縦の器はこの要素。 */
.rv-mo>#rvlive{display:flex;flex-direction:column;min-height:0;flex:1}
.rv-mo .mg-main{container-type:inline-size;padding:16px 20px}
/* 左＝出る姿、右＝決めるための材料。**器の幅**で切り替える（画面幅ではない）。 */

.rv-mo .rv-why{margin:0 0 12px}
/* 画像は確認用に抑える。1:1の全高を使うと、承認する本文が畳の外に出た（実測）。 */
.rv-mo .rv-ig-img,.rv-mo .rv-ig-ph{aspect-ratio:auto;height:248px}
.rv-mo .rv-ig-img img{width:100%;height:100%;object-fit:cover;display:block}
/* 足元は判断の3つだけ（UIモック）。承認画面と同じ器（`.rv-actrow`）を使う。
   **幅は帯そのものが決める** — 以前は画面幅の media query で切り替えていたので、
   1400px の画面に開いた 520px の帯では横1列のままになり、3つが縦に積まれて足元が
   画面の外に出ていた（本番で実測）。器の幅で決まる形にして、media query を外した。 */
.mg-foot .rv-actrow.foot{flex:1;min-width:0}
.rv-actrow.foot>a.rv-btn{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.rv-actrow.foot .rv-primary{min-height:42px}
/* プレビューの下の「直す」道具（微修正・写真）。**足元は「決める」、ここは「直す」。** */
.rv-bodytools{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.rv-bodytools>*{margin:0}
@media (max-width:860px){
  .rv-mo{inset:0;top:0;left:0;transform:none;width:100%;max-height:none;border-radius:0}
  /* 横1列だと承認(230px)と3つが同じ行に収まらず、3つが縦に積まれて**フッターが画面の
     外に出た**（375px で実測）。段にする: 承認を1行、3つで1行。 */
  /* 狭いときは `.mg-main` の縦スクロールが切ってあるので、フッターが2段になったぶん
     `.rv-mo` の overflow:hidden に食われて**下が見えなくなった**（375px で実測）。
     モーダルの中だけは本文側を送って、フッターは必ず残す。 */
  .rv-mo .mg-main{overflow-y:auto;min-height:0}
  .rv-actrow.foot{flex-wrap:wrap}
  .rv-actrow.foot>form{flex:1 1 100%}
  .rv-actrow.foot>a.rv-btn{flex:1 1 0}
}
/* ダッシュボード帯（仕様 13-1 ①）。板の**上**に置き、承認までのクリックを増やさない。
   3枚を1行に並べ、狭いときは積む。器の幅で切り替える（画面幅ではない）。 */
.dashwrap{container-type:inline-size;margin-bottom:14px}
.dash{display:grid;gap:10px;grid-template-columns:minmax(0,1fr)}
@container (min-width:720px){.dash{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dbcard{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:11px 13px}
.dbh{margin:0 0 8px;font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.04em}
.dbrow{display:flex;gap:8px;flex-wrap:wrap}
.dbstat{flex:1;min-width:88px;display:flex;flex-direction:column;gap:1px;padding:7px 9px;
  border-radius:10px;background:var(--surface);border:1px solid var(--border);
  text-decoration:none;color:inherit}
a.dbstat:hover{border-color:var(--teal-line)}
.dbv{font-size:21px;font-weight:800;color:var(--ink);line-height:1.15;font-variant-numeric:tabular-nums}
.dbv i{font-style:normal;font-size:11.5px;font-weight:700;color:var(--muted);margin-left:2px}
.dbk{font-size:10.5px;font-weight:700;color:var(--muted)}
.dbs{font-size:10px;color:var(--muted);line-height:1.5}
/* 止まっている投稿は数字を赤で。**0本のときは赤くしない**（常に赤いと信号として死ぬ）。 */
.dbstat.warn{background:#fdf2f2;border-color:#f0d4d5}
.dbstat.warn .dbv{color:var(--rose)}
html.dark .dbstat.warn{background:#3a1d22;border-color:#5e2b33}
/* 設定の食い違いを、その場で選んで直す。選択肢は推測せず並べるだけ。 */
.fixrow{border-top:1px solid var(--border);padding-top:11px;margin-top:11px}
.fixrow:first-of-type{border-top:none;padding-top:0;margin-top:8px}
.fixh{font-size:13px;font-weight:800;color:var(--ink);margin-bottom:2px}
.fixopts{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.fixopts .rv-btn{justify-content:flex-start;gap:8px;text-align:left;word-break:break-all}
/* 列の足元。片付けと、戻す口。**戻す口を必ず併記する** — 隠したのか消えたのかが
   分からなくなると、次からこのボタンは押されない。 */
.tidy-bar{display:flex;flex-direction:column;gap:5px;margin-top:9px;padding-top:8px;
  border-top:1px solid var(--border)}
.tidy{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0}
.tidy-b{border:1px solid var(--border);background:var(--card);color:var(--muted);
  font:inherit;font-size:11px;font-weight:700;border-radius:7px;padding:4px 9px;cursor:pointer}
.tidy-b:hover{background:var(--gray-bg);color:var(--ink)}
.tidy-n{font-size:10.5px;color:var(--muted);line-height:1.5}
/* 作成で折れた企画の札。下書きがまだ無いので、読める材料は「何を・誰に・なぜ折れたか」
   だけ。板の札のCSSは .hxhead を前提にしているが、ここは開くものが無いので独自に組む。 */
.idea-in{display:flex;flex-direction:column;gap:7px;padding:11px 12px}
/* `.hrow-t` の `flex:1 1 9em` は**横並びの行**のために書かれている（題が残り幅を取る）。
   この札は縦並びなので、そのままだと題が**札の高さいっぱいに伸びる**（札が広がったときに
   題の下に113pxの空白ができた）。ここでは伸ばさない。 */
.idea-in .hrow-t{flex:0 0 auto}
.idea-why{margin:0;font-size:11.5px;color:var(--muted);line-height:1.65}
.idea-acts{display:flex;align-items:center;gap:8px;margin-top:2px}
.idea-acts form{display:contents}
.idea-acts .rv-btn{flex:1}
/* 作成で折れた企画の印。 */
.srcchip.idea-bad{color:var(--rose);background:#fdf2f2;border-color:#f0d4d5}
html.dark .srcchip.idea-bad{background:#3a1d22;border-color:#5e2b33}
/* AIの審査。通したことも、通したうえで残った指摘も出す箱。 */
.rv-rvw{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:11px 12px;
  display:flex;flex-direction:column;gap:8px}
.rv-rvw-h{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;color:var(--ink)}
.rv-rvw-l{display:flex;flex-wrap:wrap;gap:6px}
.rv-rvw-c{margin:0;padding-left:17px;font-size:11.5px;color:var(--ink);line-height:1.7}
.rv-rvw-c b{display:block;color:var(--amber-ink)}
.rv-rvw-n{margin:0;font-size:11px;color:var(--muted);line-height:1.6}
/* 列数は中身で変わる（投稿アイデアは中身が無い週は出ない）。`auto-fit` は使えない —
   件数バーが全トラックに跨るせいで空トラックが畳まれず、右に1列ぶんの余白が残る
   （実測: 1280pxで6トラック × 203px、板は1088pxで終わっていた）。列数は明示する。 */
@container (min-width:820px){
  .board{align-items:start}
  .board.cols-1{grid-template-columns:minmax(0,1fr)}
  .board.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .board.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
  .board.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .board.cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}
}
/* 板のときはカード、狭いときは今までの行。並びはCSSが決める。 */
@container (min-width:820px){
  .bcards .hxr{border:1px solid var(--border);border-radius:12px;background:var(--card);overflow:hidden}
  .bcards .hxhead{flex-direction:column;align-items:stretch;gap:0;padding:0}
  .bcards .thmb{width:100%;height:104px;border-radius:0}
  .bcards .hx-mid{padding:9px 10px;display:block}
  .bcards .hx-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}
  .bcards .hxchev{display:none}
  .bcards .hrow-t{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  /* 1列だけの板（ホームの投稿アイデア）では札を横に敷き詰める。列が1つだと札が画面幅
     いっぱいに伸びて、1件でも巨大な箱になる。 */
  .board.cols-1 .bcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));
    align-items:start}
  /* 一覧のかんばんは状態ぶん列が出る（最大5つ）。本文の幅は右のパネルぶん狭いので、
     5列だと1列163pxまで潰れて札が読めなくなった（実測）。**潰さずに横へ流す。**
     （`overflow-x` は `@container` の外に置く — `.boardwrap` 自身がコンテナなので、
     コンテナクエリの中に書いても**自分には当たらない**。実測で visible のままだった。） */
  .boardwrap.wide .board.cols-3{grid-template-columns:repeat(3,minmax(232px,1fr))}
  .boardwrap.wide .board.cols-4{grid-template-columns:repeat(4,minmax(228px,1fr))}
  .boardwrap.wide .board.cols-5{grid-template-columns:repeat(5,minmax(218px,1fr))}
}
/* ── 板の札を立体にする ──────────────────────────────────────────────
   奥行きは影だけでは出ない。**視点（perspective）は器の側**に置く。札自身に付けると
   札の「子」が立体になるだけで、札そのものは平らのまま浮かない（container-type と同じ罠）。
   狭いときの行には掛けない — 密な一覧が傾くと読みづらくなるだけ。 */
@container (min-width:820px){
  .bcards{perspective:1200px}
  .bcards .hxr{position:relative;
    background-image:linear-gradient(180deg,rgba(255,255,255,.9),rgba(94,43,94,.05));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 1px 1px rgba(40,20,45,.05),
               0 10px 20px -10px rgba(40,20,45,.3);
    transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .24s ease,border-color .24s ease}
  /* --tx/--ty はカーソル追従（app.js）が入れる。JSが無い・動きを減らす設定なら既定値で
     わずかに傾くだけ — **立体はJSの有無に関わらず成立させる。** */
  .bcards .hxr:hover,.bcards .hxr:focus-within{
    transform:translate3d(0,-5px,26px) rotateX(var(--tx,2.5deg)) rotateY(var(--ty,0deg));
    border-color:var(--teal-line);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 2px 4px rgba(40,20,45,.06),
               0 26px 44px -18px rgba(94,43,94,.45)}
  /* 面が動いたことを光で伝える。掃くのはサムネの高さぶんだけ（本文の上は通さない）。 */
  .bcards .hxr::after{content:"";position:absolute;inset:0 0 auto;height:104px;pointer-events:none;
    background:linear-gradient(104deg,transparent 38%,rgba(255,255,255,.34) 50%,transparent 62%);
    transform:translateX(-125%);transition:transform .55s ease}
  .bcards .hxr:hover::after,.bcards .hxr:focus-within::after{transform:translateX(125%)}
  .bcards .lf.now{animation:lfpulse 2.6s ease-in-out infinite}
}
@container (min-width:820px){
  html.dark .bcards .hxr{
    background-image:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,.13));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 1px 1px rgba(0,0,0,.5),
               0 12px 24px -12px rgba(0,0,0,.75)}
  html.dark .bcards .hxr:hover,html.dark .bcards .hxr:focus-within{
    box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 2px 4px rgba(0,0,0,.5),
               0 28px 48px -18px rgba(0,0,0,.9)}
}
/* 光るのは「いまここ」の点だけ。全部光らせると、どこが今なのか分からなくなる。 */
@keyframes lfpulse{0%,100%{box-shadow:0 0 0 3px var(--teal-soft),0 0 5px 0 var(--teal)}
  50%{box-shadow:0 0 0 3px var(--teal-soft),0 0 13px 2px var(--teal)}}
@media (prefers-reduced-motion:reduce){
  .bcards .hxr,.bcards .hxr::after{transition:none}
  .bcards .hxr:hover,.bcards .hxr:focus-within{transform:none}
  .bcards .hxr:hover::after,.bcards .hxr:focus-within::after{transform:translateX(-125%)}
  .bcards .lf.now{animation:none}
}
.thmb{width:44px;height:44px;border-radius:9px;overflow:hidden;flex-shrink:0;background:var(--gray-bg);display:block}
.thmb img{width:100%;height:100%;object-fit:cover;display:block}
.thmb.none{background:repeating-linear-gradient(135deg,var(--gray-bg),var(--gray-bg) 6px,var(--surface) 6px,var(--surface) 12px)}
.srcchip{font-size:10px;font-weight:700;color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:2px 8px;white-space:nowrap}
/* 一覧の3札: 出所 / 状態 / 審査。srcchip（企画の理由）と同じ寸法で、色だけで役割を分ける。 */
.ogchip,.stchip,.scchip{font-size:10px;font-weight:800;border-radius:99px;padding:2px 8px;
  white-space:nowrap;border:1px solid transparent;line-height:1.6}
/* 出所（UIモック）: 3つとも**面のある札**にして、色で見分ける。以前は「AI生成は多数派
   なので静かに」と枠線だけにしていたが、列に並ぶと札の形が揃わず、ソースの列だけ
   歯抜けに見えた。地はどれも淡いので、うるさくはならない。 */
.ogchip.ai{color:var(--violet);background:color-mix(in srgb, var(--violet) 12%, var(--card));
  border-color:color-mix(in srgb, var(--violet) 26%, var(--card))}
.ogchip.inhouse{color:var(--green);background:var(--green-bg);border-color:var(--green-line)}
.ogchip.pro{color:var(--teal);background:var(--teal-soft);border-color:var(--teal-line)}
/* 状態: 列の見出しと同じ語。承認待ちだけ少し強く（唯一「人の手番」なので）。 */
.stchip.wait{color:var(--teal-deep);background:var(--teal-soft);border-color:var(--teal-line)}
.stchip.work{color:var(--amber-ink);background:var(--amber-bg);border-color:var(--amber-line)}
.stchip.sched,.stchip.done{color:var(--muted);background:var(--gray-bg);border-color:var(--border)}
.stchip.stop{color:var(--rose);background:#fdf2f2;border-color:#f0d4d5}
/* 審査: 数字は等幅で（0.9 と 0.62 が並んでも桁が揺れない）。 */
.scchip{font-variant-numeric:tabular-nums;color:var(--muted);background:var(--gray-bg);border-color:var(--border)}
.scchip.ok{color:var(--teal-deep);background:var(--teal-soft);border-color:var(--teal-line)}
.scchip.warn,.scchip.hold{color:var(--amber-ink);background:var(--amber-bg);border-color:var(--amber-line)}
.scchip.bad{color:var(--rose);background:#fdf2f2;border-color:#f0d4d5}
html.dark .ogchip.pro,html.dark .stchip.work,html.dark .scchip.warn,html.dark .scchip.hold{background:var(--amber-line)}
html.dark .stchip.stop,html.dark .scchip.bad{background:#3a2226;border-color:#5a3238}
.life{display:inline-flex;gap:3px;align-items:center;flex-shrink:0}
.lf{width:6px;height:6px;border-radius:50%;background:var(--border)}
.lf.done{background:var(--teal-line)}
.lf.now{background:var(--teal);box-shadow:0 0 0 3px var(--teal-soft)}
.lf.bad{background:var(--rose);box-shadow:0 0 0 3px var(--gray-bg)}
@media(max-width:640px){.srcchip{display:none}   /* 企画の理由は開けば読める */
  /* 出所・状態・審査は狭い画面でも残す — 一覧の判断材料そのもの */
  .ogchip,.stchip,.scchip{font-size:9.5px;padding:2px 7px}}
.ph{margin-top:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:10px 13px}
.ph>summary{cursor:pointer;font-size:12px;font-weight:800;color:var(--ink);list-style:none}
.ph>summary::-webkit-details-marker{display:none}
.ph>summary::before{content:"▸ ";color:var(--muted)}
.ph[open]>summary::before{content:"▾ "}
.ph-why{margin:9px 0 0;font-size:11.5px;line-height:1.6}
.ph-why b{display:block;color:var(--ink)}
.ph-why span{color:var(--muted)}
.ph-row{display:grid;grid-template-columns:78px 76px 1fr auto;gap:8px;align-items:baseline;
  font-size:11px;padding:4px 0;border-top:1px solid var(--border)}
.ph-t{color:var(--muted);font-family:ui-monospace,Menlo,monospace;font-size:10px}
.ph-w{font-weight:700;color:var(--ink)}
.ph-n{color:var(--muted);overflow:hidden;text-overflow:ellipsis}
.ph-ms{color:var(--muted);font-family:ui-monospace,Menlo,monospace;font-size:10px}
.ph-mets{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.ph-m{background:var(--card);border:1px solid var(--border);border-radius:9px;padding:5px 9px;min-width:74px}
.ph-m .k{display:block;font-size:9.5px;color:var(--muted)}
.ph-m .v{font-size:13px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums}
.ph-m .v.un{font-size:11px;font-weight:700;color:var(--muted)}
.ph-foot{margin-top:8px;font-size:10px;color:var(--muted);line-height:1.5}
/* 24h/72h/7d の時点。横に並べて**伸びが読める**ようにする（縦に積むと差が見えない）。 */
.ph-mks{display:flex;flex-wrap:wrap;gap:7px;margin-top:8px}
.ph-mk{background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:6px 10px;min-width:104px}
.ph-mk b{font-size:11.5px;font-weight:800;color:var(--teal)}
.ph-mk-a{display:block;font-size:9.5px;color:var(--muted);margin-bottom:3px}
.ph-mk-n{display:flex;justify-content:space-between;gap:10px;font-size:11.5px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.ph-mk-n i{font-style:normal;font-weight:600;color:var(--muted)}
.ph-mk-r{display:block;font-size:9.5px;color:var(--muted);margin-top:2px}
.rv-done .rv-ex{width:100%;justify-content:center;margin-bottom:8px}
.rv-ex.on{background:var(--amber-bg);color:var(--amber-ink);border-color:var(--amber-line)}
.rv-unres{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 9px;margin:0 0 11px;padding:9px 12px;border-radius:10px;background:var(--amber-bg);border:1px solid var(--amber-line)}
.rv-unrk{font-weight:700;font-size:12.5px;color:var(--amber-ink)}
.rv-unrs{font-size:12.5px;color:var(--ink)}
.rv-unrwhy{flex:1 0 100%;font-size:11.5px;color:var(--muted)}
.rv-why{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin:0 0 11px;padding:9px 12px;background:var(--surface);border:1px solid var(--border);border-radius:10px}
.rv-whyk{font-size:10.5px;font-weight:800;color:var(--gray-ink);white-space:nowrap}
.wp-why.why-event b,.wp-why.why-event>svg{color:var(--teal)}
.wp-why.why-kpi b,.wp-why.why-kpi>svg{color:var(--green)}
.wp-why.why-season b,.wp-why.why-season>svg{color:var(--amber-ink)}
.wp-why.why-balance b,.wp-why.why-balance>svg{color:var(--gray-ink)}
.wp-why.why-news b,.wp-why.why-news>svg{color:var(--info)}
.wp-why.competitor b,.wp-why.competitor>svg{color:var(--violet)}
.wp-why.listening b,.wp-why.listening>svg{color:var(--rose)}
.wp-evtag{display:inline-flex;align-items:center;font-size:10px;font-weight:800;color:var(--teal);background:var(--teal-soft);border:1px solid var(--teal-line);border-radius:5px;padding:0 5px;margin-left:1px;flex-shrink:0;font-variant-numeric:tabular-nums}
.wp-st{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;border-radius:99px;padding:5px 11px;white-space:nowrap;justify-self:end}
.wp-st.plan{color:var(--gray-ink);background:var(--gray-bg);border:1px solid var(--border)}
.wp-st.making{color:var(--teal);background:var(--teal-soft);border:1px solid var(--teal-line)}
.wp-st.await{color:var(--amber-ink);background:var(--amber-bg);border:1px solid var(--amber-line);padding-right:5px}
.wp-st.sched{color:var(--green);background:var(--green-bg);border:1px solid var(--green-line)}
.wp-st.off{color:var(--gray-ink);background:transparent;border:1px dashed var(--border)}
.wp-st.off.rej{color:var(--rose);border-color:var(--rose)}   /* 却下 is actionable — don't gray it out */
.wp-confirm{display:inline-flex;align-items:center;gap:3px;background:var(--amber-ink);color:#fff;border:none;font:inherit;font-size:11px;font-weight:800;border-radius:99px;padding:3px 9px 3px 10px;cursor:pointer;margin-left:2px;text-decoration:none}
.wp-confirm:hover{filter:brightness(1.06)}
.wp-pulse{width:7px;height:7px;border-radius:50%;background:var(--teal);position:relative}
.wp-pulse::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--teal);opacity:.4;animation:wpPulse 1.4s ease-out infinite}
@keyframes wpPulse{0%{transform:scale(.6);opacity:.5}100%{transform:scale(1.8);opacity:0}}
.wp-shimmer{display:inline-block;height:10px;border-radius:4px;width:62%;background:linear-gradient(90deg,#eef1f5 25%,#e3e8ef 37%,#eef1f5 63%);background-size:320px 100%;animation:wpShim 1.3s linear infinite}
@keyframes wpShim{to{background-position:-320px 0}}
@media (prefers-reduced-motion:reduce){.wp-pulse::after,.wp-shimmer{animation:none}.wp-caret{transition:none}}
.wp-foot{display:flex;align-items:center;gap:12px;padding:12px 18px;background:var(--surface);border-top:1px solid var(--border)}
.wp-foot .hint{font-size:11px;color:var(--muted);line-height:1.5;display:flex;align-items:center;gap:6px}
.wp-foot .sp{flex:1}
.wp-foot a{font-size:12.5px;font-weight:700;color:var(--teal);text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:4px}
.wp-foot a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:560px){
  .wp-head{grid-template-columns:1fr}
  .wp-head-right{flex-direction:row;align-items:center;justify-content:space-between}
  .wp-row{grid-template-columns:1fr auto;gap:8px 10px;padding:12px 14px}
  .wp-chan{grid-column:1}.wp-st{grid-column:2;grid-row:1}.wp-mid{grid-column:1/3}
  .wp-foot{flex-direction:column;align-items:flex-start;gap:8px}
  /* App bar: the long wordmark wrapped mid-character on phones. Hide it (the AI tile is the brand
     mark + links home) and keep the page crumb for context, clamped so the bar never wraps. */
  .bname{display:none}
  .brand{min-width:0}
  .crumb{margin-left:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:60vw}
}