@font-face {
            font-family: 'JF-Flat-Regular';
            src: url('../../../2024/fonts/JF-Flat-Regular.ttf') format('truetype');
            font-style: normal;
            font-weight: normal;
            font-display: swap;
        }
        :root { --ink:#4a2500; --green:#d96b11; --green-2:#f08a24; --mint:#fff1e5; --sand:#fff7ef; --gold:#ffb347; --muted:#8a6b52; --line:#f0dcc8; --danger:#b42318; }
        * { box-sizing:border-box; }
        html, body { min-height:100%; }
        body { margin:0; color:var(--ink); background:#fff7f0; font-family:'JF-Flat-Regular', Tahoma, Arial, sans-serif; -webkit-font-smoothing:antialiased; }
        button, input, select { font:inherit; }
        .auth-shell { min-height:100vh; display:grid; grid-template-columns:minmax(360px, 46%) 1fr; }
        .auth-panel { position:relative; z-index:2; display:flex; align-items:center; justify-content:center; padding:48px 9vw; background:#fff; box-shadow:18px 0 60px rgba(74,37,0,.08); }
        [dir="rtl"] .auth-panel { box-shadow:-18px 0 60px rgba(74,37,0,.08); }
        .auth-card { width:min(100%, 470px); }
        .topbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:54px; }
        .brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink); }
        .brand-mark { width:46px; height:46px; display:grid; place-items:center; overflow:hidden; border-radius:15px; background:var(--mint); border:1px solid #ffe2c3; }
        .brand-mark img { width:34px; height:34px; object-fit:contain; }
        .brand-copy strong { display:block; font-size:15px; }
        .brand-copy span { display:block; margin-top:3px; color:var(--muted); font-size:11px; }
        .language { position:relative; }
        .language select { min-width:120px; height:42px; padding:0 34px 0 14px; color:var(--ink); background:#fff; border:1px solid var(--line); border-radius:12px; outline:none; cursor:pointer; }
        .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
        .eyebrow { display:inline-flex; align-items:center; gap:8px; color:var(--green); font-size:12px; font-weight:700; letter-spacing:.02em; }
        .eyebrow:before { content:""; width:24px; height:2px; background:var(--gold); border-radius:4px; }
        h1 { margin:14px 0 10px; font-size:clamp(29px, 3vw, 42px); line-height:1.2; letter-spacing:-.025em; }
        .lead { margin:0 0 34px; color:var(--muted); line-height:1.9; font-size:14px; }
        .alert { display:flex; gap:10px; align-items:flex-start; margin-bottom:20px; padding:13px 15px; color:var(--danger); background:#fff4f2; border:1px solid #ffd5cf; border-radius:13px; font-size:13px; line-height:1.7; }
        .alert.hidden { display:none; }
        .alert.success { color:#17633a; background:#effaf3; border-color:#bce8ca; }
        .alert.success:before { content:"✓"; background:#238552; }
        .alert:before { content:"!"; flex:0 0 22px; width:22px; height:22px; display:grid; place-items:center; color:#fff; background:var(--danger); border-radius:50%; font-weight:800; }
        .field { margin-bottom:18px; }
        .field label { display:block; margin-bottom:9px; font-size:13px; font-weight:700; }
        .control { position:relative; }
        .control input { width:100%; height:56px; padding:0 48px 0 16px; color:var(--ink); background:#fffaf6; border:1px solid var(--line); border-radius:15px; outline:none; transition:.2s ease; }
        [dir="ltr"] .control input { padding:0 16px 0 48px; }
        .control input:focus { background:#fff; border-color:var(--green-2); box-shadow:0 0 0 4px rgba(240,138,36,.10); }
        .field-icon { position:absolute; inset-inline-start:17px; top:50%; width:18px; height:18px; transform:translateY(-50%); color:var(--green); opacity:.75; }
        .phone-icon:before { content:""; position:absolute; inset:2px 4px; border:2px solid currentColor; border-radius:5px; }
        .phone-icon:after { content:""; position:absolute; bottom:4px; left:8px; width:3px; height:3px; background:currentColor; border-radius:50%; }
        .lock-icon:before { content:""; position:absolute; left:3px; bottom:1px; width:12px; height:10px; border:2px solid currentColor; border-radius:3px; }
        .lock-icon:after { content:""; position:absolute; left:6px; top:0; width:6px; height:8px; border:2px solid currentColor; border-bottom:0; border-radius:7px 7px 0 0; }
        .phone-wrap { display:flex; align-items:stretch; direction:ltr; background:#fffaf6; border:1px solid var(--line); border-radius:15px; overflow:hidden; transition:.2s ease; }
        .phone-wrap:focus-within { background:#fff; border-color:var(--green-2); box-shadow:0 0 0 4px rgba(240,138,36,.10); }
        .phone-wrap .prefix { flex:0 0 76px; display:inline-flex; align-items:center; justify-content:center; direction:ltr; color:var(--muted); border-inline-end:1px solid var(--line); }
        .phone-wrap .control { flex:1 1 auto; min-width:0; }
        .phone-wrap .control input { height:54px; direction:ltr; text-align:left; border:0; border-radius:0; background:transparent; box-shadow:none; }
        .phone-wrap .control input:focus { background:transparent; border:0; box-shadow:none; }
        [dir="rtl"] .phone-wrap { flex-direction:row-reverse; }
        [dir="rtl"] .phone-wrap .prefix { border-inline-end:0; border-inline-start:1px solid var(--line); }
        .submit { width:100%; height:56px; margin-top:8px; color:#fff; background:linear-gradient(135deg,var(--green),var(--green-2)); border:0; border-radius:15px; font-weight:700; cursor:pointer; box-shadow:0 14px 30px rgba(217,107,17,.22); transition:.2s ease; }
        .submit:hover { transform:translateY(-1px); box-shadow:0 18px 34px rgba(217,107,17,.28); }
        .submit.is-loading, .ghost.is-loading { display:inline-flex; align-items:center; justify-content:center; gap:10px; cursor:wait; opacity:.88; transform:none; box-shadow:none; }
        .submit.is-loading:before, .ghost.is-loading:before { content:""; width:17px; height:17px; box-sizing:border-box; border:2px solid currentColor; border-inline-end-color:transparent; border-radius:50%; animation:partner-login-spin .65s linear infinite; }
        .auth-card [aria-busy="true"] .control input, .auth-card [aria-busy="true"] .otp-digit { opacity:.7; pointer-events:none; }
        @keyframes partner-login-spin { to { transform:rotate(360deg); } }
        .submit:focus-visible, .back:focus-visible, .ghost:focus-visible, .language select:focus-visible { outline:3px solid rgba(255,179,71,.45); outline-offset:3px; }
        .security-note { display:flex; align-items:center; justify-content:center; gap:8px; margin-top:22px; color:var(--muted); font-size:11px; }
        .security-note:before { content:""; width:7px; height:7px; background:var(--green); border-radius:50%; box-shadow:0 0 0 4px #ffe9d6; }
        .otp-phone { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:0 0 25px; padding:13px 15px; background:var(--sand); border-radius:13px; font-size:12px; }
        .otp-phone strong { direction:ltr; }
        .back { padding:0; color:var(--green); background:none; border:0; font-weight:700; cursor:pointer; text-decoration:none; }
        .ghost { width:100%; height:48px; margin-top:14px; color:var(--green); background:#fff; border:1px solid var(--line); border-radius:13px; font-weight:700; cursor:pointer; }
        .ghost:disabled { opacity:.58; cursor:not-allowed; background:#fffaf6; }
        .otp-grid { direction:ltr; display:grid; grid-template-columns:repeat(6, 1fr); gap:10px; margin:12px 0 24px; }
        .otp-digit { min-width:0; height:62px; text-align:center; color:var(--ink); background:#fffaf6; border:1px solid var(--line); border-radius:14px; outline:none; font-size:23px; font-weight:800; caret-color:var(--green); }
        .otp-digit:focus { background:#fff; border-color:var(--green-2); box-shadow:0 0 0 4px rgba(240,138,36,.10); }
        .visual-panel { position:relative; overflow:hidden; display:flex; align-items:flex-end; padding:8vw; color:#fff; background:#7a3200; }
        .visual-panel:before, .visual-panel:after { content:""; position:absolute; border-radius:50%; }
        .visual-panel:before { width:580px; height:580px; top:-210px; inset-inline-end:-170px; border:90px solid rgba(255,179,71,.12); }
        .visual-panel:after { width:430px; height:430px; bottom:-230px; inset-inline-start:-120px; background:rgba(240,138,36,.24); }
        .grid-pattern { position:absolute; inset:0; opacity:.12; background-image:linear-gradient(rgba(255,255,255,.25) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.25) 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(to bottom,transparent,black); }
        .visual-copy { position:relative; z-index:1; max-width:580px; }
        .visual-kicker { display:flex; align-items:center; gap:10px; margin-bottom:20px; color:#ffd8af; font-size:12px; font-weight:700; }
        .visual-kicker:before { content:""; width:10px; height:10px; background:var(--gold); border-radius:50%; box-shadow:0 0 0 6px rgba(255,179,71,.13); }
        .visual-copy h2 { max-width:520px; margin:0; font-size:clamp(36px, 5vw, 68px); line-height:1.18; letter-spacing:-.035em; }
        .visual-copy p { max-width:480px; margin:24px 0 0; color:#ffe0c1; font-size:15px; line-height:2; }
        .steps { display:flex; gap:8px; margin-top:42px; }
        .steps span { width:44px; height:5px; background:rgba(255,255,255,.17); border-radius:8px; }
        .steps span.active { width:76px; background:var(--gold); }
        .success-box { max-width:760px; margin:60px auto; background:#fff; border-radius:22px; padding:36px; box-shadow:0 20px 50px rgba(74,37,0,.08); line-height:2; }
        .success-box .submit-link { display:inline-flex; align-items:center; justify-content:center; min-width:180px; margin-top:20px; color:#fff; background:linear-gradient(135deg,var(--green),var(--green-2)); border-radius:14px; height:52px; text-decoration:none; }
        @media (max-width:900px) { .auth-shell { grid-template-columns:1fr; } .visual-panel { display:none; } .auth-panel { min-height:100vh; padding:32px 22px; } .auth-card { width:min(100%,520px); } }
        @media (max-width:480px) { .topbar { margin-bottom:40px; } .brand-copy { display:none; } .otp-grid { gap:6px; } .otp-digit { height:55px; border-radius:11px; font-size:20px; } }
        @media (prefers-reduced-motion:reduce) { * { transition:none!important; scroll-behavior:auto!important; } }

[hidden]{display:none!important}