/* admin panel + announcement bar + small plan bits */
#adm{border:0;padding:0;background:transparent;color:var(--ink);width:min(980px,calc(100% - 20px));height:min(780px,calc(100% - 20px));margin:auto;overflow:visible}
#adm::backdrop{background:rgba(10,8,12,.72)}
.admwrap{height:100%;display:flex;flex-direction:column;border-radius:28px;overflow:hidden;background:rgba(24,21,42,.97);border:1px solid var(--edge);box-shadow:inset 0 1px 0 var(--hi),0 40px 100px rgba(0,0,0,.6)}
.admtop{display:flex;align-items:center;gap:12px;padding:18px 22px 10px}
.admtop h2{font-size:21px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.admtop small{color:var(--mute);font-size:12.5px;word-break:break-all}
.admtop > div{margin-right:auto;min-width:0}
.admtop .x{position:static;flex:0 0 auto;width:38px;height:38px;font-size:22px}
.admtabs{padding:0 22px 12px;overflow-x:auto}
.admtabs .seg{flex-wrap:nowrap;border-radius:999px}
.admtabs .seg button{white-space:nowrap}
.admbody{flex:1;overflow:auto;padding:6px 22px 26px}
.ash{font-size:15px;font-weight:700;margin:26px 0 10px;color:var(--soft)}
.amuted{color:var(--mute);font-size:13.5px;line-height:1.5;margin:12px 0}
.mono{font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:.04em}

.btn.sm{padding:8px 14px;font-size:13.5px}
.btn.danger{background:rgba(255,90,90,.14);border:1px solid rgba(255,120,120,.4);color:#ffc4c4}
.btn.danger:hover{background:rgba(255,90,90,.26)}
.admdel{color:#ffc4c4}

.arowf{display:flex;gap:10px;align-items:center}
.arowf.wrap{flex-wrap:wrap}
.arowf.tight{gap:6px}
.arowf .afield{flex:1;min-width:0}
.asel{padding:10px 14px;border-radius:14px;font-size:14px;background:rgba(255,255,255,.06)}
.asel option{color:#111}
.agrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}
.alab{display:flex;flex-direction:column;gap:6px;flex:1;min-width:0;font-size:12.5px;color:var(--mute)}
.alab .afield{font-size:14.5px}
.acreate{display:flex;flex-direction:column;gap:12px}
.acreate textarea.afield{resize:vertical;font-family:inherit}
.acheck{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:var(--glass);border:1px solid var(--edge);cursor:pointer}
.acheck input{margin-top:3px;width:18px;height:18px;accent-color:#fff;flex:0 0 auto}
.acheck b{display:block;font-size:14.5px}
.acheck small{display:block;margin-top:2px;color:var(--mute);font-size:13px;line-height:1.45}

.astats3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.astat{padding:16px 14px;border-radius:18px;background:var(--glass);border:1px solid var(--edge)}
.astat b{display:block;font-size:28px;font-weight:700;letter-spacing:-.02em}
.astat span{font-size:12.5px;color:var(--mute)}

.alist{margin-top:12px;display:flex;flex-direction:column;gap:8px}
.arow{border-radius:18px;background:var(--glass);border:1px solid var(--edge);overflow:hidden}
.arow.on{background:var(--glass-2)}
.ahead{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;text-align:left}
button.ahead:hover{background:var(--glass)}
.ahead.static{flex-wrap:wrap}
.av{flex:0 0 auto;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:var(--glass-3)}
.who{flex:1;min-width:0;display:flex;flex-direction:column}
.who b{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.who small{font-size:12.5px;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.when{font-size:12.5px;color:var(--mute);white-space:nowrap}
.chip{flex:0 0 auto;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--glass-2);border:1px solid var(--edge);color:var(--soft);white-space:nowrap}
.chip.pro{background:rgba(120,220,160,.16);border-color:rgba(120,220,160,.45);color:#c8f5d9}
.chip.bad{background:rgba(255,90,90,.16);border-color:rgba(255,120,120,.45);color:#ffc4c4}
.thumb2{flex:0 0 auto;width:34px;aspect-ratio:2/3;border-radius:6px;background:rgba(255,255,255,.08) center/cover}
.apanel{padding:4px 16px 18px;border-top:1px solid var(--edge)}
.apanel h4{font-size:13px;font-weight:700;color:var(--soft);margin:18px 0 10px}
.ainfo{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:14px}
.ainfo span{display:block;font-size:12px;color:var(--mute)}
.ainfo b{display:block;font-size:13.5px;font-weight:600;word-break:break-all}
.alog{display:flex;flex-direction:column;border-radius:18px;background:var(--glass);border:1px solid var(--edge)}
.alog > div{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;padding:11px 16px;font-size:13.5px}
.alog > div + div{border-top:1px solid var(--edge)}
.alog span{color:var(--soft);word-break:break-all}
.alog small{color:var(--mute);margin-left:auto;font-size:12px}

.atoast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:10;max-width:calc(100% - 32px);
  padding:11px 18px;border-radius:999px;background:#fff;color:var(--bg);font-size:14px;font-weight:600;box-shadow:0 12px 40px rgba(0,0,0,.5);animation:up .25s both}
.atoast.bad{background:#ffb4b4}

#rbnote{position:fixed;z-index:19;left:50%;transform:translateX(-50%);top:calc(76px + env(safe-area-inset-top,0px));width:min(760px,calc(100% - 24px));
  display:flex;align-items:center;gap:12px;padding:10px 12px 10px 18px;border-radius:999px;font-size:14px;line-height:1.35;
  background:rgba(22,19,28,.78);border:1px solid var(--edge);box-shadow:var(--lift);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur)}
#rbnote span{flex:1}
#rbnote button{flex:0 0 auto;width:28px;height:28px;border-radius:50%;font-size:18px;line-height:1;background:var(--glass-2)}

.planline{margin-top:10px}
.planline .chip{display:inline-block}
.redeem{margin-top:18px;text-align:left}
.redeem h3{font-size:14px;font-weight:700;margin-bottom:8px}
.redeem .arowf .afield{text-transform:uppercase}
.redeem .arowf .btn{margin:0}
.rmsg{margin-top:10px;font-size:13.5px;color:var(--soft)}
.rmsg.bad{color:#ffb4b4}

@media(max-width:720px){
  #adm{width:100%;height:100%}
  .admwrap{border-radius:0;border:0}
  .astats3{grid-template-columns:repeat(2,1fr)}
  .agrid{grid-template-columns:1fr}
  .when{display:none}
  .admtop,.admtabs,.admbody{padding-left:14px;padding-right:14px}
  #rbnote{top:calc(66px + env(safe-area-inset-top,0px));border-radius:20px}
}
/* redeem box on the Subscription screen: the field takes the room, the button stays its natural size */
.redeem .arowf{gap:8px}
.redeem .arowf .afield{flex:1 1 auto;min-width:0;width:auto;text-align:left;letter-spacing:.06em}
.redeem .arowf .btn{flex:0 0 auto;width:auto;margin:0;padding:12px 20px;justify-content:center}
