@font-face{font-family:Material Icons;font-style:normal;font-weight:400;font-display:block;src:local("Material Icons"),local("MaterialIcons-Regular"),url(./MaterialIcons-Regular-D-x-0Q06.woff2) format("woff2")}.material-icons{font-family:Material Icons!important;font-weight:400;font-style:normal;font-size:24px;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;word-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;font-feature-settings:"liga";vertical-align:middle}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Helvetica Neue,sans-serif}:root{--su: .5rem;--space-xs: var(--su);--space-sm: calc(var(--su) * 2);--space-md: calc(var(--su) * 3);--space-lg: calc(var(--su) * 4);--space-xl: calc(var(--su) * 6);--space-2xl: calc(var(--su) * 10);--sidebar-width-open: clamp(220px, 16vw, 320px);--sidebar-width-collapsed: clamp(64px, 5vw, 90px);--content-padding-x: clamp(16px, 2.5vw, 48px);--content-padding-y: clamp(12px, 1.5vh, 32px);--radius-sm: clamp(6px, .4vw, 10px);--radius-md: clamp(10px, .7vw, 16px);--radius-lg: clamp(14px, 1vw, 22px);--radius-xl: clamp(20px, 1.5vw, 36px);--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(0,0,0,.05);--shadow-md: 0 4px 16px -2px rgba(14,165,233,.1);--shadow-lg: 0 12px 28px -4px rgba(14,165,233,.14), 0 4px 10px -2px rgba(14,165,233,.08);--shadow-premium: 0 24px 48px -8px rgba(14,165,233,.18);--shadow-glow: 0 0 24px rgba(14,165,233,.28);--transition-fast: all .18s ease;--transition-smooth: all .32s cubic-bezier(.4, 0, .2, 1);--bg-app: #ffffff;--bg-card: #ffffff;--bg-input: #f1f5f9;--text-primary: #0f172a;--text-secondary: #475569;--text-tertiary: #4b5563;--text-white: #ffffff;--border-subtle: #e2e8f0;--border-active: #cbd5e1;--color-primary: #6366f1;--color-primary-soft: #eef2ff;--color-primary-light:#e0e7ff;--color-secondary: #10b981;--color-accent: #8b5cf6;--grad-primary: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);--grad-vibrant-blue: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);--grad-vibrant-purple: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);--grad-vibrant-emerald: linear-gradient(135deg, #10b981 0%, #059669 100%);--grad-vibrant-amber: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);--grad-vibrant-rose: linear-gradient(135deg, #ec4899 0%, #db2777 100%);--grad-vibrant-indigo: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);--grad-vibrant-slate: linear-gradient(135deg, #475569 0%, #1e293b 100%);--grad-glass: linear-gradient(135deg, rgba(255,255,255,.4) 0%, rgba(255,255,255,.1) 100%);--text-xs: clamp(.65rem, .8vw, .75rem);--text-sm: clamp(.75rem, .9vw, .875rem);--text-base: clamp(.875rem, 1vw, 1rem);--text-md: clamp(1rem, 1.1vw, 1.125rem);--text-lg: clamp(1.1rem, 1.3vw, 1.375rem);--text-xl: clamp(1.25rem, 1.6vw, 1.75rem);--text-2xl: clamp(1.5rem, 2vw, 2.25rem);--text-3xl: clamp(1.75rem, 2.5vw, 3rem);--text-4xl: clamp(2rem, 3vw, 3.75rem)}.theme-dashboard{--color-primary: #6366f1;--color-primary-light: #e0e7ff;--color-primary-soft: #eef2ff;--grad-primary: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);--shadow-color: rgba(99,102,241,.25)}.theme-pos{--color-primary: #10b981;--color-primary-light: #d1fae5;--color-primary-soft: #a7f3d0;--grad-primary: linear-gradient(135deg, #10b981 0%, #059669 100%);--shadow-color: rgba(16,185,129,.3)}.theme-inventory-group,.theme-inventory{--color-primary: #8b5cf6;--color-primary-light: #ede9fe;--color-primary-soft: #ddd6fe;--grad-primary: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);--shadow-color: rgba(139,92,246,.3)}.theme-contacts-group,.theme-customer-group{--color-primary: #ec4899;--color-primary-light: #fce7f3;--color-primary-soft: #fbcfe8;--grad-primary: linear-gradient(135deg, #ec4899 0%, #db2777 100%);--shadow-color: rgba(236,72,153,.3)}.theme-finance-group{--color-primary: #f59e0b;--color-primary-light: #fef3c7;--color-primary-soft: #fde68a;--grad-primary: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);--shadow-color: rgba(245,158,11,.3)}.theme-settings{--color-primary: #6366f1;--color-primary-light: #e0e7ff;--color-primary-soft: #c7d2fe;--grad-primary: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);--shadow-color: rgba(99,102,241,.3)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body,#root{height:100%;width:100%;margin:0;padding:0;overflow:hidden;font-size:clamp(13px,1.1vw,22px);text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%}body{font-family:Plus Jakarta Sans,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-app);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:var(--text-base);-webkit-user-select:text;user-select:text}@media(max-width:1280px),(max-height:768px){:root{--su: .4rem}}@media(min-width:1920px){:root{--su: .5rem}}@media(min-width:2560px){:root{--su: .6rem}}@media(min-width:3840px){:root{--su: .75rem}}@media(max-height:800px){:root{--content-padding-y: 8px}}.app-container{display:flex;height:100%;width:100%;background:var(--bg-app)}.main-content{flex:1;min-width:0;padding:var(--content-padding-y) var(--content-padding-x);overflow-y:auto;height:100%}h1{font-size:var(--text-4xl);font-weight:900;letter-spacing:-.04em;line-height:1.1}h2{font-size:var(--text-3xl);font-weight:800;letter-spacing:-.03em;line-height:1.15}h3{font-size:var(--text-2xl);font-weight:800;letter-spacing:-.02em;line-height:1.2}h4{font-size:var(--text-xl);font-weight:700;line-height:1.25}h5{font-size:var(--text-lg);font-weight:700}h6{font-size:var(--text-md);font-weight:600}.section-label{font-size:var(--text-xs);font-weight:800;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-xs)}.btn-vibrant{background:var(--grad-primary);color:#fff;padding:clamp(8px,.75vh,14px) clamp(14px,1.5vw,28px);border-radius:var(--radius-md);border:none;font-weight:700;font-size:var(--text-sm);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);cursor:pointer;transition:var(--transition-smooth);box-shadow:var(--shadow-md);letter-spacing:.3px;white-space:nowrap}.btn-vibrant:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);filter:brightness(1.08)}.btn-ghost{background:transparent;color:var(--text-secondary);padding:clamp(7px,.6vh,12px) clamp(12px,1.2vw,22px);border-radius:var(--radius-md);border:1px solid transparent;font-weight:600;font-size:var(--text-sm);cursor:pointer;transition:var(--transition-fast)}.btn-ghost:hover{background:var(--color-primary-light);color:var(--color-primary)}.glass-panel{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);box-shadow:var(--shadow-md);transition:var(--transition-smooth);overflow:hidden}.glass-panel:hover{box-shadow:var(--shadow-lg);border-color:var(--color-primary-soft)}.modern-input{width:100%;padding:clamp(8px,.8vh,14px) clamp(10px,1vw,18px);background:var(--bg-input);border:2px solid transparent;border-radius:var(--radius-md);color:var(--text-primary);font-family:inherit;font-weight:500;font-size:var(--text-base);transition:var(--transition-fast)}.modern-input:focus{background:var(--bg-card);border-color:var(--color-primary);box-shadow:var(--shadow-glow);outline:none}.modern-table{width:100%;border-collapse:separate;border-spacing:0 var(--space-xs);margin-top:var(--space-xs)}.modern-table th{text-align:left;padding:var(--space-sm) var(--space-md);color:var(--text-secondary);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em;border-bottom:2px solid var(--border-subtle)}.modern-table tbody tr{background:var(--bg-card);box-shadow:var(--shadow-sm);transition:var(--transition-fast)}.modern-table tbody tr:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);z-index:10;position:relative}.modern-table td{padding:clamp(8px,.8vh,14px) var(--space-md);vertical-align:middle;font-size:var(--text-sm);border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}.modern-table td:first-child{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md);border-left:1px solid var(--border-subtle)}.modern-table td:last-child{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md);border-right:1px solid var(--border-subtle)}.stat-card{position:relative;background:var(--bg-card);border-radius:var(--radius-lg);padding:clamp(14px,1.5vw,28px);border:1px solid var(--border-subtle);box-shadow:var(--shadow-md);transition:var(--transition-smooth);overflow:hidden;display:flex;flex-direction:column}.stat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-premium)}.stat-card-value{font-size:clamp(1.4rem,2.2vw,2.5rem);font-weight:900;color:var(--text-primary);letter-spacing:-.05em;line-height:1}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.animate-fade{animation:fadeIn .15s cubic-bezier(.4,0,.2,1) forwards}.pos-page-root{position:fixed;inset:0;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;font-family:inherit}.pos-header-bar{display:flex;align-items:center;padding:clamp(8px,1vh,16px) clamp(12px,1.5vw,28px);gap:var(--space-md);box-shadow:var(--shadow-md);position:relative;z-index:20;transition:var(--transition-smooth);border-bottom:2px solid var(--border-subtle);background:var(--bg-card);min-height:clamp(52px,6vh,72px)}.theme-pos .pos-header-bar{background:linear-gradient(180deg,#059669,#047857);border-bottom:2px solid #065f46;color:#fff}.pos-main-content{flex:1;display:flex;overflow:hidden;padding:clamp(8px,1vw,20px);gap:clamp(8px,1vw,20px)}.pos-cart-area{flex:.75;display:flex;flex-direction:column;background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);box-shadow:var(--shadow-md);overflow:hidden}.pos-sidebar{flex:.25;border-radius:var(--radius-xl);display:flex;flex-direction:column;overflow:hidden;min-width:clamp(240px,20vw,380px)}.btn-pos-primary{background:var(--grad-primary);color:#fff;border:none;padding:clamp(8px,.8vh,14px) clamp(12px,1.2vw,22px);border-radius:var(--radius-md);font-weight:900;font-size:var(--text-sm);cursor:pointer;transition:var(--transition-smooth);box-shadow:var(--shadow-md);display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);white-space:nowrap}.btn-pos-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:var(--shadow-lg);filter:brightness(1.08)}.btn-pos-primary:disabled{opacity:.5;cursor:not-allowed}.btn-pos-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border-subtle);padding:clamp(7px,.7vh,12px) clamp(10px,1vw,18px);border-radius:var(--radius-md);font-weight:700;font-size:var(--text-sm);cursor:pointer;transition:var(--transition-fast)}.btn-pos-secondary:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.pos-modal-overlay{position:fixed;inset:0;z-index:5000;background:#0f172ab8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;padding:var(--space-lg)}.pos-modal-container{background:var(--bg-card);border-radius:var(--radius-xl);padding:clamp(20px,2.5vw,48px);display:flex;flex-direction:column;border:1px solid var(--border-subtle);box-shadow:var(--shadow-premium);max-width:min(90vw,900px);max-height:90vh;overflow:hidden;width:100%}.pos-cart-table{width:100%;border-collapse:separate;border-spacing:0}.pos-cart-table thead{background:var(--bg-input);border-bottom:2px solid var(--border-subtle)}.pos-cart-table th{padding:clamp(6px,.6vh,12px) clamp(8px,.8vw,16px);text-align:left;font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary)}.pos-cart-table tbody tr{border-bottom:1px solid var(--border-subtle);transition:var(--transition-fast)}.pos-cart-table tbody tr:hover{background:var(--color-primary-light)}.pos-cart-table td{padding:clamp(6px,.6vh,12px) clamp(8px,.8vw,16px);vertical-align:middle;font-size:var(--text-sm)}.pos-status-badge{display:inline-flex;align-items:center;gap:4px;padding:3px clamp(6px,.5vw,10px);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:800;text-transform:uppercase;white-space:nowrap}.pos-status-badge.online{background:var(--color-secondary);color:#fff}.pos-status-badge.offline{background:var(--text-primary);color:#fff}.pos-status-badge.sync{background:var(--color-primary);color:#fff}::-webkit-scrollbar{width:clamp(4px,.4vw,8px);height:clamp(4px,.4vw,8px)}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-active);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}input::placeholder,textarea::placeholder{color:#4755698c;opacity:1}input.dark-bg::placeholder,textarea.dark-bg::placeholder{color:#fff9;opacity:1}.prism-group{display:flex;flex-direction:column;gap:var(--space-xs)}.prism-input{width:100%;padding:clamp(8px,.8vh,14px) clamp(10px,1vw,16px);border:1.5px solid var(--border-subtle);border-radius:var(--radius-md);font-family:inherit;font-size:var(--text-base);color:var(--text-primary);background:var(--bg-card);transition:var(--transition-fast);outline:none}.prism-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}.hover-lift{transition:var(--transition-smooth)}.hover-lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.aging-stock-widget{background:#fff;border-radius:28px;padding:32px;box-shadow:0 10px 30px #0000000d;border:1px solid #f1f5f9}.widget-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #f1f5f9}.header-title{display:flex;align-items:center;gap:16px}.header-title .icon{font-size:28px;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.header-title h3{margin:0;font-size:20px;font-weight:900;color:#0f172a;letter-spacing:-.5px}.btn-view-all{padding:10px 24px;background:#eff6ff;color:#2563eb;border:1px solid #dbeafe;border-radius:12px;font-size:13px;font-weight:900;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.btn-view-all:hover{background:#2563eb;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #2563eb33}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:32px}.stat-card{padding:20px;border-radius:20px;text-align:center;transition:all .3s ease;border:2px solid transparent}.stat-card.critical-card{background:linear-gradient(135deg,#fff1f2,#ffe4e6);border-color:#fecdd3}.stat-card.warning-card{background:linear-gradient(135deg,#fffbeb,#fef3c7);border-color:#fde68a}.stat-card.health-card{background:linear-gradient(135deg,#fff 0% 100%);border-color:#bae6fd}.stat-card:hover{transform:translateY(-4px);box-shadow:0 10px 20px -5px #0000001a}.stat-value{font-size:36px;font-weight:900;margin-bottom:4px;letter-spacing:-1px}.stat-value.critical{color:#e11d48}.stat-value.warning{color:#d97706}.stat-value.pending{color:#0284c7}.stat-label{font-size:12px;color:#475569;font-weight:800;text-transform:uppercase;letter-spacing:.5px}.recent-alerts h4{margin:0 0 16px;font-size:16px;font-weight:900;color:#0f172a;display:flex;align-items:center;gap:8px}.alerts-list{display:flex;flex-direction:column;gap:12px}.alert-item{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-radius:16px;border:1.5px solid transparent;transition:all .3s ease}.alert-item.alert-critical{background:#fff1f2;border-color:#fecdd3;border-left:6px solid #e11d48}.alert-item.alert-warning{background:#fffbeb;border-color:#fde68a;border-left:6px solid #f59e0b}.alert-item:hover{transform:scale(1.02);box-shadow:0 4px 15px #00000014}.product-name{font-size:14px;font-weight:900;color:#1e293b;margin-bottom:2px;display:block}.product-category{font-size:11px;color:#64748b;font-weight:800;text-transform:uppercase;letter-spacing:.4px}.alert-age{background:#fff;padding:6px 12px;border-radius:10px;box-shadow:0 2px 4px #0000000d;display:flex;flex-direction:column;align-items:center;min-width:60px}.alert-age strong{font-size:22px;font-weight:900;line-height:1}.alert-age span{font-size:10px;font-weight:800;text-transform:uppercase;color:#64748b}.no-alerts{text-align:center;padding:48px 24px;background:linear-gradient(135deg,#f0fdf4,#dcfce7);border-radius:20px;border:2px dashed #86efac}.success-icon{font-size:56px;color:#22c55e;display:block;margin-bottom:16px;filter:drop-shadow(0 4px 6px rgba(34,197,94,.2))}.no-alerts p{margin:0 0 4px;font-size:18px;font-weight:900;color:#166534}.no-alerts .subtitle{font-size:13px;color:#15803d;font-weight:700}.spinner{width:48px;height:48px;border:4px solid #ecf0f1;border-top-color:#3498db;border-radius:50%;animation:spin .8s linear infinite}@media(max-width:768px){.aging-stock-widget{padding:16px}.stats-grid{grid-template-columns:1fr}.alert-item{flex-direction:column;align-items:flex-start;gap:8px}.alert-age{align-items:flex-start}}.setup-overlay{position:fixed;inset:0;background:linear-gradient(135deg,#0f172a,#1e293b);display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px}.setup-card{background:#1e293b;border:1px solid #334155;border-radius:16px;padding:36px 40px 28px;max-width:540px;width:100%;box-shadow:0 25px 60px #0000008c;color:#f1f5f9}.setup-logo{text-align:center;margin-bottom:28px}.setup-logo-icon{font-size:2.6rem;display:block;margin-bottom:6px}.setup-logo h1{font-size:1.7rem;font-weight:700;color:#f1f5f9;margin:0 0 4px}.setup-subtitle{font-size:.85rem;color:#94a3b8;margin:0}.setup-step{display:flex;flex-direction:column;gap:0}.step-instruction{font-size:.9rem;color:#94a3b8;margin:0 0 18px;line-height:1.5}.step-instruction small{font-size:.78rem;display:block;margin-top:4px}.step-instruction code{background:#0f172a;padding:1px 6px;border-radius:4px;font-family:monospace;color:#93c5fd}.step-header{margin-bottom:20px}.step-icon{font-size:2rem;display:block;margin-bottom:8px}.step-header h2{font-size:1.25rem;font-weight:700;color:#f1f5f9;margin:0 0 6px}.back-btn{background:none;border:none;color:#64748b;font-size:.85rem;cursor:pointer;padding:0;margin-bottom:20px;display:flex;align-items:center;gap:4px;transition:color .2s}.back-btn:hover{color:#94a3b8}.setup-options{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}.setup-option{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:12px;border:2px solid #334155;background:#0f172a;cursor:pointer;text-align:left;color:#f1f5f9;position:relative;transition:border-color .2s,background .2s}.setup-option:hover{border-color:#3b82f6;background:#172554}.option-icon{font-size:1.9rem;flex-shrink:0}.option-text{display:flex;flex-direction:column;gap:3px;flex:1}.option-text strong{font-size:.95rem;font-weight:600}.option-text span{font-size:.8rem;color:#94a3b8;line-height:1.4}.option-arrow{font-size:1.4rem;color:#475569}.ip-none-notice{background:#2d1a00;border:1px solid #92400e;color:#fbbf24;border-radius:10px;padding:14px 16px;font-size:.85rem;margin-bottom:16px}.ip-cards{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}.ip-card{background:#0f172a;border:1.5px solid #334155;border-radius:10px;padding:12px 16px}.ip-card-meta{margin-bottom:6px}.ip-card-label{font-size:.75rem;color:#64748b;text-transform:uppercase;letter-spacing:.05em}.ip-card-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.ip-card-value{font-size:1.15rem;font-weight:700;font-family:monospace;color:#38bdf8;letter-spacing:.04em}.btn-copy{padding:6px 14px;border-radius:6px;border:1.5px solid #3b82f6;background:transparent;color:#3b82f6;font-size:.8rem;font-weight:600;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s;flex-shrink:0}.btn-copy:hover{background:#3b82f6;color:#fff}.btn-copy.copied{border-color:#22c55e;color:#22c55e}.step-checklist{background:#0f172a;border:1px solid #334155;border-radius:10px;padding:14px 16px;margin-bottom:20px}.checklist-title{font-size:.78rem;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.05em;margin:0 0 8px}.step-checklist ol{margin:0;padding-left:18px}.step-checklist li{font-size:.84rem;color:#94a3b8;line-height:1.7}.step-checklist li strong{color:#f1f5f9}.connect-row{display:flex;align-items:center;gap:0;margin-bottom:18px;background:#0f172a;border:1.5px solid #334155;border-radius:10px;overflow:hidden;transition:border-color .2s}.connect-row:focus-within{border-color:#3b82f6}.ip-prefix,.ip-suffix{padding:10px 12px;font-family:monospace;font-size:.85rem;color:#475569;background:#0f172a;flex-shrink:0;white-space:nowrap}.ip-input{flex:1;padding:10px 8px;border:none;background:#0f172a;color:#f1f5f9;font-size:1rem;font-family:monospace;letter-spacing:.04em;outline:none}.ip-input.ip-ok{color:#22c55e}.ip-input.ip-fail{color:#ef4444}.ip-input:disabled{opacity:.6}.diag-box{border-radius:10px;padding:14px 16px;margin-bottom:16px;display:flex;gap:14px;align-items:flex-start}.diag-icon-big{font-size:2rem;flex-shrink:0;line-height:1}.diag-box strong{font-size:.95rem;font-weight:700;display:block;margin-bottom:2px}.diag-box p{font-size:.83rem;color:#94a3b8;margin:0;line-height:1.45}.diag-connecting{background:#1e3a5f;border:1px solid #1d4ed8;align-items:center}.diag-connecting .diag-spinner{font-size:1.6rem;animation:spin 1.2s linear infinite;flex-shrink:0}@keyframes spin{to{transform:rotate(360deg)}}.diag-connecting strong{color:#93c5fd}.diag-success{background:#052e16;border:1px solid #16a34a}.diag-success strong{color:#4ade80}.diag-error{background:#2d0c0c;border:1px solid #991b1b;flex-direction:column}.diag-error-header{display:flex;gap:14px;align-items:flex-start}.diag-error strong{color:#f87171}.diag-fixes{margin-top:12px;padding-top:12px;border-top:1px solid #3f1717}.diag-fixes-title{font-size:.75rem;font-weight:700;color:#f87171;text-transform:uppercase;letter-spacing:.05em;margin:0 0 6px}.diag-fixes ol{margin:0;padding-left:18px}.diag-fixes li{font-size:.82rem;color:#fca5a5;line-height:1.65}.btn-confirm{width:100%;padding:13px;border-radius:10px;border:none;background:#3b82f6;color:#fff;font-size:.95rem;font-weight:700;cursor:pointer;transition:background .2s,opacity .2s;margin-bottom:14px}.btn-confirm:hover:not(:disabled){background:#2563eb}.btn-confirm:disabled{opacity:.4;cursor:not-allowed}.setup-note{text-align:center;font-size:.75rem;color:#475569;margin:0}
