:root{--line:#e1e6ef;--green:#2861d7;--muted:#657087;color:#202b3e;background:#f7f9fc}
main{max-width:1320px;padding-top:28px}
header{margin-bottom:25px}h1{font-size:31px;letter-spacing:-1.1px}.dot{color:#2861d7}
.eyebrow{color:#7c879b;font-size:10px;letter-spacing:1.4px}
button{background:white}.primary{background:#2861d7;border-color:#2861d7;border-radius:24px;box-shadow:0 2px 5px #2861d720}.primary:hover{background:#1e50b9}
button:hover{background:#eef3fb}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline-color:#8eb4fc}
.period h2{min-width:235px;font-size:20px}.tabs{background:#eaf0fa;border:1px solid #dbe4f3;padding:3px;border-radius:10px}.tabs button[aria-pressed=true]{color:#174eb8;background:#dbe8ff;font-weight:600;box-shadow:none}
.calendar-meta{display:flex;align-items:center;justify-content:space-between;gap:16px}.calendar-meta .zone{font-size:11px;margin:15px 0}
#calendar{border-color:#dce3ef;background:white;border-radius:12px;box-shadow:0 3px 12px #243c6605}
.time-scroll{height:min(65vh,660px);min-height:420px;overflow:auto;scrollbar-width:thin;scrollbar-color:#d1d9e7 #f7f9fc;overscroll-behavior:contain;position:relative}
.time-canvas{min-width:calc(52px + var(--days)*112px);background:#fff}.time-canvas.single-day{min-width:0}
.time-head,.time-body{display:grid;grid-template-columns:52px repeat(var(--days),minmax(0,1fr))}
.time-head{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid #dce3ef}
.time-corner{position:sticky;left:0;z-index:45;background:white;font-size:8px;color:#7e8797;display:flex;align-items:end;padding:0 3px 10px;white-space:nowrap}
.date-heading{border:0;border-left:1px solid #edf0f5;border-radius:0;padding:9px 0 8px;display:flex;flex-direction:column;align-items:center;gap:4px;background:#fff;min-height:69px}
.date-heading.selected{background:#f1f5fd}.day-of-week{font-size:10px;text-transform:uppercase;color:#758198;letter-spacing:.8px}.date-number{font-size:20px;line-height:32px;font-weight:500;width:32px;height:32px;border-radius:50%}.date-heading.is-today .date-number{background:#2861d7;color:white}.date-heading.is-today .day-of-week{color:#2861d7}
.hours{position:sticky;left:0;z-index:25;background:#fff;border-right:1px solid #e1e6ef}.hour-label{position:absolute;right:8px;transform:translateY(-50%);font-size:10px;color:#8a93a2;background:white;line-height:14px}.hour-label:first-child{transform:translateY(2px)}
.time-column{position:relative;border-right:1px solid #edf0f5;background:white;min-width:0}.time-column:last-child{border-right:0}.time-column.today-column{background:#fcfdff}
.hour-slot{position:absolute;height:58px;left:0;width:100%;border:0;border-bottom:1px solid #edf0f5;border-radius:0;background:transparent;padding:0}.hour-slot:after{content:'';position:absolute;left:0;right:0;top:50%;border-top:1px dotted #f1f3f7;pointer-events:none}.hour-slot:hover{background:#f1f5fd}.hour-slot:focus-visible{outline-offset:-3px}
.time-event{position:absolute;z-index:10;display:flex;flex-direction:column;align-items:flex-start;text-align:left;justify-content:flex-start;border:0;border-left:3px solid #4a79d5;background:#dfeaff;color:#214e96;border-radius:5px;padding:4px 5px;overflow:hidden;gap:2px;box-shadow:0 1px 2px #28466a12}
.time-event:hover{filter:brightness(.96);background:#d5e3ff}.block-title{font-size:11px;line-height:1.2;font-weight:600;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex-shrink:0}.block-time{font-size:9px;line-height:1.3;white-space:nowrap;opacity:.85;flex-shrink:0}
.time-event.color-1{background:#e4f1e9;color:#236347;border-left-color:#4d9a71}.time-event.color-2{background:#ece5fa;color:#64469c;border-left-color:#9675c7}.time-event.color-3{background:#fff0d7;color:#936020;border-left-color:#d4a454}
.now-line{position:absolute;z-index:20;height:1px;background:#e85a60;left:0;right:0;pointer-events:none}.now-line span{display:block;background:#e85a60;width:7px;height:7px;border-radius:50%;position:relative;top:-3px;left:-3px}
.single-day .time-event{padding:5px 8px}.single-day .block-title{font-size:12px}.single-day .block-time{font-size:10px}
.bottom{grid-template-columns:1.25fr 1fr;gap:48px;padding-top:28px}.agenda-item{padding:14px 0;align-items:flex-start}.agenda-item h3{font-size:14px}.event-time{color:#426390}.edit-link{border:0;background:transparent;color:#2861d7;font-size:11px;padding:3px 0}.empty{padding:12px 0}.assistant textarea{background:#fff}.assistant .primary{border-radius:8px;box-shadow:none}
.weekday{background:#f7f9fc;border-color:#e1e6ef;color:#7c879b}.day{min-height:125px;border-color:#edf0f5}.day.selected{background:#f1f5fd;box-shadow:inset 0 0 0 1px #8db2f2}.day:hover{background:#f5f8fd}.is-today .number{background:#2861d7}.event-chip{background:#e6edfb;color:#315589;border-left-color:#7099e1;font-size:10px;padding:4px 5px}.number{font-size:12px}.free{display:none}
dialog{background:#fff;box-shadow:0 18px 80px #18305d40}.dialog-head h2{font-size:21px}dialog::backdrop{background:#1e345c60}input,textarea,select{border-color:#d9e0eb;background:white}label{color:#637087}.dialog-actions{display:flex;gap:12px;justify-content:flex-end;align-items:center}.dialog-actions .primary{flex:1;border-radius:8px;box-shadow:none}.danger{color:#b74444;border-color:#eed3d3;background:white}.danger:hover{background:#fff0f0}.notice{background:#edf4ff;border-color:#d7e4fc;color:#365681}.notice.error{background:#fff0eb;border-color:#f0d1c5;color:#9d3f2e}footer{margin-top:28px}
@media(max-width:650px){main{padding:20px 12px 12px}header{margin-bottom:22px}h1{font-size:28px}header .primary{padding:11px 16px;font-size:12px}.eyebrow{font-size:9px}.period h2{font-size:18px;min-width:0}.calendar-meta .zone{font-size:10px}.calendar-meta .zone:last-child{max-width:170px;text-align:right}.time-scroll{height:61vh;min-height:380px}.time-canvas{min-width:836px}.time-canvas.single-day{min-width:0}.bottom{grid-template-columns:1fr;gap:24px;padding-top:25px}.assistant{border-color:#e1e6ef}.day{min-height:90px}.event-chip{font-size:8px;padding:3px 2px}.day .number{font-size:11px}.date-number{font-size:19px}.date-heading{min-height:66px}.calendar-meta{gap:8px}footer{font-size:10px}}