:root{--pa-ink:#172126;--pa-muted:#687378;--pa-ivory:#f3f0e8;--pa-paper:#fbfaf6;--pa-navy:#162b38;--pa-sage:#668477;--pa-gold:#b58a43;--pa-line:rgba(22,43,56,.13)}
body.pheno-page{margin:0;color:var(--pa-ink);background:radial-gradient(circle at 5% 0,rgba(181,138,67,.13),transparent 28rem),radial-gradient(circle at 98% 25%,rgba(102,132,119,.15),transparent 30rem),var(--pa-ivory)}
.pheno-shell{width:min(1420px,calc(100% - 28px));margin:14px auto}
.pheno-topbar{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border:1px solid var(--pa-line);border-radius:22px;background:rgba(251,250,246,.82);backdrop-filter:blur(14px)}
.pheno-brand{display:flex;align-items:center;gap:12px;color:var(--pa-ink);text-decoration:none}.pheno-brand img{width:44px;height:44px;object-fit:contain}.pheno-brand span{display:grid;gap:2px}.pheno-brand strong{font:750 1.1rem/1 "Work Sans",sans-serif}.pheno-brand small{color:var(--pa-muted);font:750 .59rem/1 "Work Sans",sans-serif;letter-spacing:.1em}
.pheno-back{padding:10px 14px;border:1px solid var(--pa-line);border-radius:999px;color:var(--pa-navy);text-decoration:none;font:750 .78rem/1 "Work Sans",sans-serif;background:white}
.pheno-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.45fr);gap:14px;margin-top:14px}
.pheno-hero__copy,.pheno-hero__monogram,.pheno-progress,.pheno-group,.pheno-result,.pheno-method,.pheno-safety{border:1px solid var(--pa-line);border-radius:26px;box-shadow:0 16px 40px rgba(22,43,56,.06)}
.pheno-hero__copy{padding:clamp(34px,5vw,68px);background:linear-gradient(145deg,rgba(251,250,246,.96),rgba(245,244,237,.92))}
.pheno-eyebrow{display:inline-flex;width:fit-content;padding:7px 10px;border-radius:999px;color:#765723;background:rgba(181,138,67,.13);font:800 .68rem/1 "Work Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase}
.pheno-hero h1{max-width:880px;margin:20px 0 0;font:600 clamp(3rem,6vw,6.1rem)/.9 "Zodiak",Georgia,serif;letter-spacing:-.055em}.pheno-hero h1 em{position:relative;color:var(--pa-sage);font-weight:500}.pheno-hero h1 em::after{content:"";position:absolute;left:2%;right:0;bottom:-7px;height:5px;border-radius:999px;background:linear-gradient(90deg,var(--pa-gold),rgba(181,138,67,0));transform:rotate(-1deg)}
.pheno-hero__copy>p{max-width:740px;margin:24px 0 0;color:var(--pa-muted);font:400 1.02rem/1.58 "Work Sans",sans-serif}.pheno-privacy{margin-top:26px;color:var(--pa-muted);font:650 .78rem/1.3 "Work Sans",sans-serif}.pheno-privacy span{color:#5d9a74}
.pheno-hero__monogram{display:grid;grid-template-columns:1fr 1fr;align-content:end;gap:10px;padding:26px;color:#f8f6ef;background:linear-gradient(155deg,#1e3b48,var(--pa-navy))}
.pheno-hero__monogram>span{grid-column:1/-1;align-self:start;color:rgba(255,255,255,.11);font:500 clamp(7rem,14vw,12rem)/.75 "Zodiak",Georgia,serif;letter-spacing:-.08em}
.pheno-hero__monogram div{padding:15px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:rgba(255,255,255,.05)}.pheno-hero__monogram strong,.pheno-hero__monogram small{display:block}.pheno-hero__monogram strong{font:750 1.45rem/1 "Work Sans",sans-serif}.pheno-hero__monogram small{margin-top:6px;color:rgba(255,255,255,.62);font:600 .66rem/1.3 "Work Sans",sans-serif}
.pheno-progress{margin-top:14px;padding:17px 20px;background:rgba(251,250,246,.84)}.pheno-progress>div:first-child{display:flex;justify-content:space-between;color:var(--pa-muted);font:700 .76rem/1 "Work Sans",sans-serif}.pheno-progress>div strong{color:var(--pa-sage)}.pheno-progress__track{height:5px;margin-top:11px;border-radius:999px;background:rgba(22,43,56,.08);overflow:hidden}.pheno-progress__track span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--pa-sage),var(--pa-gold));transition:width .25s ease}
.pheno-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}.pheno-group{--group-accent:var(--pa-navy);padding:clamp(22px,3vw,36px);border-top:4px solid var(--group-accent);background:rgba(251,250,246,.88)}.pheno-group--identity{--group-accent:var(--pa-gold);background:linear-gradient(145deg,#faf5e8,#f8f6ef)}.pheno-group--metabolic{--group-accent:var(--pa-sage);background:linear-gradient(145deg,#f2f6f3,#fbfaf6)}.pheno-group--blood{--group-accent:#a76464;background:linear-gradient(145deg,#fbf3f1,#fbfaf6)}
.pheno-group header{display:flex;gap:13px;align-items:flex-start;margin-bottom:22px}.pheno-group header>span{display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;border-radius:10px;color:white;background:var(--group-accent);box-shadow:0 7px 16px color-mix(in srgb,var(--group-accent) 22%,transparent);font:800 .68rem/1 "Work Sans",sans-serif}.pheno-group h2{margin:0;color:color-mix(in srgb,var(--group-accent) 76%,var(--pa-ink));font:600 clamp(1.5rem,2.5vw,2.15rem)/1 "Zodiak",Georgia,serif}.pheno-group header p{margin:7px 0 0;color:var(--pa-muted);font:400 .78rem/1.4 "Work Sans",sans-serif}
.pheno-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.pheno-fields--five{grid-template-columns:repeat(2,minmax(0,1fr))}.pheno-group--blood{grid-column:1/-1}.pheno-group--blood .pheno-fields--five{grid-template-columns:repeat(5,minmax(0,1fr))}
.pheno-field{position:relative;display:grid;gap:8px;padding:13px;border:1px solid rgba(22,43,56,.09);border-radius:15px;background:rgba(255,255,255,.76);transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}.pheno-field--wide{max-width:340px}.pheno-field__name{color:var(--pa-muted);font:750 .75rem/1.2 "Work Sans",sans-serif}
.pheno-field__control{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;height:46px;border:1px solid rgba(22,43,56,.16);border-radius:11px;background:white;overflow:hidden}.pheno-field input{width:100%;height:100%;box-sizing:border-box;border:0;outline:0;padding:0 11px;color:var(--pa-ink);background:transparent;font:700 .92rem/1 "Work Sans",sans-serif}.pheno-field select,.pheno-field b{height:100%;border:0;border-left:1px solid rgba(22,43,56,.1);color:var(--pa-muted);background:#f4f3ed;font:700 .68rem/1 "Work Sans",sans-serif}.pheno-field select{padding:0 9px}.pheno-field b{display:grid;place-items:center;padding:0 10px}.pheno-field small{color:var(--pa-muted);font:500 .66rem/1.25 "Work Sans",sans-serif}.pheno-field:focus-within{border-color:color-mix(in srgb,var(--group-accent) 55%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--group-accent) 10%,transparent)}.pheno-field.is-complete{border-color:color-mix(in srgb,var(--group-accent) 42%,transparent);background:color-mix(in srgb,var(--group-accent) 8%,white)}.pheno-field.is-complete .pheno-field__name{color:color-mix(in srgb,var(--group-accent) 82%,var(--pa-ink))}.pheno-field.is-complete::after{content:"✓";position:absolute;top:10px;right:10px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;color:white;background:var(--group-accent);font:800 .65rem/1 "Work Sans",sans-serif}
.pheno-error{grid-column:1/-1;margin:0;padding:13px 16px;border-radius:13px;color:#8a3030;background:#ffebeb;font:700 .8rem/1.4 "Work Sans",sans-serif}
.pheno-submit-row{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 22px;border-radius:20px;color:white;background:var(--pa-navy)}.pheno-submit-row div{display:grid;gap:4px}.pheno-submit-row strong{font:750 .9rem/1 "Work Sans",sans-serif}.pheno-submit-row div span{color:rgba(255,255,255,.6);font:500 .72rem/1.3 "Work Sans",sans-serif}.pheno-submit-row button{display:flex;align-items:center;gap:30px;padding:14px 17px;border:0;border-radius:12px;color:var(--pa-navy);background:#e8d5a8;cursor:pointer;font:800 .84rem/1 "Work Sans",sans-serif}.pheno-submit-row button:disabled{opacity:.6;cursor:wait}
.pheno-result{margin-top:14px;padding:clamp(28px,4vw,48px);border-top:5px solid var(--pa-gold);color:white;background:radial-gradient(circle at 92% 0,rgba(181,138,67,.18),transparent 24rem),linear-gradient(145deg,#244655,var(--pa-navy))}
.pheno-result__empty{max-width:720px}.pheno-result__empty>span{color:#e5c985;font:800 .68rem/1 "Work Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase}.pheno-result__empty h2{margin:12px 0 0;font:500 clamp(2rem,4vw,3.4rem)/1 "Zodiak",Georgia,serif}.pheno-result__empty p{max-width:700px;color:rgba(255,255,255,.65);font:400 .88rem/1.5 "Work Sans",sans-serif}
.pheno-result__headline{display:flex;align-items:end;justify-content:space-between;gap:20px;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.13)}.pheno-result__headline>span{color:#e5c985;font:800 .7rem/1 "Work Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase}.pheno-result__headline>strong{display:flex;align-items:baseline;gap:10px}.pheno-result__headline b{font:700 clamp(4rem,9vw,8rem)/.75 "Zodiak",Georgia,serif;letter-spacing:-.06em}.pheno-result__headline small{color:rgba(255,255,255,.6);font:700 1rem/1 "Work Sans",sans-serif}
.pheno-result__comparison{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.pheno-result__comparison div,.pheno-result__note,.pheno-result__caution{padding:17px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:rgba(255,255,255,.05)}.pheno-result__comparison span,.pheno-result__comparison strong{display:block}.pheno-result__comparison span{color:rgba(255,255,255,.55);font:650 .69rem/1 "Work Sans",sans-serif}.pheno-result__comparison strong{margin-top:9px;font:750 1.1rem/1.2 "Work Sans",sans-serif}.pheno-result__note,.pheno-result__caution{margin-top:10px}.pheno-result h3{margin:0;font:750 .86rem/1 "Work Sans",sans-serif}.pheno-result__note p,.pheno-result__caution p{margin:8px 0 0;color:rgba(255,255,255,.66);font:400 .82rem/1.48 "Work Sans",sans-serif}.pheno-result__caution{display:grid;grid-template-columns:70px 1fr;gap:12px;align-items:start}.pheno-result__caution>span{color:#e5c985;font:800 .68rem/1 "Work Sans",sans-serif;text-transform:uppercase}
.pheno-method{display:grid;grid-template-columns:minmax(220px,.55fr) minmax(0,1.45fr);gap:30px;margin-top:14px;padding:clamp(24px,3.5vw,40px);background:rgba(251,250,246,.86)}.pheno-method h2{margin:10px 0 0;font:600 clamp(1.8rem,3vw,2.7rem)/1 "Zodiak",Georgia,serif}.pheno-method p{margin:0;color:var(--pa-muted);font:400 .86rem/1.55 "Work Sans",sans-serif}.pheno-method p+p{margin-top:10px}.pheno-method a{display:inline-flex;margin-top:14px;color:var(--pa-navy);font:750 .78rem/1 "Work Sans",sans-serif}
.pheno-safety{display:grid;grid-template-columns:180px 1fr;gap:25px;margin:14px 0;padding:22px 26px;background:#ebe7dc}.pheno-safety strong{font:750 .82rem/1.3 "Work Sans",sans-serif}.pheno-safety p{margin:0;color:var(--pa-muted);font:400 .78rem/1.45 "Work Sans",sans-serif}
.pheno-footer{display:grid;grid-template-columns:minmax(180px,.8fr) auto;gap:18px;align-items:center;margin-bottom:14px;padding:22px 24px;border:1px solid var(--pa-line);border-radius:22px;background:rgba(251,250,246,.82)}.pheno-footer__brand{display:grid;gap:4px}.pheno-footer__brand strong{font:750 1.05rem/1 "Work Sans",sans-serif}.pheno-footer__brand span{color:var(--pa-muted);font:600 .7rem/1.2 "Work Sans",sans-serif}.pheno-footer nav{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:9px}.pheno-footer a{padding:9px 12px;border:1px solid var(--pa-line);border-radius:999px;color:var(--pa-navy);background:white;text-decoration:none;font:750 .72rem/1 "Work Sans",sans-serif}.pheno-footer>p{grid-column:1/-1;margin:0;padding-top:14px;border-top:1px solid var(--pa-line);color:var(--pa-muted);font:400 .7rem/1.4 "Work Sans",sans-serif}
@media(max-width:1100px){.pheno-group--blood .pheno-fields--five{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:900px){.pheno-hero,.pheno-form,.pheno-method{grid-template-columns:1fr}.pheno-hero__monogram>span{font-size:8rem}.pheno-submit-row{grid-column:1}.pheno-group--blood{grid-column:1}}
@media(max-width:620px){.pheno-shell{width:calc(100% - 16px);margin:8px auto}.pheno-topbar{padding:12px}.pheno-back{max-width:110px;text-align:center;line-height:1.25}.pheno-hero__copy,.pheno-hero__monogram,.pheno-progress,.pheno-group,.pheno-result,.pheno-method,.pheno-safety,.pheno-footer{border-radius:20px}.pheno-hero__copy,.pheno-group,.pheno-result,.pheno-method{padding:24px 20px}.pheno-fields,.pheno-fields--five,.pheno-result__comparison{grid-template-columns:1fr}.pheno-submit-row{align-items:stretch;flex-direction:column}.pheno-submit-row button{justify-content:space-between}.pheno-result__headline{align-items:start;flex-direction:column}.pheno-result__caution,.pheno-safety,.pheno-footer{grid-template-columns:1fr}.pheno-footer nav{justify-content:flex-start}.pheno-field--wide{max-width:none}}