/* Public quiz library (/quiz-uri, /en/quizzes) — marketing look of index/pricing/contact.
   Tokens come from quizx.css ([data-theme="marketing"]); everything here is scoped to .lib-*. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --lib-bg:#14161D;--lib-surface:#232732;--lib-surface2:#313644;--lib-surface3:#3E4454;
  --lib-border:#6B7488;--lib-border2:#8791A5;--lib-line:rgba(255,255,255,.08);
  --lib-text:#FFFFFF;--lib-muted:#C9CEDA;--lib-faint:#A2AAB9;
  --lib-accent:#3FD68C;--lib-accent2:#2E9E6B;--lib-purple:#C4A5FF;--lib-yellow:#F5B301;--lib-red:#FF6B85;
  --lib-r8:8px;--lib-r12:12px;--lib-r16:16px;--lib-r20:20px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body.lib-body{font-family:'Nunito',system-ui,-apple-system,sans-serif;color:var(--lib-text);min-height:100vh;line-height:1.6;display:flex;flex-direction:column;overflow-x:hidden}
.lib-body a{color:inherit}
.lib-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.lib-skip{position:absolute;left:12px;top:-60px;background:var(--lib-accent);color:#04140b;font-weight:900;padding:10px 16px;border-radius:var(--lib-r8);z-index:300;text-decoration:none}
.lib-skip:focus{top:10px}
:focus-visible{outline:3px solid var(--lib-accent);outline-offset:2px}

/* ── Nav ── */
.lib-nav{position:sticky;top:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 clamp(16px,4vw,48px);min-height:64px;border-bottom:1px solid var(--lib-border)}
.lib-nav-links{display:flex;align-items:center;gap:8px;min-width:0}
.lib-nav-link{font-size:14px;font-weight:800;color:var(--lib-muted);text-decoration:none;padding:7px 11px;border-radius:var(--lib-r8);white-space:nowrap}
.lib-nav-link:hover{color:var(--lib-text);background:var(--lib-surface2)}
.lib-lang-switch{display:inline-flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--lib-border);border-radius:999px;color:var(--lib-muted)}
.lib-lang-switch .qx-lang-btn{text-decoration:none;display:inline-block;text-align:center}
.lib-lang-switch .qx-lang-btn.is-active{background:var(--lib-text);color:var(--lib-bg)}

/* ── Buttons ── */
.lib-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;min-height:44px;border-radius:var(--lib-r8);border:1px solid var(--lib-border);background:var(--lib-surface2);color:var(--lib-text);font:inherit;font-size:15px;font-weight:800;cursor:pointer;text-decoration:none;transition:background .15s,transform .15s,border-color .15s;white-space:nowrap}
.lib-btn:hover{border-color:var(--lib-border2);background:var(--lib-surface3)}
.lib-btn-green{background:var(--lib-accent);border-color:transparent;color:#04140b;font-weight:900}
.lib-btn-green:hover{background:#5ee0a3;transform:translateY(-1px)}
.lib-btn-sm{min-height:36px;padding:7px 14px;font-size:14px}
.lib-btn-lg{min-height:50px;padding:13px 24px;font-size:16px}
.lib-btn[disabled],.lib-btn.is-busy{opacity:.6;cursor:progress;transform:none}
.lib-link,.lib-link-btn{color:var(--lib-purple);font-weight:800;text-decoration:none;background:none;border:0;font:inherit;font-weight:800;cursor:pointer;padding:4px 0}
.lib-link:hover,.lib-link-btn:hover{text-decoration:underline}

/* ── Layout ── */
.lib-main{flex:1;width:100%;max-width:1160px;margin:0 auto;padding:18px clamp(16px,4vw,32px) 56px}
.lib-main:focus{outline:none}
.lib-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 8px;font-size:13px;font-weight:700;color:var(--lib-faint);margin-bottom:18px}
.lib-crumbs li{display:flex;align-items:center;gap:8px;min-width:0}
.lib-crumbs li+li::before{content:'›';color:var(--lib-border2)}
.lib-crumbs a{color:var(--lib-muted);text-decoration:none}
.lib-crumbs a:hover{color:var(--lib-text);text-decoration:underline}
.lib-crumbs [aria-current]{color:var(--lib-faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:60vw}

.lib-hero{padding:22px 0 10px;max-width:820px}
.lib-hero h1,.lib-quiz-head h1{font-size:clamp(1.75rem,4.4vw,2.7rem);font-weight:900;line-height:1.15;letter-spacing:-.02em;margin-bottom:10px;overflow-wrap:anywhere}
.lib-lead{font-size:clamp(1rem,2vw,1.15rem);color:var(--lib-muted);font-weight:600;max-width:720px}
.lib-hero-count{margin-top:10px;font-size:13px;font-weight:800;color:var(--lib-faint)}
.lib-hero-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:16px;font-size:30px;margin-bottom:12px;background:hsl(var(--hue,260) 45% 22%);border:2px solid hsl(var(--hue,260) 55% 45%)}

/* ── Search + chips ── */
.lib-search{margin-top:20px;display:flex;flex-direction:column;gap:12px;max-width:720px}
.lib-search input{width:100%;min-height:52px;padding:12px 16px 12px 46px;border-radius:var(--lib-r12);border:2px solid var(--lib-border);background:var(--lib-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23A2AAB9' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='9' cy='9' r='6'/%3E%3Cpath d='m14 14 4 4'/%3E%3C/svg%3E") no-repeat 16px 50%;color:var(--lib-text);font:inherit;font-size:16px;font-weight:700;outline:none}
.lib-search input:focus{border-color:var(--lib-accent)}
.lib-search input::placeholder{color:var(--lib-faint);opacity:1}
.lib-chips{display:flex;flex-wrap:wrap;gap:8px}
.lib-chip{min-height:38px;padding:7px 14px;border-radius:999px;border:1px solid var(--lib-border);background:var(--lib-surface);color:var(--lib-muted);font:inherit;font-size:14px;font-weight:800;cursor:pointer}
.lib-chip:hover{color:var(--lib-text);border-color:var(--lib-border2)}
.lib-chip.is-on,.lib-chip[aria-pressed="true"]{background:var(--lib-text);border-color:var(--lib-text);color:var(--lib-bg)}
.lib-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:18px 0 6px}
.lib-select select{min-height:38px;padding:7px 34px 7px 12px;border-radius:999px;border:1px solid var(--lib-border);background:var(--lib-surface);color:var(--lib-text);font:inherit;font-size:14px;font-weight:800;color-scheme:dark;cursor:pointer}
.lib-filter-count{font-size:13px;font-weight:800;color:var(--lib-faint)}

/* ── Sections ── */
.lib-section{margin-top:40px}
.lib-section>h2,.lib-results-head h2{font-size:clamp(1.2rem,2.6vw,1.5rem);font-weight:900;margin-bottom:6px;letter-spacing:-.01em}
.lib-section-sub{color:var(--lib-faint);font-size:14px;font-weight:700;margin-bottom:6px}
.lib-results{margin-top:28px}
.lib-results-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.lib-empty{color:var(--lib-faint);font-weight:700;padding:18px 0}
.lib-empty-box{margin-top:28px;background:var(--lib-surface);border:1px dashed var(--lib-border);border-radius:var(--lib-r16);padding:28px;text-align:center}
.lib-empty-box h2{font-size:1.2rem;font-weight:900;margin-bottom:6px}
.lib-empty-box p{color:var(--lib-muted);margin-bottom:16px}

/* ── Subject tiles ── */
.lib-subjects{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:10px;margin-top:14px}
.lib-subject{display:flex;flex-direction:column;gap:6px;height:100%;padding:16px;border-radius:var(--lib-r16);background:var(--lib-surface);border:1px solid var(--lib-border);border-top:4px solid hsl(var(--hue,260) 60% 55%);text-decoration:none;transition:transform .15s,border-color .15s,background .15s}
.lib-subject:hover{transform:translateY(-2px);background:var(--lib-surface2);border-color:var(--lib-border2)}
.lib-subject-icon{font-size:26px;line-height:1}
.lib-subject-name{font-size:16px;font-weight:900}
.lib-subject-count{font-size:13px;font-weight:700;color:var(--lib-faint)}
.lib-pills{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.lib-pill{display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:7px 14px;border-radius:999px;background:var(--lib-surface);border:1px solid var(--lib-border);font-size:14px;font-weight:800;text-decoration:none;color:var(--lib-muted)}
.lib-pill:hover{color:var(--lib-text);border-color:var(--lib-border2)}
.lib-pill span{color:var(--lib-faint);font-size:12px}

/* ── Quiz cards ── */
.lib-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:14px}
.lib-card{position:relative;display:flex;flex-direction:column;gap:8px;padding:16px 16px 14px;border-radius:var(--lib-r16);background:var(--lib-surface);border:1px solid var(--lib-border);border-left:4px solid hsl(var(--hue,260) 60% 55%);transition:transform .15s,border-color .15s,background .15s;min-width:0}
.lib-card:hover{transform:translateY(-2px);background:var(--lib-surface2);border-color:var(--lib-border2)}
.lib-card[hidden]{display:none}
.lib-card-link{display:flex;align-items:flex-start;gap:10px;text-decoration:none}
.lib-card-link::after{content:'';position:absolute;inset:0;border-radius:inherit}
.lib-card-icon{flex:none;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:19px;background:hsl(var(--hue,260) 40% 22%)}
.lib-card-title{font-size:16px;font-weight:900;line-height:1.3;overflow-wrap:anywhere}
.lib-card-desc{font-size:13.5px;color:var(--lib-muted);font-weight:600;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lib-card-badges{display:flex;flex-wrap:wrap;gap:6px}
.lib-card-meta{display:flex;flex-wrap:wrap;gap:4px 6px;font-size:12.5px;font-weight:700;color:var(--lib-faint);margin-top:auto}
.lib-badge{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:800;padding:3px 9px;border-radius:999px;background:var(--lib-surface2);border:1px solid var(--lib-border);color:var(--lib-muted);white-space:nowrap}
.lib-badge-comm{background:rgba(196,165,255,.12);border-color:rgba(196,165,255,.45);color:var(--lib-purple)}
.lib-badge-official{background:rgba(63,214,140,.12);border-color:rgba(63,214,140,.45);color:var(--lib-accent)}

/* ── Quiz page ── */
.lib-quiz{max-width:860px}
.lib-quiz-head{padding:8px 0 4px}
.lib-quiz-kicker{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:10px;font-size:14px;font-weight:800}
.lib-quiz-kicker a{color:hsl(var(--hue,260) 75% 75%);text-decoration:none}
.lib-quiz-kicker a:hover{text-decoration:underline}
.lib-quiz-author{color:var(--lib-faint);font-weight:700}
.lib-facts{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px}
.lib-facts li{font-size:14px;font-weight:700;color:var(--lib-muted);background:var(--lib-surface);border:1px solid var(--lib-border);border-radius:999px;padding:5px 12px}
.lib-facts b{color:var(--lib-text)}
.lib-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px}
.lib-actions-end{margin-top:26px;justify-content:space-between}
.lib-hint{margin-top:8px;font-size:13px;font-weight:700;color:var(--lib-faint)}
.lib-use-msg{margin-top:12px;padding:12px 14px;border-radius:var(--lib-r12);background:rgba(245,179,1,.1);border:1px solid rgba(245,179,1,.45);color:#ffd766;font-weight:800;font-size:14px}
.lib-use-msg a{color:#fff}
.lib-questions{margin-top:30px}
.lib-questions h2{font-size:1.35rem;font-weight:900}
.lib-note{font-size:13.5px;color:var(--lib-faint);font-weight:700;margin:4px 0 14px}
.lib-qlist{list-style:none;display:flex;flex-direction:column;gap:12px}
.lib-q{background:var(--lib-surface);border:1px solid var(--lib-border);border-radius:var(--lib-r16);padding:16px 18px;break-inside:avoid}
.lib-q-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:8px}
.lib-q-n{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:28px;padding:0 6px;border-radius:8px;background:hsl(var(--hue,260) 45% 28%);font-weight:900;font-size:14px}
.lib-q-type{font-size:12px;font-weight:800;color:var(--lib-faint);text-transform:uppercase;letter-spacing:.06em}
.lib-q-note{font-size:12px;font-weight:800;color:var(--lib-yellow)}
.lib-q-text{font-size:17px;font-weight:800;line-height:1.45;overflow-wrap:anywhere}
.lib-opts{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:8px;margin-top:12px}
.lib-opts li{display:flex;align-items:flex-start;gap:10px;padding:9px 12px;border-radius:var(--lib-r12);background:var(--lib-surface2);border:1px solid rgba(255,255,255,.06);font-weight:700;font-size:15px;overflow-wrap:anywhere}
.lib-opt-l{flex:none;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:6px;background:var(--lib-surface3);font-size:13px;font-weight:900;color:var(--lib-muted)}
.lib-opts-tf{grid-template-columns:repeat(2,minmax(0,1fr))}
.lib-q-typed{display:flex;align-items:flex-end;gap:10px;margin-top:12px;font-size:14px;font-weight:700;color:var(--lib-faint)}
.lib-q-line{flex:1;border-bottom:2px dotted var(--lib-border2);min-width:80px;height:1.2em}
.lib-print-head{display:none}

/* ── How it works / FAQ / CTA ── */
.lib-steps{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin-top:14px}
.lib-steps li{background:var(--lib-surface);border:1px solid var(--lib-border);border-radius:var(--lib-r16);padding:18px}
.lib-step-n{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--lib-accent);color:#04140b;font-weight:900;margin-bottom:8px}
.lib-steps h3{font-size:16px;font-weight:900;margin-bottom:4px}
.lib-steps p{font-size:14px;color:var(--lib-muted);font-weight:600}
.lib-faq details{background:var(--lib-surface);border:1px solid var(--lib-border);border-radius:var(--lib-r12);padding:0 16px;margin-top:10px}
.lib-faq summary{cursor:pointer;font-weight:800;font-size:15px;padding:14px 0;list-style-position:outside}
.lib-faq details p{color:var(--lib-muted);font-size:14.5px;font-weight:600;padding:0 0 14px}
.lib-cta-band{margin-top:48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:24px;border-radius:var(--lib-r20);background:var(--lib-surface);border:2px solid var(--lib-accent2)}
.lib-cta-band h2{font-size:1.3rem;font-weight:900;margin-bottom:4px}
.lib-cta-band p{color:var(--lib-muted);font-weight:600;max-width:620px}

/* ── Footer ── */
.lib-footer{border-top:1px solid var(--lib-border);padding:28px clamp(16px,4vw,48px) 22px;margin-top:24px}
.lib-footer-inner{max-width:1160px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px}
.lib-footer-brand p{font-size:13px;color:var(--lib-muted);font-weight:600;max-width:320px;margin-top:6px}
.lib-footer-links{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;align-content:flex-start}
.lib-footer-links a{font-size:13px;font-weight:700;color:var(--lib-faint);text-decoration:none}
.lib-footer-links a:hover{color:var(--lib-text)}
.lib-footer-bottom{max-width:1160px;margin:18px auto 0;font-size:12px;color:var(--lib-faint)}

/* ── Modal + toast ── */
.lib-modal{position:fixed;inset:0;z-index:400;background:rgba(6,8,14,.78);display:flex;align-items:center;justify-content:center;padding:16px}
.lib-modal[hidden]{display:none}
.lib-modal-box{position:relative;width:100%;max-width:440px;background:var(--lib-surface);border:2px solid var(--lib-border);border-radius:var(--lib-r20);padding:28px 24px 22px;text-align:center;box-shadow:0 24px 64px rgba(0,0,0,.55)}
.lib-modal-x{position:absolute;top:8px;right:10px;width:40px;height:40px;border:0;background:none;color:var(--lib-muted);font-size:26px;cursor:pointer;border-radius:8px}
.lib-modal-x:hover{color:var(--lib-text);background:var(--lib-surface2)}
.lib-modal-icon{font-size:40px;margin-bottom:6px}
.lib-modal-box h2{font-size:1.25rem;font-weight:900;line-height:1.3;margin-bottom:8px}
.lib-modal-box p{color:var(--lib-muted);font-size:14.5px;font-weight:600}
.lib-modal-actions{display:flex;flex-direction:column;gap:10px;margin:18px 0 10px}
.lib-modal-note{font-size:12.5px!important;color:var(--lib-faint)!important}
.lib-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(16px);max-width:calc(100vw - 32px);padding:12px 20px;border-radius:12px;font-weight:800;font-size:14px;background:var(--lib-surface3);color:var(--lib-text);border:1px solid var(--lib-border2);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:500;text-align:center}
.lib-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.lib-toast.err{background:#5c1020;border-color:var(--lib-red)}

@media (max-width:720px){
  .lib-nav-hide{display:none}
  .lib-nav-link{padding:7px 6px}
  .lib-actions .lib-btn-lg{flex:1 1 auto}
  .lib-actions-end{flex-direction:column;align-items:stretch;text-align:center}
}
@media (max-width:420px){
  .lib-nav .qx-logo__img{display:none}
  .lib-nav .qx-logo__icon{display:block}
  .lib-nav-lib{display:none}
  .lib-opts-tf{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ── Print: a clean test sheet (no nav, no answers to hide anyway) ── */
@media print{
  @page{margin:14mm}
  body.lib-body,.qx-canvas{background:#fff!important;color:#000!important}
  .lib-nav,.lib-footer,.lib-crumbs,.lib-actions,.lib-hint,.lib-related,.lib-cta-band,.lib-note,.lib-skip,.lib-modal,.lib-toast,.lib-use-msg,.lib-quiz-kicker,.lib-facts{display:none!important}
  .lib-main{padding:0;max-width:none}
  .lib-quiz-head h1{font-size:20pt;color:#000}
  .lib-lead{color:#333;font-size:11pt}
  .lib-print-head{display:flex;gap:18px;flex-wrap:wrap;font-size:11pt;margin:10px 0 14px;color:#000}
  .lib-questions{margin-top:6px}
  .lib-questions h2{display:none}
  .lib-qlist{gap:8px}
  .lib-q{background:#fff;border:1px solid #bbb;border-radius:6px;padding:8px 10px;color:#000}
  .lib-q-n{background:#eee;color:#000}
  .lib-q-type,.lib-q-note{color:#555}
  .lib-q-text{font-size:12pt}
  .lib-opts li{background:#fff;border:1px solid #ddd;color:#000;font-size:11pt;padding:4px 8px}
  .lib-opt-l{background:#eee;color:#000}
  .lib-q-typed{color:#333}
  .lib-q-line{border-bottom-color:#999}
}
