/* One dark look for the reader site and the admin: the reader site is a night-time relic. Colours live in :root so they can be changed in one place. */
:root{
  --bg:#0c0908; --panel:#151010; --card:#1e1715; --raise:#251c19; --line:#3a2d27; --ink:#efe3cc; --muted:#b09d88; --dim:#7d6b5b;
  --blood:#c3262e; --blood-deep:#8e1a1e; --gold:#d2a94f; --ok:#8cc796; --warn:#e7a94c; --violet:#b98be0;
  --f-d:"Tiro Bangla","Noto Serif Bengali",Georgia,serif; --f-b:"Hind Siliguri","Noto Sans Bengali",system-ui,sans-serif; --f-m:"IBM Plex Mono",ui-monospace,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-b);font-size:15px;line-height:1.5}
/* reader */
.mkw{display:flex;gap:8px;align-items:flex-end;padding:8px 12px 0;min-height:92px}
.mkb{width:74px;height:82px;flex:0 0 auto;cursor:pointer;animation:float 3.4s ease-in-out infinite}
.bub{flex:1;background:#2b1d2f;border:1px solid #5b3a74;color:#f1e4ff;border-radius:12px 12px 12px 2px;padding:8px 10px;font-size:13.5px;font-family:var(--f-d);min-height:40px}
.bub small{display:block;font-family:var(--f-b);color:#b79fd0;font-size:11px}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.mink .mk-eyes{transform-origin:60px 46px;animation:blink 4.2s infinite}@keyframes blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.mink .mk-tail{transform-origin:86px 100px;animation:tail 1.8s ease-in-out infinite}@keyframes tail{0%,100%{transform:rotate(0)}50%{transform:rotate(-12deg)}}
.view{padding:16px 16px 22px;flex:1;display:grid;gap:12px;align-content:start}
.menu{display:flex;gap:2px;padding:8px;border-top:1px solid var(--line);overflow-x:auto}
.menu button{flex:1 0 auto;font:inherit;font-size:12.5px;background:transparent;border:0;color:var(--muted);padding:6px 8px;border-radius:8px;cursor:pointer;white-space:nowrap}
.menu button[aria-current="true"]{background:var(--card);color:var(--ink)}
h2{font-family:var(--f-d);font-weight:400;font-size:25px;line-height:1.25;margin:0;text-wrap:balance}
h2.red{color:var(--blood)} h3{font-size:16px;margin:0}
p{margin:0}.muted{color:var(--muted)}.small{font-size:12.5px}.count{font-family:var(--f-m);font-size:12px;color:var(--muted)}
.btn{font:inherit;font-weight:600;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:9px 13px;border-radius:10px;cursor:pointer;text-align:center;text-decoration:none;display:inline-block}
.btn.red{background:var(--blood-deep);border-color:var(--blood-deep);color:#fff}.btn.gold{background:transparent;border-color:var(--gold);color:var(--gold)}.btn.sm{padding:5px 9px;font-size:12.5px;border-radius:8px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn:focus-visible,.menu button:focus-visible,.chip:focus-visible,.seg button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.nav button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.row>.btn{flex:1 1 130px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
input,select,textarea{font:inherit;width:100%;background:#0f0b0a;border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:8px 10px}
input[type=checkbox],input[type=radio]{width:auto}
input[type=range]{padding:0;accent-color:var(--blood)}
label.f{display:grid;gap:4px;font-size:13px;color:var(--muted)}
.ok{color:var(--ok)}.bad{color:#e0645f}.warn{color:var(--warn)}
.big{font-family:var(--f-m);font-size:28px;color:var(--gold);font-variant-numeric:tabular-nums}
.qibar{height:8px;background:#2a201c;border-radius:4px;overflow:hidden}.qibar i{display:block;height:100%;background:linear-gradient(90deg,#8e1a1e,#d2a94f)}
.scroll{display:flex;flex-wrap:wrap;gap:4px}.scroll span{min-width:40px;height:22px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;padding:0 5px;font-family:var(--f-d)}
.w-s{background:#2a201c}.w-a{background:#3b2a1c;color:#f3e0b6}.w-d{background:#120b09;color:#5a3a30}
.ev{background:linear-gradient(160deg,#241a17,#15100e);border:1px solid var(--line);border-radius:12px;padding:12px;display:grid;gap:6px;cursor:pointer;text-align:left;color:var(--ink);font:inherit}
.ev:hover{border-color:var(--gold)}
.etag{font-family:var(--f-m);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;padding:2px 7px;border-radius:4px;background:#2a201c;color:var(--muted);justify-self:start}
.etag.awareness{color:#9fb7e6}.etag.promotion{color:var(--gold)}.etag.quest{color:var(--ok)}.etag.vow{color:var(--violet)}.etag.contest{color:#e0645f}.etag.collective{color:#e7a94c}
.ev h3{font-family:var(--f-d);font-weight:400;font-size:18px}
.blk img,.blk video{width:100%;border-radius:8px;display:block}
.media{background:#0f0b0a;border:1px dashed var(--line);border-radius:8px;padding:18px;text-align:center;color:var(--muted);font-size:13px}
.wgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.wcard{background:#0f0b0a;border:1px solid var(--line);border-radius:10px;padding:6px 4px;text-align:center;cursor:pointer;color:var(--ink);font:inherit}
.wcard[aria-pressed="true"]{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold) inset}
.wcard .wi{height:100px;width:34px;margin:0 auto}.wcard b{display:block;font-family:var(--f-d);font-weight:400;font-size:12.5px}
.names{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.pick{font:inherit;font-family:var(--f-d);font-size:14.5px;background:#0f0b0a;border:1px solid var(--line);color:var(--ink);padding:7px 4px;border-radius:8px;cursor:pointer}
.pick[aria-pressed="true"]{border-color:var(--gold);color:var(--gold)}
.sgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.scard{background:#0f0b0a;border:1px solid var(--line);border-radius:10px;padding:8px;display:flex;gap:8px;align-items:center;cursor:pointer;color:var(--ink);font:inherit;text-align:left}
.scard[aria-pressed="true"]{border-color:var(--gold)}.scard .si{width:36px;height:36px;flex:0 0 auto}.scard b{font-family:var(--f-d);font-weight:400}
.thumb{width:140px;height:170px;margin:6px auto;border-radius:50%/45%;border:2px solid var(--blood);display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative;user-select:none;-webkit-user-select:none;touch-action:none}
.thumb .fill{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle,rgba(195,38,46,.55),transparent 70%);transform:scale(0);transition:transform .9s}
.thumb.on .fill{transform:scale(1)}.thumb span{position:relative;font-family:var(--f-d);color:var(--blood)}
.idc{background:linear-gradient(170deg,#241a16,#0e0a09);border:1px solid #4a3a28;border-radius:14px;padding:12px;display:grid;grid-template-columns:80px 1fr;gap:12px;align-items:center}
.idc .wv{height:230px}.idc .nm{font-family:var(--f-d);font-size:24px;color:var(--gold)}.idc .rk{font-family:var(--f-d);color:#e0645f;font-size:14px}
.kv{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;font-size:13px}.kv span{color:var(--muted)}
.chl{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}
.chl button{font:inherit;font-family:var(--f-m);font-size:12px;background:#1b1412;border:1px solid var(--line);color:var(--muted);border-radius:6px;padding:6px 0;cursor:pointer}
.chl button.done{background:#3b2a1c;color:#f3e0b6;border-color:#5a4030}.chl button.line{box-shadow:inset 0 -3px 0 var(--blood)}.chl button.done.line{box-shadow:inset 0 -3px 0 var(--gold)}
.voucher{position:relative;overflow:hidden;background:linear-gradient(135deg,#3a1414,#1a0c0c);border:1px solid var(--gold);border-radius:14px;padding:16px;text-align:center;display:grid;gap:6px}
.voucher .seal{width:70px;height:70px;margin:0 auto;border-radius:50%;background:radial-gradient(circle,#c3262e,#6e1015);color:#f3d9b0;display:flex;align-items:center;justify-content:center;font-family:var(--f-d);font-size:30px;animation:spin 6s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.voucher .code{font-family:var(--f-m);font-size:20px;letter-spacing:.12em;color:var(--gold)}
.chip{font:inherit;font-size:12.5px;background:var(--card);border:1px solid var(--line);color:var(--ink);padding:5px 10px;border-radius:999px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--blood-deep);border-color:var(--blood-deep);color:#fff}
.chip:disabled{opacity:.4;cursor:not-allowed}
/* admin */
.agrid{display:grid;grid-template-columns:200px minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:820px){.agrid{grid-template-columns:minmax(0,1fr)}}
.nav{display:grid;gap:3px;position:sticky;top:70px}
@media (max-width:820px){.nav{position:static;grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}}
.nav button{font:inherit;text-align:left;background:transparent;border:1px solid transparent;color:var(--muted);padding:8px 10px;border-radius:8px;cursor:pointer;display:flex;justify-content:space-between;gap:6px}
.nav button[aria-current="true"]{background:var(--card);border-color:var(--line);color:var(--ink)}
.nav .n{font-family:var(--f-m);font-size:11px;color:var(--gold)}
.work{display:grid;gap:14px;min-width:0}
.work h2{font-size:24px}
.tw{overflow-x:auto;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
table{border-collapse:collapse;width:100%;font-size:13.5px}
th,td{text-align:left;padding:7px 9px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--f-m);font-size:11px;font-weight:500;letter-spacing:.05em;color:var(--muted);background:#120d0c}
td .bn{font-family:var(--f-d)}
td input,td select{padding:4px 6px;font-size:13px}
.pill{font-family:var(--f-m);font-size:10.5px;padding:2px 7px;border-radius:999px;background:#2a201c;color:var(--muted);white-space:nowrap}
.pill.live{background:#1f3322;color:var(--ok)}.pill.draft{background:#2a201c;color:var(--muted)}.pill.scheduled{background:#3a3020;color:var(--gold)}.pill.paused{background:#3b2c16;color:var(--warn)}.pill.ended{background:#241d1a;color:var(--dim)}
.pill.pending{background:#3a3020;color:var(--gold)}.pill.approved{background:#1f3322;color:var(--ok)}.pill.rejected{background:#3b1d1c;color:#e0645f}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px}.tile b{display:block;font-family:var(--f-m);font-size:24px;font-weight:500;font-variant-numeric:tabular-nums}.tile span{font-size:12.5px;color:var(--muted)}
.wiz{display:grid;grid-template-columns:190px minmax(0,1fr);gap:14px}
@media (max-width:700px){.wiz{grid-template-columns:minmax(0,1fr)}}
.steps{display:grid;gap:4px;align-content:start}
.steps button{font:inherit;font-size:13px;text-align:left;background:var(--panel);border:1px solid var(--line);color:var(--muted);padding:7px 9px;border-radius:8px;cursor:pointer}
.steps button[aria-current="true"]{border-color:var(--gold);color:var(--ink)}
.steps button.skip{opacity:.4}
.form{display:grid;gap:10px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px}
.form .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.form .three{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:560px){.form .two,.form .three{grid-template-columns:minmax(0,1fr)}}
.dep{border-left:2px solid var(--gold);padding-left:10px;display:grid;gap:8px}
.gate{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:6px;align-items:center}
.blkrow{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:6px;align-items:start}
@media (max-width:560px){.blkrow,.gate{grid-template-columns:minmax(0,1fr)}}
.qr{width:120px;height:120px;background:#fff;padding:6px;border-radius:6px}.qr img,.qr svg{width:100%;height:100%;display:block}
.summary{font-size:13px;color:var(--muted);white-space:pre-wrap;font-family:var(--f-m);background:#0b0807;border:1px solid var(--line);border-radius:8px;padding:10px}
.hint{font-size:12px;color:var(--dim)}
@media (prefers-reduced-motion:reduce){.mkb,.voucher .seal,.mink .mk-eyes,.mink .mk-tail{animation:none}.thumb .fill{transition:none}}

/* ---------- reader app shell (phone-first, full screen) ---------- */
.app{max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 0%,#241412 0%,#0e0a09 60%);position:relative}
.bar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top));border-bottom:1px solid var(--line);font-size:12px;color:var(--muted);background:rgba(12,9,8,.92);backdrop-filter:blur(6px)}
.bar b{font-family:var(--f-d);font-weight:400;color:var(--blood);font-size:18px}
.bar .me{font-family:var(--f-d);color:var(--gold);font-size:14px;background:none;border:0;cursor:pointer;padding:0}
.view{padding:16px 16px 96px}
.menu{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;display:flex;gap:2px;padding:8px 8px max(8px,env(safe-area-inset-bottom));border-top:1px solid var(--line);background:rgba(12,9,8,.96);z-index:10}
.toast{position:fixed;left:50%;transform:translateX(-50%);width:calc(100% - 32px);max-width:448px;bottom:76px;background:#2a1d18;border:1px solid var(--gold);color:var(--ink);padding:10px 12px;border-radius:10px;font-size:13.5px;z-index:30}
.loading{color:var(--muted);text-align:center;padding:40px 0}
.lines{display:grid;gap:6px}.lines .ln{border-left:2px solid var(--blood-deep);padding:4px 8px;font-family:var(--f-d)}.lines .ln small{display:block;color:var(--muted);font-family:var(--f-b)}
.night{background:radial-gradient(ellipse at 50% 30%,#3a0c0e,#0a0606 70%);text-align:center}
.foot{font-size:11.5px;color:var(--dim);text-align:center;padding:10px 0 0}
.foot a{color:var(--muted)}
a{color:var(--gold)}
.media-blk{width:100%;border-radius:8px;display:block}
/* ---------- admin shell ---------- */
.atop{position:sticky;top:0;z-index:20;display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 16px;background:#0a0707;border-bottom:1px solid var(--line)}
.atop .brand{font-family:var(--f-d);font-size:20px;color:var(--blood)}
.atop .brand small{font-family:var(--f-m);font-size:11px;color:var(--muted);margin-left:8px;letter-spacing:.08em}
.apage{max-width:1240px;margin:0 auto;padding:16px 16px 40px}
.msg{position:fixed;right:16px;bottom:16px;max-width:360px;z-index:40}
.msg .card{margin-top:8px;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.msg .card.err{border-color:#e0645f}
.atop .row>.btn{flex:0 0 auto}