@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Roboto+Condensed:wght@400;500;700&display=swap');

:root{
  --bg:#090303;
  --panel:#180806;
  --brick:#2a100d;
  --red:#b80f0f;
  --red2:#ff2a13;
  --orange:#ff6a00;
  --gold:#f4bd1a;
  --cream:#ffe7b0;
  --muted:#c7a995;
  --line:rgba(255,153,30,.5);
  --shadow:0 0 12px rgba(255,58,0,.45),0 0 35px rgba(255,129,0,.14);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;
  background:radial-gradient(circle at 50% 10%,#3a0c07 0,#120504 38%,#050202 100%);
  color:#fff;
  font-family:"Roboto Condensed",Arial,sans-serif;
  min-height:100vh;
}
button,input{font:inherit}
button{cursor:pointer}
.hidden{display:none!important}

.screen{min-height:100svh}
.splash-screen{
  display:grid;
  place-items:center;
  padding:12px;
  background:#050202;
}
.splash-frame{
  width:min(100%,480px);
  height:min(96svh,850px);
  position:relative;
  overflow:hidden;
  border:5px solid #d18a09;
  border-radius:34px;
  box-shadow:0 0 0 3px #5e2804 inset,0 0 28px #ff6b00,0 0 90px rgba(255,70,0,.3);
  background:#180504;
}
.splash-frame:before{
  content:"";
  position:absolute;inset:8px;
  border:2px solid #ffbe19;border-radius:27px;z-index:5;pointer-events:none;
  box-shadow:inset 0 0 12px rgba(255,178,0,.8);
}
.splash-photo{
  position:absolute;inset:0;
  background-image:url("assets/splash.jpg");
  background-size:cover;background-position:center;
  filter:saturate(1.18) contrast(1.08);
  transform:scale(1.01);
}
.splash-overlay{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,0,0,.15) 10%,rgba(20,0,0,.08) 45%,rgba(5,0,0,.72) 93%);
}
.splash-frame:after{
  content:"";
  position:absolute;inset:14px;
  border-radius:22px;
  background:
    radial-gradient(circle,#fffbd7 0 2px,#ffd21c 3px,transparent 7px) 0 0/48px 48px;
  opacity:.85;mix-blend-mode:screen;pointer-events:none;
  -webkit-mask:linear-gradient(#000 0 12px,transparent 12px calc(100% - 12px),#000 calc(100% - 12px));
  mask:linear-gradient(#000 0 12px,transparent 12px calc(100% - 12px),#000 calc(100% - 12px));
}
.splash-brand{
  position:absolute;top:10%;left:50%;transform:translateX(-50%) rotate(-4deg);
  width:90%;text-align:center;z-index:4;
  font-family:Impact,"Arial Black",sans-serif;
  font-size:clamp(60px,18vw,105px);
  line-height:.68;color:#050403;
  text-shadow:2px 2px 0 #ffdb55,0 0 10px #ff5d00;
  letter-spacing:-3px;
}
.splash-brand span{
  display:inline-block;font-size:.62em;letter-spacing:-2px;
  background:linear-gradient(#fff0a5,#ff9200 48%,#ff3a00);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  text-shadow:none;
}
.start-btn{
  position:absolute;z-index:6;bottom:7%;left:50%;transform:translateX(-50%);
  width:90%;padding:14px 10px;border:0;background:transparent;color:#ffdb63;
  font-family:Oswald,sans-serif;font-weight:600;font-size:clamp(20px,5vw,31px);
  letter-spacing:1px;text-shadow:0 0 7px #ff4a00,0 0 18px #ff4a00;
}
.start-lines{font-size:.8em;color:#ff3b13}
.start-btn:active{transform:translateX(-50%) scale(.98)}

.headlight-glow{
  position:absolute;bottom:33%;width:50px;height:50px;border-radius:50%;
  background:#fff7c8;filter:blur(7px);opacity:.05;z-index:3;
  animation:blink 1.8s infinite steps(2,end);
}
.headlight-glow.left{left:11%}.headlight-glow.right{left:48%}
@keyframes blink{0%,48%,100%{opacity:.05}50%,80%{opacity:.95}}

.app-screen{background:
  radial-gradient(circle at 50% -10%,rgba(255,74,0,.28),transparent 38%),
  repeating-linear-gradient(0deg,rgba(255,255,255,.015) 0 1px,transparent 1px 5px),
  #0b0302;
}
.topbar{
  min-height:62px;padding:10px 14px;display:flex;align-items:center;gap:10px;
  border-bottom:1px solid rgba(255,144,0,.45);
  background:rgba(10,2,2,.92);backdrop-filter:blur(12px);position:relative;z-index:30;
}
.topbar.sticky{position:sticky;top:0}
.icon-btn,.home-pill{
  width:40px;height:40px;border-radius:50%;border:1px solid var(--orange);
  color:#ff6b1a;background:#160403;box-shadow:var(--shadow);
}
.mini-logo{flex:1;text-align:center;font-family:Oswald,sans-serif;font-size:22px;letter-spacing:2px;color:#ffd86a}
.mini-logo b{font-size:25px;color:#fff2ae}
.langs{display:flex;gap:5px}
.langs button{
  border:1px solid #70400d;background:#160403;color:#bda98f;border-radius:8px;
  padding:6px 7px;font-size:12px;font-weight:700;
}
.langs button.active{color:#fff5c7;border-color:#ff8a00;box-shadow:0 0 10px rgba(255,93,0,.4)}

.home-main{max-width:650px;margin:auto;padding:28px 18px 70px;text-align:center}
.hero-title{font-family:Oswald,sans-serif;font-size:32px;letter-spacing:3px;margin:28px 0 24px}
.hero-title span{
  font-size:46px;color:#ff8c00;text-shadow:0 0 10px #ff3b00,0 0 24px rgba(255,120,0,.5);
}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.choice-card{
  min-height:190px;border:1px solid #ff6a00;border-radius:18px;
  background:linear-gradient(145deg,rgba(67,13,7,.92),rgba(15,3,3,.95));
  color:#fff1bf;box-shadow:var(--shadow);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;transition:.2s;
}
.choice-card:hover{transform:translateY(-3px);border-color:#ffc21a}
.choice-icon{font-size:42px;filter:drop-shadow(0 0 8px #ff4b00)}
.choice-title{font:600 29px Oswald,sans-serif;letter-spacing:2px;color:#ff8a00}
.choice-card small{color:#c5a896}
.car-strip{
  height:170px;margin:34px auto 0;max-width:570px;border-radius:22px;
  background:url("assets/splash.jpg") center bottom/cover no-repeat;
  border:1px solid rgba(255,142,0,.5);opacity:.82;box-shadow:var(--shadow);
}

.menu-main{max-width:760px;margin:auto;padding:20px 14px 100px}
.menu-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}
.eyebrow{font:600 12px Oswald,sans-serif;letter-spacing:3px;color:#b8906f}
h1{font:600 36px Oswald,sans-serif;letter-spacing:3px;margin:2px 0;color:#ff7a00;text-shadow:0 0 9px rgba(255,59,0,.55)}
.search-wrap{
  display:flex;align-items:center;gap:8px;background:#130504;border:1px solid #7e4114;
  border-radius:14px;padding:0 12px;height:48px;box-shadow:inset 0 0 18px rgba(0,0,0,.5);
}
.search-wrap>span{font-size:27px;color:#ff7a00}
.search-wrap input{min-width:0;flex:1;background:transparent;border:0;outline:0;color:#fff;font-size:17px}
.search-wrap input::placeholder{color:#8e7468}
.clear-search{border:0;background:transparent;color:#9f7f72;font-size:23px}
.category-chips{
  display:flex;gap:7px;overflow-x:auto;padding:14px 0 10px;scrollbar-width:none
}
.category-chips::-webkit-scrollbar{display:none}
.chip{
  white-space:nowrap;border:1px solid #643414;background:#180604;color:#caa58c;
  border-radius:999px;padding:8px 12px;font-size:13px;
}
.chip.active{border-color:#ff7300;color:#fff0bf;background:#361007;box-shadow:0 0 12px rgba(255,74,0,.28)}
.menu-list{display:grid;gap:11px;margin-top:6px}
.category-block{
  margin-top:14px;padding-top:4px;
}
.category-title{
  display:flex;align-items:center;gap:9px;color:#ff6b00;font:600 24px Oswald,sans-serif;
  letter-spacing:1.5px;margin:6px 0 8px;
}
.category-title:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,#ff6500,transparent)}
.dish{
  position:relative;padding:13px 10px 12px;border-bottom:1px solid rgba(173,91,34,.28);
  background:linear-gradient(90deg,rgba(58,17,10,.4),transparent);border-radius:10px;
}
.dish-top{display:flex;align-items:baseline;gap:8px}
.dish-name{font-weight:700;font-size:16px;letter-spacing:.2px;flex:1}
.price{font:600 17px Oswald,sans-serif;color:#ffe8a0;white-space:nowrap}
.desc{margin-top:3px;color:#a99083;font-size:12px;line-height:1.3;max-width:92%}
.no-results{text-align:center;padding:50px 10px;color:#a98d7d}
.bottom-nav{
  position:fixed;bottom:0;left:0;right:0;z-index:40;display:flex;justify-content:center;gap:12px;
  padding:9px 14px calc(9px + env(safe-area-inset-bottom));
  background:rgba(8,2,2,.94);border-top:1px solid rgba(255,119,0,.3);backdrop-filter:blur(12px)
}
.bottom-nav button{
  border:1px solid #60330f;background:#160504;color:#e2b888;border-radius:999px;padding:8px 18px
}
.bottom-nav button:hover{border-color:#ff7500;color:#fff0b5}

@media(max-width:520px){
  .choice-grid{grid-template-columns:1fr}
  .choice-card{min-height:145px}
  .car-strip{height:130px}
  .splash-frame{height:94svh}
}
