/* app.css — v4 デザインシステム移植(SPEC-FIX-13 §8・モック忠実化)
   正本 = specs/fix/SPEC-FIX-13_日報サイト_統合v4.html の <style>。CSP: script-src 'self' 維持。
   フォントは **self-host**(fonts/*.woff2・独立監査 H1 で Google Fonts CDN 依存を排除=外部接続ゼロ)。 */

  /* ===== self-hosted webfonts(独立監査 H1: 未ログイン初期表示の第三者接続を排除・見た目は維持) =====
     出典: Fontsource(@fontsource, SIL Open Font License)。japanese=全字カバー(catch-all)/
     latin=ラテンを上書き(同一書体ゆえ overlap は視覚的に無害)。src は app.css 相対 = /static/fonts/。 */
  @font-face{font-family:'Zen Kaku Gothic New';font-style:normal;font-weight:400;font-display:swap;
    src:url('fonts/zen-kaku-gothic-new-japanese-400-normal.woff2') format('woff2')}
  @font-face{font-family:'Zen Kaku Gothic New';font-style:normal;font-weight:500;font-display:swap;
    src:url('fonts/zen-kaku-gothic-new-japanese-500-normal.woff2') format('woff2')}
  @font-face{font-family:'Zen Kaku Gothic New';font-style:normal;font-weight:700;font-display:swap;
    src:url('fonts/zen-kaku-gothic-new-japanese-700-normal.woff2') format('woff2')}
  @font-face{font-family:'Yusei Magic';font-style:normal;font-weight:400;font-display:swap;
    src:url('fonts/yusei-magic-japanese-400-normal.woff2') format('woff2')}
  @font-face{font-family:'Zen Kaku Gothic New';font-style:normal;font-weight:400;font-display:swap;
    src:url('fonts/zen-kaku-gothic-new-latin-400-normal.woff2') format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
  @font-face{font-family:'Zen Kaku Gothic New';font-style:normal;font-weight:500;font-display:swap;
    src:url('fonts/zen-kaku-gothic-new-latin-500-normal.woff2') format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
  @font-face{font-family:'Zen Kaku Gothic New';font-style:normal;font-weight:700;font-display:swap;
    src:url('fonts/zen-kaku-gothic-new-latin-700-normal.woff2') format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
  @font-face{font-family:'Yusei Magic';font-style:normal;font-weight:400;font-display:swap;
    src:url('fonts/yusei-magic-latin-400-normal.woff2') format('woff2');
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

  /* ===== shared design system(shell と同一) ===== */
  :root{
    --paper:#F1EBDF; --sheet:#FBF8F1; --sheet-2:#FFFFFF;
    --kraft:#E7DECD; --kraft-deep:#DCD0B9;
    --ink:#2C2A26; --ink-soft:#6B6459; --ink-faint:#9A9384;
    --line:rgba(44,42,38,.15);
    --green:#5F8C5A; --green-deep:#4C7547;
    --amber:#E6A52E; --amber-deep:#B17F18;
    --clay:#C2674C; --blue:#5E7DB0; --lavender:#8A7CB8;
    --focus:#3F6E2E; --radius:14px;
    --shadow-card:0 14px 34px -26px rgba(44,42,38,.7);
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0;font-family:"Zen Kaku Gothic New",system-ui,sans-serif;
    color:var(--ink);background:var(--paper);line-height:1.65;
    background-image:radial-gradient(circle at 12% 8%,rgba(255,255,255,.45),transparent 40%),
                     radial-gradient(circle at 92% 92%,rgba(0,0,0,.025),transparent 50%);
  }
  .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

  .app-shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
  .tray{background:var(--kraft);border-right:1px solid var(--line);padding:22px 18px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:18px}
  .brand{display:flex;flex-direction:column;gap:2px}
  .brand .mark{width:34px;height:34px;border-radius:10px;background:var(--amber);color:var(--ink);font-family:"Yusei Magic",cursive;font-size:20px;display:flex;align-items:center;justify-content:center;margin-bottom:6px}
  .brand strong{font-family:"Yusei Magic",cursive;font-weight:400;font-size:18px}
  .brand span{font-size:11px;color:var(--ink-soft)}
  nav.tabs{display:flex;flex-direction:column;gap:4px}
  .tab{display:flex;align-items:center;gap:10px;text-align:left;cursor:pointer;background:transparent;border:0;border-radius:10px;padding:10px 12px;font-family:inherit;font-size:14px;color:var(--ink-soft);font-weight:500}
  .tab .n{font-size:11px;font-weight:700;color:var(--ink-soft);min-width:18px}
  .tab:hover{background:rgba(255,255,255,.5);color:var(--ink)}
  .tab[aria-selected="true"]{background:var(--sheet);color:var(--ink);box-shadow:var(--shadow-card)}
  .tab[aria-selected="true"] .n{color:var(--amber-deep)}
  .stage-note{margin-top:auto;background:var(--sheet);border:1px solid var(--line);border-radius:12px;padding:12px 13px}
  .stage-note strong{display:block;font-size:12.5px;margin-bottom:3px}
  .stage-note span{font-size:11.5px;color:var(--ink-soft);line-height:1.5}
  .role-gated-hidden{display:none !important}

  .surface{padding:0}
  .top-strip{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:14px clamp(20px,3vw,40px);border-bottom:1px solid var(--line);background:rgba(251,248,241,.7);backdrop-filter:blur(6px);position:sticky;top:0;z-index:6}
  .top-strip .where{font-size:12.5px;color:var(--ink-soft)}
  .role-switch{display:flex;align-items:center;gap:8px}
  .role-pill{font-size:12px;color:var(--ink-soft);margin-right:4px}
  .role-choice{border:1px solid var(--line);background:var(--sheet);cursor:pointer;border-radius:9px;font-family:inherit;font-size:12.5px;font-weight:700;color:var(--ink-soft);padding:6px 13px;min-height:40px;display:inline-flex;align-items:center;justify-content:center}
  .role-choice:hover{background:#fff}
  .role-choice.active{background:var(--ink);border-color:var(--ink);color:#fff}
  /* 日付ナビ(◀ 前日 / 翌日 ▶ / 今日に戻る)。display 指定が UA の [hidden] に勝つため明示上書き */
  .role-choice[hidden]{display:none}
  .date-arrow{padding-left:11px;padding-right:11px}
  .date-today{color:var(--green-deep);border-color:rgba(95,140,90,.45)}

  .view{display:none;padding:clamp(20px,2.4vw,34px) clamp(20px,3vw,40px) 60px;max-width:1500px}
  /* ガントは横長の表なので画面幅をいっぱいに使う(右の余白を活用) */
  #view-calendar{max-width:none}
  /* 日報を書く画面も幅をいっぱいに使う(行内に一言状況を置くため) */
  #view-employee{max-width:none}
  /* みんなの日報・全員レビューも全幅(窮屈さ解消・AI案/FB入力を広く取る) */
  #view-team{max-width:none}
  #view-admin{max-width:none}
  /* コメント履歴も全幅(右に詳細プレビュー欄を置くため) */
  #view-comments{max-width:none}
  .view.active{display:block}
  .view-head{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:flex-end;justify-content:space-between;margin-bottom:22px}
  .kicker{font-family:"Yusei Magic",cursive;font-size:13px;letter-spacing:.16em;color:var(--green-deep);display:inline-flex;align-items:center;gap:8px;margin:0 0 4px}
  .kicker::before{content:"";width:22px;height:3px;border-radius:3px;background:var(--amber)}
  .view-head h1{font-family:"Yusei Magic",cursive;font-weight:400;font-size:clamp(26px,2.6vw,38px);margin:0;line-height:1.15}
  .view-head h1 .hl{position:relative;white-space:nowrap}
  .view-head h1 .hl::after{content:"";position:absolute;left:-2%;right:-2%;bottom:.05em;height:.4em;background:var(--amber);opacity:.5;border-radius:40% 60% 55% 45%;z-index:-1}
  .lead{margin:8px 0 0;color:var(--ink-soft);font-size:14.5px;max-width:66ch}
  .summary-strip{display:flex;gap:10px}
  .stat-note{background:var(--sheet);border:1px solid var(--line);border-radius:12px;padding:9px 15px;text-align:center;min-width:84px;box-shadow:0 1px 0 rgba(255,255,255,.6) inset}
  .stat-note strong{display:block;font-family:"Yusei Magic",cursive;font-size:21px;line-height:1;color:var(--ink)}
  .stat-note span{font-size:11px;color:var(--ink-soft)}
  .stat-note.done strong{color:var(--green-deep)}

  .sheet{background:var(--sheet);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-card)}
  .btn{font-family:inherit;font-size:13.5px;font-weight:700;cursor:pointer;border-radius:11px;padding:9px 17px;border:1px solid var(--line);background:var(--sheet-2);color:var(--ink);min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px}
  .btn:hover{background:#fbf6ec}
  .btn.primary{background:var(--green);border-color:var(--green);color:#fff}
  .btn.primary:hover{background:var(--green-deep)}
  .btn.ghost{background:transparent;border-style:dashed;color:var(--ink-soft)}
  .btn.ghost:hover{background:rgba(255,255,255,.5);color:var(--ink)}
  .btn.sm{padding:7px 13px;font-size:12px;border-radius:9px;min-height:44px}
  .btn:disabled{opacity:.45;cursor:default}

  .tag{font-size:11px;font-weight:700;letter-spacing:.02em;border-radius:20px;padding:2px 10px;background:rgba(44,42,38,.08);color:var(--ink-soft);display:inline-block}
  .tag.blue{background:rgba(94,125,176,.16);color:var(--blue)}
  .tag.coral{background:rgba(194,103,76,.16);color:var(--clay)}
  .tag.lavender{background:rgba(138,124,184,.18);color:var(--lavender)}
  .tag.amber{background:rgba(230,165,46,.2);color:var(--amber-deep)}
  .tag.green{background:rgba(95,140,90,.18);color:var(--green-deep)}
  .tag.dark{background:var(--ink);color:#fff}

  .status-chip{font-size:11px;font-weight:700;border-radius:20px;padding:2px 11px;background:rgba(44,42,38,.1);color:var(--ink-soft);display:inline-block;white-space:nowrap}
  .status-chip[data-status="進行中"]{background:rgba(94,125,176,.16);color:var(--blue)}
  .status-chip[data-status="待ち"]{background:rgba(194,103,76,.18);color:var(--clay)}
  .status-chip[data-status="完了"]{background:rgba(95,140,90,.22);color:var(--green-deep)}
  .status-chip[data-status="保留"]{background:rgba(138,124,184,.18);color:var(--lavender)}

  .field{display:block;margin-bottom:12px}
  .input,.select,.textarea{width:100%;font-family:inherit;font-size:14px;color:var(--ink);background:var(--sheet-2);border:1px solid var(--line);border-radius:9px;padding:9px 11px}
  .textarea{resize:vertical;line-height:1.6;min-height:60px}
  /* コントラスト:placeholder は ink-soft 以上(#18) */
  .input::placeholder,.textarea::placeholder{color:var(--ink-soft)}
  .hint{font-size:11.5px;color:var(--ink-soft);line-height:1.5}
  .note-box{background:var(--kraft);border:1px solid var(--line);border-radius:12px;padding:13px 15px;font-size:12.5px;color:var(--ink-soft);line-height:1.6}
  .note-box strong{color:var(--ink)}

  /* 表示側の長さ制限(共通): 長い自由文は N 行に畳み、「続きを読む」で全文を開く。
     データは切らない(保存は全文のまま・過去ログ肥大対策 2026-07-10) */
  .txt-clamp{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
  .txt-clamp.is-open{display:block;-webkit-line-clamp:unset}
  .txt-clamp-3{-webkit-line-clamp:3}
  .txt-clamp-6{-webkit-line-clamp:6}
  .txt-more{display:inline-block;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--blue);
    background:transparent;border:0;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px}
  .txt-more:hover{color:var(--ink)}
  .txt-more[hidden]{display:none}

  :focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:5px}
  @media (prefers-reduced-motion: no-preference){
    .btn,.tab,.role-choice,.task-toggle,.emp-toast-act,.emp-mini{transition:background .15s ease,color .15s ease}
  }
  @media (max-width:980px){
    .app-shell{grid-template-columns:1fr}
    .tray{position:static;height:auto;flex-direction:row;flex-wrap:wrap;align-items:center}
    nav.tabs{flex-direction:row;flex-wrap:wrap}
    .stage-note{margin:0}
  }

  /* ===== 02 日報を書く 固有(接頭辞 emp-) ===== */
  .emp-wrap{display:grid;grid-template-columns:minmax(0,1fr) 308px;gap:24px;align-items:start}
  .emp-main{display:flex;flex-direction:column;gap:18px;min-width:0}
  .emp-aside{display:flex;flex-direction:column;gap:16px;position:sticky;top:86px}

  /* お知らせ */
  .emp-notice{display:flex;gap:12px;align-items:flex-start;padding:13px 16px;border-left:4px solid var(--amber)}
  .emp-notice[hidden]{display:none}
  .emp-notice .emp-notice-ic{font-family:"Yusei Magic",cursive;color:var(--amber-deep);font-size:18px;line-height:1.2}
  .emp-notice a{color:var(--green-deep);font-weight:700;text-decoration:underline;text-underline-offset:2px}

  /* 今日バー */
  .emp-todaybar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:13px 18px}
  .emp-todaybar .emp-date{font-weight:700;font-size:14.5px}
  .emp-todaybar .emp-draft{font-size:12.5px;color:var(--ink-soft)}
  .emp-todaybar .emp-bar-hint{flex:1;min-width:220px;font-size:11.5px;color:var(--ink-soft);text-align:right}

  /* ブロックの容器 */
  .emp-block{padding:clamp(16px,1.8vw,22px) clamp(16px,2vw,24px) 20px}
  /* 見出しの右に説明をそのまま横並び(改行しない・名前のすぐ隣で読める) */
  .emp-blockhead{display:flex;flex-direction:row;align-items:baseline;gap:12px;flex-wrap:nowrap;margin-bottom:9px}
  .emp-blockhead h2{margin:0;font-size:16px;font-weight:700;display:flex;align-items:center;gap:9px;flex:none}
  .emp-blockhead h2 .dot{width:9px;height:9px;border-radius:50%;flex:none}
  .emp-blockhead .hint{white-space:nowrap;text-align:left}
  /* 追加ボタン行 */
  .emp-add-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
  .emp-add-row .emp-add{flex:1 1 200px;width:auto;margin-top:0}

  /* 空状態(#10 / #11) */
  .emp-block-empty{font-size:12.5px;color:var(--ink-soft);line-height:1.6;margin:12px 2px 2px;
    background:rgba(94,125,176,.06);border:1px dashed rgba(94,125,176,.3);border-radius:10px;padding:11px 13px}
  .emp-block-empty[hidden]{display:none}

  /* タスク行(B方式:既定1行 + 大きい完了チェック○ + 任意の詳細展開) */
  .emp-tasklist{display:flex;flex-direction:column;gap:11px;margin-top:12px}
  .emp-task{position:relative;background:var(--sheet-2);border:1px solid var(--line);border-radius:13px;box-shadow:0 6px 20px -18px rgba(44,42,38,.6);overflow:hidden}
  /* 左の状態カラーレール(進行中=青 / 待ち=粘土 / 保留=藤 / 完了=緑) */
  .emp-task::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:13px 0 0 13px;background:var(--row-st,var(--blue));z-index:1}
  .emp-task[data-row-status="待ち"]{--row-st:var(--clay)}
  .emp-task[data-row-status="保留"]{--row-st:var(--lavender)}
  .emp-task[data-row-status="完了"]{--row-st:var(--green)}
  .emp-task[data-row-status="進行中"]{--row-st:var(--blue)}
  /* 3セクション化:継続タスク / デイリータスク / 完了 はそれぞれ独立リスト(order/dim 不要・セクション見出しで明示) */
  /* 継続タスク(主役の作業欄・琥珀寄りで少し色づけ・ユウ FB 2026-07-13) */
  .emp-carriedblock{background:rgba(230,165,46,.07);border-color:rgba(230,165,46,.34)}
  .emp-carriedblock .emp-blockhead h2{color:var(--amber-deep)}

  /* 完了は別セクション(緑寄り・控えめ) */
  .emp-doneblock{background:rgba(95,140,90,.05);border-color:rgba(95,140,90,.3)}
  .emp-doneblock .emp-blockhead h2{color:var(--green-deep)}
  .emp-done-count{font-family:"Yusei Magic",cursive;font-weight:400;font-size:15px;color:var(--green-deep);margin-left:4px}
  /* 状態を変えた瞬間に行を一瞬光らせる(変わった感) */
  @media (prefers-reduced-motion: no-preference){
    .emp-task.status-flash{animation:emp-flash .6s ease}
  }
  @keyframes emp-flash{0%{box-shadow:0 0 0 2px var(--amber) inset}100%{box-shadow:0 0 0 0 transparent inset}}
  /* 完了行は下に沈めて薄く(打ち消し線は軽め) */
  .emp-task.done{opacity:.66}
  .emp-task.done:focus-within{opacity:1}
  .emp-task-line{display:flex;align-items:center;gap:10px;padding:9px 13px 9px 9px}

  /* 行内の一言状況(常時表示・タイトル下の2行目)+ 状態チップセレクト */
  .emp-cmtline{display:flex;align-items:center;gap:8px;padding:0 13px 11px 65px}
  .emp-cmt-mark{flex:none;color:var(--ink-faint);font-weight:700}
  .emp-cmt{flex:1 1 auto;min-width:0;font-family:inherit;font-size:13.5px;color:var(--ink);background:var(--sheet);border:1px solid var(--line);border-radius:9px;padding:6px 10px;line-height:1.5}
  .emp-cmt::placeholder{color:var(--ink-soft)}
  .emp-chipsel{flex:none;font-family:inherit;font-size:11px;font-weight:700;border:0;cursor:pointer;border-radius:20px;padding:4px 24px 4px 11px;-webkit-appearance:none;appearance:none;min-height:32px;background-repeat:no-repeat;background-position:right 9px center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='6'%3E%3Cpath d='M0 0h8L4 6z' fill='%236B6459'/%3E%3C/svg%3E")}
  .emp-chipsel[data-status="進行中"]{background-color:rgba(94,125,176,.16);color:var(--blue)}
  .emp-chipsel[data-status="待ち"]{background-color:rgba(194,103,76,.18);color:var(--clay)}
  .emp-chipsel[data-status="保留"]{background-color:rgba(138,124,184,.18);color:var(--lavender)}
  .emp-task.done .emp-chipsel{display:none}

  /* これまでの動き(続けているタスクの日次ログ・常時表示):古い→新しい縦タイムライン。最新=今日は編集できる入力 */
  .emp-prog{margin:2px 13px 12px 65px;padding:10px 12px 9px;background:rgba(94,125,176,.06);border:1px solid rgba(94,125,176,.22);border-radius:10px}
  .emp-prog[hidden]{display:none}
  .emp-prog-more{display:inline-block;font-family:inherit;font-size:11px;font-weight:700;color:var(--blue);
    background:transparent;border:0;cursor:pointer;padding:0 0 8px;text-decoration:underline;text-underline-offset:2px}
  .emp-prog-more:hover{color:var(--ink)}
  .emp-prog-extra[hidden]{display:none}
  /* これまで(履歴)= 2列グリッド。高さ固定で、それ以上は中で縦スクロール(60日でも箱は一定の高さ) */
  .emp-prog-extra{display:grid;grid-template-columns:1fr 1fr;gap:5px 20px;max-height:300px;overflow-y:auto;padding-right:4px}
  .emp-prog-extra::-webkit-scrollbar{width:8px}
  .emp-prog-extra::-webkit-scrollbar-thumb{background:rgba(44,42,38,.18);border-radius:8px}
  .emp-prog-item{padding:0 0 6px;font-size:12px;line-height:1.5;color:var(--ink-soft)}
  .emp-prog-d{font-weight:700;color:var(--ink-soft);margin-right:7px}
  @media (max-width:520px){ .emp-prog-extra{grid-template-columns:1fr} }

  /* 大きくて押しやすい完了トグル(最重要)。常時「完了」ラベルを添えて押せると分かる(#1) */
  .task-toggle{flex:none;width:56px;min-height:54px;border:0;background:transparent;cursor:pointer;padding:3px 0;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:12px}
  .task-toggle:hover{background:rgba(95,140,90,.10)}
  .task-toggle:active{background:rgba(95,140,90,.16)}
  .task-toggle .ring{width:30px;height:30px;border-radius:50%;border:2.5px solid var(--ink-soft);
    background:var(--sheet-2);display:flex;align-items:center;justify-content:center;color:transparent;font-size:16px;font-weight:700;line-height:1}
  .task-toggle .tcap{font-size:10.5px;font-weight:700;color:var(--ink-soft);line-height:1}
  .task-toggle:hover .ring{border-color:var(--green)}
  .emp-task.done .task-toggle .ring{background:var(--green);border-color:var(--green);color:#fff}
  .emp-task.done .task-toggle .tcap{color:var(--green-deep)}
  @media (prefers-reduced-motion: no-preference){
    .task-toggle .ring{transition:background .16s ease,border-color .16s ease,transform .16s ease}
    .task-toggle.pop .ring{animation:ringpop .3s ease}
    @keyframes ringpop{0%{transform:scale(1)}42%{transform:scale(1.2)}100%{transform:scale(1)}}
  }

  .emp-task-title{flex:1 1 auto;min-width:0;font-family:inherit;font-size:15px;line-height:1.5;color:var(--ink);
    background:var(--sheet);border:1px solid var(--line);border-radius:9px;padding:8px 11px;resize:none;overflow:hidden;display:block}
  .emp-task-title::placeholder{color:var(--ink-soft)}
  .emp-task.done .emp-task-title{text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:var(--ink-faint);color:var(--ink-soft);background:transparent;border-color:transparent}

  /* デイリータスク(記録済み):静的な緑チェック + 編集できる1行。日付/状態/履歴/打ち消し線なし */
  .emp-task.is-simple::before{background:var(--green)}
  .emp-donemark{flex:none;width:30px;height:30px;margin-left:6px;border-radius:50%;background:var(--green);border:2.5px solid var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;line-height:1}

  /* 行内の日付(期間):開始 [date] 〜 期限 [date] をタイトル行の右に直接置く(詳細パネルは廃止) */
  .emp-dateinline{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:5px}
  .emp-dateinline .emp-date{width:auto;font-family:inherit;font-size:11.5px;padding:4px 7px;border-radius:8px;color:var(--ink-soft);background:var(--sheet-2);border:1px solid var(--line)}
  .emp-dr-sep{color:var(--ink-faint);font-weight:700;font-size:11px}
  /* 行の削除(× ・取り消し可) */
  .emp-rowdel{flex:none;width:30px;height:30px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--ink-faint);cursor:pointer;font-size:13px;line-height:1;display:inline-flex;align-items:center;justify-content:center}
  .emp-rowdel:hover:not(:disabled){background:rgba(194,103,76,.1);color:var(--clay);border-color:rgba(194,103,76,.35)}
  .emp-rowdel:disabled{opacity:.3;cursor:default}

  /* これまで(履歴)トグル:複数日履歴があるときだけ「これまで(N) ▾」で展開 */
  .emp-prog .emp-prog-more{padding:0}
  .emp-prog .emp-prog-extra{margin-top:8px}
  .emp-prog .emp-prog-extra[hidden]{display:none}

  .emp-add{width:100%;justify-content:center;display:flex;align-items:center;gap:8px;padding:12px;margin-top:12px}

  /* フッター */
  .emp-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:15px 18px;position:sticky;bottom:0;z-index:4}
  .emp-footstate-wrap{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
  .emp-footer .emp-savestate{font-size:12.5px;color:var(--ink-soft)}
  .emp-footer .emp-foot-btns{display:flex;gap:10px}

  /* aside カード */
  .emp-card{padding:15px 16px}
  .emp-card h3{margin:0 0 4px;font-size:13.5px;font-weight:700}
  .emp-card h3 .opt{font-weight:400;color:var(--ink-soft);font-size:12px}
  .emp-card .emp-card-sub{font-size:11.5px;color:var(--ink-soft);margin:0 0 12px}
  .emp-past{display:flex;flex-direction:column;gap:9px}
  .emp-past[hidden]{display:none}
  .emp-past-item{background:var(--sheet-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
  .emp-past-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}
  .emp-past-date{font-size:12px;font-weight:700}
  .emp-past-memo{font-size:12px;color:var(--ink-soft);line-height:1.55}
  .emp-past-acts{display:flex;gap:7px;margin-top:8px}
  /* 過去の日報レール:月ナビ(◀ 2026年 7月 ▶)+ コピー(今月分＋月で切替・2026-07-04) */
  /* カードタップでその日を開く(ユウ選択 2026-07-05)= 押せるアフォーダンス */
  .emp-past-item[data-past-open]{cursor:pointer;transition:border-color .12s ease}
  .emp-past-item[data-past-open]:hover,.emp-past-item[data-past-open]:focus-visible{border-color:var(--green-deep)}
  /* 「ひとこと」未提出の変更サイン(ユウ選択 2026-07-05) */
  .emp-dirty-hint{font-size:11.5px;font-weight:700;color:var(--amber-deep);background:rgba(230,165,46,.14);
    border-radius:999px;padding:3px 10px}
  .emp-dirty-hint[hidden]{display:none}
  .emp-past-nav{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:2px}
  .emp-past-month{font-size:12.5px;font-weight:700;color:var(--ink)}
  .emp-past-arrow{min-width:40px;padding-left:9px;padding-right:9px}
  .emp-past-memo-empty{font-style:italic;color:var(--ink-faint)}
  .emp-mini{font-family:inherit;font-size:11.5px;font-weight:700;color:var(--green-deep);background:transparent;border:0;cursor:pointer;padding:2px 6px;text-decoration:underline;text-underline-offset:2px;min-height:44px;display:inline-flex;align-items:center}
  .emp-mini:hover{color:var(--ink)}

  /* 取り消し(undo)つきトースト。重要な取り消しは約10秒・ホバー/フォーカスで一時停止(#9) */
  .emp-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(10px);
    background:var(--ink);color:#fff;font-size:12.5px;font-weight:700;border-radius:11px;
    padding:8px 11px 8px 16px;box-shadow:var(--shadow-card);opacity:0;pointer-events:none;z-index:30;
    display:flex;align-items:center;gap:9px;max-width:min(92vw,480px)}
  .emp-toast.show{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
  .emp-toast-msg{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .emp-toast-sep{color:rgba(255,255,255,.4)}
  .emp-toast-sep[hidden]{display:none}
  .emp-toast-act{flex:none;font-family:inherit;font-size:12.5px;font-weight:700;color:#FCE7B4;
    background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.32);
    border-radius:8px;padding:6px 14px;cursor:pointer;white-space:nowrap;min-height:44px;display:inline-flex;align-items:center}
  .emp-toast-act:hover{background:rgba(255,255,255,.26);color:#fff}
  .emp-toast-act[hidden]{display:none}
  @media (prefers-reduced-motion: no-preference){ .emp-toast{transition:opacity .2s ease,transform .2s ease} }

  @media (max-width:1180px){
    .emp-wrap{grid-template-columns:1fr}
    .emp-aside{position:static}
  }
  @media (max-width:680px){
    .emp-task-line{flex-wrap:wrap}
    .emp-task-title{flex:1 1 100%;order:3}
    .emp-dateinline{order:4;margin-left:0}
    .emp-cmtline{padding-left:13px}
    /* 見出しと説明は横並び固定だと 390px 幅で横スクロールする(Codex Med)→ 縦積み/折り返し */
    .emp-blockhead{flex-wrap:wrap}
    .emp-blockhead .hint{white-space:normal}
  }
  /* ===== view-admin (ported) ===== */
  /* ===== 01 全員レビュー 固有(接頭辞 adm-) ===== */
  .adm-wrap{display:grid;grid-template-columns:268px minmax(0,1fr) 420px;gap:22px;align-items:start}
  .adm-col{display:flex;flex-direction:column;gap:16px;min-width:0}
  .adm-aside{display:flex;flex-direction:column;gap:14px;position:sticky;top:86px}

  .adm-lane{display:flex;align-items:baseline;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;margin-bottom:2px}
  .adm-lane h2{margin:0;font-family:"Yusei Magic",cursive;font-weight:400;font-size:18px;line-height:1.2}

  /* 今日のレビュー(現状サマリー + おすすめ順 + 押せるサイン) */
  .adm-today{padding:16px 17px}
  .adm-summary{margin:6px 0 14px;font-size:13px;color:var(--ink-soft);line-height:1.7}
  .adm-summary strong{font-family:"Yusei Magic",cursive;font-weight:400;color:var(--ink);font-size:15px}
  /* 未提出の名前チップ(誰に声かけすればいいかを一瞬で) */
  .adm-missing{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;color:var(--ink-soft);margin:-6px 0 14px}
  .adm-missing[hidden]{display:none}
  .adm-missing-k{font-weight:700}
  /* 「おすすめ対応順」「気になるサイン(シグナル分類)」はノイズ整理で撤去(ユウ判断 2026-07-10) */

  /* Review Queue(レビュー待ち) */
  .adm-queue{display:flex;flex-direction:column;gap:11px}
  .adm-qcard{background:var(--sheet);border:1px solid var(--line);border-radius:13px;box-shadow:0 6px 20px -18px rgba(44,42,38,.6);overflow:hidden}
  .adm-qcard[open]{border-color:rgba(44,42,38,.28)}
  .adm-signal-row{list-style:none;display:flex;align-items:center;gap:11px;padding:12px 14px;cursor:pointer;min-height:44px}
  .adm-signal-row::-webkit-details-marker{display:none}
  .adm-signal-row:hover{background:rgba(255,255,255,.5)}
  .adm-signal-row.active{background:var(--sheet-2)}
  .adm-dot{flex:none;width:11px;height:11px;border-radius:50%;background:var(--dot,var(--ink-faint))}
  .adm-signal-txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:1px}
  .adm-signal-txt strong{font-size:14px;color:var(--ink)}
  .adm-signal-txt small{font-size:11.5px;color:var(--ink-soft);line-height:1.5}
  .adm-report-detail{border-top:1px dashed var(--line);padding:14px 16px 16px;background:rgba(231,222,205,.28)}
  .adm-report-detail h3{margin:0 0 3px;font-size:14px;font-weight:700}
  .adm-report-detail .adm-rd-meta{display:block;font-size:11.5px;color:var(--ink-soft);margin-bottom:9px}
  .adm-report-detail p{margin:0 0 9px;font-size:12.5px;color:var(--ink);line-height:1.6}
  .adm-report-detail ul{margin:0 0 9px;padding-left:18px;font-size:12.5px;color:var(--ink-soft);line-height:1.65}
  .adm-report-detail ul li{margin-bottom:2px}
  /* レビューの日報を 継続/デイリー/完了 の3セクションに分けて一目で分かるように(接頭辞 adm-rd-) */
  .adm-rd-sec{margin:9px 0 0}
  .adm-rd-k{margin:0 0 4px;font-size:11.5px;font-weight:700;letter-spacing:.02em;display:flex;align-items:center;gap:6px}
  .adm-rd-k::before{content:"";width:8px;height:8px;border-radius:50%;flex:none}
  .adm-rd-k-carried{color:var(--blue)} .adm-rd-k-carried::before{background:var(--blue)}
  .adm-rd-k-daily{color:var(--amber-deep)} .adm-rd-k-daily::before{background:var(--amber)}
  .adm-rd-k-done{color:var(--green-deep)}
  .adm-rd-k-done::before{content:"✓";width:auto;height:auto;border-radius:0;background:none;color:var(--green-deep);font-size:12px;font-weight:700;line-height:1}
  .adm-report-detail .adm-rd-list{margin:0;padding-left:1.15em;display:flex;flex-direction:column;gap:3px;font-size:12.5px;line-height:1.6;color:var(--ink)}
  .adm-rd-list li{margin:0}
  .adm-rd-sec-done .adm-rd-list li{color:var(--ink-soft)}
  .adm-rd-empty{font-size:12px;color:var(--ink-faint);padding-left:2px}
  .adm-rd-summary{margin:11px 0 0 !important;color:var(--ink-soft) !important;border-top:1px dashed var(--line);padding-top:8px}
  @media (prefers-reduced-motion: no-preference){
    .adm-qcard[open] .adm-report-detail{animation:adm-reveal .16s ease both}
  }
  @keyframes adm-reveal{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}}

  /* AI Advice Draft(右レール) */
  .adm-aside-card{padding:15px 16px}
  .adm-target{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;
    background:var(--kraft);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-size:12px;color:var(--ink-soft)}
  .adm-step{display:flex;align-items:center;gap:9px;margin-bottom:6px}
  .adm-step .adm-num{flex:none;width:24px;height:24px;border-radius:50%;background:var(--green);color:#fff;
    font-family:"Yusei Magic",cursive;font-size:13px;display:flex;align-items:center;justify-content:center}
  .adm-step h3{margin:0;font-size:13.5px;font-weight:700}
  .adm-draft-title{font-family:"Yusei Magic",cursive;font-weight:400;font-size:16px;margin:2px 0 7px;line-height:1.3}
  #draft-body{margin:8px 0 0;font-size:12.5px;color:var(--ink);line-height:1.65}
  /* AI案/YuuのFB入力は全文が見えるよう大きく取る */
  .adm-aside-card .textarea{font-size:13.5px}
  #owner-comment{min-height:128px}
  #ai-feedback-reason{min-height:84px}
  .adm-status{font-size:11.5px;color:var(--ink-soft);line-height:1.5;margin:9px 0}
  .adm-draft-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px}
  /* 採用チェック(採用率=実際に下敷きにした案・独立監査 M4) */
  .adm-adopt-check{display:flex;align-items:center;gap:6px;margin:8px 0 0;cursor:pointer}
  .adm-adopt-check input{margin:0}
  .adm-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
  .adm-rating-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:9px 0}
  .adm-rating{font-family:inherit;text-align:left;cursor:pointer;border:1px solid var(--line);background:var(--sheet-2);
    border-radius:10px;padding:9px 11px;font-size:12.5px;font-weight:700;color:var(--ink-soft);
    display:flex;flex-direction:column;gap:2px;min-height:44px}
  .adm-rating small{font-size:10.5px;font-weight:400;color:var(--ink-faint)}
  .adm-rating:hover{background:#fbf6ec}
  .adm-rating[aria-pressed="true"]{background:rgba(95,140,90,.16);border-color:var(--green);color:var(--green-deep)}
  .adm-rating[aria-pressed="true"] small{color:var(--green-deep)}
  .adm-rlabel{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin:4px 0 5px}

  @media (max-width:1180px){
    .adm-wrap{grid-template-columns:1fr}
    .adm-aside{position:static}
  }

  /* ===== view-calendar = ガント v3(進行中⇄実績・gnt-) ===== */
  /* ===================================================================
     ガントチャート v3 (gnt-)
     進行中(今週) ⇄ 完了ガント(実績)を切り替え・完了は消さず実績に蓄積
     =================================================================== */

  /* view switch (segmented) */
  .gnt-viewswitch{display:inline-flex;background:var(--kraft);border:1px solid var(--line);
    border-radius:14px;padding:4px;gap:4px;margin-bottom:16px}
  .gnt-viewswitch button{font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;
    border:0;background:transparent;color:var(--ink-soft);border-radius:10px;padding:9px 20px;
    display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;line-height:1.2}
  .gnt-viewswitch button .vs-sub{font-size:11px;font-weight:500;color:var(--ink-faint)}
  .gnt-viewswitch button[aria-selected="true"]{background:var(--sheet-2);color:var(--ink);box-shadow:var(--shadow-card)}
  .gnt-viewswitch button[aria-selected="true"] .vs-sub{color:var(--green-deep)}
  .gnt-viewswitch button:hover[aria-selected="false"]{color:var(--ink)}

  .gnt-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;
    flex-wrap:wrap;padding:13px 16px;margin-bottom:14px}
  .gnt-toolbar-lead{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .gnt-toolbar-lead strong{font-size:14px}

  .gnt-filter{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
  .gnt-filter[hidden]{display:none}   /* 新人は人フィルタ自体を出さない */
  .gnt-filter-label{font-size:12px;font-weight:700;color:var(--ink-soft)}
  .gnt-filter-btns{display:flex;gap:6px;flex-wrap:wrap}
  .gnt-chip{font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;
    border:1px solid var(--line);background:var(--sheet);color:var(--ink-soft);
    border-radius:20px;padding:6px 15px}
  .gnt-chip:hover{background:#fff;color:var(--ink)}
  .gnt-chip.is-active{background:var(--ink);border-color:var(--ink);color:#fff}

  /* create / edit panel */
  .gnt-create{padding:16px 18px;margin-bottom:16px}
  .gnt-create-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
  .gnt-create-head strong{font-size:14.5px}
  .gnt-create-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0 16px}
  .gnt-create-grid .field{margin-bottom:10px}
  .gnt-col-wide{grid-column:span 2}
  .gnt-create-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:4px}

  /* board + detail layout */
  .gnt-main{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
  .gnt-board{padding:14px 16px 12px}
  .gnt-board-top{display:flex;align-items:center;justify-content:space-between;gap:14px;
    flex-wrap:wrap;margin-bottom:10px}
  .gnt-week-label{font-size:12.5px;font-weight:700;color:var(--ink-soft)}
  .gnt-legend{display:flex;gap:14px;flex-wrap:wrap}
  .gnt-legend span{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;color:var(--ink-soft)}
  .gnt-sw{width:16px;height:11px;border-radius:4px;display:inline-block;background:var(--blue)}
  .gnt-sw[data-status="待ち"]{background:var(--clay)}
  .gnt-sw[data-status="完了"]{background:var(--green)}
  .gnt-sw[data-status="保留"]{background:var(--lavender)}
  .gnt-sw-over{background:var(--clay);
    background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.45) 0 3px,transparent 3px 6px)}

  /* 横スクロールは1つの器・左の列群は sticky で常に見える */
  .gnt-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:12px;background:var(--sheet-2)}
  .gnt-board-inner{
    /* 左固定列の幅(ヘッダーと全行で共有 → アクション列がぴったり揃う) */
    --c-name:252px; --c-status:108px; --c-act:150px;
    --c-left:calc(var(--c-name) + var(--c-status) + var(--c-act));
    --c-time:700px; --cols:7;
    min-width:calc(var(--c-left) + var(--c-time));
  }

  /* header row : 左固定3列 + 日付 */
  .gnt-grid-head{display:flex;background:var(--kraft);border-bottom:1px solid var(--line);
    position:sticky;top:0;z-index:5}
  .gnt-head-left{width:var(--c-left);flex:none;position:sticky;left:0;z-index:6;
    display:grid;grid-template-columns:var(--c-name) var(--c-status) var(--c-act);background:var(--kraft)}
  .gnt-head-left > div{padding:10px 14px;font-size:12px;font-weight:700;color:var(--ink-soft);
    border-right:1px solid var(--line);display:flex;align-items:center}
  .gnt-head-act{flex-direction:column !important;align-items:flex-start !important;gap:1px;line-height:1.25}
  .gnt-head-act small{font-size:10.5px;font-weight:500;color:var(--ink-faint)}
  .gnt-head-days{flex:1;min-width:var(--c-time);display:grid;grid-template-columns:repeat(var(--cols),1fr)}
  .gnt-day{padding:8px 4px;text-align:center;font-size:12px;font-weight:700;color:var(--ink-soft);
    border-right:1px solid var(--line);line-height:1.3}
  .gnt-day:last-child{border-right:0}
  .gnt-day.is-weekend{color:var(--clay);background:rgba(194,103,76,.07)}
  .gnt-day.is-monday{box-shadow:inset 2px 0 0 var(--kraft-deep)}
  .gnt-day small{display:block;font-size:10px;font-weight:500;color:var(--ink-faint)}

  /* ----- 担当グループ ----- */
  .gnt-groups{display:block}
  .gnt-group{border-top:2px solid var(--kraft-deep)}
  .gnt-group:first-child{border-top:0}

  /* group head : 人名・役割・件数は先頭に1回だけ */
  .gnt-group-head{display:flex}
  .gnt-group-head-left{width:var(--c-left);flex:none;position:sticky;left:0;z-index:3;
    display:flex;align-items:center;gap:11px;padding:13px 16px;background:var(--kraft);
    border-right:1px solid var(--line);border-left:5px solid var(--blue)}
  /* 匿名の色スロット(氏名を CSS に焼かない・app.js が data-color=id%6 を付与) */
  .gnt-group[data-color="0"] .gnt-group-head-left{border-left-color:var(--blue)}
  .gnt-group[data-color="1"] .gnt-group-head-left{border-left-color:var(--amber-deep)}
  .gnt-group[data-color="2"] .gnt-group-head-left{border-left-color:var(--lavender)}
  .gnt-group[data-color="3"] .gnt-group-head-left{border-left-color:var(--green)}
  .gnt-group[data-color="4"] .gnt-group-head-left{border-left-color:var(--clay)}
  .gnt-group[data-color="5"] .gnt-group-head-left{border-left-color:var(--green-deep)}
  .gnt-group-head-time{flex:1;min-width:var(--c-time);background:var(--kraft)}
  .gnt-av{width:34px;height:34px;flex:none;border-radius:11px;display:flex;align-items:center;justify-content:center;
    font-family:"Yusei Magic",cursive;font-size:17px;color:#fff;background:var(--blue)}
  .gnt-group[data-color="0"] .gnt-av{background:var(--blue)}
  .gnt-group[data-color="1"] .gnt-av{background:var(--amber-deep)}
  .gnt-group[data-color="2"] .gnt-av{background:var(--lavender)}
  .gnt-group[data-color="3"] .gnt-av{background:var(--green)}
  .gnt-group[data-color="4"] .gnt-av{background:var(--clay)}
  .gnt-group[data-color="5"] .gnt-av{background:var(--green-deep)}
  .gnt-name{font-family:"Yusei Magic",cursive;font-size:17px;line-height:1.1;color:var(--ink)}
  .gnt-group-meta{display:flex;align-items:center;gap:8px}
  .gnt-count{font-size:11px;color:var(--ink-faint);font-weight:700}

  /* ----- タスク行(1タスク=1行・均一な行高) ----- */
  .gnt-trow{display:flex;border-top:1px solid var(--line)}
  .gnt-trow:first-of-type{border-top:1px solid var(--line)}
  .gnt-trow-left{width:var(--c-left);flex:none;position:sticky;left:0;z-index:2;
    background:var(--sheet);display:grid;grid-template-columns:var(--c-name) var(--c-status) var(--c-act)}
  .gnt-trow:hover .gnt-trow-left{background:#fff}
  .gnt-trow.is-selected .gnt-trow-left{background:#fff;box-shadow:inset 4px 0 0 var(--focus)}
  .gnt-trow-left > div{min-height:54px;display:flex;align-items:center;padding:8px 14px;
    border-right:1px solid var(--line)}
  .gnt-cell-name{font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.35}
  .gnt-cell-status{justify-content:flex-start}
  /* アクション列 : どの行でも同じ位置に整列 */
  .gnt-cell-act{gap:7px}
  /* 行内アクションは控えめに(各行に並んでも重くならない・コンパクト) */
  .gnt-cell-act .btn{white-space:nowrap;flex:none;min-height:32px;padding:5px 13px;font-size:12px;border-radius:8px}
  .gnt-act-done{background:var(--sheet-2);border-color:rgba(95,140,90,.55);color:var(--green-deep);border-style:solid;font-weight:700}
  .gnt-act-done::before{content:"✓";margin-right:5px;font-size:11px}
  .gnt-act-done:hover{background:var(--green);border-color:var(--green);color:#fff}
  .gnt-cell-act .gnt-act-edit{color:var(--ink-soft);border-color:transparent;background:transparent}
  .gnt-cell-act .gnt-act-edit:hover{background:rgba(255,255,255,.6);color:var(--ink);border-color:var(--line)}

  /* timeline track : 日グリッド + バー */
  .gnt-trow-time{flex:1;min-width:var(--c-time);position:relative;
    background-image:linear-gradient(to right,var(--line) 1px,transparent 1px);
    background-size:calc(100% / var(--cols)) 100%}
  .gnt-trow:nth-of-type(even) .gnt-trow-time{background-color:rgba(231,222,205,.16)}

  .gnt-bar{position:absolute;top:50%;transform:translateY(-50%);height:30px;
    border:1px solid transparent;border-radius:9px;cursor:pointer;
    display:flex;align-items:center;gap:7px;padding:0 11px;
    font-family:inherit;font-size:12px;font-weight:700;white-space:nowrap;
    overflow:hidden;background:var(--blue);color:#fff;
    box-shadow:0 5px 13px -9px rgba(44,42,38,.85)}
  .gnt-bar[data-status="待ち"]{background:var(--clay);color:#fff}
  .gnt-bar[data-status="保留"]{background:var(--lavender);color:#fff}
  .gnt-bar[data-status="完了"]{background:var(--green);color:#fff}
  .gnt-bar.is-overdue{background:var(--clay);
    background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.32) 0 5px,transparent 5px 10px);
    border-color:var(--clay)}
  .gnt-bar.is-selected{outline:3px solid var(--focus);outline-offset:2px}
  .gnt-bar:hover{filter:brightness(1.05)}
  .gnt-bar-name{overflow:hidden;text-overflow:ellipsis}
  .gnt-bar-range{font-weight:500;opacity:.85;overflow:hidden;text-overflow:ellipsis;flex:none}
  .gnt-bar-flag{font-size:10px;font-weight:700;background:rgba(255,255,255,.88);
    color:var(--clay);border-radius:5px;padding:0 5px;flex:none}

  .gnt-empty{padding:26px 16px;text-align:center}
  /* 完了ガントの「さらに読み込む」(cursor 続き・空手形解消 2026-07-05) */
  .gnt-more-row{padding:12px 16px;text-align:center}
  .gnt-board-hint{margin:10px 2px 0}

  /* detail panel(表示専用) */
  .gnt-detail{padding:18px 18px 20px;position:sticky;top:84px}
  .gnt-detail-head{margin-bottom:14px}
  .gnt-detail-chips{display:flex;gap:7px;align-items:center;margin-bottom:8px}
  .gnt-detail-head h3{margin:0;font-size:18px;font-weight:700;line-height:1.3}
  .gnt-meta{display:flex;flex-direction:column;gap:0;margin:0 0 14px;
    border:1px solid var(--line);border-radius:11px;overflow:hidden;background:var(--sheet-2)}
  .gnt-meta > div{display:flex;gap:10px;padding:8px 12px;border-bottom:1px solid var(--line)}
  .gnt-meta > div:last-child{border-bottom:0}
  .gnt-meta dt{margin:0;width:48px;flex:none;font-size:12px;font-weight:700;color:var(--ink-soft)}
  .gnt-meta dd{margin:0;font-size:13px;color:var(--ink)}
  .gnt-d-cond{margin:0;font-size:13px;line-height:1.6;color:var(--ink);
    background:var(--kraft);border-radius:9px;padding:10px 12px;overflow-wrap:anywhere;word-break:break-word}
  .gnt-d-note{margin-top:12px}
  /* 進捗の流れ(右パネル・日報メモ+状態変化の時系列) */
  /* 進捗の流れ:60日分など長くなっても箱は高さ固定・中で縦スクロール(パネルが伸びきらない) */
  .gnt-timeline{list-style:none;margin:0;padding:0 4px 0 8px;max-height:340px;overflow-y:auto;overflow-x:hidden}
  .gnt-timeline::-webkit-scrollbar{width:8px}
  .gnt-timeline::-webkit-scrollbar-thumb{background:rgba(44,42,38,.18);border-radius:8px}
  .gnt-tl{position:relative;padding:0 0 13px 18px;border-left:2px solid var(--line)}
  .gnt-tl:last-child{padding-bottom:2px;border-left-color:transparent}
  .gnt-tl::before{content:"";position:absolute;left:-6px;top:3px;width:10px;height:10px;border-radius:50%;background:var(--ink-faint);border:2px solid var(--sheet)}
  .gnt-tl.is-last::before{background:var(--green)}
  .gnt-tl-d{font-size:11.5px;font-weight:700;color:var(--ink-soft);margin-bottom:2px}
  .gnt-tl-t{font-size:12.5px;color:var(--ink);line-height:1.55;overflow-wrap:anywhere;word-break:break-word}
  .gnt-tl-badge{display:inline-block;font-size:10px;font-weight:700;border-radius:20px;padding:0 7px;margin-left:6px;background:rgba(95,140,90,.18);color:var(--green-deep)}
  .gnt-tl-empty{font-size:12px;color:var(--ink-soft);line-height:1.6}
  /* 「これまで(N)」行はタイムラインの線に揃える(点は付けない=進捗そのものではない) */
  .gnt-tl-more{padding:2px 0 10px 18px;border-left:2px solid var(--line)}

  /* toast(完了の取り消し) */
  .gnt-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:30;
    display:flex;align-items:center;gap:14px;background:var(--ink);color:#fff;
    border-radius:12px;padding:11px 16px;box-shadow:0 18px 40px -20px rgba(0,0,0,.6);
    font-size:13.5px;font-weight:700;max-width:90vw}
  .gnt-toast[hidden]{display:none}
  .gnt-toast-undo{font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;
    border:1px solid rgba(255,255,255,.4);background:transparent;color:#fff;border-radius:9px;padding:5px 13px;flex:none}
  .gnt-toast-undo:hover{background:rgba(255,255,255,.14)}
  @media (prefers-reduced-motion: no-preference){
    .gnt-toast{animation:gnt-toast-in .18s ease}
  }
  @keyframes gnt-toast-in{
    from{opacity:0;transform:translateX(-50%) translateY(8px)}
    to{opacity:1;transform:translateX(-50%) translateY(0)}
  }

  @media (max-width:1100px){
    .gnt-main{grid-template-columns:1fr}
    .gnt-detail{position:static}
  }
  .gnt-create .field>label{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:5px}
  .gnt-create label .opt{font-weight:400;color:var(--ink-faint);margin-left:5px}

  /* ===== view-team (ported) ===== */
  /* ===== 05 みんなの日報 固有(接頭辞 team-) ===== */
  .team-board{display:grid;grid-template-columns:288px minmax(0,1fr);gap:24px;align-items:start}
  .team-aside{display:flex;flex-direction:column;gap:16px;position:sticky;top:86px}

  .team-lane{padding:15px 16px}
  .team-lane-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}
  .team-lane-title h2{margin:0;font-size:15px;font-weight:700}

  .team-visible-list{display:flex;flex-direction:column;gap:8px}
  .team-person{display:flex;flex-direction:column;gap:2px;text-align:left;cursor:pointer;
    font-family:inherit;width:100%;min-height:54px;
    background:var(--sheet-2);border:1px solid var(--line);border-radius:11px;padding:10px 13px;color:var(--ink)}
  .team-person strong{font-size:14px;font-weight:700;line-height:1.3}
  .team-person span{font-size:11.5px;color:var(--ink-soft)}
  .team-person:hover{background:#fbf6ec}
  .team-person[aria-pressed="true"]{background:var(--sheet);border-color:rgba(44,42,38,.28);box-shadow:var(--shadow-card)}
  .team-person[aria-pressed="true"] strong{color:var(--green-deep)}
  /* 提出状態の色ドット(緑=提出済み / 琥珀=下書き)。文字ラベルの補助=色だけに頼らない */
  .team-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--amber);margin-right:7px;flex:none}
  .team-dot.is-ok{background:var(--green)}

  .team-report{padding:0;overflow:hidden}
  .team-report-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;
    padding:clamp(16px,1.8vw,22px) clamp(16px,2vw,24px);border-bottom:1px solid var(--line);background:var(--kraft)}
  .team-report-head h2{margin:0;font-family:"Yusei Magic",cursive;font-weight:400;font-size:21px;line-height:1.2}
  .team-report-meta{font-size:12px;color:var(--ink-soft);margin-top:3px}

  .team-report-body{padding:clamp(16px,2vw,24px);display:flex;flex-direction:column;gap:18px}
  .team-section h3{margin:0 0 6px;font-size:13.5px;font-weight:700;color:var(--ink)}
  .team-section p{margin:0;font-size:13.5px;line-height:1.65;color:var(--ink)}
  .team-section .team-cmt-tag{margin-top:9px}
  .team-section .team-cmt-tag[hidden]{display:none}

  .team-mini-list{margin:0;padding-left:1.1em;display:flex;flex-direction:column;gap:7px}
  .team-mini-list li{font-size:13.5px;line-height:1.6;color:var(--ink)}
  /* 全員レビューと同じ色分け見出し(継続=青/デイリー=琥珀/完了=緑✓)で一目で分かるように */
  .team-section h3.team-sec-k{display:flex;align-items:center;gap:7px}
  .team-sec-k::before{content:"";width:9px;height:9px;border-radius:50%;flex:none}
  .team-section h3.team-sec-k-carried{color:var(--blue)} .team-sec-k-carried::before{background:var(--blue)}
  .team-section h3.team-sec-k-daily{color:var(--amber-deep)} .team-sec-k-daily::before{background:var(--amber)}
  .team-section h3.team-sec-k-done{color:var(--green-deep)}
  .team-sec-k-done::before{content:"✓";width:auto;height:auto;border-radius:0;background:none;color:var(--green-deep);font-size:13px;font-weight:700;line-height:1}
  .team-section-done .team-mini-list li{color:var(--ink-soft)}
  /* 継続タスクの「これまで(N) ▾」= 本人の入力画面と同じ作法(最新は1行・過去は折りたたみ read-only) */
  .team-prog{margin:6px 0 2px;padding:9px 11px;background:rgba(94,125,176,.06);border:1px solid rgba(94,125,176,.22);border-radius:9px}
  .team-prog-more{font-family:inherit;font-size:11.5px;font-weight:700;color:var(--blue);background:transparent;border:0;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:2px}
  .team-prog-more:hover{color:var(--ink)}
  /* 60日でも箱は一定の高さ・中で縦スクロール(古い→新しい・2列) */
  .team-prog-extra{display:grid;grid-template-columns:1fr 1fr;gap:5px 18px;max-height:240px;overflow-y:auto;margin-top:8px;padding-right:4px}
  .team-prog-extra[hidden]{display:none}
  .team-prog-extra::-webkit-scrollbar{width:8px}
  .team-prog-extra::-webkit-scrollbar-thumb{background:rgba(44,42,38,.18);border-radius:8px}
  .team-prog-item{font-size:12px;line-height:1.5;color:var(--ink-soft);padding:0 0 5px}
  .team-prog-d{font-weight:700;color:var(--ink-soft);margin-right:7px}
  @media (max-width:520px){ .team-prog-extra{grid-template-columns:1fr} }

  @media (max-width:1024px){
    .team-board{grid-template-columns:1fr}
    .team-aside{position:static}
  }

  /* ===== view-comments (ported) ===== */
  /* ===== 04 コメント履歴 固有(接頭辞 cmt-) ===== */
  .cmt-sheet{padding:0;overflow:hidden}
  .cmt-table{display:flex;flex-direction:column}
  /* 日付・保存先の列は撤去(全行同一値=情報ゼロ・ユウ判断 2026-07-10)→ 本文に幅を回す3列 */
  .cmt-row{display:grid;grid-template-columns:150px minmax(0,1fr) 92px;gap:14px;
    align-items:center;padding:12px clamp(16px,2vw,22px);border-top:1px solid var(--line)}
  .cmt-row:first-child{border-top:0}
  .cmt-row.head{background:var(--kraft);font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--ink-soft)}
  .cmt-row .cmt-target{font-size:13.5px;font-weight:700;color:var(--ink)}
  /* コメント本文は2行に畳む(全文は行クリック→右の詳細で読める・表示側の長さ制限 2026-07-10) */
  .cmt-row .cmt-text{font-size:13px;line-height:1.55;color:var(--ink);min-width:0;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere}

  .cmt-note{margin-top:18px}

  /* 表(左)+ 詳細プレビュー(右レール)。行クリックで全文脈を右に出す */
  .cmt-layout{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:18px;align-items:start}
  .cmt-row{cursor:pointer}
  .cmt-row.head{cursor:default}
  .cmt-row:not(.head):hover{background:#fbf6ec}
  .cmt-row.is-selected{background:rgba(94,125,176,.10)}
  .cmt-detail{padding:16px 17px;position:sticky;top:86px}
  .cmt-detail-empty{font-size:12.5px;color:var(--ink-faint);line-height:1.7}
  .cmt-detail-head{display:flex;align-items:baseline;justify-content:space-between;gap:8px 12px;flex-wrap:wrap;margin-bottom:4px}
  .cmt-detail-head h2{margin:0;font-family:"Yusei Magic",cursive;font-weight:400;font-size:17px;line-height:1.25}
  .cmt-detail-meta{font-size:12px;color:var(--ink-soft);margin:0 0 12px}
  .cmt-detail-sec{margin:0 0 13px}
  .cmt-detail-sec h3{margin:0 0 4px;font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--green-deep)}
  .cmt-detail-sec p{margin:0;font-size:13px;line-height:1.62;color:var(--ink)}
  .cmt-detail-sec .cmt-detail-quote{background:var(--sheet-2);border:1px solid var(--line);border-radius:9px;padding:9px 11px;color:var(--ink-soft)}
  .cmt-detail-rating{display:inline-flex;align-items:center;gap:8px}

  @media (max-width:1100px){
    .cmt-layout{grid-template-columns:1fr}
    .cmt-detail{position:static}
  }
  @media (max-width:760px){
    .cmt-row{grid-template-columns:1fr 1fr;gap:6px 14px}
    .cmt-row.head{display:none}
    .cmt-row .cmt-text{grid-column:1 / -1}
  }

  /* ===== view-people = タスクの気づき(横串 AI 指摘ボード・接頭辞 ins-) ===== */
  .ins-board{display:flex;flex-direction:column;gap:11px;padding:clamp(16px,2vw,22px)}
  .ins-intro{font-size:13px;color:var(--ink-soft);line-height:1.7;margin:0 0 3px}
  .ins-intro strong{color:var(--ink);font-family:"Yusei Magic",cursive;font-weight:400;font-size:15px}
  .ins-card{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;align-items:start;
    background:var(--sheet-2);border:1px solid var(--line);border-radius:13px;padding:14px 16px;
    box-shadow:0 6px 20px -18px rgba(44,42,38,.6);border-left:4px solid var(--ink-faint)}
  .ins-card.kind-stale{border-left-color:var(--clay)}
  .ins-card.kind-dup{border-left-color:var(--lavender)}
  .ins-card.kind-dep{border-left-color:var(--blue)}
  .ins-card.kind-load{border-left-color:var(--amber)}
  .ins-ic{flex:none;width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;background:var(--kraft);border:1px solid var(--line)}
  .ins-body{min-width:0}
  .ins-kindtag{font-size:10.5px;font-weight:700;letter-spacing:.02em;border-radius:20px;padding:1px 9px;display:inline-block;margin-bottom:5px}
  .kind-stale .ins-kindtag{background:rgba(194,103,76,.16);color:var(--clay)}
  .kind-dup .ins-kindtag{background:rgba(138,124,184,.18);color:var(--lavender)}
  .kind-dep .ins-kindtag{background:rgba(94,125,176,.16);color:var(--blue)}
  .kind-load .ins-kindtag{background:rgba(230,165,46,.2);color:var(--amber-deep)}
  .ins-find{margin:0 0 5px;font-size:14.5px;font-weight:700;color:var(--ink);line-height:1.45}
  .ins-note{margin:0 0 9px;font-size:12.5px;color:var(--ink-soft);line-height:1.65}
  .ins-note b{color:var(--ink);font-weight:700}
  .ins-who{display:flex;flex-wrap:wrap;gap:6px}
  .ins-actions{flex:none;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
  .ins-card.is-done{opacity:.5}
  .ins-card.is-done .ins-find{text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:var(--ink-faint)}
  @media (max-width:760px){
    .ins-card{grid-template-columns:auto minmax(0,1fr)}
    .ins-actions{grid-column:1 / -1;flex-direction:row;align-items:center;justify-content:flex-end}
  }

  /* ===== view-roles (ported) ===== */
  /* ===== 07 権限ルール 固有(接頭辞 perm-) ===== */
  .perm-board{padding:clamp(16px,2vw,24px)}
  .perm-matrix{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr 1.5fr;border:1px solid var(--line);border-top-left-radius:12px;border-top-right-radius:12px;overflow:hidden;background:var(--sheet-2);box-shadow:0 1px 0 rgba(255,255,255,.6) inset}
  .perm-cell{padding:11px 14px;font-size:13px;color:var(--ink);line-height:1.45;border-bottom:1px solid var(--line);border-right:1px solid var(--line);min-height:44px;display:flex;align-items:center}
  .perm-cell:nth-child(5n){border-right:0}
  .perm-cell.perm-head{background:var(--kraft);font-family:"Yusei Magic",cursive;font-weight:400;font-size:12.5px;color:var(--ink-soft)}
  .perm-cell.perm-role{font-weight:700;background:rgba(231,222,205,.4)}

  @media (max-width:760px){
    .perm-matrix{grid-template-columns:1fr 1fr}
    .perm-cell{border-right:0}
    .perm-cell:nth-child(5n){border-right:0}
    .perm-cell.perm-role{grid-column:1 / -1}
  }

/* ===== 追補: ログインゲート / top-strip 日付(モックに無い結線用の最小追加) ===== */
.login-gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;
  background-image:radial-gradient(circle at 12% 8%,rgba(255,255,255,.45),transparent 40%),
                   radial-gradient(circle at 92% 92%,rgba(0,0,0,.025),transparent 50%)}
.login-card{width:100%;max-width:420px;padding:26px 26px 30px;display:flex;flex-direction:column;gap:14px}
.login-card .brand{gap:2px;margin-bottom:2px}
.login-sub{margin:0;color:var(--ink-soft);font-size:14px}
.login-devnote{margin:0}
.login-devusers{display:flex;flex-direction:column;gap:8px}
.login-devusers .btn{justify-content:flex-start;text-align:left}
.login-error{margin:0;color:var(--clay);font-size:13px;font-weight:700}
.top-datepick{display:inline-flex;align-items:center;gap:7px}
.top-dateinput{width:auto;min-height:40px;padding:6px 10px;font-size:12.5px}
#user-chip{cursor:default}

/* toast(グローバル・モックの emp-toast とは別に汎用の右下トースト) */
.toast{position:fixed;right:20px;bottom:20px;z-index:40;max-width:min(90vw,420px);
  background:var(--ink);color:#fff;border-radius:12px;padding:12px 16px;font-size:13.5px;font-weight:700;
  box-shadow:0 18px 40px -20px rgba(44,42,38,.9)}
.toast.err{background:var(--clay)}

/* 汎用の空状態(app.js が各動的コンテナに入れる) */
.list-empty{color:var(--ink-soft);font-size:13.5px;padding:14px 2px}

/* role で隠すタブ/ビュー(mock の role-gated-hidden と同義の明示クラス) */
[hidden]{display:none !important}

/* ===== 追補: 社員タスク行(app.js が生成する行の最小スタイル) ===== */
.emp-taskrow{display:flex;align-items:center;gap:12px;padding:11px 14px;border-top:1px solid var(--line)}
.emp-taskrow:first-child{border-top:0}
.emp-taskrow.is-done{opacity:.62}
/* 完了トグル:丸(○/✓)+ ラベルを縦に重ねて「押すと完了になる」と分かる形に(#2)。
   丸は残しつつ主ラベル「完了する/取り消す」+ 小キャプション「完了/完了ずみ」を添える。
   data-emp-* は button 側に維持(子 span のクリックは button へ bubble)。 */
.emp-check{flex:none;min-width:58px;border:0;background:transparent;color:inherit;cursor:pointer;
  font-family:inherit;padding:3px 5px;border-radius:12px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px}
.emp-check:hover{background:rgba(95,140,90,.10)}
.emp-check:active{background:rgba(95,140,90,.16)}
.emp-check-ring{flex:none;width:32px;height:32px;border-radius:50%;border:2px solid var(--kraft-deep);
  background:var(--sheet-2);color:var(--ink-faint);font-size:16px;font-weight:700;line-height:1;
  display:flex;align-items:center;justify-content:center}
.emp-check:hover .emp-check-ring{border-color:var(--green);color:var(--green)}
.emp-check.is-done .emp-check-ring{background:var(--green);border-color:var(--green);color:#fff}
.emp-check-main{font-size:11px;font-weight:700;color:var(--green-deep);line-height:1.1;white-space:nowrap}
.emp-check-cap{font-size:9.5px;font-weight:700;color:var(--ink-faint);line-height:1;white-space:nowrap}
.emp-check.is-done .emp-check-main{color:var(--clay)}       /* 取り消す=撤回トーン */
.emp-check.is-done .emp-check-cap{color:var(--green-deep)}  /* 完了ずみ=現在の状態 */
/* デイリー=書いた時点で完了(§4.2)。押せない静的な済マーク(完了トグルは出さない)。
   32px + 左右 13px = 58px で継続タスクの .emp-check(min-width:58px)と本文位置を揃える。 */
.emp-check-done{flex:none;width:32px;height:32px;margin:0 13px;border-radius:50%;
  background:var(--green);border:2px solid var(--green);color:#fff;
  font-size:16px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center}
.emp-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.emp-row-title{font-size:14px;font-weight:700;color:var(--ink);line-height:1.35;overflow-wrap:anywhere}
/* 状態チップ:押せると分かるよう ▾ を内包し、下に「タップで変更」の小ヒントを添える(#1) */
.emp-chip-wrap{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.emp-taskrow .status-chip{cursor:pointer;border:0;font-family:inherit}
.emp-taskrow .status-chip-int{display:inline-flex;align-items:center;gap:4px}
.status-chip-caret{font-size:9px;line-height:1;opacity:.8}
.emp-chip-hint{font-size:9.5px;font-weight:700;color:var(--ink-faint);line-height:1;white-space:nowrap}
.ins-card.is-resolved{opacity:.5}
.adm-rd-empty{color:var(--ink-faint)}

/* タスク追加のインライン入力(window.prompt を廃した紙面内エディタ・モックの作法で書く) */
.emp-inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding:12px 14px;
  background:var(--sheet-2);border:1px solid var(--line);border-radius:11px}
.emp-add-row .emp-inline{flex:1 1 100%}      /* add-row は flex 親。枠を横いっぱいに(小さく潰れない) */
.emp-inline-input{flex:1 1 240px;min-width:0;font-family:inherit;font-size:14px;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:11px 13px;min-height:46px}
.emp-inline-input::placeholder{color:var(--ink-faint)}
.emp-inline-input:focus{outline:2px solid var(--green);outline-offset:1px;border-color:var(--green)}
.emp-inline .btn.sm{flex:none}

/* 継続タスクの「これまでの動き」= 常時表示の進捗タイムライン + 今日ぶんの追記入力(モックの emp-prog) */
.emp-prog{margin:2px 14px 12px 46px;padding:11px 13px;background:rgba(94,125,176,.06);
  border:1px solid rgba(94,125,176,.22);border-radius:10px}
.emp-prog-title{font-size:11.5px;font-weight:700;color:var(--blue);margin-bottom:7px}
.emp-prog-timeline{display:flex;flex-direction:column;gap:5px;margin-bottom:10px}
.emp-prog-item{font-size:12.5px;line-height:1.55;color:var(--ink-soft);overflow-wrap:anywhere}
.emp-prog-d{font-weight:700;color:var(--ink);margin-right:7px}
.emp-prog-empty{font-size:12.5px;color:var(--ink-faint);margin:0}
.emp-prog-more{align-self:flex-start;font-family:inherit;font-size:11.5px;font-weight:700;color:var(--blue);
  background:transparent;border:0;cursor:pointer;padding:2px 0;text-decoration:underline;text-underline-offset:2px}
.emp-prog-more:hover{color:var(--ink)}
.emp-prog-extra{display:flex;flex-direction:column;gap:5px;margin-top:5px;max-height:220px;overflow-y:auto}
.emp-prog-extra[hidden]{display:none}
.emp-prog-addrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.emp-prog-input{flex:1 1 220px;min-width:0;font-family:inherit;font-size:13.5px;color:var(--ink);
  background:var(--paper);border:1px solid var(--line);border-radius:9px;padding:9px 12px;min-height:44px}
.emp-prog-input::placeholder{color:var(--ink-faint)}
.emp-prog-input:focus{outline:2px solid var(--blue);outline-offset:1px;border-color:var(--blue)}
.emp-prog-addrow .btn.sm{flex:none}

/* ===== 08 ユーザー管理(接頭辞 usr-) ===== */
.usr-addcard{padding:16px 18px;margin-bottom:16px}
.usr-addhead{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.usr-addhead h2{margin:0;font-family:"Yusei Magic",cursive;font-weight:400;font-size:17px;line-height:1.2}
.usr-addgrid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) 140px auto;gap:0 16px;align-items:end}
.usr-addgrid .field{margin-bottom:0}
.usr-addgrid .field>label,.aud-filter-grid .field>label{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:5px}
.usr-col-btn{display:flex;align-items:flex-end}
.usr-col-btn .btn{width:100%;white-space:nowrap}
.usr-add-msg{margin:11px 2px 0}

.usr-sheet{padding:0;overflow:hidden}
.usr-table{display:flex;flex-direction:column}
.usr-row{display:grid;grid-template-columns:150px minmax(0,1fr) 150px 96px 116px;gap:14px;
  align-items:center;padding:11px clamp(16px,2vw,22px);border-top:1px solid var(--line)}
.usr-row.head{border-top:0;background:var(--kraft);font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--ink-soft)}
.usr-name{font-size:13.5px;font-weight:700;color:var(--ink);line-height:1.4;overflow-wrap:anywhere}
.usr-email{font-size:12.5px;color:var(--ink-soft);overflow-wrap:anywhere;min-width:0}
.usr-date{font-size:12px;color:var(--ink-soft)}
.usr-role .select.usr-role-sel{padding:6px 26px 6px 10px;font-size:12.5px;min-height:38px}
.usr-toggle{min-height:38px}
.usr-toggle.is-inactive{background:transparent;border-style:dashed;color:var(--ink-soft)}
.usr-selfwrap{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.usr-row.is-inactive{background:rgba(44,42,38,.03)}
.usr-row.is-inactive .usr-name{color:var(--ink-soft)}

@media (max-width:820px){
  .usr-addgrid{grid-template-columns:1fr 1fr}
  .usr-col-btn{grid-column:1 / -1}
  .usr-row{grid-template-columns:1fr 1fr;gap:7px 14px}
  .usr-row.head{display:none}
  .usr-email{grid-column:1 / -1}
}
@media (max-width:480px){
  .usr-addgrid{grid-template-columns:1fr}
  .usr-row{grid-template-columns:1fr}
  .usr-email{grid-column:auto}
}

/* ===== 09 監査ログ(接頭辞 aud-) ===== */
.aud-filter{padding:14px 16px;margin-bottom:14px}
.aud-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:0 14px;align-items:end}
.aud-filter-grid .field{margin-bottom:0}
.aud-col-btn{display:flex;align-items:flex-end}
.aud-col-btn .btn{width:100%;white-space:nowrap}

.aud-sheet{padding:0;overflow-x:auto}
.aud-table{display:flex;flex-direction:column;min-width:820px}
.aud-row{display:grid;grid-template-columns:132px 112px 116px 148px minmax(160px,1fr) 116px;gap:14px;
  align-items:start;padding:11px 18px;border-top:1px solid var(--line)}
.aud-row.head{border-top:0;background:var(--kraft);font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--ink-soft)}
.aud-at{font-size:12px;color:var(--ink-soft);font-weight:700;white-space:nowrap}
.aud-actor{font-size:12.5px;font-weight:700;color:var(--ink);overflow-wrap:anywhere;min-width:0}
.aud-target{font-size:12.5px;color:var(--ink);overflow-wrap:anywhere;min-width:0}
.aud-detail{font-size:12.5px;color:var(--ink-soft);line-height:1.55;overflow-wrap:anywhere;min-width:0}
.aud-ip{font-size:12px;color:var(--ink-soft);white-space:nowrap}

@media (max-width:680px){
  .aud-filter-grid{grid-template-columns:1fr 1fr}
  .aud-col-btn{grid-column:1 / -1}
}