.city-hotspot-kitchen { left:90%; top:45.5%; }
.city-hotspot-farm { left:91%; top:64%; }
.food-page { display:flex; flex-direction:column; background:radial-gradient(ellipse at 50% 20%,#44503a 0%,#28291f 48%,#181915 100%); }
.kitchen-page { background:radial-gradient(ellipse at 50% 25%,#62452d 0%,#352a22 50%,#1a1715 100%); }
.food-page .partners-header { height:104px; flex:0 0 104px; }
.food-page-content { flex:1; overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; touch-action:pan-y; padding:16px 24px 136px; min-height:0; }
.food-page button:disabled { opacity:.42; cursor:default; }
.food-primary,.food-secondary { padding:12px 20px; border:1px solid #b28b49; border-radius:8px; color:#ffe9b5; font-family:inherit; font-size:19px; font-weight:700; line-height:1.2; background:linear-gradient(#6d512e,#352c20); white-space:nowrap; }
.food-secondary { background:#27271f; }
.food-page-actions { display:flex; justify-content:center; gap:12px; margin-top:24px; }
.food-page-actions .food-primary { min-width:200px; }
.farm-play-actions { margin:14px 0; }
.food-page .fullscreen-footer { gap:12px; }
.food-page .fullscreen-footer button:not(.fullscreen-back) { text-overflow:clip; }
.food-icon { width:64px; height:64px; flex:0 0 auto; object-fit:contain; filter:drop-shadow(0 3px 2px #0005); }
.food-summary-bar,.farm-play-info { display:flex; justify-content:space-between; gap:12px; font-size:18px; color:#e8d5a4; }
.farm-progress { flex:0 0 auto; padding:0 24px; }
.farm-progress .food-summary-bar { justify-content:flex-end; }
.food-xp-track { position:relative; height:28px; margin:12px 0 24px; background:#131611; border:1px solid #757447; border-radius:6px; overflow:hidden; }
.food-xp-track span { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff0c7; font-size:18px; font-weight:700; line-height:1; text-shadow:0 1px 2px #000,0 0 3px #000; white-space:nowrap; }
.food-xp-track i { display:block; height:100%; background:linear-gradient(90deg,#678e48,#b8ca77); }
.farm-welcome { text-align:center; padding:32px 12px; border:1px solid #a8a36c66; border-radius:14px; background:#24291bb3; }
.farm-welcome-art { display:flex; justify-content:center; gap:18px; margin:20px 0; }
.farm-welcome-art .food-icon { width:100px; height:100px; }
.farm-welcome h2,.kitchen-worktop h2 { color:#f7dda7; font-size:26px; }
.farm-welcome p { margin:16px 0; color:#bfc2a5; }
.farm-info-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:20px; }
.farm-info-grid span { color:#b9bc9b; }
.farm-info-grid b { display:block; font-size:24px; color:#f4d895; margin-top:8px; }
.food-rule { color:#c1b797; font-size:17px; line-height:1.65; margin:16px 0; }
.farm-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.farm-stat { padding:10px 12px; border:1px solid #9b966666; border-radius:10px; background:#162016aa; text-align:center; }
.farm-stat span { color:#c4c6a7; font-size:16px; white-space:nowrap; }
.farm-stat b { display:block; color:#f7e6b8; font-size:28px; line-height:1.25; margin-top:4px; }
.farm-stat.is-warning b { color:#ff6b6b; animation:farm-time-blink .8s infinite; }
.farm-stat-combo.is-popping b { animation:farm-combo-pop .35s ease; color:#ffe080; }
.farm-time-track { height:7px; margin:12px 0; background:#111a12; border-radius:5px; overflow:hidden; }
.farm-time-track i { display:block; height:100%; background:linear-gradient(90deg,#76b785,#c2e3b5); transition:width .2s linear; }
.farm-time-track.is-warning i { background:#ff6b6b; }
.farm-board-wrap { position:relative; margin:14px 0 18px; padding:calc(100% / var(--farm-outer-cols)); border-radius:14px; background:#121c1288; }
.farm-board { position:relative; display:grid; grid-template-columns:repeat(var(--farm-cols),minmax(0,1fr)); gap:6px; }
.farm-tile { position:relative; aspect-ratio:1; min-width:0; padding:3px; border:1px solid #d5dfed; border-radius:9px; background:linear-gradient(160deg,#fff,#e6edfb 55%,#cfdcf2); box-shadow:inset 0 -2px 0 #0002,0 3px 8px #0005; display:grid; place-items:center; transition:transform .16s ease,opacity .22s ease,box-shadow .16s ease,filter .16s; touch-action:manipulation; }
.farm-tile .food-icon { width:90%; height:90%; min-height:0; pointer-events:none; }
.farm-tile.is-empty { visibility:hidden; }
@media(hover:hover) { .farm-tile:not(:disabled):hover { transform:scale(1.06); } }
.farm-tile.is-selected { z-index:6; transform:scale(1.08); border-color:#ffd54f; box-shadow:0 0 0 3px #ffd54f,0 0 20px #ffd54fe6; background:linear-gradient(160deg,#fff8dd,#ffe7a3 60%,#ffd166); }
.farm-tile.is-hint { border-color:#6ee7ff; animation:farm-hint-pulse .55s ease-in-out 4; }
.farm-tile.is-shaking { border-color:#ff7973; animation:farm-tile-shake .3s ease; }
.farm-tile.is-matched { z-index:1; transform:scale(.22); opacity:0; filter:brightness(1.8); pointer-events:none; }
.farm-tile:disabled:not(.is-empty) { opacity:1; }
.farm-tile.is-matched:disabled { opacity:0; }
.farm-link-layer { position:absolute; z-index:20; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; transition:opacity .25s ease; }
.farm-link-layer.is-fading { opacity:0; }
.farm-path { fill:none; stroke:#ffd54f; stroke-width:5px; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 6px #ffab00) drop-shadow(0 0 14px #ffab00b3); stroke-dasharray:1; animation:farm-path-draw .16s ease-out both; }
.farm-path-dot { fill:#fff3c4; filter:drop-shadow(0 0 6px #ffd54f); }
.farm-match-feedback { position:absolute; z-index:21; top:36%; left:50%; display:flex; align-items:center; gap:8px; padding:8px 14px; color:#fff0b5; background:#172117e6; border:1px solid #e1ba63; border-radius:9px; transform:translate(-50%,0); opacity:0; pointer-events:none; white-space:nowrap; font-size:18px; }
.farm-match-feedback .food-icon { width:40px; height:40px; }
.farm-match-feedback.is-popping { animation:farm-harvest-pop .65s ease both; }
.farm-board.is-shuffling { animation:farm-shuffle-in .3s ease; }
.farm-status { color:#b7ebd9; text-align:center; margin-bottom:10px; font-size:16px; }
.farm-status:empty { display:none; }
@keyframes farm-path-draw { from{stroke-dashoffset:1}to{stroke-dashoffset:0} }
@keyframes farm-hint-pulse { 50%{box-shadow:0 0 0 4px #6ee7fff2,0 0 22px #6ee7ffe6} }
@keyframes farm-tile-shake { 25%{transform:translateX(5px)}75%{transform:translateX(-5px)} }
@keyframes farm-combo-pop { 40%{transform:scale(1.3)} }
@keyframes farm-harvest-pop { 0%{opacity:0;transform:translate(-50%,12px) scale(.8)}25%,65%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-18px) scale(1)} }
@keyframes farm-shuffle-in { from{opacity:.3;transform:scale(.95)}to{opacity:1;transform:none} }
@keyframes farm-time-blink { 50%{opacity:.35} }
.farm-harvest { display:flex; flex-wrap:wrap; gap:8px; color:#dfd3a1; font-size:16px; }
.farm-harvest span { background:#13191288; border-radius:6px; padding:6px 10px; }
.farm-result { margin-top:22px; padding:20px; border:1px solid #80774e; border-radius:12px; background:#151b12aa; }
.farm-result h3 { text-align:center; color:#e8d28f; margin-bottom:12px; }
.farm-result.is-completed { border-color:#efcf70; box-shadow:0 0 22px #dbbd5544; }
@media(prefers-reduced-motion:reduce) { .farm-page *, .farm-page *::before, .farm-page *::after { animation:none !important; transition:none !important; } }
.food-tabs { display:flex; flex:0 0 auto; gap:10px; margin:0 24px 8px; }
.food-tabs button { flex:1; border:1px solid #8d774e; border-radius:8px; background:#241e18; color:#c9b998; padding:12px 6px; font-size:19px; white-space:nowrap; }
.food-tabs button.active { background:#725230; color:#ffedbe; border-color:#d8b76f; }
.kitchen-worktop { text-align:center; padding:24px 14px; border:1px solid #bc996555; border-radius:14px; background:linear-gradient(#4b372bdd,#2a211bee); }
.kitchen-worktop-header { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:12px; }
.kitchen-worktop-header h2 { grid-column:2; }
.kitchen-worktop-header .food-secondary { justify-self:end; padding:8px 12px; font-size:17px; }
.kitchen-slots { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:24px 0; }
.kitchen-slot { aspect-ratio:1; border:2px solid #c7a16b; border-radius:10px; background:#241b13; color:#d6c39b; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:6px; min-width:0; padding:8px 3px; }
.kitchen-slot .food-icon { width:65%; height:auto; }
.kitchen-slot b { font-size:17px; white-space:nowrap; }
.kitchen-seasoning { border-color:#8da582; background:#20271c; }
.food-slot-plus { font-size:36px; line-height:1; color:#a98a59; }
.kitchen-pot .food-icon { width:180px; height:180px; }
.kitchen-preview { background:#21191277; padding:18px; border-radius:10px; }
.kitchen-preview h3 { color:#f1d18e; font-size:23px; margin-bottom:12px; }
.kitchen-preview p { color:#ccb995; font-size:18px; line-height:1.6; }
.kitchen-cost { color:#e1c592; margin-top:20px; min-height:24px; }
.food-error,.food-missing { color:#f3796e !important; }
.food-recipe-list { display:flex; flex-direction:column; gap:14px; }
.food-recipe-card { display:flex; align-items:center; gap:12px; padding:16px 12px; border:1px solid #997c4c; border-radius:10px; background:#30251cee; }
.food-recipe-card.is-locked { border-color:#5d5544; background:#24231e; }
.food-recipe-card.is-locked>.food-icon { opacity:.25; filter:grayscale(1); }
.food-recipe-copy { flex:1; min-width:0; }
.food-recipe-copy h3 { font-size:21px; color:#f3d39b; margin-bottom:10px; }
.food-recipe-copy p { color:#beb196; font-size:16px; line-height:1.55; margin-top:8px; }
.food-recipe-materials { display:flex; flex-wrap:wrap; gap:6px 10px; color:#d5c6a9; font-size:16px; }
.food-recipe-materials small { font-size:14px; }
.food-recipe-actions { display:flex; flex-direction:column; gap:8px; }
.food-recipe-actions button { padding:9px 12px; font-size:17px; border:1px solid #947344; border-radius:6px; color:#f0d8a4; background:#58422b; white-space:nowrap; }
.food-picker { position:absolute; inset:104px 18px 126px; z-index:10; background:#2f281f; border:2px solid #c6a474; border-radius:12px; padding:18px; display:flex; flex-direction:column; box-shadow:0 0 0 1000px #0008; }
.food-picker header { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; color:#eed6a9; }
.food-picker header button { background:none; border:0; color:#f3d9a5; font-size:32px; padding:0 10px; }
.food-picker-grid,.food-stock-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.food-picker-grid { flex:1; min-height:0; overflow:auto; padding:2px; margin-bottom:16px; align-content:start; }
.food-picker-grid>.food-material { aspect-ratio:1; width:100%; box-sizing:border-box; }
.food-material { border:1px solid #897149; border-radius:8px; background:#201c16; color:#d9c49d; padding:8px 4px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; min-width:0; }
.food-material .food-icon { width:54px; height:54px; }
.food-material b { font-size:17px; white-space:nowrap; }
.food-material span { font-size:16px; }
.food-material.is-rare,.farm-tile.is-rare { border-color:#d3a456; }
.food-stock-card { display:flex; gap:12px; padding:14px 10px; border:1px solid #89734d; border-radius:9px; background:#28241c; color:#e8cca0; margin-bottom:12px; align-items:center; }
.food-stock-card>div:not(.food-stock-actions) { flex:1; min-width:0; }
.food-stock-card b { font-size:20px; }
.food-stock-card small { display:block; font-size:16px; line-height:1.5; color:#bdae90; margin-top:6px; }
.food-stock-card button { border:1px solid #9c7c48; border-radius:6px; padding:8px 12px; background:#56432d; color:#f1d39b; font-size:17px; white-space:nowrap; }
.food-stock-actions { display:flex; flex-direction:column; align-items:center; gap:8px; }
.food-stock-actions em { font-style:normal; color:#ead8b5; }
.food-meal { border:1px solid #947b4a; color:#f0d697; border-radius:8px; padding:14px; margin-bottom:16px; font-size:18px; }
.food-inventory-panel h3,#kitchen-stock h3 { color:#e2ceaa; font-size:20px; margin:22px 0 14px; }
.food-equip-picker-buttons { display:flex; gap:10px; margin:10px 0; }
@media (max-width:420px) { .food-picker-grid,.food-stock-grid { gap:6px; } }

.food-footer-tabs { --cd-tabs-height:111px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.food-footer-tabs button { cursor:pointer; }
