/* 現場のAIノート — ネイビー × ティール × あたたかいグレー。モバイル(390px)が基準。浮気かもノートのCSSをもとに配色だけ変更（変数名は共通のまま） */
:root{
  --night:#1F2F4D; --night-2:#2C4268; --night-soft:#33507E;
  --cream:#F4F2EE; --cream-2:#E9E5DE; --paper:#FFFFFF;
  --ink:#232A33; --ink-soft:#56606E; --line:#D9D4CB;
  --moon:#6CC2BA; --amber:#1F8A85; --amber-dark:#166B67; --rose:#B8705F; --sage:#5F7F73;
  --radius:8px; --shadow:0 1px 6px rgba(31,47,77,.08);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Noto Sans CJK JP",Meiryo,sans-serif;font-size:17px;line-height:1.9;letter-spacing:.02em;word-break:normal;overflow-wrap:anywhere}
img{max-width:100%;height:auto}
a{color:var(--night-soft);text-underline-offset:3px}
a:hover{color:var(--amber-dark)}
.skip{position:absolute;left:-9999px}.skip:focus{left:8px;top:8px;background:#fff;padding:6px 10px;z-index:10}
.container{max-width:760px;margin:0 auto;padding:0 18px}
.container--wide{max-width:1040px}

/* header */
.site-header{background:var(--night);color:var(--cream)}
.site-header__inner{max-width:1040px;margin:0 auto;padding:10px 16px 6px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px}
.site-logo{display:flex;align-items:center;gap:10px;color:var(--cream);text-decoration:none;flex:1 1 auto;min-width:0}
.site-logo:hover{color:#fff}
.site-logo img{border-radius:50%;flex:none;box-shadow:0 0 0 2px var(--moon)}
.site-logo span{font-weight:700;font-size:18px;line-height:1.35}
.site-logo small{display:block;font-weight:400;font-size:12px;color:var(--moon);letter-spacing:.04em}
.site-nav{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.site-nav ul{list-style:none;margin:0;padding:2px 0 4px;display:flex;flex-wrap:wrap;gap:2px 4px;white-space:nowrap}
.site-nav a{display:block;color:var(--cream);text-decoration:none;font-size:13.5px;padding:5px 10px;border-radius:999px}
.site-nav a:hover,.site-nav a[aria-current]{background:var(--night-2);color:#fff}
@media(min-width:900px){.site-nav{width:auto}.site-header__inner{padding:14px 20px}}
.pr-bar{background:var(--cream-2);border-bottom:1px solid var(--line);font-size:12.5px;color:var(--ink-soft)}
.pr-bar p{max-width:1040px;margin:0 auto;padding:5px 16px;line-height:1.6}
.pr-label{display:inline-block;font-size:11px;font-weight:700;line-height:1;padding:3px 6px;border-radius:4px;background:var(--ink-soft);color:#fff;margin-right:6px;vertical-align:1px}

/* hero (top) */
.hero{background:linear-gradient(180deg,var(--night) 0%,var(--night-2) 100%);border-bottom:4px solid var(--amber);color:var(--cream);padding:30px 0 26px;position:relative;overflow:hidden}
.hero__inner{position:relative}
.hero__eyebrow{font-size:13px;color:var(--moon);margin:0 0 6px;letter-spacing:.08em}
.hero h1{font-size:25px;line-height:1.5;margin:0 0 14px}
.hero__lead{font-size:15.5px;line-height:1.95;margin:0 0 22px;color:#DCE3EC}
.hero__card{background:var(--paper);color:var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 18px 16px;display:flex;gap:14px;align-items:flex-start}
.hero__card img{flex:none;border-radius:50%;width:64px;height:64px}
.hero__card p{margin:0;font-size:15px;line-height:1.85}
.hero__card b{color:var(--night)}
@media(min-width:760px){.hero{padding:52px 0 40px}.hero__card{max-width:720px}.hero h1{font-size:32px}.hero__lead{font-size:17px;max-width:620px}}

/* sections */
.section{padding:30px 0 6px}
.section h2,.page h2{font-size:20px;line-height:1.5;margin:0 0 14px;color:var(--night);padding-left:12px;border-left:5px solid var(--moon)}
.section__lead{color:var(--ink-soft);font-size:15px;margin:-4px 0 16px}

/* worry entrances */
.worries{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.worry{display:flex;flex-direction:column;height:100%;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px 14px 12px;text-decoration:none;color:var(--ink);box-shadow:var(--shadow)}
.worry:hover{border-color:var(--amber);color:var(--ink)}
.worry__icon{width:38px;height:38px;border-radius:50%;background:var(--night);color:var(--moon);display:grid;place-items:center;font-size:18px;margin-bottom:6px}
.worry__name{font-weight:700;font-size:16.5px;color:var(--night);line-height:1.45}
.worry__q{font-size:13px;color:var(--ink-soft);line-height:1.65;margin-top:4px}
@media(min-width:760px){.worries{grid-template-columns:repeat(4,1fr)}}

/* steps (3 promises) */
.promise{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.promise li{background:var(--paper);border-radius:var(--radius);padding:12px 14px 12px 50px;position:relative;border:1px solid var(--line);font-size:15.5px;line-height:1.8}
.promise li::before{content:attr(data-n);position:absolute;left:14px;top:12px;width:26px;height:26px;border-radius:50%;background:var(--moon);color:var(--night);font-weight:700;font-size:14px;display:grid;place-items:center}
.promise b{color:var(--night)}

/* article list / empty state */
.cards{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.card{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;text-decoration:none;color:var(--ink)}
.card__title{font-weight:700;color:var(--night);line-height:1.55}
.card__desc{font-size:14px;color:var(--ink-soft);margin-top:4px;line-height:1.7}
.empty{background:var(--paper);border:1px dashed var(--line);border-radius:var(--radius);padding:18px;display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.85;color:var(--ink-soft)}
.empty img{flex:none;border-radius:50%}
.empty p{margin:0}

/* help strip */
.help{background:var(--night);color:var(--cream);border-radius:var(--radius);padding:18px 18px 16px;margin:8px 0 0}
.help h2{color:var(--cream)!important;border-left-color:var(--moon)!important;font-size:18px!important}
.help p{margin:0 0 10px;font-size:15px;line-height:1.85}
.help a{color:var(--moon)}
.help .btn{background:var(--moon);color:var(--night)}

.btn{display:inline-block;background:var(--night);color:var(--cream);text-decoration:none;font-weight:700;padding:11px 20px;border-radius:999px;font-size:15px}
.btn:hover{background:var(--night-2);color:#fff}

/* static pages */
.page{padding:22px 0 30px}
.page h1{font-size:23px;line-height:1.5;color:var(--night);margin:6px 0 18px}
.page h2{margin-top:30px}
.page h3{font-size:17px;color:var(--night);margin:22px 0 8px}
.page ul{padding-left:1.3em}.page li{margin:4px 0}
.breadcrumb ol{list-style:none;margin:0;padding:12px 0 0;display:flex;flex-wrap:wrap;gap:4px;font-size:12.5px;color:var(--ink-soft)}
.breadcrumb li+li::before{content:"›";margin-right:4px}
.def{margin:0;border-top:1px solid var(--line)}
.def>div{display:grid;grid-template-columns:7.5em 1fr;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.def dt{font-weight:700;color:var(--night);font-size:15px}.def dd{margin:0}
.note{background:var(--cream-2);border-radius:10px;padding:12px 14px;font-size:14.5px;line-height:1.8}
.todo{background:#FFE9A8;color:#6B4B00;font-weight:700;padding:0 4px;border-radius:3px}

/* 相談窓口 */
.desk{list-style:none;padding:0!important;margin:0;display:grid;gap:12px}
.desk li{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin:0!important}
.desk__name{font-weight:700;color:var(--night);font-size:16.5px;line-height:1.5}
.desk__org{font-size:12.5px;color:var(--ink-soft)}
.desk__tel{display:inline-block;margin:6px 0 2px;font-size:20px;font-weight:700;color:var(--night);text-decoration:none;letter-spacing:.04em}
.desk__tel small{font-size:12px;font-weight:400;color:var(--ink-soft);margin-left:6px;letter-spacing:0}
.desk p{margin:4px 0 0;font-size:14.5px;line-height:1.8}
.urgent{background:#FBEDEA;border:1px solid #E7C3BC;border-radius:var(--radius);padding:14px 16px;font-size:15px}
.urgent b{color:#8E3B2F}

/* article */
.article-meta{font-size:13px;color:var(--ink-soft);margin:-8px 0 12px}
.toc{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:12px 16px 10px;margin:0 0 22px;font-size:14.5px;line-height:1.7}
.toc p{font-weight:700;color:var(--night);margin:0 0 4px}
.toc ol{margin:0;padding-left:1.5em}.toc li{margin:2px 0}
.toc a{text-decoration:none;color:var(--ink)}.toc a:hover{color:var(--amber-dark)}
.article-pr{font-size:12.5px;color:var(--ink-soft);margin:0 0 14px}
.manga,.zukai,.ph{margin:22px 0;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.manga figcaption,.ph figcaption{font-size:12px;color:var(--ink-soft);margin-top:6px}
.ph{border-style:dashed;text-align:center;color:var(--ink-soft)}
.zukai{padding:8px}.zukai img{display:block;width:100%;height:auto;border-radius:10px}
.page h4{font-size:16px;color:var(--night);margin:20px 0 6px}
.ad-box{margin:22px 0;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px}
.ad-box__title{font-weight:700;margin:0 0 8px}
.ad-list{list-style:none;margin:0;padding:0}
.ad-btn-wrap a{display:inline-block;background:var(--amber);color:#fff;font-weight:700;text-decoration:none;padding:9px 16px;border-radius:999px;margin-top:6px}
.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:14.5px}th,td{border:1px solid var(--line);padding:8px;text-align:left;vertical-align:top}th{background:var(--cream-2)}

/* footer */
.site-footer{background:var(--night);color:#C9D1DC;margin-top:40px;padding:26px 0 30px;font-size:13.5px}
.site-footer ul{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px}
.site-footer a{color:var(--cream)}
.site-footer__mark{display:flex;align-items:center;gap:10px;margin-bottom:14px;color:var(--moon);font-size:13px}
.site-footer__mark img{border-radius:50%}
.site-footer__disclaimer{line-height:1.8;margin:0 0 10px}
.site-footer__copy{margin:0;color:#97A3B3}
/* 2026-10-11 スマホで4列以上の表が1文字ずつ折り返すのを防ぐ：表に最小幅をつけ、.table-wrap の横スクロールで読む（3列以下は今までどおり） */
@media (max-width:640px){.table-wrap{-webkit-overflow-scrolling:touch}.table-wrap table:has(th:nth-child(4)){min-width:560px}.table-wrap table:has(th:nth-child(6)){min-width:760px}.table-wrap table:has(th:nth-child(4)) th{white-space:nowrap}}

/* 現場のAIノート：ロゴは文字マーク（角丸の四角） */
.site-logo img{border-radius:6px;box-shadow:none}
.site-footer__mark img{border-radius:5px}

/* テンプレートの箱（:::template）— 改行を残して表示し、「コピーする」で本文だけコピー */
.tpl{margin:22px 0;border:2px solid var(--night-soft);border-radius:var(--radius);background:var(--paper);overflow:hidden}
.tpl__head{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--night);color:#fff;padding:8px 10px 8px 14px}
.tpl__title{margin:0;font-weight:700;font-size:14.5px;line-height:1.5;min-width:0}
.tpl__copy{flex:none;font:inherit;font-size:13px;font-weight:700;line-height:1;padding:9px 12px;border:0;border-radius:6px;background:var(--amber);color:#fff;cursor:pointer;min-height:36px}
.tpl__copy:hover{background:var(--amber-dark)}
.tpl__copy.is-done{background:var(--sage)}
.tpl__text{white-space:pre-wrap;word-break:normal;overflow-wrap:anywhere;font-size:15.5px;line-height:1.85;padding:14px 16px 16px;max-height:none}
.tpl__text strong{color:var(--night)}
@media(min-width:760px){.tpl__text{font-size:16px;padding:18px 22px 20px}}
