:root{--ink:#12161c;--sub:#5b6673;--line:#e3e7ec;--soft:#f6f8fa;--accent:#1e5f9e;--hot:#c2410c}
*{box-sizing:border-box}
body{margin:0;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,system-ui,sans-serif;
color:var(--ink);line-height:1.7;background:#fff;-webkit-text-size-adjust:100%;font-size:14px}
.wrap{max-width:800px;margin:0 auto;padding:0 22px 80px}
header{border-bottom:2px solid var(--ink);padding:38px 0 16px}
h1{font-size:1.4rem;margin:0 0 6px;line-height:1.4}
.sub{color:var(--sub);margin:0;font-size:.92rem}
.meta{margin-top:11px;font-size:.76rem;color:var(--sub)}
h2{font-size:.97rem;margin:20px 0 7px;padding-top:11px;border-top:1px solid var(--line)}
h2 .n{color:var(--sub);font-weight:400;margin-right:.5em;font-size:.9em}
p{margin:.5em 0}
table{width:100%;border-collapse:collapse;font-size:.83rem;margin:8px 0}
th,td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
thead th{font-size:.75rem;color:var(--sub);font-weight:600;border-bottom:1.5px solid var(--ink);white-space:nowrap}
td.c{text-align:center;white-space:nowrap;color:var(--sub)}
.tldr{border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:14px 0 4px}
.tldr th{background:var(--soft);width:4.6em;white-space:nowrap;font-size:.78rem;color:var(--sub)}
.tldr td{font-size:.86rem}
.tldr tr:last-child th,.tldr tr:last-child td{border-bottom:none}
.note{font-size:.76rem;color:var(--sub);margin-top:5px}

/* 箇条書き（ラベル付き） */
ol.cmp{list-style:none;padding:0;margin:7px 0;font-size:.85rem}
ol.cmp li{position:relative;padding-left:3.1em;margin:.42em 0;line-height:1.62}
ol.cmp li::before{content:attr(data-l);position:absolute;left:0;top:0;
color:var(--sub);font-weight:700;font-size:.82em;letter-spacing:.02em}
ol.cmp .d{color:var(--sub)}
ol.cmp .u{font-size:.78em;color:var(--sub);margin:0 .25em 0 .1em}
ol.cmp .us{font-size:.76em;color:var(--accent);white-space:nowrap}

/* 別紙 */
.sep{margin:54px 0 0;padding:9px 0;border-top:2px solid var(--ink);border-bottom:1px solid var(--line);
font-size:.8rem;color:var(--sub);letter-spacing:.06em;text-align:center}
details.fold{border:1px solid var(--line);border-radius:8px;margin:10px 0;background:#fcfdfe}
details.fold>summary{cursor:pointer;padding:9px 13px;font-size:.83rem;color:var(--sub);
font-weight:600;list-style:none;display:flex;align-items:center;gap:7px;user-select:none}
details.fold>summary::-webkit-details-marker{display:none}
details.fold>summary::before{content:"▶";font-size:.66em;flex-shrink:0;transition:transform .15s}
details.fold[open]>summary::before{transform:rotate(90deg)}
details.fold>summary:hover{color:var(--ink)}
details.fold>*:not(summary){margin-left:13px;margin-right:13px}
details.fold>*:last-child{margin-bottom:11px}
.say table{margin:0}
.say td:first-child{font-weight:600;white-space:nowrap}
.say td:last-child{color:var(--hot);font-weight:600}

/* Mockup */
.mk{border:1px solid var(--line);border-radius:9px;padding:15px;margin:10px 0;background:#fcfdfe}
.mk-step{font-size:.78rem;color:var(--sub);font-weight:600;margin:15px 0 7px;
display:flex;align-items:center;gap:7px}
.mk-step:first-child{margin-top:0}
.mk-tag{font-size:.68rem;background:#e8f0f8;color:var(--accent);padding:1px 6px;border-radius:8px;font-weight:400}
.mk-btns{display:flex;flex-wrap:wrap;gap:6px}
.mk-btns button{font:inherit;font-size:.82rem;padding:7px 11px;border:1px solid #cfd8e2;
background:#fff;border-radius:7px;cursor:pointer;text-align:left;line-height:1.45;max-width:100%}
.mk-btns button:hover{border-color:var(--accent);background:#f4f8fc}
.mk-btns button.on{border-color:var(--accent);background:#e8f0f8;font-weight:600}
.mk-said,.mk-you{margin:6px 0;padding:9px 12px;border-radius:9px;font-size:.85rem;
display:flex;gap:9px;align-items:flex-start;line-height:1.6}
.mk-said{background:#f1f4f7}
.mk-you{background:#e8f0f8;flex-direction:row-reverse;text-align:right}
.mk-who{font-size:.68rem;color:var(--sub);white-space:nowrap;padding-top:.25em;flex-shrink:0}
.mk-read{display:flex;align-items:center;gap:9px;margin:5px 0;font-size:.82rem}
.mk-bar{height:6px;border-radius:3px;background:var(--hot);flex-shrink:0;min-width:4px}
.mk-pct{font-size:.72rem;color:var(--sub);width:3.2em;flex-shrink:0}
.mk-verdict{margin-top:10px;padding:11px 13px;border-left:3px solid var(--hot);
background:#fff8f4;border-radius:0 7px 7px 0;font-size:.83rem;line-height:1.65}
.mk-verdict b{color:var(--hot)}
.mk-reset{margin-top:11px;font:inherit;font-size:.79rem;padding:6px 13px;border:1px solid #cfd8e2;
background:#fff;border-radius:7px;cursor:pointer}

footer{margin-top:36px;padding-top:14px;border-top:1px solid var(--line);font-size:.76rem;color:var(--sub)}
@media(max-width:620px){
 .wrap{padding:0 14px 50px}h1{font-size:1.18rem}
 table{font-size:.78rem}th,td{padding:5px 5px}
}
@media print{
 @page{size:A4;margin:12mm}
 body{font-size:8.4pt;line-height:1.45}
 h2{margin:9px 0 3px;padding-top:6px}
 table{margin:4px 0}th,td{padding:2.5px 5px}
 p{margin:.3em 0}
 .sub{font-size:.85rem}.meta{margin-top:6px}
 .wrap{padding:0;max-width:none}
 header{padding-top:0;padding-bottom:8px}
 header h1{font-size:1.15rem;margin-bottom:3px}
 .tldr{margin:8px 0 2px}
 .note{margin-top:2px}
 .sep{page-break-before:always}
 .mk-reset,.mk-btns{display:none}
 details.fold{border:none;background:none;page-break-inside:avoid}
 details.fold>summary{padding-left:0;color:var(--ink);font-size:.9rem}
}

/* 言語切替 */
.langbar{font-size:.78rem;color:var(--sub);margin:10px 0 0}
.langbar a{color:var(--accent);text-decoration:none}
.langbar a:hover{text-decoration:underline}
.langbar .cur{font-weight:700;color:var(--ink)}
.langbar span.sep2{margin:0 .5em;color:var(--line)}
@media print{.langbar{display:none}}