/* Online reader: login, My Library and the reading page. Written phone-first; wider screens only add room.
   Colours and fonts come from the tokens in style.css. */

/* login */
.login-wrap{display:grid;place-items:center;padding-block:36px 90px}
body:has(.login-wrap) footer{display:none}
body:has(.login-wrap) .zone{min-height:100svh}
.login-card{width:100%;max-width:440px;background:var(--ink-700);border:1px solid var(--ink-line);border-radius:26px;padding:28px 22px;text-align:center}
.login-card h1{font-size:28px;line-height:1.35;margin-top:14px}
.login-lead{color:var(--on-dark-muted);margin:10px 0 22px;line-height:1.7}
.btn-google,.btn-mail{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;border-radius:12px;font:600 16px var(--f-lat);margin-top:10px;border:1px solid var(--ink-line);transition:transform .25s,box-shadow .25s}
.btn-google svg,.btn-mail svg{width:20px;height:20px}
.btn-mail svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.btn-mail br{display:none}
@media(max-width:480px){.btn-mail br{display:inline}}
a.btn-google:hover{transform:translateY(-2px);box-shadow:0 12px 24px -14px #000}
.login-fine{font-size:12.5px;line-height:1.7;color:var(--on-dark-muted);margin-top:16px}
.login-fine a{color:var(--on-dark);text-decoration:underline}
.btn-google{background:#fff;color:#1f1f1f}
.btn-mail{background:transparent;color:var(--on-dark)}
.btn-google:disabled,.btn-mail:disabled{opacity:.45}
.soon{font-size:13px;color:var(--on-dark-muted);margin:10px 0 18px}
.testmode{font:600 12.5px/1.6 var(--f-body);background:#c5f25c22;border:1px dashed var(--lime);color:var(--lime);border-radius:12px;padding:10px 12px;margin-bottom:6px}
.login-form{display:grid;gap:8px;text-align:left;margin-top:14px}
.login-form label{font:600 13px var(--f-body);color:var(--on-dark-muted);margin-top:6px}
.login-form input,.login-form select{min-height:50px;border-radius:12px;border:1px solid var(--ink-line);background:var(--ink-900);color:var(--on-dark);font:16px var(--f-body);padding:0 14px;width:100%}
.login-form .btn{justify-content:center;min-height:52px;margin-top:12px;border:0;width:100%}
.form-err{color:#ffb4a2;font-size:14px;margin-top:10px}
.form-ok{background:var(--chip);border-radius:12px;padding:12px 14px;margin-bottom:18px;font-weight:600}
.admin-form{max-width:520px}
.admin-form label{color:var(--muted)}
.admin-form input,.admin-form select{background:var(--paper);color:var(--text);border-color:var(--line)}
.admin-h{font-size:22px;margin:38px 0 12px}
.admin-t{width:100%;border-collapse:collapse}
.admin-t td,.admin-t th{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);font-size:15px}

/* library */
.who{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:22px;font-size:15px;color:var(--muted)}
.who span{font-weight:600;color:var(--text);word-break:break-all}
.who button,.who a{font:600 13px var(--f-lat);padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:var(--paper);color:var(--text)}
/* phone: three equal tabs in one row, the buy link full width under them */
.shelves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:18px}
.shelf{min-height:58px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:6px 8px;border-radius:16px;border:1px solid var(--line);background:var(--paper);font:600 12.5px/1.25 var(--f-lat);color:var(--text);text-align:center}
.shelf b{font-size:12px;color:var(--muted)}
.shelf.on{background:var(--green);border-color:var(--green);color:#f1f6dd}
.shelf.on b{color:#c9dcc0}
.shelf.buy{grid-column:1/-1;min-height:46px;border-style:dashed;border-color:var(--green);color:var(--accent);font-size:14px}
.shelf.buy.new{border:1px solid var(--lime);background:var(--lime);color:#0b271f}
.shelf-tests{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.shelf-tests .shelf.buy{grid-column:auto}
.shelf.buy.mt{border:1px solid var(--green);background:var(--green);color:#f1f6dd}
.shelf.buy.pt{border:1.5px solid var(--green);background:transparent;color:var(--accent)}
.lib-none{color:var(--muted);padding:20px 0}
.lib-grid{display:grid;gap:14px}
.lib-card{display:flex;gap:16px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:16px;transition:transform .3s var(--ease),border-color .3s}
.lib-card:hover{transform:translateY(-3px);border-color:var(--lime)}
.lib-cover{flex:none;--cw:84px}
.lib-cover .cover{box-shadow:0 10px 16px -10px rgba(8,28,20,.5)}
.lib-body{display:grid;gap:5px;min-width:0}
.lib-body strong{font:600 18px/1.4 var(--f-head)}
.lib-meta{font-size:14px;color:var(--muted)}
.lib-go{font:600 14px var(--f-body);color:var(--accent);margin-top:4px}
.lib-empty{text-align:center;padding:30px 0}
.lib-empty h2{font-size:26px}
.lib-empty p{color:var(--muted);margin:8px 0 22px}

/* reading page */
.rzone{padding-bottom:64px}
.rhead{display:flex;gap:18px;align-items:center;padding-block:22px 6px}
.rcover{flex:none;--cw:78px}
.rhead h1{font-size:clamp(24px,5.4vw,40px);line-height:1.3;margin:6px 0 4px}
.rhead p{color:var(--on-dark-muted);font-size:15px;line-height:1.6}
.rhead .kicker{color:var(--lime)}
.reader{--fs:17px;position:relative;max-width:820px;margin-inline:auto;padding:26px 16px 70px;font-size:var(--fs);line-height:1.85;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.wm{position:absolute;inset:0;z-index:3;pointer-events:none;background-repeat:repeat}
.rbar{display:flex;justify-content:space-between;align-items:center;gap:8px 10px;flex-wrap:wrap;margin-bottom:10px}
.back{font:600 14px var(--f-body);color:var(--accent);padding:10px 0}
.wm{opacity:.9}
/* the floating tools below already hold day / night, so the header's own button is hidden while reading */
.reading .theme-btn{display:none}
/* floating reading tools */
.dock{position:fixed;z-index:40;right:14px;bottom:18px;display:flex;flex-direction:column-reverse;align-items:flex-end;gap:10px}
.dock button{width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--text);font:700 14px var(--f-lat);display:grid;place-items:center;transition:background .25s,color .25s,transform .25s}
.dock svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dock button[aria-pressed=true]{background:var(--green);border-color:var(--green);color:#f1f6dd}
.dock-fab{box-shadow:0 10px 22px -10px #0b271f99;opacity:.82}
.dock.open .dock-fab{opacity:1;background:var(--green);border-color:var(--green);color:#f1f6dd}
.dock-panel{display:none;flex-direction:column;gap:8px;padding:8px;border-radius:30px;background:var(--cream-2);border:1px solid var(--line);box-shadow:0 18px 30px -16px #0b271f99}
.dock.open .dock-panel{display:flex;animation:solin .25s var(--ease)}
.dock-panel i{height:1px;background:var(--line);margin:2px 6px}
.rprog{height:5px;border-radius:9px;background:var(--cream-2);overflow:hidden;margin-bottom:20px}
.rprog i{display:block;height:100%;background:var(--green);border-radius:9px}
.instr,.intro .box,.rulebox{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--green);border-radius:14px;padding:14px 16px;margin-bottom:16px}
.instr h2{font-size:19px;margin-bottom:6px}
.intro{margin-bottom:8px}
.reader .en,.qen{display:block;color:var(--muted);font-size:.9em;line-height:1.7;margin-top:4px}
.reader .sm{font-size:.94em}
.reader .xs,.reader .soft{font-size:.88em;color:var(--muted)}
.reader .center{text-align:center}
.reader .blank{display:inline-block;width:3.2em;border-bottom:1.5px solid currentColor;vertical-align:baseline}
.tablewrap{overflow-x:auto;margin:10px 0}
/* wide tables on a phone (reader/tables.js, public/reader.js; owner, 13 Nov 2026): a table of repeated groups stacks, one
   block per group; any other table that does not fit scrolls in its own box, with a hint above it and a fade on the
   right edge while more is hidden. A table that fits looks as before. */
.twbox{margin:10px 0}
.twbox>.tablewrap{margin:0}
/* the reader's own: the portal's phone rule turns its .tablewrap into cards with overflow:visible, which in the reader let a wide table spill out and be cut off */
.reader .tablewrap{overflow-x:auto;overflow-y:hidden}
.tablewrap:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.tw-hint{display:none;margin:0 0 6px;text-align:right;font:700 14px var(--f-body);color:var(--accent)}
.twbox.wide>.tw-hint{display:block}
.twbox.more>.tablewrap{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 44px),transparent)}
.tstack{display:none}
.twbox.stacked .tablewrap>table:first-child{display:none}
.twbox.stacked .tstack{display:grid;gap:14px}
@media(max-width:640px){.twbox.grouped .tablewrap>table:first-child{display:none}.twbox.grouped .tstack{display:grid;gap:14px}}
.tgroup table{width:100%}
.tg-h{margin:0 0 6px}
.reader .tgroup th{border:1px solid var(--line);padding:6px 10px;text-align:left;background:var(--chip)}
.reader table{border-collapse:collapse;font-size:.9em;min-width:100%}
.reader td{border:1px solid var(--line);padding:6px 10px;vertical-align:top}
.tier{background:var(--ink-800);color:var(--on-dark);border-radius:18px;padding:18px;margin:34px 0 16px}
.tier b{display:block;font:600 1.25em/1.4 var(--f-head);color:var(--lime)}
.tier span{display:block;font-weight:600;margin-top:4px}
.tier p{color:var(--on-dark-muted);font-size:.9em;margin-top:6px}
.sect{font-size:1.3em;margin:30px 0 10px;padding-bottom:8px;border-bottom:2px solid var(--lime)}
.sect small{font:500 .62em var(--f-lat);color:var(--muted)}
.evid{font-size:.88em;color:var(--accent);background:var(--chip);border-radius:10px;padding:8px 12px;margin:8px 0}
.rulebox{font-size:.92em;border-left-color:var(--lime);overflow-x:auto}
.q{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;padding:18px 0;border-bottom:1px solid var(--line)}
.qn{font:700 .82em var(--f-body);min-width:2.3em;height:2.3em;padding:0 6px;display:grid;place-items:center;border-radius:99px;background:var(--green);color:#f1f6dd}
.qt{font-weight:500}
.opts{list-style:none;display:grid;gap:8px;margin:12px 0 4px;padding:0}
.opts li{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:9px 12px;line-height:1.6}
.opts b{color:var(--accent);margin-right:4px}
.qmeta{display:flex;justify-content:space-between;gap:10px;font-size:.8em;color:var(--muted);margin-top:8px}
.qmeta b{color:var(--accent);white-space:nowrap}
.solbtn{margin-top:12px;min-height:46px;padding:0 18px;border-radius:99px;border:1.5px solid var(--accent);background:transparent;color:var(--accent);font:600 15px var(--f-body);transition:background .25s,color .25s}
.solbtn[aria-expanded=true]{background:var(--green);border-color:var(--green);color:#f1f6dd}
.solbtn:disabled{opacity:.6}
.sol{margin-top:12px;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px 16px;animation:solin .35s var(--ease)}
.sol p+p{margin-top:8px}
.sol .stitle{font-weight:700}
.sol .ans{display:inline-block;font-weight:700;border:1.5px solid var(--accent);border-radius:10px;padding:5px 12px;margin-top:10px}
.sol .note{font-size:.88em;color:var(--muted)}
.sol .err{color:#b3261e}
@keyframes solin{from{opacity:0;transform:translateY(-6px)}}
.reader .katex{font-size:1.06em}
/* Long formulas: KaTeX may break a line after = + − when it is allowed to wrap. A single piece that is still wider
   than the phone scrolls sideways inside its own paragraph, so the page itself never grows wider than the screen. */
.reader{overflow-x:clip}
.reader .m{white-space:normal}
.reader :is(.qt,.qen,.sol p,.opts li,.evid,.instr p,.intro .box,.tier p,.note){overflow-x:auto;overflow-y:hidden;overflow-wrap:anywhere;scrollbar-width:thin}
.qb{min-width:0}
/* a little air so a tall fraction that wrapped onto the next line does not touch the one above */
.reader .katex .base{padding-block:.2em}
.pager{display:grid;grid-template-columns:minmax(96px,1fr) minmax(0,auto) minmax(96px,1fr);gap:8px;align-items:center;margin:22px 0}
/* every page as a numbered button, the current one in lime (owner, 13 Nov 2026: no dropdown); on a phone the numbers take their own row */
.pnums{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
.pn{display:grid;place-items:center;min-width:44px;height:44px;padding:0 8px;border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--text);font:700 16px var(--f-body);text-decoration:none}
.pn:hover{border-color:var(--accent)}
.pn[aria-current]{background:var(--lime);border-color:var(--lime);color:var(--lime-ink)}
.pn:focus-visible,.sj:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media(max-width:640px){.pager{grid-template-columns:1fr 1fr}.pnums{grid-column:1/-1;grid-row:2}}
/* the book's subjects as buttons under its instructions; the one being read in the green */
.subj{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.sj{display:inline-flex;align-items:center;min-height:44px;padding:6px 16px;border-radius:99px;border:1.5px solid var(--line);background:var(--paper);color:var(--text);font:600 15px/1.3 var(--f-body);text-decoration:none}
.sj:hover{border-color:var(--accent)}
.sj[aria-current]{background:var(--green);border-color:var(--green);color:#f1f6dd}
.qs .q{scroll-margin-top:90px}
.pg{min-height:48px;display:grid;place-items:center;white-space:nowrap;border-radius:12px;border:1px solid var(--line);background:var(--paper);font:600 15px var(--f-body);color:var(--text);padding:0 12px}
.pg.next{background:var(--green);border-color:var(--green);color:#f1f6dd}
.pg.off{opacity:.35}
.cheer{text-align:center;font:600 15px/1.6 var(--f-body);color:var(--accent);margin-top:22px}
/* set apart from the book's own text above it: its own box and a label */
.yours{font-size:14px;line-height:1.7;color:var(--text);background:var(--chip);border:1px dashed var(--accent);border-radius:14px;padding:12px 16px;margin:22px 0 18px}
.yours b{display:block;font:700 11.5px var(--f-body);letter-spacing:.08em;color:var(--accent);margin-bottom:3px}
/* Display modes. Day and Night are the site's own themes (html[data-theme], set in style.css); Reading is a warm
   paper tone that only the reader has. */
.reading .body{transition:background .3s}
.reading[data-mode=sepia] .body{--cream:#f3e9d2;--cream-2:#e6d8b8;--paper:#faf3e0;--line:#d9c8a0;--text:#3a2e1c;--muted:#7b6a4e;--green:#5a4a1f;--accent:#5a4a1f;--chip:#eadcb8;background:var(--cream);color:var(--text)}
.reading[data-mode=sepia] .wm{opacity:.6}
html[data-theme=dark] .wm{opacity:.42}
html[data-theme=dark] .tier{background:#1d2a23}
/* when the reader is not the active window or tab, the text is blurred */
.reading.away .reader{filter:blur(14px)}

@media(min-width:700px){
 .login-card{padding:38px 34px}
 .shelves{display:flex;flex-wrap:wrap}
 .shelf{flex-direction:row;min-height:46px;gap:8px;padding:0 16px;border-radius:99px;font-size:14.5px}
 .shelf.buy{min-height:46px}
 .shelf.buy.new{margin-left:auto}
 .shelf-tests{display:flex;gap:8px}
 .lib-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .lib-cover{--cw:96px}
 .rcover{--cw:104px}
 .reader{--fs:18px;padding-inline:28px}
 .opts{grid-template-columns:1fr 1fr}
}
@media(min-width:1100px){
 .lib-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* order page and my orders */
.ord{display:grid;gap:22px}
.ord h2{font:600 20px/1.4 var(--f-head);margin-bottom:10px}
.ord-list,.ord-form{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:20px}
.ord-list ul{list-style:none;padding:0;display:grid;gap:10px}
.ord-list li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--line)}
.ord-list li span:first-child{display:grid}
.ord-list small,.ord-fine,.ord-skip{font-size:13px;color:var(--muted);line-height:1.6}
.ord-price{font:700 15px var(--f-lat)}
.ord-x{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);color:var(--muted);font-size:18px}
.ord-total{display:flex;justify-content:space-between;font:600 19px var(--f-head);margin-top:14px}
.ord-total b{font-family:var(--f-lat);color:var(--accent)}
.ord-line{display:flex;justify-content:space-between;gap:10px;margin-top:10px;color:var(--muted)}
.ord-line.off{color:var(--accent);font-weight:600}
.ord-list s{color:var(--muted);font-weight:400}
.tag-pack{font:700 10.5px var(--f-lat);font-style:normal;letter-spacing:.08em;text-transform:uppercase;background:var(--chip);color:var(--accent);border-radius:99px;padding:3px 8px;vertical-align:middle}
.ord-nudge{font:600 13.5px var(--f-body);color:var(--accent);margin-top:8px}
.ord-promo{display:flex;gap:8px;margin-top:16px}
.ord-promo input{flex:1;min-width:0;min-height:46px;border-radius:12px;border:1px dashed var(--line);background:var(--cream);color:var(--text);font:15px var(--f-lat);padding:0 12px;text-transform:uppercase}
.ord-promo button{min-height:46px;padding:0 16px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--text);font:600 14px var(--f-body)}
.ord-list .form-err{color:#b3261e;margin-top:8px}
.ord-more{display:inline-block;margin-top:12px;font:600 14px var(--f-body);color:var(--accent)}
.ord-step{color:var(--muted);margin-bottom:12px;line-height:1.7}
.send-box{display:grid;gap:6px;background:#fff4d6;border:2px solid #d9a514;border-radius:16px;padding:14px 16px;margin-bottom:14px;color:#4a3800;line-height:1.65}
.send-box>b{font:700 19px/1.4 var(--f-head);color:#7a5200}
.send-box span{font-size:15px}
.send-box .send-no{font-size:13.5px;color:#8f1d12;font-weight:600}
html[data-theme=dark] .send-box{background:#3a2f0c;border-color:#d9a514;color:#f6e7b4}
html[data-theme=dark] .send-box>b{color:#ffd66b}
html[data-theme=dark] .send-box .send-no{color:#ffb4a2}
.send-tag{display:inline-block;width:max-content;font:700 11.5px var(--f-lat)!important;letter-spacing:.04em;background:#d9a514;color:#2b2000!important;border-radius:99px;padding:3px 10px;margin-top:3px}
.ord-help{text-align:center;margin-top:22px;color:var(--muted);line-height:1.7}
.ord-help a{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.myo-acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.btn-line{min-height:50px;display:inline-flex;align-items:center;padding:0 18px;border-radius:12px;border:1.5px solid var(--accent);color:var(--accent);font:600 15px var(--f-body)}
.pays{display:grid;gap:10px;margin-bottom:22px}
.pay{display:flex;gap:12px;align-items:center;border:1.5px solid var(--line);border-radius:16px;padding:14px;cursor:pointer}
.pay:has(input:checked){border-color:var(--accent);background:var(--chip)}
.pay input{width:20px;height:20px;accent-color:var(--green)}
.pay span{display:grid;gap:2px;flex:1}
.copy-no{flex:none;align-self:flex-start;font:700 12.5px var(--f-lat);padding:7px 12px;border-radius:10px;border:1.5px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer}
.copy-no.done{background:var(--accent);color:var(--paper)}
.copy-tip{font-size:14px;color:var(--muted);margin:-12px 0 22px;line-height:1.7}
.pay .pay-no{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.pay-no .copy-no{align-self:center}
.copy-no.wide{align-self:stretch;width:100%;padding:12px;font-size:14px;margin-top:10px}
.draft{white-space:pre-wrap;word-break:break-word;font:500 14px/1.7 var(--f-body);background:var(--chip);border:1px dashed var(--line);border-radius:14px;padding:14px;margin:0 0 14px}
.profile input[disabled]{opacity:.7}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:6px 0 16px}
.stat-row div{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:14px}
.stat-row b{display:block;font:700 26px var(--f-lat)}
.stat-row span{font-size:13px;color:var(--muted)}
.adm-acts .chip{padding:8px 14px;border-radius:99px;border:1px solid var(--line);background:var(--paper);font-size:14px}
.adm-acts .chip b{margin-left:6px}
.adm-acts .chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.pay em{font:700 21px var(--f-lat);font-style:normal;letter-spacing:.5px;-webkit-user-select:all;user-select:all}
.ord-form label{display:block;font:600 13.5px var(--f-body);color:var(--muted);margin:12px 0 6px}
.ord-form input:not([type=radio]):not([type=hidden]){width:100%;min-height:52px;border-radius:12px;border:1px solid var(--line);background:var(--cream);color:var(--text);font:17px var(--f-lat);padding:0 14px}
.ord-form .btn{width:100%;justify-content:center;min-height:54px;margin-top:18px;border:0}
.ord-fine{margin-top:12px}
.ord-form label.ord-agree{display:flex;gap:10px;align-items:flex-start;margin:16px 0 14px;font:400 14px/1.6 var(--f-body);color:var(--text);cursor:pointer}
.ord-form .ord-agree input[type=checkbox]{flex:none;width:20px;height:20px;min-height:0;padding:0;margin:3px 0 0;border-radius:4px;accent-color:var(--green);appearance:auto}
.ord-agree a{font-weight:600;text-decoration:underline}
.trace-q{margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
.trace-q>p{margin:6px 0 10px;font-size:13.5px;color:var(--muted)}
.ord-err{background:#fde8e4;color:#8f1d12;border-radius:12px;padding:12px 14px;margin-bottom:16px}
.myos{list-style:none;padding:0;display:grid;gap:12px;margin-bottom:22px}
.myo{display:flex;justify-content:space-between;gap:14px;background:var(--paper);border:1px solid var(--line);border-left:5px solid var(--line);border-radius:16px;padding:14px 16px}
.myo.ok{border-left-color:#2f8a5f}.myo.wait{border-left-color:#d9a514}.myo.no{border-left-color:#c2412d}
.myo small{display:block;font-size:13px;color:var(--muted);margin-top:3px}
.myo-why{color:#b3261e!important}
.myo-r{text-align:right;white-space:nowrap;display:grid;gap:4px;align-content:start}
.myo-r span{font:700 15px var(--f-lat)}
.myo-r i{font:600 12.5px var(--f-body);font-style:normal;color:var(--muted)}
@media(min-width:900px){.ord{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:start}}

/* admin portal */
.adm-head{padding-block:22px 54px}
.adm-nav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.adm-nav a{padding:9px 15px;border-radius:99px;border:1px solid var(--line);background:var(--paper);font:600 14px var(--f-body);color:var(--text)}
.adm-nav a.on{background:var(--green);border-color:var(--green);color:#f1f6dd}
.adm-search,.adm-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:8px}
.adm input,.adm select{min-height:46px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--text);font:15px var(--f-body);padding:0 12px;min-width:0}
.num-edit{align-items:flex-end}.num-edit label{display:flex;flex-direction:column;gap:3px;font-size:.78rem;color:var(--muted);flex:0 1 110px}.adm-row.num-edit label input{width:100%;flex:0 0 auto}.num-edit select{flex:0 1 210px}
.adm-search input{flex:1 1 220px}.adm-row input,.adm-row select{flex:1 1 160px}.adm .narrow{flex:0 0 80px;width:80px}.adm-row.tight input{flex:0 1 110px;width:110px}
.adm .btn{min-height:46px;border:0}
.btn-no{min-height:46px;padding:0 16px;border-radius:12px;border:1.5px solid #c2412d;background:none;color:#c2412d;font:600 14px var(--f-body)}
.btn-no.sm{min-height:36px;padding:0 11px;font-size:13px;border-width:1px}
.adm-h{font:600 20px/1.4 var(--f-head);margin:30px 0 12px}
.adm-lead{color:var(--muted);line-height:1.75;margin-bottom:14px;max-width:820px}
.adm-none{color:var(--muted);padding:6px 0}
.adm-err{background:#fde8e4;color:#8f1d12;border-radius:12px;padding:12px 14px;margin-bottom:16px}
.adm-who{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:12px 16px;margin:12px 0}
.tag-no{color:#c2412d;font-weight:600}
.ocs{display:grid;gap:12px}
.oc{background:var(--paper);border:1px solid var(--line);border-left:5px solid #d9a514;border-radius:16px;padding:14px 16px;display:grid;gap:5px;font-size:15px}
.oc.ok{border-left-color:#2f8a5f}.oc.no{border-left-color:#c2412d}
.oc header{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.oc header b{font:700 17px var(--f-lat)}
.oc-trx b{font-family:var(--f-lat);letter-spacing:.4px;-webkit-user-select:all;user-select:all}
.oc-books,.oc-when,.oc-hint{color:var(--muted);font-size:13.5px;line-height:1.6}
.oc a{color:var(--accent);font-weight:600}
.oc-act{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.adm .admin-t small{display:block;color:var(--muted);font-size:12.5px}
.adm .admin-t tr.off td{opacity:.6}
.adm .admin-t tr.off td:last-child{opacity:1}
.btn.num-on{min-height:34px;padding:0 14px;font-size:13.5px;box-shadow:0 0 0 2px var(--ink-900)}
.num-state{display:inline-block;margin-top:5px;padding:2px 8px;border-radius:99px;font:600 12px/1.5 var(--f-body)}
.num-state.now{background:var(--lime);color:var(--ink-900)}.num-state.next{background:var(--chip);color:var(--text)}.num-state.full{background:#fde6c8;color:#6b3f00}.num-state.off{background:#e5e5e5;color:#444}
.num-move{display:flex;gap:6px;margin-top:8px}
.num-fix{margin-top:8px}.num-fix summary{cursor:pointer;font-size:13px;font-weight:600}
.num-limits input{width:100%;min-width:76px}
.num-apply{display:flex;align-items:center;gap:7px;font-size:14px}
.tag-staff{display:inline-block;margin-left:7px;padding:1px 8px;border-radius:99px;background:var(--ink-900);color:var(--lime);font:600 11.5px/1.6 var(--f-body)}
.pay-logo{display:inline-block;padding:2px 9px;border-radius:6px;color:#fff;font:800 13px/1.5 var(--f-lat);letter-spacing:-.2px}
.pay-logo.bkash{background:#e2136e}.pay-logo.nagad{background:#ec1c24}
.adm .price{width:110px}
.adm-save{position:sticky;bottom:14px;margin-top:16px;box-shadow:0 14px 26px -12px #0b271f99}
.adm-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:14px}
.adm-tiles div{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:18px}
.adm-tiles b{display:block;font:700 26px var(--f-lat)}
.adm-tiles span{color:var(--muted);font-size:13.5px}
.tg-state{list-style:none;padding:0;display:grid;gap:8px;margin-bottom:10px}
.tg-state li{background:var(--paper);border:1px solid var(--line);border-left:5px solid #c2412d;border-radius:12px;padding:10px 14px}
.tg-state li.ok{border-left-color:#2f8a5f}
.adm-acts{display:flex;flex-wrap:wrap;gap:6px}
.adm-acts a{display:inline-flex;align-items:center}
.ticks{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:4px 14px;margin-bottom:16px}
.tick{display:flex;gap:8px;align-items:flex-start;font-size:14px;padding:5px 0}
.tick input{min-height:0;width:18px;height:18px;margin-top:3px;flex:none}
.tick small{color:var(--muted)}
.bars{display:grid;grid-template-columns:repeat(14,1fr);gap:6px;align-items:end;height:150px;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:14px 12px 8px}
.bars div{height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px}
.bars i{width:100%;min-height:2px;border-radius:6px 6px 2px 2px;background:var(--green)}
.bars span{font:600 10.5px var(--f-lat);color:var(--muted)}
@media(min-width:900px){.ocs{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* book pages: "look before you buy" */
.peek{display:grid;gap:22px}
.peek-facts{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:22px}
.peek-facts h3{font:600 21px/1.4 var(--f-head);margin-bottom:10px}
.peek-facts ul{list-style:none;padding:0;display:grid;gap:9px}
.peek-facts li{position:relative;padding-left:26px;line-height:1.65;color:var(--muted)}
.peek-facts li::before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:700}
.peek-facts li b{color:var(--text)}
.peek-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px}
.peek-chips span{font:600 13px var(--f-body);background:var(--chip);color:var(--accent);border-radius:99px;padding:5px 12px}
.sample{min-width:0;font-size:17px;line-height:1.85;background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:8px 18px 18px}
.sample .q:last-of-type{border-bottom:0}
.sample .katex{font-size:1.06em}
.sample :is(.qt,.qen,.sol p,.opts li){overflow-x:auto;overflow-y:hidden;overflow-wrap:anywhere}
.sample-note{font-size:13.5px;color:var(--muted);padding:12px 0 4px}
.sample-more{font:600 15px var(--f-body);color:var(--accent);text-align:center;padding-top:16px;border-top:1px dashed var(--line)}
.solbtn.lock{display:inline-flex;align-items:center;gap:8px;border-style:dashed;opacity:.75;cursor:default}
.solbtn.lock::before{content:"";width:11px;height:9px;border-radius:2px;background:currentColor;box-shadow:0 -6px 0 -2px var(--paper),0 -6px 0 0 currentColor}
@media(min-width:900px){.peek{grid-template-columns:minmax(0,340px) minmax(0,1fr);align-items:start}.peek-facts{position:sticky;top:90px}}

/* Printing or "Save as PDF" gives one line of text and none of the book. */
@media print{
 .dock{display:none!important}
 body.reading>*{display:none!important}
 body.reading::after{content:"এই বই print করা যায় না। তোমার account-এ login করে growthskool.bd-তে পড়ো।";display:block;padding:40px;font:600 18px sans-serif;color:#000}
}
/* ---- admin portal: its own frame (compact, like a control panel) */
.admin-app{background:var(--cream);min-height:100vh;font-size:14px;--adm-side:232px}
.adm-top{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:10px;height:48px;padding:0 14px;background:#0b271f;color:#eef3df;border-bottom:1px solid #1d4637}
.adm-top .brand{display:flex;align-items:center;gap:7px;color:#eef3df;font-size:16px}
.adm-top .brand img{width:24px;height:24px}
.adm-burger{display:grid;place-items:center;width:34px;height:34px;border-radius:8px;border:0;background:transparent;color:#eef3df;cursor:pointer}
.adm-burger:hover,.adm-me summary:hover{background:#17392e}
.adm-burger svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.adm-top-r{margin-left:auto;display:flex;align-items:center;gap:8px}
.adm-me{position:relative}
.adm-me{border:0}
.adm-me-menu p{margin:0}
.adm-me summary{list-style:none;display:flex;align-items:center;gap:8px;padding:4px 6px;border:0;border-radius:99px;cursor:pointer;font-size:inherit}
.adm-me summary::-webkit-details-marker{display:none}
.adm-me summary::after,.adm-me[open] summary::after{content:none}
.adm-avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#c6f25a;color:#0b271f;font:700 13px var(--f-lat)}
.adm-me-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;background:var(--paper);color:var(--text);border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px rgba(0,0,0,.22);padding:6px;display:grid;gap:1px;z-index:60}
.adm-me-who{display:grid;gap:1px;padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.adm-me-who b{font:600 14px var(--f-body)}
.adm-me-who span{font-size:12.5px;color:var(--muted);word-break:break-all}
.adm-me-who em{font:700 10.5px var(--f-lat);font-style:normal;letter-spacing:1px;text-transform:uppercase;color:var(--accent);margin-top:4px}
.adm-me-menu a,.adm-me-menu button{display:block;width:100%;text-align:left;padding:8px 10px;border:0;border-radius:8px;background:none;color:var(--text);font:500 13.5px var(--f-body);cursor:pointer}
.adm-me-menu a:hover,.adm-me-menu button:hover{background:var(--chip)}
.adm-me-menu form{margin:0;border-top:1px solid var(--line);padding-top:4px;margin-top:4px}
.adm-me-menu form button{color:#c2412d}
.adm-shell{display:grid;grid-template-columns:var(--adm-side) minmax(0,1fr);align-items:start}
.adm-shell>.adm-main:first-child{grid-column:1/-1}
.adm-side{height:calc(100vh - 48px - 48px);overflow-y:auto;padding:10px 8px 14px;background:var(--paper);border-right:1px solid var(--line)}
.adm-side details{border-bottom:0;padding:2px 0 8px}
.adm-side details:last-of-type{border-bottom:0}
.adm-side summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;font:600 12px var(--f-lat);letter-spacing:.9px;text-transform:uppercase;color:var(--muted);cursor:pointer}
.adm-side summary::-webkit-details-marker{display:none}
.adm-side summary::after,.adm-side details[open] summary::after{content:"";flex:none;width:6px;height:6px;border:0;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;border-radius:0;background:none;color:inherit;transform:rotate(-45deg);transition:transform .15s}
.adm-side details[open] summary::after{transform:rotate(45deg)}
.adm-side summary:hover{background:var(--chip)}
.adm-side a{display:flex;align-items:center;gap:11px;padding:7px 10px;border-radius:8px;font:500 13.5px var(--f-body);color:var(--text);white-space:nowrap}
.adm-side a svg{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.adm-side a span{overflow:hidden;text-overflow:ellipsis}
.adm-side a:hover{background:var(--chip)}
.adm-side a.on{background:var(--chip);color:var(--text);font-weight:600;box-shadow:inset 3px 0 0 var(--green)}
.adm-side a.on svg{opacity:1;color:var(--green)}
.adm-grip{position:absolute;top:0;right:-3px;width:6px;height:100%;cursor:col-resize}
.adm-side-wrap{position:sticky;top:48px;align-self:start}
.adm-nav-off .adm-shell{grid-template-columns:minmax(0,1fr)}
.adm-nav-off .adm-side-wrap{display:none}
.adm-main{padding:16px 22px 50px;min-width:0}
.adm-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);margin-bottom:8px}
.adm-crumbs a{color:var(--muted)}
.adm-crumbs a:hover{color:var(--text);text-decoration:underline}
.adm-crumbs b{font-weight:600;color:var(--text)}
.adm-crumbs i{font-style:normal;opacity:.6}
.adm-headrow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.adm-title{font:600 22px/1.25 var(--f-head);margin:0}
.adm-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.adm-foot{display:flex;justify-content:flex-end;margin-top:14px}
.adm-ask{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:16px;background:rgba(6,20,15,.55)}
.adm-ask-card{width:min(440px,100%);background:var(--paper);color:var(--text);border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.adm-ask-card h2{font:600 18px/1.3 var(--f-head);margin:0 0 10px}
.adm-ask-what{font-weight:600;margin:0 0 6px}
.adm-ask-note{color:var(--muted);font-size:13.5px;line-height:1.6;margin:0 0 18px}
.adm-ask-acts{display:flex;justify-content:flex-end;gap:8px}
.adm-ask-acts .btn,.adm-ask-acts .btn-no{min-width:84px;justify-content:center}
.admin-app .adm-h{font-size:16px;margin:22px 0 10px}
.admin-app .adm-lead{font-size:13.5px;line-height:1.65;margin-bottom:12px}
.admin-app .admin-t td,.admin-app .admin-t th{font-size:13.5px;padding:8px 10px}
.admin-app .admin-t th{font:600 12px var(--f-lat);letter-spacing:.4px;color:var(--muted)}
.admin-app .admin-t small{font-size:12px}
.admin-app input,.admin-app select,.admin-app textarea{min-height:36px;font-size:13.5px;padding:6px 10px;border-radius:8px}
.admin-app .btn,.admin-app .adm .btn{min-height:36px;padding:0 14px;font-size:13.5px;border-radius:8px}
.admin-app .btn-no{min-height:36px;padding:0 12px;font-size:13px;border-radius:8px}
.admin-app .btn-no.sm{min-height:30px;padding:0 10px;font-size:12.5px}
.admin-app .form-ok,.admin-app .form-err{font-size:13.5px;padding:10px 12px;border-radius:8px}
.admin-app .stat-row div{padding:12px;border-radius:10px}
.admin-app .stat-row b{font-size:22px}
.admin-app .stat-row span{font-size:12.5px}
.admin-app .oc{font-size:13.5px}
.admin-app .adm-acts .chip{padding:6px 12px;font-size:13px}
.admin-app a.btn-no{display:inline-flex;align-items:center;text-decoration:none}
.dash-live{margin-left:auto;font-size:12.5px;color:var(--muted)}
.dash-card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:14px 16px;min-width:0}
.dash-card h2{font:600 14px/1.3 var(--f-head);margin:0 0 12px}
.dash-note{font-size:12px;color:var(--muted);margin:10px 0 0}
.dash-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:12px 0}
.dash-ins{margin:10px 0 12px}
.dash-ins ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.dash-ins li{padding:8px 12px;border-radius:8px;border-left:4px solid #6f8f7f;background:var(--chip);font-size:13.5px;line-height:1.55}
.dash-ins li.good{border-left-color:#2f8a5f}.dash-ins li.warn{border-left-color:#c2412d}
.dash-ins a{text-decoration:underline;text-underline-offset:3px}
.admin-app .dash-tiles{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:0}
.admin-app .dash-tiles div{padding:12px 14px;border-radius:12px;display:grid;gap:2px}
.admin-app .dash-tiles b{font-size:22px}
.admin-app .dash-tiles span{font-size:12.5px}
.dash-tiles em{font:600 12px var(--f-lat);font-style:normal}
.dash-tiles em.up{color:#2f8a5f}.dash-tiles em.down{color:#c2412d}.dash-tiles em.flat{color:var(--muted)}
.dash-tiles small{font-size:12px;color:var(--muted)}
.dash-card .bars{height:130px;border:0;padding:0;border-radius:0;background:none;gap:3px}
.dash-card .bars i{border-radius:3px 3px 0 0}
.hbar{display:grid;grid-template-columns:minmax(90px,34%) 1fr auto 38px;gap:8px;align-items:center;font-size:13px;margin-bottom:7px}
.hbar span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar div{height:10px;border-radius:99px;background:var(--chip);overflow:hidden}
.hbar i{display:block;height:100%;border-radius:99px;background:var(--green)}
.hbar b{font:600 13px var(--f-lat)}
.hbar small{color:var(--muted);text-align:right;font-size:12px}
@media(max-width:900px){.dash-grid{grid-template-columns:minmax(0,1fr)}.dash-live{margin-left:0;width:100%}}
.adm-login{display:grid;place-items:center;min-height:calc(100vh - 140px);padding:20px}
.adm-login .login-card{max-width:420px;width:100%;box-sizing:border-box;display:grid;gap:14px;justify-items:center;text-align:center;padding:32px 28px;border-radius:18px;background:#0f2f25;color:#eef3df}
.adm-login .login-card h1{font:600 26px/1.2 var(--f-head);color:#fff;margin:0}
.adm-login .login-lead{color:#b9cdbf;margin:0;font-size:14px}
.adm-login .btn-google{width:100%;justify-content:center;white-space:nowrap}
.adm-login .eyebrow{white-space:nowrap}
.adm-shade{display:none}
@media(max-width:860px){
 .admin-app{font-size:13.5px}
 .adm-shell{grid-template-columns:minmax(0,1fr)}
 .adm-side-wrap{position:fixed;top:48px;left:0;bottom:0;width:min(82vw,280px);z-index:55;transform:translateX(-102%);transition:transform .2s;display:block!important}
 .adm-side{position:static;height:100%;box-shadow:8px 0 30px rgba(0,0,0,.25)}
 .adm-grip{display:none}
 .adm-nav-open .adm-side-wrap{transform:none}
 .adm-nav-open .adm-shade{display:block;position:fixed;inset:48px 0 0 0;background:rgba(6,20,15,.5);z-index:54}
 .adm-main{padding:14px 12px 44px}
 .adm-title{font-size:19px}
 .admin-app .admin-t td,.admin-app .admin-t th{font-size:13px;padding:7px 8px}
 .adm-top .wordmark{font-size:15px}
}
/* signed-in pages: no site map at the foot, only a quiet line */
.foot-slim{padding:8px 0 12px;border-top:1px solid var(--ink-line,#1d4637)}
.foot-slim .wrap{display:flex;justify-content:center;gap:12px;font-size:13px;color:var(--on-dark-muted,#9fb8ab)}
.foot-slim a{color:inherit;text-decoration:underline;text-underline-offset:3px}
/* signed-in pages fill the screen like an app: the page body stretches, so the foot line always sits at the bottom */
body.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
body.app>main{flex:1;display:flex;flex-direction:column}
body.app>main>.body{flex:1}
.adm-tqs{display:grid;gap:14px}
.adm-tq{border:1px solid var(--line);border-radius:14px;padding:14px 16px;background:var(--paper)}
.adm-tq.void{opacity:.65;border-style:dashed}
.adm-tq-head{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;font-size:14px;color:var(--muted)}
.adm-tq-head span{flex:1 1 260px}
.adm-tq-head b{color:var(--text)}
.adm-tq-head form,.adm-tq-acts form{display:inline}
.adm-tq-q{margin-top:10px;line-height:1.7}
.adm-tq-q details{margin-top:8px;font-size:14px}
.adm-tq-q summary{display:inline-flex;padding:4px 0;font-size:14px;color:var(--muted)}
.adm-tq-q summary::after{display:none}
.adm-tq-reps{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px;font-size:14px}
.adm-tq-reps li{border-top:1px solid var(--line);padding-top:6px}
.adm-tq-st{font-weight:700;margin-right:4px}
.adm-tq-st.open{color:#b3541e}
.adm-tq-acts{display:inline-flex;gap:6px;margin-left:8px}
.adm-tq .btn{min-height:36px;height:36px;padding-inline:12px;font-size:13px}
.gw-modes{display:grid;gap:8px;justify-items:start;margin:10px 0 18px}.gw-mode{font-size:14.5px}
.free-pack,.tp-free{margin:0 0 14px;padding:10px 14px;border:1px solid var(--lime);border-radius:12px;background:var(--chip);font-size:14.5px;line-height:1.6}
.free-pack a,.tp-free a{font-weight:600;border-bottom:2px solid var(--lime)}
.toc-note{color:var(--muted);margin:-6px 0 18px;max-width:760px;line-height:1.7}
.toc{display:grid;gap:12px}
.toc-tier{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:0 18px}
.toc-tier summary{cursor:pointer;padding:16px 0;font:600 18px/1.4 var(--f-head)}
.toc-tier summary small,.toc-sub h4 small{font:400 13px var(--f-body);color:var(--muted);margin-left:6px}
.toc-subs{display:grid;gap:18px;padding-bottom:18px}
.toc-sub h4{font:600 15.5px/1.4 var(--f-head);margin-bottom:8px}
.toc-sub ul{list-style:none;padding:0;margin:0;display:grid;gap:2px}
.toc-sub li{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:6px 0;border-bottom:1px dashed var(--line);font-size:14.5px;line-height:1.5}
.toc-sub li span{flex:1 1 12em}
.toc-sub li b{font-weight:600;min-width:1.6em;text-align:right}
.toc-sub li i{font-style:normal;font-size:12.5px;color:var(--accent);background:var(--chip);border-radius:99px;padding:1px 9px}
@media(min-width:900px){.toc-subs{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:28px}}
.free-kit{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:0 0 16px;padding:12px 16px;border:1px dashed var(--lime);border-radius:14px;font:500 15px/1.55 var(--f-body)}
.free-kit span{flex:1 1 16em}
.free-kit-go{padding:8px 16px;border-radius:10px;background:var(--lime);color:var(--lime-ink,#10302a);font:600 15px/1.2 var(--f-head);white-space:nowrap}
.lib-h{font:600 21px/1.4 var(--f-head);margin:0 0 14px}
.lib-free{margin-bottom:34px}
.lib-free .lib-grid{margin-bottom:12px}
.lib-free-go{margin:14px 0 0}
.lib-free-go a,.lib-none a{font-weight:600;border-bottom:2px solid var(--lime)}
.free-stream{margin:0 0 22px}
.free-stream-h{font:600 16px/1.4 var(--f-head);color:var(--accent);margin:0 0 10px;padding-left:10px;border-left:3px solid var(--lime)}
.free-stream .tp-free{margin:10px 0 0}
.lib-views{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;margin:0 0 22px;border-radius:16px;background:var(--paper);border:1px solid var(--line)}
.lib-views a{min-height:48px;display:flex;align-items:center;justify-content:center;gap:6px;border-radius:12px;border:2px solid transparent;font:700 15px var(--f-lat);color:#fff;text-shadow:0 1px 2px #0005;opacity:.72;transition:opacity .2s}
.lib-views a:first-child{background:linear-gradient(135deg,#0b3d2a,#1f7a4c)}
.lib-views a:last-child{background:linear-gradient(135deg,#2f5a00,#5f9a14)}
.lib-views a:hover{opacity:1}
.lib-views a b{font-size:12px;color:#ffffffc0}
.lib-views a.on{opacity:1;border-color:#fff;box-shadow:0 0 0 3px var(--green),0 8px 18px -8px #000a}
.free-ask{margin:0 0 10px;font:600 17px/1.4 var(--f-head);text-align:center}
.free-pick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 22px}
.free-pick a{min-height:50px;display:flex;align-items:center;justify-content:center;border-radius:14px;border:2px solid transparent;font:700 15px var(--f-lat);color:#fff;text-shadow:0 1px 2px #0005;box-shadow:0 8px 18px -10px #000a;opacity:.82;transition:transform .2s,opacity .2s}
.free-pick a.science{background:linear-gradient(135deg,#0b3d2a,#1f7a4c)}
.free-pick a.business{background:linear-gradient(135deg,#5a8f00,#a8d83a)}
.free-pick a.arts{background:linear-gradient(135deg,#14532d,#16a34a)}
.free-pick a:hover{opacity:1;transform:translateY(-2px)}
.free-pick a.on{opacity:1;border-color:#fff;box-shadow:0 0 0 3px var(--green),0 10px 22px -8px #000b;transform:translateY(-2px)}
.lib-empty p.lib-add{margin:4px 0 0;color:var(--text);font:600 24px/1.4 var(--f-head)}
.lib-add span{padding:0 6px;background:linear-gradient(transparent 55%,var(--lime) 55%,var(--lime) 92%,transparent 92%)}
.lib-acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:420px;margin:18px auto 0}
.lib-acts .btn{justify-content:center;margin:0;min-height:48px;border:1.5px solid var(--green);border-radius:12px}
.lib-acts .btn,.lib-acts .btn.p{border:2px solid transparent;color:#fff;font-weight:700;text-shadow:0 1px 2px #0005;box-shadow:0 8px 18px -10px #000a}
.lib-acts .btn:nth-child(1){background:linear-gradient(135deg,#0b3d2a,#1f7a4c)}
.lib-acts .btn:nth-child(2){background:linear-gradient(135deg,#5a8f00,#a8d83a)}
.lib-acts .btn:nth-child(3){background:linear-gradient(135deg,#14532d,#16a34a)}
.lib-acts .btn:nth-child(4){background:linear-gradient(135deg,#1f7a4c,#7cb518)}
.ads{margin:8px 0 30px}
.ads-h{margin:0 0 12px;text-align:center;font:600 16px/1.45 var(--f-head);color:var(--accent)}
.ad-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:18px}
.ad-track::-webkit-scrollbar{display:none}
.ad-slide{flex:0 0 100%;scroll-snap-align:start;position:relative;aspect-ratio:16/9;overflow:hidden;container-type:inline-size;background:#0b271f}
.ad-slide img{display:block;width:100%;height:100%}
.ad-buy{position:absolute;left:4.5cqw;bottom:5cqw;display:flex;align-items:center;gap:2.2cqw;padding:1.4cqw 1.6cqw 1.4cqw 2.4cqw;border-radius:99px;background:linear-gradient(135deg,#ffffff30,#ffffff0c);border:1.5px solid #ffffff60;box-shadow:0 2cqw 4cqw -1.5cqw #000c;color:#fff}
.ad-n{font:600 3cqw var(--f-body);color:#e9efff}
.ad-p{display:flex;align-items:baseline;gap:1.2cqw;font-family:var(--f-lat)}
.ad-p s{font-size:2.8cqw;color:#ffffffa0}
.ad-p b{font-size:5.6cqw;font-weight:800;color:#ffe066;text-shadow:0 .4cqw 0 #0007}
.ad-go{padding:1.3cqw 2.4cqw;border-radius:99px;background:linear-gradient(180deg,#e6ff8a,#9bd12a);color:#0b271f;font-weight:700;font-size:3cqw;white-space:nowrap}
.ad-dots{display:flex;justify-content:center;flex-wrap:wrap;margin-top:4px}
.ad-dots button{padding:9px 4px;border:0;background:none;cursor:pointer}
.ad-dots i{display:block;width:8px;height:8px;border-radius:99px;background:var(--line);transition:width .25s,background .25s}
.ad-dots button.on i{width:22px;background:var(--green)}
/* My Library on tablets and computers: the switches and the posters keep a readable width, centred */
.lib-views{max-width:560px;margin-inline:auto}
.free-pick{max-width:640px;margin-inline:auto}
.ads{max-width:760px;margin-inline:auto}
@media(min-width:760px){.lib-views a,.free-pick a{min-height:54px;font-size:16px}.ads-h{font-size:18px}.lib-acts{max-width:480px}.lib-acts .btn{min-height:52px}}
.adm-side summary{font:500 12px var(--f-lat);letter-spacing:0;text-transform:none}
.adm-rail-btn{display:flex;align-items:center;justify-content:center;width:100%;height:48px;border:0;border-top:1px solid var(--line);border-right:1px solid var(--line);background:var(--paper);color:var(--muted);cursor:pointer}
.adm-rail-btn:hover{color:var(--text);background:var(--chip)}
.adm-rail-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
@media(min-width:861px){
 .adm-rail .adm-shell{grid-template-columns:60px minmax(0,1fr)}
 .adm-rail .adm-side{padding:8px 6px;overflow-x:hidden}
 .adm-rail .adm-side summary{height:0;padding:0;overflow:hidden;pointer-events:none}
 .adm-rail .adm-side details{padding:4px 0;border-bottom:1px solid var(--line)}
 .adm-rail .adm-side details:last-of-type{border-bottom:0}
 .adm-rail .adm-side details:not([open])>a{display:flex}
 .adm-rail .adm-side a{justify-content:center;padding:9px 0}
 .adm-rail .adm-side a span{display:none}
 .adm-rail .adm-side a svg{width:20px;height:20px}
 .adm-rail .adm-side a.on{box-shadow:none}
 .adm-rail .adm-grip{display:none}
}
@media(max-width:860px){.adm-rail-btn{display:none}.adm-side{height:100%}}
.adm-portal{margin-left:10px;padding-left:10px;border-left:1px solid #2f5a46;font:500 14px var(--f-lat);color:#c5d8c9;letter-spacing:.2px}
@media(min-width:861px){.adm-burger{display:none}.adm-top{padding-left:18px}}
.adm-rail-btn{justify-content:flex-start;padding-left:18px}
.adm-rail .adm-rail-btn{justify-content:center;padding-left:0}
.adm-export{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 14px;border-radius:9px;background:var(--green);color:#f1f6dd;font:600 13.5px var(--f-body);border:1px solid var(--green);box-shadow:0 4px 12px -6px #0b271f88}
.adm-export:hover{background:#174f3b}
.adm-export svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.adm-range{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}
.adm-range label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.adm-range input[type=date]{min-height:34px;padding:0 8px;border-radius:8px;border:1px solid var(--line);background:var(--paper);color:var(--text);font:500 13px var(--f-body)}
.adm-range .btn.sm{height:36px;min-height:36px;padding:0 16px;border-radius:99px;font-size:13px;box-shadow:none}
.adm-range .chip{height:36px;display:inline-flex;align-items:center}
.adm-range input[type=date]{height:36px;min-height:36px}
.admin-app .stat-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
/* the narrow side menu opens while the pointer is over it, laid over the page, and closes when the pointer leaves */
@media(min-width:861px){
 .adm-rail .adm-side-wrap{width:60px;z-index:58;transition:width .15s ease .12s,box-shadow .15s ease .12s}
 .adm-rail .adm-side-wrap:hover{width:240px;box-shadow:12px 0 28px -10px rgba(0,0,0,.28)}
 .adm-rail .adm-side-wrap:hover .adm-side{padding:10px 8px 14px}
 .adm-rail .adm-side-wrap:hover .adm-side summary{height:auto;padding:7px 10px;overflow:visible;pointer-events:auto}
 .adm-rail .adm-side-wrap:hover .adm-side details{border-bottom:0;padding:2px 0 8px}
 .adm-rail .adm-side-wrap:hover .adm-side a{justify-content:flex-start;padding:7px 10px}
 .adm-rail .adm-side-wrap:hover .adm-side a span{display:inline}
 .adm-rail .adm-side-wrap:hover .adm-side a svg{width:18px;height:18px}
 .adm-rail .adm-side-wrap:hover .adm-side a.on{box-shadow:inset 3px 0 0 var(--green)}
 .adm-rail .adm-side-wrap:hover .adm-rail-btn{justify-content:flex-start;padding-left:18px}
}
.adm-range .chip{padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--paper);font-size:13px}
.adm-range .chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.adm-range-pick{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-left:auto}
.adm-range .btn.p.sm{background:var(--green);color:#f1f6dd;border:1px solid var(--green)}
.adm-range .btn.p.sm:hover{background:#174f3b}
.adm-sub{margin:-6px 0 18px;color:var(--muted);font-size:14px}
.admin-app .adm-search input{height:40px;min-height:40px;font-size:14px;border-radius:10px}
.admin-app .adm-search .btn{height:40px;min-height:40px;min-width:130px;padding:0 26px;justify-content:center;font-size:15px;font-weight:700;border-radius:10px}
/* the whole email cell opens the account, not only the email */
.admin-t td.cell-link{position:relative}
.admin-t td.cell-link a::after{content:"";position:absolute;inset:0}
.admin-t td.cell-link:hover{background:var(--chip)}
.adm-tabs{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 16px;border-bottom:1px solid var(--line)}
.adm-tabs a{padding:9px 14px;margin-bottom:-1px;border:1px solid transparent;border-radius:10px 10px 0 0;font:600 13.5px var(--f-body);color:var(--muted)}
.adm-tabs a:hover{color:var(--text);background:var(--chip)}
.adm-tabs a.on{color:var(--text);background:var(--paper);border-color:var(--line);border-bottom-color:var(--paper);box-shadow:inset 0 3px 0 var(--green)}
.adm-tab{min-height:120px}
.adm-title-note{color:var(--muted);font-size:14px;align-self:center;margin-right:auto}
/* the Reading tab's "Last seen" line, lightly marked (owner, 7 Nov 2026) */
.adm-seen{display:inline-block;padding:7px 12px;border-radius:8px;background:color-mix(in srgb,var(--green) 7%,transparent);border:1px solid color-mix(in srgb,var(--green) 18%,transparent)}
/* a user's Orders tab: Gateway / Manual buttons (owner, 7 Nov 2026) */
.adm-seg{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.adm-seg .chip{min-height:36px;padding:0 16px;display:inline-flex;align-items:center;gap:6px}
.adm-seg .chip b{font-weight:600;opacity:.7}
.adm-seg .chip{border-radius:99px;border:1px solid var(--line);background:var(--paper);font:500 13.5px var(--f-body);color:var(--text)}
.adm-seg .chip.on{background:var(--green);color:#fff;border-color:var(--green)}
/* the status tabs inside a user's Orders tab, a size smaller than the page tabs */
.adm-subtabs{margin:0 0 14px}
.adm-subtabs a{padding:7px 12px;font-size:13px}
/* a user's orders as rows (Orders tab) */
.adm-orows td small{display:block;margin-top:2px;font-size:11.5px;color:var(--muted)}
.adm-orows td b{display:block}
.adm-orows .mono{font-family:ui-monospace,Consolas,monospace;font-size:12px}
.os-badge{display:inline-block;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600}
.os-badge.ok{background:color-mix(in srgb,var(--green) 14%,transparent);color:var(--green)}
.os-badge.wait{background:color-mix(in srgb,#d4a017 18%,transparent);color:#9a6b00}
.os-badge.no{background:color-mix(in srgb,#c0392b 12%,transparent);color:#b03a2e}
.adm-orows tr.orow{cursor:pointer}
.adm-orows tr.orow:hover td{background:var(--chip)}
.adm-orows tr.orow[aria-expanded=true] td{background:color-mix(in srgb,var(--green) 6%,transparent);border-bottom-color:transparent}
.adm-orows tr.orow td:last-child{text-align:right;white-space:nowrap}
.orow-car{display:inline-block;width:7px;height:7px;margin-left:10px;border:solid var(--muted);border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .15s}
.adm-orows tr.orow[aria-expanded=true] .orow-car{transform:rotate(-135deg)}
.adm-orows tr.orow-more td{background:color-mix(in srgb,var(--green) 6%,transparent);padding:4px 14px 16px}
.orow-dl{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px 22px;margin:0}
.orow-dl div{min-width:0}
.orow-dl dt{font-size:11.5px;color:var(--muted);margin-bottom:2px}
.orow-dl dd{margin:0;font-size:13.5px;overflow-wrap:anywhere}
.orow-dl .muted{color:var(--muted);font-size:12.5px}
/* the account's name line on a user's page, in a light card, with the details beside it lightly marked (owner, 7 Nov 2026) */
.adm-headcard{align-items:center;gap:10px 14px;padding:12px 16px;border:1px solid var(--line);border-left:3px solid var(--green);border-radius:12px;background:var(--paper);box-shadow:0 1px 2px rgba(0,0,0,.04)}
.adm-headcard .adm-title{margin:0}
.adm-headcard .adm-title-note{padding:4px 11px;border-radius:99px;background:color-mix(in srgb,var(--green) 8%,transparent);border:1px solid color-mix(in srgb,var(--green) 16%,transparent);color:var(--text);font-size:13px}
/* Active / Offline at the right of a user's name line */
.adm-presence{display:inline-flex;align-items:center;gap:7px;padding:5px 12px;border-radius:99px;font-size:12.5px;color:var(--muted);background:var(--chip);border:1px solid var(--line)}
.adm-presence b{color:var(--text);font-weight:600}
.adm-presence i{width:8px;height:8px;border-radius:50%;background:#9aa59c}
.adm-presence.on{background:color-mix(in srgb,var(--green) 10%,transparent);border-color:color-mix(in srgb,var(--green) 25%,transparent)}
.adm-presence.on i{background:#22a559;box-shadow:0 0 0 3px color-mix(in srgb,#22a559 22%,transparent)}
/* Action column on a user's orders */
.adm-orows tr.orow td:last-child{width:28px}
.orow-act{font-size:12.5px;font-weight:600;white-space:nowrap}
.orow-act.done{color:var(--green)}
.orow-act.wait{color:var(--muted);font-weight:500}
.orow-review{padding:5px 12px;font-size:12.5px;white-space:nowrap}
.orow-act.todo{color:#9a6b00}
.orow-warn{display:inline-grid;place-items:center;width:16px;height:16px;margin-left:6px;border-radius:50%;background:#c0392b;color:#fff;font:700 11px var(--f-body)}
.orow-more .oc-act{margin-top:14px}
/* order windows (Method ↗ / Bought ↗) and copy buttons (owner, 7 Nov 2026) */
.pop-open{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;font:600 13.5px var(--f-body);color:var(--green);cursor:pointer;text-align:left}
.pop-open:hover{text-decoration:underline}
.pop-open span{font-size:12px}
.cp{margin-left:6px;padding:0 5px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--muted);font-size:12px;line-height:18px;cursor:pointer;vertical-align:middle}
.cp:hover{color:var(--text);border-color:var(--muted)}
.cp.ok{color:var(--green);border-color:var(--green)}
.cp-v{overflow-wrap:anywhere}
dialog.adm-pop{width:min(560px,calc(100vw - 32px));max-height:min(80vh,720px);padding:0;border:1px solid var(--line);border-radius:14px;background:var(--paper);color:var(--text);box-shadow:0 20px 60px -20px rgba(0,0,0,.45)}
dialog.adm-pop::backdrop{background:rgba(10,25,18,.45)}
.adm-pop>header{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--paper);font-size:15px}
.pop-x{width:30px;height:30px;border:0;border-radius:8px;background:var(--chip);color:var(--text);font-size:18px;cursor:pointer}
.pop-dl{display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;margin:0;padding:16px 18px}
.pop-dl dt{font-size:11.5px;color:var(--muted);margin-bottom:2px}
.pop-dl dd{margin:0;font-size:13.5px}
.pop-h{margin:0;padding:12px 18px 0;font:600 12.5px var(--f-body);color:var(--muted);text-transform:uppercase;letter-spacing:.4px}
.pop-note{margin:0;padding:0 18px 18px;font-size:12.5px;color:var(--muted)}
.pop-pack{margin:0;padding:16px 18px 0;font-weight:700}
.pop-books{list-style:none;margin:0;padding:10px 18px 4px;border-bottom:1px solid var(--line)}
.pop-books li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:13.5px}
.pop-books li:last-child{border-bottom:0}
@media(max-width:560px){.pop-dl{grid-template-columns:1fr}}
.pop-kind{margin-left:6px;padding:1px 8px;border-radius:99px;background:var(--chip);font:500 11.5px var(--f-body);color:var(--muted)}
.adm-orows td small{display:block}
/* Action text by outcome: green good, red rejected or cancelled, yellow anything in between (owner, 7 Nov 2026) */
.orow-act.wait,.orow-act.todo{color:#a87400;font-weight:600}
.orow-act.no{color:#b03a2e}
.orow-act.done{color:var(--green)}
.adm-presence.off{background:color-mix(in srgb,#c0392b 7%,transparent);border-color:color-mix(in srgb,#c0392b 22%,transparent)}
.adm-presence.off i{background:#d9534f}
.adm-presence.off b{color:#b03a2e}
.adm-presence.on b{color:#1e8a4c}
/* Give a book: book, then reason, then Cancel / Confirm */
.adm-give{display:flex;flex-direction:column;gap:10px;max-width:720px}
.adm-give select,.adm-give input[name=note]{width:100%;min-height:42px}
.adm-give-acts{display:flex;justify-content:flex-end;gap:10px}
.adm-give-acts[hidden]{display:none}
.adm-give-acts button{min-width:110px;min-height:40px}
/* portal picker: a search box over grouped choices (select[data-picker]) */
.pk{position:relative}
.pk-native{position:absolute;inset:0;opacity:0;pointer-events:none}
.pk-btn{width:100%;min-height:42px;padding:0 38px 0 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 14px var(--f-body);text-align:left;cursor:pointer;position:relative}
.pk-btn::after{content:"";position:absolute;right:15px;top:50%;width:7px;height:7px;border:solid var(--muted);border-width:0 2px 2px 0;transform:translateY(-70%) rotate(45deg)}
.pk-btn.pk-empty{color:var(--muted)}
.pk.on .pk-btn{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 15%,transparent)}
.pk-pan{position:absolute;z-index:40;left:0;right:0;top:calc(100% + 6px);border:1px solid var(--line);border-radius:12px;background:var(--paper);box-shadow:0 18px 40px -16px rgba(0,0,0,.35);overflow:hidden}
.pk-q{display:block;width:100%;min-height:42px;padding:0 12px;border:0;border-bottom:1px solid var(--line);background:var(--paper);color:var(--text);font:500 14px var(--f-body);outline:none}
.pk-list{max-height:340px;overflow:auto;padding:4px 0}
.pk-h{position:sticky;top:0;margin:0;padding:8px 12px 4px;background:var(--paper);font:700 11px var(--f-body);letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.pk-o{display:block;width:100%;padding:8px 12px 8px 20px;border:0;background:none;color:var(--text);font:400 13.5px var(--f-body);text-align:left;cursor:pointer}
.pk-o:hover,.pk-o:focus{background:var(--chip);outline:none}
.pk-g[hidden],.pk-o[hidden]{display:none}
.pk-none{margin:0;padding:14px;color:var(--muted);font-size:13px}
.adm-give+.tablewrap{margin-top:18px}
.pk-chips{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;border-bottom:1px solid var(--line)}
.pk-chip{padding:5px 12px;border:1px solid var(--line);border-radius:99px;background:var(--paper);color:var(--text);font:500 12.5px var(--f-body);cursor:pointer}
.pk-chip:hover{border-color:var(--muted)}
.pk-chip.on{background:var(--green);border-color:var(--green);color:#fff}
.adm-tab .adm-give+.adm-h,.adm-tab .adm-give+.tablewrap+.adm-h{margin-top:28px}
/* user page: Activity log and Suspension (owner, 7 Nov 2026) */
.adm-tabs a .tab-red{color:#c0392b;font-weight:600}
.act-t tr.ok td:first-child{box-shadow:inset 3px 0 0 var(--green)}
.act-t tr.no td:first-child{box-shadow:inset 3px 0 0 #c0392b}
.act-t tr.wait td:first-child{box-shadow:inset 3px 0 0 #d4a017}
.act-who{display:inline-block;padding:1px 8px;border-radius:99px;font-size:12px;background:var(--chip);color:var(--muted)}
.act-who.st{background:color-mix(in srgb,var(--green) 10%,transparent);color:var(--green)}
.act-who.team{background:color-mix(in srgb,#2f6fb0 10%,transparent);color:#2f6fb0}
.sus-state{padding:10px 14px;border-radius:10px;margin:0 0 14px;font-size:13.5px}
.sus-state.ok{background:color-mix(in srgb,var(--green) 8%,transparent);border:1px solid color-mix(in srgb,var(--green) 20%,transparent)}
.sus-state.no{background:color-mix(in srgb,#c0392b 8%,transparent);border:1px solid color-mix(in srgb,#c0392b 22%,transparent);color:#8e2a20}
.sus-cards{display:grid;gap:12px;max-width:760px}
.sus-card{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.sus-card p{margin:4px 0 0;font-size:13px;color:var(--muted)}
.sus-card.danger{border-color:color-mix(in srgb,#c0392b 35%,transparent)}
.sus-card .btn-no,.sus-card .btn{min-width:110px;white-space:nowrap}
.sus-step{padding:16px 18px 18px}
.sus-l{display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
.sus-l textarea,.sus-l input{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 14px var(--f-body)}
.sus-word{color:#c0392b;font-family:ui-monospace,Consolas,monospace;font-size:14px;user-select:none}
.sus-warn{margin:0 0 14px;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,#c0392b 9%,transparent);color:#8e2a20;font-size:13.5px}
.sus-acts{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}
.sus-acts button{min-width:110px;min-height:38px}
.sus-final{border:0;border-radius:10px;background:#c0392b;color:#fff;font:600 14px var(--f-body);cursor:pointer;padding:0 16px}
.sus-final:disabled{opacity:.4;cursor:not-allowed}
.act-t td:first-child,.act-t td:nth-child(2){white-space:nowrap}
.act-t td:nth-child(3){min-width:150px}
.sus-card .btn-no{display:inline-flex;align-items:center;justify-content:center;min-height:38px;padding:0 16px;border:1px solid #c0392b;border-radius:10px;background:transparent;color:#c0392b;font:600 13.5px var(--f-body);cursor:pointer}
.sus-card .btn-no:hover{background:#c0392b;color:#fff}
.sus-card.danger .btn-no{background:#c0392b;color:#fff}
.sus-pop .btn-no{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:600 13.5px var(--f-body);cursor:pointer}
.sus-pop header{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--line);background:var(--paper);font-size:15px}
.sus-pop header b{overflow-wrap:anywhere}
/* popup buttons: same size, text centred, nothing moves on a click; the safe one green, the risky one red */
.sus-acts button,.sus-acts .btn,.sus-acts .btn-no{display:inline-flex;align-items:center;justify-content:center;min-width:120px;height:40px;min-height:40px;padding:0 18px;margin:0;border-radius:10px;font:600 14px/1 var(--f-body);transform:none!important;transition:background .15s,opacity .15s;box-shadow:none}
.sus-acts button:active{transform:none!important}
.sus-acts .sus-dismiss{border:1px solid var(--green);background:var(--green);color:#fff}
.sus-acts .sus-dismiss:hover{filter:brightness(1.08)}
.sus-acts .sus-next,.sus-acts .sus-final{border:1px solid #c0392b;background:#c0392b;color:#fff}
.sus-acts .sus-next:hover,.sus-acts .sus-final:not(:disabled):hover{background:#a93226}
/* Suspension: the state line at the foot of the tab, under the buttons */
.sus-wrap{display:flex;flex-direction:column;gap:14px;min-height:calc(100vh - 290px)}
.sus-wrap .sus-state{margin:auto 0 0}
/* Data tab: one row per set, the download at the right */
.data-list{display:grid;gap:10px;max-width:820px}
.data-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.data-row p{margin:3px 0 0;font-size:13px;color:var(--muted)}
.data-row:first-child{border-color:color-mix(in srgb,var(--green) 40%,transparent);background:color-mix(in srgb,var(--green) 5%,var(--paper))}
.data-row .adm-export{white-space:nowrap}
.data-form input[type=email]{flex:1 1 260px}
.data-form select{flex:0 1 220px}
.adm-h .count{margin-left:8px;padding:2px 9px;border-radius:99px;background:color-mix(in srgb,#d4a017 18%,transparent);color:#9a6b00;font-size:12px}
/* Dashboard (owner, 7 Nov 2026): the path with "Live" at its right; What stands out beside the figures; a colour a chart */
.adm-crumbrow{display:flex;align-items:center;gap:12px}
.adm-crumbrow .adm-crumbs{flex:1 1 auto;min-width:0}
.adm-crumbrow .dash-live{margin-left:auto;white-space:nowrap}
.dash-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:12px;align-items:start;margin:10px 0 12px}
.dash-top .dash-ins{margin:0}
.admin-app .dash-top .dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1100px){.dash-top{grid-template-columns:1fr}.admin-app .dash-top .dash-tiles{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}
.dash-ins li.info{border-left-color:#3b82c4}
.dash-card{--c:#1f7a55}
.dash-card.c0{--c:#1f9d6a}.dash-card.c1{--c:#3b82c4}.dash-card.c2{--c:#e08a1e}.dash-card.c3{--c:#8b5cc7}
.dash-card.c4{--c:#d24f6b}.dash-card.c5{--c:#159aa3}.dash-card.c6{--c:#c9a227}.dash-card.c7{--c:#5a6fd6}
.dash-card .bars i{background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 70%,#000 0%));opacity:.92}
.dash-card .bars div:hover i{opacity:1;filter:brightness(1.1)}
.dash-card .hbar i{background:var(--c)}
.dash-card .hbar:nth-child(2) i{background:color-mix(in srgb,var(--c) 80%,#fff)}
.dash-card .hbar:nth-child(3) i{background:color-mix(in srgb,var(--c) 65%,#fff)}
.dash-card .hbar:nth-child(n+4) i{background:color-mix(in srgb,var(--c) 50%,#fff)}
.dash-card>h2{display:flex;align-items:center;gap:8px}
.dash-card>h2::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--c)}
.dash-tiles>div:nth-child(1){border-top:3px solid #1f9d6a}.dash-tiles>div:nth-child(2){border-top:3px solid #3b82c4}
.dash-tiles>div:nth-child(3){border-top:3px solid #8b5cc7}.dash-tiles>div:nth-child(4){border-top:3px solid #e08a1e}
.dash-tiles>div:nth-child(5){border-top:3px solid #159aa3}.dash-tiles>div:nth-child(6){border-top:3px solid #d24f6b}
.dash-tiles>div:nth-child(7){border-top:3px solid #c9a227}.dash-tiles>div:nth-child(8){border-top:3px solid #5a6fd6}
/* a button that opens a small menu (Export on the Dashboard) */
.adm-dd{position:relative}
.adm-dd>summary{list-style:none;cursor:pointer}
.adm-dd>summary::-webkit-details-marker{display:none}
.adm-dd>summary::after{content:none!important}
.adm-dd-menu{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:220px;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--paper);box-shadow:0 16px 36px -14px rgba(0,0,0,.35)}
.adm-dd-menu a{display:block;padding:9px 12px;border-radius:8px;font-size:13.5px;color:var(--text)}
.adm-dd-menu a:hover{background:var(--chip)}
.adm-dd-menu a:first-child{font-weight:600;border-bottom:1px solid var(--line);border-radius:8px 8px 0 0;margin-bottom:4px}
/* header (owner, 7 Nov 2026): search after the logo; "Admin Portal" and the day / night switch at the right */
.adm-q{position:relative;flex:0 1 460px;margin-left:18px;display:flex;align-items:center}
.adm-q>svg{position:absolute;left:11px;width:16px;height:16px;fill:none;stroke:#a9c2b3;stroke-width:2;stroke-linecap:round;pointer-events:none}
.adm-q input{width:100%;height:34px;padding:0 12px 0 34px;border:1px solid #2f5a46;border-radius:9px;background:#123528;color:#eef3df;font:500 13.5px var(--f-body);outline:none}
.adm-q input::placeholder{color:#8fae9c}
.adm-q input:focus{border-color:#c6f25a;background:#164033}
.adm-q-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:70;max-height:420px;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--paper);box-shadow:0 18px 40px -14px rgba(0,0,0,.4)}
.adm-q-list a{display:grid;grid-template-columns:62px 1fr;grid-template-rows:auto auto;column-gap:10px;padding:8px 10px;border-radius:8px;color:var(--text)}
.adm-q-list a em{grid-row:1/3;align-self:center;justify-self:start;padding:2px 8px;border-radius:99px;background:var(--chip);font:600 11px var(--f-body);font-style:normal;color:var(--muted)}
.adm-q-list a b{font-size:13.5px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-q-list a small{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-q-list a:hover,.adm-q-list a.on{background:var(--chip)}
.adm-q-list p{margin:0;padding:10px;color:var(--muted);font-size:13px}
.adm-top-r .adm-portal{margin:0;padding:0 12px 0 0;border:0;border-right:1px solid #2f5a46}
.adm-theme{width:34px;height:34px;color:#eef3df;border-color:#2f5a46}
@media(max-width:700px){.adm-q{margin-left:8px}.adm-top-r .adm-portal{display:none}}
/* side menu: the admin at the top */
.adm-prof-box{display:grid;gap:2px;padding:4px 0 10px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.adm-side a.adm-prof{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px}
.adm-avatar{position:relative;overflow:hidden;flex:none}
.adm-prof .adm-avatar{width:34px;height:34px;font-size:14px}
.adm-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.adm-avatar i{font-style:normal}
.adm-prof-t{display:grid;min-width:0;line-height:1.25}
.adm-prof-t b{font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.adm-prof-t small{font-size:11.5px;color:var(--muted)}
.adm-prof-box form{margin:0}
.adm-side .adm-link{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;border:0;border-radius:8px;background:none;color:var(--muted);font:500 13px var(--f-body);text-align:left;cursor:pointer}
.adm-side .adm-link:hover{background:var(--chip);color:var(--text)}
.adm-side .adm-link svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:861px){
 .adm-rail .adm-prof-t,.adm-rail .adm-side .adm-link span{display:none}
 .adm-rail .adm-side a.adm-prof,.adm-rail .adm-side .adm-link{justify-content:center;padding:7px 0}
 .adm-rail .adm-side-wrap:hover .adm-prof-t{display:grid}
 .adm-rail .adm-side-wrap:hover .adm-side .adm-link span{display:inline}
 .adm-rail .adm-side-wrap:hover .adm-side a.adm-prof,.adm-rail .adm-side-wrap:hover .adm-side .adm-link{justify-content:flex-start;padding:7px 10px}
}
/* My profile: the photo */
.me-photo{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.adm-avatar.big{width:72px;height:72px;font-size:28px}
.me-photo-form{display:flex;gap:10px;align-items:center}
.me-photo label.btn-no{cursor:pointer}
/* a page of search results */
.srch-list{display:grid;gap:6px;max-width:760px}
.srch-row{display:grid;grid-template-columns:70px 1fr;column-gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
.srch-row em{grid-row:1/3;align-self:center;font-style:normal;font-size:12px;color:var(--muted)}
.srch-row small{color:var(--muted)}
/* header search in the middle of the bar (owner, 7 Nov 2026) */
@media(min-width:861px){.adm-top{position:sticky}.adm-q{position:absolute;left:50%;transform:translateX(-50%);width:min(480px,38vw);margin:0}}
/* My profile (owner, 7 Nov 2026) */
.me-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:28px;align-items:start;max-width:880px;padding:26px 28px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(135deg,color-mix(in srgb,var(--green) 7%,var(--paper)),var(--paper) 55%);box-shadow:0 10px 30px -18px rgba(0,0,0,.25)}
.me-name{margin:0 0 14px;font:700 24px/1.2 var(--f-head,var(--f-body));letter-spacing:-.3px}
.me-dl{display:grid;gap:12px;margin:0 0 20px}
.me-dl div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;align-items:baseline;padding-bottom:10px;border-bottom:1px dashed var(--line)}
.me-dl dt{font-size:12.5px;color:var(--muted)}
.me-dl dd{margin:0;font-size:14.5px;font-weight:500;overflow-wrap:anywhere}
.me-empty{color:var(--muted);font-weight:400;font-style:italic;font-size:13px}
.me-edit-btn{min-height:40px;padding:0 20px}
.me-pic{display:grid;justify-items:center;gap:8px}
.me-av{position:relative;display:block;cursor:pointer;border-radius:50%}
.me-av .adm-avatar.big{width:132px;height:132px;font-size:52px;box-shadow:0 0 0 4px var(--paper),0 0 0 6px color-mix(in srgb,var(--green) 35%,transparent)}
.me-cam{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:rgba(10,30,22,.55);color:#fff;opacity:0;transition:opacity .15s}
.me-cam svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.me-av:hover .me-cam,.me-av:focus-within .me-cam,.me-photo-form.busy .me-cam{opacity:1}
.me-pic-note{font-size:11.5px;color:var(--muted)}
.me-remove{border:0;background:none;color:var(--muted);font-size:12px;text-decoration:underline;cursor:pointer}
.me-tg{max-width:880px}
.me-pop{width:min(520px,calc(100vw - 32px))}
.me-pop header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font-size:15px}
.me-fields{display:grid;gap:12px;padding:16px 18px}
.me-f{display:grid;gap:5px;font-size:12.5px;color:var(--muted)}
.me-f input{height:40px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 14px var(--f-body)}
.me-acts{display:flex;justify-content:flex-end;gap:10px;padding:0 18px 18px}
.me-acts button{min-width:110px;height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font:600 14px var(--f-body)}
.me-acts .me-close{width:auto;background:var(--paper);border:1px solid var(--line);color:var(--text)}
.me-foot{display:flex;justify-content:flex-end;max-width:880px;margin-top:24px;padding-top:14px}
.me-logout{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border:1px solid #c0392b;border-radius:10px;background:transparent;color:#c0392b;font:600 13.5px var(--f-body);cursor:pointer}
.me-logout:hover{background:#c0392b;color:#fff}
.me-logout svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:700px){.me-card{grid-template-columns:1fr}.me-pic{order:-1}.me-dl div{grid-template-columns:1fr}}
/* narrow side menu: the photo circle stays (owner, 7 Nov 2026) */
@media(min-width:861px){.adm-rail .adm-side a.adm-prof .adm-avatar{display:grid}.adm-rail .adm-prof-box{border-bottom:0;padding-bottom:4px}}
.adm-prof .adm-avatar span,.adm-prof .adm-avatar i{display:inline}
.me-foot{align-items:center;gap:16px}
.me-site{font-size:13px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}
/* My profile spans the page (owner, 7 Nov 2026) */
.me-card,.me-tg,.me-foot{max-width:none}
.me-card{grid-template-columns:minmax(0,1fr) 260px}
.me-dl div{grid-template-columns:200px minmax(0,1fr)}
/* the student site at the foot of the side menu (owner, 7 Nov 2026) */
.adm-site-btn{display:flex;align-items:center;gap:10px;height:42px;padding-left:18px;border-top:1px solid var(--line);border-right:1px solid var(--line);background:var(--paper);color:var(--muted);font:500 13px var(--f-body)}
.adm-site-btn:hover{color:var(--text);background:var(--chip)}
.adm-site-btn svg{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:861px){.adm-rail .adm-site-btn{justify-content:center;padding-left:0}.adm-rail .adm-site-btn span{display:none}.adm-rail .adm-side-wrap:hover .adm-site-btn{justify-content:flex-start;padding-left:18px}.adm-rail .adm-side-wrap:hover .adm-site-btn span{display:inline}}
@media(max-width:860px){.adm-site-btn{display:none}}
/* the student site at the foot, above the narrow / wide button (owner, 7 Nov 2026) */
.adm-side a.adm-site-link{margin-top:8px;padding-top:10px;border-top:1px solid var(--line);border-radius:0 0 8px 8px;color:var(--muted)}
.adm-site-btn{height:48px}
/* room for both foot bars (Student site and narrow / wide) */
@media(min-width:861px){.adm-side{height:calc(100vh - 48px - 96px)}}
/* Book prices (owner, 7 Nov 2026) */
.pr-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.pr-chips .chip{padding:6px 12px;border:1px solid var(--line);border-radius:99px;background:var(--paper);color:var(--text);font:500 13px var(--f-body);cursor:pointer}
.pr-chips .chip b{font-weight:600;opacity:.6;margin-left:3px}
.pr-chips .chip.on{background:var(--green);border-color:var(--green);color:#fff}
.pr-t tr.pr-row[hidden]{display:none}
.pr-t th.pr-act,.pr-t td.pr-act{text-align:right;width:1%;white-space:nowrap}
.pr-free{color:var(--green)}
.pr-edit{display:inline-grid;place-items:center;width:34px;height:34px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--muted);cursor:pointer}
.pr-edit:hover{color:var(--text);border-color:var(--muted)}
.pr-edit svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.pr-row.editing .pr-show,.pr-row.editing .pr-edit{display:none}
.pr-form{display:inline-flex;align-items:center;gap:6px}
.pr-form .price{width:96px;height:34px}
.pr-form select{height:34px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--text);padding:0 8px}
.pr-ok,.pr-cancel{width:34px;height:34px;border-radius:9px;border:1px solid var(--line);cursor:pointer;font-weight:700}
.pr-ok{background:var(--green);border-color:var(--green);color:#fff}
.pr-cancel{background:var(--paper);color:var(--muted)}
.pr-row.editing td{background:color-mix(in srgb,var(--green) 6%,transparent)}
.pr-form[hidden]{display:none}
/* narrow side menu: no scrollbar eating the width, so every icon sits on one centre line (owner, 7 Nov 2026) */
@media(min-width:861px){.adm-rail .adm-side{scrollbar-width:none}.adm-rail .adm-side::-webkit-scrollbar{display:none}.adm-rail .adm-side-wrap:hover .adm-side{scrollbar-width:thin}.adm-rail .adm-rail-btn,.adm-rail .adm-site-btn{padding:0;justify-content:center}}
/* narrow menu opened by hover: the photo stays a centred circle, name over role (owner, 7 Nov 2026) */
@media(min-width:861px){.adm-rail .adm-side-wrap:hover .adm-side a.adm-prof .adm-avatar{display:grid;place-items:center}.adm-rail .adm-side-wrap:hover .adm-side a.adm-prof .adm-prof-t{display:grid}.adm-rail .adm-side-wrap:hover .adm-side a.adm-prof{justify-content:flex-start;padding:8px 10px}}
/* Packs (owner, 7 Nov 2026) */
.pk-t tr.pk-row[hidden]{display:none}
.pk-t tr.off td{opacity:.6}
.pk-off{display:inline-block;padding:2px 9px;border-radius:99px;background:color-mix(in srgb,#e08a1e 14%,transparent);color:#a35f00;font-size:12.5px;font-weight:600}
.pk-switch{position:relative;width:42px;height:24px;padding:0;border:0;border-radius:99px;background:#c9cfc7;cursor:pointer;transition:background .15s}
.pk-switch i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:left .15s}
.pk-switch.on{background:var(--green)}
.pk-switch.on i{left:21px}
.pk-pop{width:min(760px,calc(100vw - 32px));max-height:min(88vh,860px)}
.pk-pop form{display:flex;flex-direction:column;max-height:min(88vh,860px)}
.pk-pop header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line);font-size:15px}
.pk-body{display:grid;gap:10px;padding:16px 18px;overflow:auto}
.pk-top{display:grid;grid-template-columns:minmax(0,1fr) auto 140px;gap:12px;align-items:end}
.pk-kind{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;height:40px}
.pk-kind label{display:flex}
.pk-kind input{position:absolute;opacity:0;pointer-events:none}
.pk-kind span{display:grid;place-items:center;padding:0 14px;font:600 13px var(--f-body);color:var(--muted);cursor:pointer}
.pk-kind input:checked+span{background:var(--green);color:#fff}
.pk-q2{height:38px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 13.5px var(--f-body)}
.pk-bchips{margin:0}
.pk-books{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:6px;max-height:300px;overflow:auto;padding:2px}
.pk-b{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.pk-b[hidden]{display:none}
.pk-b:has(input:checked){border-color:var(--green);background:color-mix(in srgb,var(--green) 7%,transparent)}
.pk-b span{display:grid;min-width:0;flex:1}
.pk-b b{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pk-b small{font-size:11.5px;color:var(--muted)}
.pk-b em{font-style:normal;font-size:12.5px;color:var(--muted)}
.pk-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-top:1px solid var(--line)}
.pk-sum{font-size:13px;color:var(--muted)}
.pk-sum.bad{color:#c0392b}
.pk-btns{display:flex;gap:10px}
.pk-btns button{min-width:100px;height:40px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font:600 14px var(--f-body)}
.pk-btns .pk-dismiss{width:auto;background:var(--paper);border:1px solid var(--line);color:var(--text)}
.pk-btns .pk-del{color:#c0392b;border:1px solid transparent;background:none}
.pk-btns .pk-del[hidden]{display:none}
@media(max-width:640px){.pk-top{grid-template-columns:1fr}}
/* a closed window must stay hidden: only an open one is a flex box */
.pk-pop{overflow:hidden;flex-direction:column}
.pk-pop[open]{display:flex}
.pk-pop:not([open]){display:none}
.pk-pop form{flex:1 1 auto;min-height:0}
.pk-body{flex:1 1 auto;min-height:0}
.pk-books{max-height:none}
.pk-pop footer.pk-foot{background:var(--paper);color:var(--text);margin:0}
/* Promo codes (owner, 7 Nov 2026) */
.pc-code{font-family:ui-monospace,Consolas,monospace;letter-spacing:.5px}
.pc-scope{color:var(--muted)}
.pc-t td small{display:block}
.pc-pop{width:min(640px,calc(100vw - 32px))}
.pc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.pc-grid .me-f[hidden]{display:none}
.pc-grid input{height:40px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 14px var(--f-body)}
.pc-seg{flex-wrap:wrap;height:auto;min-height:40px}
.pc-seg span{min-height:38px}
.pc-help{margin:0;font-size:12px;color:var(--muted)}
@media(max-width:560px){.pc-grid{grid-template-columns:1fr}}
/* promo window, more (owner, 7 Nov 2026) */
.pc-pop{width:min(760px,calc(100vw - 32px))}
.pc-pop header{gap:10px}
.pc-pop.editing header .pk-title{font-family:ui-monospace,Consolas,monospace;font-size:16px}
.pc-head-sum{flex:1 1 auto;font-size:13px;color:var(--muted)}
.pc-grid .pc-wide{grid-column:1/-1}
.pc-codef[hidden],.pc-peruser[hidden],.pc-people[hidden],.pc-custom[hidden]{display:none}
.pc-custom{display:grid;gap:8px;padding:10px;border:1px dashed var(--line);border-radius:12px}
.pc-items{max-height:260px}
.pc-people textarea{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 13.5px var(--f-body)}
.pc-del{border:0;background:none;color:#c0392b;font:600 13.5px var(--f-body);cursor:pointer;padding:0;margin-right:auto}
.pc-del[hidden],.pc-sum[hidden]{display:none}
.pk-foot{gap:14px}
.adm-foot-note{margin-top:28px;padding-top:12px;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
/* Dashboard (owner, 8 Nov 2026): the figures at the left, 4 a row; What stands out at the right, as tall as the figures, scrolling */
.dash-top{grid-template-columns:minmax(0,2.2fr) minmax(0,1fr);align-items:stretch}
.admin-app .dash-top .dash-tiles{grid-template-columns:repeat(4,minmax(0,1fr))}
.dash-top .dash-ins{contain:size;display:flex;flex-direction:column;min-height:0}
.dash-top .dash-ins ul{flex:1 1 auto;min-height:0;overflow-y:auto;padding-right:4px}
.dash-ins h2 small{margin-left:auto;padding:1px 8px;border-radius:99px;background:var(--chip);font-size:11.5px;color:var(--muted)}
@media(max-width:1100px){.dash-top .dash-ins{contain:none;max-height:340px}.admin-app .dash-top .dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Dashboard charts (owner, 8 Nov 2026) */
.dash-card .chart{display:block;width:100%;height:auto;overflow:visible}
.chart .ax-g{stroke:var(--line);stroke-width:1}
.chart .ax-t{fill:var(--muted);font:500 10.5px var(--f-body)}
.chart .mk{fill:var(--c)}
.chart .mk.soft{fill:color-mix(in srgb,var(--c) 38%,transparent)}
.chart .mk-line{fill:none;stroke:var(--c);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.chart .mk-area{fill:color-mix(in srgb,var(--c) 12%,transparent);stroke:none}
.chart .mk-dot{fill:var(--paper);stroke:var(--c);stroke-width:2}
.chart .hit{fill:transparent;cursor:crosshair}
.chart .hit.hl{fill:color-mix(in srgb,var(--text) 6%,transparent)}
.ts[data-mode=bar] .g-line,.ts[data-mode=line] .g-bar{display:none}
.ts-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin:2px 0 8px}
.ts-stats{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0}
.ts-stats dt{font-size:11px;color:var(--muted)}
.ts-stats dd{margin:0;font:700 15px var(--f-body);color:var(--text)}
.ts-stats dd small{font-weight:500;font-size:11px;color:var(--muted)}
.ts-toggle{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;flex:none}
.ts-toggle button{padding:4px 10px;border:0;background:var(--paper);color:var(--muted);font:600 12px var(--f-body);cursor:pointer}
.ts-toggle button.on{background:var(--c);color:#fff}
.ts-note{margin:6px 0 0;font-size:12.5px;color:var(--muted)}
.hbar.hl i{filter:brightness(1.1)}
.hbar.fun small{color:var(--text);font-weight:600}
.st-leg,.dn-leg{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--muted)}
.st-leg i,.dn-leg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.st-leg b{color:var(--text);margin-left:4px}
.chart .st-ok,.st-leg .st-ok{fill:#1f9d6a;background:#1f9d6a}
.chart .st-wait,.st-leg .st-wait{fill:#eda100;background:#eda100}
.chart .st-no,.st-leg .st-no{fill:#e34948;background:#e34948}
.donut{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;align-items:center}
.donut svg{width:150px;height:150px}
.dn-arc{fill:none;stroke-width:20;cursor:pointer;transition:stroke-width .12s}
.dn-arc.hl{stroke-width:24}
.dn-big{fill:var(--text);font:700 15px var(--f-body)}
.dn-sm{fill:var(--muted);font:500 10.5px var(--f-body)}
.dn-leg{display:grid;gap:8px;margin:0}
.dn-leg li{display:grid;grid-template-columns:auto 1fr auto 44px;align-items:center;gap:6px}
.dn-leg span{color:var(--text)}
.dn-leg b{color:var(--text);font-weight:600}
.dn-leg small{text-align:right}
.dash-tip{position:fixed;z-index:90;padding:6px 10px;border-radius:8px;background:#10241c;color:#f1f6ea;font:500 12px var(--f-body);pointer-events:none;box-shadow:0 8px 20px -8px rgba(0,0,0,.45);white-space:nowrap}
@media(max-width:560px){.donut{grid-template-columns:1fr;justify-items:center}}
/* Dashboard, leaner (owner, 8 Nov 2026): four figures 2 x 2 with an (i); the Executive summary at the foot */
.admin-app .dash-top .dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
.dash-top{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}
.dash-tiles .kpi-l{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted)}
.dash-tiles>div b{font-size:24px}
.kpi-i{display:inline-grid;place-items:center;width:15px;height:15px;border-radius:50%;border:1px solid var(--muted);color:var(--muted);font:700 9.5px/1 var(--f-body);font-style:italic;cursor:help}
.kpi-i:hover,.kpi-i:focus{background:var(--text);border-color:var(--text);color:var(--paper);outline:none}
.dash-tip{white-space:normal;max-width:280px}
.ex-sum{margin:12px 0}
.ex-sum h2 small{margin-left:auto;font-size:12px;font-weight:500;color:var(--muted)}
.ex-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ex-block{padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.ex-block h3{margin:0 0 8px;font:700 12px var(--f-body);letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.ex-block dl{display:grid;gap:7px;margin:0}
.ex-block dl div{display:flex;justify-content:space-between;gap:12px;font-size:13.5px}
.ex-block dt{color:var(--muted)}
.ex-block dd{margin:0;text-align:right;font-weight:600}
.ex-block dd small{display:block;font-weight:400;font-size:11.5px;color:var(--muted)}
.adm-dd-menu .dd-h{margin:6px 8px 2px;font:700 10.5px var(--f-body);letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.adm-dd-menu .dd-h:first-child{margin-top:2px}
.adm-dd-menu a:first-child{font-weight:400;border:0;margin:0}
@media(max-width:1100px){.ex-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.ex-grid{grid-template-columns:1fr}}
/* Readers (owner, 8 Nov 2026) */
.rd-period{display:flex;gap:6px;margin:0 0 10px}
.rd-period .chip,.adm-range .chip{padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--paper);font-size:13px}
.rd-period .chip.on{background:var(--green);color:#fff;border-color:var(--green)}
.admin-app .rd-tiles{grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 16px}
.rd-tiles .rd-live{color:#1e8a4c}
.rd-tools{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 12px}
.rd-tools .rd-q{flex:1 1 240px;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 13.5px var(--f-body)}
.rd-tools label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.rd-tools select,.rd-tools .rd-n{height:38px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 13px var(--f-body)}
.rd-tools .rd-n{width:90px}
.rd-count{margin-left:auto;font-size:12.5px;color:var(--muted)}
.rd-t tr[hidden]{display:none}
.rd-t td small,.rd-who small{display:block;font-size:11.5px;color:var(--muted)}
.rd-who b{font-weight:600}
.rd-barcell{width:28%}
.rd-barcell i{display:block;height:8px;border-radius:4px;background:#2a78d6}
.adm-back{display:inline-flex;align-items:center;gap:6px;margin:0 0 10px;padding:6px 12px;border:1px solid var(--line);border-radius:99px;background:var(--paper);font:600 13px var(--f-body);color:var(--text)}
.adm-back:hover{border-color:var(--green)}
@media(max-width:700px){.admin-app .rd-tiles{grid-template-columns:1fr}}
/* Activity log filters (owner, 8 Nov 2026) */
.lg-filters{flex-wrap:wrap}
.lg-filters>label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--muted)}
.lg-filters select{height:36px;max-width:240px;padding:0 8px;border:1px solid var(--line);border-radius:9px;background:var(--paper);color:var(--text);font:500 13px var(--f-body)}
.lg-count{margin:0 0 8px;font-size:12.5px;color:var(--muted)}
.lg-count a{text-decoration:underline}
.lg-t td small{display:block;font-size:11px;color:var(--muted)}
.lg-who,.lg-act{color:var(--text)}
.lg-act{font-family:ui-monospace,Consolas,monospace;font-size:12.5px}
.lg-who:hover,.lg-act:hover{text-decoration:underline}
/* Payment numbers (owner, 8 Nov 2026) */
.num-top{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.num-top .pr-chips{margin:0}
.num-bulk{display:flex;gap:8px}
.num-bulk .btn-no{display:inline-flex;align-items:center;height:34px;padding:0 14px;border:1px solid var(--line);border-radius:99px;background:var(--paper);color:var(--text);font:600 12.5px var(--f-body);cursor:pointer}
.num-bulk .btn-no:hover{border-color:var(--green)}
.num-id{display:flex;align-items:flex-start;gap:10px}
.num-id small{display:block;font-size:11.5px;color:var(--muted)}
.num-id .num-state{display:inline-block;margin-top:4px}
.num-meter{display:grid;gap:4px;min-width:150px}
.num-meter>div{height:8px;border-radius:4px;background:color-mix(in srgb,var(--text) 8%,transparent);overflow:hidden}
.num-meter i{display:block;height:100%;border-radius:4px;background:#1f9d6a}
.num-meter.warm i{background:#eda100}
.num-meter.hot i{background:#e34948}
.num-meter span{font-size:13px;font-weight:600}
.num-meter span small,.num-t td>small{font-weight:400;font-size:11.5px;color:var(--muted)}
.num-order{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}
.num-arrow{width:32px;height:30px;border:0;background:var(--paper);color:var(--muted);font:700 14px var(--f-body);cursor:pointer}
.num-arrow+.num-arrow{border-left:1px solid var(--line)}
.num-arrow:hover{color:var(--text);background:var(--chip)}
.num-pop .num-new[hidden],.num-pop .num-hint[hidden],.num-pop .num-del[hidden],.num-fixform[hidden]{display:none}
.num-pop select{height:40px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 13.5px var(--f-body)}
.num-fixbox{display:grid;gap:8px;margin:0 18px 16px;padding:12px 14px;border:1px dashed var(--line);border-radius:12px}
.num-fixbox>span{font-size:12px;color:var(--muted)}
.num-fixbox .btn-no{justify-self:end;height:36px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:600 13px var(--f-body);cursor:pointer}
.num-official{margin-top:20px;border:1px solid var(--line);border-radius:12px;padding:0 14px}
.num-official>summary{display:flex;justify-content:flex-start;gap:10px;padding:12px 0;font:600 14px var(--f-body)}
.num-official>summary::after{content:none!important}
.num-official>summary small{font-weight:400;color:var(--muted)}
.num-pop .pk-foot .num-del{margin-right:auto}
/* Payment gateway (owner, 8 Nov 2026) */
.gw-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 16px;margin:0 0 14px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.gw-head.on{border-color:color-mix(in srgb,#1f9d6a 40%,transparent);background:color-mix(in srgb,#1f9d6a 6%,var(--paper))}
.gw-dot{width:12px;height:12px;border-radius:50%;background:#9aa59c;flex:none}
.gw-head.on .gw-dot{background:#22a559;box-shadow:0 0 0 4px color-mix(in srgb,#22a559 22%,transparent)}
.gw-head b{display:block;font-size:16px}
.gw-head small{display:block;font-size:12px;color:var(--muted)}
.gw-ipn{margin-left:auto;display:grid;grid-template-columns:auto auto;align-items:center;column-gap:4px;text-align:right}
.gw-ipn small{grid-column:1/-1}
.gw-ipn .cp-v{font-family:ui-monospace,Consolas,monospace;font-size:12px}
.gw-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0 0 14px}
.gw-card{position:relative;display:grid;gap:4px;justify-items:start;padding:14px;border:1.5px solid var(--line);border-radius:14px;background:var(--paper);color:var(--text);text-align:left;cursor:pointer;font:inherit}
.gw-card:hover{border-color:var(--green)}
.gw-card svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:var(--muted)}
.gw-card b{font-size:14.5px}
.gw-card span{font-size:12.5px;color:var(--muted)}
.gw-card.on{border-color:var(--green);background:color-mix(in srgb,var(--green) 8%,var(--paper));cursor:default}
.gw-card.on svg{color:var(--green)}
.gw-card em{position:absolute;top:10px;right:10px;padding:1px 8px;border-radius:99px;background:var(--green);color:#fff;font:700 11px var(--f-body);font-style:normal}
.admin-app .gw-figs{grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 6px}
.gw-last{font-size:12px;font-weight:400;color:var(--muted)}
.gw-t td small{display:block;font-size:11.5px;color:var(--muted)}
.gw-recheck{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:1px solid var(--green);border-radius:9px;background:var(--paper);color:var(--green);font:600 12.5px var(--f-body);cursor:pointer}
.gw-recheck:hover{background:var(--green);color:#fff}
.gw-recheck svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:800px){.gw-cards{grid-template-columns:1fr}.admin-app .gw-figs{grid-template-columns:repeat(2,minmax(0,1fr))}.gw-ipn{margin-left:0;text-align:left}}
.num-pop header{gap:10px}
.num-pop.editing header .pk-title{font-family:ui-monospace,Consolas,monospace}
/* ================= Phone (owner, 8 Nov 2026): only below 700px; the desktop is untouched ================= */
@media(max-width:700px){
 .adm-top{gap:8px;padding:0 10px}
 .adm-top .brand .wordmark{display:none}
 .adm-q{flex:1 1 auto;margin-left:4px;min-width:0}
 .adm-q input{height:36px;font-size:14px}
 .adm-q-list{position:fixed;left:8px;right:8px;top:52px}
 .adm-theme{width:34px;height:34px;flex:none}
 .adm-main{padding:12px 12px 40px}
 .adm-crumbrow{flex-wrap:wrap;gap:2px}
 .adm-crumbrow .dash-live{margin-left:0;font-size:11px}
 .adm-headrow{flex-wrap:wrap;gap:8px}
 .adm-title{font-size:20px}
 .adm-bar{width:100%}
 .adm-bar .adm-export,.adm-bar .btn.p{flex:1 1 auto;justify-content:center}
 .adm-dd{flex:1 1 auto}.adm-dd>summary{justify-content:center}
 .adm-dd-menu{left:0;right:0;min-width:0}
 /* one search row: the box and a small button side by side */
 .admin-app .adm-search{flex-wrap:nowrap;gap:8px}
 .admin-app .adm-search input{flex:1 1 auto;min-width:0}
 .admin-app .adm-search .btn{min-width:0;padding:0 16px;font-size:14px}
 /* date ranges: chips on one line, From and To side by side, Show beside them */
 .adm-range{gap:6px}
 .adm-range .adm-range-pick{margin-left:0;width:100%;display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:end}
 .adm-range .adm-range-pick label{flex-direction:column;align-items:stretch;gap:2px;font-size:11.5px}
 .adm-range input[type=date]{width:100%;min-width:0;padding:0 6px;font-size:12.5px}
 .lg-filters>label{width:100%}.lg-filters select{flex:1;max-width:none}
 /* rows of tabs and of buttons scroll sideways instead of breaking into lines */
 .adm-tabs,.pr-chips,.adm-seg,.rd-period{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .adm-tabs::-webkit-scrollbar,.pr-chips::-webkit-scrollbar,.adm-seg::-webkit-scrollbar{display:none}
 .adm-tabs a,.pr-chips .chip,.adm-seg .chip{flex:none;white-space:nowrap}
 /* figures: two to a row */
 .admin-app .stat-row,.admin-app .dash-tiles,.admin-app .rd-tiles,.admin-app .gw-figs,.admin-app .dash-top .dash-tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px}
 .admin-app .stat-row>div,.admin-app .dash-tiles>div{padding:10px 12px}
 .admin-app .stat-row b,.dash-tiles>div b{font-size:20px}
 .dash-top{grid-template-columns:1fr!important}
 .dash-top .dash-ins{contain:none;max-height:300px}
 .dash-grid{grid-template-columns:1fr}
 .ts-head{flex-wrap:wrap}
 .ex-grid{grid-template-columns:1fr}
 /* tables become cards: each row a box, each cell a line with its column name (public/reader.js puts the names) */
 .tablewrap{overflow:visible;border:0;background:none}
 .admin-t,.admin-t tbody,.admin-t thead{display:block;width:100%}
 .admin-t tr:first-child:has(th),.admin-t thead tr{display:none}
 .admin-t tr{display:block;margin:0 0 10px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
 .admin-t td{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:6px 0;border:0;border-bottom:1px dashed var(--line);text-align:right;min-width:0;width:auto!important;box-shadow:none!important}
 .admin-t td:last-child{border-bottom:0}
 .admin-t td::before{content:attr(data-label);flex:none;max-width:42%;text-align:left;font-size:11.5px;font-weight:600;color:var(--muted)}
 .admin-t td:not([data-label])::before,.admin-t td[data-label=""]::before{content:none}
 .admin-t td[data-label=""]{justify-content:flex-end}
 .admin-t td>*{min-width:0;overflow-wrap:anywhere}
 .admin-t td[colspan]{display:block;text-align:left}
 .admin-t td[colspan]::before{content:none}
 /* order rows: the hidden details sit inside the card */
 .adm-orows tr.orow{margin-bottom:0;border-radius:12px 12px 0 0}
 .adm-orows tr.orow[aria-expanded=false]{margin-bottom:10px;border-radius:12px}
 .adm-orows tr.orow-more{margin:-1px 0 10px;border-top:0;border-radius:0 0 12px 12px}
 .adm-orows tr.orow-more td{display:block;text-align:left;border:0}
 .adm-orows td.orow-tog{display:none}
 .orow-dl{grid-template-columns:1fr 1fr}
 .pk-t td.pr-act,.pr-t td.pr-act{justify-content:flex-end}
 .num-meter{min-width:0;width:60%}
 .rd-barcell{width:auto}.rd-barcell i{width:100%}
 .rd-tools .rd-count{margin-left:0;width:100%}
 /* the user page */
 .adm-headcard{padding:12px}
 .adm-headcard .adm-title{font-size:17px;overflow-wrap:anywhere}
 .adm-headcard .adm-title-note,.adm-headcard .adm-bar{width:100%}
 .adm-presence{flex-wrap:wrap;font-size:11.5px}
 .orow-dl,.pop-dl{grid-template-columns:1fr}
 /* windows fill the phone */
 dialog.adm-pop,.pk-pop,.pc-pop,.me-pop,.num-pop{width:calc(100vw - 16px);max-height:calc(100vh - 24px);margin:12px auto}
 .pk-foot{flex-wrap:wrap}
 .pk-btns{width:100%}.pk-btns button{flex:1}
 .pc-seg{width:100%}.pc-seg label{flex:1 1 auto}.pc-seg span{width:100%;padding:0 8px;font-size:12.5px}
 .pk-books{grid-template-columns:1fr}
 .me-card{padding:16px}
 .me-av .adm-avatar.big{width:104px;height:104px;font-size:40px}
 .me-dl div{grid-template-columns:1fr;gap:2px}
 .gw-head{align-items:flex-start}
 .gw-ipn{grid-template-columns:1fr auto;text-align:left;width:100%}
 .num-top{flex-direction:column;align-items:stretch}
 .sus-card{flex-direction:column;align-items:stretch}
 .sus-wrap{min-height:0}
 .data-row{flex-direction:column;align-items:stretch}
 .adm-give-acts button,.sus-acts button{flex:1}
}
@media(max-width:700px){.admin-t tr[hidden]{display:none}}
@media(max-width:700px){
 .admin-t td:first-child{display:block;text-align:left;padding:2px 0 8px;font-size:14.5px}
 .admin-t td:first-child::before{content:none}
 .admin-t td:first-child small{display:block}
 .num-id img,.num-id svg,.num-id>:first-child{flex:none}
 .num-meter{width:62%;justify-items:end}
 .num-meter>div{width:100%}
 .admin-t td.pr-act::before{content:none}
 .adm-orows td.orow-tog{display:none!important}
}
@media(max-width:700px){.me-card{grid-template-columns:1fr!important;gap:16px}.me-pic{order:-1}.me-dl div{grid-template-columns:1fr!important}}
@media(max-width:700px){.admin-app .rd-tiles>div:nth-child(3):last-child{grid-column:1/-1}}
/* KPI cards, every screen (owner, 8 Nov 2026): the (i) sits at the top right of its card */
.dash-tiles>div,.rd-tiles>div,.gw-figs>div{position:relative}
.dash-tiles .kpi-l,.rd-tiles .kpi-l{padding-right:22px}
.dash-tiles .kpi-i,.rd-tiles .kpi-i{position:absolute;top:10px;right:10px}
/* the Dates button and window exist on every screen but show only on a phone */
.rg-open{display:none}
.rg-pop{width:min(420px,calc(100vw - 24px))}
.rg-pop header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);font-size:15px}
.rg-body{padding:16px}
.rg-pop .adm-range-pick{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;margin:0;width:auto}
.rg-pop .adm-range-pick label{display:grid;gap:4px;font-size:12px;color:var(--muted)}
.rg-pop .adm-range-pick input{width:100%;height:40px}
.rg-pop .adm-range-pick .btn{grid-column:1/-1;height:42px;justify-content:center}
/* phone, below 700px */
@media(max-width:700px){
 .adm-top{height:48px}
 .adm-top .brand,.adm-top-r .adm-portal{display:none}
 .adm-top::after{content:"GrowthSkool Admin";font:700 15px var(--f-lat);color:#eef3df;letter-spacing:.2px}
 .mob-tools{display:flex;align-items:center;gap:8px;padding:8px 2px 2px}
 .mob-tools .adm-q{position:relative;transform:none;left:auto;width:auto;flex:1 1 auto;margin:0}
 .mob-tools .adm-q input{height:38px;background:var(--paper);color:var(--text);border-color:var(--line)}
 .mob-tools .adm-q input::placeholder{color:var(--muted)}
 .mob-tools .adm-q>svg{stroke:var(--muted)}
 .mob-tools .adm-q-list{position:absolute;left:0;right:0;top:calc(100% + 4px)}
 .mob-tools .adm-theme{width:38px;height:38px;color:var(--text);border-color:var(--line)}
 /* the side menu fits the screen and scrolls inside */
 .adm-side-wrap{height:calc(100dvh - 48px);bottom:auto}
 .adm-side{height:100%!important;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding-bottom:40px}
 /* Dashboard head: the path with Export at its right, the title with Live at its right */
 .adm-crumbrow{flex-wrap:nowrap;align-items:center}
 .adm-crumbrow .adm-bar{width:auto;margin-left:auto}
 .adm-crumbrow .adm-dd{flex:none}
 .adm-crumbrow .adm-export{height:30px;min-height:30px;padding:0 10px;font-size:12.5px;border-radius:99px;background:color-mix(in srgb,var(--green) 10%,transparent);color:var(--green);border:1px solid color-mix(in srgb,var(--green) 35%,transparent);box-shadow:none}
 .adm-crumbrow .adm-export svg{width:14px;height:14px}
 .adm-crumbrow .adm-dd-menu{left:auto;right:0;min-width:240px}
 .adm-headrow{flex-wrap:nowrap;align-items:baseline}
 .adm-headrow .dash-live{margin-left:auto;text-align:right;font-size:10.5px;line-height:1.3;color:var(--muted);max-width:52%}
 /* date ranges: the quick chips, and a compact Dates button at the right that opens the window */
 .adm-range{flex-wrap:nowrap;align-items:center}
 .adm-range>.adm-range-pick{display:none!important}
 .adm-range>.chip{flex:none}
 .rg-open{display:inline-flex;align-items:center;gap:6px;margin-left:auto;flex:none;height:34px;padding:0 12px;border:1px solid var(--line);border-radius:99px;background:var(--paper);color:var(--text);font:600 12.5px var(--f-body);cursor:pointer}
 .rg-open.on{border-color:var(--green);color:var(--green)}
 .rg-open svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
 .lg-filters{flex-wrap:wrap}
}
@media(max-width:700px){.adm-top-r{display:none}.adm-top::after{margin-right:auto}}
@media(max-width:700px){dialog.adm-pop.rg-pop{margin:auto;width:calc(100vw - 32px)}}
/* phone, more (owner, 8 Nov 2026): the profile circle at the top right of the header opens My profile; the side menu
   keeps only the search at its top; no title and no day / night button in the header (it is under My profile) */
.adm-top-me,.me-appear{display:none}
@media(max-width:700px){
 .adm-top::after{content:none}
 .adm-top-r{display:flex!important;margin-left:auto}
 .adm-top-r .adm-portal,.adm-top-r .adm-theme{display:none}
 .adm-top-me{display:block}
 .adm-top-me .adm-avatar{width:32px;height:32px;font-size:13px}
 .adm-side .adm-prof{display:none!important}
 .adm-prof-box{padding-top:0}
 .mob-tools{padding-top:2px}
 .me-appear{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
 .me-appear small{display:block;font-size:12px;color:var(--muted)}
}
/* Filter and order windows: only on a phone (owner, 8 Nov 2026) */
.rd-filter{display:none}
.rd-pop-body{display:grid;gap:12px}
.rd-pop-body label{display:grid;grid-template-columns:80px 1fr auto;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.rd-pop-body select,.rd-pop-body input{height:40px;width:100%;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:500 13.5px var(--f-body)}
.rd-pop-foot{padding:0 16px 16px}.rd-pop-foot .btn{width:100%;height:42px;justify-content:center}
.or-pop header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid var(--line);font-size:15px}
.or-body{padding:12px 16px 16px;overflow:auto;max-height:calc(100vh - 120px)}
.or-body .or-head tr{margin:0 0 12px}
.or-body .orow-dl{display:grid;grid-template-columns:1fr;gap:10px}
@media(max-width:700px){
 .rd-tools{flex-wrap:nowrap}
 .rd-tools>label{display:none}
 .rd-filter{display:inline-flex;align-items:center;gap:6px;flex:none;height:38px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--text);font:600 13px var(--f-body);cursor:pointer}
 .rd-filter.on{border-color:var(--green);color:var(--green)}
 .rd-filter svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
 .rd-tools .rd-count{display:none}
 dialog.adm-pop.or-pop{width:calc(100vw - 16px);max-height:calc(100vh - 24px);margin:auto}
 .adm-orows tr.orow-more{display:none!important}
 .adm-orows tr.orow,.adm-orows tr.orow[aria-expanded=false]{margin-bottom:10px;border-radius:12px}
 /* Users: Export as a small menu at the right of the title, the filters as a sideways row, five figures two by two */
 .adm-headrow .adm-bar{width:auto;margin-left:auto}
 .us-export>summary.adm-export{height:30px;min-height:30px;padding:0 10px;font-size:12.5px;border-radius:99px;background:color-mix(in srgb,var(--green) 10%,transparent);color:var(--green);border:1px solid color-mix(in srgb,var(--green) 35%,transparent);box-shadow:none}
 .us-export>summary svg{width:14px;height:14px}
 .us-export .adm-dd-menu{left:auto;right:0;min-width:200px}
 .us-chips{flex-wrap:nowrap}
 .admin-app .stat-row>div:nth-child(5):last-child{grid-column:1/-1}
 .admin-app .adm-search input::placeholder{font-size:13px}
 .lg-filters .rg-open{margin-left:0}
}
@media(max-width:700px){.lg-filters{column-gap:5px}.lg-filters>.chip{padding:6px 10px;font-size:12.5px}.lg-filters .rg-open{height:32px;padding:0 10px;margin-left:auto}}
.rd-pop-body label{grid-template-columns:72px minmax(0,1fr) minmax(0,1fr)}
.rd-pop-body label:first-child select{grid-column:2/-1}
.rd-pop-body .rd-n{width:100%}
.or-head td.orow-tog{display:none!important}
/* phone cards: the pencil sits at the top right of its card, beside the title (owner, 8 Nov 2026) */
@media(max-width:700px){
 .admin-t tr:has(td.pr-act){position:relative}
 .admin-t tr:has(td.pr-act) td:first-child{padding-right:48px}
 .admin-t td.pr-act{position:absolute;top:8px;right:10px;padding:0;border:0}
 .admin-t tr.editing td.pr-act{position:static;padding:8px 0 4px}
}
/* Book prices on a phone: the row's form in a window */
.pr-pop-body .pr-form{display:grid!important;grid-template-columns:1fr 1fr;gap:10px}
.pr-pop-body .pr-form .price,.pr-pop-body .pr-form select{width:100%;height:42px}
.pr-pop-body .pr-form label{display:block}
.pr-pop-body .pr-ok,.pr-pop-body .pr-cancel{width:100%;height:42px;font-size:15px}
/* phone: the user page head stacks (title, details, presence), each on its own line */
@media(max-width:700px){
 .adm-headrow.adm-headcard{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:8px}
 .adm-headcard .adm-title{font-size:17px;word-break:break-all}
 .adm-headcard .adm-title-note{align-self:flex-start;margin:0;padding:4px 10px;font-size:12px;border-radius:10px}
 .adm-headcard .adm-bar{width:100%;margin:0}
 .adm-headcard .adm-presence{display:flex;align-items:center;justify-content:flex-start;width:100%;border-radius:10px;padding:6px 10px}
}
/* the order page, premium (owner, 8 Nov 2026) */
.ord-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 18px;padding:0;list-style:none;counter-reset:none}
.ord-steps li{display:flex;align-items:center;justify-content:center;gap:7px;height:42px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--muted);font:600 14px var(--f-body)}
.ord-steps i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--cream-2);font:700 12px var(--f-body);font-style:normal}
.ord-steps .done{color:var(--text)}.ord-steps .done i{background:#1f9d6a;color:#fff}
.ord-steps .on{border-color:#0b271f;background:#c6f25a;color:#0b271f;font-weight:800;box-shadow:0 0 0 2px rgba(198,242,90,.35)}.ord-steps .on i{background:#0b271f;color:#c6f25a}
.ord-list,.ord-form{border-radius:20px;box-shadow:0 16px 34px -26px rgba(11,39,31,.7)}
.ord h2{font-size:21px;font-weight:700}
.ord-list li{padding:12px;border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,#c6f25a 8%,var(--paper))}
.ord-list li b{font-size:16px}
.ord-price{font-size:16.5px}
.ord-total{align-items:center;margin-top:16px;padding:14px 16px;border-radius:14px;background:#0b271f;color:#eaf5d8;font-size:18px}
.ord-total b{color:#c6f25a;font-size:24px}
.ord-saved{display:inline-block;margin-top:8px;padding:4px 12px;border-radius:99px;background:color-mix(in srgb,#1f9d6a 16%,var(--paper));color:#1f7a52;font:700 14px var(--f-body)}
[data-theme=dark] .ord-saved{color:#8fe3b4}
.ord-promo input{border-style:solid}
.ord-trust{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:4px 0 6px;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#1f9d6a 10%,var(--paper));font-size:13.5px;color:var(--text)}
.ord-trust svg{width:18px;height:18px;fill:none;stroke:#1f9d6a;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ord-trust span{font-weight:700;margin-right:4px}
.ord-trust em{font-style:normal;font-weight:700;font-size:12px;padding:2px 8px;border-radius:99px;border:1px solid var(--line);background:var(--paper);font-family:var(--f-lat)}
.ord-form input:not([type=radio]):not([type=hidden]){font-size:17px;letter-spacing:.5px}
.ord-form label.ord-agree{padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--cream)}
.ord-form .btn{min-height:58px;border-radius:14px;font-size:18px;font-weight:800;box-shadow:0 0 0 2px #0b271f,0 14px 28px -14px rgba(159,210,60,.9)}
/* the first-visit step after the first sign-in, and the profile fields (owner, 8 Nov 2026) */
.wf-wrap{display:grid;place-items:start center;min-height:calc(100dvh - 64px);padding:28px 16px 48px;background:radial-gradient(120% 70% at 50% 0%,#1f5a45 0%,#0f3a2d 40%,var(--cream) 40.1%)}
.wf-card{width:min(100%,480px);padding:22px 20px 18px;border:1px solid var(--line);border-radius:24px;background:var(--paper);box-shadow:0 30px 60px -30px rgba(11,39,31,.6)}
.wf-steps{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:0 0 18px;padding:0;list-style:none}
.wf-steps li{display:flex;align-items:center;justify-content:center;height:36px;border-radius:10px;border:1px solid var(--line);font:600 13.5px var(--f-body);color:var(--muted)}
.wf-steps .done{color:#1f7a52;background:color-mix(in srgb,#1f9d6a 10%,var(--paper))}
.wf-steps .on{border-color:#0b271f;background:#c6f25a;color:#0b271f;font-weight:800}
.wf-card h1{margin:0 0 6px;font:700 26px/1.25 var(--f-head)}
.wf-lead{margin:0 0 16px;color:var(--muted);font-size:15.5px;line-height:1.6}.wf-lead b{color:#1f7a52}
.wf-form .wf-l{display:flex;align-items:center;gap:8px;margin:16px 0 8px;font:700 15px var(--f-body);color:var(--text)}
.wf-form .wf-l svg,.wf-safe svg{flex:none;width:19px;height:19px;fill:none;stroke:#1f9d6a;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.wf-form input:not([type=radio]):not([type=hidden]){width:100%;min-height:52px;padding:0 14px;border:1.5px solid var(--line);border-radius:14px;background:var(--cream);color:var(--text);font:500 17px var(--f-body)}
.wf-form input:not([type=radio]):not([disabled]):focus{outline:0;border-color:#1f9d6a;box-shadow:0 0 0 4px rgba(31,157,106,.15)}
.wf-streams{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.wf-streams label{position:relative;cursor:pointer}
.wf-streams input{position:absolute;opacity:0;pointer-events:none}
.wf-streams span{display:flex;align-items:center;justify-content:center;min-height:48px;padding:6px;border:1.5px solid var(--line);border-radius:12px;background:var(--paper);text-align:center;font:700 14.5px var(--f-body);color:var(--text);transition:background .15s,border-color .15s}
.wf-streams input:checked+span{border-color:#0b271f;background:#c6f25a;color:#0b271f;box-shadow:0 0 0 2px rgba(198,242,90,.35)}
.wf-streams input:focus-visible+span{outline:2px solid #1f9d6a;outline-offset:2px}
.wf-go{width:100%;justify-content:center;min-height:56px;margin-top:22px;border:0;border-radius:14px;font-size:18px;font-weight:800;box-shadow:0 0 0 2px #0b271f,0 14px 28px -14px rgba(159,210,60,.9)}
.wf-skip{display:block;width:100%;margin-top:8px;padding:12px;border:0;background:none;color:var(--muted);font:600 15px var(--f-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.wf-safe{display:flex;gap:8px;align-items:flex-start;margin:14px 0 0;padding:10px 12px;border-radius:12px;background:color-mix(in srgb,#1f9d6a 8%,var(--paper));font-size:13.5px;line-height:1.55;color:var(--muted)}
.wf-safe a{color:#1f7a52;font-weight:600;text-decoration:underline}
.lib-ask{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;padding:12px 14px 12px 16px;border:1.5px solid #9fd23c;border-radius:16px;background:color-mix(in srgb,#c6f25a 20%,var(--paper));color:var(--text);text-decoration:none}
.lib-ask b{display:block;font-size:16px}.lib-ask small{color:var(--muted);font-size:13.5px}
.lib-ask i{flex:none;padding:8px 14px;border-radius:10px;background:#0b271f;color:#c6f25a;font:800 14.5px var(--f-body);font-style:normal}
[data-theme=dark] .wf-wrap{background:radial-gradient(120% 70% at 50% 0%,#1f5a45 0%,#0f3a2d 40%,var(--cream) 40.1%)}
/* the privacy note on the first-visit step, made to stand out (owner, 8 Nov 2026) */
.wf-safe{position:relative;margin-top:16px;padding:12px 14px 12px 16px;border:1.5px solid #1f9d6a;border-radius:14px;background:color-mix(in srgb,#1f9d6a 14%,var(--paper));color:var(--text);font-size:14.5px;font-weight:600;line-height:1.55;box-shadow:0 10px 22px -18px rgba(31,157,106,.9)}
.wf-safe::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 4px 4px 0;background:#1f9d6a}
.wf-safe svg{width:22px;height:22px;padding:3px;border-radius:50%;background:#1f9d6a;stroke:#fff}
.wf-safe a{color:#1f7a52;font-weight:700}
[data-theme=dark] .wf-safe a{color:#8fe3b4}
/* My Library's number bar, compact and higher up (owner, 8 Nov 2026) */
.lib-ask{margin:-18px 0 12px;padding:7px 7px 7px 12px;gap:10px;border-radius:14px;box-shadow:0 0 0 3px rgba(198,242,90,.22)}
.lib-ask span{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 8px;min-width:0}
.lib-ask b{display:inline;font-size:15px}
.lib-ask small{font-size:13px}
.lib-ask i{padding:7px 12px;font-size:14px}
@media(max-width:480px){.lib-ask small{display:none}.lib-ask{margin-top:-22px}}
/* the order page, short (owner, 8 Nov 2026): less text, tighter cards */
.ord{gap:14px}
.ord-list,.ord-form{padding:16px;border-radius:18px}
.ord h2{font-size:18px;margin-bottom:8px}
.ord-list li{padding:10px 12px}
.ord-total{margin-top:12px;padding:12px 14px;font-size:16px}
.ord-total b{font-size:22px}
.ord-total .ord-saved{display:inline-block;margin:0 0 0 6px;padding:2px 8px;font-size:12px;vertical-align:middle;background:rgba(198,242,90,.18);color:#c6f25a}
.ord-nudge{margin-top:8px;font-size:13px}
.ord-promo-box{margin-top:10px}
.ord-promo-box summary{display:inline-block;cursor:pointer;color:var(--accent);font:600 14px var(--f-body);text-decoration:underline;text-underline-offset:3px;list-style:none}
.ord-promo-box summary::-webkit-details-marker{display:none}
.ord-promo-box .ord-promo{margin-top:8px}
.ord-more{margin-top:10px;font-size:13.5px}
.ord-trust{margin:0 0 10px;padding:8px 10px;gap:5px;font-size:12.5px}
.ord-trust svg{width:16px;height:16px}
.ord-trust em{padding:1px 7px;font-size:11px}
.ord-form label{margin:8px 0 6px;font-size:13px}
.ord-form input:not([type=radio]):not([type=hidden]){min-height:48px;font-size:16px}
.ord-form label.ord-agree{margin:12px 0 10px;padding:10px;font-size:13px;line-height:1.5}
.ord-form .btn{min-height:52px;margin-top:12px;font-size:17px}
.ord-help{margin-top:14px;font-size:13.5px}
.ord-promo-box summary::after,.ord-promo-box summary::before{content:none!important;display:none!important}
/* the order page's title band, low */
.zone:has(+ * .ord) .page-head,.zone:has(~ * .ord) .page-head{padding-top:14px;padding-bottom:10px}
.zone:has(+ * .ord) .page-head h1,.zone:has(~ * .ord) .page-head h1{font-size:26px;margin:4px 0 0}
/* the order page starts right under the header: no title band (owner, 8 Nov 2026) */
.zone:has(+ .body .ord){display:none}
.zone:has(+ .body .ord) + .body{margin-top:0;border-radius:0}
.zone:has(+ .body .ord) + .body > section,.zone:has(+ .body .ord) + .body > .sec{padding-top:14px}
/* the order page on a phone: all of it on one screen (owner, 8 Nov 2026) */
@media(max-width:700px){
 .ord{gap:10px}
 .zone:has(+ .body .ord) + .body > section,.zone:has(+ .body .ord) + .body > .sec{padding-top:10px;padding-bottom:16px}
 .ord-list,.ord-form{padding:12px 14px;border-radius:16px}
 .ord h2{font-size:15.5px;margin:0 0 6px}
 .ord-list ul{gap:6px}.ord-list li{padding:7px 10px;border-radius:12px}
 .ord-list li b{font-size:15px}.ord-price{font-size:15px}.ord-x{width:26px;height:26px}
 .ord-total{margin-top:8px;padding:8px 12px;border-radius:12px;font-size:15px}.ord-total b{font-size:20px}
 .ord-nudge{margin-top:6px;font-size:12px}
 .ord-promo-box,.ord-more{display:inline-block;vertical-align:middle}
 .ord-promo-box{margin:8px 14px 0 0}.ord-promo-box summary{font-size:13px}.ord-promo-box[open]{display:block}
 .ord-more{margin-top:8px;padding:0;border:0;font-size:13px}
 .ord-trust{flex-wrap:nowrap;margin:0 0 6px;padding:5px 8px;gap:4px;font-size:11.5px;white-space:nowrap;overflow:hidden}
 .ord-trust em{padding:0 6px;font-size:10.5px}.ord-trust svg{width:14px;height:14px}
 .ord-form label{margin:6px 0 4px;font-size:12px}
 .ord-form input:not([type=radio]):not([type=hidden]){min-height:42px;font-size:15px}
 .ord-form label.ord-agree{margin:8px 0;padding:7px 9px;font-size:11.5px;line-height:1.45}
 .ord-form .ord-agree input[type=checkbox]{width:18px;height:18px;margin-top:1px}
 .ord-form .btn{min-height:48px;margin-top:6px;font-size:16px}
 .ord-help{margin-top:8px;font-size:12px}
}
.ord{grid-template-columns:minmax(0,1fr)}
@media(max-width:700px){.ord-trust{flex-wrap:wrap;white-space:normal;overflow:visible;row-gap:3px}}
/* the promo link: no empty space above or below it */
.ord-nudge{margin:4px 0 0;line-height:1.4}
.ord-promo-box{margin:6px 12px 0 0}
.ord-promo-box summary{padding:0;line-height:1.3}
.ord-promo-box .ord-promo{margin-top:4px}
.ord-more{margin-top:6px}
@media(max-width:700px){.ord-promo-box{margin:4px 12px 0 0}.ord-more{margin-top:4px}.ord-promo-box .ord-promo input,.ord-promo-box .ord-promo button{min-height:40px}}
/* online payment: the cart and the payment are one card; number → pay button → promise → methods (owner, 8 Nov 2026) */
.ord:has(> form.ord-form input[name=gateway]){gap:0}
.ord:has(> form.ord-form input[name=gateway]) > .ord-list{border-bottom:0;border-radius:18px 18px 0 0;box-shadow:none;padding-bottom:4px}
.ord:has(> form.ord-form input[name=gateway]) > .ord-form{border-top:0;border-radius:0 0 18px 18px;padding-top:6px}
.ord-form .ord-trust{margin:8px 0 0}
.ord-form .btn + .ord-agree{margin-top:10px}
/* help: a line and the four ways to reach us */
.ord-help{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px}
.ord-help span{font-weight:600;color:var(--text)}
.oh-i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:#1f7a52;text-decoration:none}
.oh-i:hover{border-color:#1f9d6a;background:color-mix(in srgb,#1f9d6a 10%,var(--paper))}
.oh-i svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
[data-theme=dark] .oh-i{color:#8fe3b4}
/* the discount hint on the left, "+ আরও যোগ করো" on the right, one line */
.ord-row{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-top:6px}
.ord-row .ord-nudge{margin:0}
.ord-row .ord-more{flex:none;margin:0;white-space:nowrap}
/* the promo box always open, its hint as typed (owner, 8 Nov 2026) */
.ord-promo{margin-top:8px}
.ord-promo input::placeholder{text-transform:none;letter-spacing:0}
.ord-promo button{font-weight:700}
@media(max-width:700px){.ord-promo{margin-top:6px}.ord-promo input,.ord-promo button{min-height:40px}}
.ord-row{margin:8px 0 0}.ord-row + .ord-total,.ord-row + .ord-line{margin-top:8px}
/* "+ আরও যোগ করো" as a small lime pill (owner, 8 Nov 2026) */
.ord-row{align-items:center}
.ord-row .ord-more{display:inline-flex;align-items:center;gap:4px;padding:6px 12px;border-radius:99px;background:#c6f25a;color:#0b271f;font:800 13.5px var(--f-body);text-decoration:none;box-shadow:0 0 0 1.5px #0b271f,0 6px 14px -8px rgba(159,210,60,.9)}
.ord-row .ord-more:hover{filter:brightness(1.05)}
/* the total: "এখন দিতে হবে · ৳51 বাঁচিয়ে · ৳199 মাত্র" */
.ord-total{align-items:center;gap:8px}
.ord-total b{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.ord-total b em{font-style:normal;font-size:14px;font-weight:700;color:#eaf5d8}
.ord-total b .ord-saved{margin:0;font-size:12px;font-weight:700}
.ord-promo{margin:8px 0 0}
.ord-promo + .ord-total,.form-err + .ord-total{margin-top:8px}
/* the pay button, premium (owner, 8 Nov 2026) */
.ord-form .btn.pay-go{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:56px;padding:6px 6px 6px 18px;border:0;border-radius:16px;background:linear-gradient(180deg,#dcff86 0%,#c6f25a 45%,#a9dc3a 100%);color:#0b271f;box-shadow:0 0 0 2px #0b271f,0 14px 28px -12px rgba(159,210,60,.95),inset 0 1px 0 rgba(255,255,255,.7);transition:transform .15s,box-shadow .15s}
.pay-go:hover{transform:translateY(-1px);box-shadow:0 0 0 2px #0b271f,0 18px 32px -12px rgba(159,210,60,1),inset 0 1px 0 rgba(255,255,255,.7)}
.pay-go:active{transform:translateY(1px)}
.pay-go::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);animation:paySheen 3.8s ease-in-out infinite;pointer-events:none}
@keyframes paySheen{0%,60%{left:-60%}85%,100%{left:130%}}
.pg-l{display:flex;align-items:center;gap:8px;font:800 17px var(--f-body)}
.pg-l svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pg-r{display:flex;align-items:center;gap:8px;padding:6px 6px 6px 14px;border-radius:12px;background:#0b271f;color:#c6f25a}
.pg-r b{font:800 19px var(--f-lat,Montserrat),sans-serif;letter-spacing:.2px}
.pg-r i{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#c6f25a;color:#0b271f}
.pg-r svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:700px){.ord-form .btn.pay-go{min-height:54px}.pg-l{font-size:16px}.pg-r b{font-size:18px}}
/* admin portal 15% smaller as a whole: text, rows, tiles, cards, menus (owner, 8 Nov 2026). zoom scales the
   viewport units too, so the heights tied to the screen are divided back by it. */
body.admin-app{zoom:.85;min-height:calc(100vh / .85)}body.admin-app .adm-side{height:calc(100vh / .85 - 96px)}@media(min-width:861px){body.admin-app .adm-side{height:calc(100vh / .85 - 144px)}}@media(max-width:700px){body.admin-app .adm-side-wrap{height:calc(100dvh / .85 - 48px)}body.admin-app :is(dialog.adm-pop,.pk-pop,.pc-pop,.me-pop,.num-pop){width:calc(100vw / .85 - 16px);max-height:calc(100vh / .85 - 24px)}}
/* My Orders: the three buttons on top, the orders as short rows (owner, 8 Nov 2026) */
.zone:has(+ .body .myo-acts) .page-head{padding-top:14px;padding-bottom:12px}.zone:has(+ .body .myo-acts) .page-head h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.zone:has(+ .body .myo-acts) + .body > .sec{padding-top:14px}.body .myo-acts{display:grid;grid-template-columns:auto 1fr auto;gap:8px;margin:0 0 14px}.body .myo-acts a{height:auto;box-shadow:none;min-height:36px;padding:0 14px;font-size:13.5px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap}.myos{gap:0;grid-template-columns:minmax(0,1fr);margin:0 0 16px;background:var(--paper);border:1px solid var(--line);border-radius:12px;overflow:hidden}.myos .myo{gap:10px;padding:9px 12px 9px 10px;border:0;border-left:3px solid var(--line);border-radius:0;align-items:center}.myos .myo + .myo{border-top:1px solid var(--line)}.myo > div:first-child{min-width:0;flex:1}.body .myo-acts .basket-n{margin-left:6px;min-width:18px;height:18px;padding:0 5px;font-size:11px;line-height:18px}.myo b{display:block;font-size:14px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.myo small{font-size:11.5px;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.myo-r{gap:2px;justify-items:end}.myo-r span{font-size:13.5px}.myo-r i{font-size:11px;padding:1px 8px;border-radius:99px;background:var(--chip)}.myo.ok .myo-r i{background:#e3f3e9;color:#1f6b45}.myo.wait .myo-r i{background:#fbf0cf;color:#7a5a00}.myo.no .myo-r i{background:#fbe3df;color:#a3261a}@media(max-width:560px){.body .myo-acts{grid-template-columns:1fr 1.6fr 1fr;gap:6px}.body .myo-acts a{padding:0 6px;font-size:12.5px;min-height:34px}}.body .myo-acts a:hover{transform:none}
/* My Orders: three premium buttons; the help line stays at the bottom of the screen while the orders scroll (owner, 8 Nov 2026) */
.body .myo-acts{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}.body .myo-acts .myo-b{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:7px;height:42px;min-height:0;padding:0 10px;border-radius:12px;font:700 13.5px var(--f-lat);letter-spacing:.1px;white-space:nowrap;color:#eaf6d2;background:linear-gradient(160deg,#1d5a45 0%,#0b271f 100%);border:1px solid #2e6b54;box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 8px 18px -10px rgba(11,39,31,.75);transition:transform .15s,box-shadow .15s}.body .myo-acts .myo-b svg{width:17px;height:17px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.body .myo-acts .myo-b span{overflow:hidden;text-overflow:ellipsis}.body .myo-acts .myo-cart{color:#10302a;background:linear-gradient(160deg,#e4ff8f 0%,#c6f25a 55%,#a9dc3a 100%);border-color:#b5e24a;box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 10px 20px -10px rgba(120,170,20,.9)}.body .myo-acts .myo-b::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.28),transparent);transform:skewX(-18deg);transition:left .5s}.body .myo-acts .myo-b:hover{transform:translateY(-1px)}.body .myo-acts .myo-b:hover::after{left:120%}.body .myo-acts .myo-b .basket-n{position:absolute;top:2px;right:2px;margin:0;min-width:16px;height:16px;padding:0 4px;font-size:10px;line-height:16px;background:#0b271f;color:#c6f25a}.myo-acts ~ .ord-help{position:sticky;bottom:0;z-index:5;margin:0 -16px;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--cream,#f5f3e6) 92%,transparent);backdrop-filter:blur(6px);border-top:1px solid var(--line)}@media(max-width:560px){.body .myo-acts .myo-b{height:40px;gap:5px;padding:0 6px;font-size:12.5px}.body .myo-acts .myo-b svg{width:15px;height:15px}}
.body .myo-acts .myo-cart{padding-right:18px}
/* My Library: no big title (the label says it), one line with the count; premium buttons (owner, 8 Nov 2026) */
.zone:has(+ .body :is(.lib-views,.shelves,.lib-empty,.lib-ask)) .page-head{padding-top:14px;padding-bottom:14px}.zone:has(+ .body :is(.lib-views,.shelves,.lib-empty,.lib-ask)) .page-head h1{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.zone:has(+ .body :is(.lib-views,.shelves,.lib-empty,.lib-ask)) .page-head p{margin-top:8px;font-size:15px}.body .shelves{gap:8px}.body .shelf:not(.buy){min-height:50px;gap:2px;border-radius:14px;border:1px solid #d9e3c8;background:linear-gradient(180deg,#ffffff,#f1f5e6);box-shadow:0 1px 0 #fff inset,0 6px 14px -10px rgba(11,39,31,.45);font:700 13.5px var(--f-lat);transition:transform .15s,box-shadow .15s}.body .shelf:not(.buy) b{font:700 11px var(--f-lat);padding:0 7px;border-radius:99px;background:#e6eed6;color:#3d5a45}.body .shelf.on:not(.buy){color:#eaf6d2;border-color:#2e6b54;background:linear-gradient(160deg,#1d5a45,#0b271f);box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 10px 18px -10px rgba(11,39,31,.8)}.body .shelf.on:not(.buy) b{background:#c6f25a;color:#10302a}.body .shelf.buy{position:relative;overflow:hidden;min-height:44px;border-radius:12px;font:700 14px var(--f-body);transition:transform .15s,box-shadow .15s}.body .shelf.buy.new{border:1px solid #b5e24a;color:#10302a;background:linear-gradient(160deg,#e4ff8f 0%,#c6f25a 55%,#a9dc3a 100%);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 10px 20px -10px rgba(120,170,20,.9)}.body .shelf.buy.mt{border:1px solid #2e6b54;color:#eaf6d2;background:linear-gradient(160deg,#1d5a45,#0b271f);box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 10px 18px -10px rgba(11,39,31,.8)}.body .shelf.buy.pt{border:1.5px solid #1d5a45;color:#0b271f;background:linear-gradient(180deg,#ffffff,#eef5dc);box-shadow:0 1px 0 #fff inset,0 8px 16px -10px rgba(11,39,31,.5)}.body .shelf.buy::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.3),transparent);transform:skewX(-18deg);transition:left .5s}.body .shelf:hover{transform:translateY(-1px)}.body .shelf.buy:hover::after{left:120%}.lib-card .lib-go{display:inline-flex;align-items:center;justify-content:center;justify-self:end;align-self:end;width:auto;margin-top:10px;padding:6px 14px;border-radius:99px;font:700 13px var(--f-body);color:#10302a;background:linear-gradient(160deg,#e4ff8f,#c6f25a 55%,#a9dc3a);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 8px 16px -10px rgba(120,170,20,.9);transition:transform .15s}.lib-card:hover .lib-go{transform:translateX(2px)}.body .lib-views a{box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 10px 20px -12px rgba(0,0,0,.6)}
/* My Library: a Tests view beside My Books and Free Books (owner, 8 Nov 2026) */
.lib-views.three{grid-template-columns:repeat(3,minmax(0,1fr))}.lib-views a[href$="v=free"]{background:linear-gradient(135deg,#2f5a00,#5f9a14)}.lib-views a[href$="v=mine"]{background:linear-gradient(135deg,#0b3d2a,#1f7a4c)}.lib-views a.lv-tests{background:linear-gradient(135deg,#0d3b4f,#1f7a8c)}.lib-tests{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;max-width:640px;margin:0 auto 8px}.lib-tests .lt{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:6px;padding:18px 16px 16px;border-radius:18px;color:#eaf6d2;background:linear-gradient(160deg,#1d5a45 0%,#0b271f 100%);border:1px solid #2e6b54;box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 14px 26px -16px rgba(11,39,31,.9);transition:transform .15s}.lib-tests .lt.pt{background:linear-gradient(160deg,#1f7a8c 0%,#0d3b4f 100%);border-color:#2c7f92}.lib-tests .lt b{font:800 18px var(--f-lat)}.lib-tests .lt small{font-size:13px;line-height:1.45;color:#cfe3c6}.lib-tests .lt i{align-self:flex-end;margin-top:8px;padding:6px 14px;border-radius:99px;font:700 13px var(--f-body);font-style:normal;color:#10302a;background:linear-gradient(160deg,#e4ff8f,#c6f25a 55%,#a9dc3a);box-shadow:0 8px 16px -10px rgba(120,170,20,.9)}.lib-tests .lt::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.18),transparent);transform:skewX(-18deg);transition:left .6s}.lib-tests .lt:hover{transform:translateY(-2px)}.lib-tests .lt:hover::after{left:120%}@media(max-width:560px){.lib-views.three a{font-size:14px;min-height:46px}.lib-tests{grid-template-columns:1fr;gap:10px}.lib-tests .lt{padding:14px}}
/* My Library: "+ নতুন বই কেনো" is a small button fixed at the bottom left, where the public pages keep Support (owner, 8 Nov 2026) */
.body .shelves .shelf.buy.new{position:fixed;z-index:44;left:50%;right:auto;transform:translateX(-50%);bottom:calc(var(--foot-h,44px) + 14px);margin:0;min-height:0;height:44px;padding:0 16px;border-radius:99px;font:700 13.5px var(--f-body);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 10px 22px -8px rgba(0,0,0,.45)}.body .shelves .shelf.buy.new:hover{transform:translate(-50%,-1px)}.body:has(.shelves .shelf.buy.new) .lib-grid{padding-bottom:56px}
/* My Library: books bought lately and not opened yet carry a NEW sticker and come first (owner, 8 Nov 2026) */
.lib-cover{position:relative}.lib-new{position:absolute;z-index:2;top:-7px;left:-7px;padding:3px 8px;border-radius:99px;font:800 10.5px/1.2 var(--f-lat);letter-spacing:.6px;font-style:normal;color:#fff;background:linear-gradient(135deg,#ff5a3c,#e0245e);box-shadow:0 0 0 2px var(--paper),0 6px 12px -6px rgba(224,36,94,.9);transform:rotate(-8deg)}.lib-card.is-new{border-color:#e0245e55;box-shadow:0 0 0 3px #e0245e14}.lib-paid{margin:-14px 0 12px}.lib-paid + .lib-ask{margin-top:0}
/* the order page: the promise is a plain line, no tick box (owner, 10 Nov 2026) */
.ord-form p.ord-agree{margin:10px 0 0;font-size:12px;line-height:1.55;color:var(--muted)}
/* My Books: how far the student has read, left of the button (owner, 10 Nov 2026) */
.lib-card .lib-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}.lib-card .lib-row .lib-go{margin-top:0}.lib-prog{display:grid;gap:4px;min-width:0;white-space:nowrap;font:600 12px var(--f-body);color:var(--muted)}.lib-prog b{color:var(--text)}.lib-prog i{display:block;width:64px;height:4px;border-radius:99px;background:linear-gradient(90deg,#1f9d6a var(--p),#dfe7cf var(--p))}
/* dark mode: the shelf chips stay readable; the buy button a little shorter and lower (owner, 10 Nov 2026) */
[data-theme=dark] .body .shelf:not(.buy):not(.on){color:#e6eedc;border-color:#2c3d34;background:linear-gradient(180deg,#1d2a24,#141d19);box-shadow:0 6px 14px -10px rgba(0,0,0,.8)}[data-theme=dark] .body .shelf:not(.buy):not(.on) b{background:#2a3a31;color:#cfe3c6}.body .shelves .shelf.buy.new{height:36px;bottom:calc(var(--foot-h,44px) + 6px)}.tp-back{margin-bottom:6px}
/* login: one line and five ways to reach support (owner, 10 Nov 2026) */
.login-help{margin:12px 0 0;text-align:center}.login-help p{margin:0 0 8px;font:600 14px var(--f-body);color:inherit}.lh-icons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.lh-icons a{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:#fff;box-shadow:0 8px 16px -10px rgba(0,0,0,.7);transition:transform .15s}.lh-icons a:hover{transform:translateY(-2px)}.lh-icons svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.lh-icons .wa{background:#25d366;color:#06281a}.lh-icons .tg{background:#1c87c9}.lh-icons .ms{background:#0a7cff}.lh-icons .fb{background:#1877f2}.lh-icons .call{background:#c6f25a;color:#0b271f}
/* more ways to sign in (owner, 13 Nov 2026): Facebook, an emailed code, and a way out of an app's own browser */
.login-ways{display:grid;gap:0}
.btn-fb{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;border-radius:12px;font:600 16px var(--f-lat);margin-top:10px;background:#1877f2;color:#fff;border:1px solid #1877f2;transition:transform .25s,box-shadow .25s}
.btn-fb svg{width:22px;height:22px}
a.btn-fb:hover{transform:translateY(-2px);box-shadow:0 12px 24px -14px #000}
.login-or{display:flex;align-items:center;gap:10px;margin:20px 0 2px;color:var(--on-dark-muted);font:600 13px var(--f-body)}
.login-or::before,.login-or::after{content:"";flex:1;height:1px;background:var(--ink-line)}
.login-mail{margin-top:4px}
.otp-in{text-align:center;letter-spacing:.5em;font:700 24px var(--f-lat)!important}
.otp-in::placeholder{letter-spacing:normal;font:400 16px var(--f-body);opacity:.6}
.login-again{margin-top:14px;font-size:14px;color:var(--on-dark-muted)}
.login-again a,.link-btn{color:var(--on-dark);text-decoration:underline;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.iab{text-align:left;background:#ffd76a1f;border:1px solid #ffd76a80;border-radius:14px;padding:12px 14px;margin:4px 0 6px;font-size:14px;line-height:1.65}
.iab p{margin:0}
.iab .btn{display:flex;justify-content:center;min-height:46px;margin-top:10px;width:100%;border:0}
.iab-how{margin-top:8px!important;color:var(--on-dark)}
.iab-copy{margin-top:8px;background:none;border:1px solid var(--ink-line);color:var(--on-dark);border-radius:10px;min-height:40px;padding:0 14px;font:600 13.5px var(--f-body);cursor:pointer;width:100%}
.vf{display:grid;gap:14px;max-width:520px}
.vf-steps{margin:0;padding-left:22px;line-height:1.9}
.vf .btn{justify-content:center;min-height:52px}
.vf-wait{font-weight:600;color:var(--muted)}
.vf-wait.ok{color:#1f9d6a}
.vf-need h2{font-size:20px;margin-bottom:6px}
.vf-need .btn{display:flex;justify-content:center;min-height:52px;margin-top:12px}
.pf-linked{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 6px}
.pf-chip{font:600 12.5px var(--f-body);padding:5px 10px;border-radius:99px;background:var(--chip);color:var(--text)}
.pf-ok{font-weight:600;color:#1f9d6a;margin:6px 0}
.pf-verify{display:inline-flex;margin:6px 0 4px}
.ct-tag{display:inline-block;font:700 11px var(--f-body);letter-spacing:.04em;padding:2px 8px;border-radius:99px;text-transform:uppercase}
.ct-l{background:#1877f222;color:#3b82f6}.ct-g{background:#8884;color:inherit}.ct-v{background:#1f9d6a26;color:#1f9d6a}
/* the line over the login buttons, in a box like the test-mode note (owner, 13 Nov 2026) */
.login-note{margin:0 0 14px;padding:10px 12px;border:1px dashed var(--lime);border-radius:12px;background:#c5f25c22;color:var(--lime);font:600 14px/1.7 var(--f-body)}
.login-terms{font-size:11.5px;margin-top:12px;opacity:.85}
.pf-ask{margin:0 0 16px!important}.pf-ask small{display:inline!important}
/* Free Books & Tests: Books, Model Test, Practice Test side by side under the stream (owner, 14 Nov 2026) */
.free-kind{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:14px 0 16px;padding:6px;border-radius:18px;background:color-mix(in srgb,#c6f25a 14%,var(--paper));border:1px solid #cfe39a}
.free-kind a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:62px;padding:8px 4px;border-radius:13px;color:var(--text);font:700 13px/1.2 var(--f-body);text-align:center;text-decoration:none;transition:background .2s,transform .2s}
.free-kind a:hover{background:#ffffff99}
.free-kind svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.free-kind a.on{background:#0b271f;color:#c6f25a;box-shadow:0 8px 18px -10px #0b271f}
.free-kind a:focus-visible{outline:2px solid #3d8b1f;outline-offset:2px}
[data-theme=dark] .free-kind{background:#ffffff0d;border-color:#ffffff1f}
[data-theme=dark] .free-kind a{color:#e6efd6}
[data-theme=dark] .free-kind a.on{background:#c6f25a;color:#0b271f}