/* Shared finish, retaining the dark/lime design and existing tool layouts. */
html{scroll-padding-top:calc(var(--suite-header-height,0px) + 16px)}
.kd-page :is(button,a,summary,input,select,textarea):focus-visible{outline:2px solid var(--lime,#b8ff38);outline-offset:3px}
.kd-page main:focus{outline:none}
.kd-page :is(button,a,summary){touch-action:manipulation}
.kd-page button:disabled{cursor:not-allowed}
.skip-link{position:fixed;top:8px;left:12px;z-index:10000;transform:translateY(-160%);border:2px solid var(--lime);border-radius:8px;background:#101417;color:var(--text);padding:12px 18px;font-weight:800}
.skip-link:focus{transform:none}
.kd-page :is(.card,.field,.chart-controls,.result-head)>*{min-width:0}
.kd-page :is(.cardhead h2,.result-head h2,.step-head h2,.section-title){overflow-wrap:anywhere}
.kd-page :is(.chart-controls select,dialog input,dialog select,dialog textarea){max-width:100%}
.kd-page dialog{max-height:calc(100dvh - 24px);overscroll-behavior:contain;color-scheme:dark}
.kd-page dialog:not(.tool-guide){overflow-y:auto}
.kd-page dialog::backdrop{background:rgba(0,0,0,.78)}
.kd-page :is(.profile-dialog,.macro-dialog,.save-dialog,.print-dialog){background-color:var(--panel);color:var(--text)}
.kd-page :is(.pane,.health-pane)[hidden]{display:none!important}

/* A two-row header gives the translated tool names enough room. */
.kd-page .suite-header-inner{grid-template-columns:180px minmax(0,1fr) 220px;gap:12px}
.kd-page .suite-header-inner .brand-logo-link{width:180px;flex-basis:180px}
.kd-page .suite-header-nav a{min-height:44px;display:flex!important;align-items:center;justify-content:center;padding:10px 8px!important;letter-spacing:.025em!important;white-space:normal;overflow-wrap:anywhere;text-align:center}
.kd-page .suite-header-actions .kd-language-picker select{min-height:44px}
@media(max-width:1180px){
 .kd-page .suite-header-inner{grid-template-columns:180px minmax(0,1fr);gap:8px 12px;padding:10px 0}
 .kd-page .suite-header-nav{grid-column:1/-1;grid-row:2;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:4px!important}
 .kd-page .suite-header-actions{grid-column:2;grid-row:1}
}
@media(max-width:620px){
 .kd-page .suite-header-inner{width:calc(100% - 24px);grid-template-columns:148px minmax(0,1fr)}
 .kd-page .suite-header-inner .brand-logo-link{width:148px;flex-basis:148px}
 .kd-page .suite-header-nav{grid-template-columns:repeat(3,minmax(0,1fr))!important}
 .kd-page .suite-header-nav a{font-size:.68rem!important;padding:8px 4px!important}
}

/* Less introductory space leaves the actual task closer to the navigation. */
.kd-training .hero,.kd-results .hero,.kd-health .hero{min-height:195px;padding-top:22px;padding-bottom:22px;margin-bottom:18px;gap:20px}
.kd-stack .intro{min-height:195px;padding:18px 0 24px}
.kd-training .hero h1,.kd-results .hero h1,.kd-health .hero h1,.kd-stack .intro h1{font-size:clamp(2.3rem,5.3vw,4.8rem)!important;line-height:.96!important;letter-spacing:-.06em!important;overflow-wrap:anywhere}
.kd-training .hero-copy,.kd-results .hero>p,.kd-health .hero>p,.kd-stack .intro .lede{font-size:.92rem;line-height:1.55}
.kd-nutrition .intro h1{font-size:clamp(2rem,4vw,3.1rem)!important;line-height:1!important;letter-spacing:-.04em!important;overflow-wrap:anywhere}
.kd-nutrition #calculator,.kd-nutrition #result,.kd-nutrition #recipes{scroll-margin-top:0}
.kd-home .hero{min-height:0;padding:28px 0 12px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(330px,1fr);gap:32px;align-items:center}
.kd-home .hero h1{font-size:clamp(2rem,4.5vw,3.5rem);line-height:.98;margin:10px 0 12px}
.kd-home .hero h1 span{display:inline;margin-left:.15em}
.kd-home .hero>*{min-width:0}
.kd-home .hero .signal{display:block;min-width:0}
.kd-home .hero .signal-head{gap:8px;flex-wrap:wrap}
.kd-home .hero .lead{max-width:760px;font-size:.95rem;margin:0 0 14px}
.kd-home .hero .eyebrow{font-size:.65rem}
.kd-home .hero .btn{padding:10px 14px;min-height:44px;font-size:.78rem}
.kd-home .today{padding:18px 0 12px}
.kd-home .today h2{font-size:clamp(2rem,4vw,3rem);line-height:1;margin-bottom:18px}
.kd-home .today-card{min-width:0;min-height:195px;padding:18px}
.kd-home .today-card h3{overflow-wrap:anywhere;margin-top:16px}
.kd-home .today-card a{display:flex;align-items:center;min-height:44px;line-height:1.5;padding-top:8px}
.kd-home .today-health-card{min-height:0}
.kd-home .tools{padding:38px 0 46px}
.kd-home .card{min-height:295px;padding:24px}
.kd-home .card h3{font-size:clamp(2.1rem,3.4vw,3.1rem);margin:18px 0 14px}
.kd-home .card p{font-size:.88rem;margin-bottom:18px}
.kd-home .journey{padding-bottom:48px}
.kd-home .grid,.kd-landing .grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.kd-home .card h3 span,.kd-landing .card h3 span{white-space:normal;overflow-wrap:anywhere}
.kd-landing .card{cursor:pointer}

@media(max-width:920px){
 .kd-home .hero{grid-template-columns:minmax(0,1fr);gap:22px}
 .kd-home .hero .signal{min-height:0}
}

/* Visible, wrapping tabs avoid hiding the last section off-screen. */
.kd-results .tabs,.kd-health .health-tabs{display:flex;flex-wrap:wrap;gap:7px;overflow:visible;padding:3px;margin:0 0 16px}
.kd-results .tab,.kd-health .health-tab{min-height:44px;white-space:normal;line-height:1.35;text-align:center}
.kd-results .tab[aria-selected="true"],.kd-health .health-tab[aria-selected="true"]{background:var(--lime);border-color:var(--lime);color:#10140c}
.kd-results .cardhead,.kd-health .cardhead{flex-wrap:wrap;align-items:flex-start}
.kd-results .chart-controls,.kd-health .chart-controls{max-width:100%}
.kd-results .chart-controls select,.kd-health .chart-controls select{min-height:44px;min-width:0}
.kd-results .metric .value{overflow-wrap:anywhere}
.kd-training .config{position:static}
.kd-training :is(.select,.action,.primary),.kd-stack :is(input:not([type="checkbox"]),select,button){min-height:44px}
.kd-training .section-title{gap:10px;flex-wrap:wrap}
.kd-training .save-row{grid-template-columns:minmax(0,1fr) auto}
.kd-training .save-row input{min-width:0}
.kd-stack .cycle-save{grid-template-columns:minmax(0,1fr) auto}
.kd-stack .cycle-library{grid-template-columns:minmax(0,1fr) auto auto}
.kd-stack .cycle-manager input,.kd-stack .cycle-manager select{min-width:0;width:100%}
.kd-stack .result-head{gap:12px;flex-wrap:wrap}
.kd-stack .duration{margin-left:auto}
.kd-stack .legend-phase{flex-wrap:wrap}
.kd-stack .legend-phase span{flex-basis:160px}
.kd-stack .field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

@media(max-width:760px){
 .kd-page input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),.kd-page select,.kd-page textarea{font-size:16px!important;min-height:44px}
 .kd-page :is(.btn,.action,.primary,.ghost-button,.icon-button,.dialog-close,.about-close,.tool-guide-close){min-height:44px}
 .kd-training .hero,.kd-results .hero,.kd-health .hero,.kd-stack .intro{min-height:0;padding:16px 0 20px;gap:14px}
 .kd-training .hero h1,.kd-results .hero h1,.kd-health .hero h1,.kd-stack .intro h1{font-size:clamp(2rem,8.5vw,3.3rem)!important}
 .kd-nutrition .intro h1{font-size:clamp(1.85rem,8vw,2.6rem)!important}
 .kd-results .chart-controls,.kd-health .chart-controls{width:100%;justify-content:stretch}
 .kd-results .chart-controls select,.kd-health .chart-controls select{flex:1 1 140px;width:0}
 .kd-results .tabs .tab,.kd-health .health-tabs .health-tab{flex:1 1 120px;font-size:.75rem;padding:10px 12px}
 .kd-results .metric{grid-column:span 6;min-height:120px;padding:16px}
 .kd-results .metric .value{font-size:clamp(1.6rem,6vw,2.3rem)}
 .kd-page .storage-usage .storage-quota{width:auto;flex:1 1 120px;gap:6px;flex-wrap:wrap;justify-content:space-between;border-radius:9px;font-size:.7rem}
 .kd-home .today-card{min-height:170px}
 .kd-home .today-health-card{min-height:0}
 .kd-home .today-health-card a{white-space:normal}
 .kd-home .storage-usage .profile-strip{min-width:0;flex-wrap:wrap;gap:8px}
 .kd-home .profile-strip-actions{margin-left:auto}
 .kd-home .card{min-height:255px}
 .kd-landing .hero h1{font-size:clamp(2.5rem,13vw,3.55rem);overflow-wrap:anywhere}
 .kd-landing .nav{height:auto;flex-wrap:wrap;min-height:78px;padding:12px 0}
 .kd-landing .nav .login{white-space:normal;max-width:100%}
}
@media(max-width:1099px){
 .kd-nutrition .tool-guide-open{bottom:calc(88px + env(safe-area-inset-bottom));z-index:34}
 .kd-nutrition:has(input:focus,select:focus,textarea:focus) .tool-guide-open{display:none}
}
@media(max-width:520px){
 .kd-training .save-row,.kd-stack .cycle-save{grid-template-columns:1fr}
 .kd-stack .cycle-library{grid-template-columns:1fr 1fr}
 .kd-stack .cycle-library select{grid-column:1/-1}
 .kd-stack .duration{margin-left:0;width:100%}
 .kd-stack .duration select{flex:1;width:auto;min-width:0}
 .kd-home .today-grid{gap:10px}
 .kd-home .today-card{min-height:155px}
 .kd-home .today-health-card{min-height:0}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto!important}
 .kd-page *,.kd-page *:before,.kd-page *:after{animation:none!important;transition:none!important}
 .kd-page .card:hover,.kd-page .btn:hover,.kd-page .profile-edit-button:hover{transform:none}
}
@media print{.skip-link{display:none!important}}
