@import url('/static/design-states.css');
[hidden] { display:none !important; }
.app-card { --z:1; --fx:0; --fxDur:1.4s cubic-bezier(.4,0,.2,1); --border:rgba(255,255,255,.06); --power:grayscale(1) brightness(.55) contrast(.9); --iconSize:56px; --iconRadius:16px; --iconFont:21px; --badgeOpacity:1; --textLeft:92px; --textTop:24px; --nameSize:22px; --listOpacity:0; --descOpacity:1; --descShift:none; --listShift:translateY(12px); --listEvents:none; --listDelay:0s; border-radius:24px; }
.app-card:hover,.app-card:focus-within,.app-card.expanded { --z:20; --fx:1; --fxDur:.9s cubic-bezier(.25,.1,.25,1); --border:rgba(221,132,72,0); --power:grayscale(0) brightness(1); --iconSize:48px; --iconRadius:14px; --iconFont:18px; --badgeOpacity:0; --textLeft:88px; --textTop:24px; --nameSize:22px; --listOpacity:1; --descOpacity:0; --descShift:translateY(12px); --listShift:none; --listEvents:auto; --listDelay:.15s; }
.app-card:focus-visible { outline:2px solid #dd8448; outline-offset:6px; }
.app-logo { display:block; width:72%; height:72%; object-fit:contain; filter:grayscale(1) brightness(1.8) sepia(.3); transition:filter .4s; }
.app-card:hover .app-logo,.app-card:focus-within .app-logo,.app-card.expanded .app-logo { filter:drop-shadow(0 1px 4px rgba(221,132,72,.12)); }
.app-description { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.planned-notice { margin:0; display:flex; align-items:center; font-size:13px; line-height:1.4; color:rgba(255,255,255,.6); }
.app-name { overflow:hidden; text-overflow:ellipsis; padding-bottom:3px; }
.setup { display:flex; flex-direction:column; align-items:center; gap:14px; }
.qr { display:block; max-width:100%; height:auto; background:#fff; border-radius:12px; }
.setup details { width:100%; color:rgba(255,255,255,.6); font-size:13px; text-align:center; }
summary { cursor:pointer; }
#setup-key { display:block; overflow-wrap:anywhere; margin-top:10px; color:#f3c39e; }
.hint { margin:0; font-size:14px; line-height:1.45; color:rgba(255,255,255,.5); }
.text-button { border:0; padding:0; background:none; color:rgba(255,255,255,.65); font:inherit; font-size:14px; cursor:pointer; }
.text-button:hover { color:#fff; }
[data-state="setup"] .auth-title { font-size:30px !important; }
.recovery { display:flex; flex-direction:column; gap:22px; }
.recovery-title { margin:0; font-weight:600; font-size:34px; letter-spacing:-.01em; line-height:1.1; }
#recovery-codes { display:grid; grid-template-columns:1fr 1fr; gap:10px; color:#f3c39e; font-size:14px; }
.save-codes { display:flex; align-items:flex-start; gap:10px; font-size:14px; color:rgba(255,255,255,.7); }
.save-codes input { accent-color:#dd8448; }
.field-label { display:block; margin-bottom:8px; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.6); }
.recovery-input { width:100%; font:inherit; color:#fff; height:52px; border-radius:14px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.04); padding:0 16px; margin-bottom:12px; }
button:disabled { opacity:.6; cursor:wait !important; }
.no-script { position:fixed; bottom:20px; padding:12px; background:#221b16; color:#f3c39e; }
@media(max-width:600px) {
  .portal { padding:20px 20px 40px !important; gap:28px !important; }
  .app-grid { grid-template-columns:minmax(0,1fr) !important; gap:24px !important; }
  .portal>div>div:last-child { padding:16px !important; gap:10px !important; flex-wrap:wrap; }
  .portal>div>div:last-child>span { font-size:12px !important; letter-spacing:.08em !important; }
  .login-screen { padding:18px !important; }
  .login-form { padding:32px 24px !important; }
  .login-form>div:first-child span { font-size:12px !important; letter-spacing:.08em !important; }
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; animation:none !important; } .app-card [style*="turbulent-displace"] { filter:none !important; } }