/* ---------- admin console (glass) ---------- */
#admin-root{max-width:1320px; display:flex; flex-direction:column; gap:20px}
.adm-head{display:flex; justify-content:space-between; align-items:flex-end; gap:20px; flex-wrap:wrap}
.adm-head h2{font-size:clamp(24px,2.6vw,32px)} .adm-head p{margin:4px 0 0; color:var(--dim)}
.adm-tabs{display:flex; flex-wrap:wrap; gap:7px; padding:6px; border-radius:18px; background:var(--glass); border:1px solid rgba(255,255,255,.85); box-shadow:var(--edge), 0 0 0 1px var(--hair)}
.adm-tabs .tab{margin:0; border-color:transparent; background:transparent; box-shadow:none}
.adm-tabs .tab.active{background:var(--ink); color:var(--acc)}
#adm-body{display:flex; flex-direction:column; gap:18px}

.kpi-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px}
.kpi-grid.small{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.kpi{background:var(--glass); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur); border:1px solid rgba(255,255,255,.85); border-radius:20px; padding:16px 18px; box-shadow:var(--edge), var(--lift), 0 0 0 1px var(--hair); display:flex; flex-direction:column; gap:3px}
.kpi span{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--dim)}
.kpi b{font-family:var(--display); font-size:26px; letter-spacing:-.05em; font-weight:600}
.kpi small{color:var(--dim); font-size:12px; line-height:1.4}
.kpi.hot{background:linear-gradient(160deg,rgba(255,255,255,.9),rgba(225,255,150,.6)); box-shadow:var(--edge), var(--lift), 0 0 0 1px rgba(100,170,0,.5)}
.adm-two{display:grid; grid-template-columns:1fr 1fr; gap:16px} .adm-three{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
@media(max-width:1000px){.adm-two,.adm-three{grid-template-columns:1fr}}
.panel h3 small{font-family:var(--mono); font-weight:400; font-size:11px; color:var(--dim); letter-spacing:.04em; margin-left:6px}
.spark{width:100%; height:92px; display:block} .spark-gap{height:8px}
.legend{display:flex; gap:12px; align-items:center; font-size:12px; color:var(--dim)} .legend i{width:10px; height:10px; border-radius:3px; display:inline-block}
.bar-row{display:grid; grid-template-columns:90px 1fr auto auto; gap:10px; align-items:center; font-size:13px; padding:5px 0}
.bar-row .bar{height:9px; border-radius:9px; background:rgba(11,14,20,.08); overflow:hidden} .bar-row .bar i{display:block; height:100%; background:linear-gradient(90deg,var(--acc-2),var(--acc)); box-shadow:0 0 12px rgba(184,255,44,.7); border-radius:9px}
.bar-row b{font-family:var(--mono); font-weight:500} .bar-row em{font-style:normal; color:var(--dim); font-size:12px}
.panel a{color:var(--ink); font-weight:600; text-decoration:underline; text-decoration-color:var(--acc); text-underline-offset:3px}

.adm-toolbar{display:flex; flex-wrap:wrap; gap:10px; align-items:center}
.adm-toolbar input[type=text]{flex:1; min-width:220px} .adm-toolbar select{min-width:150px}
.table-panel{padding:0; overflow:hidden}
.table-panel h3{padding:18px 20px 0}
.admin-table{font-size:13.5px} .admin-table th{white-space:nowrap}
.admin-table tr.clickable{cursor:pointer; transition:background .12s} .admin-table tr.clickable:hover{background:rgba(184,255,44,.18)}
.admin-table td{vertical-align:middle}
.admin-table.edit td{padding:6px 8px} .admin-table.edit input[type=text],.admin-table.edit textarea{width:100%; padding:7px 10px; font-size:13px}
.adm-pager{display:flex; gap:10px; align-items:center; padding:12px 18px; justify-content:space-between}
.plan-badge.sm{font-size:11px; padding:2px 10px}
.pillx.c{margin-left:4px}
.mini.danger,.btn.danger{color:var(--danger)} .mini.danger:hover{background:var(--danger); color:#fff}
.btn.danger{border-color:rgba(229,56,79,.4)}

/* user drawer */
.adm-drawer{position:fixed; top:0; right:0; bottom:0; width:min(560px,100vw); z-index:250; background:rgba(246,248,251,.92); -webkit-backdrop-filter:blur(28px) saturate(1.4); backdrop-filter:blur(28px) saturate(1.4);
  border-left:1px solid rgba(255,255,255,.9); box-shadow:-30px 0 80px rgba(11,14,20,.2); transform:translateX(105%); transition:transform .32s cubic-bezier(.2,.9,.3,1); overflow-y:auto; display:flex; flex-direction:column}
.adm-drawer.open{transform:none}
.dr-head{display:flex; justify-content:space-between; gap:14px; padding:22px 24px 14px; position:sticky; top:0; background:rgba(246,248,251,.95); z-index:2; border-bottom:1px solid var(--hair)}
.dr-title{display:flex; gap:14px; align-items:center} .dr-title h3{font-size:20px}
.icon-close{background:rgba(255,255,255,.8); border:1px solid var(--hair2); width:36px; height:36px; border-radius:12px; font-size:22px; cursor:pointer; color:var(--ink)}
.icon-close:hover{background:var(--acc)}
.dr-body{padding:6px 24px 40px; display:flex; flex-direction:column; gap:6px}
.dr-body section{padding:14px 0; border-bottom:1px solid var(--hair)} .dr-body section:last-child{border:0}
.dr-body h4{font-family:var(--mono); font-size:11px; text-transform:uppercase; letter-spacing:.12em; color:var(--dim); font-weight:500; margin:0 0 10px} .dr-body h4 small{text-transform:none; letter-spacing:0; margin-left:6px}
.dr-plan{display:flex; gap:10px; align-items:center; margin-bottom:10px}
.dr-actions{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-top:10px}
.dr-actions input,.dr-actions select{padding:7px 10px; font-size:13px; width:auto; max-width:150px}
.mini-gallery{display:grid; grid-template-columns:repeat(auto-fill,minmax(74px,1fr)); gap:8px}
.mini-gallery img,.mg-item img{width:100%; aspect-ratio:1; object-fit:cover; border-radius:12px; border:1px solid var(--hair2); display:block}
.mg-item{padding:0; border:0; background:none; cursor:pointer; transition:transform .15s} .mg-item:hover{transform:scale(1.06)} .mg-item.off{opacity:.35}
body.drawer-open #adm-body{filter:saturate(.9)}

/* brewing feed */
.brew-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px}
.brew-card{position:relative; border-radius:18px; overflow:hidden; background:#fff; border:1px solid rgba(255,255,255,.9); box-shadow:var(--lift), 0 0 0 1px var(--hair); cursor:pointer; transition:transform .2s, box-shadow .2s}
.brew-card:hover{transform:translateY(-3px); box-shadow:var(--lift-hi), 0 0 0 1px rgba(100,170,0,.5)}
.brew-card.off{opacity:.4}
.brew-card img{width:100%; aspect-ratio:1; object-fit:cover; display:block}
.brew-meta{display:flex; gap:8px; align-items:center; padding:8px 10px; font-size:12px; flex-wrap:wrap} .brew-meta b{font-weight:700} .brew-meta span{color:var(--dim)} .brew-meta em{font-style:normal; margin-left:auto; font-family:var(--mono); color:var(--dim)}
.flag{position:absolute; top:8px; left:8px; font-style:normal; font-family:var(--mono); font-size:10px; background:var(--danger); color:#fff; padding:2px 8px; border-radius:8px} .flag.hid{left:auto; right:8px; background:var(--ink); color:var(--acc)}
.brew-check{position:absolute; top:8px; left:8px; width:22px; height:22px; accent-color:#0B0E14}
.bulkbar{display:flex; gap:10px; align-items:center; padding:10px 14px; border-radius:16px; background:var(--ink); color:#fff; position:sticky; top:70px; z-index:5} .bulkbar .mini{color:var(--ink)}
.modal-card.wide{width:min(980px,100%)}
.lb{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:22px} @media(max-width:800px){.lb{grid-template-columns:1fr}}
.lb img{width:100%; border-radius:18px; border:1px solid var(--hair2); display:block; max-height:70vh; object-fit:contain; background:#fff}
.lb-side{display:flex; flex-direction:column; gap:12px} .lb-side h4{margin:4px 0 0; font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--dim); font-weight:500}
.prompt-box{background:rgba(255,255,255,.7); border:1px solid var(--hair2); border-radius:14px; padding:12px 14px; font-size:13px; line-height:1.55; max-height:260px; overflow-y:auto; white-space:pre-wrap; word-break:break-word}

/* memes + styles */
.adm-form{display:flex; flex-direction:column; gap:10px; max-width:640px}
.meme-admin-grid,.style-admin-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:16px}
.style-admin-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}
.meme-card,.style-card{background:var(--glass); -webkit-backdrop-filter:var(--blur); backdrop-filter:var(--blur); border:1px solid rgba(255,255,255,.85); border-radius:20px; padding:12px; box-shadow:var(--edge), var(--lift), 0 0 0 1px var(--hair); display:flex; flex-direction:column; gap:9px}
.meme-card.off,.style-card.off{opacity:.55}
.meme-thumb,.style-thumb{position:relative; border-radius:14px; overflow:hidden; aspect-ratio:1; background:#E7EAF0} .meme-thumb img,.style-thumb img{width:100%; height:100%; object-fit:cover; display:block}
.meme-thumb .pillx,.style-thumb .pillx{position:absolute; left:6px; bottom:6px} .meme-thumb .c{left:auto; right:6px}
.meme-card input[type=text],.meme-card textarea{padding:7px 10px; font-size:13px; width:100%}
.meme-actions{display:flex; gap:7px; align-items:center; flex-wrap:wrap}
.toggle{display:inline-flex; align-items:center; gap:9px; font-weight:600; font-size:13px; cursor:pointer; user-select:none}
.toggle input{display:none} .toggle span{width:38px; height:22px; border-radius:22px; background:rgba(11,14,20,.2); position:relative; transition:background .18s; flex:0 0 auto}
.toggle span::after{content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.3); transition:transform .18s}
.toggle input:checked + span{background:var(--ink)} .toggle input:checked + span::after{transform:translateX(16px); background:var(--acc)}

/* settings */
.plan-edit-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; margin:12px 0}
.plan-edit{background:rgba(255,255,255,.6); border:1px solid var(--hair2); border-radius:18px; padding:16px; display:flex; flex-direction:column; gap:10px} .plan-edit h4{font-size:17px; margin:0}
.two{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.pack-row{display:flex; gap:8px; align-items:center; flex-wrap:wrap; padding:5px 0; font-size:13px} .pack-row input{padding:7px 10px; font-size:13px; width:110px} .pack-row input[type=number]{width:84px}
.panel h4{margin:16px 0 4px; font-size:15px}

.adm-toast{position:fixed; left:50%; bottom:26px; transform:translate(-50%,40px); opacity:0; background:var(--ink); color:var(--acc); padding:11px 22px; border-radius:999px; font-weight:600; font-size:14px; z-index:400; box-shadow:0 14px 40px rgba(11,14,20,.35); transition:.28s cubic-bezier(.2,.9,.3,1); pointer-events:none}
.adm-toast.show{opacity:1; transform:translate(-50%,0)} .adm-toast.bad{background:var(--danger); color:#fff}

/* announcement banner (all members) */
.announce{display:flex; gap:12px; align-items:center; justify-content:center; padding:10px 18px; margin:10px 30px 0 8px; border-radius:16px; background:var(--ink); color:#fff; font-size:14px; font-weight:500; box-shadow:0 12px 30px rgba(11,14,20,.22)}
.announce::before{content:""; width:9px; height:9px; border-radius:50%; background:var(--acc); box-shadow:0 0 12px var(--acc); flex:0 0 auto}
.announce button{margin-left:6px; background:transparent; border:0; color:#9AA3B2; cursor:pointer; font-size:18px}
.announce.maint{background:var(--acc); color:var(--ink)} .announce.maint::before{background:var(--ink); box-shadow:none}

#adm-body > .panel,#adm-body > .table-panel,#adm-body > .adm-toolbar{align-self:stretch; width:100%}
.adm-two > .panel,.adm-three > .panel{align-self:stretch}
.two input,.two select{min-width:0; width:100%}
.plan-edit input[type=number]{width:100%}