:root{
  --bg:#0f131a;
  --bg-2:#151b24;
  --card:rgba(255,255,255,.06);
  --card-strong:rgba(255,255,255,.09);
  --text:#f3f6fb;
  --muted:#aeb8c8;
  --border:rgba(255,255,255,.10);
  --primary:#d26a49;
  --primary-ink:#fff8f4;
  --shadow:0 20px 50px rgba(0,0,0,.32);
}
html[data-theme="light"]{
  --bg:#f2f5f9;
  --bg-2:#f8fafc;
  --card:rgba(255,255,255,.72);
  --card-strong:rgba(255,255,255,.86);
  --text:#1a2230;
  --muted:#677383;
  --border:rgba(17,24,39,.08);
  --primary:#b55235;
  --primary-ink:#fff9f5;
  --shadow:0 18px 46px rgba(13,18,29,.10);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(circle at top left, rgba(210,106,73,.11), transparent 28%),
    radial-gradient(circle at bottom right, rgba(124,92,255,.08), transparent 28%),
    linear-gradient(180deg,var(--bg-2),var(--bg));
  color:var(--text);
  min-height:100vh;
  transition:opacity .22s ease, transform .22s ease, filter .22s ease;
}
body.page-leaving{opacity:.0; transform:translateY(8px); filter:blur(2px)}
body.page-enter{animation:pageEnter .28s ease}
@keyframes pageEnter{from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none}}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(1120px,calc(100% - 20px));margin:0 auto}
.main-shell{padding-bottom:28px}
.page-glow{position:fixed;pointer-events:none;z-index:-1;filter:blur(42px);border-radius:999px;opacity:.24}
.glow-a{width:220px;height:220px;background:rgba(210,106,73,.22);left:-60px;top:40px}
.glow-b{width:280px;height:280px;background:rgba(124,92,255,.16);right:-90px;top:180px}

.site-header{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px 0 10px;position:sticky;top:0;z-index:15;backdrop-filter:blur(18px)}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.logo{
  width:50px;height:50px;border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:var(--shadow);
  backdrop-filter:blur(18px) saturate(140%);
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.05));
  display:grid;place-items:center;
}
.logo-brand{
  background-image:url('/static/uploads/sh.png'), linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.05));
  background-repeat:no-repeat,no-repeat;
  background-position:center,center;
  background-size:84%,cover;
  position:relative;
}
.title{font-size:18px;font-weight:800}
.subtitle{font-size:13px;color:var(--muted)}
.header-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.icon-btn{min-width:48px;padding-inline:0}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:44px;padding:12px 16px;border-radius:16px;border:1px solid var(--border);
  background:var(--card);color:var(--text);font-weight:700;cursor:pointer;text-align:center;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease, filter .2s ease;
  box-shadow:var(--shadow);backdrop-filter:blur(18px) saturate(140%);
  position:relative; overflow:hidden;
}
.btn::after{
  content:""; position:absolute; inset:0; transform:translateX(-125%);
  background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.05) 42%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.05) 58%,transparent 100%);
  opacity:0; pointer-events:none;
}
.btn:hover{transform:translateY(-2px) scale(1.01);border-color:rgba(255,255,255,.18);filter:brightness(1.03)}
.btn:active,.btn.is-pressed{transform:translateY(0) scale(.985)}
.btn:hover::after{opacity:1;animation:btnShine .9s ease}
.btn.primary,.btn:is(.primary){background:linear-gradient(135deg,var(--primary),#de7d5d 60%, #efb189);color:var(--primary-ink);border-color:transparent}
.btn.primary:hover,.btn:is(.primary):hover{box-shadow:0 18px 34px rgba(210,106,73,.30), 0 0 0 1px rgba(255,255,255,.08) inset}
.pulse-primary{animation:primaryGlow 2.8s ease-in-out infinite}
.btn.subtle{background:var(--card)}
.btn.danger{background:linear-gradient(135deg,#b33a44,#d5525d);color:#fff;border-color:transparent}

.hero,.assistant-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr);gap:16px;align-items:center;padding:16px 0 12px;animation:heroFadeUp .45s ease}
.hero h1,.assistant-hero h1{font-size:clamp(32px,5vw,46px);line-height:1.02;letter-spacing:-.04em;margin:12px 0 10px;max-width:11ch}
.hero p,.assistant-hero p{margin:0;color:var(--muted);font-size:16px;line-height:1.6;max-width:60ch}
.eyebrow{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.08);color:var(--text);font-size:13px;font-weight:800;border:1px solid var(--border);backdrop-filter:blur(18px)}
.hero-action-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}

.section-title-row{display:flex;justify-content:space-between;gap:16px;align-items:end;margin-bottom:14px}
.section-title-row h1,.section-title-row h2{margin:10px 0 0;letter-spacing:-.03em}
.toolbar-row{margin:10px 0 16px}
.announcements ul{padding:0;list-style:none;display:grid;gap:12px;margin:0}
.announcement-card{padding:16px}
.ann-text{
  font-size:15px;
  line-height:1.55;
  white-space:pre-wrap;
  word-break:break-word;
}
.ann-date{margin-top:10px;color:var(--muted);font-size:13px}

.card,.compact-card,.menu-tab,.tg-btn{
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, filter .2s ease;
}
.card{background:var(--card-strong);border:1px solid var(--border);border-radius:22px;box-shadow:var(--shadow);backdrop-filter:blur(18px) saturate(140%)}
.compact-card{background:var(--card);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow);backdrop-filter:blur(18px) saturate(140%);padding:14px}
.hover:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.18);box-shadow:0 24px 46px rgba(0,0,0,.34)}
.hover-scale:hover .thumb{transform:scale(1.02)}
.thumb{width:100%;height:200px;object-fit:cover;border-radius:22px 22px 0 0;transition:transform .28s ease}
.avatar{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:22px 22px 0 0}

.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.menu-grid > *{grid-column:span 4}
.leaders-grid > *{grid-column:span 4}

.menu-page{display:grid;gap:18px}
.menu-toolbar{display:grid;gap:12px}
.menu-toolbar-top{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.menu-toolbar-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,340px);gap:12px;align-items:end}
.menu-title{margin:0;font-size:clamp(26px,4vw,34px);letter-spacing:-.03em}
.inline-search,.menu-search-field{display:grid;gap:8px}
.menu-selector-label{font-size:13px;font-weight:800;color:var(--muted)}
.menu-search-input,.form input[type="text"],.form input[type="password"],.form input[type="url"],.form input[type="date"],.form textarea,.form select,.form input[type="file"]{
  width:100%;padding:13px 14px;border-radius:16px;border:1px solid var(--border);
  background:rgba(255,255,255,.06);color:var(--text);font:inherit;outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
html[data-theme="light"] .menu-search-input,html[data-theme="light"] .form input,html[data-theme="light"] .form textarea,html[data-theme="light"] .form select,html[data-theme="light"] .form input[type="file"]{background:rgba(255,255,255,.72)}
.menu-search-input:focus,.form input:focus,.form textarea:focus,.form select:focus{border-color:rgba(210,106,73,.40);box-shadow:0 0 0 4px rgba(210,106,73,.08)}
.form{display:grid;gap:12px}
.form label{display:grid;gap:8px;font-weight:600}
.checkbox{display:flex!important;align-items:center;gap:10px}
.checkbox input{width:auto!important;margin:0}
.inline{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.list{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.muted{color:var(--muted)}

.menu-tabs{display:flex;gap:10px;flex-wrap:wrap}
.menu-tab{
  display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 14px;border-radius:999px;border:1px solid var(--border);
  background:rgba(255,255,255,.06);color:var(--text);font-size:14px;cursor:pointer;
}
.menu-tab:hover{transform:translateY(-2px) scale(1.01);border-color:rgba(255,255,255,.18)}
.menu-tab:active,.menu-tab.is-pressed{transform:translateY(0) scale(.985)}
.menu-tab.is-active{background:linear-gradient(135deg,var(--primary),#de7d5d 60%, #efb189);color:var(--primary-ink);border-color:transparent;box-shadow:0 14px 30px rgba(210,106,73,.22)}
.menu-status-row{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.menu-results{font-weight:800}
.menu-status-muted{font-size:13px;color:var(--muted)}
.menu-sections{display:grid;gap:20px}
.menu-section{display:grid;gap:14px}
.menu-section[hidden]{display:none!important}
.menu-section-head{display:flex;justify-content:space-between;align-items:center;gap:14px}
.category{margin:0;font-size:22px;font-weight:800;letter-spacing:-.03em}
.menu-category-badge{min-width:42px;height:42px;padding:0 12px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border:1px solid var(--border);font-weight:800}
.menu-card-body{display:grid;gap:12px;padding:14px}
.menu-card-top{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}
.menu-card-top h3{margin:0;font-size:19px;line-height:1.2}
.menu-item-desc{min-height:auto;color:var(--muted);margin:0;line-height:1.55}
.menu-pill-row{display:flex;gap:8px;flex-wrap:wrap}
.pill{padding:10px 12px;border-radius:14px;font-size:14px;line-height:1.45;background:rgba(255,255,255,.05);border:1px solid var(--border)}
.menu-empty{text-align:center;padding:24px}

.admin-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch}
.admin-links .btn{width:100%}
.admin-order-list{display:grid;gap:10px;margin-top:12px}
.admin-order-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px}
.admin-category-head{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap;margin:20px 0 10px}
.admin-actions-wrap{flex-wrap:wrap;margin-top:12px}
summary{cursor:pointer;padding:14px 16px}
details.card{overflow:hidden}
details.card > *:not(summary){padding:0 16px 16px}
details.card[open] summary{border-bottom:1px solid var(--border)}
.tg-btn{margin-top:.6rem;display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:.7rem 1rem;border-radius:14px;border:1px solid #2AABEE;background:#2AABEE;color:#fff;font-weight:700;font-size:.95rem;box-shadow:0 8px 20px rgba(42,171,238,.25)}
.back-row{margin-top:20px}
.footer-line{color:var(--muted);font-size:13px;text-align:center;padding:22px 0 10px}
.flash-wrap{display:grid;gap:10px;margin:10px 0 18px}
.flash{padding:14px 16px;border-radius:18px;background:var(--card-strong);border:1px solid var(--border)}
.flash.success{border-left:4px solid #4caf50}
.flash.error{border-left:4px solid #e24f4f}
.flash.info{border-left:4px solid #5e90ff}

[data-reveal]{opacity:0;transform:translateY(16px) scale(.99);transition:opacity .45s ease,transform .45s ease}
[data-reveal].is-visible{opacity:1;transform:none}
.fade-in{animation:fade .35s ease-out}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@keyframes heroFadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes btnShine{from{transform:translateX(-125%)}to{transform:translateX(125%)}}
@keyframes primaryGlow{
  0%{box-shadow:0 10px 22px rgba(210,106,73,.18), 0 0 0 0 rgba(222,125,93,0)}
  50%{box-shadow:0 14px 28px rgba(210,106,73,.28), 0 0 24px rgba(239,177,137,.16)}
  100%{box-shadow:0 10px 22px rgba(210,106,73,.18), 0 0 0 0 rgba(222,125,93,0)}
}

@media (max-width: 980px){
  .menu-grid > *, .leaders-grid > *{grid-column:span 6}
  .hero,.assistant-hero{grid-template-columns:1fr}
}
@media (max-width: 760px){
  .container{width:min(100%,calc(100% - 16px))}
  .site-header{position:static;display:grid;grid-template-columns:1fr;gap:12px;padding-top:16px}
  .header-actions{width:100%;display:grid;grid-template-columns:48px 1fr;gap:10px}
  .header-actions .btn{width:100%}
  .hero-action-row,.menu-toolbar-top,.inline,.admin-actions-wrap{display:grid;grid-template-columns:1fr;width:100%}
  .menu-toolbar-head{grid-template-columns:1fr}
  .menu-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .menu-tab,.btn{width:100%}
  .menu-status-row,.menu-section-head,.section-title-row,.admin-category-head,.admin-order-row{display:grid;grid-template-columns:1fr;align-items:stretch}
  .menu-grid > *, .leaders-grid > *{grid-column:1 / -1}
  .admin-links{grid-template-columns:1fr}
  .thumb{height:180px}
}
@media (max-width: 560px){
  .title{font-size:17px}
  .subtitle{font-size:12px}
  .hero h1,.assistant-hero h1{font-size:34px;max-width:10ch}
  .menu-tabs{grid-template-columns:1fr}
  .menu-card-body{padding:13px}
  .menu-pill-row{display:grid}
  .logo{width:44px;height:44px;border-radius:16px}
}




.auth-shell{
  min-height:calc(100vh - 170px);
  display:grid;
  place-items:center;
  padding:22px 0 10px;
}
.auth-card{
  width:min(100%, 460px);
  padding:22px;
}
.auth-title{margin:10px 0 8px;letter-spacing:-.03em}
.auth-text{margin:0;color:var(--muted);line-height:1.6}
.auth-form{display:grid;gap:12px;margin-top:18px}
.auth-input{
  width:100%;
  min-height:48px;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  color:var(--text);
  font:inherit;
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.auth-input:focus{
  border-color:rgba(210,106,73,.40);
  box-shadow:0 0 0 4px rgba(210,106,73,.08);
}
.auth-error{
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(226,79,79,.28);
  background:rgba(226,79,79,.08);
  color:#ffb1b1;
  font-size:14px;
}
.auth-actions{display:grid;grid-template-columns:1fr;gap:10px}
.auth-note{margin-top:6px;font-size:13px;color:var(--muted);text-align:center}
.auth-status-box{
  position:relative;
  display:block;
  padding:24px 18px 18px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at top, rgba(124,92,255,.18), transparent 52%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  box-shadow:0 22px 50px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
  text-align:center;
}
.auth-status-box.is-success{
  border-color:rgba(25,199,181,.28);
  background:
    radial-gradient(circle at top, rgba(25,199,181,.16), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
}
.auth-status-orb{
  position:absolute;
  border-radius:50%;
  filter:blur(18px);
  opacity:.7;
  pointer-events:none;
}
.auth-status-orb-a{
  width:110px;height:110px;left:-24px;top:-24px;
  background:radial-gradient(circle, rgba(124,92,255,.45), transparent 70%);
}
.auth-status-orb-b{
  width:120px;height:120px;right:-26px;bottom:-38px;
  background:radial-gradient(circle, rgba(25,199,181,.34), transparent 70%);
}
.auth-status-spinner{
  width:42px;height:42px;margin:0 auto 16px;border-radius:50%;
  border:3px solid rgba(255,255,255,.14);border-top-color:#fff;
  box-shadow:0 0 0 6px rgba(124,92,255,.08);animation:authSpin .8s linear infinite;
}
.auth-status-check{
  display:none;width:52px;height:52px;margin:0 auto 14px;border-radius:50%;
  background:linear-gradient(135deg, rgba(25,199,181,.24), rgba(124,92,255,.18));
  border:1px solid rgba(255,255,255,.14);box-shadow:0 16px 36px rgba(0,0,0,.2);
  font-size:28px;font-weight:800;line-height:52px;color:#f7fffd;
}
.auth-status-title{position:relative;z-index:1;font-size:16px;font-weight:800;letter-spacing:.01em;color:#f7f8fc}
.auth-status-text{position:relative;z-index:1;margin-top:8px;font-size:14px;line-height:1.5;color:#d9e0f8}
.auth-status-box.is-success .auth-status-spinner{display:none}
.auth-status-box.is-success .auth-status-check{display:block;animation:authCheckPop .32s ease}
@keyframes authSpin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes authCheckPop{0%{opacity:0;transform:scale(.72)}70%{opacity:1;transform:scale(1.08)}100%{opacity:1;transform:scale(1)}}
@media (max-width: 560px){.auth-card{padding:18px}}