/* LZYJRNL v0.16.7 – native responsive login, gradient-only background */
:root{color-scheme:dark;--mint:#23d3aa;--mint-light:#55ecd5;--text:#f2f7fb;--muted:#a5b8c6;--line:rgba(30,195,185,.40)}
*,*::before,*::after{box-sizing:border-box}
html{min-height:100%;scroll-behavior:smooth}
body{margin:0;min-height:100vh;min-height:100dvh;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;background:#07131e;overflow-x:hidden}
a{color:inherit}
button,input{font:inherit}
button{cursor:pointer}
/* Decorative background is pure CSS: no chart graphics, dots or screenshots. */
body::before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse 75% 65% at 30% 10%,rgba(18,55,64,.62) 0%,rgba(12,34,46,.22) 56%,transparent 100%),radial-gradient(ellipse 80% 80% at 84% 90%,rgba(12,47,45,.32) 0%,transparent 72%),linear-gradient(135deg,#101b24 0%,#0d1b25 45%,#07121e 100%);background-repeat:no-repeat}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(4,12,20,.10),transparent 52%,rgba(3,12,19,.17));}
.site-head{height:90px;display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding:10px clamp(24px,3.2vw,58px);border-bottom:1px solid rgba(40,155,156,.28);background:rgba(3,13,23,.58);position:relative;z-index:2}
.site-logo{display:flex;align-items:center;flex:0 1 245px;min-width:0}
.site-logo img{display:block;width:100%;height:auto;object-fit:contain}
.site-join{display:flex;align-items:center;gap:24px;color:#d6e4ee;font-size:13px;white-space:nowrap}
.register-action{display:inline-flex;align-items:center;justify-content:center;gap:14px;text-decoration:none;font-weight:700;color:#38e6c6;border:1px solid #1aafb1;background:rgba(4,23,36,.60);border-radius:10px;padding:10px 20px;min-height:43px;transition:background .2s ease,border-color .2s ease}
.register-action:hover{background:rgba(8,77,76,.55);border-color:#40dcc8}
.auth-layout{width:min(100% - 88px,1378px);margin:0 auto;min-height:calc(100dvh - 143px);padding:38px 0 32px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(405px,.9fr);gap:clamp(46px,5.2vw,96px);align-items:center;position:relative;z-index:1}
.marketing{min-width:0}.marketing-content{width:100%}
.marketing-kicker{margin:0 0 17px;display:flex;align-items:center;gap:.36em;letter-spacing:.31em;font-size:11px;font-weight:700;color:#b4c8d2;white-space:nowrap}
.marketing-kicker::before{content:"";width:33px;height:2px;background:#15dfc7;margin-right:15px;flex:none}
.marketing-kicker span{color:#29eac3}
.marketing h2{margin:0 0 16px;font-weight:850;font-size:clamp(42px,4.15vw,68px);line-height:1.08;letter-spacing:-.045em;color:#f0f7fc;text-wrap:nowrap;text-shadow:0 2px 22px rgba(40,128,149,.12)}
.marketing h2 span{display:block;color:#1fdcb4;text-shadow:0 0 32px rgba(11,233,187,.14)}
.marketing-description{max-width:650px;margin:0 0 26px;font-size:clamp(15px,1.13vw,18px);line-height:1.55;color:#d8e6ec}
.feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 14px}
.feature-card{min-width:0;min-height:100px;display:flex;align-items:center;gap:14px;border:1px solid rgba(5,197,193,.47);border-radius:13px;background:linear-gradient(120deg,rgba(5,25,39,.82),rgba(2,16,28,.66));box-shadow:inset 0 1px 0 rgba(125,255,237,.04),0 12px 29px rgba(0,0,0,.10);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);padding:13px 15px}
.feature-icon{flex:none;width:55px;height:55px;display:grid;place-items:center;color:#1de0c5;border:1px solid rgba(25,230,211,.69);border-radius:10px;background:linear-gradient(145deg,rgba(6,61,67,.53),rgba(3,29,45,.78));box-shadow:inset 0 0 14px rgba(20,200,192,.05)}
.feature-icon svg{width:27px;height:27px}
.feature-card strong{display:block;font-size:15px;font-weight:730;line-height:1.2;color:#f1f7fc}
.feature-card small{display:block;margin-top:6px;font-size:12px;line-height:1.5;color:#aebfce}
.trust-band{display:flex;align-items:center;gap:15px;margin-top:17px;padding:18px 7px 0;border-top:1px solid rgba(66,164,178,.26)}
.trust-icon{width:48px;height:48px;display:grid;place-items:center;flex:none;color:#13e2c5}.trust-icon svg{width:33px;height:33px}
.trust-band strong{font-size:14px;color:#f3f8fb}
.trust-band p{font-size:12px;line-height:1.5;color:#b4c4d0;margin:5px 0 0;max-width:565px}
.auth-card{width:100%;max-width:555px;margin:0 0 0 auto;min-width:0;border:1px solid rgba(36,142,133,.55);border-radius:18px;background:linear-gradient(145deg,rgba(5,29,45,.92),rgba(3,18,32,.95));box-shadow:0 0 34px rgba(10,138,120,.055),0 22px 72px rgba(0,0,0,.34),inset 0 1px 0 rgba(104,255,234,.08);padding:32px clamp(30px,3.1vw,48px) 28px;position:relative;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.auth-card::before{content:"";position:absolute;left:25%;top:-1px;right:25%;height:1px;background:linear-gradient(90deg,transparent,rgba(95,254,229,.7),transparent);pointer-events:none}
.form-brand{display:flex;flex-direction:column;align-items:center;gap:0;margin:0 auto 27px;text-align:center}
.form-brand img{width:min(100%,330px);height:auto;display:block}
.form-brand span{font-size:10px;letter-spacing:.38em;color:#b3c6d3;margin-top:-2px}
.auth-card h1{font-size:clamp(23px,2vw,29px);letter-spacing:-.032em;line-height:1.26;font-weight:780;margin:0 0 9px}
.auth-card .intro{font-size:14px;line-height:1.5;color:var(--muted);margin:0 0 21px}
.tabs{display:flex;gap:3px;margin-bottom:15px;background:rgba(0,10,19,.58);padding:4px;border-radius:8px;border:1px solid rgba(36,127,138,.46)}
.tabs a{flex:1;text-align:center;font-size:12px;font-weight:700;padding:8px;border-radius:6px;text-decoration:none;color:#a9c2ca}
.tabs a.active{background:rgba(28,128,106,.35);color:#60ebd4}
body[data-auth-mode="login"] .tabs{display:none}
#authForm label:not(.remember-option){display:block;font-size:13px;font-weight:600;margin:16px 0 8px;color:#eaf4f7}
.field{position:relative;display:flex;align-items:center;min-width:0}
.field-icon{position:absolute;left:15px;color:#b3c9d4;display:flex;align-items:center;pointer-events:none}
.field-icon svg{width:20px;height:20px}
.field input{display:block;width:100%;min-width:0;height:51px;border:1px solid rgba(112,152,169,.57);border-radius:10px;background:rgba(4,21,36,.70);color:#f0f9fb;padding:12px 48px;font-size:14px;line-height:1.4;outline:none;transition:border-color .15s,box-shadow .15s}
.field input::placeholder{color:#7c96ab}
.field input:focus{border-color:#2fdfc5;box-shadow:0 0 0 3px rgba(35,211,170,.13)}
.show-password{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:38px;height:39px;display:grid;place-items:center;border:0;background:transparent;border-radius:7px;color:#adc2cb}
.show-password:hover{color:#24e1be}.show-password svg{width:19px;height:19px}
.form-extras{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin:15px 0 0;font-size:12px}
.remember-option{display:flex;align-items:center;gap:9px;color:#d8e9ef;cursor:pointer}
.remember-option input{width:18px;height:18px;accent-color:#20daba;cursor:pointer}
.form-extras a,.join-prompt a,.aux-links a{font-size:12px;color:#35ead0;text-decoration:none}
.form-extras a:hover,.join-prompt a:hover,.aux-links a:hover{text-decoration:underline}
.auth-card .submit{min-height:55px;width:100%;border:0;border-radius:10px;background:linear-gradient(105deg,#2aebc7,#10c8b0);color:#002b29;font-size:17px;font-weight:830;display:flex;gap:18px;align-items:center;justify-content:center;margin:25px 0 0;box-shadow:0 7px 25px rgba(0,226,191,.12);transition:filter .17s}
.auth-card .submit:hover{filter:brightness(1.08)}.auth-card .submit:disabled{opacity:.55;cursor:wait}
.offline-divider{display:flex;align-items:center;gap:15px;color:#a0b6c3;margin:23px 0 18px;font-size:12px}
.offline-divider::before,.offline-divider::after{content:"";height:1px;flex:1;background:rgba(113,151,170,.42)}
.join-prompt{text-align:center;color:#d3e1e9;font-size:13px;margin:0}
.join-prompt a{font-size:13px;font-weight:690;margin-left:4px}
.offline-tools{margin:16px 0 0;border-top:1px solid rgba(90,138,152,.25);padding-top:11px}
.offline-tools summary{font-size:11px;color:#90a6b5;cursor:pointer;list-style-position:inside;text-align:center;padding:4px 0}
.offline-tools[open] summary{color:#4beaca}
.offline-tools-content{margin-top:11px;display:flex;align-items:stretch;flex-direction:column;gap:10px}
.offline-mode-label{font-size:10px;color:#8edaca;text-align:center}
.offline-pulse{width:6px;height:6px;border-radius:50%;background:#23d3a1;display:inline-block}
.offline-demo-btn{border:1px solid rgba(51,169,148,.5);border-radius:9px;background:rgba(13,57,48,.7);color:#9df4dc;padding:11px;font-size:12px;font-weight:730}
.aux-links{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px}.auth-card .foot{margin:2px 0 0;text-align:center;font-size:10px;color:#8aa5b3;line-height:1.5}
.notice,.error{border:1px solid #3e8e7d;border-radius:8px;background:#102f2c;color:#b5f8e1;padding:10px 12px;margin:11px 0;font-size:12px;line-height:1.5}
.error{border-color:#9c626a;background:#38212a;color:#ffc9cd}
.hint{font-size:11px;color:#a3b8bf;line-height:1.5}
.offline-activation{padding:12px;margin-top:12px;background:#0c332b;border:1px solid #397c69;border-radius:10px}
.offline-activation strong{font-size:13px}.offline-activation p{font-size:11px;line-height:1.5}.offline-activation .submit{margin-top:8px;min-height:40px;font-size:12px}
.site-foot{width:min(100% - 88px,1378px);margin:0 auto;padding:0 0 18px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8caab8;font-size:10px;position:relative;z-index:1}
.site-foot span:last-child{font-size:10px;letter-spacing:.28em}
[hidden]{display:none!important}
:focus-visible{outline:2px solid #58efcf;outline-offset:3px}
@media(max-width:1330px){.auth-layout{width:min(100% - 64px,1250px);gap:40px;grid-template-columns:minmax(0,1.1fr) minmax(390px,.9fr)}.marketing h2{font-size:clamp(40px,4vw,60px)}.feature-card{padding:12px;gap:11px}.feature-icon{width:47px;height:47px}.feature-card strong{font-size:13px}.feature-card small{font-size:11px}.site-foot{width:calc(100% - 64px)}}
@media(max-width:1050px){.auth-layout{grid-template-columns:1fr;width:min(100% - 56px,740px);padding:35px 0;gap:30px;min-height:0}.marketing h2{font-size:clamp(42px,6vw,62px)}.marketing-description{max-width:650px}.auth-card{margin:0 auto;max-width:620px}.site-foot{width:calc(100% - 56px)}}
@media(max-width:600px){.site-head{height:67px;padding:8px 17px;gap:11px}.site-logo{flex-basis:148px}.site-join{gap:0}.site-join>span{display:none}.register-action{min-height:35px;padding:7px 12px;font-size:11px;gap:7px;border-radius:7px}.auth-layout{width:calc(100% - 30px);gap:23px;padding:27px 0 24px}.marketing-kicker{font-size:9px;letter-spacing:.17em;gap:.29em}.marketing-kicker::before{width:18px;margin-right:6px}.marketing h2{font-size:clamp(31px,8vw,43px);line-height:1.12;letter-spacing:-.045em;margin-bottom:12px}.marketing-description{font-size:13px;line-height:1.55;margin-bottom:18px}.feature-grid{gap:8px}.feature-card{min-height:80px;gap:8px;padding:10px 8px;align-items:flex-start;border-radius:10px}.feature-icon{width:31px;height:31px;border-radius:7px}.feature-icon svg{width:20px;height:20px}.feature-card strong{font-size:11px}.feature-card small{font-size:10px;margin-top:4px;line-height:1.4}.trust-band{padding:12px 4px 0;gap:8px}.trust-icon{width:34px;height:34px}.trust-icon svg{width:27px;height:27px}.trust-band strong{font-size:12px}.trust-band p{font-size:10px}.auth-card{padding:23px 18px 22px;border-radius:14px}.form-brand{margin-bottom:19px}.form-brand img{width:min(100%,250px)}.form-brand span{font-size:8px;letter-spacing:.18em}.auth-card h1{font-size:22px}.auth-card .intro{font-size:12px}.site-foot{width:calc(100% - 30px);padding-bottom:15px}.site-foot span:last-child{display:none}}
@media(max-width:360px){.feature-grid{grid-template-columns:1fr}.feature-card{min-height:58px}.marketing h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}
/* On narrow screens, authentication comes before the marketing panels. */
@media(max-width:1050px){.auth-card{order:-1}}
