/* Ported directly from CK3D AuthPreview.css; only React-only states are omitted. */
:root { --auth-emerald:#16a56f; --auth-emerald-bright:#42d69a; --auth-ink:#07120f; --auth-panel:rgba(10,25,21,.9); --auth-border:rgba(132,204,178,.16); --auth-muted:#91a9a0; }
.ck-auth-page,.ck-auth-page * { box-sizing:border-box; }
.ck-auth-page { position:relative; isolation:isolate; display:grid; width:100%; min-height:100dvh; grid-template-columns:minmax(0,1.08fr) minmax(410px,.92fr); overflow-x:hidden; color:#edf8f3; background:radial-gradient(ellipse 62% 68% at 17% 22%,rgba(25,156,101,.34),transparent 71%),radial-gradient(ellipse 38% 46% at 43% 78%,rgba(13,102,69,.24),transparent 76%),linear-gradient(137deg,#06130e 0%,#0a261b 52%,#06120e 100%); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
.ck-auth-ambient { position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.78; background:radial-gradient(ellipse at 72% 45%,rgba(33,155,98,.22),transparent 60%); }
.ck-auth-ambient::before,.ck-auth-ambient::after { position:absolute; width:min(42vw,620px); aspect-ratio:1; border:1px solid rgba(116,231,177,.30); background:linear-gradient(30deg,transparent 49.7%,rgba(108,231,178,.26) 50%,transparent 50.3%),linear-gradient(150deg,transparent 49.7%,rgba(108,231,178,.26) 50%,transparent 50.3%); content:""; transform:perspective(850px) rotateX(59deg) rotateZ(30deg) skewY(-8deg); animation:ck-auth-plane-float 16s ease-in-out infinite alternate; }
.ck-auth-ambient::before { top:8vh; left:-8vw; }.ck-auth-ambient::after { right:-10vw; bottom:-22vw; left:auto; opacity:.72; animation-delay:-7s; }
.ck-auth-geometry { position:absolute; inset:5vh 2vw 7vh; perspective:1100px; transform-style:preserve-3d; }
.ck-auth-geometry i { position:absolute; top:var(--ck-geo-y); left:var(--ck-geo-x); display:block; width:var(--ck-geo-size); aspect-ratio:1.35; border:.75px solid rgba(119,238,184,.42); background:transparent; box-shadow:0 0 20px rgba(35,173,111,.045); opacity:var(--ck-geo-opacity); transform:rotateX(58deg) rotateZ(var(--ck-geo-rotation)); transform-style:preserve-3d; animation:ck-auth-wire-cluster var(--ck-geo-duration) var(--ck-geo-delay) ease-in-out infinite alternate; }
.ck-auth-geometry i::before,.ck-auth-geometry i::after { position:absolute; inset:18%; border:.75px solid rgba(106,238,180,.34); background:transparent; content:""; transform:translateZ(var(--ck-geo-depth)) rotateZ(45deg); }.ck-auth-geometry i::after { inset:31%; border-color:rgba(77,213,151,.25); transform:translateZ(var(--ck-geo-depth-negative)) rotateZ(-45deg); }
.ck-auth-brand { display:flex; min-width:0; padding:clamp(34px,5vw,78px); flex-direction:column; justify-content:space-between; animation:ck-auth-enter .55s cubic-bezier(.2,.8,.2,1) both; }
.ck-auth-brand-lockup { display:flex; align-items:center; gap:16px; }.ck-auth-logo { width:82px; height:82px; border-radius:16px; object-fit:contain; background:transparent; }.ck-auth-brand-lockup strong { display:block; font-size:18px; letter-spacing:.115em; }.ck-auth-brand-lockup span { display:block; margin-top:5px; color:#7fd6b4; font-size:12px; font-weight:750; letter-spacing:.21em; }.ck-auth-brand-copy { max-width:780px; padding:7vh 0; }.ck-auth-brand-copy--minimal { padding:7vh 0; }.ck-auth-product { color:#75d9b1; font-size:11px; font-weight:800; letter-spacing:.2em; }
.ck-auth-panel { display:grid; min-width:0; padding:clamp(22px,5vw,72px); place-items:center; }.ck-auth-card { display:flex; width:min(100%,460px); min-width:0; min-height:520px; padding:clamp(28px,4vw,44px); flex-direction:column; justify-content:center; border:1px solid var(--auth-border); border-radius:24px; background:linear-gradient(160deg,rgba(18,42,34,.88),var(--auth-panel)); box-shadow:0 34px 80px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.035); backdrop-filter:blur(12px); animation:ck-auth-card-enter .58s .08s cubic-bezier(.2,.8,.2,1) both; }.ck-auth-card footer { margin-top:auto; padding-top:34px; color:#657c73; font-size:9px; font-weight:800; letter-spacing:.13em; text-align:center; }
.ck-auth-heading { margin-bottom:28px; }.ck-auth-heading>span { display:block; margin-bottom:10px; color:#66d4a8; font-size:10px; font-weight:800; letter-spacing:.18em; }.ck-auth-heading h2 { margin:0; color:#f1faf6; font-size:clamp(25px,3vw,32px); line-height:1.12; letter-spacing:-.035em; }
.ck-auth-form { display:grid; gap:17px; }.ck-auth-field { display:grid; min-width:0; gap:8px; }.ck-auth-label { color:#b9cbc4; font-size:11px; font-weight:750; letter-spacing:.04em; }.ck-auth-input { display:flex; min-width:0; height:48px; align-items:center; gap:11px; padding:0 14px; border:1px solid rgba(150,195,178,.18); border-radius:11px; background:rgba(3,13,10,.48); transition:border-color .18s ease,box-shadow .18s ease,background .18s ease; }.ck-auth-input:focus-within { border-color:rgba(62,207,147,.72); background:rgba(5,19,15,.72); box-shadow:0 0 0 3px rgba(30,177,119,.13); }.ck-auth-input i { display:grid; color:#6c9384; }.ck-auth-input i svg { width:17px; height:17px; }.ck-auth-input input { min-width:0; flex:1; border:0; outline:0; color:#eef8f4; background:transparent; font:inherit; font-size:14px; }.ck-auth-input input::placeholder { color:#61766e; }
.ck-auth-field-action { display:grid; width:28px; height:28px; place-items:center; border:0; border-radius:7px; color:#78978b; background:transparent; cursor:pointer; }.ck-auth-field-action:hover { color:#b9d2c8; background:rgba(255,255,255,.05); }.ck-auth-field-action:focus-visible,.ck-auth-primary:focus-visible,.ck-auth-secondary:focus-visible { outline:2px solid #63dbac; outline-offset:3px; }
.ck-auth-primary,.ck-auth-secondary { display:flex; width:100%; min-height:46px; align-items:center; justify-content:center; gap:9px; border-radius:11px; font:inherit; font-size:13px; font-weight:750; cursor:pointer; transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease; }.ck-auth-primary { margin-top:4px; border:1px solid #36bd87; color:#f5fffb; background:linear-gradient(180deg,#18a66f,#0b7e52); box-shadow:0 12px 28px rgba(10,115,75,.25); }.ck-auth-primary:hover:not(:disabled) { background:linear-gradient(180deg,#20b77b,#0c8959); box-shadow:0 15px 34px rgba(10,130,83,.3); transform:translateY(-1px); }.ck-auth-secondary { margin-top:10px; border:1px solid rgba(151,191,176,.15); color:#a8beb5; background:rgba(255,255,255,.025); }.ck-auth-secondary:hover:not(:disabled) { border-color:rgba(102,207,165,.35); color:#d5e9e1; background:rgba(73,159,124,.07); }button:disabled { cursor:not-allowed; opacity:.52; }.ck-auth-provider-note { min-height:18px; margin:9px 0 0; color:#8da59c; font-size:11.5px; line-height:1.5; text-align:center; }
.ck-auth-error,.ck-auth-inline-note { margin-top:14px; padding:11px 13px; border-radius:9px; font-size:11.5px; line-height:1.5; }.ck-auth-error { border:1px solid rgba(248,113,113,.22); color:#f1aaaa; background:rgba(127,29,29,.13); }.ck-auth-error:not(.is-error) { border-color:rgba(83,190,146,.18); color:#9bc7b6; background:rgba(20,108,75,.11); }.ck-auth-inline-note { border:1px solid rgba(83,190,146,.18); color:#9bc7b6; background:rgba(20,108,75,.11); }.ck-auth-inline-note strong { display:block; }.ck-auth-inline-note code { display:block; margin-top:7px; overflow-wrap:anywhere; color:#d3f0e2; font-size:13px; user-select:all; }
.ck-auth-spinner { width:16px; height:16px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%; animation:ck-auth-spin .8s linear infinite; }@keyframes ck-auth-spin { to { transform:rotate(360deg); } }@keyframes ck-auth-enter { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }@keyframes ck-auth-card-enter { from { opacity:0; transform:translateY(14px) scale(.992); } to { opacity:1; transform:translateY(0) scale(1); } }@keyframes ck-auth-plane-float { from { transform:perspective(850px) rotateX(55deg) rotateZ(22deg) translate3d(0,0,0); } to { transform:perspective(850px) rotateX(64deg) rotateZ(38deg) translate3d(18px,-14px,0); } }@keyframes ck-auth-wire-cluster { from { transform:rotateX(52deg) rotateZ(var(--ck-geo-rotation)) translate3d(0,0,0); } to { transform:rotateX(66deg) rotateZ(calc(var(--ck-geo-rotation) + 18deg)) translate3d(var(--ck-geo-dx),var(--ck-geo-dy),var(--ck-geo-depth)); } }
@media (max-width:920px) { .ck-auth-page { grid-template-columns:1fr; }.ck-auth-brand { padding:28px clamp(20px,6vw,54px) 20px; border-bottom:1px solid rgba(133,210,181,.08); }.ck-auth-panel { padding:28px 20px 46px; place-items:start center; }.ck-auth-card { min-height:auto; } }
@media (max-width:520px) { .ck-auth-brand { padding:22px 18px 16px; }.ck-auth-logo { width:44px; height:44px; border-radius:11px; }.ck-auth-panel { padding:18px 12px 32px; }.ck-auth-card { padding:27px 20px; border-radius:18px; } }
@media (max-height:760px) and (min-width:921px) { .ck-auth-brand { padding-top:30px; padding-bottom:30px; }.ck-auth-card { min-height:0; max-height:calc(100dvh - 36px); overflow-y:auto; padding-top:28px; padding-bottom:28px; } }
@media (prefers-reduced-motion:reduce) { .ck-auth-brand,.ck-auth-card,.ck-auth-spinner { animation-duration:.001ms !important; animation-iteration-count:1 !important; }.ck-auth-page * { scroll-behavior:auto !important; transition-duration:.001ms !important; }.ck-auth-ambient::before,.ck-auth-ambient::after,.ck-auth-geometry,.ck-auth-geometry i { animation:none !important; } }
