/* Mockup-faithful structure: persistent navigation + photographic dashboard */
:root{--hq-rail:156px}body{background:#faf9f6}header{position:fixed;left:0;top:0;bottom:0;width:var(--hq-rail);z-index:30;background:#fff;border-right:1px solid #e6e8e0;border-bottom:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:21px 10px;box-shadow:3px 0 20px #13251b08}header .logo{font-size:17px;line-height:1.15;text-align:center;letter-spacing:-.6px;padding:12px 3px 23px;border-bottom:1px solid #e8e8e1}header .logo small{display:block;font-size:10px;margin-top:5px}header #status{margin-top:auto;text-align:center;white-space:normal;font-size:10px;padding:8px 4px}main{max-width:none;margin:0 0 0 var(--hq-rail);padding:0 19px 28px}.tabs{position:fixed;left:10px;top:130px;width:calc(var(--hq-rail) - 20px);z-index:35;display:flex;flex-direction:column;align-items:stretch;overflow:visible;gap:4px;margin:0;padding:0}.tabs button{background:transparent;border:0;border-radius:9px;text-align:left;padding:12px 12px;font-size:12px;font-weight:750;white-space:normal}.tabs button.active{background:#365c40;color:#fff}.tabs button:before{content:'◦';display:inline-block;width:22px;font-size:17px;vertical-align:middle;font-weight:400}.tabs button[data-tab=home]:before{content:'⌂'}.tabs button[data-tab=recipes]:before{content:'♧'}.tabs button[data-tab=kitchen]:before{content:'▤'}.tabs button[data-tab=shopping]:before{content:'🛒';font-size:14px}.tabs button[data-tab=ideas]:before{content:'✧'}.tabs button[data-tab=household]:before{content:'▣'}.hero{border-radius:0 0 22px 22px;margin:0 -19px 17px;padding:43px 36px 30px;min-height:218px;background:linear-gradient(90deg,rgba(15,37,25,.96) 0%,rgba(15,37,25,.75) 43%,rgba(15,37,25,.12) 100%),url('/images/hero-food.jpg') center/cover}.hero h1{font-size:clamp(31px,3.5vw,48px);margin:6px 0;letter-spacing:-1.6px}.hero p{margin:0;color:#e5e9df}.hero .tag{background:transparent;padding:0;font-size:11px;letter-spacing:1.2px}.hq-search{position:relative;z-index:1;margin-top:-85px;margin-left:36px;width:min(530px,calc(100% - 70px));height:45px;border-radius:30px;box-shadow:0 6px 22px #0002;margin-bottom:43px}.hq-quick{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;margin-bottom:17px}.hq-quick button{border-radius:17px;min-height:134px;text-align:center;box-shadow:0 4px 14px #0000000b}.hq-quick img{height:80px;width:calc(100% - 12px);margin:6px;border-radius:12px;object-fit:cover}.hq-quick span{padding:4px 6px 10px;font-size:12px}.hq-grid{grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:14px;align-items:start}.hq-panel{border-radius:17px;padding:17px}.hq-panel h2{font-size:21px}.hq-panel p{font-size:12px;margin:3px 0 13px}.hq-recipe-grid{grid-template-columns:1.4fr 1fr;grid-template-rows:repeat(2,128px);gap:9px}.hq-recipe{min-height:0;border-radius:13px}.hq-recipe:first-child{grid-row:span 2}.hq-recipe:first-child strong{font-size:20px}.hq-recipe:not(:first-child) strong{font-size:14px}.hq-recipe .hq-copy{padding:12px}.hq-meal-tabs{margin-bottom:10px}.hq-meal-tabs button{padding:5px 9px}.hq-alert{background:#fff6f5}.hq-alert .hq-chip{border:0;background:#fff;padding:5px 7px}.hq-stack{gap:13px}.hq-bottom{gap:10px}.hq-bottom button{min-height:118px}.hq-chips{gap:6px}.hq-chip{font-size:11px;padding:6px 8px}.hq-panel .hq-head button{font-size:11px}.hq-wide{grid-column:1/-1}#notice{font-size:11px;opacity:.8}@media(max-width:1100px){:root{--hq-rail:136px}.hq-grid{grid-template-columns:1fr}.hq-stack{grid-row:auto}.hq-quick{grid-template-columns:repeat(3,1fr)}.hq-recipe-grid{grid-template-rows:repeat(2,140px)}}@media(max-width:650px){:root{--hq-rail:0px}header{position:relative;width:auto;height:auto;flex-direction:row;padding:10px 14px}header .logo{border:0;padding:0;text-align:left}header #status{margin:0 0 0 auto}.tabs{position:relative;top:auto;left:auto;width:auto;flex-direction:row;overflow-x:auto;margin:10px 0;padding:0 0 5px}.tabs button{white-space:nowrap;padding:9px}.tabs button:before{display:none}main{margin:0;padding:0 12px 25px}.hero{margin:0 -12px 16px;padding:30px 22px 75px;min-height:215px}.hq-search{margin:-76px 10px 32px;width:calc(100% - 20px)}.hq-quick{grid-template-columns:repeat(3,1fr)}.hq-recipe-grid{grid-template-columns:1fr 1fr;grid-template-rows:repeat(2,145px)}.hq-recipe:first-child{grid-row:span 2}.hq-recipe:first-child strong{font-size:17px}.hq-bottom{grid-template-columns:repeat(2,1fr)}}