:root{--topnav-height:56px;--bg:var(--color-bg);--surface:var(--color-surface);--muted:var(--color-text-muted);--border:var(--color-border);--text:var(--color-text);--accent:var(--color-primary);--accent-strong:var(--color-primary-hover);--accent-soft:var(--blue-50);--success:var(--color-success);--warning:var(--color-warning);--danger:var(--color-error)}body,html{height:100%;margin:0;padding:0}body{background:var(--color-bg);color:var(--color-text);font-family:var(--font-family,Inter,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif);font-size:var(--text-base,14px);line-height:var(--leading-normal,1.5);-webkit-font-smoothing:antialiased}h1{font-size:var(--text-3xl,24px)}h1,h2{line-height:1.3;font-weight:600;margin:0 0 12px}h2{font-size:var(--text-2xl,20px)}h3{font-size:var(--text-xl,18px);margin:0 0 10px}h3,h4{line-height:1.4;font-weight:600}h4{font-size:var(--text-lg,16px);margin:0 0 8px}p{margin:0 0 12px}.muted{color:var(--color-text-muted)}.stack{flex-direction:column}.row,.stack{display:flex}.row{align-items:center}.app-root{min-height:100vh;display:flex;flex-direction:column;background:var(--color-bg)}.app-main{flex:1 1;display:flex;flex-direction:column;padding:var(--page-padding-y,24px) var(--page-padding-x,24px) 40px}.page{max-width:var(--page-max-width,1440px);margin:0 auto;width:100%}.topnav{position:-webkit-sticky;position:sticky;top:0;z-index:var(--z-sticky,20);justify-content:space-between;gap:16px;padding:12px var(--page-padding-x,24px);background:var(--color-surface);border-bottom:1px solid var(--color-border);min-height:var(--topnav-height)}.topnav,.topnav-left{display:flex;align-items:center}.topnav-left{gap:20px;min-width:0}.topnav-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}.topnav-logo-circle{width:32px;height:32px;border-radius:var(--radius-full);background:var(--color-primary);color:var(--primary-foreground,#fff);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--text-base,14px)}.topnav-logo-text{display:flex;flex-direction:column}.topnav-logo-title{font-size:var(--text-base,14px);font-weight:600;color:var(--color-text)}.topnav-logo-subtitle{font-size:var(--text-xs,11px);color:var(--color-text-muted)}.topnav-nav{display:flex;align-items:center;gap:4px;margin-left:12px}.topnav-link{padding:8px 14px;border-radius:var(--radius-lg);font-size:var(--text-sm,13px);font-weight:500;color:var(--color-text-secondary);text-decoration:none;border:1px solid transparent;transition:all var(--transition-fast,.15s ease)}.topnav-link:hover{background:var(--color-surface-hover);color:var(--color-text)}.topnav-link-active{background:var(--blue-50);color:var(--blue-700);border-color:var(--blue-200)}.topnav-center{flex:1 1;max-width:480px}.topnav-search{position:relative}.topnav-search input{width:100%;padding:8px 14px;border-radius:var(--radius-full);font-size:var(--text-sm,13px);background:var(--color-surface-hover);border:1px solid var(--color-border)}.topnav-search input:focus{outline:none;border-color:var(--color-primary);box-shadow:var(--input-focus-ring)}.topnav-right{display:flex;align-items:center;gap:12px}.topnav-icon-button{background:transparent;border-radius:var(--radius-full);border:1px solid var(--color-border);padding:6px 10px;font-size:var(--text-base,14px);cursor:pointer;transition:all var(--transition-fast,.15s ease)}.topnav-icon-button:hover{background:var(--color-surface-hover)}.topnav-user{gap:8px;padding:4px 10px 4px 4px;text-decoration:none;color:inherit;background:var(--color-surface-hover)}.topnav-user,.topnav-user-avatar{display:flex;align-items:center;border-radius:var(--radius-full)}.topnav-user-avatar{width:28px;height:28px;background:var(--color-primary);color:var(--primary-foreground,#fff);justify-content:center;font-size:12px;font-weight:600}.topnav-user-meta{display:flex;flex-direction:column}.topnav-user-name{font-size:12px;font-weight:600}.topnav-user-role{font-size:var(--text-xs,11px);color:var(--color-text-muted)}.card{background:var(--card-bg,var(--color-surface));border:1px solid var(--color-border);border-radius:var(--card-radius,var(--radius-2xl));padding:var(--card-padding,16px);box-shadow:var(--shadow-xs)}.card-header{margin-bottom:12px}.card-title{font-size:var(--text-lg,16px);font-weight:600;margin:0}.card-description{font-size:var(--text-base,14px);color:var(--color-text-muted);margin:4px 0 0}.title{font-size:var(--text-2xl,20px);font-weight:700;margin:0 0 12px}button{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--color-primary);color:var(--primary-foreground,#fff);border:1px solid var(--color-primary);border-radius:var(--button-radius,var(--radius-lg));padding:var(--button-padding,8px 14px);font-size:var(--text-base,14px);font-weight:var(--button-font-weight,600);cursor:pointer;transition:all var(--transition-fast,.15s ease)}button:hover{background:var(--color-primary-hover)}button:disabled{opacity:.6;cursor:not-allowed}button.secondary{background:var(--color-surface);color:var(--color-text);border-color:var(--color-border)}button.secondary:hover{background:var(--color-surface-hover)}button.ghost{background:var(--color-primary-soft);color:var(--color-primary);border-color:transparent}button.ghost:hover{background:var(--blue-100)}button.danger{background:var(--color-error);color:var(--destructive-foreground,#fff);border-color:var(--color-error)}button.pill{border-radius:var(--radius-full);padding:6px 12px}input,select,textarea{border:var(--input-border,1px solid var(--color-border));border-radius:var(--input-radius,var(--radius-lg));padding:var(--input-padding,8px 12px);background:var(--input-bg,var(--color-surface));font-size:var(--text-base,14px);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:var(--input-focus-ring)}table{width:100%;border-collapse:separate;border-spacing:0}td,th{padding:12px 14px;border-bottom:1px solid var(--color-border);text-align:left;font-size:var(--text-base,14px)}th{font-weight:600;color:var(--color-text-secondary);background:var(--color-surface-hover)}.pill{gap:6px;padding:4px 10px;border-radius:var(--radius-full);border:1px solid var(--color-border);background:#f8fafc;color:var(--color-text)}.badge,.pill{display:inline-flex;align-items:center;font-size:12px;font-weight:500}.badge{padding:2px 8px;border-radius:var(--radius-full);background:var(--tag-default-bg);color:var(--tag-default-fg)}.badge.primary{background:var(--tag-primary-bg);color:var(--tag-primary-fg)}.badge.green,.badge.success{background:var(--tag-success-bg);color:var(--tag-success-fg)}.badge.warning{background:var(--tag-warning-bg);color:var(--tag-warning-fg)}.badge.danger,.badge.error{background:var(--tag-error-bg);color:var(--tag-error-fg)}.badge.gray{background:var(--tag-default-bg);color:var(--tag-default-fg)}.tabs{display:flex;gap:8px}.tab{padding:6px 12px;border-radius:var(--radius-full);border:1px solid var(--color-border);background:#f8fafc;color:var(--color-text);cursor:pointer;font-size:var(--text-sm,13px);font-weight:500;transition:all var(--transition-fast,.15s ease)}.tab:hover{background:var(--color-surface-hover)}.tab.active{background:var(--color-text);color:var(--primary-foreground,#fff);border-color:var(--color-text)}.section{border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:16px;background:var(--color-surface)}.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.kpi{display:flex;gap:4px;align-items:baseline}.kpi .value{font-weight:700}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.fade-in{animation:fadeIn .15s ease-in}.slide-up{animation:slideUp .2s ease-out}@media (max-width:1024px){.app-main{padding:20px 20px 32px}}@media (max-width:768px){.app-main{padding:16px 16px 24px}.topnav{padding:12px 16px;flex-wrap:wrap;gap:8px}.topnav-nav{display:none}.topnav-center{order:3;width:100%;max-width:none}.topnav-right{margin-left:auto}table{display:block;overflow-x:auto;white-space:nowrap}td,th{padding:10px 12px;font-size:var(--text-sm,13px)}.row{flex-wrap:wrap;gap:8px}.card{padding:14px}.title{font-size:var(--text-xl,18px)}button{width:100%}button.ghost,button.secondary{width:auto}}a:focus,button:focus,input:focus,select:focus,textarea:focus{outline:2px solid var(--color-primary);outline-offset:2px}@media (max-width:768px){button,input,select,textarea{min-height:44px}.tab{min-height:38px;display:inline-flex;align-items:center}}