*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font-family:var(--wfont,Tahoma,"Segoe UI",sans-serif);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
.hidden{display:none!important}
button,input{font-family:inherit}
/* ---------- پایه ---------- */
.lg{--primary:#00e0d3;--bg:#06121b;--card:#0a2230;--text:#eaffff;--muted:rgba(234,255,255,.72);--line:rgba(255,255,255,.5);--blur:10px;--opacity:.78;--radius:18px;--glow:22px;--overlay:.35;
--bgfx:radial-gradient(900px 520px at 85% -10%,rgba(0,224,211,.28),transparent 60%),radial-gradient(800px 520px at -5% 110%,rgba(52,98,255,.3),transparent 60%),linear-gradient(var(--bg),var(--bg));
min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;position:relative;overflow:hidden;color:var(--text)}
.lg-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bgimg,var(--bgfx));background-size:cover;background-position:center}
.lg-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg);opacity:var(--overlay)}
.lg-card{position:relative;z-index:1;width:100%;max-width:960px;min-height:480px;display:flex;border-radius:var(--radius);animation:lgIn .55s ease both}
@keyframes lgIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.lg-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;border-radius:inherit;background:var(--card);opacity:var(--opacity);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur))}
.lg-form{flex:1 1 50%;padding:42px 46px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2;min-width:0}
.lg-welcome{flex:1 1 50%;padding:42px 46px;display:flex;flex-direction:column;justify-content:center}
.side-left .lg-card{flex-direction:row-reverse}
.lg h1{font-size:30px;line-height:1.5;margin:0 0 12px;font-weight:800}
.lg h2{font-size:26px;margin:0 0 20px;text-align:center;font-weight:800}
.lg-welcome p{line-height:2.1;color:var(--muted);font-size:14.5px;margin:0}
.lg-logo{max-width:160px;max-height:84px;margin-bottom:18px;object-fit:contain}
.lg-feat{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:8px}
.lg-feat li{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted)}
.lg-feat li:before{content:"✓";display:inline-flex;width:20px;height:20px;border-radius:50%;background:var(--primary);color:#04141a;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex:0 0 20px}
.lg-foot{position:relative;z-index:1;margin-top:16px;font-size:12px;color:var(--muted)}
.lg-field{display:flex;align-items:center;gap:10px;border-bottom:2px solid var(--line);margin:20px 0;padding:6px 2px;transition:border-color .2s,box-shadow .2s;position:relative}
.lg-field .ic{display:flex;color:var(--muted)}
.lg-field input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:inherit;font-size:15.5px;padding:8px 2px;text-align:right}
.lg-field input[dir=ltr]{text-align:left}
.lg-field input::placeholder{color:var(--muted);opacity:.8}
.lg-field:focus-within{border-color:var(--primary);box-shadow:0 8px 14px -12px var(--primary)}
.lg-eye{background:none;border:0;color:var(--muted);cursor:pointer;font-size:16px;padding:4px}
.lg-btn{width:100%;border:0;cursor:pointer;color:#fff;font-size:16px;font-weight:700;padding:13px;border-radius:999px;margin-top:10px;background:linear-gradient(90deg,var(--primary),rgba(255,255,255,.28));background-color:var(--primary);box-shadow:0 8px calc(var(--glow)) -10px var(--primary);transition:transform .15s,filter .15s}
.lg-btn:hover{transform:translateY(-1px);filter:brightness(1.08)}.lg-btn:active{transform:none}.lg-btn[disabled]{opacity:.6;cursor:wait}
.lg-hint{font-size:12.8px;color:var(--muted);line-height:1.9;margin:6px 0}
.lg-sub{text-align:center;font-size:13px;margin-top:14px;color:var(--muted)}.lg-sub a,.lg-hint a{color:var(--primary);text-decoration:none;font-weight:600}
.lg-sub a.disabled{opacity:.45;pointer-events:none}
.lg-tabs{display:flex;gap:4px;margin:0 auto 6px;padding:4px;border-radius:999px;background:rgba(255,255,255,.08);width:max-content;max-width:100%}
.lg-tabs button{background:transparent;border:0;border-radius:999px;color:inherit;font-size:13.5px;padding:7px 18px;cursor:pointer;opacity:.75}
.lg-tabs button.on{background:var(--primary);color:#04141a;opacity:1;font-weight:700}
#lg-msg{margin-bottom:8px;font-size:13px;text-align:center}
#lg-msg.err,#lg-msg.ok{padding:9px 12px;border-radius:10px}
#lg-msg.err{background:rgba(229,72,77,.2);border:1px solid rgba(255,130,130,.6)}
#lg-msg.ok{background:rgba(48,190,125,.2);border:1px solid rgba(120,255,190,.55)}
/* ---------- ۱) نئون دوبخشی ---------- */
.lg-neon-split .lg-card{display:block;border:1px solid var(--primary);box-shadow:0 0 var(--glow) -2px var(--primary),inset 0 0 calc(var(--glow)*.8) rgba(0,0,0,.25);overflow:hidden}
.lg-neon-split .lg-form{width:50%}.lg-neon-split.side-left .lg-form{margin-right:auto;margin-left:0}
.lg-neon-split .lg-welcome{position:absolute;top:0;bottom:0;left:0;width:60%;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(0,0,0,.15));clip-path:polygon(0 0,100% 0,62% 100%,0 100%);padding-right:96px;z-index:1}
.lg-neon-split.side-left .lg-welcome{left:auto;right:0;clip-path:polygon(0 0,100% 0,100% 100%,38% 100%);padding-right:46px;padding-left:96px}
.lg-neon-split h1{text-shadow:0 0 16px var(--primary)}
/* ---------- ۲) شیشهای مرکزی ---------- */
.lg-glass-center{--primary:#8b5cf6;--bg:#120a2e;--card:#ffffff;--text:#fff;--muted:rgba(255,255,255,.82);--line:rgba(255,255,255,.55);--opacity:.14;--blur:20px;--radius:26px;--glow:26px;--overlay:.2;
--bgfx:radial-gradient(700px 500px at 15% 10%,rgba(139,92,246,.75),transparent 60%),radial-gradient(700px 500px at 90% 90%,rgba(236,72,153,.6),transparent 60%),radial-gradient(500px 400px at 60% 40%,rgba(59,130,246,.55),transparent 60%),linear-gradient(var(--bg),var(--bg))}
.lg-glass-center .lg-card{max-width:450px;min-height:0;flex-direction:column-reverse;border:1px solid rgba(255,255,255,.4);box-shadow:0 20px 60px rgba(10,0,40,.45)}
.lg-glass-center .lg-welcome{padding-bottom:0;text-align:center;align-items:center}.lg-glass-center .lg-welcome h1{font-size:24px}.lg-glass-center .lg-welcome p,.lg-glass-center .lg-feat{display:none}
.lg-glass-center .lg-btn{color:#fff}.lg-glass-center .lg-tabs button.on{color:#fff}
/* ---------- ۳) روشن دوبخشی ---------- */
.lg-light-split{--primary:#2563eb;--bg:#eef2ff;--card:#ffffff;--text:#1b2540;--muted:#5d6b88;--line:#cfd7ea;--opacity:1;--blur:0px;--radius:22px;--glow:12px;--overlay:0;
--bgfx:radial-gradient(900px 500px at 100% 0,rgba(37,99,235,.18),transparent 60%),radial-gradient(700px 500px at 0 100%,rgba(14,165,233,.18),transparent 60%),linear-gradient(var(--bg),var(--bg))}
.lg-light-split .lg-card{box-shadow:0 25px 70px rgba(37,60,130,.22)}
.lg-light-split .lg-welcome{background:linear-gradient(145deg,var(--primary),#6d8bff);color:#fff;border-radius:var(--radius) 0 0 var(--radius);position:relative;overflow:hidden}
.lg-light-split .lg-welcome:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.12);bottom:-80px;left:-60px}
.lg-light-split .lg-welcome p,.lg-light-split .lg-feat li{color:rgba(255,255,255,.92)}.lg-light-split .lg-feat li:before{background:#fff;color:var(--primary)}
.lg-light-split .lg-field{border:1.5px solid var(--line);border-radius:12px;padding:6px 12px;background:#f8faff}
.lg-light-split .lg-field:focus-within{border-color:var(--primary);box-shadow:0 0 0 4px rgba(37,99,235,.12)}
.lg-light-split .lg-tabs{background:#eef1fa}.lg-light-split .lg-tabs button.on{color:#fff}
.lg-light-split .lg-btn{border-radius:12px;color:#fff;background:linear-gradient(90deg,var(--primary),#4f7cff);box-shadow:0 10px 20px -10px var(--primary)}
.lg-light-split.side-left .lg-welcome{border-radius:0 var(--radius) var(--radius) 0}
/* ---------- ۴) کارت گرادیانی ---------- */
.lg-gradient-card{--primary:#f97316;--bg:#2a1065;--card:#ffffff;--text:#1f2340;--muted:#69708f;--line:#d9ddf0;--opacity:1;--blur:0px;--radius:28px;--glow:14px;--overlay:0;
--bgfx:linear-gradient(135deg,#2a1065 0%,#6d28d9 45%,#f97316 120%)}
.lg-gradient-card .lg-foot{color:rgba(255,255,255,.8)}
.lg-gradient-card .lg-card{max-width:440px;min-height:0;flex-direction:column-reverse;box-shadow:0 30px 80px rgba(20,5,60,.5)}
.lg-gradient-card .lg-welcome{align-items:center;text-align:center;padding-bottom:0}.lg-gradient-card .lg-welcome p,.lg-gradient-card .lg-feat{display:none}
.lg-gradient-card .lg-welcome h1{font-size:23px;color:#2a1065}
.lg-gradient-card .lg-field{border:1.5px solid var(--line);border-radius:14px;padding:6px 14px;background:#f7f8fe}.lg-gradient-card .lg-field:focus-within{box-shadow:0 0 0 4px rgba(249,115,22,.15)}
.lg-gradient-card .lg-tabs{background:#f1f2fb}.lg-gradient-card .lg-tabs button.on{color:#fff}
.lg-gradient-card .lg-btn{border-radius:14px;color:#fff}
/* ---------- ۵) پنل کنار صفحه ---------- */
.lg-side-sheet{--primary:#fb923c;--bg:#0f172a;--card:#0b1220;--text:#f1f5f9;--muted:rgba(241,245,249,.72);--line:rgba(255,255,255,.35);--opacity:.88;--blur:14px;--radius:0px;--glow:16px;--overlay:.55;
--bgfx:radial-gradient(900px 600px at 20% 20%,rgba(251,146,60,.32),transparent 60%),radial-gradient(800px 600px at 80% 90%,rgba(56,189,248,.25),transparent 60%),linear-gradient(var(--bg),var(--bg))}
.lg-side-sheet{align-items:stretch;padding:0}
.lg-side-sheet .lg-card{max-width:none;min-height:100vh;background:none;animation:none}.lg-side-sheet .lg-card:before{display:none}
.lg-side-sheet .lg-form{flex:0 0 460px;max-width:100%}
.lg-side-sheet .lg-form:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--card);opacity:var(--opacity);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));z-index:-1;box-shadow:0 0 40px rgba(0,0,0,.4)}
.lg-side-sheet .lg-welcome{position:relative;z-index:1;padding:70px}.lg-side-sheet h1{font-size:38px}
.lg-side-sheet .lg-btn{color:#1a0f00}.lg-side-sheet .lg-tabs button.on{color:#1a0f00}
@media(max-width:780px){
.lg{padding:14px}.lg-card,.lg-neon-split .lg-card{display:flex;flex-direction:column!important;min-height:0}
.lg-neon-split .lg-form{width:100%}
.lg-neon-split .lg-welcome,.lg-neon-split.side-left .lg-welcome{position:static;width:100%;clip-path:none;padding:26px 24px;order:-1}
.lg-light-split .lg-welcome,.lg-light-split.side-left .lg-welcome{border-radius:var(--radius) var(--radius) 0 0;order:-1}
.lg-form,.lg-welcome{padding:26px 22px;flex:none}.lg-side-sheet .lg-form{flex:none;width:100%}.lg-side-sheet .lg-card{justify-content:center}
.lg-side-sheet .lg-welcome{padding:26px 22px}
}
/* ===== نسخه ۵: موبایل ===== */
@media(max-width:780px){
.lg-field input{font-size:16px!important;min-height:48px}
.lg-btn{min-height:48px;font-size:16px}
.lg{min-height:100vh;min-height:100dvh}
.lg-feat{display:none}
}
/* فوتر «طراحی و توسعه»: .lg-bg موقعیتدار است و عنصر بدون position را میپوشاند؛ پس position/z-index لازم است */
.lg .wcdt-brand{position:relative;z-index:2;text-align:center;color:var(--muted);font-size:12.5px;padding:14px 10px 4px;margin-top:6px;width:100%}
.lg .wcdt-brand a{color:inherit;text-decoration:none;border-bottom:1px dotted currentColor}
.lg .wcdt-brand a:hover{color:var(--primary)}
.lg-side-sheet .wcdt-brand{position:absolute;bottom:8px;right:0;left:0;margin:0}
.lg-gradient-card .wcdt-brand{color:rgba(255,255,255,.88)}