:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
body{min-width:320px;min-height:100vh;margin:0;overflow-x:hidden;color:#f8f5ea;background:#050505}
.login-page{position:relative;isolation:isolate;display:grid;min-height:100svh;place-items:center;padding:max(24px,env(safe-area-inset-top)) 20px max(24px,env(safe-area-inset-bottom));overflow:hidden;background:radial-gradient(ellipse at 50% 2%,#10131a 0%,#050505 57%)}
.ambient{position:absolute;z-index:-1;width:min(62vw,520px);aspect-ratio:1;border-radius:50%;filter:blur(76px);opacity:.15}
.ambient-gold{top:-33%;right:-23%;background:#d4af37}
.ambient-blue{bottom:-34%;left:-26%;background:#2563eb;opacity:.12}
.login-card{position:relative;width:min(100%,462px);min-height:558px;padding:25px 34px 30px;overflow:hidden;border:1px solid rgba(242,214,117,.16);border-radius:30px;background:linear-gradient(145deg,rgba(23,23,25,.98),rgba(11,11,13,.99));box-shadow:0 32px 90px rgba(0,0,0,.64),inset 0 1px rgba(255,255,255,.045)}
.login-card:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.04),transparent 27%)}
.card-handle{width:46px;height:4px;margin:0 auto 28px;border-radius:99px;background:rgba(242,214,117,.24)}
.brand{display:flex;align-items:center;gap:9px;font-size:1.22rem;font-weight:790;letter-spacing:-.055em}
.brand-dot{width:10px;height:10px;border-radius:50%;background:linear-gradient(135deg,#f2d675,#b98816);box-shadow:0 0 16px rgba(230,198,92,.45)}
.brand-ai{color:#76a6ff}
.entry-copy{transition:opacity .32s ease,transform .42s cubic-bezier(.18,.9,.28,1)}
.eyebrow,.success-overline{margin:40px 0 8px;color:#dcb949;font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
h1,h2{margin:0;font-size:clamp(2rem,7vw,2.48rem);line-height:1.05;letter-spacing:-.06em}
.description{margin:16px 0 35px;color:#92959d;font-size:.98rem;line-height:1.55}
.pin-stage{position:relative;height:94px;margin:0 auto}
.pin-slots{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);gap:13px;align-items:center}
.pin-slot{display:grid;width:100%;height:66px;place-items:center;border:1px solid rgba(227,225,213,.2);border-radius:17px;background:linear-gradient(145deg,rgba(32,34,37,.88),rgba(22,23,25,.88));box-shadow:inset 0 1px rgba(255,255,255,.035);color:#f7f3e7;font-size:1.46rem;font-weight:760;will-change:transform,opacity;transition:border-color .18s,box-shadow .18s}
.slot-value:empty:after{content:"";display:block;width:7px;height:7px;border-radius:50%;background:#6d7076}
.pin-slot.is-filled{border-color:rgba(242,214,117,.56)}
.pin-slot.is-current{border-color:#f2d675;box-shadow:0 0 0 3px rgba(230,198,92,.13),inset 0 1px rgba(255,255,255,.08)}
#pin{position:absolute;z-index:4;inset:14px 0 auto;width:100%;height:66px;margin:0;opacity:0;cursor:text}
.orbit-track{position:absolute;top:14px;left:50%;z-index:2;width:66px;height:66px;border:1.5px dashed rgba(242,214,117,.82);border-radius:50%;opacity:0;pointer-events:none;transform:translateX(-50%) scale(.55);will-change:transform,opacity}
.orbit-hub{position:absolute;top:calc(50% - 4px);left:calc(50% - 4px);width:8px;height:8px;border-radius:50%;background:#f2d675;box-shadow:0 0 16px rgba(230,198,92,.75)}
.primary-action{width:100%;height:57px;margin-top:10px;border:0;border-radius:16px;cursor:pointer;color:#14100a;background:linear-gradient(112deg,#bf8f22,#f2d675 48%,#d4af37);box-shadow:0 14px 31px rgba(184,138,26,.18),inset 0 1px rgba(255,255,255,.42);font:inherit;font-size:.97rem;font-weight:820;transition:transform .22s ease,filter .22s ease}
.primary-action:hover{filter:brightness(1.06);transform:translateY(-1px)}
.primary-action:disabled{cursor:wait;opacity:.7}
.message{min-height:23px;margin:12px 0 0;color:#ee7575;text-align:center;font-size:.88rem}
.temporary-note{margin:31px 0 0;color:#64666c;text-align:center;font-size:.76rem}
.sr-only{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0,0,0,0);white-space:nowrap}
.success-panel{position:absolute;inset:97px 34px 31px;z-index:5;display:grid;align-content:center;justify-items:center;opacity:0;pointer-events:none;transform:translateY(14px) scale(.97);transition:opacity .45s ease .12s,transform .58s cubic-bezier(.18,.9,.28,1) .12s;text-align:center}
.success-panel .success-overline{margin:0 0 12px}
.success-panel h2{color:#f2d675;font-size:2rem}
.success-panel p:not(.success-overline){margin:14px 0 30px;color:#9b9da4}
.success-mark{position:relative;display:grid;width:98px;height:98px;margin-bottom:33px;place-items:center;border:2px solid #e6c65c;border-radius:29px;color:#f8e9a9;background:linear-gradient(145deg,rgba(37,30,10,.82),rgba(8,18,40,.74));box-shadow:0 0 0 13px rgba(212,175,55,.055),0 0 42px rgba(37,99,235,.2);font-size:2.3rem;font-weight:500}
.success-mark:before,.success-mark:after{content:"";position:absolute;inset:-22px;border:1px solid rgba(230,198,92,.22);border-radius:38px}
.success-mark:after{inset:-40px;border-color:rgba(59,130,246,.18)}
.continue-action{margin-top:0}
.login-card.is-orbiting .entry-copy,.login-card.is-orbiting .primary-action,.login-card.is-orbiting .message,.login-card.is-orbiting .temporary-note{opacity:0;transform:translateY(-8px);pointer-events:none}
.login-card.is-success .success-panel{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
.login-card.is-success .entry-copy,.login-card.is-success form,.login-card.is-success .temporary-note{opacity:0;pointer-events:none}
@media(max-width:410px){.login-card{min-height:536px;padding:23px 23px 26px;border-radius:27px}
.success-panel{inset-right:23px;inset-left:23px}
.pin-slots{gap:9px}
.pin-slot{height:61px;border-radius:15px}
#pin{height:61px}
.orbit-track{top:12px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* NeoAi digital identity: decorative only; application states remain unchanged. */
.login-page {
  background:
    radial-gradient(ellipse at 50% 2%, #111722 0%, #06070a 56%, #030405 100%);
}

.login-card {
  border-color: rgba(206, 161, 56, .22);
  background:
    linear-gradient(150deg, rgba(22, 24, 30, .99), rgba(8, 10, 15, .99));
  box-shadow: 0 32px 90px rgba(0, 0, 0, .68), inset 0 1px rgba(255, 255, 255, .045);
}

.login-card:after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(217, 173, 62, .035) 1px, transparent 1px) 88% 16% / 20px 20px no-repeat;
  opacity: .75;
}

.card-handle, .brand, .entry-copy, form, .temporary-note { position: relative; z-index: 2; }
.success-panel { z-index: 5; }

.digital-pixels {
  position: absolute;
  z-index: 1;
  top: 82px;
  right: 31px;
  width: 62px;
  height: 52px;
  pointer-events: none;
}

.digital-pixels i {
  position: absolute;
  display: block;
  width: 5px;
  height: 5px;
  background: #d6b34c;
  opacity: .7;
  will-change: transform, opacity;
  transform: translate3d(0, 0, 0);
  animation: pixel-breathe 8s cubic-bezier(.45, 0, .55, 1) infinite;
}

.digital-pixels i:nth-child(1) { top: 2px; left: 34px; width: 7px; height: 7px; background: #d8af3b; }
.digital-pixels i:nth-child(2) { top: 14px; left: 48px; background: #4f82dd; animation-delay: -1.1s; }
.digital-pixels i:nth-child(3) { top: 25px; left: 26px; width: 3px; height: 3px; background: #d88635; animation-delay: -2.4s; }
.digital-pixels i:nth-child(4) { top: 34px; left: 43px; width: 4px; height: 4px; background: #d6b34c; animation-delay: -.6s; }
.digital-pixels i:nth-child(5) { top: 39px; left: 8px; width: 3px; height: 3px; background: #497acc; animation-delay: -3.2s; }
.digital-pixels i:nth-child(6) { top: 10px; left: 16px; width: 3px; height: 3px; background: #d88635; animation-delay: -1.8s; }

@keyframes pixel-breathe {
  0%, 100% { opacity: .18; transform: translate3d(0, 0, 0) scale(.94); }
  50% { opacity: .70; transform: translate3d(0, -1px, 0) scale(1); }
}

.eyebrow { color: #caa43c; }
.description { color: #8f96a4; }
.pin-slot {
  border-color: rgba(202, 174, 100, .22);
  background: linear-gradient(145deg, rgba(25, 29, 37, .94), rgba(13, 16, 23, .94));
  box-shadow: inset 0 1px rgba(255, 255, 255, .04), inset 0 0 24px rgba(57, 103, 181, .04);
}
.pin-slot.is-filled { border-color: rgba(218, 180, 72, .62); }
.pin-slot.is-current {
  border-color: #dcb84e;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, .10), inset 0 0 20px rgba(73, 122, 204, .08);
}
.primary-action {
  color: #17120a;
  background: linear-gradient(112deg, #a97922, #d4b153 48%, #b88b2c);
  box-shadow: 0 12px 26px rgba(149, 104, 18, .16), inset 0 1px rgba(255, 255, 255, .34);
}
.primary-action:hover { filter: brightness(1.04); }
.success-mark {
  border-color: #d6b34c;
  color: #f1dc91;
  background: linear-gradient(145deg, rgba(31, 28, 17, .88), rgba(10, 18, 32, .82));
  box-shadow: 0 0 0 13px rgba(202, 161, 56, .045), 0 0 35px rgba(42, 83, 151, .13);
}
.success-mark:after { border-color: rgba(214, 179, 76, .16); }

.login-card.is-stage-transition .success-panel { pointer-events: none; }
.login-card.is-stage-transition .success-panel > * {
  animation: success-content-fold .52s cubic-bezier(.45, 0, .2, 1) forwards;
}
.login-card.is-stage-transition .success-mark {
  animation-name: success-mark-fold;
  animation-delay: .03s;
}
.login-card.is-stage-transition .continue-action { animation-delay: .06s; }
@keyframes success-content-fold {
  0% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
  100% { opacity: 0; transform: translateY(4px) scale(.92); filter: blur(1.5px); }
}
@keyframes success-mark-fold {
  0% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); filter: blur(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(4px) scale(.92); filter: blur(1.5px); }
}
.onboarding-panel {
  position: absolute;
  inset: 0;
  z-index: 5;
  padding: 0 34px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px) scale(.98);
  transition: opacity .46s ease, transform .54s cubic-bezier(.18, .9, .28, 1);
}
.onboarding-panel .onboarding-copy { margin-top: 112px; }
.onboarding-panel .onboarding-copy h1 { font-size: 2rem; line-height: 1.08; }
.onboarding-panel .name-form { margin-top: 28px; }
.onboarding-panel .name-form input { height: 56px; }
.password-field { margin-top: 15px; }
.password-field label { margin-bottom: 8px; }
.login-card.is-onboarding .onboarding-panel {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}
.login-card.is-onboarding .entry-copy,
.login-card.is-onboarding #pin-form,
.login-card.is-onboarding .temporary-note {
  opacity: 0;
  pointer-events: none;
}

.onboarding-card { min-height: 558px; }
.onboarding-copy { position: relative; z-index: 2; margin-top: 82px; }
.onboarding-copy .eyebrow { margin-top: 0; }
.onboarding-copy h1 { max-width: 350px; }
.name-form { position: relative; z-index: 2; margin-top: 42px; }
.name-form label {
  display: block;
  margin-bottom: 10px;
  color: #c7c9cf;
  font-size: .84rem;
  font-weight: 650;
}
.name-form input {
  display: block;
  width: 100%;
  height: 64px;
  border: 1px solid rgba(202, 174, 100, .28);
  border-radius: 17px;
  outline: none;
  padding: 0 18px;
  color: #f8f5ea;
  background: linear-gradient(145deg, rgba(25, 29, 37, .94), rgba(13, 16, 23, .94));
  box-shadow: inset 0 1px rgba(255, 255, 255, .04), inset 0 0 24px rgba(57, 103, 181, .04);
  font: inherit;
  font-size: 1rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.name-form input::placeholder { color: #737986; }
.name-form input:focus {
  border-color: #dcb84e;
  box-shadow: 0 0 0 3px rgba(212, 175, 55, .10), inset 0 0 20px rgba(73, 122, 204, .08);
}
.name-form .primary-action { margin-top: 18px; }
.onboarding-message {
  min-height: 20px;
  margin: 10px 0 0;
  color: #e77b7b;
  text-align: center;
  font-size: .82rem;
}
@media(max-width:410px) {
  .onboarding-copy { margin-top: 62px; }
  .name-form { margin-top: 34px; }
}
@media(max-width:410px) {
  .onboarding-panel { padding: 0 23px; }
  .onboarding-panel .onboarding-copy { margin-top: 104px; }
}

/* Main NeoAi shell */
.neo-shell {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: #f6f4ed;
  background: radial-gradient(ellipse at 50% -18%, #12161e 0%, #07090d 52%, #030814 100%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.neo-home {
  position: relative;
  isolation: isolate;
  min-height: 100svh;
  overflow: hidden;
  padding: max(26px, env(safe-area-inset-top)) 24px calc(142px + env(safe-area-inset-bottom));
}
.neo-topbar { display: flex; align-items: center; justify-content: space-between; max-width: 1040px; margin: auto; }
.neo-wordmark { display: inline-flex; align-items: center; gap: 7px; color: #f5f3ec; text-decoration: none; font-size: 1.22rem; font-weight: 790; letter-spacing: -.055em; }
.neo-wordmark-text { color: #f5f3ec; }
.neo-wordmark-text span { color: #76a6ff; }
.neo-wordmark .brand-dot { flex: 0 0 auto; }
.top-actions { display: flex; gap: 9px; }
.top-icon { display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid rgba(218, 179, 76, .19); border-radius: 12px; color: #d7b555; background: rgba(255, 255, 255, .018); }
.top-icon svg, .nav-item svg, .mic-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.home-hero { position: relative; z-index: 2; display: flex; width: min(100%, 640px); margin: clamp(145px, 23vh, 220px) auto 0; flex-direction: column; align-items: center; text-align: center; }
.neo-n-logo { position: relative; width: 118px; height: 136px; margin-bottom: 22px; color: #d7b24d; font-size: 8.6rem; font-weight: 850; line-height: 1; letter-spacing: -.15em; text-shadow: none; }
.neo-n-logo span { position: relative; z-index: 2; }
.neo-n-logo b, .neo-n-logo i, .neo-n-logo em { position: absolute; z-index: 3; display: block; background: #d7b24d; }
.neo-n-logo b { top: 16px; right: 1px; width: 9px; height: 9px; }
.neo-n-logo i { top: 30px; right: -12px; width: 5px; height: 5px; background: #4d82dc; }
.neo-n-logo em { top: 40px; right: 3px; width: 4px; height: 4px; background: #d68b38; }
.hello { margin: 0 0 6px; color: #d9b550; font-size: clamp(1.35rem, 4vw, 1.7rem); font-weight: 760; letter-spacing: -.035em; }
.home-hero h1 { margin: 0; color: #f3f2ee; font-size: clamp(1.85rem, 6.5vw, 2.55rem); letter-spacing: -.055em; }
.ask-form { display: flex; width: 100%; height: 68px; align-items: center; gap: 7px; margin-top: 36px; border: 1px solid rgba(213, 179, 79, .36); border-radius: 23px; padding: 7px 8px 7px 18px; background: rgba(13, 17, 25, .74); box-shadow: inset 0 1px rgba(255, 255, 255, .035); backdrop-filter: blur(12px); }
.ask-form input { min-width: 0; flex: 1; border: 0; outline: 0; color: #f3f2ed; background: transparent; font: inherit; font-size: 1rem; }
.ask-form input::placeholder { color: #7f8590; }
.mic-button { display: grid; width: 38px; height: 42px; place-items: center; border: 0; color: #d8b554; background: transparent; }
.voice-button { display: flex; width: 48px; height: 46px; align-items: center; justify-content: center; border: 1px solid rgba(122, 170, 255, .48); border-radius: 16px; color: #eaf2ff; background: #2264bf; box-shadow: inset 0 1px rgba(255, 255, 255, .18); }
.voice-waves { display: flex; align-items: center; gap: 3px; }.voice-waves i { width: 2px; border-radius: 2px; background: #eaf2ff; }.voice-waves i:nth-child(1),.voice-waves i:nth-child(4){height:8px}.voice-waves i:nth-child(2){height:16px}.voice-waves i:nth-child(3){height:12px}
.send-icon { display: none; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }.ask-form.has-query .voice-waves { display: none; }.ask-form.has-query .send-icon { display: block; }
.search-screen .send-icon { display: block; }
.home-pixels { position: absolute; z-index: 0; pointer-events: none; opacity: .55; }
.home-pixels i { position: absolute; display: block; width: 5px; height: 5px; background: #d6b34c; }
.pixels-left { top: 36%; left: 7%; width: 52px; height: 78px; }.pixels-right { top: 20%; right: 8%; width: 62px; height: 90px; }
.pixels-left i:nth-child(1){top:0;left:9px;width:8px;height:8px}.pixels-left i:nth-child(2){top:15px;left:22px;background:#396db8}.pixels-left i:nth-child(3){top:31px;left:5px;background:#d88635}.pixels-left i:nth-child(4){top:43px;left:30px;width:3px;height:3px}.pixels-left i:nth-child(5){top:58px;left:17px;background:#3465a9}
.pixels-right i:nth-child(1){top:0;left:28px;width:8px;height:8px}.pixels-right i:nth-child(2){top:14px;left:8px;width:3px;height:3px;background:#d88635}.pixels-right i:nth-child(3){top:26px;left:39px;background:#396db8}.pixels-right i:nth-child(4){top:41px;left:20px;background:#d6b34c}.pixels-right i:nth-child(5){top:53px;left:48px;width:3px;height:3px;background:#cf4c4c}.pixels-right i:nth-child(6){top:65px;left:31px;background:#396db8}
.glass-nav { position: fixed; z-index: 10; right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); left: 16px; display: grid; max-width: 660px; grid-template-columns: repeat(5, 1fr); margin: auto; border: 1px solid rgba(236, 229, 203, .16); border-radius: 25px; padding: 7px; background: rgba(20, 23, 29, .68); box-shadow: inset 0 1px rgba(255, 255, 255, .10), 0 12px 35px rgba(0, 0, 0, .24); backdrop-filter: blur(22px) saturate(130%); transition: transform .24s ease, opacity .2s ease; }
.neo-shell:has(.ask-form input:focus) .glass-nav { opacity: 0; pointer-events: none; transform: translateY(calc(100% + 32px)); }
.nav-item { position: relative; display: flex; min-width: 0; min-height: 56px; align-items: center; justify-content: center; gap: 5px; border-radius: 18px; color: #a9adb4; text-decoration: none; font-size: .72rem; font-weight: 650; white-space: nowrap; }
.nav-item svg { width: 17px; height: 17px; }.nav-item.active { color: #dfbe5a; background: rgba(205, 166, 61, .13); }.nav-item.active:after { content:""; position:absolute; bottom:5px; width:4px; height:4px; border-radius:50%; background:#dfbe5a; }
.section-placeholder { display: flex; min-height: 100svh; flex-direction: column; padding: max(26px, env(safe-area-inset-top)) 24px calc(126px + env(safe-area-inset-bottom)); background: radial-gradient(ellipse at 50% -18%, #12161e 0%, #07090d 52%, #030814 100%); }.section-placeholder > div,.section-placeholder > section { width:min(100%,640px); margin:20vh auto 0; }.section-placeholder h1 { margin: 0; }.section-placeholder p:not(.eyebrow) { color:#969da8; }.search-messages { min-height:120px; margin:20px 0; text-align:left; }.search-messages p { max-width:85%; border-radius:14px; padding:10px 13px; }.search-messages .user { margin-left:auto; color:#f2e2aa; background:rgba(205,166,61,.12); }.search-messages .ai { color:#cbd2dd; background:rgba(255,255,255,.055); }
@media(max-width:520px) { .neo-home { padding-right: 18px; padding-left: 18px; }.neo-topbar { padding: 0 2px; }.home-hero { margin-top: 21vh; }.neo-n-logo { font-size: 7.5rem; width:104px; height:118px; }.glass-nav { right: 9px; left: 9px; border-radius: 22px; padding: 5px; }.nav-item { min-height: 58px; flex-direction: column; gap: 2px; font-size: .59rem; }.nav-item.active { border-radius: 16px; }.section-placeholder > div,.section-placeholder > section { margin-top: 16vh; } }
