:root{
  --navy:#7c3aed;
  --navy-2:#a855f7;
  --gold:#e879f9;
  --gold-2:#c026d3;
  --paper:#08060f;
  --paper-2:rgba(255,255,255,.055);
  --ink:#f2eeff;
  --ink-soft:#a9a3c9;
  --line:rgba(255,255,255,.12);
  --ok:#34d399;
  --warn:#fb7185;
  --card-bg:rgba(255,255,255,.045);
  --radius:16px;
  --maxw:880px;
  --shadow:0 1px 0 rgba(255,255,255,.05) inset, 0 12px 40px rgba(0,0,0,.55);
  --glow:0 0 24px rgba(168,85,247,.45);
  --glow-soft:0 0 0 1px rgba(168,85,247,.35), 0 0 20px rgba(168,85,247,.25);
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.55;position:relative;}
h1,h2,h3,.serif{font-family:'Sora',system-ui,sans-serif;letter-spacing:-.01em;}
img{max-width:100%;}
button{font-family:inherit;cursor:pointer;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px;position:relative;z-index:1;}

/* ---- ambient neon backdrop (fixed, decorative, behind everything) ---- */
.bg-fx{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:var(--paper);}
.bg-fx::before,.bg-fx::after{content:"";position:absolute;border-radius:50%;filter:blur(90px);opacity:.55;}
.bg-fx::before{width:560px;height:560px;top:-180px;left:-120px;background:radial-gradient(circle,#a855f7 0%,rgba(168,85,247,0) 70%);}
.bg-fx::after{width:620px;height:620px;bottom:-220px;right:-160px;background:radial-gradient(circle,#e879f9 0%,rgba(232,121,249,0) 70%);}

/* ---- top bar ---- */
.topbar{background:rgba(10,6,20,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);color:#f3efe4;padding:16px 0;border-bottom:1px solid var(--line);position:relative;z-index:5;}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.brand{display:flex;align-items:center;gap:12px;}
.brand-badge{width:38px;height:38px;border-radius:10px;background:linear-gradient(135deg,var(--navy),var(--gold));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex:none;font-family:'Sora',sans-serif;box-shadow:var(--glow);}
.brand-text .t1{font-size:15px;font-weight:600;letter-spacing:.2px;color:#f2eeff;}
.brand-text .t2{font-size:12px;color:var(--ink-soft);margin-top:2px;}
.langsw{display:flex;gap:6px;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:10px;padding:4px;}
.langsw button{border:none;background:transparent;color:#d9d4ee;padding:6px 11px;border-radius:7px;font-size:12.5px;font-weight:600;}
.langsw button.active{background:linear-gradient(135deg,var(--navy),var(--gold));color:#fff;box-shadow:var(--glow-soft);}

/* ---- stepper ---- */
.stepper-outer{background:rgba(10,6,20,.6);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20;}
.stepper{display:flex;gap:2px;overflow-x:auto;padding:10px 20px;max-width:var(--maxw);margin:0 auto;scrollbar-width:thin;}
.step-pill{flex:none;font-size:12px;padding:7px 12px;border-radius:20px;background:rgba(255,255,255,.05);color:var(--ink-soft);white-space:nowrap;font-weight:600;border:1px solid transparent;}
.step-pill.current{background:linear-gradient(135deg,var(--navy),var(--gold));color:#fff;box-shadow:var(--glow-soft);}
.step-pill.done{background:rgba(52,211,153,.08);color:var(--ok);border-color:rgba(52,211,153,.4);}
.step-pill .n{opacity:.65;margin-right:5px;}

/* ---- content ---- */
main{padding:32px 0 90px;position:relative;z-index:1;}
.card{background:var(--card-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 28px;margin-bottom:18px;}
.card h2{margin:0 0 4px;font-size:22px;color:#fff;background:linear-gradient(135deg,#ffffff 20%,var(--navy-2) 90%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.card .lead{color:var(--ink-soft);font-size:14px;margin:0 0 20px;max-width:640px;}
.section-title{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gold);margin:26px 0 12px;border-bottom:1px solid var(--line);padding-bottom:6px;}
.section-title:first-child{margin-top:0;}

.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media (max-width:640px){.grid2{grid-template-columns:1fr;}}
.field{margin-bottom:16px;}
.field label{display:block;font-size:13px;font-weight:600;margin-bottom:6px;color:var(--ink);}
.field .hint{font-size:11.5px;color:var(--ink-soft);margin-top:4px;}
.field input[type=text],.field input[type=tel],.field input[type=email],.field input[type=date],.field input[type=password],.field select,.field textarea{
  width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.04);color:var(--ink);font-size:14px;font-family:inherit;
}
.field textarea{min-height:78px;resize:vertical;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--navy-2);box-shadow:0 0 0 3px rgba(168,85,247,.25);}
.field select option, .shapecard select option{background:#ffffff;color:#1e1533;}

.photo-box{width:110px;height:140px;border:2px dashed var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;color:var(--ink-soft);overflow:hidden;flex:none;cursor:pointer;background:rgba(255,255,255,.04);padding:6px;}
.photo-box img{width:100%;height:100%;object-fit:cover;border-radius:9px;}

.radio-scale{display:flex;gap:8px;flex-wrap:wrap;}
.radio-scale label{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:20px;padding:6px 12px;cursor:pointer;}
.radio-scale input{accent-color:var(--gold);}
.radio-scale label.checked{border-color:var(--navy-2);background:rgba(168,85,247,.16);box-shadow:0 0 12px rgba(168,85,247,.25);}

.qitem{padding:12px 0;border-bottom:1px solid var(--line);display:flex;gap:12px;align-items:flex-start;}
.qitem:last-child{border-bottom:none;}
.qitem .qn{flex:none;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.06);color:var(--ink-soft);font-size:11.5px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:1px;}
.qitem .qtxt{flex:1;font-size:14.5px;}
.qitem .qctl{flex:none;}
.qitem input[type=checkbox]{width:19px;height:19px;accent-color:var(--navy-2);}
.qtri{display:flex;gap:4px;}
.qtri button{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:8px;padding:5px 9px;font-size:12px;font-weight:600;color:var(--ink-soft);}
.qtri button.on{background:linear-gradient(135deg,var(--navy),var(--navy-2));border-color:transparent;color:#fff;box-shadow:var(--glow-soft);}
.qbin{display:flex;gap:4px;}
.qbin button{border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:8px;padding:5px 12px;font-size:12px;font-weight:600;color:var(--ink-soft);}
.qbin button.on{background:linear-gradient(135deg,var(--navy),var(--navy-2));border-color:transparent;color:#fff;box-shadow:var(--glow-soft);}

.blockhead{font-size:12px;color:var(--ink-soft);margin:22px 0 4px;font-weight:600;}
.progresswrap{font-size:12px;color:var(--ink-soft);margin-bottom:10px;}
.pgbar{height:6px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden;margin-top:4px;}
.pgbar > div{height:100%;background:linear-gradient(90deg,var(--navy),var(--gold));border-radius:4px;transition:width .25s;}

.shapecard{display:flex;align-items:center;gap:16px;flex-wrap:wrap;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px;background:rgba(255,255,255,.035);}
.shapecard svg{flex:none;width:52px;height:52px;color:var(--navy-2);filter:drop-shadow(0 0 6px rgba(168,85,247,.5));}
.shapecard .sname{font-weight:600;font-size:14.5px;flex:1;min-width:120px;}
.shapecard select{padding:7px 10px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--ink);font-weight:700;flex:none;}

.navrow{display:flex;justify-content:space-between;gap:10px;margin-top:20px;}
.btn{border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;letter-spacing:.1px;transition:transform .12s,box-shadow .12s;}
.btn-primary{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff;box-shadow:var(--glow-soft);}
.btn-primary:hover{box-shadow:var(--glow);transform:translateY(-1px);}
.btn-ghost{background:rgba(255,255,255,.04);color:var(--ink-soft);border:1px solid var(--line);}
.btn-gold{background:linear-gradient(135deg,var(--gold),var(--gold-2));color:#fff;box-shadow:0 0 20px rgba(232,121,249,.4);}
.btn-gold:hover{box-shadow:0 0 28px rgba(232,121,249,.6);transform:translateY(-1px);}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;}

.result-hero{display:flex;gap:22px;align-items:center;flex-wrap:wrap;}
.result-photo{width:96px;height:120px;border-radius:12px;border:1px solid var(--line);object-fit:cover;background:rgba(255,255,255,.05);flex:none;}
.result-name{font-size:21px;font-weight:700;color:#fff;}
.result-meta{font-size:13px;color:var(--ink-soft);margin-top:4px;}
.barrow{display:flex;align-items:center;gap:10px;margin:9px 0;}
.barrow .lbl{width:190px;font-size:13px;font-weight:600;flex:none;}
.barrow .track{flex:1;height:10px;background:rgba(255,255,255,.08);border-radius:6px;overflow:hidden;}
.barrow .track > div{height:100%;background:linear-gradient(90deg,var(--navy),var(--gold));border-radius:6px;}
.barrow .val{width:40px;text-align:right;font-size:12.5px;color:var(--ink-soft);flex:none;}
.dominant-badge{display:inline-block;background:rgba(232,121,249,.14);border:1px solid var(--gold);color:var(--gold);font-weight:700;font-size:12.5px;padding:5px 12px;border-radius:20px;margin:8px 0 4px;box-shadow:0 0 16px rgba(232,121,249,.2);}
.desc-box{font-size:13.5px;color:var(--ink-soft);background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:10px;padding:12px 14px;margin-top:6px;}
.printable-note{font-size:12px;color:var(--ink-soft);margin-top:18px;}
.kv{display:grid;grid-template-columns:220px 1fr;gap:6px 14px;font-size:13.5px;margin:4px 0;}
.kv .k{color:var(--ink-soft);}
@media(max-width:640px){.kv{grid-template-columns:1fr;} .kv .k{font-weight:600;color:var(--ink);} }

/* export/print always renders as a clean, light, ink-friendly document regardless of the on-screen dark UI */
#resultPrintArea.export-light{
  --navy:#3a1d78;--navy-2:#6d28d9;--gold:#a21caf;--gold-2:#86198f;
  --paper:#ffffff;--ink:#1e1533;--ink-soft:#5b5470;--line:#e2ddf2;--card-bg:#ffffff;
  background:#ffffff;padding:14px;border-radius:10px;color:#1e1533;
}
#resultPrintArea.export-light .barrow .lbl,
#resultPrintArea.export-light .kv > div:not(.k),
#resultPrintArea.export-light .card,
#resultPrintArea.export-light p{color:#1e1533;}
#resultPrintArea.export-light .kv .k, #resultPrintArea.export-light .desc-box, #resultPrintArea.export-light .lead, #resultPrintArea.export-light .hint, #resultPrintArea.export-light .result-meta, #resultPrintArea.export-light .barrow .val{color:#5b5470;}
#resultPrintArea.export-light .card{backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;border:1px solid #e5e0f5;}
#resultPrintArea.export-light .card h2{-webkit-text-fill-color:initial;background:none;color:var(--navy);}
#resultPrintArea.export-light .result-name{color:var(--navy);}
#resultPrintArea.export-light .shapecard svg{filter:none;}
#resultPrintArea.export-light .timerbox{display:none;}
@media print{
  .topbar,.stepper-outer,.navrow,.no-print{display:none !important;}
  .bg-fx{display:none !important;}
  body{background:#fff;}
  #content{background:#fff;}
}
footer.appfoot{text-align:center;font-size:11.5px;color:var(--ink-soft);padding:20px 0 40px;}

.userbar{display:flex;align-items:center;gap:10px;}
.userbar .who{font-size:12.5px;color:#d9d4ee;}
.userbar button{background:rgba(255,255,255,.05);border:1px solid var(--line);color:#f0ece0;border-radius:8px;padding:6px 11px;font-size:12px;font-weight:600;}

.authwrap{max-width:420px;margin:44px auto;}
.authtabs{display:flex;gap:8px;margin-bottom:18px;}
.authtabs button{flex:1;padding:10px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);font-weight:700;color:var(--ink-soft);}
.authtabs button.active{background:linear-gradient(135deg,var(--navy),var(--navy-2));color:#fff;border-color:transparent;box-shadow:var(--glow-soft);}
.autherr{color:var(--warn);font-size:13px;margin:8px 0 0;font-weight:600;}
.autherr:empty{display:none;}

.field.err input,.field.err select,.field.err textarea{border-color:var(--warn);box-shadow:0 0 0 1px var(--warn);}
.qitem.err{background:rgba(251,113,133,.08);border-radius:8px;outline:1px solid rgba(251,113,133,.3);}
.stepErrBox{color:var(--warn);font-size:13.5px;font-weight:600;margin:4px 0 14px;padding:10px 12px;background:rgba(251,113,133,.08);border-radius:8px;border:1px solid rgba(251,113,133,.25);}
.stepErrBox:empty{display:none;padding:0;margin:0;border:none;background:none;}

.timerbox{position:sticky;top:78px;z-index:15;width:fit-content;margin:0 0 16px;display:none;align-items:center;gap:10px;background:rgba(20,10,35,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:24px;padding:10px 20px;font-weight:700;font-size:14px;color:var(--gold);box-shadow:0 8px 28px rgba(0,0,0,.5),var(--glow-soft);transition:background-color .25s ease,box-shadow .25s ease,transform .25s ease;transform-origin:top left;}
.timerbox .ic{font-size:18px;}
.timerbox #timerVal{font-size:26px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:.02em;}
.timerbox.warn{background:rgba(30,6,10,.92);border-color:var(--warn);color:var(--warn);box-shadow:0 8px 32px rgba(0,0,0,.6),0 0 30px rgba(251,113,133,.55);transform:scale(1.9);animation:pulseWarn 1s infinite;}
.timerbox.warn #timerVal{font-size:30px;}
@media(max-width:640px){
  .timerbox{top:64px;padding:8px 16px;font-size:13px;}
  .timerbox.warn{transform:scale(1.5);}
}
.timerbox .timerlabel{color:var(--ink-soft);font-weight:600;font-size:12px;}
@keyframes pulseWarn{0%,100%{opacity:1;}50%{opacity:.78;}}

/* ==========================================================================
   Server integration layer (api.js): autosave pill + admin panel additions
   ========================================================================== */
.pp-pill{position:fixed;right:18px;bottom:18px;z-index:60;padding:8px 14px;border-radius:999px;font-size:12.5px;font-weight:600;
  background:rgba(16,10,28,.92);border:1px solid var(--line);color:var(--ink-soft);backdrop-filter:blur(12px);
  transition:opacity .25s ease, color .25s ease;pointer-events:none;opacity:0;}
.pp-pill.saving{color:var(--ink-soft);border-color:var(--line);}
.pp-pill.saved{color:var(--ok);border-color:rgba(52,211,153,.45);}
.pp-pill.error{color:var(--warn);border-color:rgba(251,113,133,.5);}

.pp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 20px;}
@media(max-width:760px){.pp-stats{grid-template-columns:repeat(2,1fr);}}
.pp-stat{background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:12px;padding:14px 16px;}
.pp-stat-val{font-family:'Sora',system-ui,sans-serif;font-size:26px;font-weight:700;line-height:1.15;
  background:linear-gradient(135deg,#ffffff 20%,var(--navy-2) 95%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.pp-stat-lbl{font-size:12px;color:var(--ink-soft);margin-top:4px;font-weight:600;}

.pp-toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 18px;}
.pp-toolbar input[type=text],.pp-toolbar select{padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.04);
  color:var(--ink);font-size:13.5px;font-family:inherit;min-width:180px;}
.pp-toolbar input[type=text]{flex:1 1 220px;}
.pp-toolbar input:focus,.pp-toolbar select:focus{outline:none;border-color:var(--navy-2);box-shadow:0 0 0 3px rgba(168,85,247,.25);}
.pp-toolbar .btn{padding:9px 14px;font-size:13px;text-decoration:none;display:inline-flex;align-items:center;}

.pp-table{width:100%;border-collapse:collapse;font-size:13.5px;}
.pp-table thead th{text-align:left;padding:10px;color:var(--ink-soft);font-weight:600;border-bottom:1px solid var(--line);white-space:nowrap;}
.pp-table tbody td{padding:10px;border-bottom:1px solid var(--line);vertical-align:middle;}
.pp-table tbody tr:hover{background:rgba(255,255,255,.03);}
.pp-td-fio{font-weight:600;}
.pp-muted{color:var(--ink-soft);}
.pp-actions{text-align:right;white-space:nowrap;}
.pp-actions .btn{padding:6px 12px;font-size:12px;margin-left:6px;}
.pp-danger{color:var(--warn) !important;}
.rich-badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:700;
  background:rgba(52,211,153,.12);color:var(--ok);border:1px solid rgba(52,211,153,.4);}

/* ================= tests-extra.js: test menu, extra-test screen, admin access screen ================= */
.testgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:6px;}
@media (max-width:640px){.testgrid{grid-template-columns:1fr;}}
.test-card{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:14px;padding:16px 18px;display:flex;flex-direction:column;gap:8px;transition:.15s;}
.test-card.clickable{cursor:pointer;}
.test-card.clickable:hover{border-color:var(--navy-2);box-shadow:0 0 0 1px rgba(168,85,247,.3);}
.test-card.locked{opacity:.55;}
.test-card .tt{font-size:14px;font-weight:700;color:#fff;}
.badge-open{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:rgba(52,211,153,.12);color:var(--ok);border:1px solid rgba(52,211,153,.4);width:fit-content;}
.badge-locked{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:rgba(251,113,133,.1);color:var(--warn);border:1px solid rgba(251,113,133,.35);width:fit-content;}
.done-tick{color:var(--ok);font-size:12px;font-weight:700;}

.qrow{padding:14px 0;border-bottom:1px solid var(--line);}
.qrow:last-child{border-bottom:none;}
.qtext{font-size:14px;color:var(--ink);margin-bottom:10px;font-weight:500;}
.qn{color:var(--gold-2);font-weight:700;margin-right:4px;}
.progress-outer{height:6px;background:rgba(255,255,255,.08);border-radius:6px;overflow:hidden;margin-bottom:20px;}
.progress-inner{height:100%;background:linear-gradient(135deg,var(--navy),var(--gold));transition:.25s;}

.admin-tabs{display:flex;gap:6px;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:10px;padding:4px;width:fit-content;margin-bottom:18px;}
.admin-tabs button{border:none;background:transparent;color:#d9d4ee;padding:7px 14px;border-radius:7px;font-size:12.5px;font-weight:600;cursor:pointer;}
.admin-tabs button.active{background:linear-gradient(135deg,var(--navy),var(--gold));color:#fff;}

.chipwrap{display:flex;flex-wrap:wrap;gap:6px;}
.acc-chip{font-size:10.5px;padding:4px 8px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink-soft);cursor:default;}
.acc-chip.chip-open{background:rgba(52,211,153,.14);color:var(--ok);border-color:rgba(52,211,153,.4);}
.acc-chip.chip-scheduled{background:rgba(232,121,249,.12);color:var(--gold);border-color:rgba(232,121,249,.35);}
.acc-chip.chip-expired{background:rgba(251,113,133,.1);color:var(--warn);border-color:rgba(251,113,133,.3);}

.modal-bg{position:fixed;inset:0;background:rgba(4,2,10,.72);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:50;padding:20px;}
.modal{background:#140b26;border:1px solid var(--line);border-radius:16px;padding:24px;max-width:420px;width:100%;box-shadow:var(--shadow);}
.modal h3{font-size:16px;margin:0 0 14px;color:#fff;}
.modal label{display:block;font-size:12.5px;color:var(--ink-soft);margin:12px 0 5px;}
.modal select,.modal input{width:100%;padding:9px 11px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--ink);font-size:13.5px;font-family:inherit;}
.modal select option{background:#ffffff;color:#1e1533;}
.modal-actions{display:flex;gap:10px;margin-top:18px;justify-content:flex-end;}