/* Shared visual language with the original #eda calculator. Fonts are served locally. */
@import url('fonts.css');
:root{--paper:#F7F4EA;--paper2:#F0ECDE;--sand:#E7E3D5;--deep:#2C3623;--khaki:#4E5C39;--khaki2:#6E7C54;--ink:#1D2117;--muted:#5E6552;--line:#D8D3C0;--gold:#BC8320;--gold2:#DBA43A;--mono:'JetBrains Mono',ui-monospace,Consolas,monospace;font-family:'Onest',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;-webkit-font-smoothing:antialiased;line-height:1.55;background:radial-gradient(140% 70% at 50% 0,#f1ede0 0,transparent 55%),linear-gradient(180deg,var(--sand),#dfdacb);background-attachment:fixed}
h1,h2,h3{font-weight:700;letter-spacing:-.04em;line-height:1.05;text-wrap:balance}h1{font-size:clamp(38px,4.5vw,56px)}h2{font-size:28px}h3{font-size:19px}.heading-row p{font-size:15px;line-height:1.65;max-width:52ch}.eyebrow,.tag,.pill,.macro-label,.menu-day,.table th{font-family:var(--mono)}.eyebrow{font-size:10px;letter-spacing:.22em}.brand{font-weight:700}.brand small{font-family:var(--mono);font-size:8px;letter-spacing:.14em}.topline{margin-bottom:34px}.shell{min-height:100vh}.sidebar{height:100vh;background:rgba(247,244,234,.46);backdrop-filter:blur(18px)}.nav-button{font-weight:600;border-radius:18px;transition:transform .25s var(--ease),background .25s var(--ease),box-shadow .25s var(--ease)}.nav-button.active{background:linear-gradient(168deg,var(--khaki),var(--deep));box-shadow:inset 0 1px 0 #ffffff22,0 8px 22px #1c211722}.nav-button:hover:not(.active){transform:translateX(3px)}
.card{background:var(--paper);border:1px solid rgba(216,211,192,.55);border-radius:24px;box-shadow:0 1px 2px #1c21170a,0 5px 16px #1c21170d}.dark{position:relative;overflow:hidden;color:var(--paper);border-color:transparent;background:radial-gradient(230px 230px at 100% 0,rgba(219,164,58,.2),transparent 70%),linear-gradient(160deg,#3a4630,var(--deep));box-shadow:0 3px 8px #1c211724,0 22px 60px #1c21172b}.dark .eyebrow{color:var(--gold2)}.ring-label strong{font-size:44px;font-weight:700;letter-spacing:-.05em}.energy-side strong{font-size:38px;font-weight:700;letter-spacing:-.04em}.macro-value{font-size:23px;font-weight:600}.ring-value{stroke:var(--gold2)}.bar i{background:linear-gradient(90deg,var(--color),var(--gold2))}.weight-number{font-weight:700;letter-spacing:-.045em}
.btn{position:relative;overflow:hidden;isolation:isolate;border-radius:100px;min-height:50px;padding:14px 24px;font-size:14px;font-weight:600;background:linear-gradient(168deg,var(--khaki),var(--deep));box-shadow:inset 0 1px 0 #ffffff29,0 3px 8px #1c211729,0 12px 30px #1c211724;transition:transform .25s var(--ease),box-shadow .25s var(--ease)}.btn::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 32%,rgba(219,164,58,.3) 50%,transparent 68%);transform:translateX(-130%);transition:transform .85s var(--ease);pointer-events:none}.btn:hover::before{transform:translateX(130%)}.btn:hover{background:linear-gradient(168deg,var(--khaki),var(--deep));transform:translateY(-2px);box-shadow:inset 0 1px 0 #ffffff29,0 12px 30px #1c211733}.btn:active{transform:scale(.98)}.btn.secondary{background:var(--paper2);color:var(--deep);box-shadow:0 2px 8px #1c211710}.btn.gold{background:linear-gradient(150deg,#F4D89A,var(--gold2) 65%,var(--gold));color:#231705}.text-btn{font-weight:600;font-size:13px}.field input,.field select{background:var(--paper2);border-color:var(--line);border-radius:16px;padding:14px 16px}.tabs button{border-radius:100px;font-weight:600}.pill,.tag{background:var(--paper2);color:var(--khaki)}
.camera-card{background:var(--paper2);padding-top:24px}.camera-card .card-head{position:relative;z-index:1;flex-wrap:wrap}.camera-card .eyebrow{color:var(--deep)}.camera-illustration{position:relative;width:calc(100% + 52px);height:200px;margin:16px -26px 8px;background:linear-gradient(180deg,var(--paper2) 0,rgba(240,236,222,0) 20%,rgba(240,236,222,0) 48%,var(--paper2) 100%),url('site-food.webp') center 47%/cover no-repeat}.camera-illustration .ico{position:absolute;right:28px;bottom:20px;width:44px;height:44px;padding:10px;border-radius:50%;background:var(--deep);color:var(--paper);stroke-width:1.5;box-shadow:0 4px 18px #1c211726}.camera-illustration::after{display:none}.camera-card h2{font-size:32px;max-width:100%;letter-spacing:-.045em}.camera-card p{font-size:13px;line-height:1.65}.camera-card .fine{font-size:11px!important;color:var(--muted)}.recipe{background:var(--paper2);border-radius:18px}.food-info b{font-weight:600}.food-icon{background:var(--paper2)}.meal-title strong{font-weight:600}.notice{background:var(--paper2);border-radius:16px}.login{box-shadow:0 3px 8px #1c21171a,0 22px 60px #1c211722;background:var(--paper);border-radius:26px}.login h1{font-size:clamp(34px,5vw,46px)}
#view>.heading-row,#view>.card,#view>.summary-stats,#view>.columns>.stack>.card,#view>.saved-plan{animation:site-rise .55s var(--ease) both}#view>.columns>.stack>.card:nth-child(2){animation-delay:.08s}#view>.columns>.stack>.card:nth-child(3){animation-delay:.13s}#view>.columns>.right>.card:first-child{animation-delay:.06s}@keyframes site-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1100px){.camera-card h2{font-size:28px}.camera-illustration{height:180px}.stack.right{align-items:start}.sidebar{height:100vh}}
@media(max-width:650px){.sidebar{height:auto;background:rgba(247,244,234,.96)}.nav-button{font-size:10px;border-radius:14px}.nav-button:hover:not(.active){transform:none}.main{padding:24px 16px 114px}.topline .eyebrow{font-size:8px;letter-spacing:.12em}.status{font-size:9px}.heading-row p{font-size:14px}.card{padding:22px;border-radius:22px}.camera-illustration{width:calc(100% + 44px);margin-left:-22px;margin-right:-22px;height:210px}.camera-card h2{font-size:32px}.ring-label strong{font-size:36px}.energy-side strong{font-size:31px}.macro-value{font-size:20px}.eyebrow{letter-spacing:.16em}.tag{font-size:9px}.btn{padding:13px 20px}.login{padding:25px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(max-width:650px){.saved-plan>.card-head{flex-wrap:wrap;align-items:flex-start}.saved-plan>.card-head h2{flex-basis:100%;font-size:28px}.saved-plan>.card-head .text-btn{margin-left:auto}.card-head:has(#diary-date){flex-wrap:wrap}.card-head:has(#diary-date) h2{flex-basis:100%;font-size:26px}}
@media print{.card,.dark,.sidebar,.recipe{box-shadow:none!important;background:white!important;color:black!important}.camera-card{display:none!important}}

/* Photo notes follow the same form styling as the diary. */
.field textarea{font:inherit;color:inherit;width:100%;min-height:90px;resize:vertical;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.field textarea:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
