/* A more spacious, tactile visual system for the app and customer page. */
:root{--ink:#1c2923;--muted:#69776e;--line:#e5eae4;--paper:#fff;--canvas:#f5f7f3;--shadow:0 12px 34px #17291a0b}
body{font-size:15px;color:#1c2923;letter-spacing:.002em;-webkit-font-smoothing:antialiased}
#app-shell:not([hidden]) .sidebar{width:278px;padding:27px 17px 17px;background:linear-gradient(180deg,#17271f,#1b3025 60%,#172920);border-right:1px solid #ffffff0a}
#app-shell:not([hidden]) .brand{padding-bottom:31px}
#app-shell:not([hidden]) .workspace-label{font-size:10px;letter-spacing:1.5px;color:#94a59a;padding-bottom:12px}
#app-shell:not([hidden]) .nav{gap:5px}
#app-shell:not([hidden]) .nav-item{min-height:48px;padding:7px 10px;gap:11px;border-radius:13px;font-size:13px;font-weight:600;color:#c5d0c7;transition:background .18s ease,transform .18s ease,color .18s ease}
#app-shell:not([hidden]) .nav-item:hover{transform:translateX(2px);background:#ffffff10;color:#fff}
#app-shell:not([hidden]) .nav-item.active{background:linear-gradient(110deg,#314b38,#263d2f);color:#eff9d9;box-shadow:inset 3px 0 var(--brand-accent,#c6ef65),0 7px 20px #0d1b1128}
#app-shell:not([hidden]) .nav-icon{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:11px;background:#ffffff10;font-size:18px;line-height:1}
#app-shell:not([hidden]) .nav-item.active .nav-icon{background:color-mix(in srgb,var(--brand-accent,#c6ef65) 23%,#ffffff08)}
#app-shell:not([hidden]) .nav-count{font-size:10px;padding:4px 8px;background:#ffffff15;color:#e7efe7}
#app-shell:not([hidden]) .help-card{border-radius:16px;padding:16px;background:linear-gradient(140deg,#20382a,#182920);border-color:#ffffff16}
#app-shell:not([hidden]) .help-card b{font-size:13px}#app-shell:not([hidden]) .help-card p{font-size:11px;line-height:1.55}#app-shell:not([hidden]) .help-card button{font-size:11px}
#app-shell:not([hidden]) .profile{padding-top:16px}
#app-shell:not([hidden]) .profile b{font-size:12px}#app-shell:not([hidden]) .profile small{font-size:10px}
#app-shell:not([hidden]) .topbar{height:74px;padding:0 clamp(22px,3.2vw,48px);background:#ffffffed;backdrop-filter:blur(16px)}
#app-shell:not([hidden]) .crumb{font-size:13px;gap:12px}#app-shell:not([hidden]) .today{font-size:12px}
#app-shell:not([hidden]) .page-wrap{max-width:1580px;padding:38px clamp(22px,3.2vw,48px) 34px;background:radial-gradient(ellipse at 100% 0%,#eef6e4 0%,transparent 34%),#f6f8f4}
#app-shell:not([hidden]) .page-header{align-items:flex-end;gap:22px;margin-bottom:29px}
#app-shell:not([hidden]) .page-header h1{font-size:clamp(29px,3vw,36px);line-height:1.12;letter-spacing:-1.15px;margin:8px 0 7px}
#app-shell:not([hidden]) .page-header p{max-width:720px;font-size:14px;line-height:1.6;color:#6b786f}
#app-shell:not([hidden]) .eyebrow{font-size:10px;letter-spacing:1.45px}
#app-shell:not([hidden]) .card{border-radius:19px;border-color:#e6ebe4;background:#fff;box-shadow:0 8px 28px #1d32200a}
#app-shell:not([hidden]) .card-head{padding:21px 23px 16px;gap:15px}
#app-shell:not([hidden]) .card-head h2{font-size:17px;letter-spacing:-.35px;margin-bottom:5px}
#app-shell:not([hidden]) .card-head p{font-size:12px;line-height:1.5}
#app-shell:not([hidden]) .button{min-height:43px;padding:10px 16px;border-radius:12px;font-size:12px;font-weight:700}
#app-shell:not([hidden]) .button-primary{background:var(--brand-accent,#c6ef65);color:var(--brand-accent-ink,#18241d);box-shadow:0 7px 18px var(--brand-accent-shadow,#c6ef6533)}
#app-shell:not([hidden]) .button-primary:hover{background:var(--brand-accent-mid,#aeda50);filter:none}
#app-shell:not([hidden]) .button-quiet{border-color:#e2e8e1;border-radius:12px;color:#435149}
#app-shell:not([hidden]) .text-link{font-size:12px;color:var(--brand-accent-tone,#52783b)}
#app-shell:not([hidden]) .stats{gap:17px;margin-bottom:19px}
#app-shell:not([hidden]) .stat-card{padding:21px;border-radius:18px}
#app-shell:not([hidden]) .stat-top{font-size:12px;gap:8px}
#app-shell:not([hidden]) .stat-icon{width:38px;height:38px;border-radius:13px;font-size:18px}
#app-shell:not([hidden]) .stat-value{font-size:31px;letter-spacing:-1px;margin:15px 0 5px}
#app-shell:not([hidden]) .stat-foot{font-size:11px}
#app-shell:not([hidden]) .tag{padding:6px 10px;border-radius:999px;font-size:10px}
#app-shell:not([hidden]) .event-row{padding:15px 0;gap:13px}
#app-shell:not([hidden]) .event-name{font-size:13px}#app-shell:not([hidden]) .event-sub{font-size:11px}
#app-shell:not([hidden]) .date-tile{width:47px;border-radius:12px;padding:8px 3px}
#app-shell:not([hidden]) .date-tile b{font-size:18px}#app-shell:not([hidden]) .date-tile small{font-size:9px}
#app-shell:not([hidden]) .check-row{font-size:12px;padding:10px 0}
#app-shell:not([hidden]) .check-box{width:20px;height:20px;border-radius:6px;font-size:12px}
#app-shell:not([hidden]) .safety-summary{padding:15px;border-radius:14px}
#app-shell:not([hidden]) .safety-summary b{font-size:12px}#app-shell:not([hidden]) .safety-summary small{font-size:11px;line-height:1.5}
#app-shell:not([hidden]) .page-wrap input:not([type=checkbox]):not([type=radio]):not([type=color]),#app-shell:not([hidden]) .page-wrap select,#app-shell:not([hidden]) .page-wrap textarea{min-height:45px;border-radius:12px;border-color:#dfe7df;padding:11px 13px;font:inherit;font-size:13px}
#app-shell:not([hidden]) .page-wrap textarea{line-height:1.6}
#app-shell:not([hidden]) .page-wrap label{font-size:13px;line-height:1.45}
#app-shell:not([hidden]) .page-wrap label small{font-size:11px;line-height:1.5}
#app-shell:not([hidden]) .data-table{font-size:12px}
#app-shell:not([hidden]) .data-table th{font-size:10px;letter-spacing:.6px;padding:12px 14px}
#app-shell:not([hidden]) .data-table td{padding:14px}
#app-shell:not([hidden]) .onboarding-card{border-radius:20px;padding:24px}
#app-shell:not([hidden]) .onboarding-card h2{font-size:21px}
#app-shell:not([hidden]) .onboarding-task{padding:15px 0}
#app-shell:not([hidden]) footer{padding-top:24px;font-size:11px;color:#8a958d}
.ai-hero,.ai-compose,.ai-context,.ai-answer-card,.recipe-form,.recipe-card{border-radius:20px}

/* The hygiene badge becomes a balanced companion to the cover copy. */
.public-site{background:linear-gradient(180deg,#f4f7ef,#fafbf8 380px);font-size:15px;-webkit-font-smoothing:antialiased}
.public-site .public-top{height:76px;padding-inline:max(calc((100vw - 1240px)/2),clamp(18px,4vw,54px));box-shadow:0 7px 25px #14251a1c}
.public-site .public-main{max-width:1240px;padding:30px clamp(18px,3vw,38px) 48px}
.public-site .public-hero{min-height:360px;display:flex;align-items:center;border-radius:28px;box-shadow:0 25px 60px #17291d26;background-size:cover;background-position:center}
.public-site .public-hero-inner{width:58%;padding:48px 52px;z-index:2}
.public-site .public-hero h1{font-size:clamp(38px,5vw,60px);letter-spacing:-2.2px;line-height:1.02;margin:17px 0 13px}
.public-site .public-hero p{font-size:16px;line-height:1.7;max-width:510px}
.public-site .public-hero-inner .public-fsa-sticker{position:absolute;left:calc(100% + clamp(36px,6vw,78px));top:50%;transform:translateY(-50%);width:min(325px,34vw);max-width:325px;margin:0;padding:17px;border-radius:20px;border-color:#ffffffbd;background:#fffffff2;box-shadow:0 18px 45px #0c1b1438;backdrop-filter:blur(14px);color:#1e2c23}
.public-site .public-fsa-sticker .fsa-sticker-icon{width:58px;height:58px;border-radius:16px;font-size:26px;background:linear-gradient(145deg,#477b4a,#326441)}
.public-site .public-fsa-sticker .fsa-sticker-copy{gap:5px}
.public-site .public-fsa-sticker .fsa-sticker-copy small{font-size:9px;letter-spacing:1px;color:#66766a}
.public-site .public-fsa-sticker .fsa-sticker-copy b{font-size:16px;color:#1d2c22}
.public-site .public-fsa-sticker .fsa-sticker-copy>span{font-size:11px;line-height:1.45;color:#68766d}
.public-site .public-fsa-sticker .fsa-sticker-link{font-size:10px;color:#486f3a}
.public-site .public-content{padding:38px 2px 8px}
.public-site .section-title{margin-bottom:18px}
.public-site .section-title h2{font-size:27px;letter-spacing:-.8px}
.public-site .section-note{font-size:12px}
.public-site .location-grid,.public-site .menu-list{gap:14px}
.public-site .location-card,.public-site .menu-card{padding:17px;border-radius:17px}
.public-site .location-info b{font-size:14px}.public-site .location-info small{font-size:11px}
.public-site .location-date{width:53px;height:56px;border-radius:14px}
.public-site .location-date b{font-size:20px}.public-site .location-date small{font-size:9px}
.public-site .menu-card h3{font-size:16px}.public-site .menu-category{font-size:9px}
.public-site .public-order-card{padding:28px;border-radius:22px}
@media(max-width:900px) and (min-width:761px){.public-site .public-hero-inner{width:60%;padding:38px}.public-site .public-hero-inner .public-fsa-sticker{left:calc(100% + 24px);width:min(275px,32vw);padding:14px}.public-site .public-fsa-sticker .fsa-sticker-icon{width:48px;height:48px}}
@media(max-width:760px){#app-shell:not([hidden]) .sidebar{width:280px}#app-shell:not([hidden]) .topbar{height:65px;padding:0 16px}#app-shell:not([hidden]) .page-wrap{padding:25px 16px 25px}#app-shell:not([hidden]) .page-header{align-items:flex-start;flex-direction:column;gap:14px;margin-bottom:21px}#app-shell:not([hidden]) .page-header h1{font-size:29px}#app-shell:not([hidden]) .header-actions{flex-wrap:wrap}#app-shell:not([hidden]) .stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}#app-shell:not([hidden]) .stat-card{padding:16px}#app-shell:not([hidden]) .stat-value{font-size:26px}#app-shell:not([hidden]) .card-head{padding:18px 17px 13px}#app-shell:not([hidden]) .card-head h2{font-size:16px}#app-shell:not([hidden]) .content-grid{grid-template-columns:1fr}.public-site .public-top{height:65px;padding-inline:16px}.public-site .public-main{padding:16px 14px 32px}.public-site .public-hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;border-radius:22px;background-position:center}.public-site .public-hero-inner{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:26px 22px 18px}.public-site .public-hero h1{font-size:36px;letter-spacing:-1.3px;margin:13px 0 10px}.public-site .public-hero p{font-size:14px;line-height:1.65}.public-site .public-hero-inner .public-fsa-sticker{position:static;align-self:flex-end;transform:none;width:min(325px,100%);margin:18px 0 4px;padding:13px;border-radius:16px}.public-site .public-fsa-sticker .fsa-sticker-icon{width:46px;height:46px;border-radius:13px;font-size:22px}.public-site .public-fsa-sticker .fsa-sticker-copy b{font-size:14px}.public-site .public-hero .hero-art{display:none}.public-site .public-content{padding-top:29px}.public-site .section-title h2{font-size:22px}.public-site .section-note{font-size:10px}.public-site .location-grid,.public-site .menu-list{grid-template-columns:1fr}}
@media(max-width:420px){#app-shell:not([hidden]) .crumb{font-size:11px}#app-shell:not([hidden]) .top-actions{gap:8px}#app-shell:not([hidden]) .today{font-size:10px}#app-shell:not([hidden]) .stats{gap:9px}#app-shell:not([hidden]) .stat-top{font-size:10px}#app-shell:not([hidden]) .stat-icon{width:31px;height:31px}.public-site .public-hero-inner{padding-inline:18px}.public-site .public-fsa-sticker .fsa-sticker-link{display:none}}
@media(prefers-reduced-motion:reduce){#app-shell:not([hidden]) .nav-item,#app-shell:not([hidden]) .card,#app-shell:not([hidden]) .button{transition:none!important}}