/* KENDİN YAP — mutfak ekranı (tablet/masaüstü öncelikli, telefonda da çalışır) */
:root{--zemin:#141210;--zemin2:#1d1a17;--kart:#262220;--cizgi:rgba(255,255,255,.09);--yazi:#f6f1ea;--yazi2:rgba(246,241,234,.62);--vurgu:#f5a524;--vurgu-yazi:#1a1206;--font:'Manrope',system-ui,sans-serif;--font-baslik:var(--font);--ok:#3ddc84;--ok-yazi:#06270f}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
html,body{margin:0;min-height:100%;background:var(--zemin);color:var(--yazi);font-family:var(--font)}
body{display:flex;flex-direction:column;min-height:100vh}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
button:focus-visible{outline:2px solid var(--vurgu);outline-offset:3px}
.m-ust{display:flex;align-items:center;gap:16px;padding:12px 20px;border-bottom:1px solid var(--cizgi);background:var(--zemin2);position:sticky;top:0;z-index:5;flex-wrap:wrap}
.m-marka{display:flex;flex-direction:column;line-height:1.1;margin-right:auto}
.m-marka b{font-family:var(--font-baslik);font-size:20px;font-weight:700}
.m-marka span{font-size:12.5px;color:var(--yazi2);margin-top:2px}
.m-sekme{display:flex;gap:4px;padding:4px;background:var(--kart);border:1px solid var(--cizgi);border-radius:14px}
.m-sekme button{height:38px;padding:0 14px;border-radius:10px;font-weight:700;font-size:14px;color:var(--yazi2);display:flex;align-items:center;gap:8px;transition:background .2s,color .2s}
.m-sekme button i{font-style:normal;min-width:22px;height:22px;padding:0 6px;border-radius:11px;background:rgba(255,255,255,.1);font-size:12px;display:grid;place-items:center}
.m-sekme button[aria-pressed=true]{background:var(--vurgu);color:var(--vurgu-yazi)}
.m-sekme button[aria-pressed=true] i{background:rgba(0,0,0,.18)}
.m-sag{display:flex;align-items:center;gap:12px}
.m-saat{font-variant-numeric:tabular-nums;color:var(--yazi2);font-size:14px}
.m-ses{height:40px;padding:0 14px 0 12px;border-radius:12px;background:var(--kart);border:1px solid var(--cizgi);display:flex;align-items:center;gap:8px;font-weight:700;font-size:13.5px}
.m-ses svg{width:20px;height:20px}
.m-ses[aria-pressed=true]{background:var(--vurgu);color:var(--vurgu-yazi);border-color:transparent}
.m-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding:20px;align-content:start}
.m-bos{margin:auto;text-align:center;color:var(--yazi2);display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 20px}
.m-bos svg{width:48px;height:48px;opacity:.5}
.m-bos b{color:var(--yazi);font-size:18px}
.m-bos span{font-size:14px;max-width:320px}
.m-kart{background:var(--kart);border:1px solid var(--cizgi);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);animation:kart-gel .45s cubic-bezier(.2,1.2,.3,1)}
.m-kart.yeni-geldi{animation:kart-gel .45s cubic-bezier(.2,1.2,.3,1),vurgu-yanip 1.6s .2s 2}
@keyframes kart-gel{from{transform:translateY(-18px) scale(.96);opacity:0}to{transform:none;opacity:1}}
@keyframes vurgu-yanip{0%,100%{box-shadow:0 10px 30px rgba(0,0,0,.25)}50%{box-shadow:0 0 0 3px var(--vurgu),0 10px 30px rgba(0,0,0,.25)}}
.m-kart header{display:flex;align-items:center;gap:10px}
.m-kart .no{font-family:var(--font-baslik);font-size:22px;font-weight:800}
.m-kart .nereye{padding:4px 10px;border-radius:999px;background:var(--vurgu);color:var(--vurgu-yazi);font-size:12.5px;font-weight:800}
.m-kart .nereye.gelal{background:#6cc3ff;color:#06212f}
.m-kart .sure{margin-left:auto;color:var(--yazi2);font-size:13px;font-variant-numeric:tabular-nums}
.m-kart .sure.gec{color:#ff7b6b;font-weight:700}
.m-kart .urun{font-weight:800;font-size:16px}
.m-kart .satirlar{list-style:none;margin:0;padding:0 0 0 2px;display:flex;flex-direction:column;gap:3px;font-size:14.5px}
.m-kart .satirlar li::before{content:'·';color:var(--vurgu);margin-right:8px;font-weight:900}
.m-kart .satirlar li.secenek{color:var(--yazi2)}
.m-kart .not{margin:0;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.06);font-size:13.5px;color:var(--yazi2)}
.m-kart .not::before{content:'Not: ';color:var(--yazi);font-weight:700}
.m-kart footer{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:8px;border-top:1px solid var(--cizgi)}
.m-kart .toplam{font-weight:800;font-size:17px;font-variant-numeric:tabular-nums}
.m-kart .dugmeler{margin-left:auto;display:flex;gap:8px}
.m-kart .dugmeler button{height:42px;padding:0 16px;border-radius:12px;font-weight:800;font-size:14.5px;transition:transform .15s}
.m-kart .dugmeler button:active{transform:scale(.96)}
.m-kart .dugmeler .ana{background:var(--vurgu);color:var(--vurgu-yazi)}
.m-kart .dugmeler .ok{background:var(--ok);color:var(--ok-yazi)}
.m-kart .dugmeler .ikincil{background:rgba(255,255,255,.08);color:var(--yazi2)}
.m-kart.gidiyor{animation:kart-git .3s forwards}
@keyframes kart-git{to{transform:scale(.94);opacity:0}}
@media (max-width:640px){.m-ust{padding:10px 14px;gap:10px}.m-sekme{order:3;width:100%;justify-content:space-between}.m-sekme button{flex:1;justify-content:center;padding:0 8px;font-size:13px}.m-liste{padding:14px;grid-template-columns:1fr}.m-ses span{display:none}.m-ses{padding:0 10px}.m-saat{display:none}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}