.navbar{background:#fff;box-shadow:0 2px 10px #0000001a;position:sticky;top:0;z-index:100}.navbar-container{max-width:1400px;margin:0 auto;padding:15px 30px;display:flex;justify-content:space-between;align-items:center;gap:30px}.navbar-left{display:flex;align-items:center;gap:15px}.hospital-logo{height:40px;width:auto;object-fit:contain}.navbar-icon{width:36px;height:36px;color:#667eea}.navbar-title h1{font-size:20px;color:#2d3748;font-weight:700;margin:0}.role-badge{display:inline-block;padding:3px 10px;background:#edf2f7;color:#667eea;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;margin-left:10px}.navbar-center{display:flex;gap:5px;flex:1;justify-content:center}.nav-link{padding:10px 20px;color:#4a5568;text-decoration:none;font-weight:600;font-size:14px;border-radius:8px;transition:all .2s ease}.nav-link:hover{background:#edf2f7;color:#667eea}.nav-link.active{background:#667eea;color:#fff}.navbar-right{display:flex;align-items:center;gap:15px}.user-name{color:#718096;font-size:14px;font-weight:500}.sign-out-button{padding:10px 20px;background:#e53e3e;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.sign-out-button:hover{background:#c53030;transform:translateY(-1px)}@media (max-width: 1024px){.navbar-container{flex-wrap:wrap}.navbar-center{order:3;width:100%;justify-content:flex-start;flex-wrap:wrap}}@media (max-width: 768px){.navbar-container{padding:12px 20px}.navbar-title h1{font-size:16px}.nav-link{padding:8px 12px;font-size:13px}}.auth-container{min-height:100vh;background:transparent;font-family:Plus Jakarta Sans,system-ui,-apple-system,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;gap:20px}.auth-topbar{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:440px}.auth-back{display:inline-flex;align-items:center;gap:6px;background:none;border:none;color:var(--text-secondary);font-size:.875rem;font-weight:600;font-family:inherit;cursor:pointer;padding:6px 0;transition:color .2s ease}.auth-back:hover{color:var(--accent)}.auth-back svg{width:17px;height:17px}.auth-theme-btn{width:40px;height:40px;border-radius:10px;border:1px solid var(--glass-border-dim);background:var(--glass-bg);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .22s ease}.auth-theme-btn:hover{background:var(--accent-muted);color:var(--accent);border-color:var(--accent)}.auth-theme-btn svg{width:18px;height:18px}.auth-card{width:100%;max-width:440px;border-radius:24px;background:var(--glass-bg-heavy);backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-specular),0 4px 16px #0000000f,0 16px 48px #0000001a,0 48px 96px #0000000f;overflow:hidden;animation:authCardIn .55s cubic-bezier(.22,1,.36,1) both}@keyframes authCardIn{0%{opacity:0;transform:translateY(28px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.auth-card-header{padding:40px 36px 32px;text-align:center;border-bottom:1px solid var(--glass-border-dim)}.auth-logo{width:60px;height:60px;border-radius:18px;background:var(--gradient-accent);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;box-shadow:0 6px 24px var(--accent-glow)}.auth-logo svg{width:30px;height:30px;color:#fff}.auth-title{font-size:1.75rem;font-weight:800;letter-spacing:-.03em;margin:0 0 8px;background:var(--gradient-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.auth-subtitle{font-size:.9375rem;color:var(--text-secondary);margin:0;transition:color .3s}.auth-notice{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:10px 16px;border-radius:10px;background:var(--accent-muted);border:1px solid rgba(13,148,136,.2);color:var(--accent);font-size:.84375rem;font-weight:500}.auth-form{padding:32px 36px;display:flex;flex-direction:column;gap:20px}.auth-field{display:flex;flex-direction:column;gap:8px}.auth-field label{font-size:.875rem;font-weight:600;color:var(--text-secondary);transition:color .3s}.auth-input-wrap{position:relative}.auth-input-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:var(--text-muted);pointer-events:none;transition:color .2s}.auth-input-wrap input{width:100%;padding:14px 16px 14px 44px;border:1px solid var(--input-border);border-radius:12px;background:var(--input-bg);color:var(--input-text);font-size:1rem;font-family:inherit;transition:border-color .2s,box-shadow .2s,background .3s}.auth-input-wrap input::placeholder{color:var(--input-placeholder)}.auth-input-wrap input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-muted)}.auth-input-wrap input:focus+.auth-input-icon,.auth-input-wrap:focus-within .auth-input-icon{color:var(--accent)}.auth-input-wrap input:disabled{opacity:.6;cursor:not-allowed}.auth-submit-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:16px;border:none;border-radius:14px;background:var(--accent);color:#fff;font-size:1rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 4px 16px var(--accent-glow);transition:all .25s ease;margin-top:4px}.auth-submit-btn:hover:not(:disabled){background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 8px 24px var(--accent-glow)}.auth-submit-btn:disabled{opacity:.6;cursor:not-allowed}.auth-submit-btn svg{width:18px;height:18px}.auth-spinner{width:18px;height:18px;border:2.5px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .75s linear infinite;flex-shrink:0}.auth-card-footer{padding:20px 36px 28px;text-align:center;border-top:1px solid var(--glass-border-dim)}.auth-card-footer p{font-size:.875rem;color:var(--text-muted);margin:0;transition:color .3s}.auth-card-footer a{color:var(--accent);font-weight:600;text-decoration:none}.auth-card-footer a:hover{text-decoration:underline}@media (max-width: 480px){.auth-container{padding:24px 16px}.auth-form{padding:28px 24px}.auth-card-header{padding:32px 24px 24px}.auth-card-footer{padding:16px 24px 24px}}.landing-page{min-height:100vh;background:transparent;font-family:Plus Jakarta Sans,system-ui,-apple-system,sans-serif}.lp-section-inner{max-width:1200px;margin:0 auto;padding:0 32px}.lp-header{position:sticky;top:0;z-index:200;background:var(--glass-bg);backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border-bottom:1px solid var(--glass-border-dim);box-shadow:inset 0 1px 0 var(--glass-specular),0 1px 0 var(--glass-border-dim),0 4px 24px #0000000f;transition:background .35s ease}.lp-header-inner{max-width:1200px;margin:0 auto;padding:16px 32px;display:flex;justify-content:space-between;align-items:center}.lp-logo{display:flex;align-items:center;gap:12px}.lp-logo-icon{width:40px;height:40px;border-radius:12px;background:var(--gradient-accent);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px var(--accent-glow)}.lp-logo-icon svg{width:22px;height:22px;color:#fff}.lp-logo-text{font-size:1.375rem;font-weight:800;letter-spacing:-.025em;color:var(--text-primary);transition:color .3s}.lp-nav{display:flex;align-items:center;gap:8px}.lp-theme-btn{width:40px;height:40px;border-radius:10px;border:1px solid var(--glass-border-dim);background:var(--glass-bg-light);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .22s ease}.lp-theme-btn:hover{background:var(--accent-muted);color:var(--accent);border-color:var(--accent)}.lp-theme-btn svg{width:19px;height:19px}.lp-nav-ghost{padding:9px 18px;background:transparent;border:1px solid var(--glass-border-dim);border-radius:10px;color:var(--text-secondary);font-size:.875rem;font-weight:600;font-family:inherit;cursor:pointer;transition:all .22s ease}.lp-nav-ghost:hover{background:var(--glass-bg-light);color:var(--text-primary);border-color:var(--glass-border)}.lp-nav-primary{display:flex;align-items:center;gap:6px;padding:10px 20px;background:var(--accent);border:none;border-radius:10px;color:#fff;font-size:.875rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 2px 12px var(--accent-glow);transition:all .22s ease}.lp-nav-primary:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 4px 20px var(--accent-glow)}.lp-nav-primary svg{width:16px;height:16px}.lp-hero{min-height:calc(100vh - 72px);display:flex;align-items:center;padding:80px 32px 60px}.lp-hero-inner{max-width:1200px;margin:0 auto;width:100%;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}.lp-hero-left{display:flex;flex-direction:column;align-items:flex-start;gap:28px}.lp-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:99px;background:var(--glass-bg);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);font-size:.8125rem;font-weight:600;color:var(--text-secondary);animation:fadeInUp .6s ease-out both}.lp-badge-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px #22c55eb3;flex-shrink:0;animation:pulse-green 2s ease-in-out infinite}@keyframes pulse-green{0%,to{opacity:1;box-shadow:0 0 6px #22c55eb3}50%{opacity:.75;box-shadow:0 0 14px #22c55ee6}}.lp-hero-title{font-size:clamp(2.5rem,5vw,4rem);font-weight:800;line-height:1.1;letter-spacing:-.035em;color:var(--text-primary);margin:0;animation:fadeInUp .6s ease-out .1s both;transition:color .3s}.lp-hero-sub{font-size:1.125rem;line-height:1.7;color:var(--text-secondary);max-width:520px;margin:0;animation:fadeInUp .6s ease-out .2s both;transition:color .3s}.lp-hero-actions{display:flex;gap:14px;flex-wrap:wrap;animation:fadeInUp .6s ease-out .3s both}.lp-btn-primary{display:inline-flex;align-items:center;gap:8px;padding:15px 28px;background:var(--accent);color:#fff;border:none;border-radius:14px;font-size:1rem;font-weight:700;font-family:inherit;cursor:pointer;box-shadow:0 4px 20px var(--accent-glow);transition:all .25s ease}.lp-btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 8px 28px var(--accent-glow)}.lp-btn-primary svg{width:18px;height:18px}.lp-btn-ghost{display:inline-flex;align-items:center;gap:8px;padding:15px 28px;background:var(--glass-bg);color:var(--text-primary);border:1px solid var(--glass-border);border-radius:14px;font-size:1rem;font-weight:600;font-family:inherit;cursor:pointer;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:all .25s ease}.lp-btn-ghost:hover{background:var(--glass-bg-heavy);border-color:var(--glass-border);transform:translateY(-1px)}.lp-stats{display:flex;align-items:center;gap:28px;padding:20px 28px;border-radius:16px;background:var(--glass-bg);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);animation:fadeInUp .6s ease-out .4s both}.lp-stat{display:flex;flex-direction:column;align-items:center;gap:2px}.lp-stat-num{font-size:1.75rem;font-weight:800;letter-spacing:-.03em;background:var(--gradient-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1}.lp-stat-plus{font-size:1.25rem}.lp-stat-lbl{font-size:.75rem;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;transition:color .3s}.lp-stat-sep{width:1px;height:36px;background:var(--glass-border);border-radius:99px}.lp-hero-right{position:relative;display:flex;align-items:center;justify-content:center;height:440px;animation:fadeInUp .7s ease-out .25s both}.lp-hv-card{width:340px;background:var(--glass-bg-heavy);backdrop-filter:blur(28px) saturate(200%);-webkit-backdrop-filter:blur(28px) saturate(200%);border-radius:20px;border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-specular),0 8px 32px #0000001f,0 32px 80px #0000001a;overflow:hidden;animation:cardFloat 6s ease-in-out infinite}@keyframes cardFloat{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-12px) rotate(1deg)}}.lp-hv-card-top{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--glass-border-dim)}.lp-hv-dots{display:flex;gap:5px}.lp-dot{width:11px;height:11px;border-radius:50%}.lp-dot-r{background:#ff5f56}.lp-dot-y{background:#ffbd2e}.lp-dot-g{background:#27c93f}.lp-hv-card-title{flex:1;text-align:center;font-size:.8125rem;font-weight:600;color:var(--text-secondary)}.lp-hv-card-actions{color:var(--text-muted);display:flex;align-items:center}.lp-hv-records{padding:8px 0}.lp-hv-row{display:flex;align-items:center;gap:12px;padding:12px 18px;transition:background .18s ease}.lp-hv-row:hover{background:var(--glass-bg-light)}.lp-hv-emoji{font-size:1.5rem;line-height:1;flex-shrink:0}.lp-hv-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.lp-hv-name{font-size:.875rem;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s}.lp-hv-date{font-size:.75rem;color:var(--text-muted);transition:color .3s}.lp-hv-type{font-size:.6875rem;font-weight:700;letter-spacing:.04em;padding:3px 8px;border-radius:6px;background:var(--accent-muted);color:var(--accent);flex-shrink:0}.lp-hv-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-top:1px solid var(--glass-border-dim)}.lp-hv-share-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;background:var(--accent);color:#fff;border-radius:9px;font-size:.78125rem;font-weight:700;box-shadow:0 2px 10px var(--accent-glow)}.lp-hv-secure-dot{width:10px;height:10px;border-radius:50%;background:#22c55e;box-shadow:0 0 8px #22c55eb3;animation:pulse-green 2s ease-in-out infinite}.lp-float{position:absolute;display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:99px;background:var(--glass-bg-heavy);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-specular),0 8px 24px #0000001a;font-size:.8125rem;font-weight:600;color:var(--text-secondary);white-space:nowrap}.lp-float-1{top:32px;left:-20px;animation:floatPill1 5s ease-in-out infinite}.lp-float-1 svg{color:var(--accent);flex-shrink:0}.lp-float-2{bottom:48px;right:-24px;border-radius:16px;padding:12px 18px;animation:floatPill2 6s ease-in-out infinite}.lp-float-num{display:block;font-size:1.25rem;font-weight:800;background:var(--gradient-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1}.lp-float-lbl{font-size:.75rem;color:var(--text-muted);margin-top:2px;display:block}@keyframes floatPill1{0%,to{transform:translateY(0) translate(0)}50%{transform:translateY(-8px) translate(4px)}}@keyframes floatPill2{0%,to{transform:translateY(0) translate(0)}50%{transform:translateY(6px) translate(-4px)}}.lp-features{padding:100px 32px}.lp-section-label{display:inline-block;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}.lp-section-title{font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:800;letter-spacing:-.03em;color:var(--text-primary);margin:0 0 12px;transition:color .3s}.lp-section-sub{font-size:1.0625rem;color:var(--text-secondary);margin:0 0 56px;max-width:500px;line-height:1.65;transition:color .3s}.lp-features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.lp-feature-card{padding:32px 28px;border-radius:20px;background:var(--glass-bg);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid var(--glass-border-dim);box-shadow:var(--glass-shadow);transition:all .3s ease;cursor:default}.lp-feature-card:hover{transform:translateY(-6px);border-color:var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-specular),0 4px 16px #0000000f,0 16px 48px #0000001a,0 0 0 1px var(--accent-muted)}.lp-feature-icon{width:52px;height:52px;border-radius:14px;background:var(--gradient-accent);display:flex;align-items:center;justify-content:center;margin-bottom:20px;box-shadow:0 4px 16px var(--accent-glow)}.lp-feature-icon svg{width:26px;height:26px;color:#fff}.lp-feature-title{font-size:1.0625rem;font-weight:700;color:var(--text-primary);margin:0 0 10px;transition:color .3s}.lp-feature-desc{font-size:.9375rem;color:var(--text-secondary);line-height:1.65;margin:0;transition:color .3s}.lp-cta{padding:80px 32px 100px}.lp-cta-card{position:relative;overflow:hidden;border-radius:28px;padding:72px 48px;text-align:center;background:linear-gradient(135deg,#0f766e,#0d9488 40%,#14b8a6 75%,#6366f1);box-shadow:0 8px 32px #0d94884d,0 32px 80px #0d948833}.lp-cta-glow{position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;border-radius:inherit;background:linear-gradient(135deg,#ffffff26,#fff0,#ffffff14);pointer-events:none}.lp-cta-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E");pointer-events:none}.lp-cta-content{position:relative;z-index:1}.lp-cta-title{font-size:clamp(1.75rem,4vw,2.75rem);font-weight:800;letter-spacing:-.03em;color:#fff;margin:0 0 12px}.lp-cta-sub{font-size:1.1rem;color:#ffffffe0;margin:0 0 36px;line-height:1.65}.lp-cta-btn{display:inline-flex;align-items:center;gap:8px;padding:17px 36px;background:#fffffff5;color:#0f766e;border:none;border-radius:14px;font-size:1.0625rem;font-weight:800;font-family:inherit;cursor:pointer;box-shadow:0 4px 16px #0000001f,inset 0 1px #fff;transition:all .25s ease}.lp-cta-btn:hover{background:#fff;transform:translateY(-2px);box-shadow:0 8px 32px #0000002e}.lp-cta-btn svg{width:18px;height:18px}.lp-footer{padding:28px 32px;text-align:center;background:var(--footer-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.lp-footer p{margin:0;font-size:.8125rem;color:var(--footer-text);transition:color .3s}@keyframes fadeInUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 1024px){.lp-features-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 900px){.lp-hero-inner{grid-template-columns:1fr;gap:60px}.lp-hero-right{display:none}.lp-hero-left{align-items:center;text-align:center}.lp-hero-sub{max-width:100%}.lp-hero-actions,.lp-stats{justify-content:center}.lp-badge{align-self:center}.lp-hero{min-height:auto;padding:64px 24px 56px}}@media (max-width: 640px){.lp-header-inner{padding:14px 20px}.lp-features{padding:72px 20px}.lp-features-grid{grid-template-columns:1fr}.lp-cta{padding:60px 20px 80px}.lp-cta-card{padding:48px 24px}.lp-hero-actions{flex-direction:column;width:100%}.lp-btn-primary,.lp-btn-ghost{justify-content:center;width:100%}.lp-stats{flex-wrap:wrap;gap:16px}.lp-stat-sep{display:none}}.reg-container{padding-top:40px;padding-bottom:40px}.auth-topbar{max-width:720px}.reg-card{max-width:720px!important}.reg-form{padding:32px 36px;display:flex;flex-direction:column;gap:28px}.reg-section{display:flex;flex-direction:column;gap:18px}.reg-section-heading{display:flex;align-items:center;gap:10px;font-size:.875rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);padding-bottom:12px;border-bottom:1px solid var(--glass-border-dim);transition:color .3s,border-color .3s}.reg-section-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0}.reg-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.reg-form .auth-field label{font-size:.875rem;font-weight:600;color:var(--text-secondary);display:block;margin-bottom:8px;transition:color .3s}.reg-form .auth-field input,.reg-form .auth-field textarea,.reg-form .auth-field select{width:100%;padding:13px 16px;border:1px solid var(--input-border);border-radius:12px;background:var(--input-bg);color:var(--input-text);font-size:.9375rem;font-family:inherit;transition:border-color .2s,box-shadow .2s,background .3s;resize:vertical}.reg-form .auth-field input::placeholder,.reg-form .auth-field textarea::placeholder{color:var(--input-placeholder)}.reg-form .auth-field input:focus,.reg-form .auth-field textarea:focus,.reg-form .auth-field select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-muted)}.reg-form .auth-field input.error,.reg-form .auth-field textarea.error,.reg-form .auth-field select.error{border-color:#dc2626;box-shadow:0 0 0 3px #dc26261a}.field-error{font-size:.8125rem;font-weight:500;color:#dc2626;margin-top:5px}.reg-submit-wrap{padding-top:4px}@media (max-width: 640px){.reg-row{grid-template-columns:1fr}.reg-form{padding:28px 24px}.reg-card.auth-card{max-width:100%!important}}.secure-access-container{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);padding:40px 20px}.loading-card,.error-card{max-width:500px;margin:100px auto;background:#fff;padding:60px 40px;border-radius:16px;text-align:center;box-shadow:0 10px 40px #0003}.spinner{width:50px;height:50px;border:4px solid rgba(102,126,234,.3);border-top-color:#667eea;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}.loading-card p,.error-card p{font-size:16px;color:#718096}.error-icon{width:80px;height:80px;color:#e53e3e;margin:0 auto 20px}.error-card h2{font-size:24px;color:#2d3748;margin-bottom:10px;font-weight:700}.access-header{background:#fff;border-radius:12px;padding:30px;margin-bottom:25px;box-shadow:0 4px 12px #0003}.access-header-content{display:flex;align-items:center;gap:20px}.header-icon{width:50px;height:50px;color:#667eea}.access-header h1{font-size:28px;color:#2d3748;margin:0 0 5px;font-weight:700}.access-header p{font-size:14px;color:#718096;margin:0}.patient-record-card{max-width:800px;margin:0 auto 25px;background:#fff;padding:35px;border-radius:12px;box-shadow:0 4px 12px #0003}.patient-info-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px;padding-bottom:20px;border-bottom:2px solid #edf2f7}.patient-info-header h2{font-size:26px;color:#2d3748;margin:0 0 8px;font-weight:700}.patient-mrn{font-size:14px;color:#718096;font-family:monospace;font-weight:600;margin:0}.study-badge{padding:8px 16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:13px;font-weight:700;text-transform:uppercase}.record-info{margin-bottom:25px}.record-description{font-size:15px;color:#4a5568;line-height:1.7;margin-bottom:15px}.record-meta{display:flex;gap:20px;font-size:14px;color:#718096}.view-files-button{width:100%;padding:16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:all .3s ease}.view-files-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.access-notice{max-width:800px;margin:0 auto;background:#fffffff2;padding:20px 25px;border-radius:10px;display:flex;gap:15px;align-items:flex-start}.access-notice svg{width:24px;height:24px;color:#667eea;flex-shrink:0;margin-top:2px}.access-notice p{font-size:13px;color:#4a5568;margin:0 0 8px;line-height:1.6}.access-info{color:#718096!important;font-size:12px!important}@media (max-width: 768px){.access-header-content{flex-direction:column;text-align:center}.patient-info-header{flex-direction:column;gap:15px}.record-meta{flex-direction:column;gap:10px}}.admin-dashboard{padding:40px;max-width:1400px;margin:0 auto}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:25px;margin-bottom:40px}.dashboard-card{background:#fff;border:2px solid #e2e8f0;border-radius:16px;padding:30px;display:flex;align-items:center;gap:20px;cursor:pointer;transition:all .3s ease;text-align:left}.dashboard-card:hover{border-color:var(--card-color);transform:translateY(-4px);box-shadow:0 8px 20px #0000001a}.card-icon{width:70px;height:70px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.card-icon svg{width:36px;height:36px;color:#fff}.card-content{flex:1}.card-content h3{font-size:20px;color:#2d3748;margin:0 0 8px;font-weight:700}.card-content p{font-size:14px;color:#718096;margin:0;line-height:1.5}.card-arrow{width:24px;height:24px;color:#cbd5e0;flex-shrink:0;transition:all .2s ease}.dashboard-card:hover .card-arrow{color:var(--card-color);transform:translate(5px)}.quick-actions{background:#fff;padding:30px;border-radius:16px;box-shadow:0 2px 8px #0000001a}.quick-actions h3{font-size:22px;color:#2d3748;margin-bottom:20px;font-weight:600}.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:15px}.quick-action-button{padding:16px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s ease}.quick-action-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}@media (max-width: 768px){.admin-dashboard{padding:20px}.dashboard-welcome h1{font-size:28px}.dashboard-grid{grid-template-columns:1fr}.dashboard-card{padding:20px}}.staff-dashboard{padding:40px;max-width:1400px;margin:0 auto}.dashboard-welcome{margin-bottom:40px}.dashboard-welcome h1{font-size:36px;color:#2d3748;font-weight:700;margin:0 0 10px}.dashboard-welcome p{font-size:16px;color:#718096;margin:0}.quick-actions-section{background:#fff;padding:30px;border-radius:16px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.quick-actions-section h3{font-size:22px;color:#2d3748;margin-bottom:20px;font-weight:600}.actions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.action-card{background:#fff;border:2px solid #e2e8f0;border-radius:12px;padding:25px;display:flex;align-items:center;gap:20px;cursor:pointer;transition:all .3s ease;text-align:left}.action-card:hover{border-color:var(--action-color);transform:translateY(-4px);box-shadow:0 8px 20px #0000001a}.action-icon{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.action-icon svg{width:30px;height:30px;color:#fff}.action-content h4{font-size:18px;color:#2d3748;margin:0 0 5px;font-weight:700}.action-content p{font-size:13px;color:#718096;margin:0}.recent-patients-section{background:#fff;padding:30px;border-radius:16px;box-shadow:0 2px 8px #0000001a}.view-all-button{padding:10px 20px;background:#edf2f7;color:#667eea;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.view-all-button:hover{background:#667eea;color:#fff}.patients-list{display:flex;flex-direction:column;gap:15px}.patient-preview-card{border:2px solid #e2e8f0;border-radius:12px;padding:20px;display:flex;align-items:center;gap:20px;cursor:pointer;transition:all .2s ease;background:#fff;text-align:left}.patient-preview-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea1a}.patient-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex-shrink:0}.patient-info{flex:1}.patient-info h4{font-size:16px;color:#2d3748;margin:0 0 5px;font-weight:600}.patient-info p{font-size:13px;color:#718096;margin:0;font-family:monospace}.card-arrow{width:24px;height:24px;color:#cbd5e0;flex-shrink:0}.empty-state{text-align:center;padding:60px 20px}.empty-state p{font-size:15px;color:#a0aec0;margin-bottom:20px}.loading-state{text-align:center;padding:40px;color:#718096}@media (max-width: 768px){.staff-dashboard{padding:20px}.dashboard-welcome h1{font-size:28px}.actions-grid{grid-template-columns:1fr}.section-header{flex-direction:column;align-items:flex-start;gap:15px}.view-all-button{width:100%}}.patient-dashboard{min-height:100vh;background:#f7fafc}.patient-header{background:#fff;padding:30px 40px;box-shadow:0 2px 10px #0000000d;display:flex;justify-content:space-between;align-items:center}.header-content h1{font-size:32px;color:#2d3748;font-weight:700;margin:0 0 8px}.header-content p{font-size:16px;color:#718096;margin:0}.logout-button{padding:12px 24px;background:#e53e3e;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.logout-button:hover{background:#c53030}.records-container{max-width:1400px;margin:0 auto;padding:40px}.empty-state{background:#fff;padding:80px 40px;border-radius:16px;text-align:center;box-shadow:0 2px 8px #0000001a}.empty-icon{width:100px;height:100px;color:#cbd5e0;margin:0 auto 25px}.empty-state h3{font-size:24px;color:#2d3748;margin-bottom:15px;font-weight:700}.empty-state p{font-size:16px;color:#a0aec0}.records-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:25px}.patient-record-card{background:#fff;border:2px solid #e2e8f0;border-radius:12px;padding:25px;transition:all .3s ease}.patient-record-card:hover{border-color:#667eea;box-shadow:0 8px 20px #667eea26;transform:translateY(-4px)}.record-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.study-badge{padding:8px 14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:12px;font-weight:700;text-transform:uppercase}.record-date{font-size:13px;color:#718096;font-weight:600}.record-description{font-size:15px;color:#4a5568;line-height:1.6;margin:0 0 20px}.record-card-footer{display:flex;justify-content:space-between;align-items:center;padding-top:20px;border-top:1px solid #edf2f7}.view-button{padding:10px 24px;background:#667eea;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.view-button:hover{background:#5568d3;transform:translateY(-1px)}@media (max-width: 768px){.patient-header{flex-direction:column;align-items:flex-start;gap:20px}.logout-button{width:100%}.records-grid{grid-template-columns:1fr}}.hospital-settings{padding:30px;max-width:1000px;margin:0 auto}.hospital-settings>h2{font-size:28px;color:#2d3748;margin-bottom:30px;font-weight:700}.settings-section{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.settings-section h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600;border-bottom:2px solid #edf2f7;padding-bottom:10px}.settings-form .form-group{margin-bottom:20px}.settings-form label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:8px}.settings-form input,.settings-form textarea{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:15px;transition:all .2s ease;font-family:inherit}.settings-form input:focus,.settings-form textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.settings-form input.error,.settings-form textarea.error{border-color:#e53e3e}.save-button{padding:14px 32px;background:#667eea;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease}.save-button:hover:not(:disabled){background:#5568d3;transform:translateY(-1px)}.save-button:disabled{opacity:.6;cursor:not-allowed}.branding-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px}.logo-upload label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:15px}.current-logo{width:150px;height:150px;border:2px solid #e2e8f0;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:15px;background:#fff;padding:10px}.current-logo img{max-width:100%;max-height:100%;object-fit:contain}.upload-logo-button{display:inline-block;padding:10px 20px;background:#edf2f7;color:#667eea;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.upload-logo-button:hover{background:#e2e8f0}.help-text{font-size:12px;color:#a0aec0;margin-top:8px}.color-picker label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:15px}.color-input-group{display:flex;align-items:center;gap:15px}.color-input-group input[type=color]{width:80px;height:50px;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer}.color-value{font-family:monospace;font-size:14px;color:#4a5568;font-weight:600}@media (max-width: 1024px){.branding-grid{grid-template-columns:1fr}}.staff-management{padding:30px;max-width:1400px;margin:0 auto}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.section-header h2{font-size:28px;color:#2d3748;font-weight:700;margin:0 0 5px}.section-header p{color:#718096;font-size:14px;margin:0}.invite-button{padding:12px 24px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.invite-button:hover{background:#5568d3;transform:translateY(-1px)}.invite-form-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.invite-form-card h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600}.invite-form .form-group{margin-bottom:20px}.invite-form label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:8px}.invite-form input,.invite-form select{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:15px;transition:all .2s ease}.invite-form input:focus,.invite-form select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.invite-form input.error,.invite-form select.error{border-color:#e53e3e}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.submit-button{width:100%;padding:14px;background:#667eea;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:10px}.submit-button:hover:not(:disabled){background:#5568d3}.staff-list{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.staff-list-header h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600}.staff-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px}.staff-card{border:2px solid #e2e8f0;border-radius:12px;padding:20px;display:flex;justify-content:space-between;align-items:center;transition:all .2s ease}.staff-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea1a}.staff-card.inactive{opacity:.6;background:#f7fafc}.staff-info{display:flex;gap:15px;align-items:center}.staff-avatar{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700;flex-shrink:0}.staff-details h4{font-size:16px;color:#2d3748;margin:0 0 5px;font-weight:600}.staff-email{font-size:13px;color:#718096;margin:0 0 8px}.role-badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase}.role-admin{background:#fef5e7;color:#d69e2e}.role-radiologist{background:#e6f2ff;color:#2b6cb0}.role-technician{background:#f0fdf4;color:#22863a}.role-reception{background:#fce7f3;color:#9d174d}.staff-actions{display:flex;gap:10px}.deactivate-button,.activate-button{padding:8px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.deactivate-button{background:#fed7d7;color:#c53030}.deactivate-button:hover{background:#fc8181;color:#fff}.activate-button{background:#c6f6d5;color:#22863a}.activate-button:hover{background:#48bb78;color:#fff}@media (max-width: 768px){.staff-grid{grid-template-columns:1fr}.section-header{flex-direction:column;align-items:flex-start;gap:15px}.invite-button{width:100%}.form-row{grid-template-columns:1fr}}.analytics-dashboard{padding:30px;max-width:1400px;margin:0 auto}.analytics-dashboard>h2{font-size:28px;color:#2d3748;margin-bottom:30px;font-weight:700}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px}.metric-card{background:#fff;padding:25px;border-radius:12px;box-shadow:0 2px 8px #0000001a;display:flex;align-items:center;gap:20px;transition:all .2s ease}.metric-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.metric-icon{width:60px;height:60px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.metric-icon svg{width:30px;height:30px;color:#fff}.metric-icon.patients{background:linear-gradient(135deg,#667eea,#764ba2)}.metric-icon.records{background:linear-gradient(135deg,#48bb78,#38a169)}.metric-icon.storage{background:linear-gradient(135deg,#ed8936,#dd6b20)}.metric-icon.staff{background:linear-gradient(135deg,#4299e1,#3182ce)}.metric-icon.links{background:linear-gradient(135deg,#9f7aea,#805ad5)}.metric-icon.views{background:linear-gradient(135deg,#f56565,#e53e3e)}.metric-content h3{font-size:14px;color:#718096;font-weight:600;margin:0 0 8px;text-transform:uppercase;letter-spacing:.5px}.metric-value{font-size:32px;color:#2d3748;font-weight:700;margin:0}.chart-section{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.chart-section h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600}.activity-section{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.activity-section h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600}.activity-list{display:flex;flex-direction:column;gap:15px}.activity-item{display:flex;gap:15px;padding:15px;background:#f7fafc;border-radius:8px;border-left:3px solid #667eea}.activity-icon{width:40px;height:40px;background:#edf2f7;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.activity-icon svg{width:20px;height:20px;color:#667eea}.activity-content{flex:1}.activity-action{font-size:14px;color:#2d3748;font-weight:500;margin:0 0 5px}.activity-time{font-size:12px;color:#a0aec0;margin:0}@media (max-width: 768px){.metrics-grid{grid-template-columns:1fr}.metric-value{font-size:24px}}.billing-dashboard{padding:30px;max-width:1400px;margin:0 auto}.billing-dashboard>h2{font-size:28px;color:#2d3748;margin-bottom:30px;font-weight:700}.current-plan-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.plan-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px;padding-bottom:20px;border-bottom:2px solid #edf2f7}.plan-header h3{font-size:20px;color:#2d3748;font-weight:600;margin:0 0 8px}.plan-name{font-size:24px;color:#667eea;font-weight:700;margin:0}.status-badge{padding:8px 16px;border-radius:20px;font-size:12px;font-weight:700;text-transform:uppercase}.status-badge.active{background:#c6f6d5;color:#22543d}.status-badge.trial{background:#bee3f8;color:#2c5282}.status-badge.expired{background:#fed7d7;color:#742a2a}.plan-details{display:flex;flex-direction:column;gap:15px}.detail-row{display:flex;justify-content:space-between;align-items:center;font-size:15px;color:#4a5568}.detail-value{font-weight:700;color:#2d3748}.usage-metrics-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.usage-metrics-card h3{font-size:20px;color:#2d3748;margin-bottom:25px;font-weight:600}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:25px}.usage-metric{text-align:center;padding:25px;background:#f7fafc;border-radius:10px;border:2px solid #e2e8f0}.metric-label{display:block;font-size:13px;color:#718096;font-weight:600;text-transform:uppercase;margin-bottom:12px;letter-spacing:.5px}.metric-value{display:block;font-size:32px;color:#2d3748;font-weight:700;margin-bottom:5px}.metric-limit{font-size:14px;color:#a0aec0;font-weight:600}.plans-section{background:#fff;padding:40px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.plans-section h3{font-size:24px;color:#2d3748;margin-bottom:35px;font-weight:700;text-align:center}.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}.plan-card{background:#fff;border:2px solid #e2e8f0;border-radius:16px;overflow:hidden;transition:all .3s ease;position:relative}.plan-card:hover{transform:translateY(-6px);box-shadow:0 12px 30px #00000026}.plan-card.recommended{border-color:#667eea;border-width:3px}.recommended-badge{position:absolute;top:15px;right:15px;background:#fbbf24;color:#78350f;padding:6px 14px;border-radius:20px;font-size:11px;font-weight:700;text-transform:uppercase;z-index:1}.plan-card-header{padding:35px 30px;text-align:center;color:#fff}.plan-card-header h4{font-size:24px;margin:0 0 15px;font-weight:700}.plan-price{font-size:36px;font-weight:800;margin:0}.plan-price span{font-size:16px;font-weight:600;opacity:.9}.plan-features{list-style:none;padding:30px;margin:0}.plan-features li{display:flex;align-items:center;gap:12px;font-size:14px;color:#4a5568;margin-bottom:15px;line-height:1.5}.plan-features svg{width:20px;height:20px;color:#48bb78;flex-shrink:0}.upgrade-button{width:calc(100% - 60px);margin:0 30px 30px;padding:14px;color:#fff;border:none;border-radius:8px;font-weight:700;font-size:15px;cursor:pointer;transition:all .2s ease}.upgrade-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0003}.payment-notice{background:#fff;padding:25px 30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;display:flex;gap:20px;align-items:flex-start}.payment-notice svg{width:28px;height:28px;color:#667eea;flex-shrink:0}.payment-notice p{font-size:14px;color:#4a5568;line-height:1.7;margin:0}@media (max-width: 1024px){.plans-grid{grid-template-columns:1fr}}@media (max-width: 768px){.metrics-grid{grid-template-columns:1fr}.plan-header{flex-direction:column;align-items:flex-start;gap:15px}}.branding-customization{padding:30px;max-width:1000px;margin:0 auto}.branding-customization>h2{font-size:28px;color:#2d3748;font-weight:700;margin-bottom:10px}.section-description{font-size:15px;color:#718096;margin-bottom:35px}.branding-section{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.branding-section h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600;border-bottom:2px solid #edf2f7;padding-bottom:10px}.logo-upload-area{text-align:center}.current-logo-preview{width:200px;height:200px;margin:0 auto 25px;border:3px dashed #e2e8f0;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#f7fafc;padding:20px}.current-logo-preview img{max-width:100%;max-height:100%;object-fit:contain}.upload-button{display:inline-block;padding:14px 32px;background:#667eea;color:#fff;border-radius:8px;font-weight:600;font-size:15px;cursor:pointer;transition:all .2s ease}.upload-button:hover{background:#5568d3;transform:translateY(-1px)}.help-text{font-size:13px;color:#a0aec0;margin-top:12px}.colors-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.color-picker-group label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:12px}.color-input-wrapper{display:flex;gap:12px;margin-bottom:15px}.color-input-wrapper input[type=color]{width:80px;height:50px;border:2px solid #e2e8f0;border-radius:8px;cursor:pointer}.color-hex-input{flex:1;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-family:monospace;font-size:14px;font-weight:600}.color-preview{width:100%;height:80px;border-radius:8px;border:2px solid #e2e8f0}.domain-input-group{display:flex;gap:15px;margin-bottom:20px}.domain-input{flex:1;padding:14px 18px;border:2px solid #e2e8f0;border-radius:8px;font-size:15px;font-family:monospace}.domain-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.save-domain-button{padding:14px 28px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:15px;cursor:pointer;transition:all .2s ease}.save-domain-button:hover{background:#5568d3}.domain-setup-guide{background:#f7fafc;padding:20px;border-radius:8px;border-left:4px solid #667eea}.domain-setup-guide h4{font-size:16px;color:#2d3748;margin-bottom:15px;font-weight:600}.domain-setup-guide ol{margin:0;padding-left:20px}.domain-setup-guide li{font-size:14px;color:#4a5568;margin-bottom:10px;line-height:1.6}.domain-setup-guide code{background:#fff;padding:3px 8px;border-radius:4px;font-family:monospace;color:#667eea;font-weight:600}.branding-preview{padding:60px 40px;border-radius:12px;text-align:center;color:#fff;transition:all .3s ease}.preview-logo{height:60px;margin-bottom:25px;filter:brightness(0) invert(1)}.branding-preview h1{font-size:32px;margin-bottom:15px;font-weight:700}.branding-preview p{font-size:16px;opacity:.95;margin-bottom:30px}.preview-button{padding:14px 32px;background:#fff;color:#667eea;border:none;border-radius:8px;font-weight:700;font-size:15px;cursor:pointer}@media (max-width: 768px){.colors-grid{grid-template-columns:1fr}.domain-input-group{flex-direction:column}.save-domain-button{width:100%}}.patient-list-container{padding:30px;max-width:1400px;margin:0 auto}.list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.list-header h2{font-size:28px;color:#2d3748;font-weight:700;margin:0 0 5px}.list-header p{color:#718096;font-size:14px;margin:0}.create-button{padding:12px 24px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.create-button:hover{background:#5568d3;transform:translateY(-1px)}.search-bar{position:relative;margin-bottom:25px}.search-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:#a0aec0}.search-input{width:100%;padding:14px 14px 14px 45px;border:2px solid #e2e8f0;border-radius:10px;font-size:15px;transition:all .2s ease}.search-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.patients-table{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.patients-table table{width:100%;border-collapse:collapse}.patients-table thead{background:#f7fafc;border-bottom:2px solid #e2e8f0}.patients-table th{padding:15px 20px;text-align:left;font-size:12px;font-weight:700;color:#718096;text-transform:uppercase;letter-spacing:.5px}.patients-table tbody tr{border-bottom:1px solid #edf2f7;transition:background .2s ease}.patients-table tbody tr:hover{background:#f7fafc}.patients-table td{padding:18px 20px;font-size:14px;color:#2d3748}.patient-name{font-weight:600;color:#2d3748}.mrn{font-family:monospace;color:#667eea;font-weight:600}.contact-info{display:flex;flex-direction:column;gap:4px}.contact-item{font-size:13px;color:#718096}.no-contact{color:#a0aec0;font-size:13px;font-style:italic}.view-button{padding:8px 16px;background:#edf2f7;color:#667eea;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.view-button:hover{background:#667eea;color:#fff}.empty-state{padding:80px 40px;text-align:center}.empty-icon{width:100px;height:100px;color:#cbd5e0;margin:0 auto 20px}.empty-state h3{font-size:22px;color:#4a5568;margin-bottom:10px;font-weight:600}.empty-state p{font-size:15px;color:#a0aec0;margin-bottom:25px}.empty-action-button:hover{background:#5568d3;transform:translateY(-2px)}@media (max-width: 1024px){.patients-table{overflow-x:auto}.patients-table table{min-width:900px}}@media (max-width: 768px){.list-header{flex-direction:column;align-items:flex-start;gap:15px}.create-button{width:100%}}.create-patient-container{padding:30px;max-width:800px;margin:0 auto}.page-header{margin-bottom:30px}.back-button{padding:10px 20px;background:#edf2f7;color:#667eea;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;margin-bottom:15px}.page-header h2{font-size:28px;color:#2d3748;font-weight:700;margin:0}.patient-form .form-section{margin-bottom:35px}.patient-form .form-section h3{font-size:18px;color:#2d3748;margin-bottom:20px;font-weight:600;border-bottom:2px solid #edf2f7;padding-bottom:10px}.patient-form .form-group{margin-bottom:20px}.patient-form label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:8px}.patient-form input,.patient-form textarea{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:15px;transition:all .2s ease;font-family:inherit}.patient-form input:focus,.patient-form textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.patient-form input.error,.patient-form textarea.error{border-color:#e53e3e}.cancel-button:hover{background:#e2e8f0}@media (max-width: 768px){.create-patient-container{padding:20px}.form-card{padding:25px 20px}.form-actions{flex-direction:column-reverse}.cancel-button,.submit-button{width:100%}}.patient-details-container{padding:30px;max-width:1200px;margin:0 auto}.patient-info-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.patient-header{display:flex;gap:20px;align-items:center;margin-bottom:25px}.patient-avatar{width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:700}.patient-header-info h2{font-size:28px;color:#2d3748;margin:0 0 10px;font-weight:700}.patient-meta{display:flex;gap:15px;align-items:center}.mrn-badge{padding:5px 12px;background:#e6f2ff;color:#2b6cb0;border-radius:6px;font-size:13px;font-weight:600;font-family:monospace}.dob{font-size:14px;color:#718096}.patient-contact{display:flex;gap:30px;padding:20px;background:#f7fafc;border-radius:8px}.contact-item{display:flex;align-items:center;gap:10px}.contact-item svg{width:18px;height:18px;color:#667eea}.contact-item span{font-size:14px;color:#4a5568}.records-section{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.section-header h3{font-size:22px;color:#2d3748;font-weight:600;margin:0}.create-record-button{padding:12px 24px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.create-record-button:hover{background:#5568d3;transform:translateY(-1px)}.empty-records{text-align:center;padding:60px 20px}.empty-icon{width:80px;height:80px;color:#cbd5e0;margin:0 auto 20px}.empty-records p{font-size:16px;color:#a0aec0;margin-bottom:20px}.empty-action-button{padding:12px 28px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.empty-action-button:hover{background:#5568d3}.records-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.record-card{border:2px solid #e2e8f0;border-radius:12px;padding:20px;transition:all .2s ease}.record-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea1a}.record-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.study-type-badge{padding:6px 14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:6px;font-size:12px;font-weight:700;text-transform:uppercase}.scan-date{font-size:13px;color:#718096;font-weight:500}.record-description{font-size:14px;color:#4a5568;margin:0 0 20px;line-height:1.6}.record-footer{display:flex;justify-content:space-between;align-items:center;padding-top:15px;border-top:1px solid #edf2f7}.file-count{font-size:13px;color:#718096;font-weight:600}.view-record-button{padding:8px 20px;background:#667eea;color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease}.view-record-button:hover{background:#5568d3}.loading-state{text-align:center;padding:60px 20px;color:#718096;font-size:16px}.error-state{text-align:center;padding:60px 20px;color:#e53e3e;font-size:16px}@media (max-width: 768px){.patient-header{flex-direction:column;text-align:center}.patient-contact{flex-direction:column;gap:15px}.records-grid{grid-template-columns:1fr}.section-header{flex-direction:column;align-items:flex-start;gap:15px}.create-record-button{width:100%}}.upload-zone{border:3px dashed #cbd5e0;border-radius:12px;padding:60px 40px;text-align:center;background:#f7fafc;cursor:pointer;transition:all .3s ease}.upload-zone:hover{border-color:#667eea;background:#edf2f7}.upload-zone.drag-active{border-color:#667eea;background:#e6f2ff;transform:scale(1.02)}.upload-icon{width:80px;height:80px;color:#a0aec0;margin:0 auto 20px;transition:all .3s ease}.upload-zone:hover .upload-icon{color:#667eea;transform:translateY(-5px)}.upload-text h3{font-size:20px;color:#2d3748;margin-bottom:10px;font-weight:600}.upload-text p{font-size:14px;color:#718096;margin:5px 0}.file-limit{font-size:13px;color:#a0aec0;font-style:italic;margin-top:10px}.create-record-container{padding:30px;max-width:900px;margin:0 auto}.page-header h2{font-size:28px;color:#2d3748;font-weight:700;margin-top:10px}.form-card{background:#fff;padding:40px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.record-form .form-section{margin-bottom:35px}.record-form .form-section h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600;border-bottom:2px solid #edf2f7;padding-bottom:10px}.record-form .form-group{margin-bottom:20px}.record-form label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:8px}.record-form input,.record-form textarea,.record-form select{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:15px;transition:all .2s ease;font-family:inherit}.record-form input:focus,.record-form textarea:focus,.record-form select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.record-form input.error,.record-form textarea.error,.record-form select.error{border-color:#e53e3e}.error-message{color:#e53e3e;font-size:13px;margin-top:5px}.files-preview{margin-top:25px;padding:20px;background:#f7fafc;border-radius:10px}.files-preview h4{font-size:16px;color:#2d3748;margin-bottom:15px;font-weight:600}.files-list{display:flex;flex-direction:column;gap:12px}.file-preview-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#fff;border:1px solid #e2e8f0;border-radius:8px}.file-info{display:flex;gap:12px;align-items:center;flex:1}.file-icon{width:24px;height:24px;color:#667eea;flex-shrink:0}.file-details{flex:1}.file-name{font-size:14px;color:#2d3748;font-weight:500;margin:0 0 4px;word-break:break-word}.file-size{font-size:12px;color:#a0aec0;margin:0}.upload-status{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600;margin-right:10px}.upload-status.uploading{background:#bee3f8;color:#2c5282}.upload-status.success{background:#c6f6d5;color:#22543d}.upload-status.error{background:#fed7d7;color:#742a2a}.remove-file-button{width:28px;height:28px;background:#fed7d7;color:#c53030;border:none;border-radius:50%;font-size:16px;font-weight:700;cursor:pointer;transition:all .2s ease;flex-shrink:0}.remove-file-button:hover{background:#fc8181;color:#fff}.form-actions{display:flex;gap:15px;margin-top:30px;padding-top:30px;border-top:2px solid #edf2f7}.cancel-button{padding:14px 28px;background:#edf2f7;color:#4a5568;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease}.cancel-button:hover:not(:disabled){background:#e2e8f0}.cancel-button:disabled{opacity:.5;cursor:not-allowed}.submit-button{padding:14px 28px;background:#667eea;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s ease;flex:1}.submit-button:hover:not(:disabled){background:#5568d3;transform:translateY(-1px)}.submit-button:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.create-record-container{padding:20px}.form-card{padding:25px 20px}.form-actions{flex-direction:column-reverse}.cancel-button,.submit-button{width:100%}}.record-view-container{padding:30px;max-width:1200px;margin:0 auto}.page-header{margin-bottom:25px}.record-info-card{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:25px}.record-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px;padding-bottom:20px;border-bottom:2px solid #edf2f7}.record-header h2{font-size:26px;color:#2d3748;font-weight:700;margin:0 0 8px}.mrn{font-size:14px;color:#718096;font-family:monospace;font-weight:600}.study-type-badge{padding:8px 16px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:13px;font-weight:700;text-transform:uppercase}.record-details{display:flex;flex-direction:column;gap:15px}.detail-item{display:flex;gap:10px}.detail-label{font-size:14px;color:#718096;font-weight:600;min-width:120px}.detail-value{font-size:14px;color:#2d3748;font-weight:500}.files-section,.links-section{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:25px}.files-section h3,.links-section .section-header h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.generate-link-button{padding:10px 20px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.generate-link-button:hover{background:#5568d3}.file-card{border:2px solid #e2e8f0;border-radius:10px;padding:20px;text-align:center;transition:all .2s ease}.file-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea1a}.file-type-icon{width:48px;height:48px;color:#667eea;margin:0 auto 15px}.file-card-name{font-size:13px;color:#2d3748;font-weight:500;margin:0 0 8px;word-break:break-all}.file-card-type{display:inline-block;padding:4px 10px;background:#edf2f7;color:#667eea;border-radius:6px;font-size:11px;font-weight:600;text-transform:uppercase}.no-files{text-align:center;padding:40px;color:#a0aec0;font-size:15px}.link-generator-card{background:#f7fafc;padding:25px;border-radius:10px;margin-bottom:25px}.link-generator-card h4{font-size:18px;color:#2d3748;margin-bottom:20px;font-weight:600}.link-options{display:flex;flex-direction:column;gap:20px;margin-bottom:20px}.option-group label{display:block;font-size:14px;font-weight:600;color:#4a5568;margin-bottom:8px}.option-group input[type=checkbox]{margin-right:10px}.option-group input[type=number]{width:100%;padding:10px 14px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px}.create-link-button{width:100%;padding:14px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:15px;cursor:pointer;transition:all .2s ease}.create-link-button:hover{background:#5568d3}.links-list{display:flex;flex-direction:column;gap:20px}.link-card{border:2px solid #e2e8f0;border-radius:12px;padding:25px;display:flex;justify-content:space-between;gap:25px}.link-info{flex:1}.link-url-section{display:flex;gap:10px;margin-bottom:15px}.link-url-input{flex:1;padding:10px 14px;border:2px solid #e2e8f0;border-radius:8px;font-size:13px;font-family:monospace;color:#667eea;background:#f7fafc}.copy-button{padding:10px 20px;background:#667eea;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:13px;cursor:pointer;transition:all .2s ease}.copy-button:hover{background:#5568d3}.link-meta{display:flex;flex-wrap:wrap;gap:15px;font-size:13px;color:#718096}.auth-badge{padding:4px 10px;background:#fef5e7;color:#d69e2e;border-radius:6px;font-weight:600}.link-qr{flex-shrink:0;padding:10px;background:#fff;border:2px solid #e2e8f0;border-radius:8px}.loading-state,.error-state{text-align:center;padding:60px 20px;font-size:16px}.loading-state{color:#718096}.error-state{color:#e53e3e}@media (max-width: 768px){.link-card{flex-direction:column}.link-qr{align-self:center}.record-header{flex-direction:column;gap:15px}.files-grid{grid-template-columns:1fr}}.patient-viewer-container{min-height:100vh;background:#f7fafc}.viewer-header{background:#fff;padding:25px 40px;box-shadow:0 2px 10px #0000001a;display:flex;align-items:center;gap:25px}.back-button{padding:10px 20px;background:#edf2f7;color:#667eea;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.back-button:hover{background:#e2e8f0}.header-info h1{font-size:24px;color:#2d3748;margin:0 0 5px;font-weight:700}.header-info p{font-size:14px;color:#718096;margin:0}.files-browser{max-width:1400px;margin:0 auto;padding:40px}.file-category{background:#fff;padding:30px;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:30px}.file-category h3{font-size:20px;color:#2d3748;margin-bottom:20px;font-weight:600}.files-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:15px}.file-browser-card{background:#f7fafc;border:2px solid #e2e8f0;border-radius:10px;padding:25px 20px;text-align:center;cursor:pointer;transition:all .2s ease}.file-browser-card:hover{border-color:#667eea;box-shadow:0 4px 12px #667eea26;transform:translateY(-2px)}.file-browser-icon{width:56px;height:56px;color:#667eea;margin:0 auto 15px}.file-browser-name{font-size:13px;color:#2d3748;font-weight:500;margin:0 0 10px;word-break:break-all;line-height:1.4}.file-browser-type{display:inline-block;padding:4px 12px;background:#667eea;color:#fff;border-radius:6px;font-size:11px;font-weight:700}.viewer-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.viewer-loading .spinner{border-color:#ffffff4d;border-top-color:#fff}.viewer-loading p{font-size:16px;margin-top:20px}@media (max-width: 768px){.viewer-header{flex-direction:column;align-items:flex-start;padding:20px}.files-browser{padding:20px}.files-grid{grid-template-columns:1fr}}.viewer-container{width:100%;min-height:100vh;background:#f7fafc;display:flex;flex-direction:column}.viewer-header{background:#fff;padding:20px 30px;box-shadow:0 2px 10px #0000001a;display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center;gap:12px}.header-icon{width:32px;height:32px;color:#667eea}.viewer-header h1{font-size:24px;color:#2d3748;font-weight:700}.header-right{display:flex;align-items:center;gap:15px}.user-email{color:#718096;font-size:14px}.logout-button{padding:10px 20px;background:#e53e3e;color:#fff;border:none;border-radius:8px;font-weight:600;transition:all .2s ease}.logout-button:hover{background:#c53030;transform:translateY(-1px)}.viewer-content{display:flex;flex:1;overflow:hidden}.sidebar{width:320px;background:#fff;border-right:1px solid #e2e8f0;display:flex;flex-direction:column;overflow-y:auto}.files-section{padding:25px;flex:1}.files-section h2{font-size:16px;color:#2d3748;margin-bottom:15px;font-weight:600}.files-list{display:flex;flex-direction:column;gap:15px}.file-group{margin-bottom:15px}.folder-header{width:100%;display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(135deg,#667eea1a,#764ba21a);border:none;border-radius:8px;border-left:3px solid #667eea;cursor:pointer;transition:all .2s ease;margin-bottom:8px}.folder-header:hover{background:linear-gradient(135deg,#667eea26,#764ba226);transform:translate(2px)}.folder-icon{width:20px;height:20px;color:#667eea;flex-shrink:0}.folder-name{font-size:13px;font-weight:700;color:#667eea;text-transform:uppercase;letter-spacing:.5px;flex:1;text-align:left}.folder-count{font-size:12px;color:#718096;font-weight:600}.expand-icon{width:16px;height:16px;color:#667eea;transition:transform .2s ease;flex-shrink:0}.expand-icon.expanded{transform:rotate(180deg)}.file-list-items{display:flex;flex-direction:column;gap:6px;padding-left:10px}.no-files{color:#a0aec0;font-size:14px;text-align:center;padding:20px}.file-item{background:#f7fafc;border-radius:8px;overflow:hidden;transition:all .2s ease}.file-item:hover{background:#edf2f7}.file-item.active{background:#e6f2ff;border:2px solid #667eea}.file-name{width:100%;padding:10px 12px;background:transparent;border:none;text-align:left;display:flex;align-items:center;gap:8px;color:#2d3748;font-size:13px}.file-number{min-width:30px;padding:2px 8px;background:#edf2f7;border-radius:4px;font-size:11px;font-weight:600;color:#4a5568;flex-shrink:0}.file-name-text{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-icon{width:18px;height:18px;color:#667eea;flex-shrink:0}.pagination-controls{display:flex;flex-direction:column;gap:8px;margin-top:12px}.show-more,.show-less{width:100%;padding:10px;background:#edf2f7;border:none;border-radius:6px;color:#667eea;font-size:13px;font-weight:600;transition:all .2s ease;cursor:pointer}.show-more:hover,.show-less:hover{background:#e2e8f0;color:#5568d3}.show-less{background:#fef5e7;color:#d69e2e}.show-less:hover{background:#feebc8;color:#c97a1e}.viewer-main{flex:1;padding:30px;overflow-y:auto;display:flex;flex-direction:column;gap:20px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#a0aec0}.empty-icon{width:120px;height:120px;margin-bottom:20px;opacity:.5}.empty-state h2{font-size:24px;color:#4a5568;margin-bottom:10px}.empty-state p{font-size:16px}.viewer-tools{display:flex;gap:20px;background:#fff;padding:20px 25px;border-radius:12px;box-shadow:0 2px 8px #0000001a;flex-wrap:wrap;align-items:flex-start}.tool-section{display:flex;flex-direction:column;gap:8px}.tool-label{font-size:11px;font-weight:700;color:#718096;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px}.tool-group{display:flex;gap:8px;flex-wrap:wrap}.viewer-tools button{padding:10px 16px;background:#edf2f7;color:#2d3748;border:1px solid #cbd5e0;border-radius:8px;font-weight:600;font-size:14px;transition:all .2s ease;cursor:pointer;white-space:nowrap}.viewer-tools button:hover{background:#e2e8f0;border-color:#667eea;color:#667eea;transform:translateY(-1px)}.viewer-tools button.active{background:#667eea;color:#fff;border-color:#667eea}.viewer-tools button.active:hover{background:#5568d3}.viewer-tools button.playing{animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.reset-button{background:#e53e3e!important;color:#fff!important;border:none!important;margin-left:auto}.reset-button:hover{background:#c53030!important;color:#fff!important}.dicom-display{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden;position:relative}.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;z-index:10}.loading-overlay .spinner{border-color:#ffffff4d;border-top-color:#fff}.dicom-canvas{display:block;cursor:default}.dicom-canvas.panning{cursor:grab}.dicom-canvas.panning:active{cursor:grabbing}.image-info{background:#fff;padding:25px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.image-info h3{font-size:18px;color:#2d3748;margin-bottom:15px;font-weight:600}.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}.info-item{display:flex;flex-direction:column;gap:5px}.info-label{font-size:12px;color:#718096;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.info-value{font-size:15px;color:#2d3748;font-weight:500}.keyboard-shortcuts{background:#fff;padding:20px 25px;border-radius:12px;box-shadow:0 2px 8px #0000001a}.keyboard-shortcuts h4{font-size:16px;color:#2d3748;margin-bottom:15px;font-weight:600}.shortcuts-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.shortcut-item{display:flex;align-items:center;gap:10px;font-size:13px;color:#4a5568}.shortcut-item kbd{padding:4px 10px;background:#edf2f7;border:1px solid #cbd5e0;border-radius:4px;font-family:monospace;font-size:12px;font-weight:600;color:#667eea;min-width:40px;text-align:center;box-shadow:0 2px #cbd5e0}.shortcut-item span{color:#718096}.cine-player{background:linear-gradient(135deg,#667eea,#764ba2);padding:25px 30px;border-radius:12px;box-shadow:0 4px 20px #667eea4d;color:#fff}.cine-header{margin-bottom:15px}.cine-header h3{font-size:18px;color:#fff;margin-bottom:5px;font-weight:700}.cine-header p{font-size:14px;color:#ffffffe6}.cine-controls{display:flex;flex-direction:column;gap:15px}.cine-play-button{padding:16px 32px!important;background:#fff!important;color:#667eea!important;border:none!important;border-radius:8px;font-weight:700!important;font-size:16px!important;transition:all .3s ease;cursor:pointer;box-shadow:0 4px 12px #0003}.cine-play-button:hover{background:#f7fafc!important;transform:translateY(-2px);box-shadow:0 6px 16px #0000004d}.cine-info{font-size:14px;color:#fffffff2;font-weight:400;text-align:center}@media (max-width: 768px){.viewer-content{flex-direction:column}.sidebar{width:100%;border-right:none;border-bottom:1px solid #e2e8f0}.viewer-header{flex-direction:column;gap:15px}.header-right{width:100%;justify-content:space-between}}.cine-container{width:100%;min-height:100vh;background:#1a202c;display:flex;flex-direction:column;color:#fff}.cine-header-bar{background:#2d3748;padding:15px 30px;display:flex;align-items:center;gap:20px;box-shadow:0 2px 10px #0000004d}.back-button{padding:10px 20px;background:#4a5568;color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease}.back-button:hover{background:#667eea;transform:translate(-2px)}.cine-header-bar h1{font-size:20px;font-weight:700;color:#fff}.cine-content{flex:1;display:flex;flex-direction:column;padding:20px;gap:20px}.cine-display{background:#000;border-radius:12px;overflow:hidden;position:relative;box-shadow:0 4px 20px #00000080}.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;z-index:10}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:15px}.cine-canvas{display:block}.cine-controls-panel{background:#2d3748;padding:25px;border-radius:12px;display:flex;flex-direction:column;gap:20px;box-shadow:0 4px 20px #0000004d}.progress-section{display:flex;flex-direction:column;gap:12px}.progress-header{display:flex;justify-content:space-between;align-items:center}.progress-label{font-size:16px;font-weight:700;color:#fff}.current-file-name{font-size:12px;color:#a0aec0;font-family:monospace;max-width:400px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress-slider{width:100%;height:8px;border-radius:4px;background:#4a5568;outline:none;-webkit-appearance:none;cursor:pointer}.progress-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#667eea;cursor:pointer;transition:all .2s ease}.progress-slider::-webkit-slider-thumb:hover{background:#5568d3;transform:scale(1.2)}.progress-slider::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#667eea;cursor:pointer;border:none}.playback-controls{display:flex;flex-direction:column;gap:20px}.nav-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.nav-buttons button,.speed-buttons button{padding:12px 24px;background:#4a5568;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.nav-buttons button:hover,.speed-buttons button:hover{background:#667eea;transform:translateY(-2px)}.play-button{background:#48bb78!important;font-size:16px!important;padding:14px 32px!important}.play-button:hover{background:#38a169!important}.play-button.playing{background:#ed8936!important;animation:pulse-orange 1.5s infinite}@keyframes pulse-orange{0%,to{box-shadow:0 0 #ed8936b3}50%{box-shadow:0 0 0 15px #ed893600}}.speed-control{display:flex;flex-direction:column;gap:12px;align-items:center}.speed-control label{font-size:14px;color:#cbd5e0;font-weight:600}.speed-buttons{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.speed-buttons button{padding:8px 16px;font-size:13px}.speed-buttons button.active{background:#667eea;box-shadow:0 0 0 3px #667eea4d}.image-metadata{display:flex;gap:20px;flex-wrap:wrap;padding:15px 0;border-top:1px solid #4a5568;border-bottom:1px solid #4a5568}.meta-item{display:flex;gap:8px;align-items:center}.meta-label{font-size:12px;color:#a0aec0;font-weight:600;text-transform:uppercase}.meta-item span:last-child{font-size:14px;color:#fff;font-weight:500}.keyboard-help{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;padding:15px;background:#1a202c;border-radius:8px}.help-item{display:flex;align-items:center;gap:8px;font-size:13px;color:#cbd5e0}.help-item kbd{padding:4px 10px;background:#4a5568;border:1px solid #718096;border-radius:4px;font-family:monospace;font-size:12px;font-weight:600;color:#667eea;min-width:35px;text-align:center;box-shadow:0 2px #2d3748}@media (max-width: 768px){.cine-header-bar{flex-direction:column;gap:10px}.nav-buttons,.speed-buttons{flex-direction:column;width:100%}.nav-buttons button,.speed-buttons button{width:100%}}.image-viewer-container{height:100vh;display:flex;flex-direction:column;background:#1a202c}.viewer-toolbar{background:#2d3748;padding:15px 30px;display:flex;align-items:center;gap:30px;box-shadow:0 2px 10px #0000004d}.back-button{padding:10px 20px;background:#4a5568;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.back-button:hover{background:#718096}.viewer-controls{display:flex;gap:25px;align-items:center;flex:1}.control-group{display:flex;align-items:center;gap:10px}.control-group label{font-size:13px;color:#cbd5e0;font-weight:600;min-width:110px}.control-group button{padding:8px 16px;background:#4a5568;color:#fff;border:none;border-radius:6px;font-weight:700;cursor:pointer;transition:all .2s ease}.control-group button:hover{background:#667eea}.control-group input[type=range]{width:150px}.reset-button{padding:10px 20px;background:#e53e3e;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease;margin-left:auto}.reset-button:hover{background:#c53030}.image-display{flex:1;display:flex;align-items:center;justify-content:center;overflow:auto;padding:20px}.image-display img{max-width:100%;max-height:100%;object-fit:contain;transition:all .3s ease}.image-info{background:#2d3748;padding:15px 30px;text-align:center;color:#cbd5e0;font-size:14px}@media (max-width: 768px){.viewer-toolbar{flex-wrap:wrap;padding:15px}.viewer-controls{width:100%;flex-wrap:wrap;gap:15px}.control-group{flex-direction:column;align-items:flex-start}.reset-button{width:100%;margin-left:0}}.pdf-viewer-container{height:100vh;display:flex;flex-direction:column;background:#1a202c}.pdf-toolbar{background:#2d3748;padding:15px 30px;display:flex;align-items:center;gap:30px;box-shadow:0 2px 10px #0000004d}.pdf-controls{display:flex;gap:15px;align-items:center;flex:1}.pdf-controls button{padding:10px 20px;background:#4a5568;color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s ease}.pdf-controls button:hover:not(:disabled){background:#667eea}.pdf-controls button:disabled{opacity:.4;cursor:not-allowed}.page-info{font-size:14px;color:#cbd5e0;font-weight:600;min-width:130px;text-align:center}.zoom-controls{display:flex;align-items:center;gap:10px;padding:0 20px;border-left:1px solid #4a5568;border-right:1px solid #4a5568}.zoom-controls button{padding:8px 16px;min-width:40px}.zoom-controls span{font-size:14px;color:#cbd5e0;font-weight:600;min-width:60px;text-align:center}.reset-zoom{background:#e53e3e!important}.reset-zoom:hover{background:#c53030!important}.pdf-display{flex:1;display:flex;align-items:center;justify-content:center;overflow:auto;padding:20px}.pdf-display .react-pdf__Document{display:flex;flex-direction:column;align-items:center}.pdf-display .react-pdf__Page{box-shadow:0 4px 12px #00000080;background:#fff;margin:10px}.pdf-info{background:#2d3748;padding:15px 30px;text-align:center;color:#cbd5e0;font-size:14px}.viewer-loading{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#1a202c;color:#fff}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}.error-state{height:100vh;display:flex;align-items:center;justify-content:center;background:#1a202c;color:#fff;font-size:18px}@media (max-width: 768px){.pdf-toolbar{flex-wrap:wrap;padding:15px}.pdf-controls{width:100%;flex-wrap:wrap;gap:10px}}:root,[data-theme=light]{--accent: #0d9488;--accent-light: #14b8a6;--accent-hover: #0f766e;--accent-glow: rgba(13, 148, 136, .32);--accent-muted: rgba(13, 148, 136, .12);--accent-2: #6366f1;--gradient-accent: linear-gradient(135deg, #0d9488 0%, #6366f1 100%);--gradient-text: linear-gradient(135deg, #0d9488 0%, #6366f1 100%);--text-primary: #0a0a0f;--text-secondary: rgba(10, 10, 15, .62);--text-muted: rgba(10, 10, 15, .42);--text-on-accent: #ffffff;--glass-bg: rgba(255, 255, 255, .58);--glass-bg-heavy: rgba(255, 255, 255, .82);--glass-bg-light: rgba(255, 255, 255, .28);--glass-border: rgba(255, 255, 255, .7);--glass-border-dim: rgba(255, 255, 255, .35);--glass-specular: rgba(255, 255, 255, .92);--glass-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 2px 8px rgba(0, 0, 0, .04), 0 8px 24px rgba(0, 0, 0, .06), 0 24px 64px rgba(0, 0, 0, .04);--input-bg: rgba(255, 255, 255, .75);--input-border: rgba(0, 0, 0, .1);--input-border-focus: var(--accent);--input-text: var(--text-primary);--input-placeholder: rgba(10, 10, 15, .38);--orb-1: rgba(0, 200, 178, .55);--orb-2: rgba(120, 80, 255, .45);--orb-3: rgba(0, 185, 255, .38);--page-bg: transparent;--body-base: #eaf0f8;--footer-bg: rgba(10, 10, 15, .88);--footer-text: rgba(255, 255, 255, .48)}[data-theme=dark]{--accent: #2dd4bf;--accent-light: #5eead4;--accent-hover: #14b8a6;--accent-glow: rgba(45, 212, 191, .38);--accent-muted: rgba(45, 212, 191, .14);--accent-2: #818cf8;--gradient-accent: linear-gradient(135deg, #2dd4bf 0%, #818cf8 100%);--gradient-text: linear-gradient(135deg, #2dd4bf 0%, #818cf8 100%);--text-primary: rgba(255, 255, 255, .95);--text-secondary: rgba(255, 255, 255, .62);--text-muted: rgba(255, 255, 255, .4);--text-on-accent: #0a0a0f;--glass-bg: rgba(255, 255, 255, .07);--glass-bg-heavy: rgba(255, 255, 255, .13);--glass-bg-light: rgba(255, 255, 255, .03);--glass-border: rgba(255, 255, 255, .13);--glass-border-dim: rgba(255, 255, 255, .07);--glass-specular: rgba(255, 255, 255, .18);--glass-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 2px 8px rgba(0, 0, 0, .24), 0 8px 24px rgba(0, 0, 0, .32), 0 24px 64px rgba(0, 0, 0, .24);--input-bg: rgba(255, 255, 255, .06);--input-border: rgba(255, 255, 255, .1);--input-border-focus: var(--accent);--input-text: var(--text-primary);--input-placeholder: rgba(255, 255, 255, .32);--orb-1: rgba(13, 148, 136, .75);--orb-2: rgba(99, 102, 241, .65);--orb-3: rgba(45, 212, 191, .45);--body-base: #070b14;--footer-bg: rgba(0, 0, 0, .65);--footer-text: rgba(255, 255, 255, .32)}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:Plus Jakarta Sans,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:var(--text-primary);margin:0;padding:0;min-height:100vh;background:radial-gradient(ellipse 65% 55% at 8% 8%,var(--orb-1) 0%,transparent 52%),radial-gradient(ellipse 55% 50% at 92% 12%,var(--orb-2) 0%,transparent 50%),radial-gradient(ellipse 75% 65% at 50% 95%,var(--orb-3) 0%,transparent 55%),var(--body-base);background-attachment:fixed;transition:background-color .4s ease,color .3s ease;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.gradient-text{background:var(--gradient-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.glass{background:var(--glass-bg);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow)}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;background:transparent}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background:transparent;color:var(--text-primary)}.spinner{width:48px;height:48px;border:3px solid var(--glass-border);border-top-color:var(--accent);border-radius:50%;animation:spin .85s linear infinite;margin-bottom:20px}@keyframes spin{to{transform:rotate(360deg)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--glass-border);border-radius:99px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh}#root{min-height:100vh}button{cursor:pointer;font-family:inherit}input{font-family:inherit}