/* 入口とアプリ — AT6（共通基盤/DESIGN.md）。外部のフォント・画像は使わない */
:root{
  --base:#fef9fa; --base2:#fbeef2; --card:#ffffff;
  --ink:#4e4348; --ink-soft:#98878d;
  --sakura:#e08398; --sakura-deep:#cc6d84; --mist:#fbe4ea;
  --mint:#7fb5a3; --mint-deep:#3f5a51;
  --hair:rgba(78,67,72,.12);
  --mincho:"Hiragino Mincho ProN","Yu Mincho","YuMincho",serif;
  --maru:"Hiragino Maru Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
  --gothic:"Hiragino Kaku Gothic ProN","Hiragino Sans","Yu Gothic","Meiryo",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:var(--base);color:var(--ink);font-family:var(--gothic);font-size:15px;line-height:1.9}
a{color:var(--sakura-deep)}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
header.top{background:var(--card);border-bottom:1px solid var(--hair)}
header.top .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px;padding-top:12px;padding-bottom:10px}
.brand{font-family:var(--mincho);font-weight:600;font-size:20px;letter-spacing:.04em}
.top-nav{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-family:var(--maru);font-size:14px;margin-left:auto}
.top-nav a{text-decoration:none;color:var(--ink)}
.top-nav .who{color:var(--mint-deep)}
form.inline{display:inline;margin:0}
button.link{background:none;border:0;padding:0;font:inherit;color:var(--sakura-deep);cursor:pointer;text-decoration:underline}
.fiction{display:inline-block;background:var(--mist);color:var(--ink);font-family:var(--maru);font-size:14px;
  padding:3px 14px;border-radius:999px;margin:16px 0 4px}
h1{font-family:var(--mincho);font-weight:600;letter-spacing:.04em;font-size:22px;margin:12px 0 6px}
h2{font-family:var(--maru);font-weight:500;font-size:15.5px;color:var(--mint-deep);letter-spacing:.2em;margin:0 0 8px}
.lead{margin:8px 0 16px}
/* 入口（ポータル）: 施設でいま使っている入口と同じ見た目（部門の枠・人物の絵・「開く→」）。
   入口の中だけは AT6 ではなく、いまの画面の色を使う（代表 2026-10-11「全く同じに」・追記163） */
.pt{background:#f7faf9;border:1px solid #dfe8e4;border-radius:12px;padding:12px;color:#284940;margin-bottom:24px}
.pt-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.pt-logo{flex:none;width:44px;height:44px;border-radius:8px;background:#e3efe9;color:#39735f;display:flex;align-items:center;justify-content:center}
.pt-title{margin:0;font-family:inherit;font-weight:700;font-size:22px;line-height:1.3;letter-spacing:.02em}
.pt-title small{font-size:inherit;margin-right:4px}
.pt-title,.pt-sub,.pt-dsub,.pt-name{word-break:auto-phrase}
.pt-sub{font-size:12.5px;color:#56635e;line-height:1.5}
.pt-btn{font:inherit;font-size:13px;line-height:1.5;background:#fff;color:#52615a;border:1px solid #cbd6d3;border-radius:6px;padding:6px 12px;white-space:nowrap;text-decoration:none;cursor:pointer}
.pt-head .pt-btn{margin-left:auto}
.pt-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:start}
.pt-col{display:grid;gap:12px}
.pt-dept{--c:#39735f;--bg:#f0f7f2;--line:#cfe3d9;background:var(--bg);border:1px solid var(--line);border-top:3px solid var(--c);border-radius:8px;padding:6px 10px 10px}
.pt-dept.d2{--c:#ab5265;--bg:#fff4f6;--line:#f0d3d9}
.pt-dept.d3{--c:#936515;--bg:#fff9eb;--line:#efdcb3}
.pt-dept.d4{--c:#776194;--bg:#f8f2f9;--line:#ddd3e8}
.pt-dept.d5{--c:#3b7397;--bg:#eff7ff;--line:#cfe0ee}
.pt-dhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 10px}
.pt-no{color:var(--c);font-size:12.5px;font-weight:600}
.pt-dname{margin:0;font-family:inherit;font-size:15.5px;font-weight:700;line-height:1.6;letter-spacing:0;color:inherit}
.pt-none{margin-left:auto;font-size:12px;color:#56635e}
.pt-dsub{font-size:12px;color:#56635e;line-height:1.6;margin-bottom:8px}
.pt-cards{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pt-card{display:flex;align-items:center;gap:8px;min-height:70px;background:#fff;border:1px solid #ccd9d3;border-radius:8px;padding:8px}
.pt-card.app{border-color:var(--c)}
.pt-av{flex:none;width:28px;height:40px;background-position:center;background-size:contain;background-repeat:no-repeat}
.av-g{background-image:url(/static/av-g.png)}
.av-p{background-image:url(/static/av-p.png)}
.av-y{background-image:url(/static/av-y.png)}
.pt-txt{min-width:0;line-height:1.45}
.pt-name{font-size:13.5px;font-weight:700;color:#284842}
.pt-desc{font-size:11.5px;color:var(--c)}
.pt-open{flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:4px;font:inherit;font-size:12.5px;font-weight:700;line-height:1.5;color:#fff;background:var(--c);border:0;border-radius:6px;padding:6px 8px;text-decoration:none}
a.pt-open{cursor:pointer}
a.pt-open:hover,a.pt-open:focus-visible{filter:brightness(.92)}
button.pt-open:disabled{opacity:.55;cursor:not-allowed}
.pt-card.yotei{background:transparent;border:1px dashed var(--c)}
.pt-plus{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.85);color:var(--c);display:flex;align-items:center;justify-content:center;font-size:20px;line-height:1}
.pt-card.yotei .pt-name{color:#56635e}
.pt-card.yotei .pt-desc{color:#5f6b66}
.pt-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin-top:12px;font-size:12px;color:#56635e}
.pt-foot .pt-back{flex:1;text-align:center}
@media (max-width:1000px){.pt-cols{grid-template-columns:1fr}}
@media (max-width:560px){
  .pt{padding:10px}
  .pt-cards{grid-template-columns:1fr}
  .pt-title{font-size:18px}
  .pt-head{flex-wrap:wrap}
  .pt-foot .pt-back{flex:1 1 100%;order:3;text-align:left}
}
.panel{background:var(--card);border:1px solid var(--hair);border-radius:12px;padding:16px;margin-bottom:14px}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 14px;align-items:end}
.form label{display:block;font-family:var(--maru);font-size:13px}
/* 入力の文字は 16px（iPhone で入力時に画面が拡大されないため） */
.form input,.form select{width:100%;font:inherit;font-size:16px;color:var(--ink);background:var(--base);
  border:1px solid var(--hair);border-radius:8px;padding:8px 10px}
/* ボタンは白い文字が読みやすい深いミント（AT6 の濃色面の色。桜色では白い文字のコントラストが足りない） */
.btn{font:inherit;font-family:var(--maru);background:var(--mint-deep);color:#fff;border:0;border-radius:999px;padding:9px 22px;cursor:pointer}
.error{background:var(--mist);color:var(--ink);border-radius:8px;padding:8px 12px}
.ok{background:var(--base2);color:var(--mint-deep);border-radius:8px;padding:8px 12px}
.note{font-size:13px;margin:8px 0 0}
.tablebox{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{border-bottom:1px solid var(--hair);padding:8px 10px;text-align:left;vertical-align:top}
th{font-family:var(--maru);font-weight:500;font-size:13px;background:var(--base2)}
th.n,td.n{text-align:right;white-space:nowrap}
th.c{text-align:center}
td.t{white-space:nowrap}
tr.total td{font-weight:600;border-top:1px solid var(--ink-soft)}
h3{font-family:var(--maru);font-weight:500;font-size:15.5px;margin:0 0 8px}
@media (max-width:480px){
  h1{font-size:19px}
  .brand{font-size:18px}
  th,td{padding:7px 6px}
  .top-nav{margin-left:0}
}

/* 自由に書く欄・1行まるごとの欄（ヒヤリハットの記録など） */
.form textarea{width:100%;min-height:72px;font:inherit;font-size:16px;color:var(--ink);background:var(--base);border:1px solid var(--hair);border-radius:8px;padding:8px 10px}
.form .wide{grid-column:1/-1}
.btn.sub{background:var(--ink)}
/* 件数の横棒。CSP で style 属性を使えないため、長さは b0〜b10 の段階の class で表す */
.barcell{width:25%}
td.barcell{vertical-align:middle}
.bar{display:block;height:10px;border-radius:999px;background:var(--mint)}
.bar.b0{width:0}.bar.b1{width:10%}.bar.b2{width:20%}.bar.b3{width:30%}.bar.b4{width:40%}.bar.b5{width:50%}
.bar.b6{width:60%}.bar.b7{width:70%}.bar.b8{width:80%}.bar.b9{width:90%}.bar.b10{width:100%}
.hiyari-total{font-size:15px;margin:0 0 10px}
.hiyari-total strong{font-size:22px;font-variant-numeric:tabular-nums}
.hiyari-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:0 14px}
table.hiyari td{min-width:6em}
.form input[type=checkbox]{width:auto;margin:0 6px 0 0}
.form label.check{font-size:15px}
/* 狭い画面（スマホ）では、ヒヤリハットの一覧を1件ずつ縦に並べ、欄の見出しを各値の上に出す */
@media (max-width:480px){
  table.hiyari thead{display:none}
  table.hiyari,table.hiyari tbody,table.hiyari tr,table.hiyari td{display:block;width:auto}
  table.hiyari tr{border-bottom:1px solid var(--hair);padding:8px 0}
  table.hiyari td{position:relative;border:0;padding:2px 0 2px 7.5em;min-width:0;white-space:normal}
  table.hiyari td::before{content:attr(data-label);position:absolute;left:0;width:8.5em;white-space:nowrap;font-size:12px;line-height:1.7;color:var(--mint-deep)}
}

/* 研修の受講記録（見本の画面 ② と同じ薄紫の見た目。代表「良い感じ。」2026-10-11） */
.kn{--kn-deep:#241c48;--kn-violet:#5b47c4;--kn-soft:#efecff;--kn-line:#ddd7f7;--kn-amber:#e3a91c;
  background:#f8f7ff;border:1px solid var(--kn-line);border-radius:14px;overflow:hidden;padding-bottom:16px;margin-bottom:24px;color:var(--kn-deep)}
.kn-top{display:flex;align-items:center;gap:12px;padding:16px 18px;background:linear-gradient(120deg,#3d2f86,#6b56d6);color:#fff}
.kn-logo{flex:none;width:48px;height:48px;border-radius:12px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center}
.kn-title{margin:0;font-family:var(--gothic);font-size:22px;font-weight:700;letter-spacing:.04em;line-height:1.3}
.kn-title small{display:block;font-size:12.5px;font-weight:400;color:#e4defc;letter-spacing:0}
.kn-count{flex:none;margin-left:auto;text-align:right;line-height:1.1;font-size:16px}
.kn-count strong{font-size:38px;font-variant-numeric:tabular-nums}
.kn-count small{display:block;font-size:11.5px;white-space:nowrap}
.kn .error,.kn .ok{margin:14px 18px 0}
.kn-alert{display:flex;align-items:center;gap:8px;margin:14px 18px;background:#fff6dc;border:1.5px solid var(--kn-amber);border-radius:10px;padding:10px 14px;font-weight:700}
.kn-alert svg{flex:none;color:#9a6a00}
.kn-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 18px}
.kn-card{background:#fff;border:1px solid var(--kn-line);border-radius:14px;padding:14px 10px;text-align:center;box-shadow:0 4px 14px rgba(61,47,134,.08)}
.kn-ring{display:block;width:96px;height:96px;margin:0 auto 6px}
.kn-card-name{font-weight:700;font-size:14px;line-height:1.4;min-height:2.8em;display:flex;align-items:center;justify-content:center}
.kn-card-num{font-size:13px;color:#4b4470;margin:2px 0 6px}
.kn-card-num strong{font-size:18px;color:var(--kn-deep)}
.kn-badge{display:inline-block;font-size:12.5px;font-weight:700;border-radius:999px;padding:2px 12px}
.kn-badge.ok{background:#dcf5e9;color:#145c3b}
.kn-badge.wait{background:var(--kn-soft);color:var(--kn-violet)}
.kn-drill{margin:0 18px 14px;background:#fff;border:1px solid var(--kn-line);border-radius:12px;padding:10px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px}
.kn-drill-head{font-weight:700;font-size:14px}
.kn-drill-items{display:flex;flex-wrap:wrap;gap:8px}
.kn-drill-item{display:inline-flex;align-items:center;background:#dcf5e9;color:#145c3b;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700}
.kn-drill-none{font-size:13px;color:#4b4470}
.kn-panel,.kn-entry{margin:0 18px 14px;background:#fff;border:1px solid var(--kn-line);border-radius:12px;padding:12px 14px}
.kn-panel-head{font-family:var(--gothic);font-size:15px;font-weight:700;letter-spacing:0;color:var(--kn-deep);margin:0 0 8px;padding:0}
.kn-table th,.kn-list th{background:var(--kn-soft);color:var(--kn-deep)}
.kn-table th{text-align:center}
.kn-table th:first-child{text-align:left}
.kn-table td{text-align:center;vertical-align:middle}
.kn-table td:first-child{text-align:left;font-weight:700;white-space:nowrap}
.kn-ok{display:inline-block;background:#1e7f53;color:#fff;border-radius:999px;padding:0 10px;font-size:13px;font-weight:700}
.kn-day{display:block;font-size:11.5px;color:#4b4470}
.kn-no{display:inline-block;background:#fff6dc;border:1px solid var(--kn-amber);color:#6b4a00;border-radius:999px;padding:0 10px;font-size:13px;font-weight:700}
.kn-na{font-size:12.5px;color:#6b6590}
.kn-small{margin:8px 0 0;font-size:12.5px;color:#4b4470}
.kn fieldset{border:0;margin:0;padding:0;min-width:0}
.kn legend{padding:0}
.kn-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:12px 22px}
.kn-field.wide{grid-column:1/-1}
.kn-field-label{display:block;font-size:12.5px;color:#4b4470;margin-bottom:4px}
.kn-pills{display:flex;flex-wrap:wrap;gap:6px}
/* 札の中の radio・checkbox は見えなくし、すぐ後ろの文字（span）を札の形にする。
   選んだ色は input:checked + span で付ける（:has() が使えない古いブラウザーでも選んだ札が分かるように） */
.kn-pill{position:relative;display:inline-flex;cursor:pointer}
.kn-pill input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.kn-pill span{display:inline-block;border:1.5px solid #d4cdf3;border-radius:999px;padding:5px 14px;font-size:14px;line-height:1.5;background:#faf9ff}
.kn-pill input:checked + span{background:var(--kn-violet);border-color:var(--kn-violet);color:#fff;font-weight:700}
.kn-pill input:focus-visible + span{outline:2px solid var(--kn-deep);outline-offset:2px}
.kn-ring-arc{stroke:var(--kn-violet)}
.kn-me{display:inline-block;border-radius:999px;padding:5px 14px;font-size:14px;background:var(--kn-violet);color:#fff;font-weight:700}
.kn-input{width:100%;font:inherit;font-size:16px;color:var(--kn-deep);background:#faf9ff;border:1.5px solid #d4cdf3;border-radius:10px;padding:6px 12px}
.kn-btn{margin-top:14px;font:inherit;font-size:17px;font-weight:700;background:var(--kn-violet);color:#fff;border:0;border-radius:12px;padding:12px 40px;cursor:pointer}
.kn-note{margin:0 18px;font-size:12.5px;color:#4b4470}
.kn .btn.sub{margin-top:10px}
@media (max-width:900px){.kn-cards{grid-template-columns:1fr 1fr}}
@media (max-width:560px){
  .kn-top{padding:14px 12px;flex-wrap:wrap}
  .kn-title{font-size:18px}
  .kn-alert,.kn-cards,.kn-drill,.kn-panel,.kn-entry,.kn-note,.kn .error,.kn .ok{margin-left:12px;margin-right:12px}
  .kn-ring{width:80px;height:80px}
  .kn-btn{display:block;width:100%}
  .kn-table thead,.kn-list thead{display:none}
  .kn-table,.kn-table tbody,.kn-table tr,.kn-table td,.kn-list,.kn-list tbody,.kn-list tr,.kn-list td{display:block;width:auto}
  .kn-table tr,.kn-list tr{border-bottom:1px solid var(--hair);padding:8px 0}
  .kn-table td,.kn-table td:first-child,.kn-list td{position:relative;border:0;padding:2px 0 2px 9.5em;min-width:0;white-space:normal;text-align:left}
  .kn-table td::before,.kn-list td::before{content:attr(data-label);position:absolute;left:0;width:9em;white-space:nowrap;font-size:12px;line-height:1.9;color:#4b4470}
  .kn-day{display:inline;margin-left:6px}
}

/* 管理の画面（名簿・端末・ロック）と PIN を変える画面（036 段1a） */
.form h2,.form .note{grid-column:1/-1}
.kanri-menu{font-family:var(--maru);font-size:14px;margin:4px 0 14px}
.temp-pin{font-family:var(--gothic);font-size:34px;font-weight:700;letter-spacing:.18em;color:var(--ink);
  background:var(--card);border:2px dashed var(--sakura-deep);border-radius:12px;padding:14px 18px;margin:12px 0;text-align:center;
  font-variant-numeric:tabular-nums;user-select:all}
tr.near td{background:var(--mist);font-weight:700}
.device-tail{color:var(--ink-soft);text-align:center;font-variant-numeric:tabular-nums}
.device-tail-big{text-align:center;font-size:18px}
.device-tail-big strong{font-family:var(--gothic);font-size:30px;letter-spacing:.12em;font-variant-numeric:tabular-nums}

/* 印刷の表（書き出し・036 段1b）。印刷する時は上の帯と案内を出さない */
.print-table,.kensaku-table{width:100%;border-collapse:collapse;font-size:13px;background:var(--card)}
.print-table th,.print-table td,.kensaku-table th,.kensaku-table td{border:1px solid var(--hair);padding:4px 6px;text-align:left;vertical-align:top}
.print-only{display:none}
@media print{header.top,.no-print,.fiction,.screen-only{display:none}body{background:#fff}.print-table{font-size:10.5pt}.print-only{display:block}}
/* 確かめの数字の設定（QR・手で入れる文字・予備のコード＝設計 v2 §2-4） */
.qr-box{text-align:center}
.qr-box svg.qr{display:block;margin:8px auto;max-width:100%;height:auto;background:#fff}
.secret-text{font-family:var(--gothic);font-size:20px;letter-spacing:.08em;word-break:break-all;font-variant-numeric:tabular-nums}
.backup-codes{font-family:var(--gothic);font-size:22px;letter-spacing:.1em;column-count:2;column-gap:32px;padding-left:2em;font-variant-numeric:tabular-nums}
@media (max-width:520px){.backup-codes{column-count:1}}
/* 名前の暗号（段B の5a）: 承認の指紋・鍵の紙 */
[hidden]{display:none!important}  /* kagi.js が隠す欄（.form などの display より強くする） */
.fp{font-family:var(--gothic);font-size:30px;font-weight:700;letter-spacing:.12em;color:var(--ink);margin:6px 0 10px}
.fp-group{display:inline-block;margin-right:.6em;padding:2px 6px;border:1px solid var(--hair);border-radius:6px;background:var(--card)}
.fp-group::before{content:attr(data-index) "組目 ";font-size:12px;font-weight:400;letter-spacing:0;color:var(--muted, #666)}
.kagi-paper{border:2px solid var(--ink);border-radius:8px;padding:16px;margin:10px 0;background:#fff}
.kagi-groups{font-family:var(--gothic);font-size:22px;font-weight:700;letter-spacing:.14em;line-height:2}
.kagi-group{display:inline-block;margin-right:.8em}
.kagi-group::before{content:attr(data-index) ". ";font-size:12px;font-weight:400;letter-spacing:0}
@media print{.kanri-menu{display:none}.kagi-paper{border-color:#000}}