html,body,#root{width:100%;min-height:100vh;margin:0;padding:0}body{background:#040d1a}*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg-base:#040d1a;--bg-surface:#0a1628;--bg-card:#0f1f38;--bg-deep:#07112a;--bg-input:#060f21;--border-subtle:#639bff1a;--border-medium:#639bff2e;--border-strong:#639bff4d;--accent-blue:#3b82f6;--accent-blue-lt:#60a5fa;--accent-cyan:#22d3ee;--accent-violet:#818cf8;--accent-emerald:#10b981;--accent-amber:#f59e0b;--accent-rose:#f43f5e;--text-primary:#f0f6ff;--text-secondary:#b8cfe8;--text-muted:#7a9bbf;--text-label:#a0bdd8;--radius-sm:10px;--radius-md:16px;--radius-lg:22px;--radius-xl:30px;--shadow-card:0 4px 24px #00000073;--shadow-glow:0 0 40px #3b82f61f}body{background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,Segoe UI,system-ui,sans-serif;font-size:15px;line-height:1.6}input,select,button{font-family:inherit;font-size:inherit}.login-page{background:radial-gradient(ellipse 80% 60% at 50% -10%, #3b82f62e 0%, transparent 65%), var(--bg-base);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-card{border-radius:var(--radius-xl);background:var(--bg-card);border:1px solid var(--border-medium);width:420px;box-shadow:var(--shadow-card), var(--shadow-glow);text-align:center;padding:52px 44px}.login-card h1{letter-spacing:-.5px;color:var(--text-primary);margin-bottom:8px;font-size:36px;font-weight:700}.login-card p{color:var(--text-secondary);margin-bottom:32px;font-size:15px;font-weight:400}.login-card input{border-radius:var(--radius-md);background:var(--bg-input);width:100%;color:var(--text-primary);border:1px solid var(--border-medium);outline:none;margin-bottom:12px;padding:13px 16px;transition:border-color .2s}.login-card input:focus{border-color:var(--accent-blue)}.login-card input::placeholder{color:var(--text-muted)}.login-card button{border-radius:var(--radius-md);background:var(--accent-blue);color:#fff;cursor:pointer;border:none;width:100%;margin-top:8px;padding:13px;font-size:15px;font-weight:600;transition:opacity .2s,transform .15s}.login-card button:hover{opacity:.9;transform:translateY(-1px)}.login-card span{color:var(--text-secondary);margin-top:20px;font-size:13px;display:block}.dashboard{max-width:1440px;margin:0 auto;padding:32px 36px 60px}.hero{text-align:center;border-radius:var(--radius-xl);background:var(--bg-card);border:1px solid var(--border-medium);margin-bottom:36px;padding:50px 32px 44px;position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background:radial-gradient(70% 80% at 50% -20%,#3b82f638 0%,#0000 70%);position:absolute;inset:0}.hero h1{letter-spacing:-1.5px;color:var(--text-primary);margin-bottom:10px;font-size:48px;font-weight:800}.hero p{color:var(--text-secondary);font-size:17px;font-weight:400}.hero-sub{margin-top:6px;color:var(--text-muted)!important;font-size:14px!important}.hero h3{color:var(--accent-cyan);letter-spacing:2px;font-variant-numeric:tabular-nums;margin-top:20px;font-size:28px;font-weight:300}.hero .done{border-radius:var(--radius-sm);width:auto;color:var(--accent-rose);cursor:pointer;background:#f43f5e1f;border:1px solid #f43f5e40;margin-top:22px;padding:10px 28px;font-size:13px;font-weight:600;transition:background .2s}.hero .done:hover{background:#f43f5e38}.stats-grid{grid-template-columns:repeat(5,1fr);gap:16px;margin-bottom:28px;display:grid}.stat-card{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);text-align:center;padding:24px 20px;transition:border-color .2s}.stat-card:hover{border-color:var(--border-medium)}.stat-card h3{letter-spacing:.8px;text-transform:uppercase;color:var(--text-secondary);margin-bottom:12px;font-size:11px;font-weight:600}.stat-card h2{letter-spacing:-1px;color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:40px;font-weight:700}.stat-card:first-child h2{color:var(--accent-emerald)}.stat-card:nth-child(2) h2{color:var(--accent-blue-lt)}.stat-card:nth-child(3) h2{color:var(--accent-amber)}.stat-card:nth-child(4) h2{color:var(--accent-cyan)}.stat-card:nth-child(5) h2{color:var(--accent-rose)}.main-grid{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:24px;display:grid}.panel,.waiting-room,.queue-list{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);padding:28px}.panel h2,.waiting-room h2,.queue-list h2{color:var(--text-primary);letter-spacing:-.2px;margin-bottom:20px;font-size:18px;font-weight:600}.panel label{letter-spacing:.7px;text-transform:uppercase;color:var(--text-secondary);margin-top:16px;margin-bottom:8px;font-size:11px;font-weight:600;display:block}.panel input,.panel .doctor-select,.queue-list input,.appointment-panel input{border-radius:var(--radius-sm);background:var(--bg-input);width:100%;color:var(--text-primary);border:1px solid var(--border-medium);outline:none;margin-bottom:4px;padding:12px 14px;font-size:14px;transition:border-color .2s}.panel input:focus,.panel .doctor-select:focus,.queue-list input:focus,.appointment-panel input:focus{border-color:var(--accent-blue)}.panel input::placeholder,.queue-list input::placeholder,.appointment-panel input::placeholder{color:var(--text-muted)}.doctor-select{appearance:none;cursor:pointer}.button-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:18px;display:grid}.button-grid button{border-radius:var(--radius-sm);color:#fff;letter-spacing:.3px;cursor:pointer;border:none;padding:12px;font-size:13px;font-weight:600;transition:opacity .2s,transform .15s}.button-grid button:hover{opacity:.88;transform:translateY(-1px)}.button-grid button:active{transform:translateY(0)}.add{background:var(--accent-blue)}.next{background:var(--accent-emerald)}.skip{background:var(--accent-amber);color:#1a0e00!important}.done{background:var(--accent-rose)}.queue-list .next,.appointment-panel .add,.appointment-panel .done{border-radius:var(--radius-sm);color:#fff;cursor:pointer;border:none;margin-bottom:12px;padding:10px 20px;font-size:13px;font-weight:600;transition:opacity .2s,transform .15s;display:inline-block}.queue-list .next:hover,.appointment-panel .add:hover,.appointment-panel .done:hover{opacity:.88;transform:translateY(-1px)}.avg-box{border-top:1px solid var(--border-subtle);margin-top:20px;padding-top:16px}.current-token{text-align:center;border-radius:var(--radius-md);background:var(--bg-deep);border:1px solid var(--border-medium);flex-direction:column;justify-content:center;align-items:center;gap:6px;min-height:220px;padding:24px;display:flex}.current-token h1{letter-spacing:-3px;color:var(--accent-blue-lt);font-variant-numeric:tabular-nums;font-size:76px;font-weight:800;line-height:1}.current-token h2{color:var(--text-secondary);margin-bottom:0;font-size:18px;font-weight:400}.current-token h3{color:var(--text-primary);font-size:22px;font-weight:600}.current-token p{color:var(--text-secondary);margin-top:4px;font-size:14px;line-height:1.8}.waiting-room{margin-bottom:24px}.waiting-stats{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.waiting-stats>div{background:var(--bg-deep);border-radius:var(--radius-md);text-align:center;border:1px solid var(--border-subtle);padding:22px 16px}.waiting-stats h4{letter-spacing:.7px;text-transform:uppercase;color:var(--text-secondary);margin-bottom:10px;font-size:11px;font-weight:600}.waiting-stats h1{color:var(--accent-cyan);font-variant-numeric:tabular-nums;letter-spacing:-1px;font-size:38px;font-weight:700}.queue-list{margin-bottom:24px}.queue-list p{color:var(--text-secondary);font-size:14px}.queue-item{background:var(--bg-deep);border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-primary);justify-content:space-between;align-items:center;gap:12px;margin-top:10px;padding:14px 16px;font-size:14px;font-weight:500;transition:border-color .2s;display:flex}.queue-item:hover{border-color:var(--border-medium)}.queue-item strong{color:var(--accent-blue-lt);white-space:nowrap;font-size:13px;font-weight:600}.queue-item div{flex:1}.queue-item div>div{color:var(--text-primary);font-size:14px;font-weight:500}.queue-item small{color:var(--text-secondary);margin-top:2px;font-size:12px;font-weight:400;line-height:1.5;display:block}.queue-item span{color:var(--text-primary);white-space:nowrap;font-size:13px}.appointment-panel{background:var(--bg-card);border-radius:var(--radius-lg);border:1px solid var(--border-subtle);margin-bottom:24px;padding:28px}.appointment-panel h2{color:var(--text-primary);letter-spacing:-.2px;margin-bottom:20px;font-size:18px;font-weight:600}.appointment-panel p{color:var(--text-secondary);font-size:14px}.appointment-panel button{border-radius:var(--radius-sm);cursor:pointer;color:#fff;border:none;padding:11px 22px;font-size:13px;font-weight:600;transition:opacity .2s,transform .15s}.appointment-panel button:hover{opacity:.88;transform:translateY(-1px)}.recharts-cartesian-grid-horizontal line,.recharts-cartesian-grid-vertical line{stroke:var(--border-subtle)}.recharts-text{fill:var(--text-muted);font-size:12px}.recharts-tooltip-wrapper .recharts-default-tooltip{background:var(--bg-card)!important;border:1px solid var(--border-medium)!important;border-radius:var(--radius-sm)!important;color:var(--text-primary)!important}footer{background:var(--bg-card);border:1px solid var(--border-subtle);text-align:center;border-radius:var(--radius-lg);color:var(--text-secondary);letter-spacing:.3px;margin-top:40px;padding:20px 28px;font-size:13px;font-weight:500}@media (width<=1100px){.stats-grid{grid-template-columns:repeat(3,1fr)}}@media (width<=900px){.dashboard{padding:20px 18px 48px}.stats-grid,.main-grid,.waiting-stats{grid-template-columns:1fr}.hero h1{font-size:32px}.hero h3{font-size:22px}.stat-card h2{font-size:32px}}