/* ============================================================
   SmartUniverse Tools — feuille de style partagée
   Fusion des blocs <style> des 36 pages du sous-domaine.
   Scopes de page (classe posée sur <body>) :
     .t-home    = index.html
     .t-article = les 22 pages articles
     .t-privacy = privacy-policy.html
     .p-*       = ajustements propres à certains outils
   ============================================================ */

/* ---- variables & base ---- */
:root{
--black:#0d0d0d;--yellow:#f5c518;
--bg:#f4f4f2;--border:#cfcfca;--soft:#e3e3df;
--text2:#5f5e5a;--muted:#9a9a97;
--note-bg:#faf3d8;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","BIZ UDPGothic","Yu Gothic Medium","Yu Gothic",Meiryo,sans-serif;background:var(--bg);color:var(--black);line-height:1.8}
body.t-privacy{line-height:1.9}
a{color:var(--black)}
a:focus-visible,input:focus-visible,select:focus-visible,button:focus-visible{outline:2px solid var(--black);outline-offset:2px}
.page-container{max-width:860px;margin:0 auto;padding:0 20px}

/* ---- header ---- */
.site-head{background:var(--black);border-bottom:2px solid var(--yellow)}
.site-head .page-container{padding-top:14px;padding-bottom:12px}
.site-name{display:inline-flex;align-items:center;gap:.6em;font-weight:700;font-size:1.05rem;letter-spacing:.04em;color:#f4f4f4;text-decoration:none}
.site-name .mark{width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;flex:none}
.site-name .mark svg{width:18px;height:18px}

/* ---- bandeaux hero ---- */
.hero-banner img{display:block;width:100%;height:clamp(90px,calc(22vw - 50px),250px);object-fit:cover}
/* accueil : hero avec overlay */
.hero{position:relative}
.hero img{display:block;width:100%;height:clamp(160px,calc(32vw - 50px),290px);object-fit:cover}
.hero-overlay{position:absolute;inset:0;display:flex;align-items:flex-end;background:linear-gradient(to top,rgba(13,13,13,.68) 0%,rgba(13,13,13,.30) 45%,rgba(13,13,13,0) 75%)}
.hero-overlay .page-container{width:100%;padding-bottom:18px}
.hero-catch{color:#fff;font-size:clamp(1.1rem,2.8vw,1.5rem);font-weight:800;line-height:1.5;letter-spacing:.02em}
.hero-sub{color:#ececea;font-size:clamp(.78rem,1.6vw,.9rem);line-height:1.65;max-width:640px;margin-top:4px}

/* ---- éléments communs de page ---- */
.crumb{font-size:.8rem;color:var(--text2);margin:18px 0 2px}
.crumb a{color:var(--text2)}
.chip{display:inline-block;background:var(--yellow);color:var(--black);font-size:.75rem;font-weight:700;border-radius:8px;padding:.1em 1em;letter-spacing:.05em;margin-top:.6em}
h1{font-size:1.5rem;line-height:1.45;margin:.3em 0 .4em}
.t-home h1{margin:0}
.t-privacy h1{margin:.5em 0 .6em}
.lead{color:var(--text2);font-size:.93rem;max-width:820px}
h2.sec{font-size:1.1rem;border-left:4px solid var(--yellow);padding-left:.6em;margin:2.2em 0 .8em;line-height:1.5}
.t-home h2.sec{font-size:1.15rem;margin:2.4em 0 1em}
.t-privacy h2.sec{margin:2em 0 .7em}

/* ---- privacy-policy : texte courant (scopé ; :where() conserve la
       spécificité d'origine face aux règles de classe) ---- */
.t-privacy :where(p,li){font-size:.92rem;max-width:920px}
.t-privacy :where(ul){padding-left:1.4em;margin:.4em 0 1em}
.updated{font-size:.8rem;color:var(--text2)}

/* ---- articles ---- */
.article p{font-size:.95rem;margin:0 0 1.1em;max-width:920px}
.article ul,.article ol{font-size:.95rem;padding-left:1.5em;margin:.4em 0 1.2em}
.article li{margin-bottom:.35em}
.article h3{font-size:1rem;margin:1.5em 0 .5em}
.related-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:14px 0 8px}
@media(max-width:600px){.related-grid{grid-template-columns:1fr}}
.related-card{display:block;background:#fff;border:1px solid var(--border);border-radius:14px;padding:18px;text-decoration:none;color:inherit;transition:border-color .15s ease}
.related-card:hover{border-color:var(--black)}
.related-cat{display:inline-block;background:var(--yellow);color:var(--black);font-size:.72rem;font-weight:700;border-radius:8px;padding:.05em .9em;letter-spacing:.05em;margin-bottom:.5em}
.related-card h4{font-size:.98rem;line-height:1.5;margin-bottom:.35em}
.related-card p{font-size:.83rem;color:var(--text2);line-height:1.7;margin:0}
.related-card .go{display:inline-block;margin-top:.7em;font-size:.8rem;font-weight:700;border-bottom:2px solid var(--yellow)}

/* ---- outils : formulaires ---- */
.card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:22px 20px;margin:20px 0}
.card h2{font-size:1rem;margin-bottom:.9em;padding-bottom:.5em;border-bottom:1px solid var(--soft)}
label{display:block;font-size:.85rem;font-weight:700;margin-bottom:.3em}
.hint{font-size:.75rem;color:var(--muted);font-weight:400}
input[type=number],select{width:100%;padding:.55em .8em;font-size:1.05rem;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--black)}
/* kanzenshoku & subscription : champs en 1rem (+ type=text) */
.p-kanzen input[type=number],.p-kanzen input[type=text],
.p-subsc input[type=number],.p-subsc input[type=text],.p-subsc select{width:100%;padding:.55em .8em;font-size:1rem;border:1px solid var(--border);border-radius:8px;background:#fff;color:var(--black)}
input:focus,select:focus{border-color:var(--black)}
.field{margin-bottom:13px}
.p-kanzen .field{margin-bottom:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.p-kanzen .grid2{gap:12px}
@media(max-width:560px){.grid2{grid-template-columns:1fr}}

/* ---- outils : blocs résultat ---- */
.result{background:#fff;border:1px solid var(--border);border-top:3px solid var(--yellow);border-radius:14px;padding:20px;margin:20px 0}
.p-shokuhi .result,.p-1rm .result,.p-pfc .result{padding:22px 20px}
.p-jougen .result,.p-danboru .result,.p-taishibou .result{padding:22px 20px;text-align:center}
.result h2{font-size:1rem;margin-bottom:.8em}
.p-jougen .result h2,.p-danboru .result h2,.p-1rm .result h2,.p-pfc .result h2,.p-taishibou .result h2{margin-bottom:.6em}
.r-row{display:flex;justify-content:space-between;align-items:baseline;gap:1em;padding:.5em 0;border-bottom:1px solid var(--soft);flex-wrap:wrap}
.p-danbou .r-row,.p-gaishoku .r-row{padding:.45em 0}
.p-curtain .r-row:last-of-type,.p-danbou .r-row:last-of-type,.p-nurikae .r-row:last-of-type{border-bottom:none}
.r-label{font-size:.88rem;font-weight:700}
.num{font-size:1.7rem;font-weight:800;font-feature-settings:"tnum";white-space:nowrap}
.p-jougen .num,.p-danboru .num,.p-taishibou .num,.p-1rm .num,.p-pfc .num{font-size:2.4rem;line-height:1.3;white-space:normal}
.num small{font-size:.9rem;font-weight:700;color:var(--text2)}
.p-jougen .num small,.p-danboru .num small,.p-taishibou .num small{font-size:1.1rem}
.p-1rm .num small,.p-pfc .num small{font-size:1.05rem}
.r-note{font-size:.82rem;color:var(--text2);margin-top:.6em}
.p-shokuhi .r-note{font-size:.85rem;text-align:center}

/* ---- outils : tableaux (kanzenshoku / 1rm / subscription) ---- */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.88rem}
.p-kanzen table{min-width:480px}
.p-1rm table{min-width:420px}
.p-subsc table{min-width:400px}
th,td{padding:.55em .6em;border-bottom:1px solid var(--soft);text-align:right;white-space:nowrap;font-feature-settings:"tnum"}
.p-kanzen th,.p-kanzen td{padding:.6em .6em}
.p-1rm th,.p-1rm td{padding:.5em .6em}
th:first-child,td:first-child{text-align:left}
th{color:var(--text2);font-size:.76rem;border-bottom:2px solid var(--border)}
td.kg{font-weight:800}
tr.best{background:var(--note-bg)}
tr.best td{font-weight:800}
.best-badge{display:inline-block;background:var(--yellow);color:var(--black);font-size:.7rem;font-weight:700;border-radius:8px;padding:0 .6em;margin-left:.5em;vertical-align:middle}
.empty-msg{font-size:.88rem;color:var(--text2)}

/* ---- outils : composants spécifiques ---- */
/* danbou-hiyou-hikaku */
.cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.cols{grid-template-columns:1fr}}
.panel-tag{display:inline-block;font-size:.75rem;font-weight:700;color:var(--black);background:var(--yellow);border-radius:8px;padding:0 .8em;margin-bottom:.7em}
.panel-b .panel-tag{background:var(--black);color:#f4f4f4}
/* danbou-hiyou-hikaku & gaishoku-jisui-hikaku */
.verdict{margin-top:.9em;padding:.7em 1em;background:var(--bg);border:1px solid var(--soft);border-radius:8px;font-size:.92rem}
.verdict strong{background:var(--yellow);padding:0 .25em}
/* diy-nurikae-keisan */
.check{display:flex;align-items:center;gap:.5em;font-size:.9rem;font-weight:700;margin-top:.2em}
.check input{width:1.15em;height:1.15em;accent-color:var(--black)}
/* furusato-nouzei-jougen */
.note .sub{font-weight:400;display:block;margin-top:.3em;font-size:.82rem;color:var(--text2)}
/* hitorigurashi-shokuhi-keisan */
.verdict-main{text-align:center;margin-bottom:4px}
.v-label{display:inline-block;font-size:1.15rem;font-weight:800;background:var(--yellow);border-radius:8px;padding:.2em 1em}
.range-wrap{margin-top:18px}
.range-track{position:relative;height:14px;background:var(--soft);border-radius:8px;overflow:hidden}
.range-zone{position:absolute;top:0;bottom:0;background:var(--yellow)}
.range-marker{position:absolute;top:-4px;width:3px;height:22px;background:var(--black);border-radius:2px}
.range-labels{display:flex;justify-content:space-between;font-size:.72rem;color:var(--text2);margin-top:6px}
/* kanzenshoku-cost-hikaku */
.p-tag{display:inline-block;font-size:.75rem;font-weight:700;color:var(--black);background:var(--yellow);border-radius:8px;padding:0 .8em;margin-bottom:.7em}
.card.p2 .p-tag{background:var(--black);color:#f4f4f4}
.card.p3 .p-tag{background:var(--muted);color:#fff}
/* kintore-1rm-keisan */
.rm-main{text-align:center;margin-bottom:6px}
.warn{text-align:center;font-size:.8rem;color:var(--text2);margin-bottom:12px}
/* kintore-pfc-keisan */
.kcal-main{text-align:center;margin-bottom:6px}
.sub-kcal{text-align:center;font-size:.8rem;color:var(--text2);margin-bottom:14px}
.pfc-bar{display:flex;height:30px;border-radius:8px;overflow:hidden;margin:10px 0 6px;border:1px solid var(--soft)}
.pfc-bar span{display:flex;align-items:center;justify-content:center;font-size:.72rem;font-weight:700;min-width:0;overflow:hidden;white-space:nowrap}
.seg-p{background:var(--yellow);color:var(--black)}
.seg-f{background:var(--black);color:#f4f4f4}
.seg-c{background:var(--border);color:var(--black)}
.pfc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.pfc-cell{background:#fff;border:1px solid var(--soft);border-radius:14px;padding:10px 6px;text-align:center;border-top:4px solid var(--soft)}
.pfc-cell.p{border-top-color:var(--yellow)}
.pfc-cell.f{border-top-color:var(--black)}
.pfc-cell.c{border-top-color:var(--border)}
.pfc-cell .t{font-size:.75rem;font-weight:700;color:var(--text2)}
.pfc-cell .g{font-size:1.4rem;font-weight:800;font-feature-settings:"tnum"}
.pfc-cell .g small{font-size:.8rem;color:var(--text2)}
.pfc-cell .k{font-size:.7rem;color:var(--text2)}
/* subscription-cost-keisan */
.sub-head{display:grid;grid-template-columns:1fr 110px 96px 64px;gap:8px;font-size:.75rem;font-weight:700;color:var(--text2);margin-bottom:6px}
.sub-row{display:grid;grid-template-columns:1fr 110px 96px 64px;gap:8px;margin-bottom:10px;align-items:center}
.btn-del{background:none;border:1px solid var(--border);border-radius:8px;color:var(--text2);font-size:.8rem;padding:.45em .4em;cursor:pointer}
.btn-del:hover{border-color:var(--black);color:var(--black)}
.btn-add{display:inline-block;background:var(--yellow);color:var(--black);font-weight:500;font-size:.95rem;border:none;border-radius:8px;padding:.6em 1.6em;cursor:pointer;margin-top:6px}
.btn-add:hover{filter:brightness(.95)}
.btn-add[disabled]{background:var(--soft);color:var(--muted);cursor:not-allowed}
@media(max-width:560px){.sub-head{display:none}.sub-row{grid-template-columns:1fr 1fr 64px}.sub-row .s-name{grid-column:1/-1}}
.totals{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
@media(max-width:480px){.totals{grid-template-columns:1fr}}
.total-cell{background:var(--bg);border:1px solid var(--soft);border-radius:8px;padding:12px;text-align:center}
.total-cell .t{font-size:.78rem;font-weight:700;color:var(--text2)}

/* ---- encadré note ---- */
.note{background:var(--note-bg);border-left:4px solid var(--yellow);border-radius:0 14px 14px 0;padding:12px 14px;font-size:.85rem;color:var(--text2);margin:18px 0}
.p-jougen .note{font-size:.88rem;color:var(--black);font-weight:700}

/* ---- outils : mode d'emploi ---- */
.howto p,.howto li{font-size:.92rem;max-width:920px}
.howto ul{padding-left:1.4em;margin:.4em 0 1em}

/* ---- pubs & affiliation ---- */
.ad-box{margin:24px 0;text-align:center}
.pr-note{font-size:.8rem;color:var(--muted);text-align:center;margin:30px 0 18px}
.pr-pill{display:block;width:100%;text-align:center;padding:7px 1.1em;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--text2);font-size:.8rem}
.aff-box{text-align:center;margin:0 0 24px}
.aff-box img,.aff-box iframe{max-width:100%}
/* Correctif B : fond jaune, marge latérale + survol jaune assombri */
.aff-pill{display:inline-block;border:1px solid #0d0d0d;border-radius:999px;background:var(--yellow);color:#0d0d0d;padding:2px 10px;line-height:1.5;text-decoration:none;margin:0 4px}
.aff-pill:hover{background:#e0b615}

/* ---- accueil : cartes d'outils ---- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.tool-card{display:block;background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 18px;text-decoration:none;color:inherit;transition:border-color .15s ease}
.tool-card:hover{border-color:var(--black)}
.tool-card .head{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px}
.tool-card .icon{width:44px;height:44px;flex:none;border-radius:8px;background:var(--bg);border:1px solid var(--soft);display:flex;align-items:center;justify-content:center;font-size:1.4rem}
.tool-card h3{font-size:1rem;line-height:1.5;min-width:0}
.tool-card p{font-size:.83rem;color:var(--text2);line-height:1.7}
.tool-card .go{display:inline-block;margin-top:.9em;font-size:.8rem;font-weight:700;border-bottom:2px solid var(--yellow)}
/* Correctif A : pastilles articles sous chaque grille de l'accueil */
.chips-label{font-size:.85rem;font-weight:700;color:var(--text2);margin-top:24px;margin-bottom:10px}
.article-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip-article{display:inline-block;padding:6px 14px;border:1px solid var(--black);border-radius:6px;font-size:.78rem;color:var(--black);background:#fff;text-decoration:none;transition:background .15s ease,color .15s ease}
.chip-article:hover{background:var(--black);color:var(--yellow)}

/* ---- pied de page ---- */
footer{margin-top:56px;background:var(--black);color:#c9c9c5;font-size:.85rem}
footer .page-container{padding-top:30px;padding-bottom:36px}
footer .fname{font-weight:700;color:#f4f4f4;letter-spacing:.04em}
footer ul{list-style:none;display:flex;flex-wrap:wrap;gap:.3em 1.4em;margin:.8em 0 1.2em}
.t-article footer ul{margin:.4em 0 .6em}
.t-home footer ul{margin:.9em 0 1.3em}
.t-privacy footer ul{padding:0;max-width:none}
footer a{color:#f4f4f4}
.copy{color:#8f8f8b;font-size:.78rem}
.t-article .copy{margin-top:1.2em}

/* ---- accessibilité ---- */
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
