/* Lucian UX/UI Prompt theme tokens · MIT License (c) 2026 Seokwoooo · https://lucianlabs.dev/uxui-prompt/
   The .ux base rules below come from Lucian's tokens.css. The --ux-* values are mapped to the
   AskTime design tokens (docs/06-design-system.md §3.10) instead of Lucian's defaults. */

/* ---------- AskTime tokens (light) ---------- */
:root{
  color-scheme:light;
  --kt-bg:#F7F7FB;
  --kt-surface:#FFFFFF;
  --kt-surface-2:#EEEFF6;
  --kt-text:#1B1D29;
  --kt-text-2:#5E6272;
  --kt-text-3:#6B6F80;
  --kt-border:#E4E5EE;
  --kt-border-strong:#8A8FA1;
  --kt-primary:#4F5BD5;
  --kt-on-primary:#FFFFFF;
  --kt-primary-container:#ECEEFE;
  --kt-on-primary-container:#2B3392;
  --kt-bedtime:#6E56CF;
  --kt-bedtime-container:#F1EDFD;
  --kt-on-bedtime-container:#4A35A0;
  --kt-limit:#E8930C;
  --kt-limit-strong:#975A00;
  --kt-limit-container:#FFF3DE;
  --kt-success:#2F9E6B;
  --kt-success-strong:#1F7A50;
  --kt-success-container:#E4F5EC;
  --kt-danger-strong:#C03535;
  --kt-night:#1C1838;
  --kt-night-text:#F2F3F7;
  --kt-night-sub:#C4BEEB;
  --kt-night-accent:#A594F9;
}

/* ---------- Lucian --ux-* tokens mapped to AskTime (light) ---------- */
:root{
  --ux-page:var(--kt-bg);
  --ux-surface:var(--kt-surface);
  --ux-surface-2:var(--kt-surface-2);
  --ux-surface-3:var(--kt-border);
  --ux-ink:var(--kt-text);
  --ux-ink-2:var(--kt-text-2);
  --ux-ink-3:var(--kt-text-3);
  --ux-line:rgba(27,29,41,.09);
  --ux-line-2:rgba(27,29,41,.17);
  --ux-accent:var(--kt-primary);
  --ux-accent-2:var(--kt-bedtime);
  --ux-accent-soft:var(--kt-primary-container);
  --ux-accent-ink:var(--kt-on-primary);
  --ux-mint:var(--kt-success-strong);
  --ux-warn:var(--kt-limit-strong);
  --ux-danger:var(--kt-danger-strong);
  --ux-glass:rgba(255,255,255,.62);
  --ux-glass-line:rgba(255,255,255,.85);
  --ux-shadow:rgba(27,29,41,.12);
  --ux-shadow-strong:rgba(27,29,41,.26);
  --ux-grad:linear-gradient(120deg,#4F5BD5,#6E56CF 60%,#A594F9);
  --ux-ease:cubic-bezier(.2,.8,.2,1);
  --ux-spring:cubic-bezier(.34,1.45,.64,1);
}

/* ---------- Dark (system) ---------- */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --kt-bg:#0F1115;--kt-surface:#1A1D24;--kt-surface-2:#262A33;
    --kt-text:#F2F3F7;--kt-text-2:#A3A7B7;--kt-text-3:#8E93A5;
    --kt-border:#2A2E38;--kt-border-strong:#6E7383;
    --kt-primary:#8F98FF;--kt-on-primary:#0F1115;--kt-primary-container:#262B5C;--kt-on-primary-container:#DADDFF;
    --kt-bedtime:#A594F9;--kt-bedtime-container:#2C2452;--kt-on-bedtime-container:#E3DCFF;
    --kt-limit:#FFB547;--kt-limit-strong:#FFB547;--kt-limit-container:#3B2B0F;
    --kt-success:#4CC38A;--kt-success-strong:#4CC38A;--kt-success-container:#12301F;
    --kt-danger-strong:#FF6B6B;
    --ux-line:rgba(255,255,255,.08);--ux-line-2:rgba(255,255,255,.16);
    --ux-glass:rgba(255,255,255,.07);--ux-glass-line:rgba(255,255,255,.18);
    --ux-shadow:rgba(0,0,0,.45);--ux-shadow-strong:rgba(0,0,0,.72);
    --ux-grad:linear-gradient(120deg,#8F98FF,#A594F9 60%,#C4BEEB);
  }
}
/* ---------- Dark (explicit) ---------- */
:root[data-theme="dark"]{
  color-scheme:dark;
  --kt-bg:#0F1115;--kt-surface:#1A1D24;--kt-surface-2:#262A33;
  --kt-text:#F2F3F7;--kt-text-2:#A3A7B7;--kt-text-3:#8E93A5;
  --kt-border:#2A2E38;--kt-border-strong:#6E7383;
  --kt-primary:#8F98FF;--kt-on-primary:#0F1115;--kt-primary-container:#262B5C;--kt-on-primary-container:#DADDFF;
  --kt-bedtime:#A594F9;--kt-bedtime-container:#2C2452;--kt-on-bedtime-container:#E3DCFF;
  --kt-limit:#FFB547;--kt-limit-strong:#FFB547;--kt-limit-container:#3B2B0F;
  --kt-success:#4CC38A;--kt-success-strong:#4CC38A;--kt-success-container:#12301F;
  --kt-danger-strong:#FF6B6B;
  --ux-line:rgba(255,255,255,.08);--ux-line-2:rgba(255,255,255,.16);
  --ux-glass:rgba(255,255,255,.07);--ux-glass-line:rgba(255,255,255,.18);
  --ux-shadow:rgba(0,0,0,.45);--ux-shadow-strong:rgba(0,0,0,.72);
  --ux-grad:linear-gradient(120deg,#8F98FF,#A594F9 60%,#C4BEEB);
}

/* ---------- Lucian .ux base rules ---------- */
.ux,.ux *,.ux *::before,.ux *::after{box-sizing:border-box}
.ux{
  font-family:inherit; /* AskTime uses the system font stack; no web fonts are loaded */
  color:var(--ux-ink);-webkit-font-smoothing:antialiased;letter-spacing:-.01em;
  -webkit-tap-highlight-color:transparent;
  overflow-wrap:break-word;
}
:where(.ux) :is(button,input,textarea,select){font:inherit;color:inherit}
:where(.ux) button{cursor:pointer}
.ux :focus-visible{outline:2px solid var(--ux-accent);outline-offset:3px}
.ux [hidden]{display:none!important}

@media (prefers-reduced-motion:reduce){
  .ux,.ux *,.ux *::before,.ux *::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}