[data-kako-home] {
  --kh-ink: #12262a;
  --kh-paper: #eef5f1;
  --kh-accent: #20594f;
  --kh-line: #a5c1b6;
  --kh-round: 12px;
}
[data-kako-home="1"] { --kh-paper:#f1eadb; --kh-ink:#3d3022; --kh-accent:#795022; --kh-line:#bba98b; --kh-round:3px; }
[data-kako-home="2"] { --kh-paper:#e6f1ee; --kh-ink:#14352d; --kh-accent:#1a6251; --kh-line:#a4c4b9; --kh-round:5px; }
[data-kako-home="3"] { --kh-paper:#e8eff8; --kh-ink:#182b45; --kh-accent:#2f547f; --kh-line:#9eb6d1; --kh-round:10px; }
[data-kako-home="4"] { --kh-paper:#e9ecdf; --kh-ink:#2e341e; --kh-accent:#4b591f; --kh-line:#aab290; --kh-round:2px; }
[data-kako-home="5"] { --kh-paper:#f1e9df; --kh-ink:#3a271d; --kh-accent:#824023; --kh-line:#c8ad9a; --kh-round:16px; }
[data-kako-home="6"] { --kh-paper:#f4e8ec; --kh-ink:#412537; --kh-accent:#854264; --kh-line:#c8a1b7; --kh-round:19px; }
.kh-theme { font-size: .82rem; letter-spacing: .09em; text-transform: uppercase; font-weight: 750; margin: 0 0 .45rem; }
.kh-jump { display: flex; flex-wrap: wrap; gap: .2rem 1.15rem; margin: .85rem 0 .55rem; }
.kh-jump a { display: inline-flex; align-items: center; min-height: 40px; font-size: .88rem; font-weight: 700; text-underline-offset: 4px; }
.kh-categories { scroll-margin-top: 1rem; }
.kh-section { box-sizing:border-box; width: min(100% - 32px, 1176px); margin: 1.45rem auto; padding: 0; scroll-margin-top: 1rem; }
.kh-section .kh-inner { background: var(--kh-paper); color: var(--kh-ink); border: 1px solid var(--kh-line); border-radius: var(--kh-round); padding: clamp(16px, 3vw, 34px); }
.kh-section h2 { color: var(--kh-ink); font-size: clamp(1.45rem, 2.8vw, 2.15rem); line-height: 1.12; margin: 0 0 .55rem; max-width: none; }
.kh-section h3 { color: var(--kh-ink); font-size: 1rem; line-height: 1.25; margin: 0; }
.kh-section p { color: var(--kh-ink); max-width: 68ch; margin: .4rem 0 0; font-size: .96rem; line-height: 1.5; }
.kh-section a { display:inline-flex; align-items:center; gap:.4em; min-height:44px; color:var(--kh-accent); text-decoration:underline; text-underline-offset:.22em; font-size:.95rem; font-weight:750; }
.kh-section a:focus-visible, .kh-jump a:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.kh-why .kh-inner, .kh-section-head { display:flex; align-items:center; justify-content:space-between; gap: .75rem 1.25rem; flex-wrap:wrap; }
.kh-why-link { flex:none; }
.kh-guide ol { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); list-style:none; counter-reset:kh-step; padding:0; margin:.9rem 0 0; gap:.9rem; }
.kh-guide li { counter-increment:kh-step; border-top:1px solid var(--kh-line); padding:.7rem .2rem .2rem; }
.kh-guide li::before { content: "0" counter(kh-step); display:block; margin:0 0 .3rem; color:var(--kh-accent); font-size:.8rem; font-weight:750; letter-spacing:.08em; }
.kh-help-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.9rem; margin-top:.85rem; }
.kh-help-grid article { padding: .9rem 1rem .4rem; border:1px solid var(--kh-line); border-radius:var(--kh-round); }
.kh-deal-links { display:flex; flex-wrap:wrap; gap: .25rem 1.35rem; }
[data-kako-home="1"] .kh-guide .kh-inner { border-block-width:4px; }
[data-kako-home="2"] .kh-why .kh-inner { border-inline-start: 7px solid var(--kh-accent); }
[data-kako-home="2"] .kh-deals .kh-inner { border-style:dashed; }
[data-kako-home="3"] .kh-guide li { padding-inline:.65rem; border:1px solid var(--kh-line); border-radius:var(--kh-round); }
[data-kako-home="4"] .kh-why .kh-inner { border-style:dashed; }
[data-kako-home="4"] .kh-guide li { border-top:0; border-inline-start:2px solid var(--kh-line); padding-inline-start:.65rem; }
[data-kako-home="5"] .kh-help-grid article { border-style:solid none none; border-radius:0; }
[data-kako-home="6"] .kh-why .kh-inner { border-radius:24px 24px 24px 3px; }
@media(max-width:680px) {
  .kh-guide ol,.kh-help-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kh-section-head { display:block; }
}
@media(max-width:440px) {
  .kh-help-grid { grid-template-columns:1fr; gap:.55rem; }
  .kh-jump { gap:.05rem .9rem; }
}
@media(prefers-color-scheme:dark) {
  [data-kako-home] { --kh-paper:#252c30; --kh-ink:#f5efe8; --kh-accent:#e6d2aa; --kh-line:#66736e; }
}
.kh-shortcuts { box-sizing:border-box; width:min(100% - 36px,1176px); margin:1rem auto; }
.kh-shortcuts ul { margin-block:.5rem; }
.kh-shortcuts a { color:inherit; }
.kh-jump a { color:inherit; min-height:44px; }
[data-kako-home="2"] .xtr-hero .kh-jump a { color:#f6d2ba; }
[data-kako-home="3"] .obj-hero__hint, [data-kako-home="5"] .bsc-hint { margin-block:.35rem 0; }
@media(max-width:560px) {
  [data-kako-home="1"] .frg-hero, [data-kako-home="1"] .kh-categories { padding-block:24px; }
  [data-kako-home="4"] .kfw-head .kfw-wrap { gap:8px; }
  [data-kako-home="4"] .kfw-brand { gap:8px; min-width:0; flex:1 1 auto; }
  [data-kako-home="4"] .kfw-brand img { width:94px; flex:none; }
  [data-kako-home="4"] .kfw-brand span { overflow-wrap:anywhere; }
  [data-kako-home="5"] .bsc-hero { padding-top:.9rem; }
  [data-kako-home="5"] .bsc-card-hero { padding-top:2rem; padding-bottom:1rem; }
  [data-kako-home="5"] .bsc-card-hero::before { top:9px; height:11px; }
  [data-kako-home="6"] .gft-nav ul { flex-wrap:nowrap; overflow-x:auto; }
  [data-kako-home="6"] .gft-hero { padding-block:18px; }
  [data-kako-home="6"] .gft-note { padding-block:18px; }
  [data-kako-home="6"] .kh-categories { padding-block:22px; }
  [data-kako-home="6"] .gft-wall-key { display:none; }
}
.kh-media { margin-top:1.6rem; padding-top:1.25rem; border-top:1px solid var(--kh-line); }
.kh-photos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(8px,2vw,22px); margin:.8rem 0 .35rem; }
.kh-photos figure { min-width:0; margin:0; }
.kh-photos figure > a { display:block; overflow:hidden; border-radius:var(--kh-round); }
.kh-photos img { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:contain; background:var(--kh-line); }
.kh-photos figcaption { font-size:clamp(.8rem,1.7vw,.95rem); margin:.3rem 0 0; }
.kh-outfit .kh-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(150px,220px); align-items:center; gap:clamp(14px,4vw,38px); }
.kh-outfit img { display:block; width:100%; height:auto; max-height:320px; object-fit:contain; border-radius:var(--kh-round); }
.kh-outfit .kh-theme { font-size:.74rem; font-weight:750; margin:0 0 .5rem; }
[data-kako-home="5"] .kh-outfit .kh-inner > a { grid-row:1; grid-column:1; }
[data-kako-home="5"] .kh-outfit .kh-inner { grid-template-columns:minmax(150px,220px) minmax(0,1fr); }
@media(max-width:460px) {
  .kh-outfit .kh-inner, [data-kako-home="5"] .kh-outfit .kh-inner { grid-template-columns: minmax(0,1fr) minmax(86px,34%); gap:10px; }
  [data-kako-home="5"] .kh-outfit .kh-inner > a { grid-area:auto; }
  .kh-outfit h2 { font-size:1.25rem; }
}
@media(max-width:560px) {
  [data-kako-home="1"] .frg-top__name { min-height:28px; }
  [data-kako-home="1"] .frg-hero { padding-block:22px 10px; }
  [data-kako-home="1"] .kh-categories { padding-top:16px; }
  .kh-jump { display:grid; grid-template-columns:repeat(2,minmax(0,max-content)); column-gap:1.1rem; row-gap:0; }
}
@media(min-width:360px) and (max-width:560px) {
  .kh-jump { display:flex; }
}
.kh-help-grid article { padding-bottom:.85rem; }
.kh-help-grid h3 a { line-height:1.25; min-height:35px; }
.kh-help-grid article p { margin-top:.18rem; }
.kh-category-notes { margin-top:1rem; }
@media(max-width:560px) { [data-kako-home="6"] .kh-category-notes .gft-wall-key { display:flex; } }
