*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Arial,Helvetica,sans-serif}button{font:inherit}
.aorta-login { position: relative; min-height: 100dvh; overflow: hidden; color: #f8eee6; background: radial-gradient(circle at 22% 28%, #21130f 0, #100b0a 40%, #090706 100%); }
.aorta-login::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 25% 34%, rgba(249,177,101,.24) 0, rgba(202,104,46,.11) 34%, transparent 65%); opacity: 0; transition: opacity 1.65s cubic-bezier(.2,.8,.2,1); }
.aorta-login.is-lit::after { opacity: 1; }
.aorta-login-brand { position:absolute; z-index:10; top:34px; left:42px; max-width:min(44vw,620px); color:rgba(255,245,237,.92); font:700 clamp(11px,.95vw,14px)/1.15 'Space Grotesk',sans-serif; letter-spacing:.075em; text-transform:uppercase; }
.aorta-developer-brand { display:flex; align-items:center; gap:6px; color:#95847c; font-size:13px; font-weight:600; letter-spacing:.015em; text-transform:none; }
.aorta-developer-brand img { width:76px; height:22px; object-fit:contain; }
.aorta-login-brand img { width: 132px; max-height: 46px; object-fit: contain; object-position: left; }
.aorta-lamp-stage { position: absolute; inset: 0 54% 0 0; min-height: 620px; }
.aorta-lamp-stage::after { content:''; position:absolute; z-index:2; left:50%; bottom:0; width:min(84vw,860px); height:30%; transform:translateX(-50%); border-radius:50%; background:radial-gradient(ellipse at 50% 58%,rgba(244,158,78,.36) 0,rgba(190,91,39,.18) 34%,rgba(126,53,24,.07) 60%,transparent 84%); filter:blur(18px); opacity:0; pointer-events:none; transition:opacity 1.8s .16s ease; }
.aorta-login.is-lit .aorta-lamp-stage::after { opacity:1; }
.aorta-light-beam { position: absolute; z-index: 1; top: calc(18% + clamp(110px,10vw,140px)); left: 50%; width: min(106vw,1100px); height: calc(82% - clamp(110px,10vw,140px)); transform: translateX(-50%); clip-path:polygon(42% 0,58% 0,100% 100%,0 100%); background:linear-gradient(180deg,rgba(255,179,95,.43),rgba(224,119,49,.21) 46%,rgba(164,72,30,.095) 76%,rgba(111,45,20,.04)); filter:blur(27px); -webkit-mask-image:radial-gradient(ellipse 76% 104% at 50% 12%,#000 0 36%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.34) 79%,transparent 100%); mask-image:radial-gradient(ellipse 76% 104% at 50% 12%,#000 0 36%,rgba(0,0,0,.82) 58%,rgba(0,0,0,.34) 79%,transparent 100%); opacity: 0; pointer-events:none; transition: opacity 1.7s .08s cubic-bezier(.2,.8,.2,1); }
.aorta-light-beam::before,.aorta-light-beam::after { content:none; }
.aorta-login.is-lit .aorta-light-beam { opacity: 1; }
.aorta-light-dust { position:absolute; z-index:2; top:34%; left:50%; width:min(64vw,680px); height:56%; transform:translateX(-50%); opacity:0; overflow:hidden; pointer-events:none; transition:opacity 1.5s .45s ease; -webkit-mask-image:radial-gradient(ellipse at center,#000 25%,rgba(0,0,0,.8) 58%,transparent 94%); mask-image:radial-gradient(ellipse at center,#000 25%,rgba(0,0,0,.8) 58%,transparent 94%); }
.aorta-login.is-lit .aorta-light-dust { opacity:.72; }
.aorta-light-dust i { position:absolute; left:var(--dust-x); top:var(--dust-y); width:var(--dust-size); height:var(--dust-size); border-radius:50%; background:rgba(255,210,143,.9); box-shadow:0 0 7px rgba(255,181,92,.75); animation:aortaDustFloat var(--dust-duration) var(--dust-delay) ease-in-out infinite; }
@keyframes aortaDustFloat { 0%{opacity:0;transform:translate3d(0,14px,0) scale(.55)} 18%{opacity:.85} 52%{opacity:.48;transform:translate3d(var(--dust-drift),-18px,0) scale(1)} 82%{opacity:.7} 100%{opacity:0;transform:translate3d(var(--dust-return),-48px,0) scale(.7)} }
.aorta-lamp-defs { position:absolute; width:0; height:0; overflow:hidden; }
.aorta-lamp-shade { position: absolute; z-index: 4; top: 18%; left: 50%; width: clamp(170px,15vw,215px); height: clamp(112px,10vw,142px); transform: translateX(-50%); clip-path: url(#aorta-rounded-shade); background: linear-gradient(90deg,#492718,#6b371f 48%,#3b2119); box-shadow: 0 13px 30px rgba(0,0,0,.42); transition: background 1.1s ease, filter 1.1s ease; }
.aorta-lamp-shade span { display:none; }
.aorta-login.is-lit .aorta-lamp-shade { background: linear-gradient(90deg,#b7602c,#ffd390 42%,#ca7136); filter: drop-shadow(0 7px 14px rgba(255,181,92,.38)) drop-shadow(0 0 34px rgba(240,142,62,.2)); }
.aorta-lamp-stem { position: absolute; z-index: 3; top: calc(18% + clamp(106px,9.5vw,136px)); bottom: 10.8%; left: 50%; width: 9px; transform: translateX(-50%); border-radius: 4px; background: linear-gradient(90deg,#6d5b47 0,#927653 4%,#55504a 10%,#2a2a2a 18%,#15191e 34%,#070a0f 72%,#1d1f23 92%,#443a2f 100%); box-shadow: inset 1px 0 rgba(255,220,161,.08), inset -1px 0 rgba(0,0,0,.58), 0 0 5px rgba(230,168,103,.045); }
.aorta-lamp-stem::after { content:''; position:absolute; top:42%; left:50%; width:21px; height:10px; transform:translateX(-50%); border-radius:3px; background:linear-gradient(90deg,#674421,#d7a85b 38%,#f0c878 55%,#805226); box-shadow:0 2px 4px rgba(0,0,0,.45),inset 0 1px rgba(255,232,177,.35); }
.aorta-lamp-base { position: absolute; z-index: 4; bottom: 8.8%; left: 50%; width: 112px; height: 25px; transform: translateX(-50%); border:3px solid #25262a; border-top-color:#756348; border-bottom-color:#07080a; border-radius: 50%; background: radial-gradient(ellipse at 45% 35%,#554b3d 0,#26282d 30%,#101319 58%,#050608 78%); box-shadow: inset 0 3px 5px rgba(255,214,145,.13), inset 0 -4px 7px rgba(0,0,0,.72), 0 5px 6px rgba(0,0,0,.65); }
.aorta-lamp-base::before { content:''; position:absolute; left:50%; top:-9px; width:30px; height:13px; transform:translateX(-50%); border-radius:50%; background:linear-gradient(90deg,#6d4825,#d5a65d 44%,#efc47a 58%,#72502f); box-shadow:0 3px 5px rgba(0,0,0,.48); }
.aorta-lamp-base::after { content:''; position:absolute; z-index:-1; left:50%; bottom:-15px; width:158px; height:25px; transform:translateX(-50%); border-radius:50%; background:radial-gradient(ellipse,rgba(0,0,0,.86) 0,rgba(0,0,0,.7) 42%,rgba(0,0,0,.2) 68%,transparent 78%); filter:blur(2px); }
.aorta-cord { --cord-pull: 0px; position: absolute; z-index: 3; top: calc(18% + clamp(104px,9.3vw,132px)); left: calc(50% + 35px); width: 30px; height: calc(102px + var(--cord-pull)); padding: 0; border: 0; background: transparent; transform-origin: 15px 0; touch-action: none; cursor: grab; transition:height .48s cubic-bezier(.22,1,.36,1); }
.aorta-cord.is-dragging { transition:none; }
.aorta-cord:active { cursor: grabbing; }
.aorta-cord:focus-visible { outline: 2px solid #e4bb57; outline-offset: 4px; border-radius: 8px; }
.aorta-cord-curve { position:absolute; inset:0; width:100%; height:100%; overflow:visible; filter:drop-shadow(0 0 2px rgba(246,193,119,.28)); }
.aorta-cord-curve path { fill:none; stroke:#cfa268; stroke-width:1.7; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.aorta-cord-handle { position:absolute; bottom:-1px; left:10px; width:10px; height:18px; border-radius:50%; background:linear-gradient(90deg,#8b562f,#e1ad68,#81502d); box-shadow:0 3px 8px rgba(0,0,0,.45); }
.aorta-lamp-stage.is-shaking .aorta-lamp-shade { animation: lampShadeShake .82s cubic-bezier(.22,.72,.24,1); transform-origin: 50% 12%; }
.aorta-lamp-stage.is-shaking .aorta-lamp-stem { animation: lampStemShake .82s cubic-bezier(.22,.72,.24,1); transform-origin: 50% 100%; }
@keyframes lampShadeShake { 0%{transform:translateX(-50%) rotate(0)} 18%{transform:translateX(calc(-50% + 4px)) rotate(1.15deg)} 38%{transform:translateX(calc(-50% - 3px)) rotate(-.8deg)} 58%{transform:translateX(calc(-50% + 2px)) rotate(.45deg)} 78%{transform:translateX(calc(-50% - 1px)) rotate(-.2deg)} 100%{transform:translateX(-50%) rotate(0)} }
@keyframes lampStemShake { 0%{transform:translateX(-50%) rotate(0)} 18%{transform:translateX(-50%) rotate(.3deg)} 38%{transform:translateX(-50%) rotate(-.2deg)} 62%{transform:translateX(-50%) rotate(.1deg)} 100%{transform:translateX(-50%) rotate(0)} }
.aorta-pull-hint { position: absolute; z-index: 8; top: 43%; left: calc(50% + 73px); margin: 0; white-space: nowrap; color: rgba(213,181,159,.42); font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.aorta-login-panel { position: absolute; z-index: 9; top: 50%; right: clamp(30px,7vw,120px); width: min(42vw,560px); max-height: calc(100dvh - 80px); overflow: auto; transform: translateY(calc(-50% + 24px)); padding: clamp(28px,4vw,56px); border: 1px solid rgba(236,151,79,.2); border-radius: 30px; background: rgba(20,14,12,.78); box-shadow: 0 34px 100px rgba(0,0,0,.35); backdrop-filter: blur(18px); opacity: 0; pointer-events: none; transition: opacity 1s .35s ease, transform 1.1s .35s cubic-bezier(.2,.8,.2,1); }
.aorta-login.is-lit .aorta-login-panel { opacity: 1; pointer-events: auto; transform: translateY(-50%); }
.aorta-login-eyebrow { margin: 0 0 18px; color: #ee9850; font-size: 12px; font-weight: 700; letter-spacing: .21em; text-transform: uppercase; }
.aorta-login-panel h1 { display:grid; margin:0; color:#fff7ef; font:600 clamp(48px,5.4vw,76px)/.92 'Space Grotesk',sans-serif; letter-spacing:-.06em; }
.aorta-login-panel h1 span,.aorta-login-panel h1 em { display:block; }
.aorta-login-panel h1 em { margin-top:5px; color:#d49054; font:italic 500 clamp(40px,4.6vw,66px)/1.02 Georgia,'Times New Roman',serif; letter-spacing:-.055em; }
.aorta-login-copy { max-width: 480px; margin: 28px 0 30px; color: #aa9b94; font-size: 16px; line-height: 1.65; }
.aorta-login-form { display: grid; gap: 18px; }
.aorta-login-form label { display: grid; gap: 9px; color: #d8ccc5; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.aorta-login-form input { height: 54px; border: 1px solid #433732; border-radius: 13px; outline: 0; background: rgba(12,9,8,.7); padding: 0 17px; color: #fff7ef; font-size: 15px; font-weight: 500; text-transform: none; letter-spacing: 0; transition: border-color .25s ease, box-shadow .25s ease; }
.aorta-login-form input:focus { border-color: #d97b34; box-shadow: 0 0 0 3px rgba(217,123,52,.12); }
.aorta-login-form button { display: flex; height: 56px; align-items: center; justify-content: center; gap: 9px; margin-top: 5px; border: 0; border-radius: 13px; background: linear-gradient(90deg,#eca252,#db712b); color: #1a0f0a; font-size: 16px; font-weight: 800; box-shadow: 0 12px 26px rgba(218,111,39,.18); cursor: pointer; }
.aorta-login-form button:disabled { opacity: .65; cursor: not-allowed; }
.aorta-login-error { display: flex; align-items: flex-start; gap: 8px; border: 1px solid rgba(248,113,113,.25); border-radius: 10px; background: rgba(127,29,29,.18); padding: 10px; color: #fca5a5; font-size: 12px; font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  .aorta-light-dust i { animation: none; opacity: .72; }
  .aorta-lamp-stage.is-shaking .aorta-lamp-shade,
  .aorta-lamp-stage.is-shaking .aorta-lamp-stem { animation: none; }
  .aorta-cord { transition: none; }
}


.aorta-login{min-height:100svh}.aorta-login-panel{overflow:visible}.aorta-login-panel h1{font-size:clamp(44px,5vw,76px)}.aorta-login-panel h1 em{font-size:clamp(38px,4.4vw,65px)}.aorta-login-copy{margin-bottom:18px}.contact{color:#efaa73;text-decoration:none;border-bottom:1px solid #80543a;padding-bottom:3px}.contact:hover{color:#ffe0b5}.aorta-login-brand{font-size:17px;letter-spacing:.16em}.footer{position:absolute;bottom:22px;right:36px;color:#8e7b70;font-size:12px;z-index:10}.aorta-login-panel{visibility:hidden}.aorta-login.is-lit .aorta-login-panel{visibility:visible}.aorta-cord{z-index:3}/* Cord starts behind the lampshade, but its hanging section remains interactive. */
@media(max-width:900px){.aorta-login{min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:20px 16px 48px;overflow:hidden}.aorta-login-brand{position:relative;top:auto;left:auto;align-self:flex-start;margin-bottom:0}.aorta-lamp-stage{position:relative;inset:auto;min-height:0;height:50svh;max-height:460px;width:100%;opacity:1}.aorta-lamp-shade{top:8%}.aorta-lamp-stem{top:calc(8% + clamp(106px,9.5vw,136px));bottom:5%}.aorta-lamp-base{bottom:3%}.aorta-cord{top:calc(8% + clamp(104px,9.3vw,132px))}.aorta-light-beam{top:calc(8% + clamp(110px,10vw,140px));height:85%}.aorta-pull-hint{top:40%}.aorta-login-panel{position:relative;top:auto;right:auto;transform:translateY(20px);width:min(100%,500px);padding:26px 25px;margin-top:0;max-height:none}.aorta-login.is-lit .aorta-login-panel{transform:translateY(0)}.footer{position:relative;bottom:auto;right:auto;margin-top:24px;text-align:center}}
@media(max-height:650px) and (min-width:901px){.aorta-lamp-stage{min-height:520px}.aorta-login-panel{padding:25px}.aorta-login-panel h1{font-size:45px}}

/* AORTAX copper accent: only the X */
.aortax-copper-x { color: #C8753D !important; -webkit-text-fill-color: #C8753D !important; }

/* Preserve left-to-right AORTAX lettering in every browser and locale. */
.aortax-wordmark { direction:ltr !important; unicode-bidi:isolate; white-space:nowrap; text-align:left; }
.aortax-wordmark .aortax-copper-x { display:inline; }