/* Reference-led calendar: light neutral surfaces, hairlines and muted event colors. */
.compact .frame,.compact .shell{background:#fff}.compact .sidebar{background:#f8f8fa;border-color:#ececf0}.compact .nav.active{background:#eeeef2;color:#41414f}.compact .btn.primary{background:#777ed0;border-color:#777ed0}.compact .intro h1{font-size:24px}.compact .top{color:#93939f}.calendar-mode .content{padding:20px 24px}.calendar-mode .intro{margin-bottom:18px}.calendar-mode .intro h1{margin:0 0 5px;font-size:22px}.calendar-mode .intro p{font-size:11px}.calendar-mode .sidebar .side-footer{padding-top:35px}.calendar-filters{display:none;border-top:1px solid #e6e6ec;margin-top:25px;padding:17px 10px}.calendar-mode .calendar-filters{display:block}.calendar-filters h3{font-size:10px;font-weight:600;color:#767683;margin:0 0 12px}.calendar-filters label{display:flex;align-items:center;gap:8px;margin:11px 0;font-size:11px;color:#71717f}.calendar-filters input{accent-color:#7b83d3;width:13px;height:13px;margin:0}.calendar-filters .filter-dot{width:6px;height:6px;border-radius:50%;margin-left:auto}.cal-layout{display:grid;grid-template-columns:minmax(0,1fr) 218px;border:1px solid #ebebf0;border-radius:7px;overflow:hidden;background:#fff}.cal-toolbar{padding:13px 17px;display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid #ededf1;min-height:58px}.cal-toolbar h2{margin:0;font-size:14px;letter-spacing:0;color:#393944}.cal-controls{display:flex;align-items:center;gap:6px}.cal-controls button,.view-toggle button{background:white;border:1px solid #e4e4ec;padding:5px 9px;border-radius:4px;color:#777783;font-size:11px;min-height:30px}.cal-controls button:hover{background:#f7f7fa}.view-toggle{display:flex;background:#f4f4f7;padding:2px;border-radius:5px;margin-left:6px}.view-toggle button{border:0;background:none;min-height:26px;padding:3px 10px}.view-toggle button.selected{background:white;color:#4b4b59;box-shadow:0 1px 3px #24243315}.cal-weekdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-bottom:1px solid #ececf1;background:#fff}.cal-weekdays>div{padding:10px;text-align:center;color:#8b8b98;font-size:10px}.cal-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.cal-day{min-height:110px;border-bottom:1px solid #f0f0f4;border-right:1px solid #f0f0f4;position:relative;min-width:0;padding:6px;cursor:pointer;background:white}.cal-day:nth-child(7n){border-right:0}.cal-day.weekend{background:#fcfcfd}.cal-day.outside .day-number{color:#c3c3cd}.cal-day:hover{background:#fafaff}.day-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;height:22px}.day-number{font-size:10px;color:#92929d;width:22px;height:22px;display:inline-grid;place-items:center;border-radius:50%;border:0;background:transparent;padding:0}.day-number.is-today{background:#7a80d2;color:white}.day-add{opacity:0;color:#aaa9b8;font-size:13px;background:none;border:0;padding:0 4px}.cal-day:hover .day-add,.cal-day:focus-within .day-add{opacity:1}.event-pill{display:block;width:100%;border:0;border-left:2px solid var(--event-border,#9da3e6);background:var(--event-bg,#eff0ff);color:var(--event-text,#6971b2);text-align:left;border-radius:3px;font-size:9px;padding:3px 5px;line-height:1.55;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.event-pill time{opacity:.8;margin-right:4px;font-size:8px}.event-work{--event-bg:#edf1ff;--event-border:#99aceb;--event-text:#677dab}.event-personal{--event-bg:#edf5ef;--event-border:#a2d0ad;--event-text:#70957b}.event-learning{--event-bg:#fff1e6;--event-border:#e9bd8d;--event-text:#b18b60}.cal-side{border-left:1px solid #ebebf0;padding:20px 16px;background:#fff}.cal-side h3{font-size:11px;color:#666674;margin:0 0 14px}.cal-side .side-metrics{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:25px}.side-metrics>div{background:#f7f7f9;border-radius:5px;padding:10px 12px}.side-metrics b{display:block;font-size:19px;font-weight:500;color:#5c5c6c}.side-metrics span{font-size:9px;color:#9999a6}.side-event{padding:12px 11px;border:1px solid #ededf2;border-radius:6px;margin-bottom:9px;display:block;width:100%;text-align:left;background:#fff;color:#666674}.side-event .side-event-title{font-size:11px;line-height:1.6;display:block;overflow-wrap:anywhere}.side-event small{font-size:9px;color:#a0a0ad;display:block;margin-top:5px}.side-event i{width:6px;height:6px;background:var(--event-border);display:inline-block;border-radius:50%;margin-right:6px}.cal-side .side-note{font-size:10px;color:#b0b0ba;border-top:1px solid #eeeef3;padding-top:17px;margin-top:22px}.cal-empty{font-size:10px;color:#aaaab4;padding:15px 0}.week-head{display:grid;grid-template-columns:42px repeat(7,minmax(0,1fr));border-bottom:1px solid #ebebf1}.week-head>button{background:white;border:0;border-right:1px solid #f0f0f4;padding:11px 2px;color:#a0a0ab;font-size:9px}.week-head b{display:block;font-size:16px;font-weight:400;margin-top:6px;color:#797987}.week-head .selected b{background:#7c82d2;color:white;border-radius:50%;width:27px;height:27px;margin:5px auto 0;line-height:27px}.week-head>span{font-size:8px;color:#b6b6c1;align-self:end;text-align:center;padding-bottom:10px}.week-body{display:grid;grid-template-columns:42px repeat(7,minmax(0,1fr));height:576px;overflow:hidden}.hour-axis{position:relative;border-right:1px solid #ededf2}.hour-axis span{position:absolute;right:5px;color:#aaaab7;font-size:8px;transform:translateY(-6px)}.week-column{position:relative;border-right:1px solid #f0f0f4;background:repeating-linear-gradient(to bottom,transparent 0,transparent 47px,#f0f0f4 47px,#f0f0f4 48px);min-width:0}.week-column:last-child{border:0}.week-column.today-column{background-color:#fcfcff}.time-event{position:absolute;left:3px;right:3px;top:var(--top);height:var(--height);background:var(--event-bg);border:1px solid color-mix(in srgb,var(--event-border) 45%,white);border-left:2px solid var(--event-border);border-radius:4px;padding:5px;text-align:left;overflow:hidden;color:var(--event-text);font-size:9px;z-index:2}.time-event strong{font-size:9px;display:block;font-weight:500;line-height:1.6;overflow-wrap:anywhere}.time-event small{font-size:8px;display:block;opacity:.8}.week-now{position:absolute;left:0;right:0;top:228px;height:1px;background:#b9bcef;z-index:3;pointer-events:none}.week-now:before{content:'';width:5px;height:5px;background:#a0a5e4;border-radius:50%;position:absolute;left:-2px;top:-2px}.calendar-drawer .kicker{letter-spacing:.5px;font-size:10px;color:#9797a6}.calendar-drawer{background:#fff;border-left:1px solid #e6e6ed;box-shadow:-14px 0 50px #24243a15}.calendar-drawer h2{font-size:21px;font-weight:600;color:#484855;margin-top:30px}.calendar-drawer p{font-size:12px;color:#9393a1}.calendar-drawer label{display:block;font-size:11px;color:#868694;margin-top:17px}.calendar-drawer input,.calendar-drawer select,.calendar-drawer textarea{font:12px/1.6 "Segoe UI","Microsoft YaHei",sans-serif;border:1px solid #e5e5ed;padding:9px 11px;border-radius:5px;width:100%;margin-top:6px;background:#fff;color:#666675}.calendar-drawer .time-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.calendar-drawer .form-actions{display:flex;gap:9px;margin-top:25px}.calendar-drawer .form-actions .btn{margin:0}.calendar-drawer textarea{min-height:90px}.calendar-drawer .save-note{font-size:10px;color:#b0b0bc}.cal-access-note{font-size:10px;color:#aaaaba;margin-top:12px}.cal-error{color:#b36a66;font-size:11px;margin-top:12px}
@media(max-width:1150px){.cal-layout{grid-template-columns:minmax(0,1fr) 185px}.cal-side{padding:18px 12px}.calendar-mode .content{padding:20px}.cal-day{min-height:100px}.event-pill{font-size:8px;padding-inline:3px}.event-pill time{display:none}}
@media(max-width:800px){.cal-layout{grid-template-columns:minmax(0,1fr)}.cal-side{display:none}.calendar-mode .content{padding:20px 14px}.cal-day{min-height:90px}.calendar-mode .intro{display:flex;align-items:center;gap:15px}.calendar-mode .intro>.btn{margin:0}.week-head{grid-template-columns:32px repeat(7,1fr)}.week-body{grid-template-columns:32px repeat(7,1fr)}.calendar-mode .intro p{font-size:10px}.week-head>button{padding-inline:0}.cal-controls{gap:4px}.cal-toolbar{padding:12px}.calendar-mode .mobile-nav{font-size:10px}.mobile-nav button{padding-inline:9px}}
@media(max-width:450px){.calendar-mode .intro h1{font-size:22px}.cal-toolbar{flex-wrap:wrap;gap:10px}.cal-toolbar h2{font-size:13px}.cal-controls{width:100%;justify-content:flex-end}.cal-controls [data-cal-today]{margin-right:auto}.cal-weekdays>div{font-size:9px;padding:9px 0}.cal-day{min-height:83px;padding:3px}.day-head{margin-bottom:4px}.day-number{font-size:9px;width:19px;height:19px}.event-pill{font-size:8px;padding:2px;white-space:normal;line-height:1.5;max-height:30px;margin-bottom:3px}.day-add{display:none}.week-body{grid-template-columns:32px 1fr;height:576px}.week-body .week-column{display:none}.week-body .week-column.mobile-selected{display:block}.week-head{grid-template-columns:32px repeat(7,minmax(0,1fr))}.week-head b{font-size:13px}.time-event strong{font-size:11px}.time-event small{font-size:9px}.time-event{left:7px;right:12px;padding:7px}.calendar-drawer{width:100%;padding:23px}.calendar-mode .intro p{max-width:210px}.cal-access-note{font-size:9px}.calendar-mode .mobile-nav button{padding-inline:7px;font-size:9px}}

.week-scroll{max-height:576px;overflow-y:auto}.week-body{height:1152px}.week-now{top:612px}@media(max-width:450px){.week-body{height:1152px}}

.lab{background:#fafafa;color:#676774;border-bottom:1px solid #e9e9ee}.lab small{color:#a3a3ae}.lab>span{color:#9999a6!important}

/* Latest reference: icon rail + contextual calendar sidebar + full canvas. */
.app-rail{display:none}.calendar-mode .app-rail{display:flex;width:44px;position:fixed;inset:0 auto 0 0;background:#f0f0f2;border-right:1px solid #e3e3e8;z-index:12;flex-direction:column;align-items:center;gap:12px;padding:12px 0}.app-rail button{border:0;background:none;border-radius:7px;width:29px;height:29px;color:#82828d;font-size:15px;display:grid;place-items:center;padding:0}.app-rail button.active{background:#fff;color:#5f6394;box-shadow:0 1px 4px #22223312}.app-rail .rail-brand{background:#393941;color:white;font-size:14px;margin-bottom:15px}.app-rail .rail-bottom{margin-top:auto}.calendar-mode .frame{margin-left:44px;min-height:100dvh;max-width:none}.calendar-mode .sidebar{width:214px;padding:18px 15px;background:#fafafa;min-height:100dvh}.calendar-mode .sidebar>.brand,.calendar-mode .sidebar>.side-label,.calendar-mode .sidebar>.nav{display:none}.calendar-panel-title{display:none}.calendar-mode .calendar-panel-title{display:block;font-size:14px;font-weight:650;color:#4b4b55;margin:0 0 24px}.calendar-mode .calendar-filters{display:block;border:0;padding:0;margin-top:0}.calendar-mode .sidebar .side-footer{padding-top:20px;margin-top:auto;font-size:9px;line-height:1.8}.calendar-mode .sidebar .user{font-size:10px}.calendar-mode .lab,.calendar-mode .top,.calendar-mode .intro{display:none}.calendar-mode .content{padding:0}.calendar-mode .shell{background:#fff}.calendar-mode .cal-layout{border:0;border-radius:0;display:block}.calendar-mode .cal-side{display:none}.calendar-mode .cal-toolbar{min-height:57px;padding:11px 18px}.calendar-mode .cal-toolbar h2{font-size:12px;font-weight:500;color:#777781}.calendar-mode .cal-controls{gap:5px}.calendar-mode .cal-access-note{margin:0;padding:10px 18px;border-top:1px solid #f1f1f4;font-size:9px;color:#b2b2bb}.calendar-mode .references-fold{display:none}.calendar-mode .week-scroll{max-height:calc(100dvh - 135px)}.calendar-mode .cal-day{min-height:max(95px,calc((100dvh - 125px)/5))}.cal-new-button{background:#777ed0!important;color:white!important;border-color:#777ed0!important;margin-left:9px}.calendar-context{display:none}.calendar-mode .calendar-context{display:block;border-top:1px solid #e8e8ed;margin-top:20px;padding-top:16px}.calendar-context h3{font-size:10px;color:#8a8a97;font-weight:500;margin:0 0 12px}.calendar-context .context-event{padding:9px 0;font-size:10px;color:#747480;border-bottom:1px solid #eeeef2}.calendar-context .context-event span{display:block;font-size:9px;color:#aaaab5;margin-top:4px}.calendar-context p{font-size:10px;color:#b0b0ba}.calendar-context .context-search{border:1px solid #e9e9ee;border-radius:5px;width:100%;font-size:10px;padding:8px;color:#80808d;background:#f5f5f8;margin-bottom:12px}.context-event button{background:none;border:0;text-align:left;color:inherit;font-size:10px;padding:0}.calendar-context .context-event button:hover{color:#666ec1}
@media(max-width:800px){.calendar-mode .app-rail{display:none}.calendar-mode .frame{margin-left:0}.calendar-mode .sidebar{display:none}.calendar-mode .cal-toolbar{padding:12px}.calendar-mode .cal-day{min-height:max(85px,calc((100dvh - 215px)/5))}.calendar-mode .week-scroll{max-height:calc(100dvh - 200px)}.calendar-mode .cal-access-note{padding-bottom:16px}.calendar-mode .mobile-nav{position:fixed;inset:auto 0 0;z-index:14}.calendar-mode .content{padding-bottom:65px}.calendar-mode .cal-controls{width:auto}.calendar-mode .cal-toolbar h2{margin-right:auto}.calendar-mode .cal-new-button{margin-left:4px}.calendar-mode .frame{min-height:100dvh}}
@media(max-width:450px){.calendar-mode .cal-toolbar{display:block}.calendar-mode .cal-toolbar h2{font-size:13px;margin-bottom:11px}.calendar-mode .cal-controls{justify-content:flex-start;width:100%}.calendar-mode .cal-controls [data-cal-today]{margin-right:0}.calendar-mode .view-toggle{margin-left:auto}.cal-new-button{font-size:10px!important;padding-inline:7px!important}.calendar-mode .week-scroll{max-height:calc(100dvh - 235px)}}

.calendar-mode .week-scroll{max-height:min(720px,calc(100dvh - 135px))}@media(max-width:800px){.calendar-mode .week-scroll{max-height:calc(100dvh - 200px)}}@media(max-width:450px){.calendar-mode .week-scroll{max-height:calc(100dvh - 235px)}}

/* Screenshot 21b05840: separated neutral panels, blue action, red calendar. */
body.calendar-mode{background:#e9e9eb}.calendar-mode .app-rail{width:36px;background:#e9e9eb;border:0;gap:12px;padding-top:9px}.app-rail .rail-brand{width:23px;height:23px;display:grid;place-items:center;border-radius:6px;background:#333338;font-size:12px;margin-bottom:8px}.app-rail button{width:26px;height:26px;color:#78787e;font-size:14px}.calendar-mode .frame{margin-left:36px;background:#e9e9eb;gap:4px;padding:4px 4px 4px 0;min-height:100dvh}.calendar-mode .sidebar{width:206px;border:0;border-radius:11px;background:#fafafa;padding:13px 13px 17px;min-height:calc(100dvh - 8px)}.calendar-mode .shell{border:1px solid #e5e5e8;border-radius:11px;overflow:hidden;background:#fafafa}.calendar-mode .cal-toolbar{background:#fff;min-height:45px;padding:9px 12px;border-color:#f0f0f2}.calendar-mode .cal-toolbar h2{font-size:11px;color:#68686f}.calendar-mode .cal-controls button{font-size:10px;min-height:26px;padding:3px 8px;border-color:#e8e8ee}.cal-new-button,.compact .btn.primary{background:#433ee8!important;border-color:#433ee8!important;color:#fff!important}.calendar-mode .week-head{background:#fff;border-color:#ededf0}.week-head>button{padding:12px 2px;background:white;display:flex;justify-content:center;align-items:center;gap:7px;min-height:43px;color:#85858b}.week-head b{display:inline-block;font-size:10px;line-height:18px;margin:0!important;width:18px;height:18px;text-align:center;border-radius:50%}.week-head .selected b{background:#ececef;color:#666;width:18px;height:18px;line-height:18px}.week-head .actual-today b{background:#f15f65;color:white}.week-head>span{align-self:center;padding:0;font-size:7px}.week-column,.week-column.today-column{background-color:#fafafa;background-image:repeating-linear-gradient(to bottom,transparent 0,transparent 47px,#efeff2 47px,#efeff2 48px)}.week-column{border-color:#f0f0f2}.hour-axis{background:#fafafa;border-color:#efeff2}.hour-axis span{color:#98989f;font-size:8px}.event-work{--event-bg:#f5caca;--event-border:#ed9a9e;--event-text:#ad535b}.event-personal{--event-bg:#e1efe6;--event-border:#add0b9;--event-text:#6b907b}.event-learning{--event-bg:#f6e8d6;--event-border:#ddbf94;--event-text:#a3855e}.time-event{border:0;border-left:2px solid var(--event-border);border-radius:3px;padding:5px 6px}.time-event strong{font-size:10px}.time-event small{font-size:9px}.week-now{background:#ff666e}.week-now:before{background:#ff666e}.week-now:after{content:'12:45';position:absolute;left:0;top:-6px;background:#ff666e;color:#fff;font-size:8px;border-radius:5px;padding:0 4px;line-height:12px}.day-number.is-today{background:#f15f65}.cal-day{background:#fafafa;border-color:#eeeeF1}.cal-day.weekend{background:#f8f8fa}.calendar-mode .calendar-panel-title{font-size:13px;margin-bottom:18px;color:#393941}.calendar-filters h3{font-size:9px;color:#98989f}.calendar-filters input{accent-color:#8a8a99}.calendar-mode .calendar-context{margin-top:18px;padding-top:14px;border-color:#eeeef0}.calendar-context h3{border-bottom:1px solid #ff6b70;padding-bottom:10px;color:#97979e;font-size:9px}.calendar-context .context-event{font-size:10px}.calendar-context .context-search{border:0;background:#f1f1f4;font-size:10px;padding:8px}.calendar-mode .cal-access-note{background:#fafafa;color:#b7b7be;border-color:#efeff2;font-size:8px}.calendar-mode .week-scroll{background:#fafafa;max-height:calc(100dvh - 123px)}.calendar-context .context-event button:hover{color:#433ee8}
@media(max-width:800px){.calendar-mode .frame{margin:0;padding:4px;gap:0}.calendar-mode .sidebar{display:none}.calendar-mode .shell{border-radius:9px}.calendar-mode .week-scroll{max-height:calc(100dvh - 185px)}.week-head>button{gap:2px;font-size:8px}.calendar-mode .cal-controls button{min-height:31px}}
@media(max-width:450px){.calendar-mode .cal-controls button{padding:4px 7px}.calendar-mode .week-scroll{max-height:calc(100dvh - 220px)}.time-event strong{font-size:11px}.week-head>button{flex-direction:column;gap:4px}.week-head b{font-size:11px}.calendar-mode .cal-toolbar h2{font-size:12px}.calendar-mode .cal-access-note{font-size:8px}}

.calendar-filters .context-search{display:block;width:100%;border:0;border-radius:5px;background:#f0f0f3;padding:8px 9px;color:#777780;font-size:10px;margin:0 0 17px;outline-color:#8984ed}

.calendar-mode .week-scroll{max-height:min(720px,calc(100dvh - 123px))}@media(max-width:800px){.calendar-mode .week-scroll{max-height:calc(100dvh - 185px)}}@media(max-width:450px){.calendar-mode .week-scroll{max-height:calc(100dvh - 220px)}}
