/* 救命の手順（/kyumei/）。色と字は town.css の決まり（--t-*）を使う。非常時に片手で読める大きさと余白。
   線と面だけ（立体の影・絵文字は使わない） */
html,body{overflow:auto;height:auto;min-height:100%}
.k-body{margin:0;background:var(--t-paper);color:var(--t-ink);font-family:var(--t-body);-webkit-text-size-adjust:100%}
.k-body *{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}

/* 上の帯：いつも 119 と 閉じる が押せる */
.k-top{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;padding:calc(var(--t-safe-t) + 6px) calc(var(--t-safe-r) + 10px) 6px calc(var(--t-safe-l) + 14px);background:rgba(251,246,236,.95)}
.k-name{flex:1;min-width:0;margin:0;font:900 15px/1.2 var(--t-display);color:var(--t-teal)}
.k-name a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:none}
.k-tel-s{display:inline-flex;align-items:center;gap:4px;min-height:44px;padding:0 14px;border-radius:999px;background:var(--t-orange);color:var(--t-ink);font:900 18px/1 var(--t-display);text-decoration:none;font-variant-numeric:tabular-nums}
.k-x{flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--t-card);color:var(--t-ink);cursor:pointer;padding:0}
.k-x svg{width:22px;height:22px}
.k-ico{width:28px;height:28px;flex:none}
.k-ico-s{width:20px;height:20px;flex:none}
.k-ico-l{width:30px;height:30px;flex:none}

.k-main{width:min(100%,760px);margin:0 auto;padding:4px calc(var(--t-safe-r) + 16px) calc(var(--t-safe-b) + 32px) calc(var(--t-safe-l) + 16px);display:grid;gap:18px;min-width:0}
.k-hero{display:flex;align-items:center;gap:12px;min-width:0}
.k-hero-mark{position:relative;flex:none;width:52px;height:52px;border-radius:50%;background:var(--t-teal-3)}
.k-hero-mark i{position:absolute;left:50%;top:50%;width:8px;height:28px;margin:-14px 0 0 -4px;border-radius:2px;background:var(--t-teal-2)}
.k-hero-mark i+i{width:28px;height:8px;margin:-4px 0 0 -14px}
.k-h1{margin:0;font:900 clamp(28px,8vw,36px)/1.15 var(--t-display);color:var(--t-teal);letter-spacing:.02em}
.k-hero p{margin:4px 0 0;font-size:15px;line-height:1.5;color:var(--t-sub)}
.k-noscript{font-size:17px;line-height:1.7}
.k-nw{white-space:nowrap}

/* まず119番 */
.k-alert{display:grid;gap:12px;padding:18px 16px;border-radius:20px;background:#FFF0DF}
.k-alert h2{margin:0;font:900 24px/1.3 var(--t-display);color:var(--t-orange-d)}
.k-alert ul{margin:0;padding:0 0 0 1.2em;display:grid;gap:6px;font-size:16px;line-height:1.65}
.k-tel{display:flex;align-items:center;justify-content:center;gap:10px;min-height:64px;padding:10px 16px;border-radius:16px;background:var(--t-orange);color:var(--t-ink);font:900 22px/1.2 var(--t-display);text-decoration:none}
.k-tel:active,.k-tel-s:active{transform:scale(.98)}

/* 手当ての一覧 */
.k-index ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.k-index a{display:flex;align-items:center;gap:10px;min-height:60px;height:100%;padding:10px 12px;border-radius:16px;background:var(--t-card);box-shadow:0 0 0 1.5px var(--t-line) inset;color:var(--t-teal);font:900 16px/1.3 var(--t-display);text-decoration:none}
.k-index a span{min-width:0;overflow-wrap:anywhere}
.k-index li:first-child a{background:var(--t-teal);color:var(--t-on-teal);box-shadow:none}

/* 1つの手当て */
.k-item{display:grid;gap:14px;padding:18px 16px;border-radius:20px;background:var(--t-card);box-shadow:0 0 0 1.5px var(--t-line) inset;min-width:0}
.k-item-head{display:flex;align-items:center;gap:12px;min-width:0}
.k-badge{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--t-teal-3);color:var(--t-teal)}
.k-item h2{margin:0;font:900 23px/1.3 var(--t-display);color:var(--t-teal)}
.k-item-head p{margin:2px 0 0;font-size:15px;line-height:1.5;color:var(--t-sub)}
.k-steps{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.k-steps li{display:flex;align-items:flex-start;gap:12px;min-width:0}
.k-n{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--t-teal);color:var(--t-on-teal);font:900 19px/1 var(--t-display);font-variant-numeric:tabular-nums}
.k-steps p{margin:0;min-width:0;padding-top:3px;font-size:19px;line-height:1.6;font-weight:500;overflow-wrap:anywhere}
.k-notes{margin:0;padding:12px 14px 12px 2em;border-radius:14px;background:var(--t-paper);display:grid;gap:6px;font-size:16px;line-height:1.65}
.k-call119{display:flex;align-items:flex-start;gap:8px;margin:0;padding:12px 14px;border-radius:14px;background:#FFF0DF;color:var(--t-ink);font-size:17px;line-height:1.6;font-weight:700}
.k-call119 svg{margin-top:3px;color:var(--t-orange-d)}
.k-src{font-size:14px;line-height:1.6;color:var(--t-sub)}
.k-src summary{display:inline-flex;align-items:center;min-height:44px;cursor:pointer;font-weight:700;color:var(--t-teal)}
.k-src ul{margin:0;padding:0 0 0 1.2em;display:grid;gap:6px}
.k-src a{color:var(--t-teal);overflow-wrap:anywhere}
.k-src small{display:block;font-size:12.5px}
.k-totop{justify-self:end;display:inline-flex;align-items:center;min-height:44px;color:var(--t-teal);font:700 14px/1.3 var(--t-display)}

/* リズム（1分間に110回） */
.k-rhythm{display:grid}
.k-beat-btn{display:flex;align-items:center;gap:14px;min-height:64px;padding:10px 16px;border:0;border-radius:16px;background:var(--t-teal-3);color:var(--t-teal);text-align:left;cursor:pointer;font:inherit}
.k-beat-btn.on{background:var(--t-teal);color:var(--t-on-teal)}
.k-beat-l{display:grid;gap:2px;min-width:0}
.k-beat-l b{font:900 19px/1.3 var(--t-display)}
.k-beat-l small{font-size:14px;line-height:1.4}
.k-dot{flex:none;width:30px;height:30px;border-radius:50%;background:currentColor;opacity:.35}
.k-beat-btn.on .k-dot{opacity:1;background:var(--t-yellow)}
.k-beat-btn.k-pulse .k-dot{animation:kBeat .3s ease-out}
@keyframes kBeat{0%{transform:scale(1.35)}100%{transform:scale(1)}}
@media (prefers-reduced-motion: reduce){.k-beat-btn.k-pulse .k-dot{animation:none}}

.k-foot{display:grid;gap:6px;font-size:14px;line-height:1.7;color:var(--t-sub)}
.k-foot p{margin:0}
.k-foot a{color:var(--t-teal)}

/* 広い画面：一覧を 4列に */
@media (min-width:640px){.k-index ol{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* スマホの横向き：上の帯を 薄く、一覧を 4列に（縦を 食わない） */
@media (orientation:landscape) and (max-height:500px){
  html{scroll-padding-top:60px}
  .k-top{padding-top:calc(var(--t-safe-t) + 2px);padding-bottom:2px}
  .k-index ol{grid-template-columns:repeat(4,minmax(0,1fr))}
  .k-index a{min-height:52px}
  .k-hero-mark{width:44px;height:44px}
}