:root{
  --brand:#ff4b12;
  --brand-2:#ff8a00;
  --brand-dark:#d92d00;
  --yellow:#ffc928;
  --ink:#43170b;
  --ink-2:#6a2b17;
  --muted:#7d665d;
  --bg:#fff8e9;
  --cream:#fff1cf;
  --card:#ffffff;
  --line:#f0d9bf;
  --ok:#1f9d55;
  --warn:#d97706;
  --danger:#d62828;
  --radius:20px;
  --shadow:0 14px 34px rgba(107,36,5,.10);
  --shadow-hover:0 20px 45px rgba(107,36,5,.17);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#fffaf0;color:var(--ink);accent-color:var(--brand)}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button:disabled{opacity:.58;cursor:not-allowed}
.hidden{display:none!important}

/* App shell */
.app-shell{display:grid;grid-template-columns:270px 1fr;min-height:100vh;background:linear-gradient(180deg,#fffaf1 0%,#fff 100%)}
.sidebar{background:linear-gradient(180deg,#3c1409 0%,#611d09 58%,#8c2706 100%);color:#fff;padding:24px 18px;position:sticky;top:0;height:100vh;overflow:auto;box-shadow:12px 0 30px rgba(67,23,11,.13)}
.brand{display:flex;align-items:center;gap:12px;font-weight:950;font-size:24px;letter-spacing:-.7px;margin-bottom:28px}
.brand-mark{width:48px;height:48px;border-radius:16px;background:linear-gradient(135deg,var(--brand-2),var(--brand));display:grid;place-items:center;box-shadow:0 12px 24px rgba(255,75,18,.30);overflow:hidden;flex:0 0 auto;border:2px solid rgba(255,255,255,.2)}
.brand-mark img{width:100%;height:100%;display:block}
.nav-title{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:#ffd9b7;margin:22px 12px 8px;font-weight:800}
.nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:13px;color:#fff4e8;margin:4px 0;font-weight:700;transition:.18s ease}
.nav a span{font-size:18px;width:23px;text-align:center}
.nav a:hover,.nav a.active{background:linear-gradient(135deg,rgba(255,143,0,.28),rgba(255,72,12,.34));color:#fff;transform:translateX(2px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.13)}
.sidebar-foot{margin-top:28px;padding:15px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);border-radius:16px;color:#ffe8d0;font-size:13px;line-height:1.55}
.main{min-width:0}
.topbar{height:76px;background:rgba(255,255,255,.91);backdrop-filter:blur(13px);border-bottom:1px solid #f0dfca;display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:20}
.content{padding:30px;max-width:1500px;margin:auto}
.page-title h1{margin:0;font-size:30px;letter-spacing:-.8px;color:var(--ink)}
.page-title p{margin:6px 0 0;color:var(--muted)}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}

/* Controls */
.btn{border:0;border-radius:13px;padding:11px 16px;font-weight:850;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.18s ease;box-shadow:none}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:linear-gradient(135deg,var(--brand-2),var(--brand));color:#fff;box-shadow:0 9px 20px rgba(255,75,18,.22)}
.btn-primary:hover{background:linear-gradient(135deg,#ff9d00,#ed3200);box-shadow:0 12px 25px rgba(255,75,18,.30)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{background:#2c0e05}
.btn-light{background:#fff;border:1px solid #ead4bb;color:var(--ink)}
.btn-light:hover{border-color:#f49a5f;background:#fff9f0}
.btn-danger{background:#ffe4df;color:#b91c1c}
.btn-success{background:#ddf8e7;color:#166534}
.btn-sm{padding:8px 11px;border-radius:10px;font-size:13px}

/* Cards and grids */
.grid{display:grid;gap:18px}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:linear-gradient(180deg,#fff 0%,#fffdf9 100%);border:1px solid #f0ddc7;border-radius:var(--radius);padding:21px;box-shadow:var(--shadow);transition:.18s ease}
.card:hover{border-color:#ebc7a4}
.stat{display:flex;justify-content:space-between;align-items:flex-start;position:relative;overflow:hidden}
.stat:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-42px;bottom:-58px;background:linear-gradient(135deg,rgba(255,201,40,.22),rgba(255,75,18,.12))}
.stat-value{font-size:29px;font-weight:950;margin-top:8px;letter-spacing:-.8px}
.stat-label{font-size:13px;color:var(--muted);font-weight:750}
.stat-icon{width:48px;height:48px;border-radius:15px;background:linear-gradient(135deg,#fff0b4,#ffd6bb);display:grid;place-items:center;font-size:23px;position:relative;z-index:1}

/* Tables */
.table-wrap{overflow:auto;border:1px solid #efd9c0;border-radius:17px;background:#fff}
.data-table{width:100%;border-collapse:collapse;min-width:720px}
.data-table th,.data-table td{padding:13px 15px;border-bottom:1px solid #f4e5d4;text-align:left;vertical-align:middle}
.data-table th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#8c6554;background:#fff7eb}
.data-table tr:last-child td{border-bottom:0}
.data-table tbody tr:hover{background:#fffaf1}

/* Badges */
.badge{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:850}
.badge-new{background:#ffeadc;color:#c73500}.badge-accepted{background:#ffefbe;color:#9b5e00}.badge-preparing{background:#fff1b8;color:#8a5600}.badge-ready{background:#dcfce7;color:#166534}.badge-completed{background:#ece7e1;color:#4f463f}.badge-cancelled{background:#fee2e2;color:#991b1b}.badge-paid{background:#dcfce7;color:#166534}.badge-unpaid{background:#ffe3de;color:#a41e16}

/* Forms */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field label{display:block;font-size:13px;font-weight:850;margin-bottom:7px;color:#5d2412}
.field input,.field select,.field textarea{width:100%;border:1px solid #ddc8ae;border-radius:13px;padding:11px 12px;background:#fff;outline:none;color:var(--ink);transition:.15s ease}
.field textarea{min-height:96px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#ff8a31;box-shadow:0 0 0 4px rgba(255,117,25,.13)}
.field input::placeholder,.field textarea::placeholder{color:#b49b8d}
.field-full{grid-column:1/-1}
.help{font-size:12px;color:var(--muted);margin-top:6px}
.alert{padding:14px 16px;border-radius:14px;margin-bottom:18px;border:1px solid transparent;font-weight:650}
.alert-success{background:#e4f9ea;color:#166534;border-color:#bdeaca}.alert-error{background:#ffe8e3;color:#991b1b;border-color:#ffc7bc}.alert-info{background:#fff2cb;color:#714a00;border-color:#f7d777}

/* Live order boards */
.order-board{display:grid;grid-template-columns:repeat(3,minmax(300px,1fr));gap:18px;align-items:start}
.board-col{background:linear-gradient(180deg,#fff1d5,#fff8ec);border:1px solid #f0d6b4;border-radius:20px;padding:14px;min-height:420px}
.board-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;font-weight:950;color:#5a210d;padding:3px 4px}
.order-card{background:#fff;border-radius:17px;padding:16px;margin-bottom:12px;border-left:6px solid var(--brand);box-shadow:0 9px 20px rgba(91,29,5,.09);transition:.18s ease}
.order-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)}
.order-card h3{margin:0;font-size:20px;color:#47180a}
.order-meta{color:#80685e;font-size:13px;margin-top:5px}
.order-items{margin:12px 0;padding:0;list-style:none}
.order-items li{display:flex;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed #ead6c0}
.order-items li:last-child{border-bottom:0}
.order-actions{display:flex;gap:8px;flex-wrap:wrap}

/* Login / register */
.login-page{min-height:100vh;display:grid;grid-template-columns:1.08fr .92fr;background:#fff}
.login-hero{padding:68px;background:
 radial-gradient(circle at 12% 22%,rgba(255,207,36,.32),transparent 23%),
 radial-gradient(circle at 85% 78%,rgba(255,157,0,.32),transparent 25%),
 linear-gradient(135deg,#ff7900 0%,#ff4211 55%,#c91d00 100%);color:#fff;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.login-hero:before,.login-hero:after{content:"";position:absolute;border-radius:50%;border:28px solid rgba(255,255,255,.08)}
.login-hero:before{width:260px;height:260px;right:-95px;top:-85px}.login-hero:after{width:180px;height:180px;left:-70px;bottom:-70px}
.login-hero .brand{position:relative;z-index:2}
.login-hero h1{font-size:62px;line-height:.98;margin:20px 0;letter-spacing:-3px;text-shadow:0 7px 24px rgba(106,18,0,.22);position:relative;z-index:2}
.login-hero p{font-size:18px;color:#fff8e9;max-width:650px;line-height:1.62;position:relative;z-index:2}
.login-hero .grid{position:relative;z-index:2}
.login-hero .grid>div{background:rgba(75,20,4,.22);border:1px solid rgba(255,255,255,.22);padding:16px;border-radius:17px;backdrop-filter:blur(5px)}
.login-panel{display:grid;place-items:center;padding:38px;background:linear-gradient(145deg,#fffdf7,#fff1d9)}
.login-box{width:min(455px,100%);background:#fff;border:1px solid #efd8bb;border-radius:26px;padding:30px;box-shadow:0 28px 70px rgba(90,28,5,.12)}
.login-box .brand{margin-bottom:20px;color:var(--ink)!important}
.login-box h2{font-size:32px;margin:0 0 6px;letter-spacing:-1px}

/* Public menu */
.public-body{background:
 radial-gradient(circle at 90% 6%,rgba(255,195,39,.20),transparent 19%),
 linear-gradient(180deg,#fff6df 0,#fffaf2 230px,#fff 100%);min-height:100vh;padding-bottom:118px}
.store-head{background:
 radial-gradient(circle at 82% 35%,rgba(255,211,65,.30),transparent 22%),
 linear-gradient(115deg,#391307 0%,#6d1c07 45%,#c72b04 100%);color:#fff;padding:27px 18px;position:relative;overflow:hidden}
.store-head:after{content:"🍔   🍗   🥤";position:absolute;right:4%;bottom:-21px;font-size:78px;letter-spacing:18px;opacity:.16;transform:rotate(-6deg)}
.store-head-inner{max-width:1100px;margin:auto;display:flex;align-items:center;gap:17px;position:relative;z-index:2}
.store-logo{width:68px;height:68px;background:#fff;border:3px solid rgba(255,255,255,.35);border-radius:20px;object-fit:cover;box-shadow:0 10px 24px rgba(0,0,0,.20)}
.store-title h1{margin:0;font-size:27px;letter-spacing:-.6px}
.store-title p{margin:5px 0 0;color:#ffe9d4}
.menu-wrap{max-width:1100px;margin:21px auto;padding:0 16px}
.category-tabs{display:flex;gap:9px;overflow:auto;padding:7px 0 12px;position:sticky;top:0;background:rgba(255,250,242,.93);backdrop-filter:blur(9px);z-index:8}
.category-tabs a{white-space:nowrap;padding:10px 15px;border-radius:999px;background:#fff;border:1px solid #ebcfad;font-weight:800;color:#6a260f;box-shadow:0 6px 13px rgba(90,28,5,.06)}
.category-tabs a:hover{background:linear-gradient(135deg,#fff0b7,#ffe0c7);border-color:#f4a65f}
.menu-wrap section>h2{font-size:24px;margin:25px 0 12px;color:#4b1809;letter-spacing:-.5px}
.menu-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.menu-card{background:#fff;border:1px solid #efd5b8;border-radius:19px;display:grid;grid-template-columns:1fr 145px;overflow:hidden;box-shadow:0 11px 26px rgba(95,30,6,.08);transition:.2s ease;min-height:150px}
.menu-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:#f3ab68}
.menu-info{padding:17px}
.menu-info h3{margin:0 0 7px;font-size:18px;color:#49170a}
.menu-info p{margin:0;color:#846e64;font-size:13px;line-height:1.5;min-height:39px}
.menu-price{font-weight:950;margin-top:13px;color:#d93200;font-size:18px}
.menu-image{width:145px;height:100%;min-height:150px;object-fit:cover;background:#ffe6bc}
.add-btn{margin-top:10px;background:linear-gradient(135deg,#4b1809,#6e210b);color:#fff;border:0;border-radius:11px;padding:9px 12px;font-weight:850;cursor:pointer;transition:.16s ease}
.add-btn:hover{background:linear-gradient(135deg,var(--brand-2),var(--brand));transform:translateY(-1px)}
.cart-bar{position:fixed;left:0;right:0;bottom:0;padding:12px 16px;background:rgba(255,255,255,.93);border-top:1px solid #ecd9c3;z-index:30;backdrop-filter:blur(10px)}
.cart-bar-inner{max-width:1100px;margin:auto;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#441609,#70210a);color:#fff;padding:14px 17px;border-radius:16px;cursor:pointer;box-shadow:0 10px 26px rgba(64,18,2,.22)}
.cart-bar-inner span:last-child{color:#ffd244;font-weight:900}
.cart-sheet{position:fixed;inset:0;background:rgba(42,12,2,.55);z-index:50;display:none;align-items:flex-end;backdrop-filter:blur(3px)}
.cart-sheet.open{display:flex}
.cart-panel{background:#fffdf8;width:100%;max-height:92vh;overflow:auto;border-radius:26px 26px 0 0;padding:23px;box-shadow:0 -20px 60px rgba(64,18,2,.20)}
.cart-panel-inner{max-width:680px;margin:auto}
.cart-row{display:grid;grid-template-columns:1fr auto;gap:12px;padding:12px 0;border-bottom:1px solid #efddc9}
.qty{display:flex;align-items:center;gap:8px}
.qty button{width:32px;height:32px;border:1px solid #e3c9ad;background:#fff;border-radius:10px;color:#5a1e0b;font-weight:900;cursor:pointer}
.total-row{display:flex;justify-content:space-between;padding:6px 0}
.grand{font-size:20px;font-weight:950;border-top:2px solid #54200e;margin-top:8px;padding-top:12px}

/* Subscription */
.plan-card{position:relative;overflow:hidden}
.plan-card:before{content:"";position:absolute;right:-35px;top:-35px;width:110px;height:110px;border-radius:50%;background:linear-gradient(135deg,#ffe491,#ff9a48);opacity:.35}
.plan-price{font-size:35px;font-weight:950;color:#5b1e0b;position:relative}
.plan-price small{font-size:14px;color:var(--muted)}
.feature-list{padding-left:18px;color:#705344;line-height:1.8;position:relative}
.current-plan{border:2px solid var(--brand);box-shadow:0 18px 42px rgba(255,75,18,.18)}

/* QR print */
.qr-card{box-shadow:0 12px 26px rgba(84,25,5,.08)}

@media(max-width:1050px){
  .grid-4{grid-template-columns:repeat(2,1fr)}
  .order-board{grid-template-columns:1fr}
  .login-page{grid-template-columns:1fr}
  .login-hero{display:none}
}
@media(max-width:760px){
  .app-shell{display:block}
  .sidebar{height:auto;position:relative;padding:14px 13px;background:linear-gradient(100deg,#4a1708,#a52b05)}
  .sidebar .nav-title,.sidebar-foot{display:none}
  .brand{margin-bottom:10px;font-size:21px}
  .brand-mark{width:42px;height:42px;border-radius:13px}
  .nav{display:flex;overflow:auto;gap:3px;padding-bottom:2px}
  .nav a{white-space:nowrap;padding:9px 10px;margin:0}
  .topbar{height:68px;padding:0 15px}
  .content{padding:20px 14px}
  .grid-4,.grid-3,.grid-2,.form-grid{grid-template-columns:1fr}
  .menu-grid{grid-template-columns:1fr}
  .menu-card{grid-template-columns:1fr 115px;min-height:140px}
  .menu-image{width:115px;min-height:140px}
  .page-title h1{font-size:24px}
  .login-panel{padding:18px}
  .login-box{padding:23px;border-radius:22px}
  .store-head:after{font-size:54px;right:-20px}
}
@media(max-width:420px){
  .menu-card{grid-template-columns:1fr 100px}
  .menu-image{width:100px}
  .cart-bar-inner{font-size:13px}
  .store-title h1{font-size:23px}
}
@media print{
  .no-print,.sidebar,.topbar{display:none!important}
  .app-shell{display:block}.content{padding:0}.card{box-shadow:none;border:0}.qr-card{break-inside:avoid}
}