:root{--primary: #6366f1;--primary-dark: #4f46e5;--primary-light: #818cf8;--secondary: #f1f5f9;--success: #10b981;--warning: #f59e0b;--error: #ef4444;--text: #1e293b;--text-light: #64748b;--text-white: #ffffff;--bg: #ffffff;--bg-dark: #f8fafc;--border: #e2e8f0;--shadow: rgba(0, 0, 0, .1);--radius: 12px;--radius-sm: 8px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:var(--text);line-height:1.6}#root{min-height:100vh}.container{max-width:800px;margin:0 auto;padding:2rem 1rem}.card{background:var(--bg);border-radius:var(--radius);box-shadow:0 20px 60px var(--shadow);padding:2rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.header{text-align:center;margin-bottom:2rem}.header h1{font-size:2rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.header p{color:var(--text-light);font-size:1rem}.slot-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg);padding:2rem;border-radius:var(--radius);box-shadow:0 20px 60px #0000004d;z-index:1000;max-width:400px;width:90%}.slot-popup-overlay{position:fixed;inset:0;background:#00000080;z-index:999}.booking-form{background:var(--bg-dark);padding:1.5rem;border-radius:var(--radius)}.booking-form h3{font-size:1.125rem;font-weight:600;margin-bottom:1rem}.form-group{margin-bottom:1rem}.form-group label{display:block;font-weight:500;margin-bottom:.5rem;color:var(--text)}.form-group input{width:100%;padding:.75rem 1rem;border:2px solid var(--border);border-radius:var(--radius-sm);font-size:1rem;transition:border-color .2s}.form-group input:focus{outline:none;border-color:var(--primary)}.booking-summary{background:var(--bg);padding:1rem;border-radius:var(--radius-sm);margin-bottom:1rem}.booking-summary p{color:var(--text-light);font-size:.875rem}.booking-summary strong{color:var(--text)}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.875rem 1.5rem;border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;text-decoration:none}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:var(--text-white);width:100%}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-secondary{background:var(--secondary);color:var(--text)}.btn-secondary:hover{background:var(--border)}.confirmation{text-align:center;padding:2rem 0}.confirmation-icon{width:80px;height:80px;background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;font-size:2.5rem;color:#fff}.confirmation h2{font-size:1.5rem;margin-bottom:.5rem}.confirmation p{color:var(--text-light);margin-bottom:1.5rem}.confirmation-details{background:var(--bg-dark);padding:1.5rem;border-radius:var(--radius);text-align:left;margin-bottom:1.5rem}.confirmation-details p{margin-bottom:.5rem;color:var(--text)}.meet-link{display:inline-flex;align-items:center;gap:.5rem;color:var(--primary);text-decoration:none;font-weight:500}.meet-link:hover{text-decoration:underline}.admin-login{text-align:center;padding:3rem}.admin-login h2{margin-bottom:1rem}.admin-login p{color:var(--text-light);margin-bottom:2rem}.google-btn{display:inline-flex;align-items:center;gap:.75rem;padding:.875rem 1.5rem;background:var(--bg);border:2px solid var(--border);border-radius:var(--radius-sm);font-size:1rem;font-weight:500;cursor:pointer;transition:all .2s}.google-btn:hover{border-color:var(--primary);box-shadow:0 4px 12px var(--shadow)}.availability-editor{margin-top:1rem}.day-setting{display:flex;align-items:center;gap:1rem;padding:1rem;background:var(--bg-dark);border-radius:var(--radius-sm);margin-bottom:.5rem}.day-setting label{min-width:80px;font-weight:500}.day-setting input[type=checkbox]{width:20px;height:20px;cursor:pointer}.day-setting input[type=time]{padding:.5rem;border:2px solid var(--border);border-radius:var(--radius-sm);font-size:.875rem}.day-setting span{color:var(--text-light)}.loading{display:flex;align-items:center;justify-content:center;padding:2rem;color:var(--text-light)}.spinner{width:24px;height:24px;border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite;margin-right:.5rem}@keyframes spin{to{transform:rotate(360deg)}}.error{background:#fef2f2;border:1px solid #fecaca;color:var(--error);padding:1rem;border-radius:var(--radius-sm);margin-bottom:1rem}@media(max-width:640px){.container{padding:1rem .5rem}.card{padding:1.5rem 1rem}.header h1{font-size:1.5rem}.day-setting{flex-wrap:wrap}}.weekly-calendar{margin-bottom:2rem;-webkit-user-select:none;user-select:none;background:var(--bg);display:flex;flex-direction:column;height:100%}.events-overlay{position:absolute;inset:0;pointer-events:none;z-index:15}.event-block{position:absolute;pointer-events:auto;padding:2px 6px;box-sizing:border-box;overflow:hidden;font-size:.75rem;font-weight:500;border-radius:4px;display:flex;align-items:flex-start;justify-content:flex-start;white-space:nowrap;text-overflow:ellipsis;transition:all .2s ease;z-index:10}.event-block:hover{z-index:20;filter:brightness(.95);box-shadow:0 2px 4px #0000001a}.event-block.available{background-color:#fff;border:1px solid #10b981;border-left-width:4px;color:#10b981;cursor:pointer}.event-block.available:hover{background-color:#ecfdf5}.event-block.busy{background-color:#6366f1;border:1px solid #4f46e5;color:#fff;opacity:.9;cursor:default}.event-block.google{background-color:#64748b;border:1px solid #475569;color:#fff;opacity:.9;cursor:default}.weekly-calendar .calendar-nav{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid var(--border);background:var(--bg)}.weekly-calendar .nav-btn{background:var(--secondary);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.5rem 1rem;cursor:pointer;font-weight:500;font-size:.875rem;transition:all .2s;color:var(--text)}.weekly-calendar .nav-btn:hover{background:var(--primary);color:var(--text-white);border-color:var(--primary)}.weekly-calendar .nav-title{font-weight:600;font-size:1.125rem;color:var(--text)}.weekly-calendar-wrapper{display:flex;flex-direction:column;position:relative;background:var(--bg)}.weekly-header-row{display:flex;border-bottom:1px solid var(--border);background:var(--bg-dark);position:sticky;top:0;z-index:20}.weekly-calendar .time-gutter{width:60px;flex-shrink:0;border-right:1px solid var(--border);display:flex;align-items:center;justify-content:center;background:var(--bg)}.weekly-calendar .time-gutter.header-cell{background:var(--bg-dark)}.weekly-calendar .day-column-header{flex:1;text-align:center;padding:.75rem 0;border-right:1px solid var(--border);background:var(--bg);min-width:0}.weekly-calendar .day-column-header:last-child{border-right:none}.weekly-calendar .scrollbar-gutter{width:15px;flex-shrink:0;background:var(--bg-dark);border-left:1px solid var(--border)}.weekly-calendar .header-cell.today{background:var(--primary-light);color:var(--primary-dark)}.weekly-calendar .day-name{display:block;font-size:.75rem;font-weight:600;color:var(--text-light);margin-bottom:2px}.weekly-calendar .day-date{display:block;font-size:1.25rem;font-weight:400}.weekly-body{max-height:600px;overflow-y:scroll;padding-top:0;background:var(--bg)}.weekly-body::-webkit-scrollbar{width:15px}.weekly-body::-webkit-scrollbar-track{background:var(--bg);border-left:1px solid var(--border)}.weekly-body::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px;border:3px solid transparent;background-clip:content-box}.weekly-body::-webkit-scrollbar-thumb:hover{background-color:#94a3b8}.weekly-row{display:flex;border-bottom:1px solid var(--border);min-height:48px}.weekly-row:last-child{border-bottom:none}.weekly-calendar .time-gutter{align-items:flex-start;justify-content:flex-end;padding-right:8px;padding-top:0}.weekly-calendar .time-gutter .time-label{font-size:.75rem;color:var(--text-light);transform:translateY(-50%);background:var(--bg);padding:0 4px}.weekly-day-column{flex:1;border-right:1px solid var(--border);display:flex;flex-direction:column;min-width:0}.weekly-day-column:last-child{border-right:none}.weekly-day-column.today{background-color:#3b82f60a}.weekly-calendar .calendar-cell{height:24px;border-bottom:1px dotted #e2e8f0;transition:background-color .1s;cursor:pointer;position:relative;z-index:1}.weekly-calendar .calendar-cell:nth-child(2){border-bottom:none}.weekly-calendar .calendar-cell.hovered{background-color:var(--primary-light);opacity:.6}.weekly-calendar .calendar-cell.past{background:repeating-linear-gradient(45deg,#fafafa,#fafafa 5px,#f4f4f5 5px 10px);cursor:default}.weekly-calendar .calendar-cell.available{background-color:#e0f2fe;border-left:3px solid #0ea5e9}.weekly-calendar .calendar-cell.hovered{background-color:#bae6fd;opacity:1}.weekly-calendar .calendar-cell.hovered-start:first-child{border-bottom-color:transparent}.weekly-calendar .calendar-cell.hovered-invalid,.weekly-calendar .calendar-cell.booked{background-color:#fee2e2;border-left:3px solid #f87171;cursor:not-allowed;opacity:.8}.weekly-calendar .calendar-cell.dragging{background-color:#bbf7d0;border-left:3px solid #22c55e}.weekly-calendar .calendar-legend{padding:1rem;border-bottom:1px solid var(--border);display:flex;justify-content:center;gap:2rem;background:var(--bg)}.weekly-calendar .legend-item{font-size:1rem;color:var(--text);display:flex;align-items:center;gap:.75rem;font-weight:500}.weekly-calendar .legend-color{width:20px;height:20px;border-radius:4px;display:inline-block}.weekly-calendar .legend-color.available{background:#e0f2fe;border:1px solid #0ea5e9}.current-time-indicator{position:absolute;left:0;right:0;height:2px;background-color:#ea4335;z-index:18;pointer-events:none}.current-time-indicator .time-badge{position:absolute;left:8px;top:50%;transform:translateY(-50%);background-color:#ea4335;color:#fff;font-size:.75rem;font-weight:600;padding:2px 6px;border-radius:12px;z-index:11}.weekly-calendar .calendar-cell{z-index:1}.weekly-calendar .legend-color.booked{background:#fee2e2;border:1px solid #f87171}@media(max-width:768px){.weekly-calendar .time-gutter{width:40px}.weekly-calendar .header-cell{font-size:.7rem;padding:.5rem 0}.weekly-calendar .day-date{font-size:1rem}.weekly-calendar .nav-btn{padding:.4rem .8rem;font-size:.75rem}}