/* ANBERSO GUIDE: opt-in presentation layer for the nine existing tools.
   Matches the approved dog/cat selector palette and controls. No app logic. */
:root{--navy:#002F54;--ecru:#F9F7EE;--sand:#E8D1AB;--ink:#203442;--muted:#586269;--line:#d6cebe;--paper:#f1ede3;--guide-field:#fcfbf6;--guide-selected:#e8e1d2;--guide-input-border:#938b7d;--serif:"Yu Mincho",YuMincho,"Hiragino Mincho ProN",serif;--sans:"Yu Gothic",YuGothic,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;scroll-behavior:auto}
.guide-ui{background:var(--ecru);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.8;-webkit-font-smoothing:antialiased}
.guide-ui :is(button,input,select,textarea){font-family:var(--sans)}
.guide-ui :is(h1,h2){font-family:var(--serif);color:var(--navy);font-weight:500;letter-spacing:.025em;text-wrap:pretty}
.guide-ui .site-header{max-width:1120px;height:auto;min-height:74px;padding:18px 32px;gap:16px;border-bottom:1px solid var(--line)}
.guide-ui .site-header a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.guide-ui .site-header img{width:120px;height:auto}
.guide-ui .site-header>a:first-of-type{gap:16px}
.guide-ui .site-header span{padding-left:16px;font-size:10px;letter-spacing:.16em}
.guide-ui .site-header>a:last-child{font-size:12px}
.guide-ui main.shell{max-width:1040px;padding-inline:32px}
.guide-ui .intro{max-width:880px;margin-inline:auto;padding:48px 32px 40px;text-align:left}
.guide-ui .shell>.intro{max-width:none;margin:0;padding-inline:0}
.guide-ui .intro h1{font-size:clamp(32px,3.6vw,44px);line-height:1.5;letter-spacing:.025em;margin:0 0 16px}
.guide-ui .intro .eyebrow{font-size:10px;font-weight:500;letter-spacing:.16em;margin-bottom:14px}
.guide-ui .intro .lead{font-size:15px;font-weight:400;line-height:1.95;color:var(--ink);margin:0 0 12px;max-width:42em}
.guide-ui .intro-copy{font-size:14px;line-height:1.9}
.guide-ui .scope-note{font-size:12px;line-height:1.85;margin-top:16px;padding-top:12px;border-top:1px solid var(--line)}
.guide-ui :is(.panel,.workspace,#workspace,.result-card,dialog){background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:none}
.guide-ui :is(.panel,.workspace,#workspace){padding:36px 40px 40px}
.guide-ui .workspace{max-width:880px;margin:0 auto 48px}
.guide-ui .diagnosis{max-width:920px}
.guide-ui :is(.panel,.workspace,#workspace) h2{font-size:28px;line-height:1.65;margin-bottom:14px}
.guide-ui .section-heading{gap:14px;margin-bottom:24px}
.guide-ui .section-heading h2{margin-bottom:0}
.guide-ui .section-heading p{line-height:1.8}
.guide-ui .step{border-top-color:var(--navy);font-weight:500}
.guide-ui .question-help,.guide-ui .question-description{font-size:14px;line-height:1.9;color:var(--muted)}
.guide-ui :is(main,dialog) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){min-height:52px;min-width:0;max-width:100%;padding:12px 14px;font-size:16px;line-height:1.6;border:1px solid var(--guide-input-border);border-radius:6px;background:var(--guide-field);color:var(--ink)}
.guide-ui :is(input,textarea)::placeholder{font-size:14px;color:#6b716f;opacity:1}
.guide-ui :is(input,select)[aria-invalid=true]{border-color:var(--danger,#993d2d);background:#fff4f2}
.guide-ui .number-field{border:1px solid var(--guide-input-border);border-radius:6px;background:var(--guide-field)}
.guide-ui .number-field input{border:0;border-radius:0;margin:0}
.guide-ui :is(main,dialog) :is(.button,.primary-link,.primary-button){min-height:52px;border-radius:6px;padding:13px 22px;font-size:15px;font-weight:500;line-height:1.6;gap:12px;box-shadow:none}
.guide-ui :is(.button.primary,.primary-link,.primary-button,.store-cta){background:var(--navy);color:var(--ecru);border-color:var(--navy)}
.guide-ui :is(.button.secondary,.button.outline){background:transparent;color:var(--navy);border-color:var(--navy)}
.guide-ui :is(.text-button,.text-action,.reset-button){min-height:48px;font-size:14px;padding-block:12px}
.guide-ui :is(.option,button.choice){min-height:64px;border:1px solid var(--line);border-radius:8px;padding:16px 18px;background:var(--guide-field);box-shadow:none}
.guide-ui :is(.option,button.choice) strong{font-size:16px;font-weight:500;line-height:1.6}
.guide-ui :is(.option,button.choice) small{font-size:13px;line-height:1.7}
.guide-ui label.choice>span{min-height:64px;border:1px solid var(--line);border-radius:8px;background:var(--guide-field);padding:14px 12px}
.guide-ui :is(.option:has(input:checked),button.choice.selected,.method label:has(input:checked)),.guide-ui label.choice:has(input:checked)>span{background:var(--guide-selected);border:1px solid var(--navy);box-shadow:inset 0 0 0 1px var(--navy)}
.guide-ui label.choice:has(input:checked)>span{padding:14px 12px}
.guide-ui .method{background:transparent;gap:10px}
.guide-ui .workspace .method label{min-height:56px;padding:12px 10px;border:1px solid var(--line);border-radius:8px;background:var(--guide-field)}
.guide-ui .workspace .method label:has(input:checked){border-color:var(--navy);background:var(--guide-selected)}
.guide-ui .steps{gap:6px;border:0;margin-bottom:24px}
.guide-ui .steps button{border-bottom:2px solid var(--line);font-size:13px;font-weight:400;padding:10px 2px;white-space:normal;line-height:1.6}
.guide-ui .steps button[aria-current]{border-color:var(--navy);font-weight:700}
.guide-ui :is(.answer-trail button,.color-options button){border-radius:6px;background:var(--guide-field)}
.guide-ui .color-options button[aria-pressed=true]{background:var(--guide-selected);border-color:var(--navy)}
.guide-ui main summary{min-height:48px;padding-block:12px;font-size:14px;line-height:1.7}
.guide-ui :is(.notice,.material-note,.selection-guidance,.advisory-card,.formula,.formula-values){background:#e9e2d3;border-radius:0 6px 6px 0;box-shadow:none}
.guide-ui .food-card{background:var(--guide-field);border-radius:12px}
.guide-ui .card-result{background:var(--guide-selected)}
.guide-ui :is(.amount,.tradeoff){background:var(--guide-selected);border-radius:8px}
.guide-ui .result-placeholder{background:var(--guide-field);border-radius:8px;box-shadow:none}
.guide-ui .result-card{padding:28px 32px}
.guide-ui .feeding-guide section{margin-bottom:32px}
.guide-ui .feeding-guide h2{font-size:26px}
.guide-ui .feeding-guide .source a{display:inline-block;min-height:44px;padding-block:8px}
.guide-ui .waterproof a{display:inline-flex;align-items:center;min-height:44px;padding-block:8px}
.guide-ui .contact{max-width:1040px;border-radius:12px;padding:40px;margin-bottom:32px}
.guide-ui .contact h2{color:var(--ecru);font-size:28px}
.guide-ui .contact .button.light{color:var(--navy);background:var(--guide-field)}
.guide-ui .next-step h2{font-size:28px;line-height:1.7}
.guide-ui .store-cta::before{display:none}
.guide-ui footer{max-width:1040px;margin:0 auto;padding:24px 32px 32px;border-top:1px solid var(--line);display:flex;align-items:center;flex-wrap:wrap;gap:4px 24px;text-align:left;font-size:11px}
.guide-ui footer a{display:inline-flex;align-items:center;min-height:44px;padding-block:8px;margin:0;letter-spacing:.05em}
.guide-ui footer :is(small,span){flex-basis:100%;font-size:11px}
.guide-ui :is(main,dialog,.site-header,footer) :is(button,a,input,select,textarea,summary):focus-visible,.guide-ui .number-field:focus-within,.guide-ui label.choice:has(input:focus-visible)>span,.guide-ui .method label:has(input:focus-visible){outline:3px solid var(--navy);outline-offset:3px}
@media(hover:hover){.guide-ui :is(.option,button.choice):hover{border-color:#74848a;background:var(--guide-field)}.guide-ui button.choice.selected:hover{background:var(--guide-selected)}.guide-ui :is(.button.secondary,.button.outline):hover{background:var(--guide-selected)}.guide-ui :is(.button.primary,.primary-link,.primary-button,.store-cta):hover{background:#174965}}
@media(max-width:700px){
 .guide-ui .site-header{padding:12px 18px;min-height:68px;gap:12px}.guide-ui .site-header img{width:92px}.guide-ui .site-header>a:first-of-type{gap:10px}.guide-ui .site-header span{padding-left:10px;font-size:9px}.guide-ui .site-header>a:last-child{font-size:11px}
 .guide-ui main.shell{padding-inline:12px}.guide-ui .intro{padding:26px 20px 24px}.guide-ui .shell>.intro{padding-inline:8px}.guide-ui .intro h1{font-size:30px;line-height:1.6;margin-bottom:14px}.guide-ui .intro .lead{font-size:14px;line-height:1.9}.guide-ui .intro-copy{font-size:13px}.guide-ui .intro .eyebrow{font-size:9px;margin-bottom:10px}.guide-ui .scope-note{font-size:11px}
 .guide-ui :is(.panel,.workspace,#workspace){padding:24px 18px 28px;border-radius:12px}.guide-ui .workspace{margin:0 12px 36px}.guide-ui .diagnosis,.guide-ui.showing-results .diagnosis{padding-inline:12px}.guide-ui.showing-results #workspace{padding:24px 18px 28px}
 .guide-ui :is(.panel,.workspace,#workspace) h2,.guide-ui .feeding-guide h2{font-size:24px;line-height:1.65}.guide-ui .section-heading{gap:10px;margin-bottom:22px}.guide-ui .step{flex-basis:26px;font-size:11px}
 .guide-ui :is(.option,button.choice){padding:14px;gap:12px}.guide-ui :is(.option,button.choice) strong{font-size:15px}.guide-ui :is(.option,button.choice) small{font-size:12px}.guide-ui .question-help{font-size:13px}
 .guide-ui .form-grid{gap:18px 12px}.guide-ui .result-card{padding:24px 18px}.guide-ui .actions{gap:8px}.guide-ui .contact{margin:0 12px 24px;padding:28px 22px}.guide-ui .contact h2,.guide-ui .next-step h2{font-size:25px}
 .guide-ui footer{margin:0 20px;padding:18px 0 28px;align-items:flex-start;gap:0;flex-direction:column}
}
@media(max-width:350px){.guide-ui .site-header{padding-inline:14px;gap:8px}.guide-ui .site-header img{width:84px}.guide-ui .site-header>a:first-of-type{gap:8px}.guide-ui .site-header span{padding-left:8px}.guide-ui .intro h1{font-size:27px}.guide-ui :is(.panel,.workspace,#workspace){padding-inline:16px}.guide-ui .form-grid{grid-template-columns:1fr}.guide-ui .form-grid .wide{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.guide-ui :is(button,.option){transition:none}}
