@font-face { font-family:Inter; src:url('/javax.faces.resource/fonts/inter/inter-latin.woff2.xhtml') format('woff2'); font-weight:100 900; font-display:swap }
.designer-login {
  margin:0; --bg:#0a0a0f; --card:#13131a; --field:#0d0d13; --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.16); --ink:#f2f2f5;
  --muted:#9a9aa8; --faint:#5f5f6c; --yellow:#ffd100; --danger:#f87171; --danger-text:#fca5a5; --ok:#86efac; --ease:cubic-bezier(.2,.8,.2,1);
  --pw:min(27vw,50vh); --ph:calc(var(--pw) * .68); --gap:calc(var(--pw) * .135);
  background:var(--bg); color:var(--ink); font:400 15px/1.5 Inter,system-ui,sans-serif; -webkit-font-smoothing:antialiased;
}
.designer-login * { box-sizing:border-box; margin:0 }
html:has(.designer-login), .designer-login { overflow-x:clip }
.designer-login button, .designer-login input { font:inherit; color:inherit }
.designer-login button { cursor:pointer; background:none; border:0 }
.designer-login .atmos {
  position:fixed; inset:0; pointer-events:none; z-index:0;
  background: radial-gradient(60vw 50vh at 34% 82%,rgba(255,209,0,.10),transparent 70%), radial-gradient(50vw 40vh at 8% 0%,rgba(160,170,255,.05),transparent 70%);
}
.designer-login .atmos:before {
  content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px); background-size:26px 26px;
  -webkit-mask-image:radial-gradient(70% 70% at 34% 55%,#000 10%,transparent 75%);
  mask-image:radial-gradient(70% 70% at 34% 55%,#000 10%,transparent 75%);
}
.designer-login .atmos:after {
  content:""; position:absolute; inset:-50%; opacity:.09; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.designer-login .page {
  position:relative; z-index:1; min-height:100vh; display:grid; grid-template-rows:auto 1fr auto; padding:0 clamp(20px,3.6vw,56px);
}
.designer-login .header, .designer-login .footer { display:flex; align-items:center; justify-content:space-between }
.designer-login .header { height:76px }
.designer-login .brand { display:flex; align-items:center; gap:14px }
.designer-login .brand img { height:30px; display:block }
.designer-login .brand .product {
  padding-left:14px; border-left:1px solid var(--line-2); font:500 13px/1 Inter; color:var(--muted); letter-spacing:.01em;
}
.designer-login .help {
  display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--muted); padding:8px 10px; margin-right:-10px; border-radius:10px;
  transition:color .2s,background .2s;
}
.designer-login .help:hover { color:var(--ink); background:rgba(255,255,255,.04) }
.designer-login .help svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round }
.designer-login .footer { height:56px; font-size:12.5px; color:var(--faint) }
.designer-login .footer a { color:var(--faint); text-decoration:none }
.designer-login .footer a:hover { color:var(--muted) }
.designer-login .main { display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:clamp(24px,4vw,72px); align-items:stretch; padding:8px 0 16px }
.designer-login .story { display:flex; flex-direction:column; min-height:0; padding-top:clamp(8px,3vh,36px) }
.designer-login h1 { font:600 clamp(40px,4.6vw,68px)/.98 Inter,sans-serif; letter-spacing:-.04em }
.designer-login h1 span { color:#5d5d6b }
.designer-login .lede { margin-top:18px; max-width:600px; font-size:16.5px; line-height:1.55; color:var(--muted) }
.designer-login .lede b { color:var(--ink); font-weight:500 }
.designer-login .scene { position:relative; flex:1; min-height:300px; margin-top:12px }
.designer-login .rig {
  position:absolute; left:0; top:0; width:var(--pw); height:var(--ph); transform-origin:0 0; animation:float 9s ease-in-out infinite; opacity:0;
  transition:opacity .6s;
}
.designer-login .rig.ready { opacity:1 }
@keyframes float {
  50% { translate:0 -10px }
}
.designer-login .glow {
  position:absolute; left:50%; top:62%; width:calc(var(--pw) * 2); height:calc(var(--pw) * .9); transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(255,209,0,.26),rgba(255,209,0,.07) 55%,transparent); filter:blur(18px);
  transition:opacity 1s,transform 1s;
}
.designer-login .floor {
  position:absolute; left:50%; top:78%; width:calc(var(--pw) * 1.5); height:calc(var(--pw) * .26); transform:translate(-50%,-50%);
  background:radial-gradient(closest-side,rgba(0,0,0,.7),transparent); filter:blur(10px);
}
.designer-login .stage { position:absolute; inset:0; perspective:2200px; perspective-origin:50% 10% }
.designer-login .stack { position:absolute; inset:0; transform-style:preserve-3d; transform:rotateX(57deg) rotateZ(-40deg) }
.designer-login .plate {
  --lift:0px; position:absolute; inset:0; border-radius:calc(var(--pw) * .045); transform-style:preserve-3d;
  transform:translateZ(calc(var(--i) * var(--gap) + var(--lift))); transition:transform 1s var(--ease),box-shadow .5s,background .5s;
  background:linear-gradient(140deg,#24242f,#16161e 70%); box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 30px 60px -20px rgba(0,0,0,.6);
  font-size:calc(var(--pw) / 27); color:#cfcfd8; transition-delay:calc(var(--i) * 40ms);
}
.designer-login .plate:before {
  content:""; position:absolute; inset:0; border-radius:inherit; transform:translateZ(-6px); background:#060609;
  box-shadow:0 0 0 1px rgba(255,255,255,.035);
}
.designer-login .plate.above { --lift:calc(var(--gap) * 1.9) }
.designer-login .plate.ui { background:linear-gradient(140deg,#f7f7f9,#e7e7ec); color:#2a2a35 }
.designer-login .plate .c { position:absolute; inset:0; padding:1.05em 1.15em; transition:opacity .35s,filter .35s }
.designer-login .plate .c.swap { opacity:0; filter:blur(3px) }
.designer-login .plate i.a { position:absolute; width:0; height:0 }
.designer-login .t { font-weight:600; font-size:1em; color:#ececf2; margin:.55em 0 .6em }
.designer-login .ui .t { color:#16161d }
.designer-login .roles { display:grid; gap:.42em }
.designer-login .role {
  display:flex; align-items:center; justify-content:space-between; padding:.42em .6em; border-radius:.45em; background:rgba(255,255,255,.04);
  font-size:.82em;
}
.designer-login .perm { display:flex; gap:.3em }
.designer-login .perm b { width:.75em; height:.75em; border-radius:.2em; border:1px solid #4a4a57 }
.designer-login .perm b.y { background:#d9d9e2; border-color:#d9d9e2 }
.designer-login .tbl { display:grid; font-size:.74em; border-radius:.45em; overflow:hidden; background:rgba(255,255,255,.03) }
.designer-login .tbl div { display:grid; grid-template-columns:1.1fr 1fr .8fr; padding:.42em .65em; border-top:1px solid rgba(255,255,255,.05) }
.designer-login .tbl div:first-child {
  border-top:0; color:#6d6d7b; font:500 .8em/1.4 ui-monospace, SFMono-Regular, Consolas, monospace; text-transform:uppercase; letter-spacing:.06em;
}
.designer-login .flow { display:flex; align-items:center; margin-top:1.3em }
.designer-login .node {
  flex:1; padding:.6em .45em; border-radius:.5em; background:rgba(255,255,255,.05); font-size:.74em; text-align:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.designer-login .node.cur { background:#ececf2; color:#121218; font-weight:600 }
.designer-login .flow em { width:1.3em; height:1px; background:#4a4a57; flex:none }
.designer-login .conns { display:grid; gap:.42em }
.designer-login .conn {
  display:flex; justify-content:space-between; align-items:center; padding:.45em .6em; border-radius:.45em; background:rgba(255,255,255,.04);
  font-size:.8em;
}
.designer-login .conn span:last-child { color:var(--ok); font-size:.85em }
.designer-login .fields { display:grid; gap:.48em }
.designer-login .fld { font-size:.72em }
.designer-login .fld span { display:block; color:#71717d; margin-bottom:.2em }
.designer-login .fld div {
  height:1.9em; border-radius:.4em; background:#fff; box-shadow:inset 0 0 0 1px #d6d6de; padding:0 .6em; display:flex; align-items:center;
  color:#2a2a35;
}
.designer-login .btn-m {
  margin-top:.75em; height:2em; border-radius:.45em; background:#16161d; color:#fff; font-size:.72em; font-weight:600; display:flex;
  align-items:center; justify-content:center;
}
.designer-login .buzz { display:flex; gap:.65em; margin-top:.9em }
.designer-login .av {
  flex:none; width:2em; height:2em; border-radius:50%; background:var(--yellow); color:#16161d; font-weight:700; font-size:.8em; display:grid;
  place-items:center;
}
.designer-login .msg {
  padding:.6em .75em; border-radius:.2em .7em .7em .7em; background:rgba(255,255,255,.06); font-size:.84em; line-height:1.4; color:#e4e4ea;
}
.designer-login .done { margin-top:.55em; font-size:.68em; color:#6d6d7b; padding-left:2.9em }
.designer-login .labels { position:absolute; inset:0; pointer-events:none }
.designer-login .lab {
  position:absolute; left:0; top:0; display:flex; align-items:flex-end; gap:12px;
  transform:translate(var(--x),calc(var(--y) + 22px)) translateY(-100%); transition:opacity .4s;
}
.designer-login .lab>span:last-child { display:flex; flex-direction:column-reverse }
.designer-login .lab:before {
  content:""; position:absolute; right:100%; bottom:11px; width:var(--lead,40px); height:1px; margin-right:10px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.18));
}
.designer-login .lab .n { font:500 12px/1.75 ui-monospace, SFMono-Regular, Consolas, monospace; color:var(--faint); transition:color .3s }
.designer-login .lab .nm { font:500 16px/1.4 Inter; color:var(--muted); transition:color .3s }
.designer-login .lab .ds {
  font-size:13.5px; color:var(--faint); max-height:0; opacity:0; overflow:hidden; transition:max-height .4s,opacity .4s; white-space:nowrap;
}
.designer-login .lab.on .n { color:var(--yellow) }
.designer-login .lab.on .nm { color:var(--ink) }
.designer-login .lab.on .ds { max-height:22px; opacity:1 }
.designer-login .lab.on:before { background:linear-gradient(90deg,transparent,rgba(255,209,0,.6)) }
.designer-login .caption { position:absolute; left:0; bottom:4px; display:flex; align-items:baseline; gap:14px; font-size:14px }
.designer-login .caption .lbl {
  font:500 11px/1 ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing:.12em; color:var(--faint); text-transform:uppercase;
}
.designer-login .caption .app { color:var(--ink); font-weight:500; transition:opacity .3s,transform .3s }
.designer-login .caption .app.swap { opacity:0; transform:translateY(4px) }
.designer-login .caption .ticks { display:flex; gap:6px; margin-left:4px; align-self:center }
.designer-login .caption .ticks i { width:14px; height:2px; border-radius:2px; background:rgba(255,255,255,.14); transition:background .3s,width .3s }
.designer-login .caption .ticks i.on { background:var(--ink); width:22px }
.designer-login.assembled .stack { --gap:calc(var(--pw) * .018) }
.designer-login.assembled .lab { opacity:0 }
.designer-login.assembled .glow { opacity:1.4; transform:translate(-50%,-50%) scale(1.15) }
.designer-login .plate.on { box-shadow:inset 0 0 0 1px rgba(255,209,0,.9),0 0 50px -4px rgba(255,209,0,.5) }
.designer-login .signin { display:flex; align-items:center; justify-content:center }
.designer-login .card {
  position:relative; width:100%; padding:40px 38px 32px; border-radius:22px; background:var(--card);
  box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.06),0 40px 80px -30px rgba(0,0,0,.8);
}
.designer-login .card h2 { font:600 30px/1.1 Inter,sans-serif; letter-spacing:-.03em }
.designer-login .card .sub { margin-top:8px; color:var(--muted); font-size:15px }
.designer-login form { margin-top:30px; display:grid; gap:18px }
.designer-login .field label, .designer-login .label-row {
  display:flex; justify-content:space-between; align-items:baseline; font-size:13.5px; font-weight:500; color:#d7d7de; margin-bottom:8px;
}
.designer-login .form-err {
  display:flex; align-items:flex-start; gap:9px; font-size:13.5px; color:var(--danger-text); line-height:1.45; overflow-wrap:anywhere;
}
.designer-login .note { margin-top:26px; padding-top:22px; border-top:1px solid var(--line); font-size:13.5px; color:var(--faint); text-align:center }
@media (max-height:780px) and (min-width:961px) {
  .designer-login .header { height:64px }
  .designer-login .footer { height:44px }
  .designer-login h1 { font-size:clamp(38px,4vw,52px) }
  .designer-login .lede { margin-top:12px; font-size:15.5px }
  .designer-login .card { padding:32px 32px 26px }
  .designer-login form { margin-top:24px; gap:15px }
  .designer-login .note { margin-top:20px; padding-top:18px }
}
@media (max-width:960px) {
  .designer-login { --pw:min(64vw,290px) }
  .designer-login .main { grid-template-columns:1fr; gap:8px }
  .designer-login .story { padding-top:0 }
  .designer-login h1 { font-size:clamp(34px,8.5vw,48px); order:2 }
  .designer-login .lede { order:3; font-size:15px; margin-top:10px }
  .designer-login .scene { order:1; flex:none; height:calc(var(--pw) * 1.35); min-height:0; margin:0 -20px 18px; overflow:hidden }
  .designer-login .labels { display:none }
  .designer-login .caption { left:50%; transform:translateX(-50%); bottom:0; white-space:nowrap }
  .designer-login .caption .ticks { display:none }
  .designer-login .signin { padding:20px 0 8px }
  .designer-login .card { padding:30px 22px 24px; border-radius:20px }
  .designer-login .input-field.ui-inputfield { font-size:16px }
  .designer-login .login-dialog .ui-dialog-titlebar { padding:30px 22px 0 }
  .designer-login .login-dialog .ui-dialog-content { padding:10px 22px 24px }
}
@media (max-width:420px) {
  .designer-login .help span { display:none }
  .designer-login .brand img { height:26px }
}
@media (prefers-reduced-motion:reduce) {
  .designer-login .rig { animation:none }
  .designer-login .plate, .designer-login .plate .c, .designer-login .glow, .designer-login .lab { transition:none!important }
  .designer-login .primary.is-busy:after, .designer-login .waiting-spinner { animation:none }
}
/* PrimeFaces adapters. */
.designer-login .ui-widget { font-family:Inter,system-ui,sans-serif; font-size:inherit }
.designer-login [hidden] { display:none!important }
.designer-login .label-row label { margin:0 }
.designer-login .ui-outputlabel-rfi { display:none }
.designer-login .label-row .ui-commandlink { font-size:13px; font-weight:400; color:var(--muted); text-decoration:none }
.designer-login .label-row .ui-commandlink:hover { color:var(--ink) }
.designer-login .input-field.ui-inputfield {
  display:block; width:100%; height:48px; padding:0 15px; border:1px solid var(--line-2)!important; border-radius:12px;
  background:var(--field)!important; color:var(--ink)!important; font:400 15px Inter,system-ui,sans-serif; box-shadow:none!important; outline:none;
  text-shadow:none;
}
.designer-login .input-field.ui-inputfield:hover { border-color:rgba(255,255,255,.24)!important }
.designer-login .input-field.ui-inputfield:focus {
  border-color:rgba(255,255,255,.38)!important; box-shadow:0 0 0 3px rgba(255,255,255,.04)!important; outline:none;
}
.designer-login .input-field.ui-inputfield.ui-state-error { border-color:var(--danger)!important }
.designer-login .ui-password { display:block; position:relative; width:100% }
.designer-login .password-wrap input { padding-right:48px!important }
.designer-login .ui-password .ui-password-icon { color:var(--faint)!important; cursor:pointer; right:15px }
.designer-login .ui-message-error {
  display:flex; align-items:flex-start; gap:8px; margin:8px 0 0!important; padding:0!important; border:0!important; background:none!important;
  color:var(--danger-text)!important; font-size:13px; line-height:1.45; box-shadow:none!important;
}
.designer-login .ui-message:empty { display:none }
.designer-login .ui-message-error-detail { margin:0 }
.designer-login .ui-message-error-icon { display:none }
.designer-login .form-err:before, .designer-login .ui-message-error:before {
  content:'!'; border:1px solid currentColor; border-radius:50%; width:15px; height:15px; flex:none; text-align:center; font-size:11px;
  line-height:13px; margin-top:2px;
}
.designer-login .login-messages:not(:has(.form-err)) { display:none }
.designer-login .primary.ui-button {
  display:flex; align-items:center; justify-content:center; gap:9px; width:100%; height:50px; margin-top:6px; border:0!important;
  border-radius:12px; background:#f4f4f6!important; color:#0b0b10!important; font:600 15px Inter,system-ui,sans-serif; text-shadow:none;
  box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 10px 30px -12px rgba(255,255,255,.35); transition:transform .15s,background .2s,box-shadow .2s;
}
.designer-login .primary.ui-button:hover {
  background:#fff!important; box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 14px 36px -12px rgba(255,255,255,.45);
}
.designer-login .primary:active { transform:translateY(1px) }
.designer-login .primary .ui-button-text { padding:0!important; font-weight:600 }
.designer-login .primary:after { content:'\2192'; font-size:18px; line-height:1; transition:transform .2s }
.designer-login .primary:hover:after { transform:translateX(3px) }
.designer-login .primary.is-busy { cursor:wait }
.designer-login .primary.is-busy:after {
  content:''; width:16px; height:16px; border:2px solid #0b0b1033; border-top-color:#0b0b10; border-radius:50%; animation:spin .7s linear infinite;
}
.designer-login [inert] input { opacity:.55 }
.designer-login :is(button, a):focus-visible { outline:2px solid rgba(255,255,255,.5); outline-offset:3px }
.designer-login .login-dialog.ui-dialog {
  width:420px; max-width:calc(100vw - 40px)!important; background:#13131a!important; border:0!important; border-radius:22px!important;
  color:var(--ink); box-shadow:inset 0 0 0 1px var(--line),0 40px 80px -30px #000c!important;
}
.designer-login .login-dialog .ui-dialog-titlebar { padding:36px 38px 0; background:transparent!important; border:0; color:var(--ink) }
.designer-login .login-dialog .ui-dialog-title { font:600 22px/1.2 Inter,system-ui,sans-serif; letter-spacing:-.02em; margin:0 }
.designer-login .login-dialog .ui-dialog-titlebar-close {
  position:absolute; top:14px; right:14px; margin:0; padding:8px; border:0; background:transparent; box-shadow:none; color:var(--faint);
}
.designer-login .login-dialog .ui-dialog-content { padding:10px 38px 32px; background:transparent; color:var(--ink) }
.designer-login .dialog-copy { color:var(--muted); font-size:14.5px; line-height:1.5 }
.designer-login .login-dialog form { margin-top:10px; display:block }
.designer-login .login-dialog .field { margin:20px 0 18px }
.designer-login .login-dialog .form-err { margin:12px 0 }
.designer-login .secondary {
  display:block; width:100%; height:46px; border-radius:12px; box-shadow:inset 0 0 0 1px var(--line-2); font-size:14.5px; font-weight:500;
  color:#d7d7de; margin-top:22px;
}
.designer-login .secondary:hover { background:rgba(255,255,255,.04) }
.designer-login .dialog-back { margin-top:10px }
.designer-login .success { color:#d7d7de; font-size:14px; margin:14px 0 }
.designer-login .ui-widget-overlay { background:rgba(4,4,7,.72); opacity:1 }
.designer-login .login-waiting .ui-dialog-content { display:flex; align-items:center; gap:12px; padding:24px 28px }
.designer-login .waiting-spinner {
  width:18px; height:18px; border:2px solid #ffffff30; border-top-color:var(--ink); border-radius:50%; animation:spin .7s linear infinite;
}
@keyframes spin {
  to { transform:rotate(360deg) }
}
/* Subscription-ended fix (2026-10-22): the dialog's contact action, styled like the primary button. */
.designer-login .dialog-copy + .dialog-copy { margin-top:10px }
.designer-login .dialog-cta {
  display:flex; align-items:center; justify-content:center; width:100%; height:48px; margin-top:26px; border-radius:12px;
  background:#f4f4f6; color:#0b0b10; font:600 14.5px Inter,system-ui,sans-serif; text-decoration:none; transition:background .2s;
}
.designer-login .dialog-cta:hover { background:#fff }
