:root{--ink:#24352f;--muted:#74817c;--paper:#f8f6f0;--card:#fff;--line:#e7e6df;--sage:#dce9df;--green:#4d8267;--yellow:#d9a631;--red:#c96a5d;--shadow:0 18px 45px rgba(40,57,49,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif}.shell{max-width:1260px;margin:auto;padding:0 38px 70px}.topbar{height:92px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:42px}.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font:800 20px Manrope}.brand-mark{display:grid;place-items:center;width:35px;height:35px;border-radius:11px;background:var(--ink);color:#f6d86f;font-size:20px}.nav{display:flex;gap:30px;margin-right:auto}.nav-link{border:0;background:none;color:#88918d;font:600 14px inherit;padding:35px 0;cursor:pointer}.nav-link.active{color:var(--ink);box-shadow:inset 0 -2px var(--ink)}.button{border:0;border-radius:12px;padding:13px 19px;font:700 14px "DM Sans";cursor:pointer;transition:.2s transform,.2s box-shadow}.button:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(36,53,47,.13)}.primary{background:var(--ink);color:#fff}.compact{padding:12px 17px}.secondary{background:#fff;color:var(--ink);border:1px solid var(--line)}
.hero{min-height:330px;display:flex;align-items:center;justify-content:space-between;padding:52px 7% 38px}.eyebrow{font:700 11px Manrope;letter-spacing:.18em;color:#75917e;margin:0 0 14px}.hero h1{font:700 clamp(37px,5vw,57px)/1.06 Manrope;margin:0;letter-spacing:-.045em}.hero-copy{color:var(--muted);font-size:16px;margin:22px 0 0}.hero-orbit{position:relative;width:310px;height:230px;margin-right:7%}.orbit{position:absolute;border:1px solid #d9dfd5;border-radius:50%;inset:30px 0;transform:rotate(-14deg)}.orbit-two{inset:0 55px;transform:rotate(52deg)}.food{position:absolute;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#fff;box-shadow:var(--shadow);font-size:29px}.f1{left:8px;top:85px}.f2{right:24px;top:15px}.f3{right:0;bottom:12px}.f4{left:115px;bottom:0}.center-spark{position:absolute;left:145px;top:92px;font-size:38px;color:#efc75e}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:68px}.stat-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:20px;display:flex;align-items:center;gap:15px}.stat-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:800;background:#edf0ed}.stat-card.green .stat-icon{background:#e5f1e8;color:var(--green)}.stat-card.yellow .stat-icon{background:#f8efd8;color:var(--yellow)}.stat-card.red .stat-icon{background:#f7e5e2;color:var(--red)}.stat-card strong{font:800 25px Manrope;display:block}.stat-card span{font-size:12px;color:var(--muted)}
.library{background:#fff;border-radius:20px;padding:30px;box-shadow:0 4px 30px rgba(40,57,49,.04)}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:28px}.section-heading h2{font:700 27px Manrope;margin:0;letter-spacing:-.03em}.toolbar{display:flex;gap:10px;margin-bottom:20px}.search{height:44px;min-width:250px;flex:1;border:1px solid var(--line);border-radius:11px;display:flex;align-items:center;gap:9px;padding:0 13px;color:#8d9792}.search input{border:0;outline:0;width:100%;font:14px inherit}.filter-group{display:flex;padding:4px;background:#f4f4ef;border-radius:11px}.filter{border:0;background:transparent;border-radius:8px;padding:8px 12px;font:600 12px inherit;color:#6f7b76;cursor:pointer}.filter.active{background:#fff;color:var(--ink);box-shadow:0 2px 7px rgba(30,45,38,.08)}.dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:4px}.green-dot{background:var(--green)}.yellow-dot{background:var(--yellow)}.red-dot{background:var(--red)}select{font:500 13px inherit;color:var(--ink);border:1px solid var(--line);background:#fff;border-radius:11px;padding:0 34px 0 13px}.list-head,.food-row{display:grid;grid-template-columns:1.35fr .9fr .9fr 1.5fr 34px;gap:16px;align-items:center}.list-head{padding:0 15px 10px;color:#9aa19e;font:700 10px Manrope;text-transform:uppercase;letter-spacing:.08em}.food-row{min-height:74px;border-top:1px solid #efefea;padding:11px 15px}.food-title{font-weight:700}.category{color:var(--muted);font-size:13px}.badge{width:max-content;border-radius:30px;padding:7px 10px;font-size:11px;font-weight:700}.badge.green{background:#e5f1e8;color:#44745d}.badge.yellow{background:#fbf0d3;color:#98721b}.badge.red{background:#f8e5e2;color:#a84f43}.note{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.delete{border:0;background:transparent;color:#adb3b0;font-size:18px;cursor:pointer;border-radius:7px;padding:4px}.delete:hover{background:#fae9e6;color:var(--red)}.empty-state{text-align:center;padding:55px;color:var(--muted)}.empty-state span{font-size:34px}.empty-state h3{color:var(--ink);margin:9px 0 5px}.empty-state p{font-size:13px;margin:0}
dialog{border:0;border-radius:20px;padding:0;box-shadow:0 30px 90px rgba(25,37,32,.25);width:min(520px,calc(100% - 30px));color:var(--ink)}dialog::backdrop{background:rgba(29,42,36,.45);backdrop-filter:blur(3px)}dialog form{padding:34px;position:relative}dialog h2{font:700 27px Manrope;margin:0}.modal-copy{font-size:13px;color:var(--muted);margin:8px 0 25px}.close{position:absolute;right:20px;top:17px;border:0;background:#f2f2ed;width:31px;height:31px;border-radius:50%;font-size:20px;color:#6c7772;cursor:pointer}form>label{display:block;font-size:12px;font-weight:700;margin:15px 0}form input:not([type=radio]),form select,textarea{display:block;width:100%;height:44px;margin-top:7px;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font:14px inherit;outline:none}form input:focus,form select:focus,textarea:focus{border-color:#8ba494;box-shadow:0 0 0 3px #e9f0eb}textarea{height:72px;resize:vertical}small{color:#9ca39f;font-weight:400}fieldset{border:0;padding:0;margin:18px 0}legend{font-size:12px;font-weight:700;margin-bottom:8px}.rating-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.rating{position:relative;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid var(--line);border-radius:11px;padding:12px;cursor:pointer;font-size:12px}.rating input{position:absolute;opacity:0}.rating:has(input:checked).green{border-color:var(--green);background:#edf6ef}.rating:has(input:checked).yellow{border-color:var(--yellow);background:#fcf4df}.rating:has(input:checked).red{border-color:var(--red);background:#fbecea}.submit{width:100%;margin-top:6px;height:47px}#toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,120px);background:var(--ink);color:#fff;padding:12px 20px;border-radius:10px;font-size:13px;transition:.3s;z-index:3}#toast.show{transform:translate(-50%,0)}
@media(max-width:850px){.nav{display:none}.hero{padding-left:1%;padding-right:1%}.hero-orbit{transform:scale(.8);margin-right:-20px}.stats{grid-template-columns:repeat(2,1fr)}.toolbar{flex-wrap:wrap}.filter-group{order:3;width:100%;overflow:auto}.list-head{display:none}.food-row{grid-template-columns:1fr auto 30px}.food-row .category{grid-row:2}.note{display:none}.badge{grid-column:2;grid-row:1/3}.delete{grid-column:3;grid-row:1/3}}
@media(max-width:580px){.shell{padding:0 16px 45px}.topbar{height:73px}.compact{font-size:0;margin-left:auto}.compact span{font-size:18px}.hero{min-height:300px;padding:42px 4px}.hero h1{font-size:38px}.hero-orbit{display:none}.stats{gap:8px;margin-bottom:42px}.stat-card{padding:14px 12px;gap:10px}.stat-icon{width:36px;height:36px}.stat-card strong{font-size:20px}.library{padding:21px 15px}.section-heading .secondary{display:none}.toolbar select{height:44px;flex:1}.search{min-width:100%}.filter{padding:8px 10px}.food-row{padding-left:5px;padding-right:5px}dialog form{padding:28px 20px}.rating{padding:10px 4px}.rating-options{gap:5px}}

/* Status icons and row editing */
.stat-icon img{width:23px;height:23px}.filter{display:flex;align-items:center;gap:5px}.filter img{width:13px;height:13px}.badge{display:flex;align-items:center;gap:6px}.badge img{width:16px;height:16px}.rating img{width:20px;height:20px}.list-head,.food-row{grid-template-columns:1.35fr .9fr .9fr 1.5fr 72px}.row-actions{display:flex;gap:3px}.edit,.delete{border:0;background:transparent;color:#8e9994;font-size:16px;cursor:pointer;border-radius:7px;padding:5px 7px}.edit:hover{background:#eaf2ed;color:var(--green)}
@media(max-width:850px){.food-row{grid-template-columns:1fr auto 70px}.row-actions{grid-column:3;grid-row:1/3}}

/* Untested foods and editable categories */
.stats{grid-template-columns:repeat(5,1fr)}.stat-card.untested .stat-icon{background:#e9ecf3}.badge.untested{background:#eceef4;color:#667087}.section-actions{display:flex;gap:8px}.ghost{background:transparent;color:var(--muted);border:1px solid transparent}.rating-options{grid-template-columns:repeat(4,1fr)}.rating:has(input:checked).untested{border-color:#7c879f;background:#f0f1f6}.category-list{display:grid;gap:8px;max-height:320px;overflow:auto;margin:18px 0}.category-item{display:flex;align-items:center;gap:9px}.category-item img{width:15px;opacity:.5}.category-item input{margin:0!important}.add-category{display:flex;gap:8px;margin:16px 0 10px}.add-category input{margin:0!important;flex:1}.add-category .button{white-space:nowrap}
@media(max-width:1050px){.stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.stats{grid-template-columns:repeat(2,1fr)}.section-actions .ghost{font-size:0}.section-actions .ghost::first-letter{font-size:15px}.rating-options{grid-template-columns:repeat(2,1fr)}}

.backup-panel{border-top:1px solid var(--line);margin-top:22px;padding-top:20px}.backup-panel>div:first-child{display:flex;flex-direction:column;gap:3px}.backup-panel strong{font-size:13px}.backup-panel span{font-size:11px;color:var(--muted)}.backup-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.import-button{display:inline-flex;align-items:center;justify-content:center}.import-button input{display:none!important}

/* Account, cloud sync and authentication */
.account-area{display:flex;align-items:center;gap:10px}.account-area #sync-status{font-size:11px;color:var(--muted);white-space:nowrap}.account-button{border:0;background:#ecece6;color:var(--muted);width:34px;height:34px;border-radius:10px;cursor:pointer;font-size:17px}.auth-screen{position:fixed;inset:0;z-index:20;background:linear-gradient(145deg,#f7f5ef 20%,#e1ebe3);display:grid;place-items:center;padding:20px}.auth-screen[hidden]{display:none}.auth-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow);padding:38px}.auth-card .brand-mark{margin-bottom:28px}.auth-card h1{font:700 31px/1.12 Manrope;margin:0;letter-spacing:-.04em}.auth-card>p:not(.eyebrow):not(.auth-message){font-size:13px;color:var(--muted);line-height:1.5;margin:13px 0 24px}.auth-submit{width:100%;height:46px;margin-top:6px}.auth-link{border:0;background:none;color:var(--green);font:600 12px inherit;width:100%;padding:14px;cursor:pointer}.auth-message{min-height:18px;text-align:center;color:var(--red);font-size:12px;margin:0}.syncing{color:var(--yellow)!important}.synced{color:var(--green)!important}
@media(max-width:580px){.account-area #sync-status{display:none}.account-button{display:none}.auth-card{padding:30px 22px}.topbar{gap:8px}}