:root{--color-bg-primary: #FFFFFF;--color-bg-secondary: #F5F5F7;--color-bg-tertiary: #FAFAFA;--color-text-primary: #1D1D1F;--color-text-secondary: #6E6E73;--color-text-tertiary: #86868B;--color-border: #D2D2D7;--color-divider: #E5E5EA;--color-blue: #007AFF;--color-blue-light: #E5F2FF;--color-green: #34C759;--color-red: #FF3B30;--color-orange: #FF9500;--color-purple: #AF52DE;--color-green-soft: rgba(52, 199, 89, .12);--color-red-soft: rgba(255, 59, 48, .08);--color-orange-soft: rgba(255, 149, 0, .12);--color-overlay: rgba(0, 0, 0, .4);--font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI", system-ui, sans-serif;--font-mono: "SF Mono", Monaco, Menlo, monospace;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--space-10: 40px;--space-12: 48px;--space-16: 64px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 4px rgba(0, 0, 0, .04);--shadow-md: 0 2px 8px rgba(0, 0, 0, .08), 0 4px 16px rgba(0, 0, 0, .06);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .12), 0 16px 48px rgba(0, 0, 0, .08);--shadow-focus: 0 0 0 4px rgba(0, 122, 255, .15);--duration-fast: .15s;--duration-base: .2s;--duration-slow: .3s;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--color-bg-secondary);color:var(--color-text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:15px}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.25;letter-spacing:-.3px}h1{font-size:32px;letter-spacing:-.5px}h2{font-size:24px}h3{font-size:18px;letter-spacing:-.2px}button{cursor:pointer;font-family:inherit;border:none;background:none}a{color:inherit;text-decoration:none}.card{background:var(--color-bg-primary);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);border:1px solid var(--color-border);padding:var(--space-6);transition:box-shadow var(--duration-base) var(--ease-out),transform var(--duration-base) var(--ease-out)}.card-interactive:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 var(--space-6);border-radius:var(--radius-sm);font-weight:500;font-size:15px;transition:all var(--duration-base) var(--ease-out);border:none;gap:var(--space-2);cursor:pointer;white-space:nowrap}.btn-primary{background-color:var(--color-blue);color:#fff}.btn-primary:hover{background-color:#0051d5;box-shadow:0 4px 12px #007aff4d}.btn-primary:active{transform:scale(.98);background-color:#003da3}.btn-secondary{background-color:transparent;border:1.5px solid var(--color-border);color:var(--color-text-primary)}.btn-secondary:hover{background-color:var(--color-bg-secondary);border-color:var(--color-text-tertiary)}.btn-secondary:active{transform:scale(.98)}.btn-danger{background-color:var(--color-red);color:#fff}.btn-danger:hover{background-color:#d62c21;box-shadow:0 4px 12px #ff3b304d}.btn-sm{height:36px;padding:0 var(--space-4);font-size:14px}.btn-lg{height:52px;padding:0 var(--space-8);font-size:16px}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.btn:focus-visible{outline:none;box-shadow:var(--shadow-focus)}.form-group{margin-bottom:var(--space-4)}.form-label{display:block;font-size:13px;font-weight:500;letter-spacing:.3px;color:var(--color-text-primary);margin-bottom:var(--space-2)}.form-input{width:100%;height:44px;padding:0 var(--space-4);border:1.5px solid var(--color-border);border-radius:var(--radius-md);font-size:15px;color:var(--color-text-primary);background-color:var(--color-bg-primary);transition:border-color var(--duration-base) var(--ease-out),box-shadow var(--duration-base) var(--ease-out);font-family:inherit}.form-input::placeholder{color:var(--color-text-tertiary)}.form-input:focus{outline:none;border-color:var(--color-blue);box-shadow:var(--shadow-focus)}.form-input:hover:not(:focus){border-color:var(--color-text-tertiary)}.form-input.has-error{border-color:var(--color-red)}.form-input.has-error:focus{box-shadow:0 0 0 4px #ff3b3026}.form-error{color:var(--color-red);font-size:13px;margin-top:var(--space-1)}.app-shell{display:flex;min-height:100vh;background:var(--color-bg-secondary)}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-6)}.sidebar{width:16rem;background-color:var(--color-bg-primary);border-right:1px solid var(--color-border);position:fixed;height:100%;z-index:10;display:flex;flex-direction:column}.sidebar-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding:var(--space-6);border-bottom:1px solid var(--color-divider);flex-wrap:wrap}.brand-mark{width:36px;height:36px;border-radius:var(--radius-md);background:transparent;display:flex;align-items:center;justify-content:center}.brand-mark-lg{width:48px;height:48px;font-size:20px;border-radius:var(--radius-lg)}.brand-text{display:flex;flex-direction:column;gap:2px}.brand-title{font-weight:600;font-size:16px;letter-spacing:-.2px}.brand-subtitle{font-size:12px;color:var(--color-text-tertiary)}.sidebar-nav{padding:var(--space-4);display:flex;flex-direction:column;gap:var(--space-2);flex:1}.sidebar-footer{padding:var(--space-4);border-top:1px solid var(--color-divider)}.nav-item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);color:var(--color-text-secondary);font-size:15px;font-weight:500;transition:all var(--duration-fast) var(--ease-out);cursor:pointer}.nav-item:hover{background-color:var(--color-bg-secondary);color:var(--color-text-primary)}.nav-item.active{background-color:var(--color-blue-light);color:var(--color-blue)}.nav-item.nav-item-danger{color:var(--color-red)}.nav-item.nav-item-danger:hover{background-color:var(--color-red-soft)}.main-content{margin-left:16rem;flex:1;padding:var(--space-12);min-height:100vh;background:linear-gradient(180deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%)}.page{display:flex;flex-direction:column;gap:var(--space-8);animation:fadeIn var(--duration-base) var(--ease-out)}.page-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6)}.page-title{font-size:32px;letter-spacing:-.5px}.page-subtitle{margin-top:var(--space-2);color:var(--color-text-secondary)}.page-loading{padding:var(--space-12);text-align:center;color:var(--color-text-secondary)}.stack{display:flex;flex-direction:column;gap:var(--space-4)}.modal-actions{display:flex;justify-content:flex-end;padding-top:var(--space-2)}.table-card{padding:0;overflow:hidden}.data-table{display:flex;flex-direction:column}.data-row{display:grid;grid-template-columns:minmax(0,1fr) 140px 120px;gap:var(--space-4);padding:var(--space-4) var(--space-6);align-items:center;border-bottom:1px solid var(--color-divider)}.data-row.dialogs{grid-template-columns:minmax(0,1fr) 180px 120px 120px}.data-row:last-child{border-bottom:none}.data-row.data-header{background:var(--color-bg-tertiary);font-size:13px;letter-spacing:.3px;text-transform:uppercase;color:var(--color-text-tertiary)}.data-cell{display:flex;align-items:center}.data-cell-main{min-width:0}.data-cell-actions{justify-content:flex-end;gap:var(--space-2)}.item{display:flex;align-items:center;gap:var(--space-3);min-width:0}.item-icon{width:40px;height:40px;border-radius:var(--radius-full);object-fit:cover;border:1px solid var(--color-border)}.item-icon-fallback{background:var(--color-blue-light);color:var(--color-blue);font-weight:600;display:flex;align-items:center;justify-content:center}.item-text{display:flex;flex-direction:column;gap:2px;min-width:0}.item-title{font-weight:600;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item-meta{font-size:13px;color:var(--color-text-tertiary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:var(--radius-full);font-size:12px;font-weight:500}.badge-success{background:var(--color-green-soft);color:var(--color-green)}.badge-warning{background:var(--color-orange-soft);color:var(--color-orange)}.media-icons{display:inline-flex;align-items:center;gap:var(--space-2)}.media-icon{width:28px;height:28px;border-radius:var(--radius-full);background:var(--color-bg-tertiary);border:1px solid var(--color-border);display:inline-flex;align-items:center;justify-content:center;color:var(--color-text-tertiary)}.media-icon.media-active{background:var(--color-blue-light);border-color:var(--color-blue-light);color:var(--color-blue)}.icon-button{width:36px;height:36px;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;color:var(--color-text-secondary);transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out)}.icon-button:hover{background:var(--color-bg-secondary);color:var(--color-text-primary)}.icon-button-danger{color:var(--color-red)}.icon-button-danger:hover{background:var(--color-red-soft)}.empty-state{padding:var(--space-12);display:flex;flex-direction:column;align-items:center;gap:var(--space-3);text-align:center}.empty-title{font-size:18px;font-weight:600}.empty-subtitle{color:var(--color-text-secondary)}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-6);background:radial-gradient(circle at top,var(--color-bg-tertiary) 0%,var(--color-bg-secondary) 60%)}.auth-card{width:100%;max-width:420px}.auth-header{display:flex;align-items:center;gap:var(--space-4)}.auth-title{font-size:24px;letter-spacing:-.3px;margin-bottom:2px}.auth-subtitle{color:var(--color-text-secondary);font-size:14px}@media (max-width: 960px){.app-shell{flex-direction:column}.sidebar{position:static;width:100%;height:auto}.sidebar-header{padding:var(--space-4) var(--space-6)}.sidebar-nav{flex-direction:row;flex-wrap:wrap;padding:var(--space-3) var(--space-6)}.main-content{margin-left:0;padding:var(--space-8) var(--space-6)}.page-header{flex-direction:column;align-items:flex-start}.data-cell-actions{justify-content:flex-end}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.fade-in{animation:fadeIn var(--duration-base) var(--ease-out)}.slide-up{animation:slideUp var(--duration-slow) var(--ease-out)}.scale-in{animation:scaleIn var(--duration-base) var(--ease-spring)}.w-full{width:100%}.text-center{text-align:center}.text-secondary{color:var(--color-text-secondary)}.text-tertiary{color:var(--color-text-tertiary)}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-3{margin-bottom:var(--space-3)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mt-4{margin-top:var(--space-4)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.h-screen{height:100vh}.min-h-screen{min-height:100vh}.modal-backdrop{background:#0006;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}*:focus-visible{outline:2px solid var(--color-blue);outline-offset:2px}button:focus-visible,.btn:focus-visible{outline:none;box-shadow:var(--shadow-focus)}.instructions-content h1{font-size:24px;font-weight:700;margin-bottom:24px;color:var(--color-text-primary)}.instructions-content h2{font-size:20px;font-weight:600;margin-top:32px;margin-bottom:16px;color:var(--color-text-primary)}.instructions-content h3{font-size:16px;font-weight:600;margin-top:24px;margin-bottom:12px;color:var(--color-text-primary)}.instructions-content h4{font-size:15px;font-weight:600;margin-top:20px;margin-bottom:10px;color:var(--color-text-primary)}.instructions-content p{font-size:14px;line-height:1.7;margin-bottom:12px;color:var(--color-text-secondary)}.instructions-content ul,.instructions-content ol{font-size:14px;line-height:1.7;margin-bottom:12px;padding-left:24px;color:var(--color-text-secondary)}.instructions-content li{margin-bottom:6px}.instructions-content strong{color:var(--color-text-primary)}.instructions-content code{background:var(--color-bg-secondary);padding:2px 6px;border-radius:4px;font-size:13px}.instructions-content hr{border:none;border-top:1px solid var(--color-divider);margin:32px 0}.instructions-content blockquote{border-left:3px solid var(--color-blue, #007AFF);padding:8px 16px;margin:12px 0;background:#007aff0a;border-radius:0 6px 6px 0}.instructions-content blockquote p{margin-bottom:0}.instructions-content table{width:100%;border-collapse:collapse;margin:12px 0;font-size:14px}.instructions-content th,.instructions-content td{border:1px solid var(--color-divider);padding:8px 12px;text-align:left}.instructions-content th{background:var(--color-bg-tertiary);font-weight:600;color:var(--color-text-primary)}.instructions-content td{color:var(--color-text-secondary)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}