/* ===== Monano Land — luxury auth (login/OTP) ===== */
.auth-hero{position:relative;min-height:calc(100svh - var(--header-h,74px));display:flex;align-items:center;justify-content:center;padding:3rem 0;overflow:hidden}
.auth-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 400px at 50% 0%,hsl(var(--net-hue,172) 90% 55% / .1),transparent 65%);pointer-events:none}
.auth-shell{position:relative;z-index:2;width:min(460px,calc(100% - 2rem))}
.auth-panel{position:relative;border:1px solid hsl(var(--net-hue,172) 80% 55% / .3);border-radius:22px;background:linear-gradient(165deg,rgba(10,14,22,.92),rgba(6,8,14,.96));backdrop-filter:blur(18px);box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 60px hsl(var(--net-hue,172) 90% 50% / .08);padding:2.4rem 2.2rem;overflow:hidden}
.auth-panel::before{content:"";position:absolute;top:0;inset-inline:0;height:1px;background:linear-gradient(90deg,transparent,hsl(var(--net-hue,172) 95% 60%),hsl(calc(var(--net-hue,172) + 120) 95% 60%),transparent)}
.auth-core{display:flex;flex-direction:column;align-items:center;gap:.4rem;margin-bottom:1.6rem;text-align:center}
.auth-core-mark{position:relative;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;font:700 1.3rem var(--cyber-mono,monospace);color:#f6fffd;letter-spacing:.1em;margin-inline-start:.1em;background:radial-gradient(circle at 50% 44%,rgba(4,9,20,.5) 0 30%,hsl(var(--net-hue,172) 80% 45% / .1) 55%,transparent 75%);box-shadow:0 0 34px hsl(var(--net-hue,172) 95% 55% / .3),inset 0 0 24px hsl(var(--net-hue,172) 95% 55% / .12)}
.auth-core-mark::before{content:"";position:absolute;inset:5%;border:1.5px solid hsl(var(--net-hue,172) 95% 62% / .8);border-radius:50%;box-shadow:0 0 20px hsl(var(--net-hue,172) 95% 58% / .4);animation:core-spin 18s linear infinite}
.auth-core-mark::after{content:"";position:absolute;inset:-12%;border:1px solid hsl(calc(var(--net-hue,172) + 120) 95% 64% / .35);border-radius:50%;border-bottom-color:transparent;border-inline-start-color:transparent;animation:core-spin 26s linear infinite reverse}
.auth-kicker{font:700 .62rem var(--cyber-mono,monospace);letter-spacing:.2em;color:hsl(var(--net-hue,172) 95% 62%);text-transform:uppercase}
.auth-title{font-size:1.35rem;font-weight:800;color:#f2fbf8;margin:.5rem 0 0}
.auth-sub{color:#8fa8a2;font-size:.8rem;margin:.3rem 0 0}
.auth-field{position:relative;margin-bottom:1.1rem}
.auth-label{display:block;font:600 .68rem var(--cyber-mono,monospace);letter-spacing:.12em;color:#7d968f;margin-bottom:.5rem;text-transform:uppercase}
.auth-input{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:12px;color:#eef7f4;font-size:1.05rem;padding:.85rem 1rem;transition:border-color .25s ease,box-shadow .25s ease;direction:ltr;text-align:center;letter-spacing:.06em}
.auth-input::placeholder{color:#5d6f6a;letter-spacing:normal}
.auth-input:focus{outline:none;border-color:hsl(var(--net-hue,172) 90% 55% / .7);box-shadow:0 0 0 3px hsl(var(--net-hue,172) 90% 55% / .15),0 0 24px hsl(var(--net-hue,172) 90% 55% / .12)}
.auth-input.has-error{border-color:var(--cyber-red,#ff5577)}
.auth-submit{width:100%;border:none;border-radius:12px;padding:.95rem 1rem;font-weight:800;font-size:.95rem;cursor:pointer;background:linear-gradient(135deg,hsl(var(--net-hue,172) 95% 58%),hsl(calc(var(--net-hue,172) + 120) 90% 52%));color:#04121a;box-shadow:0 12px 30px hsl(var(--net-hue,172) 95% 50% / .35);transition:transform .2s ease,box-shadow .2s ease}
.auth-submit:hover{transform:translateY(-2px);box-shadow:0 16px 40px hsl(var(--net-hue,172) 95% 55% / .5)}
/* OTP multi-box */
.otp-boxes{display:flex;gap:.6rem;direction:ltr;justify-content:center}
.otp-box{width:52px;height:60px;text-align:center;font:700 1.5rem var(--cyber-mono,monospace);color:#f2fbf8;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:12px;transition:all .2s ease;caret-color:hsl(var(--net-hue,172) 95% 60%)}
.otp-box:focus{outline:none;border-color:hsl(var(--net-hue,172) 95% 60%);box-shadow:0 0 0 3px hsl(var(--net-hue,172) 90% 55% / .18),0 0 20px hsl(var(--net-hue,172) 90% 55% / .2);transform:translateY(-2px)}
.otp-box.filled{border-color:hsl(var(--net-hue,172) 90% 60% / .55);background:rgba(255,255,255,.06)}
.otp-hidden-code{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.auth-meta{display:flex;justify-content:space-between;align-items:center;margin-top:1.1rem;font-size:.78rem}
.auth-meta a{color:hsl(var(--net-hue,172) 90% 68%)}
.auth-note{margin-top:1.4rem;text-align:center;color:#6d837d;font-size:.72rem}
.auth-alert{margin-bottom:1.1rem;padding:.7rem .9rem;border-radius:10px;font-size:.78rem;border:1px solid hsl(var(--net-hue,172) 80% 55% / .3);background:hsl(var(--net-hue,172) 90% 50% / .08);color:#bfe8dc;text-align:center}
.auth-alert b{direction:ltr;display:inline-block;letter-spacing:.2em}
.auth-error{margin:.4rem 0 0;color:var(--cyber-red,#ff5577);font-size:.75rem;text-align:center}
@media(max-width:420px){.auth-panel{padding:1.8rem 1.3rem}.otp-box{width:44px;height:54px;font-size:1.25rem}}
[data-theme=light] .auth-panel{background:linear-gradient(165deg,rgba(255,253,248,.96),rgba(247,245,240,.98));border-color:rgba(154,123,30,.4)}
[data-theme=light] .auth-title{color:#221d14}
[data-theme=light] .auth-sub,[data-theme=light] .auth-note,[data-theme=light] .auth-label{color:#6d675c}
[data-theme=light] .auth-input,[data-theme=light] .otp-box{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.14);color:#221d14}
[data-theme=light] .auth-kicker{color:#9a7b1e}
[data-theme=light] .auth-alert{background:rgba(154,123,30,.08);color:#6b5410;border-color:rgba(154,123,30,.3)}
