:root {
  color-scheme: light;
  --rx-sage-50: #f2f7f4; --rx-sage-100: #e2eee8; --rx-sage-300: #9cbcac;
  --rx-sage-500: #5f8f7c; --rx-sage-600: #477565; --rx-sage-700: #345b50;
  --rx-peach-100: #fff0e8; --rx-peach-300: #f3b9a5; --rx-peach-500: #d77f63;
  --rx-slate-950: #142524; --rx-slate-800: #29413f; --rx-slate-600: #607371;
  --rx-canvas: #f7f8f5; --rx-surface: #ffffff; --rx-surface-soft: #eef4f0;
  --rx-text: var(--rx-slate-950); --rx-muted: var(--rx-slate-600); --rx-border: #dce6e1;
  --rx-success: #3f8169; --rx-warning: #a96f2b; --rx-danger: #b45252; --rx-info: #4f718a;
  --rx-focus: #6c9f8a; --rx-overlay: rgb(20 37 36 / 52%);
  --rx-radius-sm: .65rem; --rx-radius-md: 1rem; --rx-radius-lg: 1.5rem; --rx-radius-xl: 2rem;
  --rx-shadow-sm: 0 1px 3px rgb(28 51 47 / 7%); --rx-shadow-md: 0 16px 40px rgb(28 51 47 / 10%);
  --rx-shadow-lg: 0 28px 70px rgb(28 51 47 / 15%); --rx-font: Inter, Manrope, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --rx-space-1: .25rem; --rx-space-2: .5rem; --rx-space-3: .75rem; --rx-space-4: 1rem;
  --rx-space-5: 1.5rem; --rx-space-6: 2rem; --rx-space-7: 3rem; --rx-space-8: 4rem;
}
[data-theme="dark"] { color-scheme: dark; --rx-canvas: #0f1c1b; --rx-surface: #172725; --rx-surface-soft: #20322f; --rx-text: #f3f7f4; --rx-muted: #a9bbb5; --rx-border: #314743; --rx-sage-50: #1a2d29; --rx-sage-100: #233b35; --rx-slate-950: #f3f7f4; --rx-slate-800: #d8e4df; --rx-overlay: rgb(2 8 7 / 72%); --rx-shadow-sm: 0 1px 3px rgb(0 0 0 / 20%); --rx-shadow-md: 0 16px 40px rgb(0 0 0 / 24%); --rx-shadow-lg: 0 28px 70px rgb(0 0 0 / 34%); }
* { box-sizing: border-box; }
html { background: var(--rx-canvas); color: var(--rx-text); font-family: var(--rx-font); }
body { margin: 0; min-height: 100vh; background: var(--rx-canvas); }
button, input, textarea, select { color: inherit; font: inherit; }
button, .button { cursor: pointer; }
a { color: var(--rx-sage-700); }
img { max-width: 100%; }
.hidden { display: none !important; }
.roxiro-logo { display: block; width: 12rem; height: auto; mix-blend-mode: multiply; }
[data-theme="dark"] .roxiro-logo { mix-blend-mode: normal; border-radius: var(--rx-radius-sm); }
.rx-button, button[type="submit"], a.button { align-items: center; background: var(--rx-sage-600); border: 1px solid transparent; border-radius: var(--rx-radius-sm); color: #fff; display: inline-flex; font-weight: 700; gap: .55rem; justify-content: center; min-height: 2.85rem; padding: .75rem 1.1rem; text-decoration: none; transition: transform .16s ease, background .16s ease, box-shadow .16s ease; }
.rx-button:hover, button[type="submit"]:hover, a.button:hover { background: var(--rx-sage-700); box-shadow: var(--rx-shadow-sm); transform: translateY(-1px); }
.rx-button.secondary, button.quiet { background: var(--rx-surface); border-color: var(--rx-border); color: var(--rx-text); }
input, textarea, select { background: var(--rx-surface); border: 1px solid var(--rx-border); border-radius: var(--rx-radius-sm); min-height: 2.85rem; outline: none; padding: .75rem .9rem; width: 100%; }
input:focus, textarea:focus, select:focus, button:focus-visible, a:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--rx-focus) 30%, transparent); outline: none; }
label { font-size: .88rem; font-weight: 700; }
.rx-card, .card, .panel, .login-card { background: var(--rx-surface); border: 1px solid var(--rx-border); border-radius: var(--rx-radius-lg); box-shadow: var(--rx-shadow-sm); }
.eyebrow { color: var(--rx-sage-600); font-size: .72rem; font-weight: 800; letter-spacing: .12em; margin: 0 0 .45rem; text-transform: uppercase; }
.muted { color: var(--rx-muted); }
.rx-badge, .tag, .status, .status-pill { align-items: center; background: var(--rx-surface-soft); border: 1px solid var(--rx-border); border-radius: 999px; color: var(--rx-sage-700); display: inline-flex; font-size: .76rem; font-weight: 800; min-height: 1.8rem; padding: .28rem .65rem; }
.rx-alert, .notice { background: var(--rx-peach-100); border: 1px solid var(--rx-peach-300); border-radius: var(--rx-radius-md); color: var(--rx-text); padding: 1rem; }
.error, .form-message { color: var(--rx-danger); min-height: 1.25rem; }
.rx-icon { fill: none; height: 1.1rem; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 1.1rem; }
.theme-toggle { align-items: center; background: var(--rx-surface); border: 1px solid var(--rx-border); border-radius: 999px; color: var(--rx-text); display: inline-flex; height: 2.6rem; justify-content: center; padding: 0; width: 2.6rem; }
.rx-skeleton { animation: rx-pulse 1.5s ease-in-out infinite; background: linear-gradient(90deg,var(--rx-surface-soft),var(--rx-border),var(--rx-surface-soft)); background-size: 200% 100%; border-radius: var(--rx-radius-sm); min-height: 1rem; }
.rx-spinner { animation: rx-spin .8s linear infinite; border: 2px solid var(--rx-border); border-radius: 50%; border-top-color: var(--rx-sage-500); height: 1.25rem; width: 1.25rem; }
.rx-empty, .rx-error-page { color: var(--rx-muted); padding: var(--rx-space-7); text-align: center; }
.rx-dialog, .rx-drawer, .rx-dropdown, .rx-toast { background: var(--rx-surface); border: 1px solid var(--rx-border); border-radius: var(--rx-radius-md); box-shadow: var(--rx-shadow-lg); }
.rx-toast { bottom: 1.25rem; max-width: 24rem; padding: 1rem; position: fixed; right: 1.25rem; z-index: 30; }
.rx-drawer { height: 100%; max-width: 28rem; padding: var(--rx-space-5); position: fixed; right: 0; top: 0; width: 92%; z-index: 25; }
.rx-dropdown { min-width: 12rem; padding: .5rem; position: absolute; }
.rx-dialog { left: 50%; max-width: 34rem; padding: var(--rx-space-6); position: fixed; top: 50%; transform: translate(-50%,-50%); width: calc(100% - 2rem); z-index: 25; }
@keyframes rx-pulse { 50% { background-position: -100% 0; opacity: .75; } } @keyframes rx-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; } }
