:root{
  --bg:#0B1220; --panel:#121B2C; --panel-2:#17223A; --line:#223354;
  --text:#E7ECF3; --muted:#8497B8; --accent:#F2A94F; --accent-dim:#8a5f28; --signal:#3DDC84; --danger:#FF6B6B;
}
*{box-sizing:border-box; margin:0; padding:0;}
body{background:var(--bg); color:var(--text); font-family:'IBM Plex Sans', sans-serif; line-height:1.6; -webkit-font-smoothing:antialiased; min-height:100vh; display:flex; flex-direction:column;}
body::before{content:""; position:fixed; inset:0; pointer-events:none; opacity:.12; z-index:0;
  background-image:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size:48px 48px;}
main{flex:1; position:relative; z-index:1;}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px; position:relative; z-index:1;}
h1,h2{font-family:'Fraunces', serif; font-weight:500; letter-spacing:-0.01em;}
h3{font-family:'IBM Plex Mono', monospace; font-weight:600;}
a{color:inherit;}
.mono{font-family:'IBM Plex Mono', monospace;}
.muted{color:var(--muted);}
[hidden]{display:none !important;}

nav{position:sticky; top:0; z-index:50; backdrop-filter:blur(10px); background:rgba(11,18,32,.85); border-bottom:1px solid var(--line);}
nav .wrap{display:flex; align-items:center; justify-content:space-between; height:64px; gap:16px;}
.logo{display:inline-flex; align-items:center; gap:9px; white-space:nowrap; text-decoration:none;}
.logo .dot{width:8px; height:8px; border-radius:50%; background:var(--signal); box-shadow:0 0 8px var(--signal); flex:0 0 auto;}
.logo .brand{display:inline-flex; align-items:baseline; gap:.24em; line-height:1;}
.logo .brand-mark{font-family:'IBM Plex Mono', monospace; font-weight:700; font-size:1.06rem; letter-spacing:.03em; color:var(--accent);}
.logo .brand-word{font-family:'Fraunces', serif; font-weight:500; font-style:italic; font-size:1.16rem; letter-spacing:-.01em; color:var(--text); transition:color .2s;}
.logo:hover .brand-word{color:var(--accent);}
nav ul{list-style:none; display:flex; gap:28px; font-size:.92rem; color:var(--muted);}
nav ul a{text-decoration:none;} nav ul a:hover, nav ul a[aria-current]{color:var(--text);}
.nav-right{display:flex; align-items:center; gap:10px;}

.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid var(--line); background:transparent; color:var(--text);
  padding:10px 18px; border-radius:6px; font-family:'IBM Plex Mono', monospace; font-size:.86rem; cursor:pointer; text-decoration:none; transition:transform .15s, border-color .15s;}
.btn:hover{border-color:var(--accent-dim);}
.btn-primary{background:var(--accent); border-color:var(--accent); color:#1a1200; font-weight:600; box-shadow:0 6px 18px -10px rgba(242,169,79,.7);}
.btn-primary:hover{transform:translateY(-1px); box-shadow:0 10px 24px -10px rgba(242,169,79,.85);}
.btn-sm{padding:6px 12px; font-size:.78rem;}
.btn-danger{color:var(--danger); border-color:rgba(255,107,107,.35);}
.nav-right .btn{border-color:var(--accent-dim);}
.nav-right .btn:hover{border-color:var(--accent); color:var(--accent);}
.btn:disabled{opacity:.5; cursor:not-allowed; transform:none;}
input:focus, textarea:focus, select:focus, a:focus-visible, button:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}

.page-head{padding:56px 0 28px;}
.section-tag{font-family:'IBM Plex Mono', monospace; color:var(--accent); font-size:.82rem; margin-bottom:10px;}
.page-head h1{font-size:2.4rem; line-height:1.15; margin-bottom:10px;}
.page-head p{color:var(--muted); max-width:620px;}

.panel{background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:24px;}
label{display:flex; flex-direction:column; gap:6px; font-size:.82rem; color:var(--muted); font-family:'IBM Plex Mono', monospace;}
input, textarea, select{background:var(--bg); border:1px solid var(--line); border-radius:6px; color:var(--text); padding:11px 13px; font-family:'IBM Plex Sans', sans-serif; font-size:.92rem; width:100%;}
textarea{resize:vertical; min-height:80px;}
.form{display:flex; flex-direction:column; gap:14px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.check{flex-direction:row; align-items:center; gap:8px;} .check input{width:auto;}

.notice{border:1px solid var(--line); border-radius:8px; padding:12px 16px; font-size:.9rem; margin-bottom:18px; background:var(--panel-2);}
.notice.ok{border-color:rgba(61,220,132,.45); color:var(--signal);}
.notice.err{border-color:rgba(255,107,107,.45); color:var(--danger);}

/* LOJA */
.shop{display:grid; grid-template-columns:1fr 340px; gap:28px; align-items:start; padding-bottom:72px;}
.filters{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px;}
.chip{border:1px solid var(--line); background:transparent; color:var(--muted); border-radius:20px; padding:6px 14px; font-family:'IBM Plex Mono', monospace; font-size:.8rem; cursor:pointer;}
.chip[aria-pressed="true"]{border-color:var(--accent); color:var(--accent); background:rgba(242,169,79,.08);}
.products{display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:20px;}
.product{background:var(--panel); border:1px solid var(--line); border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .2s, transform .2s;}
.product:hover{border-color:var(--accent-dim); transform:translateY(-2px);}
.product img{display:block; width:100%; aspect-ratio:4/3; object-fit:cover; background:var(--panel-2); border-bottom:1px solid var(--line);}
.product-body{padding:18px; display:flex; flex-direction:column; gap:8px; flex:1;}
.product .cat{font-family:'IBM Plex Mono', monospace; font-size:.72rem; color:var(--accent); text-transform:uppercase; letter-spacing:.04em;}
.product h3{font-size:.98rem; line-height:1.35;}
.product p{color:var(--muted); font-size:.86rem; flex:1;}
.product-foot{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:6px;}
.price{font-family:'IBM Plex Mono', monospace; font-size:1.2rem; color:var(--text); font-weight:600;}
.stock{font-size:.75rem; color:var(--muted); font-family:'IBM Plex Mono', monospace;}
.stock.low{color:var(--accent);} .stock.out{color:var(--danger);}

.cart{position:sticky; top:84px;}
.cart h2{font-size:1.35rem; margin-bottom:14px; display:flex; justify-content:space-between; align-items:baseline;}
.cart-items{list-style:none; display:flex; flex-direction:column; gap:12px; margin-bottom:16px; max-height:320px; overflow:auto;}
.cart-item{display:grid; grid-template-columns:48px 1fr auto; gap:10px; align-items:center; font-size:.86rem;}
.cart-item img{width:48px; height:36px; object-fit:cover; border-radius:4px; border:1px solid var(--line);}
.qty{display:flex; align-items:center; gap:6px;}
.qty button{width:24px; height:24px; border-radius:4px; border:1px solid var(--line); background:transparent; color:var(--text); cursor:pointer;}
.cart-total{display:flex; justify-content:space-between; font-family:'IBM Plex Mono', monospace; border-top:1px solid var(--line); padding-top:14px; margin-bottom:14px;}
.cart-total strong{color:var(--accent); font-size:1.15rem;}

/* CONTA */
.auth-wrap{max-width:440px; margin:0 auto 80px;}
.tabs{display:flex; gap:4px; border-bottom:1px solid var(--line); margin-bottom:22px; flex-wrap:wrap;}
.tab{background:none; border:none; border-bottom:2px solid transparent; color:var(--muted); padding:10px 16px; font-family:'IBM Plex Mono', monospace; font-size:.86rem; cursor:pointer; margin-bottom:-1px;}
.tab[aria-selected="true"]{color:var(--text); border-bottom-color:var(--accent);}
.pw-field{position:relative; display:block;} .pw-field input{padding-right:84px;}
.pw-toggle{position:absolute; right:6px; top:50%; transform:translateY(-50%); background:none; border:none; color:var(--muted); font-family:'IBM Plex Mono', monospace; font-size:.75rem; cursor:pointer; padding:6px 8px;}
.pw-toggle:hover{color:var(--text);}
.pw-meter{height:4px; background:var(--line); border-radius:2px; overflow:hidden; margin-top:-6px;}
.pw-meter span{display:block; height:100%; width:0; background:var(--danger); transition:width .2s, background .2s;}
.pw-rules{list-style:none; display:grid; gap:4px; font-size:.78rem; color:var(--muted); font-family:'IBM Plex Mono', monospace; margin:-4px 0 0;}
.pw-rules li::before{content:"○ "; } .pw-rules li.ok{color:var(--signal);} .pw-rules li.ok::before{content:"✓ ";}
.pw-match{font-size:.8rem; font-family:'IBM Plex Mono', monospace; margin:-6px 0 0; min-height:1.2em;}
.pw-match.ok{color:var(--signal);} .pw-match.err{color:var(--danger);}
input.invalid{border-color:var(--danger);} input.valid{border-color:rgba(61,220,132,.6);}
.check{align-items:flex-start;} .check input{margin-top:2px;}
.confirm-pending{display:flex; flex-direction:column; gap:12px;}
.dash{padding-bottom:80px;}
.dash-head{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:24px;}
.badge{display:inline-block; font-family:'IBM Plex Mono', monospace; font-size:.72rem; padding:3px 9px; border-radius:12px; border:1px solid var(--line); color:var(--muted); white-space:nowrap;}
.badge.admin{color:var(--accent); border-color:var(--accent-dim);}
.badge.s-pago, .badge.s-concluido{color:var(--signal); border-color:rgba(61,220,132,.4);}
.badge.s-pendente{color:var(--accent); border-color:var(--accent-dim);}
.badge.s-cancelado{color:var(--danger); border-color:rgba(255,107,107,.4);}
.badge.s-em_preparacao, .badge.s-enviado{color:#7CC4FF; border-color:rgba(124,196,255,.4);}
.table-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:12px; background:var(--panel);}
table{width:100%; border-collapse:collapse; font-size:.88rem;}
th, td{text-align:left; padding:12px 14px; border-bottom:1px solid var(--line); vertical-align:top;}
th{font-family:'IBM Plex Mono', monospace; font-size:.74rem; color:var(--muted); font-weight:500; text-transform:uppercase; letter-spacing:.04em; background:var(--panel-2);}
tr:last-child td{border-bottom:none;}
td .items{list-style:none; color:var(--muted); font-size:.82rem;}
td select, td input{padding:6px 8px; font-size:.82rem; width:auto;}
.num{font-family:'IBM Plex Mono', monospace; white-space:nowrap;}
.empty{padding:40px; text-align:center; color:var(--muted);}
.stats{display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; margin-bottom:22px;}
.stat{background:var(--panel); border:1px solid var(--line); border-radius:10px; padding:16px;}
.stat .v{font-family:'IBM Plex Mono', monospace; font-size:1.4rem; color:var(--text);}
.stat .l{font-size:.78rem; color:var(--muted);}
.product-form{margin-bottom:22px;}
.product-form .form{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px;}
.product-form .span-3{grid-column:1 / -1;}
.thumb{width:56px; height:42px; object-fit:cover; border-radius:4px; border:1px solid var(--line);}

footer{padding:28px 0; border-top:1px solid var(--line); color:var(--muted); font-size:.82rem; position:relative; z-index:1;}
footer .wrap{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

@media (max-width:900px){
  .shop{grid-template-columns:1fr;}
  .cart{position:static;}
  .stats{grid-template-columns:repeat(2, 1fr);}
  .product-form .form{grid-template-columns:1fr;}
}
@media (max-width:720px){
  nav ul{display:none;}
  .form-row{grid-template-columns:1fr;}
  .page-head h1{font-size:1.9rem;}
}
@media (prefers-reduced-motion: reduce){ .product, .btn{transition:none;} .product:hover, .btn-primary:hover{transform:none;} }