:root{--color-brand: #6051a2;--color-brand-dark: #4d4185;--color-brand-light: #eae8f5;--color-gold: #f5b142;--color-gold-light: #fef3e2;--color-gold-dark: #8b5a0e;--color-danger: #ed4753;--color-danger-light: #fdeaea;--color-danger-dark: #8b1f26;--color-dark: #414143;--color-dark-light: #e6e6e8;--color-surface: #f6f5fa;--color-surface-subtle: #edeaf5;--color-surface-muted: #e2dff0;--color-paper: #ffffff;--color-border: #d5d0e8;--color-border-strong: #b3acdb;--color-text: #414143;--color-text-secondary: #5c5c5f;--color-text-muted: #7a7a7e;--color-text-faint: #adadb0;--color-state-locked: var(--color-dark);--color-state-available: var(--color-dark);--color-state-progress: var(--color-gold);--color-state-pending: var(--color-brand);--color-state-unlocked: var(--color-brand);--color-state-suspended: var(--color-danger);--color-role-learner: #eae8f5;--color-role-leader: #f0eef9;--color-role-hr: #e8f5ea;--color-role-recruiter: #edf5fb;--color-role-facility: #f5f0e8;--radius-chip: 3px;--radius-card: 6px;--radius-modal: 10px;--radius-pill: 9999px;--shadow-sm: 0 1px 2px rgb(65 65 67 / .06);--shadow-md: 0 6px 24px rgb(65 65 67 / .08), 0 1px 3px rgb(65 65 67 / .06);--shadow-lg: 0 22px 60px rgb(65 65 67 / .14), 0 2px 8px rgb(65 65 67 / .08);--ease-out: cubic-bezier(.2, .7, .3, 1);--ease-in-out: cubic-bezier(.5, .1, .3, 1);--font-display: "Sora", ui-sans-serif, system-ui, sans-serif;--font-body: "DM Sans", ui-sans-serif, system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--color-surface);color:var(--color-text);font-family:var(--font-body);font-size:15px;line-height:24px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}.t-xs{font-size:11px;line-height:16px}.t-sm{font-size:13px;line-height:20px}.t-md{font-size:15px;line-height:24px}.t-lg{font-size:17px;line-height:26px}.t-xl{font-size:20px;line-height:28px}.t-2xl{font-size:24px;line-height:32px}.t-3xl{font-size:32px;line-height:40px}.t-4xl{font-size:44px;line-height:50px;letter-spacing:-.03em}.t-5xl{font-size:60px;line-height:1.02;letter-spacing:-.03em}.font-display{font-family:var(--font-display);letter-spacing:-.02em}.font-body{font-family:var(--font-body)}.font-mono{font-family:var(--font-mono)}*:focus-visible{outline:2px solid var(--color-brand);outline-offset:2px;border-radius:3px}::selection{background:color-mix(in oklab,var(--color-brand) 25%,var(--color-surface-subtle))}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--color-border-strong);border:2px solid transparent;background-clip:content-box;border-radius:999px}::-webkit-scrollbar-track{background:transparent}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:var(--radius-card);font-weight:600;font-family:var(--font-body);border:1px solid transparent;cursor:pointer;transition:background-color .15s var(--ease-out),border-color .15s,color .15s,transform 80ms;white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:active{transform:translateY(.5px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-sm{height:32px;padding:0 12px;font-size:13px}.btn-md{height:40px;padding:0 16px;font-size:14px}.btn-lg{height:48px;padding:0 20px;font-size:15px}.btn-primary{background:var(--color-brand);color:#fff;border-color:var(--color-brand)}.btn-primary:hover{background:var(--color-brand-dark);border-color:var(--color-brand-dark)}.btn-secondary{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border-strong)}.btn-secondary:hover{background:var(--color-surface-subtle)}.btn-ghost{background:transparent;color:var(--color-text)}.btn-ghost:hover{background:var(--color-surface-subtle)}.btn-navy{background:var(--color-dark);color:#fff;border-color:var(--color-dark)}.btn-navy:hover{background:#2d2d2f;border-color:#2d2d2f}.btn-danger{background:var(--color-danger);color:#fff;border-color:var(--color-danger)}.btn-danger:hover{background:#c63b46;border-color:#c63b46}.btn-outline{background:transparent;color:var(--color-brand);border-color:var(--color-brand)}.btn-outline:hover{background:var(--color-brand-light)}.card{background:var(--color-paper);border:1px solid var(--color-border);border-radius:var(--radius-card);box-shadow:var(--shadow-sm)}.card-hover{transition:all .15s var(--ease-out)}.card-hover:hover{transform:translateY(-1px);box-shadow:var(--shadow-md)}.pill{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:var(--radius-chip);font-size:11px;line-height:16px;font-weight:500;white-space:nowrap}.pill-locked{background:color-mix(in oklab,var(--color-state-locked) 12%,transparent);color:#6e6e72}.pill-available{background:color-mix(in oklab,var(--color-state-available) 12%,transparent);color:#1e4fb8}.pill-progress{background:color-mix(in oklab,var(--color-state-progress) 16%,transparent);color:#8c5a0e}.pill-pending{background:color-mix(in oklab,var(--color-state-pending) 14%,transparent);color:var(--color-brand-dark)}.pill-unlocked{background:color-mix(in oklab,var(--color-state-unlocked) 14%,transparent);color:#0d7a2e}.pill-suspended{background:color-mix(in oklab,var(--color-state-suspended) 12%,transparent);color:#b82e38}.pill-neutral{background:var(--color-surface-muted);color:var(--color-text-secondary)}.field{width:100%;height:40px;padding:0 12px;background:var(--color-paper);border:1px solid var(--color-border);border-radius:var(--radius-card);color:var(--color-text);font:inherit;outline:none;transition:border-color .12s}.field:focus{border-color:var(--color-brand);box-shadow:0 0 0 3px color-mix(in oklab,var(--color-brand) 18%,transparent)}.field::placeholder{color:var(--color-text-muted)}.avatar{display:inline-flex;align-items:center;justify-content:center;background:var(--color-dark);color:#fff;border-radius:999px;font-family:var(--font-display);font-weight:600;letter-spacing:0;flex-shrink:0}@keyframes fadeUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.anim-fade-up{animation:fadeUp .45s var(--ease-out) both}.anim-fade-in{animation:fadeIn .35s var(--ease-out) both}.anim-pop{animation:popIn .35s var(--ease-out) both}.anim-slide-up{animation:slideUp .35s var(--ease-out) both}.row{display:flex;align-items:center}.col{display:flex;flex-direction:column}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-5{gap:20px}.gap-6{gap:24px}.gap-8{gap:32px}.flex-1{flex:1}.flex-grow{flex-grow:1}.muted{color:var(--color-text-secondary)}.faint{color:var(--color-text-muted)}.tabular{font-variant-numeric:tabular-nums}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}[data-density=compact]{--row-pad-y: 8px;--row-pad-x: 12px;--gap: 8px}[data-density=comfortable]{--row-pad-y: 14px;--row-pad-x: 16px;--gap: 12px}[data-density=cozy]{--row-pad-y: 18px;--row-pad-x: 20px;--gap: 16px}.divider-dot{display:flex;align-items:center;gap:8px}.divider-dot:before,.divider-dot:after{content:"";flex:1;height:1px;background:var(--color-border)}.tl-line{background:var(--color-border)}.skel{background:linear-gradient(90deg,var(--color-surface-muted) 0%,var(--color-surface-subtle) 50%,var(--color-surface-muted) 100%);background-size:200% 100%;animation:shimmer 2.2s infinite linear;border-radius:4px}@media(max-width:720px){.hide-mobile{display:none!important}}
