/* Ekran logowania */
/* Auth overlay */
#auth-overlay{ position:fixed; inset:0; background:linear-gradient(160deg,#0b0f1a,#182338); display:flex; align-items:center; justify-content:center; z-index:100; }
#auth-overlay .panel{ width:min(320px,90vw); }
#auth-overlay h1{ margin:0 0 4px; font-size:20px; color:var(--ui-accent); text-align:center; }
#auth-overlay p.sub{ margin:0 0 16px; text-align:center; font-size:12px; color:#ffffffaa; }
#auth-overlay input{ width:100%; box-sizing:border-box; padding:10px; margin:5px 0; border-radius:8px; border:1px solid #ffffff33; background:#ffffff10; color:#fff; font-size:14px; }
#auth-error{ color:#ff6b6b; font-size:12px; min-height:16px; margin:4px 0; text-align:center; }
#auth-tabs{ display:flex; gap:6px; margin-bottom:10px; }
#auth-tabs button{ flex:1; padding:8px; border-radius:8px; border:1px solid #ffffff22; background:#ffffff10; color:#fff; cursor:pointer; }
#auth-tabs button.active{ background:var(--ui-accent); border-color:var(--ui-accent); }

/* v15.12a: strona powitalna */
#auth-overlay{ overflow:auto; align-items:flex-start; padding:24px 16px; box-sizing:border-box; background:radial-gradient(ellipse at 30% 20%,#23406b 0%,#0b0f1a 60%),#0b0f1a; }
#welcome{ display:flex; gap:28px; max-width:1060px; width:100%; margin:auto; align-items:center; flex-wrap:wrap; }
.w-hero{ flex:1 1 480px; color:#e8eef7; }
#auth-overlay .w-hero h1{ font-size:clamp(30px,5vw,46px); margin:0 0 8px; text-align:left; color:#ffd65a; text-shadow:0 3px 18px #0008; }
.w-tag{ font-size:15px; line-height:1.5; opacity:.9; margin:0 0 16px; }
.w-cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:10px; }
.w-card{ background:#ffffff0d; border:1px solid #ffffff1c; border-radius:12px; padding:10px 12px; }
.w-card b{ display:block; margin-bottom:4px; } .w-card span{ font-size:12.5px; opacity:.8; line-height:1.4; }
.w-steps{ margin-top:14px; font-size:13px; opacity:.85; line-height:1.8; } .w-steps kbd{ background:#ffffff1a; border-radius:4px; padding:1px 6px; font:12px monospace; }
#auth-overlay .panel.w-auth{ flex:0 1 330px; width:auto; }
.w-auth h2{ margin:0 0 10px; text-align:center; }
#auth-hint{ font-size:11.5px; min-height:14px; margin:-2px 0 2px 2px; opacity:.85; } #auth-hint.ok{ color:#3ecf8e; } #auth-hint.bad{ color:#ff8a7a; }
#auth-reg{ display:none; } #auth-overlay.reg #auth-reg{ display:block; }
.w-rules{ display:flex; gap:8px; align-items:center; font-size:12.5px; margin:6px 0; } .w-rules input{ width:auto !important; margin:0 !important; }
.w-rules a{ color:#8ab4ff; } #auth-rules-text{ display:none; font-size:11.5px; opacity:.8; line-height:1.4; background:#ffffff0c; border-radius:8px; padding:6px 8px; }
#auth-rules-text.on{ display:block; } .w-ver{ text-align:center; opacity:.45; font-size:11px; margin-top:8px; }

/* v15.12a: kreator postaci */
#creator-overlay{ position:fixed; inset:0; z-index:101; overflow:auto; background:radial-gradient(ellipse at 70% 10%,#2c2350 0%,#0b0f1a 65%),#0b0f1a; display:flex; align-items:flex-start; justify-content:center; padding:20px 16px; box-sizing:border-box; color:#e8eef7; }
.cr-panel{ width:min(980px,100%); margin:auto; }
.cr-steps{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; } .cr-steps span{ padding:5px 10px; border-radius:999px; background:#ffffff10; font-size:12.5px; opacity:.6; }
.cr-steps span.on{ background:#2f6fed; opacity:1; } .cr-steps span.done{ opacity:.9; }
.cr-lead{ font-size:15px; margin:4px 0 12px; }
.cr-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:10px; } .cr-grid.tal{ grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); }
.cr-card{ text-align:left; display:flex; flex-direction:column; gap:4px; padding:12px; border-radius:12px; border:1px solid #ffffff22; background:#ffffff0c; color:#fff; cursor:pointer; font:inherit; }
.cr-card:hover{ background:#ffffff18; } .cr-card.on{ border-color:#ffd65a; background:#ffd65a22; box-shadow:0 0 0 2px #ffd65a66 inset; }
.cr-ico{ font-size:30px; } .cr-card b{ font-size:15px; } .cr-card small{ opacity:.75; font-size:11.5px; } .cr-desc{ font-size:12.5px; opacity:.85; line-height:1.4; }
.cr-look{ display:flex; gap:24px; align-items:center; flex-wrap:wrap; } .cr-fig{ background:#ffffff0a; border-radius:16px; padding:14px 22px; }
.cr-colors{ display:flex; gap:8px; flex-wrap:wrap; } .cr-col{ width:38px; height:38px; border-radius:50%; border:3px solid #ffffff33; cursor:pointer; } .cr-col.on{ border-color:#fff; transform:scale(1.12); }
.cr-sum h3{ margin:0 0 6px; } .cr-sum table td{ padding:2px 14px 2px 0; } .cr-items{ font-size:13px; opacity:.85; } .cr-note{ font-size:12px; opacity:.65; }
.cr-nav{ display:flex; justify-content:space-between; margin-top:16px; gap:10px; } .cr-nav button{ padding:10px 18px; border-radius:10px; border:1px solid #ffffff33; background:#ffffff14; color:#fff; font:inherit; cursor:pointer; }
.cr-nav button.pri{ background:#2f6fed; } .cr-nav button:disabled{ opacity:.4; cursor:default; } #cr-err{ color:#ff8a7a; min-height:18px; margin-top:8px; }
.cr-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin:8px 0; } .cr-row b{ width:110px; font-size:13px; opacity:.85; }
.cr-opt{ padding:6px 12px; border-radius:999px; border:1px solid #ffffff33; background:#ffffff10; color:#fff; font:inherit; font-size:13px; cursor:pointer; } .cr-opt.on{ background:#2f6fed; border-color:#fff; }
.cr-col.sm{ width:28px; height:28px; }