/* ADIFY.pk theme: dark navy, neon blue borders, golden buttons, glowing cards */
:root { --bg:#050d2b; --bg2:#081445; --card:#0a1a52; --line:#1d4ed8; --txt:#f1f5f9; --mute:#9db4e8;
        --blue:#2563eb; --sky:#38bdf8; --green:#10b981; --amber:#f59e0b; --red:#ef4444; --purple:#a855f7;
        --gold1:#fde047; --gold2:#f59e0b; --neon:#2f8bff; --glow:0 0 0 1px rgba(47,139,255,.55), 0 0 18px rgba(47,139,255,.35); }
* { box-sizing:border-box; margin:0; padding:0; font-family:'Segoe UI',system-ui,-apple-system,Roboto,sans-serif; }
html { scroll-behavior:smooth; }
body { background:radial-gradient(1200px 600px at 80% -10%,#10308a 0%,transparent 60%),radial-gradient(900px 500px at -10% 30%,#0b2a7a 0%,transparent 55%),var(--bg);
       background-attachment:fixed; color:var(--txt); padding:0; line-height:1.45; font-size:14px; min-height:100vh; }
a { color:var(--sky); }
h2 { font-size:18px; color:#fff; } h3 { font-size:15px; color:var(--gold1); margin-bottom:10px; padding-bottom:8px; border-bottom:1px solid rgba(47,139,255,.35); }
.wrap { max-width:1000px; margin:0 auto; padding:12px; }
.topbar { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:14px; flex-wrap:wrap; }

/* cards */
.card { background:linear-gradient(160deg,rgba(14,36,110,.92),rgba(6,16,60,.95)); border:1px solid rgba(47,139,255,.6); border-radius:14px; padding:14px;
        margin-bottom:14px; box-shadow:var(--glow); transition:transform .25s, box-shadow .25s; }
.card:hover { box-shadow:0 0 0 1px rgba(80,160,255,.9), 0 0 26px rgba(47,139,255,.5); }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.grid-tasks { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:12px; }
@media (max-width:640px){ .grid2 { grid-template-columns:1fr; } }

/* forms */
label { display:block; font-size:12px; color:#cfe0ff; margin-bottom:3px; font-weight:600; }
input, select, textarea { width:100%; padding:10px; margin-bottom:10px; background:#06103a; color:var(--txt); border:1px solid rgba(47,139,255,.55); border-radius:8px; font-size:14px; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--gold1); box-shadow:0 0 0 3px rgba(253,224,71,.2); }
input[type=checkbox] { width:auto; }
button:focus-visible, .btn:focus-visible, a:focus-visible { outline:2px solid var(--gold1); outline-offset:2px; }

/* buttons: golden by default */
button, .btn { display:inline-block; background:linear-gradient(180deg,var(--gold1),var(--gold2)); color:#1b1400; border:0; border-radius:10px; padding:10px 16px;
               font-weight:800; font-size:13px; cursor:pointer; text-decoration:none; text-align:center; box-shadow:0 3px 12px rgba(245,158,11,.35); transition:transform .15s, filter .15s; }
button:hover, .btn:hover { transform:translateY(-1px); filter:brightness(1.07); }
button:disabled { filter:grayscale(.8) brightness(.7); cursor:not-allowed; transform:none; }
.btn-block { display:block; width:100%; }
.btn-green { background:linear-gradient(180deg,#34d399,#059669); color:#fff; box-shadow:0 3px 12px rgba(16,185,129,.4); }
.btn-red { background:linear-gradient(180deg,#f87171,#dc2626); color:#fff; box-shadow:0 3px 12px rgba(239,68,68,.4); }
.btn-purple { background:linear-gradient(180deg,#c084fc,#7e22ce); color:#fff; box-shadow:0 3px 12px rgba(168,85,247,.4); }
.btn-gray { background:linear-gradient(180deg,#3b5bb5,#1e3a8a); color:#fff; box-shadow:none; }
.btn-sm { padding:6px 11px; font-size:12px; border-radius:8px; }

.flash { padding:11px 14px; border-radius:10px; margin-bottom:12px; font-size:13px; border:1px solid; }
.flash.ok { background:rgba(5,46,36,.85); border-color:#10b981; color:#6ee7b7; }
.flash.err { background:rgba(59,13,13,.85); border-color:#ef4444; color:#fca5a5; }
.tag { display:inline-block; font-size:11px; padding:2px 8px; border-radius:20px; background:#0c4a6e; color:#bae6fd; font-weight:700; }
.tag.ok { background:#065f46; color:#a7f3d0; } .tag.warn { background:#78350f; color:#fde68a; }
.tag.err { background:#7f1d1d; color:#fecaca; } .tag.info { background:#1e3a8a; color:#bfdbfe; } .tag.mute { background:#1e293b; color:#cbd5e1; }
.muted { color:var(--mute); font-size:12px; } .big { font-size:24px; font-weight:800; }
.scroll { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:12px; }
th, td { border-bottom:1px solid rgba(47,139,255,.25); padding:8px 9px; text-align:left; vertical-align:top; }
th { background:linear-gradient(180deg,#1d4ed8,#12338f); color:#fff; font-weight:700; white-space:nowrap; }
tr:hover td { background:rgba(47,139,255,.08); }
.row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
details summary { cursor:pointer; color:var(--gold1); font-size:12px; margin-top:6px; font-weight:700; }

/* ---------- app shell ---------- */
.hdr { position:sticky; top:0; z-index:40; display:flex; align-items:center; gap:12px; padding:10px 16px; background:linear-gradient(90deg,#071a5c,#0b2a86 50%,#071a5c);
       border-bottom:2px solid var(--neon); box-shadow:0 4px 24px rgba(47,139,255,.35); }
.logo { display:flex; align-items:center; gap:9px; text-decoration:none; color:#fff; }
.logo img { width:44px; height:44px; filter:drop-shadow(0 0 8px rgba(56,189,248,.8)); }
.logo b { display:block; font-size:24px; font-style:italic; letter-spacing:.5px; line-height:1; } .logo b i { color:var(--gold2); font-style:italic; }
.logo small { display:block; font-size:10px; color:var(--gold1); font-style:italic; }
.burger { background:transparent; box-shadow:none; color:#fff; font-size:24px; padding:4px 10px; }
.pill { margin:0 auto; padding:9px 26px; border-radius:30px; border:2px solid var(--gold1); background:rgba(5,13,43,.7); color:var(--gold1); font-weight:800; font-style:italic; font-size:18px; box-shadow:0 0 16px rgba(253,224,71,.4); text-align:center; }
.hdr-r { display:flex; align-items:center; gap:10px; margin-left:auto; }
.pill + .hdr-r { margin-left:0; }
.wallet { border:2px solid var(--gold1); border-radius:12px; padding:7px 14px; font-weight:800; color:#fff; background:rgba(5,13,43,.7); text-decoration:none; white-space:nowrap; box-shadow:0 0 14px rgba(253,224,71,.3); }
.wallet span { color:var(--gold1); }
.bell { position:relative; text-decoration:none; font-size:22px; } .bell i { position:absolute; top:-6px; right:-8px; background:var(--red); color:#fff; border-radius:10px; font-size:10px; padding:1px 6px; font-style:normal; font-weight:800; }
.who { color:#fff; font-weight:700; font-size:13px; } .who a { color:var(--mute); font-weight:600; margin-left:6px; font-size:12px; }

.layout { display:grid; grid-template-columns:230px minmax(0,1fr); gap:16px; padding:16px; align-items:start; max-width:1700px; margin:0 auto; }
.layout.rails { grid-template-columns:230px minmax(0,1fr) 200px; }
body.nosb .layout { grid-template-columns:minmax(0,1fr); } body.nosb .layout.rails { grid-template-columns:minmax(0,1fr) 200px; } body.nosb .side { display:none; }
.side { position:sticky; top:84px; background:linear-gradient(180deg,rgba(8,24,86,.95),rgba(4,10,40,.97)); border:1px solid rgba(47,139,255,.6); border-radius:16px; padding:12px; box-shadow:var(--glow); max-height:calc(100vh - 100px); overflow-y:auto; }
.side a { display:flex; align-items:center; gap:10px; padding:10px 11px; margin-bottom:5px; color:#e8f0ff; text-decoration:none; font-weight:700; font-size:13px; border-radius:10px; border:1px solid transparent; transition:all .2s; }
.side a em { font-style:normal; font-size:18px; width:24px; text-align:center; }
.side a:hover { background:rgba(47,139,255,.18); border-color:rgba(47,139,255,.6); transform:translateX(3px); }
.side a.on { background:linear-gradient(180deg,var(--gold1),var(--gold2)); color:#1b1400; box-shadow:0 0 18px rgba(253,224,71,.5); }
.side a.wa { background:linear-gradient(180deg,#22c55e,#15803d); color:#fff; margin-top:10px; }
.side hr { border:0; border-top:1px solid rgba(47,139,255,.35); margin:8px 0; }
.main { min-width:0; animation:rise .45s ease both; }
@keyframes rise { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion:reduce){ *{ animation:none !important; transition:none !important; } }

/* stat tiles */
.tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin-bottom:14px; }
.tile { border-radius:16px; padding:14px 16px; color:#fff; display:flex; align-items:center; gap:12px; border:2px solid rgba(255,255,255,.35); box-shadow:0 0 18px rgba(0,0,0,.35), inset 0 0 22px rgba(255,255,255,.08); transition:transform .25s; }
.tile:hover { transform:translateY(-3px); }
.tile em { font-style:normal; font-size:34px; } .tile small { display:block; font-size:12px; opacity:.9; font-weight:600; } .tile b { display:block; font-size:24px; line-height:1.1; }
.t-blue { background:linear-gradient(135deg,#2563eb,#1e3a8a); border-color:#60a5fa; } .t-green { background:linear-gradient(135deg,#10b981,#047857); border-color:#6ee7b7; }
.t-purple { background:linear-gradient(135deg,#a855f7,#5b21b6); border-color:#d8b4fe; } .t-orange { background:linear-gradient(135deg,#f59e0b,#b45309); border-color:#fde68a; }

/* rails (side ads) */
.rail { display:flex; flex-direction:column; gap:12px; position:sticky; top:84px; }
.ad { background:var(--card); border:1px solid rgba(47,139,255,.6); border-radius:14px; overflow:hidden; box-shadow:var(--glow); transition:opacity .5s, transform .25s; } .ad:hover { transform:scale(1.02); }
.ad img { display:block; width:100%; height:auto; }
.ad .cap { padding:7px 9px; font-size:12px; } .ad .cap b { display:block; margin-bottom:2px; } .ad .cap a { margin-right:8px; }
.rail .ad.hide { display:none; } .rail .ad.fade { opacity:0; }
.gallery { display:flex; gap:12px; overflow-x:auto; padding-bottom:8px; } .gallery .ad { flex:0 0 210px; }
.grid-tasks > p { grid-column:1 / -1; }
.jobcard { display:block; text-decoration:none; color:var(--txt); border-left:5px solid var(--sky); margin:0; }
.jobcard b { display:block; font-size:16px; margin-bottom:3px; color:#fff; } .jobcard.give { border-left-color:var(--amber); } .jobcard.take { border-left-color:var(--green); }

.ftr { margin-top:8px; padding:12px 18px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; background:linear-gradient(90deg,#071a5c,#0b2a86 50%,#071a5c); border-top:2px solid var(--neon); box-shadow:0 -4px 24px rgba(47,139,255,.3); font-size:13px; }
.ftr a { color:var(--gold1); font-weight:700; text-decoration:none; } .ftr .cp { color:var(--mute); }
.wa-float { position:fixed; right:14px; bottom:76px; z-index:50; background:linear-gradient(180deg,#22c55e,#15803d); color:#fff; text-decoration:none; padding:11px 15px; border-radius:30px; font-weight:700; font-size:13px; box-shadow:0 4px 14px rgba(0,0,0,.5), 0 0 16px rgba(34,197,94,.5); }
.plain-wrap { max-width:520px; margin:40px auto; padding:0 14px; }

/* responsive */
@media (max-width:1280px){ .layout.rails, body.nosb .layout.rails { grid-template-columns:230px minmax(0,1fr); } body.nosb .layout.rails { grid-template-columns:minmax(0,1fr); }
  .rail { position:static; flex-direction:row; overflow-x:auto; grid-column:1 / -1; } .rail .ad { flex:0 0 150px; } }
@media (max-width:900px){
  .layout, .layout.rails { grid-template-columns:minmax(0,1fr); padding:10px; }
  .side { position:fixed; z-index:60; left:0; top:0; bottom:0; width:260px; max-height:none; border-radius:0 16px 16px 0; transform:translateX(-105%); transition:transform .3s; padding-top:14px; }
  body.sbopen .side { transform:none; }
  body.sbopen::after { content:''; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:55; }
  .pill { display:none; } .hdr-r { margin-left:auto; } .who { display:none; } .logo b { font-size:19px; } .logo img { width:36px; height:36px; }
  .wallet { padding:6px 10px; font-size:13px; }
}
/* legacy classes from older pages */
.bal { background:linear-gradient(135deg,#1d4ed8,#6d28d9) !important; border:2px solid rgba(255,255,255,.35); box-shadow:var(--glow); }
.bal .btn { background:linear-gradient(180deg,#34d399,#059669) !important; color:#fff !important; }

/* ================= v2: picture-style dashboards ================= */
body { background:
  radial-gradient(700px 400px at 90% 0%, rgba(168,85,247,.35), transparent 60%),
  radial-gradient(800px 500px at 0% 20%, rgba(14,165,233,.30), transparent 60%),
  radial-gradient(700px 500px at 60% 100%, rgba(245,158,11,.18), transparent 60%),
  linear-gradient(160deg,#04103d,#0a2380 55%,#05103a); background-attachment:fixed; }
.logo-img img { width:auto; height:54px; mix-blend-mode:screen; filter:none; border-radius:0; }
.hdr { padding:6px 14px; } .hdr .pill { padding:6px 24px; font-size:17px; }
.side { background:linear-gradient(180deg,rgba(6,18,70,.92) 55%,rgba(6,18,70,.55)), url('ui/city.jpg') bottom/cover; }
.side a { font-size:12.5px; padding:8px 10px; margin-bottom:4px; }
.side a:nth-child(6n+1) em { filter:drop-shadow(0 0 6px #38bdf8); } .side a:nth-child(6n+3) em { filter:drop-shadow(0 0 6px #f59e0b); } .side a:nth-child(6n+5) em { filter:drop-shadow(0 0 6px #a855f7); }
.layout { padding:10px 14px; gap:12px; }
body.app .main { min-width:0; }

/* coloured cards */
.c { position:relative; background:linear-gradient(160deg,rgba(13,34,112,.94),rgba(5,14,56,.96)); border:2px solid var(--cc,#2f8bff); border-radius:14px; padding:0; margin:0;
     box-shadow:0 0 0 1px rgba(255,255,255,.06) inset, 0 0 16px var(--cg,rgba(47,139,255,.55)); display:flex; flex-direction:column; min-height:0; overflow:hidden; }
.c-blue { --cc:#3b9bff; --cg:rgba(59,155,255,.55); } .c-green { --cc:#22d3a0; --cg:rgba(34,211,160,.5); } .c-purple { --cc:#b06bff; --cg:rgba(176,107,255,.5); }
.c-orange { --cc:#ffb02e; --cg:rgba(255,176,46,.5); } .c-gold { --cc:#fde047; --cg:rgba(253,224,71,.45); } .c-pink { --cc:#ff5fa8; --cg:rgba(255,95,168,.45); }
.c .ch { display:flex; align-items:center; gap:8px; padding:7px 10px; font-weight:800; font-size:13px; color:#fff; background:linear-gradient(90deg,color-mix(in srgb,var(--cc) 40%,transparent),transparent); border-bottom:1px solid color-mix(in srgb,var(--cc) 60%,transparent); }
.c .ch em { font-style:normal; font-size:17px; } .c .ch .sp { margin-left:auto; }
.c .cb { padding:8px 10px; flex:1; min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:var(--cc) transparent; }
.vb { display:inline-block; padding:4px 11px; font-size:11px; border-radius:8px; background:linear-gradient(180deg,#4aa8ff,#1d4ed8); color:#fff; font-weight:800; text-decoration:none; box-shadow:0 0 10px rgba(74,168,255,.5); }
.vb.g { background:linear-gradient(180deg,#34d399,#059669); } .vb.o { background:linear-gradient(180deg,#fbbf24,#ea580c); } .vb.p { background:linear-gradient(180deg,#c084fc,#7e22ce); }
.c table { font-size:11px; } .c th, .c td { padding:4px 6px; } .c th { background:linear-gradient(180deg,#2a63e8,#16399b); position:sticky; top:0; z-index:1; }
.c td { background:rgba(8,20,80,.35); }
.tag { font-size:10px; padding:1px 7px; } .mini-btn { padding:3px 8px !important; font-size:11px !important; border-radius:6px !important; }
.ic { display:inline-flex; width:22px; height:22px; border-radius:6px; align-items:center; justify-content:center; font-size:12px; color:#fff; font-weight:900; border:0; padding:0; cursor:pointer; }
.ic.ok { background:linear-gradient(180deg,#34d399,#059669); } .ic.no { background:linear-gradient(180deg,#f87171,#dc2626); } .ic.pa { background:linear-gradient(180deg,#fbbf24,#d97706); }

/* tiles compact */
.tiles { gap:10px; margin-bottom:0; grid-template-columns:repeat(4,minmax(0,1fr)); }
.tile { padding:9px 12px; gap:10px; border-radius:14px; }
.tile em { font-size:28px; } .tile b { font-size:20px; } .tile small { font-size:11px; } .tile i { font-style:normal; font-size:10px; color:#bbf7d0; display:block; }

/* ---- dashboards ---- */
.dash { display:flex; flex-direction:column; gap:10px; min-height:0; }
.cols { display:grid; gap:10px; min-height:0; }
.colx { display:flex; flex-direction:column; gap:10px; min-height:0; }
.colx > .c { flex:1 1 0; }
.adm-cols { grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); }
.compact label { font-size:10.5px; margin-bottom:1px; } .compact input, .compact select { padding:5px 7px; margin-bottom:4px; font-size:12px; border-radius:6px; }
.compact .grid2 { grid-template-columns:repeat(3,minmax(0,1fr)); gap:2px 8px; }
.compact #newInv { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px 8px; } .compact button { padding:7px 12px; }
.formrow { display:grid; grid-template-columns:96px minmax(0,1fr); gap:10px; align-items:start; } .formrow > img { width:96px; border-radius:12px; box-shadow:0 0 14px rgba(59,155,255,.6); }
dialog { margin:auto; border:2px solid var(--gold1); border-radius:14px; background:#071443; color:var(--txt); padding:16px; width:min(560px,94vw); max-height:90vh; box-shadow:0 0 40px rgba(253,224,71,.4); }
dialog::backdrop { background:rgba(0,0,10,.7); } dialog h3 { margin-bottom:8px; }
.hero-slide { position:relative; height:100%; min-height:130px; background:#06123f; }
.hero-slide img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .7s; } .hero-slide img.on { opacity:1; }
.hero-slide img.contain { object-fit:contain; }
.vid-poster { position:relative; display:block; flex:1; min-height:0; background:#000 center/cover; text-decoration:none; }
.vid-poster img { width:100%; height:100%; object-fit:cover; display:block; } .vid-poster .pl { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.vid-poster .pl b { width:54px; height:54px; border-radius:50%; background:rgba(0,0,0,.55); border:3px solid #fff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; box-shadow:0 0 22px rgba(56,189,248,.9); }
.task-row { display:grid; grid-template-columns:110px minmax(0,1fr) auto; gap:12px; align-items:center; background:linear-gradient(90deg,#eaf1ff,#cfe0ff); color:#0b1a4a; border-radius:12px; padding:8px 10px; margin-bottom:8px; }
.task-row img { width:110px; height:74px; object-fit:cover; border-radius:8px; } .task-row b { font-size:15px; display:block; } .task-row .tg { background:#2563eb; color:#fff; display:inline-block; padding:1px 9px; border-radius:12px; font-size:11px; font-weight:700; }
.task-row .go { background:linear-gradient(180deg,#34d399,#047857); color:#fff; padding:11px 20px; font-size:15px; border-radius:12px; box-shadow:0 0 18px rgba(52,211,153,.8); }
.qa { display:grid; grid-template-columns:1fr 1fr; gap:8px; } .qa a { padding:12px 6px; border-radius:12px; color:#fff; font-weight:800; text-decoration:none; text-align:center; border:2px solid rgba(255,255,255,.4); box-shadow:0 0 12px rgba(0,0,0,.35); transition:transform .2s; } .qa a:hover { transform:translateY(-2px); }
.promo3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.promo { display:flex; align-items:center; gap:12px; padding:10px 14px; font-weight:800; font-size:15px; }
.promo img { width:70px; height:70px; object-fit:cover; border-radius:12px; } .promo span { display:block; font-size:12px; font-weight:700; margin-top:5px; }
.pay-logos { display:flex; gap:14px; align-items:center; margin-bottom:6px; } .pay-logos img { height:42px; border-radius:8px; }

/* fit mode: whole dashboard inside one window, no page scroll (desktop) */
@media (min-width:1100px) and (min-height:480px) {
  body.fit { height:100vh; overflow:hidden; display:flex; flex-direction:column; }
  body.fit .hdr { flex:none; } body.fit .ftr { flex:none; margin:0; padding:7px 16px; }
  body.fit .layout { flex:1; min-height:0; align-items:stretch; }
  body.fit .side { position:static; max-height:none; overflow-y:auto; }
  body.fit .main { display:flex; flex-direction:column; min-height:0; overflow:hidden; }
  body.fit .dash { flex:1; min-height:0; }
  body.fit .flash { flex:none; margin-bottom:6px; padding:6px 10px; }
  body.fit .cols.fill { flex:1; }
  body.fit .adm-cols { flex:1; }
  .ftr { font-size:12px; }
}
@media (max-width:1099px) {
  .adm-cols, .cols { grid-template-columns:minmax(0,1fr) !important; } .colx > .c { flex:none; } .c .cb { max-height:420px; }
  .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); } .promo3 { grid-template-columns:1fr; } .compact .grid2, .compact #newInv { grid-template-columns:1fr 1fr; }
  .hero-slide { height:150px; }
}
@media (max-width:520px) { .task-row { grid-template-columns:80px minmax(0,1fr); } .task-row .go { grid-column:1/-1; } .task-row img { width:80px; height:58px; } .logo-img img { height:40px; } }

/* compact admin/investor add forms (single-window) */
.compact form.f5 { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:3px 8px; align-items:end; }
.compact form.f5 > label:first-of-type { display:none; }
.compact form.f5 #newInv, .compact form.f5 .grid2 { display:contents; }
.compact form.f5 > button { grid-column:1 / -1; }
.compact form.f3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px 8px; align-items:end; }
.compact form.f3 > button, .compact form.f3 .span { grid-column:1 / -1; }
.compact .f-ack { font-size:11px; padding:6px 8px !important; } .compact .f-ack label { font-size:10.5px; }
.compact input[type=file] { padding:3px; font-size:11px; }

/* v3: smaller sizes, hero slides, promo caption, auto-scale */
.hero-slide .hs { position:absolute; inset:0; opacity:0; transition:opacity .7s; display:block; pointer-events:none; } .hero-slide .hs.on { opacity:1; pointer-events:auto; }
.hero-slide .hs img { opacity:1; position:absolute; inset:0; width:100%; height:100%; object-fit:cover; } .hero-slide .hs img.contain { object-fit:contain; }
.vid-poster img { transition:opacity .25s; }
.pcap { position:absolute; left:0; right:0; bottom:0; padding:6px 10px; background:linear-gradient(transparent,rgba(0,0,0,.85)); color:#fff; font-size:11px; font-weight:700; }
.task-row .tm { display:block; font-size:11px; color:#334; margin-top:3px; } .task-row .tm u { text-decoration:none; color:#047857; font-weight:800; }
.sp { margin-left:auto; }
@media (min-width:1100px) {
  body.fit { font-size:13px; }
  body.fit .tile { padding:6px 10px; gap:8px; } body.fit .tile em { font-size:22px; } body.fit .tile b { font-size:16px; } body.fit .tile small { font-size:10px; }
  body.fit .ch { padding:5px 10px; font-size:13px; } body.fit .cb { padding:6px 8px; }
  body.fit .btn, body.fit .vb { padding:5px 12px; font-size:12px; border-radius:9px; }
  body.fit .task-row { grid-template-columns:84px minmax(0,1fr) auto; padding:5px 8px; gap:8px; margin-bottom:0; }
  body.fit .task-row img { width:84px; height:56px; } body.fit .task-row b { font-size:13px; }
  body.fit .task-row .go { padding:7px 14px; font-size:12px; }
  body.fit .qa { gap:6px; } body.fit .qa a { padding:8px 4px; font-size:12px; border-radius:10px; }
  body.fit .promo { padding:6px 10px; font-size:12px; gap:8px; } body.fit .promo img { width:46px; height:46px; } body.fit .promo span { font-size:10px; margin-top:3px; }
  body.fit .vid-poster .pl b { width:42px; height:42px; font-size:17px; }
  body.fit .hdr { padding-top:4px; padding-bottom:4px; } body.fit .logo-img img { height:36px; }
  body.fit .side a, body.fit .side .it { padding:6px 10px; font-size:12px; }
}
.promo, .qa a, .vb, .btn { text-decoration:none !important; } .c.promo { flex-direction:row; } .promo div { text-align:left; color:#fff; } .promo .vb { display:inline-block; }
@media (min-width:1100px) and (max-height:700px) { body.fit .hdr .pill, body.fit .hdr h1 { font-size:14px; padding-top:3px; padding-bottom:3px; } body.fit .side { padding:6px; } body.fit .side a { padding:5px 10px; margin-bottom:2px; } body.fit .ftr { padding:4px 16px; font-size:11px; } }

/* v4: proportions of the 1536x864 reference (header 84, sidebar 210, footer 64, banner 192, tiles 125, tasks 212, video 335, quick 212, promos 115) */
.plabel { position:absolute; top:8px; left:8px; z-index:3; background:rgba(220,38,38,.92); color:#fff; font-size:10px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; padding:3px 9px; border-radius:12px; box-shadow:0 0 10px rgba(220,38,38,.7); pointer-events:none; }
.c.r-banner { position:relative; }
@media (min-width:1100px) {
  body.fit { font-size:1.5vh; }
  body.fit .hdr { height:9.72vh; box-sizing:border-box; padding-top:0; padding-bottom:0; }
  body.fit .logo-img img { height:6.4vh; }
  body.fit .hdr .pill { font-size:2.1vh; padding:.8vh 2.4vh; }
  body.fit .ftr { height:7.4vh; box-sizing:border-box; padding-top:0; padding-bottom:0; font-size:1.4vh; flex-wrap:nowrap; }
  body.fit .layout { grid-template-columns:13.67vw minmax(0,1fr) !important; gap:.9vw; padding:1.2vh .9vw; max-width:none; }
  body.fit .side { padding:1vh; } body.fit .side a { font-size:1.45vh; padding:1.1vh 1vh; margin-bottom:.5vh; } body.fit .side a em { font-size:2.1vh; width:2.4vh; }
  body.fit .cdash { gap:1.2vh; }
  body.fit .cdash .cols { gap:.9vw; grid-template-columns:minmax(0,1.92fr) minmax(0,1fr) !important; min-height:0; }
  body.fit .cdash .colx { gap:1.2vh; min-height:0; }
  body.fit .cdash .r-banner { flex:192 1 0; min-height:0; } body.fit .cdash .r-tiles { flex:125 1 0; min-height:0; }
  body.fit .cdash .r-tasks { flex:212 1 0; min-height:0; } body.fit .cdash .r-video { flex:335 1 0; min-height:0; }
  body.fit .cdash .r-qa { flex:212 1 0; min-height:0; } body.fit .cdash .r-promo { flex:none; height:13.3vh; }
  body.fit .cdash .cols { flex:1; }
  body.fit .cdash .tiles { gap:.9vw; } body.fit .cdash .tile { height:100%; flex-direction:column; justify-content:center; text-align:center; gap:.4vh; padding:1vh; }
  body.fit .cdash .tile em { font-size:4.2vh; } body.fit .cdash .tile b { font-size:2.8vh; } body.fit .cdash .tile small { font-size:1.35vh; } body.fit .cdash .tile > div { text-align:center; }
  body.fit .cdash .ch { font-size:1.7vh; padding:.8vh 1vh; }
  body.fit .cdash .r-tasks .cb { display:flex; align-items:center; flex:1; }
  body.fit .cdash .task-row { width:100%; grid-template-columns:11vh minmax(0,1fr) auto; padding:1vh 1.2vh; gap:1.2vh; }
  body.fit .cdash .task-row img { width:11vh; height:7.4vh; } body.fit .cdash .task-row b { font-size:1.8vh; } body.fit .cdash .task-row .tm { font-size:1.4vh; }
  body.fit .cdash .task-row .go { font-size:2vh; padding:1.6vh 3vh; font-weight:800; animation:glowgo 1.8s ease-in-out infinite alternate; }
  body.fit .cdash .r-tasks .muted { margin:auto; font-size:1.7vh; }
  body.fit .cdash .r-qa .cb { flex:1; display:flex; } body.fit .cdash .qa { flex:1; gap:1.1vh; } body.fit .cdash .qa a { display:flex; align-items:center; justify-content:center; font-size:1.8vh; padding:0; }
  body.fit .cdash .promo { height:100%; padding:0 1.5vh; gap:1.5vh; font-size:1.8vh; } body.fit .cdash .promo img { width:8vh; height:8vh; } body.fit .cdash .promo span { font-size:1.4vh; }
  body.fit .cdash .vid-poster .pl b { width:7vh; height:7vh; font-size:3vh; } body.fit .cdash .pcap { font-size:1.5vh; padding:1vh 1.2vh; }
}
@keyframes glowgo { from { box-shadow:0 0 8px rgba(52,211,153,.6); } to { box-shadow:0 0 22px rgba(52,211,153,1); } }
body.fit .layout { width:100%; box-sizing:border-box; margin:0; }
.promo .vb { display:block !important; width:max-content; margin-top:.5vh; }

/* v5: admin dashboard proportions (1536x864: header 82, sidebar 220, footer 58; tiles 95; video 330 live 175 activity 95; pay 175 wd 155 banner 160 fees 95) */
.add-ban { display:block; margin:6px auto 0; }
@media (min-width:1100px) {
  body.fit.r-admin .hdr { height:9.49vh; } body.fit.r-admin .ftr { height:6.71vh; }
  body.fit.r-admin .layout { grid-template-columns:14.32vw minmax(0,1fr) !important; }
  body.fit .adash { gap:1.1vh; }
  body.fit .adash .a-tiles { flex:none; height:11vh; gap:.9vw; } body.fit .adash .tile { padding:0 1.2vh; } body.fit .adash .tile em { font-size:3.8vh; } body.fit .adash .tile b { font-size:2.7vh; } body.fit .adash .tile small { font-size:1.6vh; }
  body.fit .adash .a-cols { gap:.9vw; grid-template-columns:minmax(0,820fr) minmax(0,465fr) !important; flex:1; min-height:0; }
  body.fit .adash .colx { gap:1.1vh; min-height:0; }
  body.fit .adash .c { min-height:0; overflow:hidden; display:flex; flex-direction:column; } body.fit .adash .c .cb { flex:1; min-height:0; overflow:auto; }
  body.fit .adash .a-video { flex:330 1 0; } body.fit .adash .a-live { flex:175 1 0; } body.fit .adash .a-act { flex:95 1 0; }
  body.fit .adash .a-pay { flex:175 1 0; } body.fit .adash .a-wd { flex:155 1 0; } body.fit .adash .a-ban { flex:160 1 0; } body.fit .adash .a-fee { flex:95 1 0; }
  body.fit .adash .ch { font-size:1.7vh; padding:.7vh 1vh; flex:none; }
  body.fit .adash table { width:100%; border-collapse:collapse; table-layout:auto; } body.fit .adash th, body.fit .adash td { padding:.45vh .6vh; font-size:1.3vh; text-align:left; vertical-align:middle; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:14vw; }
  body.fit .adash .tag { font-size:1.2vh; padding:.2vh .8vh; } body.fit .adash .ic { width:2.6vh; height:2.6vh; font-size:1.3vh; padding:0; }
  body.fit .adash .btn-sm, body.fit .adash .mini-btn { padding:.4vh 1vh; font-size:1.2vh; }
  body.fit .adash .a-fee .fees { display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:1vw; }
  body.fit .adash .a-fee .fees .row { grid-column:1; font-size:1.35vh; }
  body.fit .adash .a-fee .ch { padding:.4vh 1vh; }
  body.fit .adash .add-ban { padding:.6vh 2.4vh; font-size:1.4vh; }
  /* video form: equal-height controls */
  body.fit .adash .formrow { display:grid; grid-template-columns:11vw minmax(0,1fr); gap:1.2vw; align-items:center; height:100%; } body.fit .adash .formrow > img { width:100%; max-height:24vh; object-fit:contain; }
  body.fit .adash .f5 input, body.fit .adash .f5 select { height:3.6vh; box-sizing:border-box; padding:0 .8vh; font-size:1.35vh; } body.fit .adash .f5 label { font-size:1.25vh; margin:0; }
  body.fit .adash .f5 .btn-block, body.fit .adash .f5 button { height:4vh; font-size:1.6vh; padding:0 3vh; }
}
@media (max-width:1099px) { .adash .a-cols { grid-template-columns:1fr !important; } }
@media (min-width:1100px) {
  body.fit.r-admin .side { padding:.6vh .8vh; } body.fit.r-admin .side a { padding:.7vh 1vh; margin-bottom:.3vh; font-size:1.4vh; } body.fit.r-admin .side a.wa { margin-top:.6vh; } body.fit.r-admin .side hr { margin:.4vh 0; }
  body.fit .adash .a-act .ch, body.fit .adash .a-fee .ch { padding:.3vh 1vh; font-size:1.55vh; } body.fit .adash .a-act .cb { padding:.2vh .6vh; } body.fit .adash .a-act th, body.fit .adash .a-act td { padding:.25vh .6vh; }
  body.fit .adash .a-act .vb, body.fit .adash .a-fee .vb { padding:.3vh 1vh; font-size:1.2vh; }
}

/* v6: bold glossy colours (taken from the reference pictures) */
:root { --gl:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,.06) 48%,rgba(255,255,255,0) 52%); --gold1:#fff02a; --gold2:#e08a00; }
button, .btn { background:var(--gl),linear-gradient(180deg,#fff02a,#e08a00); border:1.5px solid rgba(255,255,255,.55); box-shadow:0 0 14px rgba(255,200,0,.55); }
.btn-green, .bal .btn, .task-row .go, .vb.g { background:var(--gl),linear-gradient(180deg,#22d44a,#087a1a) !important; color:#fff; border:1.5px solid rgba(255,255,255,.55); box-shadow:0 0 14px rgba(34,212,74,.7); }
.btn-red, .ic.no { background:var(--gl),linear-gradient(180deg,#ff3030,#a80000) !important; color:#fff; border:1.5px solid rgba(255,255,255,.55); box-shadow:0 0 14px rgba(255,48,48,.65); }
.btn-purple, .vb.p { background:var(--gl),linear-gradient(180deg,#8f1aff,#4a07b0) !important; color:#fff; border:1.5px solid rgba(255,255,255,.55); box-shadow:0 0 14px rgba(143,26,255,.7); }
.btn-gray { background:var(--gl),linear-gradient(180deg,#0a5cff,#032a9e); color:#fff; border:1.5px solid rgba(255,255,255,.45); box-shadow:0 0 12px rgba(10,92,255,.6); }
.vb { background:var(--gl),linear-gradient(180deg,#0a5cff,#032a9e); border:1.5px solid rgba(255,255,255,.55); box-shadow:0 0 12px rgba(10,92,255,.75); }
.vb.o { background:var(--gl),linear-gradient(180deg,#ffa000,#d05a00) !important; box-shadow:0 0 12px rgba(255,160,0,.75); }
.ic.ok { background:var(--gl),linear-gradient(180deg,#22d44a,#087a1a) !important; } .ic.pa { background:var(--gl),linear-gradient(180deg,#ffa000,#d05a00) !important; }
.t-blue { background:var(--gl),linear-gradient(135deg,#0a5cff,#032a9e); border-color:#9cc3ff; } .t-green { background:var(--gl),linear-gradient(135deg,#22d44a,#087a1a); border-color:#a7f3b8; }
.t-purple { background:var(--gl),linear-gradient(135deg,#8f1aff,#4a07b0); border-color:#d9b3ff; } .t-orange { background:var(--gl),linear-gradient(135deg,#ffa000,#d05a00); border-color:#ffe0a0; }
.qa a:nth-child(1) { background:var(--gl),linear-gradient(160deg,#0a5cff,#032a9e) !important; } .qa a:nth-child(2) { background:var(--gl),linear-gradient(160deg,#22d44a,#087a1a) !important; }
.qa a:nth-child(3) { background:var(--gl),linear-gradient(160deg,#ffa000,#d05a00) !important; } .qa a:nth-child(4) { background:var(--gl),linear-gradient(160deg,#8f1aff,#4a07b0) !important; }
.qa a { border:2px solid rgba(255,255,255,.65); box-shadow:0 0 14px rgba(120,170,255,.5); }
.side a.on { background:var(--gl),linear-gradient(180deg,#fff02a,#e08a00); } .side a.wa { background:var(--gl),linear-gradient(180deg,#22d44a,#087a1a); }
.burger, #authDlg .x, .tabs button { background:none !important; border:0 !important; box-shadow:none !important; } .tabs button { border-bottom:2px solid transparent !important; } .tabs button.on { border-bottom-color:var(--sky) !important; } .tabs button.on.biz { border-bottom-color:var(--purple) !important; }

/* v7: client panel "Available Videos" layout (reference 1648x912) */
.vdash { display:flex; flex-direction:column; gap:12px; }
.vb-top { display:flex; align-items:center; gap:14px; padding:10px 16px; min-height:96px; }
.tbh { display:flex; align-items:center; gap:10px; padding-right:14px; border-right:2px solid rgba(255,255,255,.35); } .tbh em { font-style:normal; font-size:34px; } .tbh b { font-size:20px; line-height:1.1; }
.tbrow { flex:1; min-width:0; display:flex; gap:14px; overflow-x:auto; } .tbi { flex:1 0 150px; max-width:210px; aspect-ratio:2/1; border-radius:12px; overflow:hidden; border:1px solid rgba(120,170,255,.6); box-shadow:0 0 10px rgba(0,140,255,.5); display:block; background:#06123f; } .tbi img { width:100%; height:100%; object-fit:cover; display:block; }
.tbva { padding:12px 20px !important; font-size:15px !important; border-radius:12px !important; }
.vb-head { display:flex; align-items:center; gap:22px; padding:12px 18px; flex-wrap:wrap; } .avt { font-size:24px; font-weight:800; display:flex; align-items:center; gap:12px; } .avt em { font-style:normal; font-size:30px; }
.avm { margin-left:auto; font-size:16px; display:flex; align-items:center; gap:8px; } .avm + .avm { margin-left:0; } .avm b { color:var(--gold1); } .avm i { font-style:normal; font-size:22px; } .avr { padding:10px 18px !important; font-size:15px !important; border-radius:12px !important; }
.vrow { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.vcard { display:flex; flex-direction:column; padding:10px; gap:8px; } .vth { position:relative; display:block; border-radius:12px; overflow:hidden; aspect-ratio:370/245; background:#000; } .vth img { width:100%; height:100%; object-fit:cover; display:block; }
.pb { position:absolute; inset:0; margin:auto; width:64px; height:64px; border-radius:50%; background:rgba(0,0,0,.6); border:3px solid #fff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:24px; box-shadow:0 0 18px rgba(0,180,255,.9); }
.dr { position:absolute; right:8px; bottom:8px; background:rgba(0,0,0,.75); color:#fff; font-weight:700; font-size:14px; padding:3px 9px; border-radius:8px; }
.vti { font-size:17px; font-weight:700; } .vmt { display:flex; justify-content:space-between; gap:8px; font-size:15px; color:var(--mute); } .vmt .rw b { color:#22d44a; }
.vbtn { margin-top:auto; display:flex; align-items:center; justify-content:center; padding:11px 8px; border-radius:30px; font-weight:800; font-size:16px; color:#fff; text-decoration:none; background:var(--gl),linear-gradient(180deg,#0a5cff,#032a9e); border:1.5px solid rgba(255,255,255,.55); box-shadow:0 0 14px rgba(10,92,255,.8); transition:.2s; } .vbtn:hover { transform:translateY(-2px); filter:brightness(1.12); }
.vempty { align-items:center; justify-content:center; text-align:center; } .vempty .muted { margin:auto; }
.vpromo { grid-column:1/-1; display:block; padding:0; overflow:hidden; min-height:220px; } .vpromo img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s; } .vpromo:hover img { transform:scale(1.03); }
#allBanners { max-width:min(820px,94vw); } .allb { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; margin:10px 0; } .allb a { display:block; border-radius:12px; overflow:hidden; border:1px solid rgba(120,170,255,.6); aspect-ratio:2/1; background:#06123f; } .allb img { width:100%; height:100%; object-fit:cover; display:block; }
@media (min-width:1100px) { .vdash { --u:calc(100vh/912); }
  body.fit .vdash { flex:1; min-height:0; gap:calc(var(--u)*12); } body.fit .vdash > .c, body.fit .vdash > .vrow { min-height:0; }
  body.fit .vb-top { flex:140 1 0; padding:0 1.4vw; } body.fit .vb-head { flex:85 1 0; padding:0 1.4vw; flex-wrap:nowrap; }
  body.fit .vrow { flex:425 1 0; grid-template-columns:390fr 390fr 591fr; gap:calc(var(--u)*14); }
  body.fit .vpromo { grid-column:auto; min-height:0; }
  body.fit .vcard { min-height:0; padding:calc(var(--u)*10); gap:calc(var(--u)*8); } body.fit .vth { aspect-ratio:auto; flex:245 1 0; min-height:0; }
  body.fit .tbh em { font-size:4vh; } body.fit .tbh b { font-size:2.2vh; } body.fit .tbi { flex:0 0 auto; height:78%; max-width:none; } body.fit .tbrow { align-items:center; }
  body.fit .tbva { font-size:2vh !important; padding:1.4vh 2vh !important; } body.fit .avt { font-size:3.1vh; } body.fit .avt em { font-size:3.6vh; } body.fit .avm { font-size:2.4vh; } body.fit .avr { font-size:2.1vh !important; padding:1.2vh 2vh !important; }
  body.fit .vti { font-size:2.3vh; } body.fit .vmt { font-size:2.1vh; } body.fit .vbtn { font-size:2.3vh; padding:0; height:calc(var(--u)*55); flex:none; margin:0 auto; width:75%; } body.fit .pb { width:7.2vh; height:7.2vh; font-size:3vh; } body.fit .dr { font-size:2vh; } }
@media (min-width:700px) and (max-width:1099px) { .vrow { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:699px) { .vrow { grid-template-columns:1fr; } .vb-top { flex-wrap:wrap; } .tbrow { order:3; width:100%; flex:1 1 100%; } .tbh { border-right:0; } .avm { margin-left:0; } }
.c.vb-top, .c.vb-head { flex-direction:row; align-items:center; }
.tbi { background:#0a1a52; } .tbi img { object-fit:contain; background:#0a1a52; }
@media (min-width:1100px) { body.fit .tbi { height:82%; aspect-ratio:2/1; width:auto; flex:0 0 auto; } body.fit .tbrow { gap:1vw; overflow:hidden; } }
.tbi img { object-fit:cover; }
@media (min-width:1100px) { body.fit .tbrow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.9vw; height:76%; align-items:stretch; } body.fit .tbi { height:100%; width:auto; aspect-ratio:auto; max-width:none; } }

/* v8: header logo made of SVG + text (no picture), moving top banners, rotating promo */
.hlogo { display:flex; align-items:center; gap:.8vh; text-decoration:none; color:#fff; flex:none; }
.hlogo svg { height:6.6vh; min-height:32px; width:auto; display:block; filter:drop-shadow(0 0 6px rgba(0,170,255,.6)); }
.hl-t { display:flex; flex-direction:column; line-height:1; } .hl-n { font-weight:900; font-style:italic; letter-spacing:-.05em; font-size:max(22px,4.4vh); text-shadow:0 2px 8px #000; } .hl-n i { color:#ff9412; font-style:italic; }
.hl-s { font-size:max(9px,1.45vh); font-weight:800; font-style:italic; margin-top:.5vh; letter-spacing:0; white-space:nowrap; } .hl-s b { color:#ffd21a; }
.tbrow { container-type:inline-size; overflow:hidden !important; display:block !important; }
.tbtrack { display:flex; gap:14px; width:max-content; }
.tbtrack.run { animation:tbmove var(--dur,20s) linear infinite; } .tbrow:hover .tbtrack { animation-play-state:paused; }
@keyframes tbmove { to { transform:translateX(calc(-1 * var(--n) * (25cqw + 3.5px))); } }
.tbtrack .tbi { flex:0 0 calc((100cqw - 42px) / 4) !important; max-width:none; height:100%; aspect-ratio:2/1; }
.vpromo { position:relative; } .vpromo img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .8s; } .vpromo img.on { opacity:1; }
@media (min-width:1100px) { body.fit .tbrow { height:76%; display:block !important; grid-template-columns:none !important; } body.fit .tbtrack { height:100%; gap:.9vw; } body.fit .tbtrack .tbi { flex:0 0 calc((100cqw - 2.7vw) / 4) !important; height:100%; aspect-ratio:auto; } body.fit .tbrow .tbtrack { }
}
.tbtrack { --g:14px; gap:var(--g); } .tbtrack .tbi { flex:0 0 calc((100cqw - 3 * var(--g)) / 4) !important; }
@keyframes tbmove { to { transform:translateX(calc(-1 * var(--n) * (25cqw + .25 * var(--g)))); } }
@media (min-width:1100px) { body.fit .tbtrack { --g:.9vw; gap:var(--g); } body.fit .tbtrack .tbi { flex:0 0 calc((100cqw - 3 * var(--g)) / 4) !important; } }
.hlogo .hl-t, .hlogo .hl-n, .hlogo .hl-s { display:block; } .hlogo .hl-n { font-size:max(22px,4.4vh); line-height:1; } .hlogo .hl-s { font-size:max(9px,1.45vh); line-height:1; white-space:nowrap; margin-top:.5vh; color:#fff; } .hlogo .hl-s b { display:inline; font-size:inherit; font-style:italic; color:#ffd21a; letter-spacing:0; } .hlogo .hl-n i { display:inline; color:#ff9412; }
.vpromo img.on { z-index:1; }
.vpromo { background:linear-gradient(160deg,#0b2468,#040c33); }

/* v9: compact one-screen pages (Post A Job, Withdraw, Meri CV) */
.cf { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 12px; align-items:end; } .cf label { margin:0 0 3px; font-size:12px; } .cf input, .cf select, .cf textarea { margin:0; width:100%; box-sizing:border-box; } .cf textarea { padding:8px; background:var(--bg); color:var(--txt); border:1px solid #475569; border-radius:8px; font:inherit; resize:none; } .cf .full { grid-column:1/-1; }
.cf3 { grid-template-columns:repeat(6,minmax(0,1fr)); } .cf3 > div { grid-column:span 2; } .cf3 > .half { grid-column:span 3; } .cf3 > .full { grid-column:1/-1; }
.pgx { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:12px; align-items:start; } .pgx .colx { display:flex; flex-direction:column; gap:12px; } .pgx .sm { font-size:12px; margin-bottom:8px; }
.pgw .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); } .pgc { grid-template-columns:1fr; }
@media (max-width:760px) { .pgx { grid-template-columns:1fr; } .cf, .cf3 { grid-template-columns:1fr; } .cf3 > div, .cf3 > .half { grid-column:1/-1; } }
@media (min-width:1100px) {
  body.fit .pgx { flex:1; min-height:0; align-items:stretch; gap:.9vw; grid-template-rows:minmax(0,1fr); }
  body.fit .pgx.pgw { grid-template-rows:auto minmax(0,1fr); } body.fit .pgx > .c, body.fit .pgx .colx > .c { min-height:0; display:flex; flex-direction:column; } body.fit .pgx .cb { flex:1; min-height:0; overflow:auto; } body.fit .pgx .colx { min-height:0; gap:1.2vh; }
  body.fit .pgx .ch { padding:.8vh 1.2vh; font-size:1.8vh; } body.fit .pgx .cb { padding:1.2vh 1.4vh; font-size:1.5vh; } body.fit .pgx .sm { font-size:1.3vh; margin-bottom:1vh; line-height:1.35; }
  body.fit .cf { gap:1.1vh 1vw; } body.fit .cf label { font-size:1.35vh; margin-bottom:.4vh; display:block; } body.fit .cf input, body.fit .cf select { height:4.4vh; padding:0 1.2vh; font-size:1.6vh; } body.fit .cf textarea { font-size:1.55vh; padding:1vh 1.2vh; } body.fit .cf button { height:4.8vh; font-size:1.8vh; padding:0 3vh; }
  body.fit .pgx table { width:100%; border-collapse:collapse; } body.fit .pgx th, body.fit .pgx td { padding:.6vh .8vh; font-size:1.4vh; text-align:left; } body.fit .pgx details summary { font-size:1.5vh; }
  body.fit .pgx p { font-size:1.5vh; line-height:1.5; margin:0; }
  body.fit .pgw .tiles { height:11vh; margin:0; gap:.9vw; } body.fit .pgw .tile em { font-size:3.8vh; } body.fit .pgw .tile b { font-size:2.8vh; } body.fit .pgw .tile small { font-size:1.6vh; }
}

/* v10: investor sub-pages, half and half */
.cf .span { grid-column:1/-1; } .cf .flash { margin:0; }
.pgh { grid-template-columns:repeat(2,minmax(0,1fr)); } .pgy { grid-template-columns:1fr; }
.vgrid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; align-content:start; }
.vbox { display:flex; flex-direction:column; background:rgba(5,13,43,.65); border:1.5px solid rgba(8,123,255,.8); border-radius:12px; overflow:hidden; box-shadow:0 0 10px rgba(0,140,255,.35); }
.vbt { position:relative; aspect-ratio:16/8; background:#000; } .vbt img { width:100%; height:100%; object-fit:cover; display:block; } .vbt .tag { position:absolute; left:6px; top:6px; }
.vbi { padding:8px 10px 10px; display:flex; flex-direction:column; gap:4px; font-size:12px; } .vbi b { font-size:13px; line-height:1.25; } .vbi .muted { font-size:11px; }
.vbi .rp { margin-top:3px; align-self:flex-start; } .vbi details { margin-top:4px; } .vbi summary { font-size:12px; cursor:pointer; }
@media (max-width:760px) { .pgh { grid-template-columns:1fr; } }
@media (min-width:1100px) {
  body.fit .pgh { grid-template-rows:minmax(0,1fr); } body.fit .pgy { grid-template-rows:auto minmax(0,1fr); }
  body.fit .vgrid { gap:1vh .8vw; } body.fit .vbi { padding:.8vh 1vh 1vh; gap:.4vh; font-size:1.4vh; } body.fit .vbi b { font-size:1.6vh; } body.fit .vbi .muted { font-size:1.3vh; }
  body.fit .pgy .tiles { height:11vh; margin:0; gap:.9vw; grid-template-columns:repeat(4,minmax(0,1fr)); } body.fit .pgy .tile em { font-size:3.6vh; } body.fit .pgy .tile b { font-size:2.6vh; } body.fit .pgy .tile small { font-size:1.5vh; }
}
.vbt { aspect-ratio:16/6.5; } .vbi form { margin:0; } .vbi label { font-size:11px; margin:3px 0 2px; } .vbi input, .vbi select { height:30px; padding:0 8px; font-size:12px; margin:0; } .vbi .btn-sm, .vbi .vb { padding:6px 12px; font-size:12px; }
@media (min-width:1100px) { body.fit .vbi label { font-size:1.25vh; margin:.4vh 0 .2vh; } body.fit .vbi input, body.fit .vbi select { height:3.6vh; font-size:1.4vh; } body.fit .vbi .vb, body.fit .vbi .btn-sm { padding:.7vh 1.4vh; font-size:1.4vh; } }
.vbt { aspect-ratio:auto; height:0; padding-bottom:36%; } .vbt img { position:absolute; inset:0; }
@media (min-width:1100px) { body.fit .vbt { padding-bottom:34%; } }

/* v11: smaller video boxes (3 in a row), shorter history card */
.vgrid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } .vbt { padding-bottom:30%; } .vbi { padding:6px 8px 8px; gap:3px; } .vbi b { font-size:12px; } .vbi .muted { font-size:10.5px; } .vbt .tag { font-size:10px; padding:1px 7px; }
.vbi .rp { padding:4px 10px; font-size:11px; }
.hhist .cb { overflow:auto; }
@media (max-width:1000px) { .vgrid { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:520px) { .vgrid { grid-template-columns:1fr; } }
@media (min-width:1100px) {
  body.fit .vgrid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:.9vh .6vw; } body.fit .vbt { padding-bottom:28%; } body.fit .vbi { padding:.6vh .8vh .8vh; gap:.3vh; } body.fit .vbi b { font-size:1.35vh; } body.fit .vbi .muted { font-size:1.15vh; } body.fit .vbi .vb, body.fit .vbi .btn-sm { padding:.45vh 1.1vh; font-size:1.2vh; } body.fit .vbt .tag { font-size:1.1vh; }
  body.fit .pgy { grid-template-rows:auto auto; align-content:start; } body.fit .hhist { height:50vh; min-height:0; align-self:start; }
}
/* v12: Views History narrower, half and half */
.pgy { grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); align-items:start; } .pgy .tiles { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media (max-width:900px) { .pgy { grid-template-columns:1fr; } }
@media (min-width:1100px) {
  body.fit .pgy { grid-template-rows:minmax(0,1fr); align-content:stretch; } body.fit .pgy .tiles { height:auto; align-self:start; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2vh .9vw; }
  body.fit .pgy .tile { min-height:15vh; flex-direction:column; justify-content:center; text-align:center; } body.fit .pgy .tile > div { text-align:center; } body.fit .pgy .tile em { font-size:4.2vh; } body.fit .pgy .tile b { font-size:3vh; } body.fit .pgy .tile small { font-size:1.6vh; }
  body.fit .hhist { height:auto; align-self:stretch; max-height:62vh; }
}
/* v13: Views History: 4 tiles in one row, history table below */
.pgy { grid-template-columns:1fr !important; } .pgy .tiles { grid-template-columns:repeat(4,minmax(0,1fr)) !important; }
@media (max-width:760px) { .pgy .tiles { grid-template-columns:repeat(2,minmax(0,1fr)) !important; } }
@media (min-width:1100px) {
  body.fit .pgy { grid-template-rows:auto minmax(0,1fr) !important; align-content:start; }
  body.fit .pgy .tiles { height:10vh !important; min-height:0; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:.9vw; align-self:start; }
  body.fit .pgy .tile { min-height:0 !important; flex-direction:row !important; justify-content:flex-start !important; text-align:left !important; padding:0 1.4vh; gap:1.2vh; } body.fit .pgy .tile > div { text-align:left !important; }
  body.fit .pgy .tile em { font-size:3.8vh !important; } body.fit .pgy .tile b { font-size:2.8vh !important; } body.fit .pgy .tile small { font-size:1.5vh !important; }
  body.fit .hhist { height:auto !important; max-height:none !important; align-self:stretch !important; }
}
/* v14: Views History card smaller (scrolls inside) */
@media (min-width:1100px) { body.fit .pgy .hhist { height:42vh !important; max-height:42vh !important; align-self:start !important; width:68%; margin:0 auto; } }
/* v15: admin sub-pages compact (.apg grid) */
.apg { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:start; }
.apg > .card { margin:0; } .apg .span2 { grid-column:1/-1; } .apg .span3 { grid-column:1/-1; }
.apg .thumb1 { width:96px; height:96px; object-fit:contain; background:#050d33; border-radius:8px; border:2px solid rgba(47,139,255,.7); display:block; }
.apg .thumb2 { width:72px; height:40px; object-fit:contain; background:#050d33; border-radius:5px; border:1px solid rgba(47,139,255,.6); }
.apg .ninv { display:grid; grid-template-columns:1fr 1fr; gap:0 12px; } .apg .ninv input { margin-bottom:8px; }
.apg .pl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 14px; } .apg .pit { border:1px solid rgba(47,139,255,.35); border-radius:10px; padding:8px; align-items:flex-start; gap:10px; }
.apg[data-v=proofs] { }
.apg[data-v=extras] .span3 { grid-column:1/-1; }
.apg[data-v=extras] .inc { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; }
.apg[data-v=extras] .inc .card { margin:0; padding:6px 10px; } .apg[data-v=extras] .inc .big { font-size:20px; }
.apg[data-v=payments] #pay .grid2 { grid-template-columns:repeat(4,minmax(0,1fr)); }
.apg[data-v=invpay] { grid-template-columns:minmax(0,.85fr) minmax(0,1.5fr); }
.apg[data-v=live],.apg[data-v=past],.apg[data-v=activity],.apg[data-v=withdrawals],.apg[data-v=payments],.apg[data-v=investors] { grid-template-columns:1fr; }
@media (max-width:1099px) { .apg, .apg[data-v=extras], .apg[data-v=invpay] { grid-template-columns:1fr; } .apg[data-v=videos] #addvideo { grid-row:auto; } .apg .pl { grid-template-columns:1fr; } .apg .ninv { grid-template-columns:1fr; } }
@media (min-width:1100px) and (min-height:480px) {
  body.fit.r-admin .main > .topbar { margin-bottom:.9vh; flex-wrap:nowrap; } body.fit.r-admin .main > .topbar h2 { font-size:2.3vh; margin:0; }
  body.fit.r-admin .apg { flex:1; min-height:0; gap:.9vw; align-items:stretch; grid-template-rows:var(--rows,minmax(0,1fr)); }
  body.fit.r-admin .apg > .card { min-height:0; overflow:auto; padding:1.1vh 1.3vh; font-size:1.5vh; }
  body.fit.r-admin .apg h3 { font-size:1.8vh; margin:0 0 .7vh; } body.fit.r-admin .apg .muted, body.fit.r-admin .apg p { font-size:1.35vh; line-height:1.4; }
  body.fit.r-admin .apg table { width:100%; } body.fit.r-admin .apg th, body.fit.r-admin .apg td { padding:.55vh .8vh; font-size:1.4vh; }
  body.fit.r-admin .apg input, body.fit.r-admin .apg select { height:4.2vh; padding:0 1.1vh; font-size:1.5vh; margin-bottom:.8vh; } body.fit.r-admin .apg input[type=file] { padding:.6vh 1vh; height:auto; }
  body.fit.r-admin .apg label { font-size:1.3vh; margin-bottom:.3vh; } body.fit.r-admin .apg .grid2 { gap:0 .9vw; }
  body.fit.r-admin .apg button, body.fit.r-admin .apg .btn { font-size:1.5vh; padding:.7vh 1.6vh; } body.fit.r-admin .apg .btn-block { height:4.6vh; padding:0; }
  body.fit.r-admin .apg .tag { font-size:1.2vh; padding:.2vh .7vh; }
  .apg[data-v=proofs] { --rows:minmax(0,1.7fr) minmax(0,.8fr); } .apg[data-v=users] { --rows:auto minmax(0,1fr); } .apg[data-v=investor] { --rows:auto minmax(0,1fr) minmax(0,1fr); }
  .apg[data-v=extras] { --rows:auto minmax(0,1.6fr) minmax(0,.8fr); } .apg[data-v=payments] { --rows:auto auto; align-content:start; } 
}

/* v16: three lists in ONE card + View All */
.trio { display:flex; flex-direction:column; gap:0; } .trio .sec { padding:0 0 1vh; } .trio .sec + .sec { border-top:1px solid rgba(47,139,255,.45); padding-top:1vh; }
.trio .sh { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:.5vh; } .trio .sh h3 { margin:0 !important; } .trio .va { flex:none; }
.lim table tr:nth-child(n+5) { display:none; } .lim .bi:nth-of-type(n+3) { display:none; }
dialog.alld { width:min(900px,92vw); max-height:84vh; overflow:auto; background:linear-gradient(160deg,#0e246e,#061040); color:var(--txt); border:2px solid #2f8bff; border-radius:14px; padding:14px; box-shadow:0 0 40px rgba(47,139,255,.6); } dialog.alld::backdrop { background:rgba(2,6,30,.75); } dialog.alld .vx { margin-top:10px; }
@media (min-width:1100px) and (min-height:480px) { body.fit.r-admin .trio { overflow:hidden !important; } body.fit.r-admin .trio .sec { flex:1 1 0; min-height:0; overflow:hidden; } body.fit.r-admin .trio .sec.lim table { margin:0; } body.fit.r-admin .trio .thumb1 { width:56px; height:56px; } }
/* v17: cards fit their content (no big empty cards); scroll only when taller than the screen */
@media (min-width:1100px) and (min-height:480px) {
  body.fit.r-admin .apg:not([data-v=videos]):not([data-v=extras]) > .card:not(.span2) { align-self:start; max-height:100%; }
  body.fit.r-admin .apg[data-v=proofs] > .card.span2 { align-self:stretch; }
  body.fit.r-admin .apg[data-v=live] > .card, body.fit.r-admin .apg[data-v=past] > .card, body.fit.r-admin .apg[data-v=activity] > .card, body.fit.r-admin .apg[data-v=withdrawals] > .card, body.fit.r-admin .apg[data-v=payments] > .card:first-child, body.fit.r-admin .apg[data-v=investors] > .card { align-self:start; max-height:100%; }
}
/* v18: pages with a single card: card is half width, centered */
@media (min-width:1100px) and (min-height:480px) {
  .apg[data-v=live],.apg[data-v=past],.apg[data-v=activity],.apg[data-v=withdrawals],.apg[data-v=payments] { grid-template-columns:minmax(620px,50%); justify-content:center; }
  .apg[data-v=investors] { grid-template-columns:minmax(0,82%); justify-content:center; }
}
/* v19: single-card pages: taller box (min 55% of screen), grows with data, scrolls inside only when full */
@media (min-width:1100px) and (min-height:480px) {
  body.fit.r-admin .apg:is([data-v=live],[data-v=past],[data-v=activity],[data-v=withdrawals],[data-v=payments],[data-v=investors]) > .card:first-child { min-height:55%; }
  body.fit.r-admin .apg[data-v=payments] > .card:first-child { min-height:62%; }
}
/* v20: single-card pages: box uses the full free height so at least 10 rows show */
@media (min-width:1100px) and (min-height:480px) {
  body.fit.r-admin .apg:is([data-v=live],[data-v=past],[data-v=activity],[data-v=withdrawals],[data-v=investors]) { grid-template-rows:minmax(0,1fr); }
  body.fit.r-admin .apg:is([data-v=live],[data-v=past],[data-v=activity],[data-v=withdrawals],[data-v=investors]) > .card:first-child { align-self:stretch !important; min-height:0 !important; max-height:none !important; }
  body.fit.r-admin .apg[data-v=payments] { grid-template-rows:minmax(0,1fr) auto; align-content:stretch; }
  body.fit.r-admin .apg[data-v=payments] > .card:first-child { align-self:stretch !important; min-height:0 !important; max-height:none !important; }
  body.fit.r-admin .apg:is([data-v=live],[data-v=past],[data-v=activity],[data-v=withdrawals],[data-v=investors]) th, body.fit.r-admin .apg:is([data-v=live],[data-v=past],[data-v=activity],[data-v=withdrawals],[data-v=investors]) td { padding:.45vh .8vh; }
}
/* v21/v22 (final): video card only slightly smaller than the banner panel; thumbnail box original */
@media (min-width:1100px) { body.fit .vrow { grid-template-columns:360fr 360fr 650fr !important; align-items:stretch; } body.fit .vrow > .vcard { align-self:start; height:70%; } }
/* v23: admin Edit button + dialog */
.edb { margin-left:6px; background:linear-gradient(180deg,#ffd84a,#e08a00) !important; color:#1a1200 !important; font-weight:800; border-radius:8px; padding:4px 12px; border:0; cursor:pointer; }
dialog.edd { width:min(520px,92vw); } dialog.edd .cf { grid-template-columns:1fr 1fr; } dialog.edd .cf input { height:40px; padding:0 10px; margin:0; }
/* v24: client dashboard: promo banner rises to the Top Banners level (right column); the rest sits in the left 2 columns */
@media (min-width:1100px) {
  body.fit .vdash { display:grid !important; grid-template-columns:360fr 360fr 650fr; grid-template-rows:140fr 68fr 442fr; gap:calc(var(--u)*12) calc(var(--u)*14); }
  body.fit .vdash .vrow { display:contents; }
  body.fit .vdash > .vb-top { grid-column:1/3; grid-row:1; } body.fit .vdash > .vb-head { grid-column:1/3; grid-row:2; }
  body.fit .vdash .vrow > .vcard { grid-row:3; }
  body.fit .vdash .vrow > .vpromo { grid-column:3; grid-row:1/4; }
}
@media (min-width:1100px) {
  body.fit .vdash .vb-head { gap:.8vw; padding:0 1vw; } body.fit .vdash .avt, body.fit .vdash .avm, body.fit .vdash .avr { white-space:nowrap; }
  body.fit .vdash .avt { font-size:2.4vh; } body.fit .vdash .avt em { font-size:2.8vh; } body.fit .vdash .avm { font-size:1.8vh; margin-left:0; } body.fit .vdash .avr { font-size:1.7vh !important; padding:1vh 1.2vh !important; margin-left:auto; }
  body.fit .vdash .vb-top { padding:0 1vw; gap:.8vw; } body.fit .vdash .tbh b { font-size:1.9vh; } body.fit .vdash .tbh em { font-size:3.2vh; } body.fit .vdash .tbva { font-size:1.7vh !important; padding:1.1vh 1.3vh !important; }
  body.fit .vdash .tbtrack .tbi { flex:0 0 calc((100cqw - 2 * var(--g)) / 3) !important; }
}
@keyframes tbmove { to { transform:translateX(calc(-1 * var(--n) * (33.3333cqw + .3333 * var(--g)))); } }
@media (min-width:1100px) { body.fit .vdash .vb-head { gap:.5vw; padding:0 .8vw; } body.fit .vdash .avt { font-size:2.1vh; flex:none; } body.fit .vdash .avt em { font-size:2.4vh; } body.fit .vdash .avm { font-size:1.55vh; flex:none; } body.fit .vdash .avm i { font-size:1.9vh; } body.fit .vdash .avr { font-size:1.55vh !important; padding:.9vh 1vh !important; flex:none; margin-left:auto; } }
/* v25: pending-request badges (admin) */
.rq { display:inline-flex; align-items:center; margin-left:10px; padding:2px 12px; border-radius:999px; background:linear-gradient(180deg,#ff5a5a,#c40000); color:#fff; font-size:20px; font-weight:900; line-height:1.2; letter-spacing:.3px; box-shadow:0 0 14px rgba(255,60,60,.85), inset 0 1px 0 rgba(255,255,255,.5); border:2px solid #ffd0d0; animation:rqp 1.6s ease-in-out infinite; }
@keyframes rqp { 50% { box-shadow:0 0 26px rgba(255,60,60,1), inset 0 1px 0 rgba(255,255,255,.5); } }
.side a .nb { margin-left:auto; min-width:24px; text-align:center; padding:1px 8px; border-radius:999px; background:linear-gradient(180deg,#ff5a5a,#c40000); color:#fff; font-size:15px; font-weight:900; box-shadow:0 0 10px rgba(255,60,60,.8); border:1.5px solid #ffd0d0; }
@media (min-width:1100px) and (min-height:480px) { body.fit .rq { font-size:2.5vh; padding:.1vh 1.2vh; } body.fit .side a .nb { font-size:1.9vh; padding:0 .9vh; } body.fit.r-admin .ch .rq { margin-left:1vh; } }
.a-live td:last-child { white-space:nowrap; } .a-live td:last-child form { display:inline-block; } .a-live .edb { padding:2px 9px; margin-left:4px; font-size:11px; }

/* v26: thumbnail on the Watch Ads page cards */
.tth { position:relative; display:block; aspect-ratio:16/9; border-radius:10px; overflow:hidden; background:#000; margin-bottom:8px; border:1px solid rgba(74,168,255,.7); }
.tth img { width:100%; height:100%; object-fit:cover; display:block; }
.tth .pb { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:44px; height:44px; border-radius:50%; background:rgba(0,0,0,.55); border:2px solid #fff; color:#fff; display:flex; align-items:center; justify-content:center; font-size:18px; }
.tth .dr { position:absolute; right:6px; bottom:6px; background:rgba(0,0,0,.75); color:#fff; font-size:12px; font-weight:800; padding:2px 7px; border-radius:6px; }

/* v27: My Tasks / Watch Ads: small square cards, half the old height */
.grid-tasks.sq { grid-template-columns:repeat(auto-fill,minmax(165px,1fr)); gap:10px; }
.sqc { aspect-ratio:1/1; padding:8px !important; display:flex; flex-direction:column; gap:4px; overflow:hidden; border-radius:12px; }
.sqc .tth { margin:0; flex:none; } .sqc .tth .pb { width:30px; height:30px; font-size:12px; } .sqc .tth .dr { font-size:10px; padding:1px 5px; }
.sqc .tag { font-size:10px; padding:1px 7px; } .sqc h4 { font-size:12.5px; margin:2px 0 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sqc .muted { font-size:10.5px; line-height:1.25; display:none; } .sqc .rw { font-size:12.5px; margin:0; } .sqc .rw .muted { display:none; }
.sqc .btn, .sqc button { margin-top:auto; padding:5px 8px !important; font-size:12px !important; border-radius:8px; }
.sqc > div b { font-size:12.5px; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* v27b: fix clipped reward, compact My Tasks rows */
.sqc .tth { aspect-ratio:auto; height:64px; }
.sqc .tth img { height:64px; }
.sqc .tag { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin:0; }
.sqc { gap:3px; }
.sqc .btn, .sqc button { margin-top:auto; }
.sqc [class*=rw], .sqc .rew { margin-top:auto; }
.card .row { padding:6px 0 !important; gap:8px; }
.card .row b { font-size:13px; } .card .row .muted, .card .row small { font-size:11px; }
.sqc .tag { flex:none; line-height:15px; height:17px; }
.sqc .tth, .sqc .tth img { height:54px; }
.sqc [class*=rw], .sqc .rew { margin-top:0 !important; }
.sqc .tag { height:15px; line-height:13px; font-size:9.5px; }

/* v28: My Tasks - outer panels taller, inner tiles smaller */
.mtp { min-height:190px; }
.mtp.big { min-height:360px; }
.mtp .grid-tasks.sq { grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:8px; align-content:start; }
.mtp .sqc { padding:6px !important; }
.mtp .sqc h4, .mtp .sqc b { font-size:11.5px; }
.mtp .sqc .btn-sm { font-size:10.5px !important; padding:4px 6px !important; }

/* v29: client header news slides, Worker Pay button, new admin pages */
.hl-slide { display:inline-block; max-width:34vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align:top; }
.hl-slide.go { animation:hlin .6s ease-out; }
@keyframes hlin { from { transform:translateY(120%); opacity:0; } to { transform:none; opacity:1; } }
.hdr .wkr { background:linear-gradient(180deg,#a855f7,#6d28d9) !important; color:#fff !important; border-color:#d8b4fe !important; }
.apg[data-v=workers], .apg[data-v=accounts], .apg[data-v=news] { grid-template-columns:minmax(0,1fr); }
.kp { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; }
.kp > div { border:1px solid rgba(47,139,255,.5); border-radius:10px; padding:6px 10px; background:rgba(5,13,51,.6); }
.kp small { display:block; font-size:11px; color:#bcd6ff; } .kp b { font-size:17px; color:#ffd21a; }
.kp .good b { color:#34d399; } .kp .bad b { color:#fca5a5; }
.wk { border:1px solid rgba(47,139,255,.45); border-radius:12px; padding:8px 10px; margin-bottom:8px; background:rgba(5,13,51,.5); }
.wk .keyb { font-family:monospace; font-size:15px; letter-spacing:.08em; background:#050d33; border:1px dashed #ffd21a; color:#ffd21a; padding:2px 8px; border-radius:6px; }
.wk form.row { gap:6px; flex-wrap:wrap; align-items:flex-end; } .wk input { margin:0; width:100px; }
.refbox { display:flex; gap:10px; align-items:center; flex-wrap:wrap; } .refbox .code { font-family:monospace; font-size:26px; font-weight:900; letter-spacing:.12em; color:#ffd21a; background:#050d33; border:2px dashed #ffd21a; border-radius:10px; padding:6px 16px; }
/* v29b: row sizes for the new admin pages (fit mode) */
@media (min-width:1100px) and (min-height:480px) {
  .apg[data-v=workers] { --rows:auto auto minmax(0,1fr) auto; } .apg[data-v=accounts] { --rows:auto minmax(0,1fr) minmax(0,1fr); }
  .apg[data-v=news] { --rows:auto minmax(0,1fr); } .apg[data-v=invpay] { --rows:auto minmax(0,1fr); }
  body.fit.r-admin .apg[data-v=workers] > .card, body.fit.r-admin .apg[data-v=accounts] > .card, body.fit.r-admin .apg[data-v=news] > .card, body.fit.r-admin .apg[data-v=invpay] > .card { align-self:stretch; }
  .apg[data-v=workers], .apg[data-v=accounts], .apg[data-v=news] { grid-template-columns:minmax(0,1fr); }
}

.wk .kp { grid-template-columns:repeat(8,minmax(0,1fr)); gap:6px; } .wk .kp > div { padding:4px 8px; } .wk .kp small { font-size:10.5px; } .wk .kp b { font-size:14px; }
@media (max-width:1099px) { .wk .kp { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1100px) and (min-height:480px) { .apg[data-v=workers] { --rows:auto auto minmax(0,1fr); } }

/* v30: install-app bar */
#instBar { position:fixed; left:50%; bottom:14px; transform:translateX(-50%); z-index:9999; display:flex; align-items:center; gap:10px; max-width:94vw; padding:8px 10px 8px 16px; border-radius:30px; border:2px solid #0a8cff; background:linear-gradient(145deg,#0a2370,#020b2d); color:#fff; font-weight:800; font-size:14px; box-shadow:0 0 18px rgba(0,140,255,.8); }
#instBar[hidden] { display:none; }
#instBar button { border:0; border-radius:20px; padding:8px 18px; font-weight:900; background:linear-gradient(180deg,#ffe36b,#ffa800); color:#050b24; cursor:pointer; }
#instBar #instX { background:transparent; color:#fff; padding:2px 8px; font-size:20px; }
#instBar { left:12px; right:12px; bottom:12px; transform:none; max-width:none; justify-content:space-between; font-size:13px; line-height:1.25; }
#instBar span { flex:1; min-width:0; } @media (min-width:700px) { #instBar { left:50%; right:auto; transform:translateX(-50%); width:max-content; max-width:92vw; } #instBar span { flex:none; } }

/* v31: bigger admin sidebar text */
body.fit.r-admin .side a { font-size:1.75vh; padding:.55vh 1vh; margin-bottom:.2vh; }
body.fit.r-admin .side a em { font-size:2.3vh; width:2.6vh; }
body.r-admin:not(.fit) .side a { font-size:15px; }
body.fit .side a { font-size:1.75vh; padding:.6vh 1vh; margin-bottom:.25vh; }
body.fit .side a em { font-size:2.3vh; width:2.6vh; }
body:not(.fit) .side a { font-size:15px; }