/* ============================================================
   ケアパスワークス（Care Path Works） — ケアマネ案件管理CRM
   デザイン方針: 業務SaaS（Linear / Notion 系の落ち着いた精度感）。
   行政システム感を排し、温かみのある紙色 + 単一アクセント(松緑)で構成。

   v52: UIリニューアル Phase1（デザイントークン刷新）
   ・CarePathWorks専用「介護グリーン」を基調にした配色へ調整
   ・カード/ボタン/フォームの角丸・余白・シャドウを見直し、より先進的で
     落ち着いた質感に更新（機能・構造・既存セレクタは一切変更なし）
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&family=Schibsted+Grotesk:wght@500;600;700&display=swap');

:root{
  --bg:#f5f7f6; --panel:#ffffff; --panel-2:#f5f8f7;
  --border:#e3e9e6; --border-strong:#d4ddd9;
  --ink:#15211d; --text:#28332f; --text-soft:#57635d; --muted:#697269; --faint:#a3aba6;
  --accent:#0f766e; --accent-2:#0e8a73; --accent-deep:#0a5347; --accent-ink:#0a574f; --accent-weak:#e3f2ee;
  --rose:#c0413b; --rose-bg:#fbeae8; --amber:#a1720f; --amber-bg:#f9efd9;
  --blue:#2f6db5; --blue-bg:#e7eff8; --violet:#6a52c4; --violet-bg:#ece8fa;
  --green:#2f8f5b; --green-bg:#e4f3ea; --teal:#0f766e; --teal-bg:#e4f0ee;
  --gray:#7c8580; --gray-bg:#eef1ef;
  --ok-fg:#2f8f5b; --warn-fg:#a1720f; --full-fg:#c0413b;
  --radius:16px; --radius-sm:11px; --radius-lg:20px;
  --shadow:0 1px 2px rgba(14,32,27,.04),0 6px 18px rgba(14,32,27,.06);
  --shadow-lift:0 14px 34px rgba(14,32,27,.14);
  --shadow-btn:0 2px 7px rgba(15,118,110,.22);
  --sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --display:"Schibsted Grotesk","Noto Sans JP",sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
html{scrollbar-color:var(--border-strong) transparent;scrollbar-width:thin;}
body{font-family:var(--sans);background:var(--bg);color:var(--text);font-size:14.5px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:999px;}
::-webkit-scrollbar-thumb:hover{background:var(--faint);}
a{color:var(--accent);text-decoration:none;cursor:pointer;}
a:hover{text-decoration:underline;}
h1,h2,h3{margin:0;font-weight:700;color:var(--ink);}
p{margin:0 0 .6em;}
.muted{color:var(--muted);} .faint{color:var(--faint);}
.small{font-size:.82rem;} .tabnum{font-variant-numeric:tabular-nums;}
.icon{flex-shrink:0;display:inline-block;vertical-align:middle;}

/* v54: キーボード操作時のフォーカス可視化（アクセシビリティ） */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, .lane-card:focus-visible, .nav a:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px; border-radius:6px;
}
/* v54: 動きに敏感なユーザー向け設定を尊重し、アニメーションを最小限に抑える */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}

.layout{display:flex;min-height:100vh;}
.sidebar{width:240px;flex-shrink:0;background:var(--panel);border-right:1px solid var(--border);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;}
.brand{padding:20px 18px 16px;}
.brand{position:relative;}
.drawer-close-btn{display:none;}
.brand .logo{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:1.12rem;color:var(--ink);letter-spacing:-.01em;}
.brand .logo .mark{font-size:1.15rem;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(155deg,var(--accent-2),var(--accent-deep));box-shadow:var(--shadow-btn);flex-shrink:0;}
.brand .sub{font-size:.72rem;color:var(--faint);margin-top:5px;letter-spacing:.02em;}
.nav{display:flex;flex-direction:column;gap:3px;padding:8px 12px;flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent;}
.nav::-webkit-scrollbar{width:6px;}
.nav::-webkit-scrollbar-thumb{background:var(--border);border-radius:999px;}
.nav::-webkit-scrollbar-thumb:hover{background:var(--border-strong);}
.nav-label{font-size:.66rem;font-weight:700;color:var(--faint);letter-spacing:.07em;text-transform:none;padding:14px 11px 5px;}
.nav-label:first-child{padding-top:4px;}
.nav a{display:flex;align-items:center;gap:11px;padding:9px 11px;border-radius:10px;color:var(--text-soft);font-weight:500;font-size:.9rem;transition:background .14s,color .14s,box-shadow .14s;}
.nav a:hover{background:var(--panel-2);text-decoration:none;color:var(--ink);}
.nav a.active{background:var(--accent-weak);color:var(--accent-ink);font-weight:700;box-shadow:inset 3px 0 0 var(--accent);}
.nav a .ico{font-size:1.05rem;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;text-align:center;flex-shrink:0;border-radius:8px;transition:background .14s;}
.nav a.active .ico{background:var(--panel);box-shadow:var(--shadow);}
.nav a .nav-tx{display:flex;flex-direction:column;line-height:1.25;min-width:0;}
.nav a .nav-tx small{font-size:.66rem;color:var(--faint);font-weight:500;letter-spacing:.01em;}
.nav a.active .nav-tx small{color:var(--accent);}
.foot{padding:16px;border-top:1px solid var(--border);font-size:.8rem;}
.foot .who{display:flex;align-items:center;gap:8px;color:var(--text);font-weight:500;}
.foot .logout{display:flex;align-items:center;gap:8px;margin-top:7px;color:var(--muted);font-size:.78rem;padding:6px 11px;border-radius:9px;text-decoration:none;transition:.12s;}
.foot .logout:hover{background:var(--rose-bg);color:var(--rose);text-decoration:none;}
.avatar{width:27px;height:27px;border-radius:50%;background:linear-gradient(155deg,var(--accent-2),var(--accent-deep));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:700;font-family:var(--display);letter-spacing:.02em;}
.avatar.sm{width:22px;height:22px;font-size:.6rem;}
.main{flex:1;min-width:0;display:flex;flex-direction:column;}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 26px;background:rgba(255,255,255,.86);backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid var(--border);transition:box-shadow .18s;}
.topbar.is-scrolled{box-shadow:0 4px 18px rgba(14,32,27,.08);}
.page-title{font-family:var(--display);font-size:1.2rem;font-weight:600;color:var(--ink);letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.topbar-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1 1 auto;overflow:hidden;}
.drawer-open-btn{flex-shrink:0;}
.drawer-open-btn{display:none;}
.drawer-backdrop{display:none;}
.bottom-nav{display:none;}
.topbar-right{display:flex;align-items:center;gap:14px;flex-shrink:0;}
.topbar-right .user{display:flex;align-items:center;gap:7px;color:var(--text-soft);font-size:.86rem;font-weight:500;}
.btn .btn-ico{display:inline-flex;}
.content{padding:24px 26px 60px;max-width:1320px;width:100%;}

.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:20px 22px;box-shadow:var(--shadow);margin-bottom:16px;}
.section-title{display:flex;align-items:center;gap:9px;font-size:.98rem;font-weight:700;color:var(--ink);margin-bottom:14px;letter-spacing:-.005em;}
.section-title .ico{font-size:1.05rem;}

.grid{display:grid;gap:14px;}
.grid.cols-2{grid-template-columns:repeat(2,1fr);}
.grid.cols-3{grid-template-columns:repeat(3,1fr);}
.grid.cols-4{grid-template-columns:repeat(4,1fr);}
.flex{display:flex;align-items:center;gap:8px;}
.flex.between{justify-content:space-between;}
.flex.wrap{flex-wrap:wrap;}
@media(max-width:920px){.grid.cols-4{grid-template-columns:repeat(2,1fr);}.grid.cols-3{grid-template-columns:1fr;}.grid.cols-2{grid-template-columns:1fr;}}

.stat{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:13px 15px;}
.stat .label{font-size:.74rem;color:var(--muted);font-weight:500;letter-spacing:.02em;}
.stat .num{font-family:var(--display);font-size:1.7rem;font-weight:600;color:var(--ink);line-height:1.1;margin-top:2px;font-variant-numeric:tabular-nums;}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid transparent;background:var(--accent);color:#fff;font-weight:600;font-size:.86rem;height:38px;padding:0 16px;border-radius:10px;cursor:pointer;transition:background .13s,box-shadow .13s,transform .08s;font-family:var(--sans);box-shadow:var(--shadow-btn);}
.btn:hover{background:var(--accent-ink);text-decoration:none;box-shadow:0 4px 12px rgba(15,118,110,.28);transform:translateY(-1px);}
.btn:active{transform:translateY(0);box-shadow:0 1px 3px rgba(15,118,110,.25);}
.btn.sm{height:31px;padding:0 12px;font-size:.8rem;border-radius:9px;}
.btn.ghost{background:transparent;border-color:var(--border-strong);color:var(--text);box-shadow:none;}
.btn.ghost:hover{background:var(--panel-2);border-color:var(--faint);box-shadow:none;transform:translateY(-1px);}
.btn.danger{background:transparent;border-color:var(--rose);color:var(--rose);box-shadow:none;}
.btn.danger:hover{background:var(--rose-bg);box-shadow:none;}

.badge{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:600;padding:3px 10px;border-radius:999px;line-height:1.5;white-space:nowrap;background:var(--gray-bg);color:var(--gray);}
.badge.cat{background:var(--panel-2);color:var(--text-soft);border:1px solid var(--border);font-weight:500;}
.badge.neutral{background:var(--gray-bg);color:var(--gray);}
.badge.ok{background:var(--green-bg);color:var(--ok-fg);}
.badge.warn{background:var(--amber-bg);color:var(--warn-fg);}
.badge.full{background:var(--rose-bg);color:var(--full-fg);}
.s-new{background:var(--gray-bg);color:#5d574e;}
.s-blue{background:var(--blue-bg);color:var(--blue);}
.s-amber{background:var(--amber-bg);color:var(--amber);}
.s-violet{background:var(--violet-bg);color:var(--violet);}
.s-teal{background:var(--teal-bg);color:var(--teal);}
.s-green{background:var(--green-bg);color:var(--green);}
.s-gray{background:var(--gray-bg);color:var(--gray);}
.s-rose{background:var(--rose-bg);color:var(--rose);}

.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-sm);}
table{width:100%;border-collapse:collapse;font-size:.86rem;}
thead th{text-align:left;font-size:.72rem;font-weight:600;color:var(--muted);letter-spacing:.03em;padding:10px 14px;background:var(--panel-2);border-bottom:1px solid var(--border);white-space:nowrap;}
tbody td{padding:11px 14px;border-bottom:1px solid var(--border);vertical-align:top;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:var(--panel-2);}
.num-cell{font-variant-numeric:tabular-nums;}

.breadcrumb{font-size:.82rem;color:var(--muted);margin-bottom:12px;}
.detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.detail-head .title{font-family:var(--display);font-size:1.4rem;font-weight:600;color:var(--ink);margin-bottom:8px;letter-spacing:-.01em;}
.kv{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;margin:0;font-size:.88rem;}
.kv dt{color:var(--muted);font-weight:500;white-space:nowrap;}
.kv dd{margin:0;color:var(--text);}
.tag{display:inline-flex;align-items:center;font-size:.74rem;padding:3px 10px;border-radius:8px;background:var(--panel-2);border:1px solid var(--border);color:var(--muted);}
.tag.on{background:var(--accent-weak);border-color:transparent;color:var(--accent-ink);font-weight:600;}
.empty{padding:28px;text-align:center;color:var(--faint);font-size:.88rem;}
.notice{background:var(--amber-bg);border:1px solid #ecd9ac;color:#7a5a14;font-size:.8rem;padding:9px 13px;border-radius:10px;margin-bottom:12px;}
.hint{font-size:.78rem;color:var(--muted);}
.flash{background:var(--accent-weak);color:var(--accent-ink);padding:11px 15px;border-radius:10px;font-size:.86rem;margin-bottom:14px;}
.alert-stale{color:var(--full-fg);font-weight:600;}

/* 案件詳細：次にやること（最重要サマリ） */
.next-hero{display:flex;gap:20px;align-items:stretch;background:linear-gradient(180deg,var(--accent-weak),var(--panel));border:1px solid #cfe3e0;border-left:4px solid var(--accent);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow);margin-bottom:16px;flex-wrap:wrap;}
.next-hero.is-overdue{background:linear-gradient(180deg,var(--rose-bg),var(--panel));border-color:#eccac6;border-left-color:var(--rose);}
.next-hero.is-closed{background:var(--panel-2);border-color:var(--border);border-left-color:var(--gray);}
.next-hero .nh-main{flex:1;min-width:240px;}
.next-hero .nh-label{font-size:.74rem;font-weight:700;letter-spacing:.04em;color:var(--accent-ink);}
.next-hero.is-overdue .nh-label{color:var(--full-fg);}
.next-hero.is-closed .nh-label{color:var(--muted);}
.next-hero .nh-action{font-family:var(--display);font-size:1.45rem;font-weight:600;color:var(--ink);line-height:1.3;margin-top:4px;letter-spacing:-.01em;}
.next-hero .nh-action .nh-empty{font-family:var(--sans);font-size:1rem;font-weight:500;color:var(--faint);}
.next-hero .nh-when{display:flex;align-items:center;gap:10px;margin-top:10px;flex-wrap:wrap;}
.next-hero .nh-when .nh-date{font-size:.9rem;font-weight:600;color:var(--text);font-variant-numeric:tabular-nums;}
.next-hero .nh-facts{display:flex;flex-direction:column;gap:8px;justify-content:center;min-width:230px;border-left:1px solid var(--border);padding-left:18px;}
.next-hero .nh-fact{display:flex;align-items:baseline;gap:10px;}
.next-hero .nh-fact .nh-ft{width:78px;flex-shrink:0;font-size:.76rem;color:var(--muted);font-weight:500;}
.next-hero .nh-fact .nh-fv{font-size:.86rem;color:var(--text);min-width:0;}
@media(max-width:680px){.next-hero .nh-facts{border-left:none;border-top:1px solid var(--border);padding-left:0;padding-top:12px;width:100%;}}

/* 案件詳細：問い合わせ履歴タイムライン */
.timeline{list-style:none;margin:2px 0 0;padding:0;position:relative;}
.timeline::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--border);}
.tl-item{position:relative;padding:0 0 16px 26px;}
.tl-item:last-child{padding-bottom:2px;}
.tl-dot{position:absolute;left:0;top:4px;width:14px;height:14px;border-radius:50%;background:var(--gray);border:2px solid var(--panel);box-shadow:0 0 0 1px var(--border-strong);}
.tl-dot[data-kind="問い合わせ"],.tl-dot[data-kind="事業所問い合わせ"]{background:var(--accent);}
.tl-dot[data-kind="情報提供"]{background:var(--blue);}
.tl-dot[data-kind="見学調整中"]{background:var(--blue);}
.tl-dot[data-kind="見学"],.tl-dot[data-kind="見学実施"]{background:var(--amber);}
.tl-dot[data-kind="家族連絡"]{background:var(--violet);}
.tl-dot[data-kind="契約確認"]{background:var(--teal);}
.tl-dot[data-kind="利用開始フォロー"]{background:var(--green);}
.tl-dot[data-kind="失注理由記録"]{background:var(--rose);}
.tl-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.tl-head .tl-date{font-weight:600;font-size:.84rem;color:var(--ink);font-variant-numeric:tabular-nums;}
.tl-head .tl-fac,.tl-head .tl-actor{font-size:.78rem;color:var(--muted);}
.tl-note{font-size:.86rem;color:var(--text);margin-top:3px;}

.req{font-size:.66rem;font-weight:700;color:var(--rose);background:var(--rose-bg);padding:1px 6px;border-radius:999px;margin-left:4px;letter-spacing:.02em;}

.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px;margin-bottom:12px;}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:11px;}
.field.full{grid-column:1/-1;}
.field.mb0{margin-bottom:0;}
.field label{font-size:.78rem;color:var(--text-soft);font-weight:600;letter-spacing:.01em;}
.field input,.field select,.field textarea,input[type=search]{font-family:var(--sans);font-size:.88rem;color:var(--text);background:#fff;border:1px solid var(--border-strong);border-radius:10px;padding:9px 12px;min-height:38px;width:100%;transition:border-color .13s,box-shadow .13s;}
.field input:focus,.field select:focus,.field textarea:focus,input[type=search]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-weak);}
.field textarea{min-height:64px;resize:vertical;}
.checkbox{display:flex;align-items:center;gap:7px;font-size:.86rem;font-weight:500;color:var(--text);cursor:pointer;}
.checkbox input{width:auto;min-height:auto;}
.filter-actions{display:flex;gap:8px;margin-top:6px;}
@media(max-width:680px){.form-grid{grid-template-columns:1fr;}}

.list-row{border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:8px;background:var(--panel);overflow:hidden;}
.list-row>summary{list-style:none;cursor:pointer;padding:12px 15px;font-size:.9rem;font-weight:500;display:block;transition:.12s;}
.list-row>summary::-webkit-details-marker{display:none;}
.list-row>summary:hover{background:var(--panel-2);}
.list-row[open]>summary{border-bottom:1px solid var(--border);background:var(--panel-2);}
.list-row .body{padding:15px;}

.pipe{display:flex;align-items:stretch;flex-wrap:wrap;gap:4px;}
.pipe-step{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:82px;padding:10px 6px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--panel);text-decoration:none;color:var(--text);transition:.13s;cursor:pointer;}
.pipe-step:hover{border-color:var(--accent);background:var(--accent-weak);text-decoration:none;transform:translateY(-1px);}
.pipe-step .pipe-n{font-family:var(--display);font-size:1.3rem;font-weight:600;line-height:1;color:var(--accent);}
.pipe-step .pipe-l{font-size:.7rem;color:var(--muted);margin-top:4px;text-align:center;white-space:nowrap;}
.pipe-step.lost .pipe-n{color:var(--rose);}
.pipe-arrow{display:flex;align-items:center;color:var(--faint);font-size:1rem;}

/* v53: 今日のボード — ウェルカムカード */
.welcome-card{background:linear-gradient(155deg,var(--panel),var(--accent-weak) 220%);padding:17px 20px;}
.welcome-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.welcome-hi{font-family:var(--display);font-size:1.14rem;font-weight:700;color:var(--ink);letter-spacing:-.01em;}
.welcome-sub{margin:3px 0 0;font-size:.85rem;color:var(--text-soft);}
.welcome-cta{flex-shrink:0;white-space:nowrap;box-shadow:0 3px 10px rgba(15,118,110,.28);}
.welcome-stats{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap;}
@media(max-width:600px){
  .welcome-card{padding:14px 16px;}
  .welcome-hi{font-size:1.05rem;}
  .welcome-sub{font-size:.8rem;}
  .welcome-top{align-items:flex-start;}
  .welcome-cta{width:100%;justify-content:center;}
}

/* v53: 今日のボード — 6レーンを横長アクセントカードへ再設計（意味・件数・取得ロジックは無変更） */
.lane-cards{display:flex;flex-direction:column;gap:9px;margin-bottom:16px;}
.lane-card{--lc-accent:var(--accent);display:flex;align-items:center;gap:14px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);padding:13px 16px 13px 0;box-shadow:0 1px 2px rgba(14,32,27,.03),0 2px 8px rgba(14,32,27,.04);position:relative;overflow:hidden;color:inherit;transition:box-shadow .12s ease,transform .12s ease;}
.lane-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--lc-accent);}
.lane-card:hover{box-shadow:0 4px 16px rgba(14,32,27,.09);transform:translateY(-1px);text-decoration:none;}
.lane-card:active{transform:translateY(0.5px) scale(.994);box-shadow:0 1px 3px rgba(14,32,27,.06);transition-duration:.1s;}
.lane-card .lc-icon{flex-shrink:0;margin-left:16px;width:36px;height:36px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:var(--lc-accent);color:#fff;}
.lane-card .lc-body{flex:1;min-width:0;}
.lane-card .lc-title{display:block;font-weight:700;font-size:.94rem;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lane-card .lc-note{display:block;font-size:.78rem;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lane-card .lc-count{flex-shrink:0;font-family:var(--display);font-weight:700;font-size:.86rem;color:#fff;background:var(--lc-accent);min-width:25px;height:25px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;}
.lane-card .lc-chevron{flex-shrink:0;color:var(--faint);}
@media(max-width:600px){
  .lane-card{padding:10px 12px 10px 0;gap:11px;}
  .lane-card .lc-icon{margin-left:12px;width:32px;height:32px;}
  .lane-card .lc-title{font-size:.88rem;}
  .lane-card .lc-note{font-size:.73rem;}
}

/* v53: 未完了の次アクション — グループ/アイテム表示（取得ロジック・分類順・案件リンクは無変更） */
.action-group{margin-bottom:16px;}
.action-group:last-child{margin-bottom:0;}
.action-group-head{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:700;color:var(--text-soft);margin-bottom:6px;}
.action-group-head .ag-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.action-group-head .ag-icon{color:var(--muted);display:inline-flex;}
.action-group-head .ag-count{margin-left:auto;font-size:.72rem;font-weight:700;color:var(--muted);background:var(--panel-2);border:1px solid var(--border);padding:1px 8px;border-radius:999px;}
.action-item{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-bottom:7px;color:inherit;background:var(--panel);transition:background .12s,border-color .12s;}
.action-item:hover{background:var(--panel-2);border-color:var(--border-strong);text-decoration:none;}
.action-item .ai-main{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.action-item .ai-nm{font-weight:600;font-size:.88rem;color:var(--ink);min-width:0;}
.action-item .ai-meta{font-size:.75rem;color:var(--muted);}
.action-item .ai-action{font-size:.82rem;color:var(--text-soft);}
.show-more-btn{display:inline-flex;align-items:center;gap:4px;background:none;border:none;color:var(--accent);font-size:.8rem;font-weight:600;font-family:var(--sans);cursor:pointer;padding:4px 2px;}
.show-more-btn:hover{text-decoration:underline;}
.show-more-extra[hidden]{display:none;}

/* v53: 紹介の進捗・最近更新した案件 — PC 2カラム表示用（既存データ・リンクは無変更） */
.dash-bottom-grid{align-items:start;}
.dash-bottom-grid > *{min-width:0;}

.board-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;}
.seg{display:inline-flex;border:1px solid var(--border-strong);border-radius:10px;overflow:hidden;}
.seg a{padding:7px 15px;font-size:.82rem;font-weight:600;color:var(--text-soft);background:#fff;}
.seg a:hover{background:var(--panel-2);text-decoration:none;}
.seg a.on{background:var(--accent);color:#fff;}
.kanban{display:flex;gap:12px;overflow-x:auto;padding-bottom:14px;align-items:flex-start;}
.kb-col{flex:0 0 256px;background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;}
.kb-col.drop-target{border-color:var(--accent);background:var(--accent-weak);box-shadow:0 0 0 2px var(--accent-weak);}
.kb-head{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:11px 13px;border-bottom:1px solid var(--border);border-top:3px solid var(--stage,var(--gray));border-radius:var(--radius) var(--radius) 0 0;}
.kb-head .kb-name{font-weight:700;font-size:.84rem;color:var(--ink);}
.kb-head .kb-count{font-size:.74rem;font-weight:600;color:var(--muted);background:#fff;border:1px solid var(--border);padding:1px 8px;border-radius:999px;}
.kb-cards{display:flex;flex-direction:column;gap:9px;padding:11px;min-height:48px;}
.kb-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 12px;box-shadow:var(--shadow);cursor:grab;transition:box-shadow .13s,transform .13s;border-left:3px solid var(--stage,var(--gray));}
.kb-card:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px);}
.kb-card.dragging{opacity:.45;}
.kb-card .kc-top{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.kb-card .kc-name{font-weight:600;font-size:.86rem;color:var(--ink);}
.kb-card .kc-fac{font-size:.76rem;color:var(--muted);margin-top:3px;}
.kb-card .kc-meta{display:flex;align-items:center;gap:6px;margin-top:7px;flex-wrap:wrap;}
.kb-empty{color:var(--faint);font-size:.78rem;padding:10px 2px;text-align:center;}
.kb-col.is-lost .kb-head{border-top-color:var(--rose);}

.axis{display:flex;align-items:center;gap:10px;margin:7px 0;}
.axis .axis-l{width:96px;font-size:.82rem;color:var(--text-soft);font-weight:500;}
.axis .axis-track{flex:1;height:8px;background:var(--panel-2);border:1px solid var(--border);border-radius:999px;overflow:hidden;}
.axis .axis-fill{height:100%;background:var(--accent);border-radius:999px;}
.axis .axis-v{width:26px;text-align:right;font-variant-numeric:tabular-nums;font-weight:600;font-size:.82rem;color:var(--accent-ink);}

.funnel{display:flex;flex-direction:column;gap:8px;}
.funnel-row{display:flex;align-items:center;gap:12px;}
.funnel-row .fl{width:74px;font-size:.84rem;color:var(--text-soft);font-weight:500;}
.funnel-row .ftrack{flex:1;height:30px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;overflow:hidden;position:relative;}
.funnel-row .ffill{height:100%;background:linear-gradient(90deg,var(--accent),var(--teal));display:flex;align-items:center;padding-left:10px;color:#fff;font-size:.8rem;font-weight:600;min-width:2px;}
.funnel-row .fpct{width:96px;text-align:right;font-size:.82rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.bar-row{display:flex;align-items:center;gap:12px;margin:7px 0;}
.bar-row .bl{width:130px;font-size:.84rem;color:var(--text-soft);}
.bar-row .btrack{flex:1;height:20px;background:var(--panel-2);border:1px solid var(--border);border-radius:6px;overflow:hidden;}
.bar-row .bfill{height:100%;background:var(--rose);border-radius:6px;}
.bar-row .bv{width:78px;text-align:right;font-size:.82rem;color:var(--muted);font-variant-numeric:tabular-nums;}

.week-full{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;}
.week-full .d{border:1px solid var(--border);border-radius:8px;padding:8px 4px;text-align:center;background:var(--panel-2);}
.week-full .d .wd{display:block;font-size:.72rem;color:var(--muted);}
.week-full .d .st{display:block;font-size:.74rem;font-weight:600;margin-top:3px;}
.week-full .d.ok{background:var(--green-bg);} .week-full .d.ok .st{color:var(--ok-fg);}
.week-full .d.warn{background:var(--amber-bg);} .week-full .d.warn .st{color:var(--warn-fg);}
.week-full .d.full{background:var(--rose-bg);} .week-full .d.full .st{color:var(--full-fg);}
.check-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
@media(max-width:680px){.week-full,.check-grid{grid-template-columns:repeat(4,1fr);}}
.fac-name{font-weight:600;color:var(--ink);}

.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 600px at 70% -10%, #e9f3f0 0%, var(--bg) 55%);}
.login-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);padding:36px;width:380px;max-width:92vw;}
.login-card .logo{display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:700;font-size:1.3rem;color:var(--ink);margin-bottom:4px;}
.login-card .tagline{color:var(--muted);font-size:.85rem;margin-bottom:22px;}
.login-card .demo{margin-top:16px;font-size:.78rem;color:var(--muted);background:var(--panel-2);border:1px dashed var(--border-strong);border-radius:10px;padding:10px 13px;}
.login-error{background:var(--rose-bg);color:var(--full-fg);font-size:.82rem;padding:9px 13px;border-radius:10px;margin-bottom:12px;}

/* ---- topbar ログアウトボタン（スマホ含む全画面で表示） ---- */
.topbar-logout {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: .8rem;
  color: var(--muted, #6b7280);
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .15s, color .15s;
}
.topbar-logout:hover {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}
/* v54: topbar ユーザー名 — 通常の名前は全文表示。極端に長い場合のみ緩やかに省略する
   安全ネット（旧: 768px以下で3.5em切り詰め、"admi..."のように不自然に見えていたため撤去）。
   600px以下では display:none で完全非表示にするため、このルールは600pxメディアクエリより
   前に置く必要がある（カスケード順で後勝ちのため、順序を誤ると狭幅で再表示されてしまう）。 */
.topbar-uname{
  max-width:11em;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  display:inline-block;
  vertical-align:middle;
}
@media (max-width: 920px) {
  /* スマホではテキストを省略してアイコンのみ表示 */
  .topbar-logout { padding: 6px 8px; font-size: .85rem; }
}
@media (max-width: 600px) {
  /* v53: 狭幅では「新規案件」「ログアウト」をアイコンのみにし、ユーザー名を隠して
     ハンバーガー・タイトル・ボタン群がすべて1行に収まるようにする（縦書き化・はみ出し防止） */
  .btn-label { display: none; }
  .btn.ghost.sm { padding: 0 10px; min-width:44px; min-height:44px; }
  .topbar-uname { display: none; }
  .topbar-logout-tx { display: none; }
  .topbar-logout { padding: 10px; min-width:44px; min-height:44px; justify-content:center; }
  .topbar-right { gap: 6px; }
  /* v54: ヘッダーの高さを必要以上に大きくしない（タップ領域44pxは維持） */
  .topbar { padding: 6px 14px; gap: 10px; }
  .content { padding-left: 14px; padding-right: 14px; }
}

/* ============================================================
   V21: スマホ改善 (実装3・実装4)
   ============================================================ */

/* v53: スマホ・タブレット共通ヘッダー/サイドバー再設計（ドロワー方式＋下部固定ナビ） */
@media(max-width:920px){
  /* サイドバーはハンバーガーから開くドロワーに変更（既存リンク・メニュー構成は無変更） */
  .sidebar{
    position:fixed; top:0; left:0; z-index:70;
    width:280px; max-width:86vw; height:100dvh;
    transform:translateX(-100%);
    transition:transform .22s ease;
    box-shadow:var(--shadow-lift);
  }
  .sidebar.is-open{transform:translateX(0);}
  .drawer-open-btn{
    display:inline-flex; align-items:center; justify-content:center;
    width:44px; height:44px; flex-shrink:0;
    background:none; border:1px solid var(--border-strong); border-radius:10px;
    color:var(--text); cursor:pointer; padding:0;
  }
  .drawer-open-btn:hover{background:var(--panel-2);}
  .drawer-close-btn{
    display:inline-flex; align-items:center; justify-content:center;
    position:absolute; top:16px; right:14px; width:30px; height:30px;
    background:none; border:none; border-radius:8px; color:var(--muted); cursor:pointer;
  }
  .drawer-close-btn:hover{background:var(--panel-2);}
  .drawer-backdrop{
    display:block; position:fixed; inset:0; z-index:65;
    background:rgba(13,28,24,.45);
    opacity:0; pointer-events:none; transition:opacity .2s;
  }
  .drawer-backdrop.is-open{opacity:1; pointer-events:auto;}
  body.drawer-open{overflow:hidden;}

  /* ドロワー内は通常表示（ラベル省略なし）。項目が多い場合は内部スクロール。 */
  .nav{
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    flex:1;
  }
  .nav a{min-height:44px;}

  /* スマホ専用固定下部ナビ */
  .bottom-nav{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:50;
    background:rgba(255,255,255,.97); backdrop-filter:saturate(140%) blur(10px);
    border-top:1px solid var(--border);
    padding:7px 4px calc(7px + env(safe-area-inset-bottom));
    justify-content:space-around;
    box-shadow:0 -4px 16px rgba(14,32,27,.06);
  }
  .bottom-nav a, .bottom-nav button{
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    flex:1; min-width:0; max-width:92px; min-height:44px;
    padding:5px 4px; border-radius:11px;
    background:none; border:none; cursor:pointer;
    color:var(--muted); font-size:.64rem; font-weight:600; font-family:var(--sans);
    text-decoration:none; transition:background .12s,color .12s;
  }
  .bottom-nav a:hover, .bottom-nav button:hover{text-decoration:none; background:var(--panel-2);}
  .bottom-nav a.on{color:var(--accent); background:var(--accent-weak); font-weight:700;}
  .bottom-nav a span:last-child, .bottom-nav button span:last-child{
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%; line-height:1.1;
  }

  /* 下部ナビと本文が重ならないよう余白を確保 */
  .content{padding-bottom:calc(82px + env(safe-area-inset-bottom));}
}

/* v34fix: 利用者フォーム 生年月日入力 レスポンシブ対応 */
.birth-date-row,
.era-date-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
@media (max-width: 640px) {
  .birth-date-row,
  .era-date-row {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }
  .birth-date-row select,
  .era-date-row select {
    width: 100% !important;
    min-width: 0;
    box-sizing: border-box;
  }
  .birth-date-row .small.muted,
  .era-date-row .small.muted {
    display: none;
  }
  .birth-date-sections {
    flex-direction: column;
    align-items: stretch;
  }
}

/* ============================================================
   V54fix: サ責モード・ダッシュボード スマホ表示崩れ修正
   対象: app/templates/shift/dashboard.html のみ
   （他画面と機能・データ・URLは無変更。表示崩れの原因だった
   固定3列グリッド・ラッパーなしテーブルにクラスを付与し、
   ここでレスポンシブ対応する）
   ============================================================ */

/* KPIカード（登録ヘルパー数・登録利用者数・シフト作成） */
.shift-kpi-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-bottom:24px;
}
.shift-kpi-card{min-width:0;}
.shift-kpi-card > div, .shift-kpi-card > a{min-width:0;}

@media (max-width:680px){
  .shift-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:420px){
  .shift-kpi-grid{grid-template-columns:minmax(0,1fr);}
}

/* 人員不足警告バナー: 長文でもはみ出さず折返す */
.shift-alert-box{min-width:0;max-width:100%;}
@media (max-width:480px){
  .shift-alert-box{flex-wrap:wrap;padding:12px 14px;}
}

/* 月間人員充足状況カード: スマホで左右paddingを圧縮 */
@media (max-width:480px){
  .shift-staffing-card{padding:14px 14px!important;}
}

/* 最近のシフト作成履歴テーブル: ページ全体ではなく表領域のみ横スクロール */
.shift-table-wrap{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.shift-table-wrap table{min-width:560px;}

/* ============================================================
   V55: AIシフト作成画面（/shift/create） スマホ表示崩れ修正
   対象: app/templates/shift/shift_create.html のみ
   PC: 既存の「左320px固定＋右可変」2カラムを維持
   スマホ: 1カラム縦並びへ変更（条件設定→作成履歴の順）
   ============================================================ */
.shift-create-layout{
  display:grid;
  grid-template-columns:320px 1fr;
  gap:24px;
  align-items:start;
}
.shift-create-form-column,
.shift-create-history-column{min-width:0;}

@media (max-width:680px){
  .shift-create-layout{grid-template-columns:minmax(0,1fr);}
}

/* 作成履歴テーブル: ページ全体ではなく表領域のみ横スクロール */
.shift-create-history-wrap{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.shift-create-history-wrap table{min-width:560px;}
.shift-create-history-wrap th,
.shift-create-history-wrap td{white-space:nowrap;}

/* ============================================================
   V56: シフト結果画面（/shift/result/{id}） スマホ右端切れ修正
   対象: app/templates/shift/shift_result.html のみ
   原因: 日別／利用者別タブのテーブルが、親カードのoverflow:hidden
   （角丸クリップ用）の内側で自身の最小コンテンツ幅まで広がり、
   右側がスクロール手段の無いまま無音でクリップされていた。
   全セレクタを .shift-result-page 配下に限定し、他画面・共通CSSへ
   影響しないようにしている。
   ============================================================ */
@media (max-width: 680px) {
  .shift-result-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  .shift-result-page * {
    box-sizing: border-box;
  }
}

/* 日別／利用者別タブのテーブル：ページ全体ではなく表領域のみ横スクロール */
.shift-result-page .shift-result-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.shift-result-page .shift-result-table-wrap table {
  min-width: 560px;
}

/* タブ行：将来的にラベルが増減しても画面幅を超えないよう横スクロールを許可
   （既存のタブ切替ロジック・onclick・idはテンプレート側で無変更） */
.shift-result-page .shift-result-tabs {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  flex-wrap: nowrap;
}
.shift-result-page .shift-result-tabs .shift-tab {
  white-space: nowrap;
  flex-shrink: 0;
}
