:root {
    --bg: #02060b;
    --black: #000204;
    --panel: #07101b;
    --text: #f5f7fa;
    --muted: #91a2b4;
    --line: rgba(255,255,255,.14);
    --blue: #2878ff;
    --cyan: #17d8ff;
}

* { box-sizing: border-box; }
html, body { width:100%; height:100%; margin:0; }
body {
    overflow:hidden;
    background:var(--bg);
    color:var(--text);
    font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    -webkit-font-smoothing:antialiased;
}
a { color:inherit; }

.auth-page {
    width:100%;
    height:100vh;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    background:
        radial-gradient(circle at 73% 47%, rgba(20,84,164,.12), transparent 30%),
        linear-gradient(110deg, #000 0%, #02070d 51%, #06101b 100%);
}

.auth-shell {
    width:100%;
    height:calc(100vh - 42px);
    min-height:0;
    flex:1 1 auto;
    display:grid;
    grid-template-columns:44% 56%;
}

.auth-left {
    min-width:0;
    min-height:0;
    overflow:hidden;
    padding:12px 4.25vw 6px;
    display:flex;
    flex-direction:column;
}

.auth-brand-small {
    width:91px;
    height:37px;
    display:block;
    margin:0 0 8px;
    text-decoration:none;
    flex:0 0 auto;
}
.auth-brand-small img {
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
    object-position:left center;
    filter:drop-shadow(0 7px 18px rgba(0,139,255,.16));
}

.auth-content { width:min(100%,590px); }

h1 {
    margin:0;
    font-size:clamp(43px,4.0vw,64px);
    line-height:.91;
    letter-spacing:-.065em;
    font-weight:850;
}

.auth-subtitle {
    max-width:540px;
    margin:14px 0 18px;
    color:#91a4b7;
    font-size:17px;
    line-height:1.55;
}

.providers { display:grid; gap:11px; }
.provider {
    height:56px;
    border:1px solid #e0e5e9;
    border-radius:13px;
    background:#fff;
    color:#080c11;
    text-decoration:none;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    font-size:17px;
    font-weight:760;
}
.provider:hover { background:#f0f3f6; }
.google-icon { color:#4d83e8; font-size:21px; font-weight:900; }
.apple-icon { color:#111; font-size:18px; }
.facebook-icon { color:#2878e8; font-size:25px; font-weight:900; }

.divider {
    display:flex;
    align-items:center;
    gap:16px;
    margin:13px 0 11px;
    color:#7f90a1;
    font-size:15px;
}
.divider::before,
.divider::after {
    content:"";
    height:1px;
    background:#2a3643;
    flex:1;
}

.auth-alert {
    width:70%;
    max-width:100%;
    box-sizing:border-box;
    margin:0 0 12px;
    padding:10px 13px;
    border:1px solid rgba(244,33,46,.45);
    border-radius:10px;
    background:rgba(244,33,46,.10);
    color:#ff9ba3;
    font-size:13px;
}

.auth-form { display:grid; gap:11px; }
.input-wrap {
    position:relative;
    display:flex;
    align-items:center;
    height:54px;
    border:1px solid #334c70;
    border-radius:13px;
    background:#182f5e;
}
.input-wrap:focus-within {
    border-color:#2d83ff;
    box-shadow:0 0 0 1px #2d83ff;
}
.input-wrap input {
    width:100%;
    height:100%;
    padding:0 50px 0 58px;
    border:0;
    outline:0;
    background:transparent;
    color:#fff;
    font-size:16px;
}
.input-wrap input::placeholder { color:#e1e8f2; opacity:.9; }
.input-icon {
    position:absolute;
    left:27px;
    color:#c3d0df;
    font-size:18px;
    z-index:1;
}
.password-toggle {
    position:absolute;
    right:12px;
    width:32px;
    height:32px;
    border:0;
    background:transparent;
    color:#aebed0;
    cursor:pointer;
}

.login-btn {
    height:49px;
    border:0;
    border-radius:999px;
    background:linear-gradient(90deg,#377df4,#438bf9);
    color:#fff;
    font-size:18px;
    font-weight:800;
    cursor:pointer;
    box-shadow:0 12px 30px rgba(35,115,255,.16);
}
.login-btn:disabled {
    background:#2a2d31;
    color:#7d858e;
    box-shadow:none;
    cursor:not-allowed;
}

.register-note {
    margin:9px 0 0;
    color:#9aa8b6;
    font-size:15px;
}
.register-note a { color:#2c8fff; text-decoration:none; font-weight:800; }
.terms { margin:6px 0 0; color:#667789; font-size:10px; line-height:1.5; }
.terms a { color:#8190a0; }

.auth-right {
    position:relative;
    min-width:0;
    min-height:0;
    height:100%;
    overflow:hidden;
    display:grid;
    place-items:center;
    background:radial-gradient(circle at 50% 45%,rgba(15,80,165,.10),transparent 34%);
}

.hero-glow {
    position:absolute;
    width:540px;
    height:540px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(20,95,200,.11),transparent 68%);
}
.hero-ring {
    position:absolute;
    border:1px solid rgba(255,255,255,.12);
    border-radius:50%;
    aspect-ratio:1;
}
.hero-ring-one { width:min(620px,68vw); }
.hero-ring-two { width:min(500px,55vw); border-color:rgba(20,105,220,.20); }
.hero-ring-three { width:min(320px,35vw); border-color:rgba(255,255,255,.10); }


.hero-logo-wrap {
    position:absolute;
    top:44%;
    left:50%;
    z-index:10;
    width:min(405px, 39vw);
    transform:translate(-50%, -50%);
    display:flex;
    justify-content:center;
    align-items:center;
    pointer-events:none;
}
.hero-logo-wrap {
    visibility:visible !important;
    opacity:1 !important;
}
.hero-logo {
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
    visibility:visible;
    opacity:1;
    mix-blend-mode:normal;
    filter:drop-shadow(0 12px 30px rgba(0,151,255,.18));
}

.hero-slogan {
    position:absolute;
    top:69%;
    z-index:4;
    text-align:center;
    color:#eef2f7;
    font-size:17px;
    line-height:2.15;
    letter-spacing:.34em;
    font-weight:500;
    white-space:nowrap;
}
.hero-line {
    position:absolute;
    top:80%;
    z-index:4;
    width:73px;
    height:4px;
    border-radius:10px;
    background:linear-gradient(90deg,var(--blue),var(--cyan));
}
.hero-features {
    position:absolute;
    top:84%;
    z-index:4;
    width:min(620px,75%);
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
    text-align:center;
}
.hero-features div {
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    color:#299bff;
}
.hero-features span { font-size:30px; line-height:1; }
.hero-features small { color:#d0d8e1; font-size:10px; letter-spacing:.16em; }

.auth-footer {
    height:42px;
    min-height:42px;
    flex:0 0 42px;
    border-top:1px solid rgba(255,255,255,.13);
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    padding:0 3.8%;
    color:#687889;
    font-size:12px;
}
.auth-footer nav { display:flex; gap:26px; }
.auth-footer a { color:#748496; text-decoration:none; }
.auth-footer a:hover { color:#fff; }
.socials { display:flex; justify-content:flex-end; gap:18px; color:#95a4b4; }

@media (max-width:1000px) {
    body { overflow:auto; }
    .auth-page { height:auto; min-height:100vh; overflow:visible; }
    .auth-shell { height:auto; min-height:calc(100vh - 42px); grid-template-columns:1fr; }
    .auth-right { display:none; }
    .auth-left { width:min(620px,100%); margin:0 auto; padding:24px; }
    .auth-footer { height:auto; min-height:42px; grid-template-columns:1fr; gap:10px; padding:13px 24px; text-align:center; }
    .auth-footer nav,.socials { justify-content:center; flex-wrap:wrap; }
}

@media (max-width:1000px) {
    .hero-logo-wrap { width:min(390px, 62vw); }
}

@media (max-width:560px) {
    .auth-left { padding:18px 16px 28px; }
    .auth-brand-small { width:86px; height:35px; }
    h1 { font-size:43px; }
    .auth-subtitle { font-size:15px; margin:16px 0 20px; }
    .provider { height:52px; font-size:14px; }
    .input-wrap,.login-btn { height:53px; }
    .auth-footer nav { gap:12px 18px; }
}


/* Kayıt formu: giriş ekranıyla aynı tasarım dili */
.auth-form { display:grid; gap:9px; }
.auth-form .input-wrap { height:50px; }
.auth-form .input-wrap input { padding-left:58px; }
.auth-form .password-toggle { right:12px; }
.auth-form .login-btn { margin-top:1px; }

@media (max-height:760px) and (min-width:1001px) {
    .auth-left { padding-top:8px; padding-bottom:4px; }
    .auth-brand-small { width:82px; height:34px; margin-bottom:5px; }
    h1 { font-size:clamp(40px,3.4vw,54px); }
    .auth-subtitle { margin:8px 0 12px; font-size:14px; }
    .auth-form { gap:7px; }
    .auth-form .input-wrap { height:46px; }
    .login-btn { height:45px; }
    .register-note { margin-top:6px; }
    .terms { margin-top:4px; }
    .hero-logo-wrap { top:42%; width:min(330px,34vw); }
    .hero-slogan { top:68%; font-size:15px; }
    .hero-line { top:78%; }
    .hero-features { top:83%; }
}

@media (max-width:1000px) {
    .auth-form .input-wrap { height:53px; }
}

/* Form kontrolleri: mevcut tasarım korunarak boyutları yüzde otuz küçültüldü. */
.providers,
.auth-form {
    width:70%;
    max-width:100%;
}

.providers { gap:9px; }
.provider {
    height:39px;
    border-radius:10px;
    gap:11px;
    font-size:14px;
}
.google-icon { font-size:17px; }
.apple-icon { font-size:14px; }
.facebook-icon { font-size:20px; }

.auth-form { gap:9px; }
.auth-form .input-wrap {
    height:38px;
    border-radius:10px;
}
.auth-form .input-wrap input {
    padding:0 40px 0 46px;
    font-size:13px;
}
.auth-form .input-icon {
    left:22px;
    font-size:14px;
}
.auth-form .password-toggle {
    right:10px;
    width:26px;
    height:26px;
}
.auth-form .login-btn {
    height:34px;
    font-size:14px;
}

@media (max-width:560px) {
    .auth-form .input-wrap,
    .auth-form .login-btn {
        height:37px;
    }
}

/* FINAL 30% SIZE OVERRIDE: only register controls are reduced; layout/style remains unchanged. */
.auth-form { width:70% !important; gap:9px !important; }
.auth-form .input-wrap { height:38px !important; border-radius:10px !important; }
.auth-form .input-wrap input {
    padding:0 40px 0 46px !important;
    font-size:13px !important;
}
.auth-form .input-icon { left:22px !important; font-size:14px !important; }
.auth-form .password-toggle { right:10px !important; width:26px !important; height:26px !important; }
.auth-form .login-btn { height:34px !important; font-size:14px !important; }