/* Only the new renderer owns its surface; legacy dates keep their original CSS. */
#board-shell .b-widget.type-date:has(.gelara-date){background:transparent!important;border:0!important;box-shadow:none!important;overflow:visible!important}
.b-widget.type-date:has(.gelara-date)>.b-widget-body{display:block!important;width:100%;height:100%;padding:0!important;overflow:hidden!important}
.gelara-date{position:relative;isolation:isolate;display:flex;width:100%;height:100%;min-width:0;min-height:0;box-sizing:border-box;overflow:hidden;container-type:size;border-radius:min(5cqi,24px);background:var(--date-background);color:var(--date-ink);padding:min(5cqi,5cqb);font-family:Inter,ui-sans-serif,system-ui,sans-serif;user-select:none;line-height:1.1}
.date-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;width:100%;height:100%;min-width:0;min-height:0;gap:2%}
.date-line{display:block;width:100%;height:100%;max-height:100%;min-height:0;overflow:visible;fill:currentColor;font-family:inherit;font-weight:650}
.date-number{font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-10px}
.date-main{display:flex;align-items:center;justify-content:center;width:100%;flex:1;min-height:0;min-width:0}
.date-cap,.date-footer{display:flex;justify-content:center;align-items:center;width:100%;flex:none;height:18%;min-height:0;text-align:center}
.date-footer{height:19%;opacity:.87}.date-cap{font-weight:700;color:var(--date-ink)}
.date-layout-simple .date-main{flex:1}.date-layout-simple .date-footer{height:28%;border-top:1px solid color-mix(in srgb,var(--date-accent) 30%,transparent);padding-top:2%;box-sizing:border-box}
.date-skin-minimal{border-radius:3px;padding:min(3cqi,3cqb)}
.date-layout-side .date-content{display:grid;grid-template-columns:41% 1fr;grid-template-rows:1fr 1fr;column-gap:5%;row-gap:0}
.date-layout-side .date-main{grid-column:1;grid-row:1/3;height:100%;width:100%;border-right:1px solid color-mix(in srgb,var(--date-accent) 40%,transparent)}
.date-layout-side .date-cap{grid-column:2;grid-row:1;width:100%;height:100%;align-self:end}
.date-layout-side .date-footer{grid-column:2;grid-row:2;width:100%;height:100%;align-self:start}
.date-skin-pro{border-left:min(2cqi,9px) solid var(--date-accent);border-radius:5px}
.date-skin-pro:after{content:'';position:absolute;right:0;bottom:0;width:24%;height:100%;background:var(--date-accent);opacity:.06;clip-path:polygon(100% 0,100% 100%,0 100%)}
.date-skin-warm{font-family:Georgia,serif;border-radius:min(18cqi,60px) 5px 5px 5px;border-bottom:min(1cqb,5px) solid var(--date-accent)}
.date-skin-warm .date-number{font-weight:500}.date-skin-pastel{background:linear-gradient(140deg,#ffffff70,transparent 75%),var(--date-background);border-radius:min(8cqi,35px)}
.date-skin-executive{border-left:min(1.4cqi,7px) solid var(--date-accent);border-radius:3px;padding:min(5cqi,5cqb) min(7cqi,7cqb)}
.date-layout-calendar{padding:min(4cqi,4cqb) min(5cqi,5cqb);border:1px solid color-mix(in srgb,var(--date-accent) 25%,transparent);box-shadow:0 3px 0 color-mix(in srgb,var(--date-accent) 18%,transparent)}
.date-layout-calendar .date-cap{height:22%;border-bottom:1px solid color-mix(in srgb,var(--date-accent) 25%,transparent)}
.date-layout-calendar .date-footer{height:21%}
.date-skin-band .date-cap,.date-skin-school .date-cap{background:var(--date-accent);color:white;border-radius:min(2cqi,10px);border:0}
.date-layout-today .date-cap{height:18%;font-size:min(7cqi,12cqb);letter-spacing:.12em;text-transform:uppercase;color:var(--date-accent)}
.date-layout-today .date-main{flex:1}.date-layout-today .date-footer{height:23%}
.date-skin-today{border-top:min(1.5cqb,7px) solid var(--date-accent);border-radius:min(6cqi,25px)}
.date-skin-clean{border:1px solid #dce7ed;border-radius:3px}.date-skin-clean .date-cap{letter-spacing:.2em}
.date-skin-rings,.date-skin-sway{padding-top:min(9cqi,9cqb)}
.date-skin-rings .date-ornament,.date-skin-sway .date-ornament{position:absolute;top:1%;left:27%;right:27%;height:9%;border-left:min(2cqi,8px) solid var(--date-accent);border-right:min(2cqi,8px) solid var(--date-accent);border-radius:3px;z-index:2}
.date-skin-sheet{border-radius:3px 3px min(10cqi,40px) 3px;box-shadow:inset 0 -5px 0 #00000008,0 3px 0 #00000008;border-top:min(1.5cqb,7px) solid var(--date-accent)}
.date-skin-agenda{background:repeating-linear-gradient(0deg,transparent 0 24px,#6f947b0a 25px),var(--date-background);border-left:min(2cqi,8px) solid var(--date-accent)}
.date-skin-block{border-radius:min(8cqi,30px);box-shadow:inset 0 -6px 0 #0001;padding:min(2cqi,2cqb)}
.date-skin-school{border-style:dashed;border-width:2px;border-radius:min(5cqi,20px)}
.date-layout-vertical{padding:min(7cqi,7cqb) min(4cqi,4cqb);border-radius:min(8cqi,30px);border:1px solid color-mix(in srgb,var(--date-accent) 35%,transparent)}
.date-layout-vertical .date-cap{height:15%;color:inherit}.date-layout-vertical .date-main{flex:1}.date-layout-vertical .date-footer{height:19%}
.date-skin-rail{border-left:min(4cqi,12px) solid var(--date-accent);border-radius:3px}.date-skin-column{border:0;border-radius:3px}
.date-skin-column .date-footer{border-top:2px solid var(--date-accent);padding-top:3%}
.date-skin-note{border-radius:1px 1px min(9cqi,40px) 1px;clip-path:polygon(0 0,100% 0,100% 85%,85% 100%,0 100%);box-shadow:inset 0 12px 0 #ffffff30;padding-bottom:min(8cqi,8cqb)}
.date-skin-chalk{font-family:Georgia,serif;border:5px solid var(--date-accent);border-radius:3px;box-shadow:inset 0 0 18px #0002}
.date-layout-orbit{padding:min(8cqi,8cqb);background:transparent;border-radius:50%}
.date-layout-orbit .date-ornament{position:absolute;inset:0;width:min(92cqi,92cqb);height:min(92cqi,92cqb);border:2px solid var(--date-accent);border-radius:50%;aspect-ratio:1;max-height:92%;max-width:92%;margin:auto;background:var(--date-background)}
.date-layout-orbit .date-content{max-width:min(75cqi,75cqb);max-height:min(75cqi,75cqb);margin:auto}
.date-layout-orbit .date-main{flex:1}.date-layout-orbit .date-footer{height:24%}
.date-skin-label{border-radius:3px 22% 22% 3px;padding-right:10%;border-left:min(1.5cqi,7px) solid var(--date-accent)}
.date-skin-frame{border:3px solid var(--date-accent);border-radius:min(14cqi,50px);padding:min(8cqi,8cqb)}
.date-skin-postcard{border:1px solid #d7b8ac;border-radius:2px;background:linear-gradient(145deg,#fff8,transparent),var(--date-background)}
.date-skin-postcard .date-main{border:0}.date-skin-postcard .date-cap{color:var(--date-ink)}
.date-layout-illustrated{align-items:center;gap:3%;border-radius:min(10cqi,38px);padding:5%}
.date-layout-illustrated .date-content{flex:1;min-width:0;width:65%;height:100%}
.date-art{position:relative;z-index:1;width:32%;height:85%;flex:none;display:flex;align-items:center;justify-content:center}
.date-art>svg{display:block;width:100%;height:100%;max-height:100%;overflow:visible}
.date-layout-illustrated .date-cap{height:21%;color:inherit}.date-layout-illustrated .date-footer{height:22%}
.date-skin-sun,.date-skin-solar{background:radial-gradient(ellipse at 20% 50%,#fff9,transparent 65%),var(--date-background)}
.date-skin-space{background:radial-gradient(ellipse at 0 100%,#536b9d,transparent 80%),var(--date-background)}
.date-skin-fox{border-bottom:min(1.5cqb,7px) solid #d8b791}.date-skin-cloud,.date-skin-float{border-bottom:min(1.5cqb,7px) solid #acd3e4}
.gelara-date .clock-mascot-eyes{animation:none}
.date-skin-shine:after{content:'';position:absolute;inset:1px;border:3px solid var(--date-accent);border-radius:inherit;pointer-events:none;animation:date-shine 5s ease-in-out infinite}
.date-skin-float .date-art{animation:date-float 5s ease-in-out infinite}
.date-skin-solar .date-art:after{content:'✦';position:absolute;top:12%;right:0;color:#cf9732;font-size:min(9cqi,12cqb);animation:date-sparkle 3.5s ease-in-out infinite}
.date-skin-solar .date-art>svg>g:first-child{transform-origin:50% 50%;animation:date-rays 7s ease-in-out infinite}
.date-skin-sway .date-ornament{transform-origin:50% 100%;animation:date-sway 6s ease-in-out infinite}
@keyframes date-shine{0%,100%{opacity:.15}50%{opacity:.8}}
@keyframes date-float{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@keyframes date-sparkle{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:1;transform:scale(1.05)}}
@keyframes date-rays{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes date-sway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2deg)}}
@container (max-aspect-ratio:3/4){.date-layout-illustrated{flex-direction:column;gap:2%}.date-layout-illustrated .date-art{height:28%;width:60%}.date-layout-illustrated .date-content{width:100%;height:68%;min-height:0}.date-layout-side .date-content{display:flex;flex-direction:column}.date-layout-side .date-main{border:0;flex:1}.date-layout-side .date-cap{height:18%;order:-1}.date-layout-side .date-footer{height:20%}}
@container (max-height:100px){.date-footer{display:none}.date-layout-side .date-footer{display:none}.date-layout-side .date-cap{grid-row:1/3}.date-layout-illustrated .date-cap{display:none}.date-layout-today .date-cap{font-size:10cqb}.date-layout-today .date-main{flex:1}}
@container (max-width:130px){.date-footer{display:none}.date-layout-side .date-footer{display:none}.date-layout-side .date-cap{grid-row:1/3}.date-layout-calendar .date-cap{height:24%}.date-layout-today .date-cap{font-size:min(8cqi,12cqb)}}
/* Same thumbnail scale as Clock 3.1; one dialog scroll and no visual settings. */
.date-editor-dialog{width:min(1100px,96vw)!important;max-width:1100px!important;max-height:92dvh!important;padding:16px!important;overflow:auto!important;overscroll-behavior:contain}
.date-editor-dialog>header{position:sticky;top:-16px;z-index:5;background:#fff;padding:6px 2px 10px;border-bottom:1px solid #e1e8f1;margin:-2px -2px 0}
.date-editor-dialog .b-dialog-body{overflow:visible!important;max-height:none!important;padding:0!important}
.date-functional{display:flex;align-items:flex-end;flex-wrap:wrap;gap:8px 18px;margin:10px 0 0;padding:0 0 8px;border-bottom:1px solid #edf1f6}
.date-functional label{display:flex;flex-direction:column;gap:3px;font-size:11px;color:#56697e}
.date-functional input,.date-functional select{font:inherit!important;font-size:12px!important;min-height:32px!important;height:32px!important;padding:5px 8px!important;margin:0!important;width:auto!important;border:1px solid #d8e1ec;border-radius:6px}
.date-timezone{margin-left:auto;position:relative;font-size:12px;color:#526b8d;align-self:center}.date-timezone summary{cursor:pointer;padding:6px}.date-timezone[open]>label{position:absolute;right:0;top:100%;padding:12px;background:#fff;border:1px solid #d8e1ec;border-radius:8px;z-index:6;box-shadow:0 5px 20px #23375320}
.date-functional [hidden]{display:none!important}.date-editor-dialog [data-date-error]{font-size:12px;color:#ac3d46;margin:4px 0}.date-editor-dialog [data-date-error]:empty{display:none}
.date-gallery-note{display:flex;align-items:center;gap:10px;font-size:11px;color:#6a7a90;margin:8px 0}
.date-gallery section{margin:0 0 12px}.date-gallery h3{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#53657d;margin:10px 0 6px}
.date-preset-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.date-preset-choice{position:relative;display:flex!important;flex-direction:column;min-width:0;padding:5px!important;gap:5px;border:1.5px solid #dde5ef;border-radius:10px;background:#fafbfd;cursor:pointer}
.date-preset-choice:has(:checked){border-color:#356ad3;box-shadow:0 0 0 1px #356ad3;background:#edf4ff}.date-preset-choice:focus-within{outline:3px solid #e8b954;outline-offset:2px}
.date-preset-choice>input{position:absolute!important;width:1px!important;height:1px!important;opacity:0;top:5px;left:5px}
.date-preset-choice>strong{font-size:11px;font-weight:650;line-height:1.2;text-align:center;color:#33465e;min-height:26px;display:flex;align-items:center;justify-content:center}
.date-mini{display:block;width:100%;height:78px;container-type:size;pointer-events:none;overflow:hidden}
.date-mini .gelara-date{padding:min(4cqi,4cqb);border-width:1px;box-shadow:none}.date-mini .date-footer{display:flex!important}.date-mini .date-cap{display:flex!important}.date-mini .date-layout-side .date-cap{grid-row:1}.date-mini .date-layout-calendar .date-cap{height:22%}.date-mini .date-layout-today .date-cap{font-size:8px}
.date-mini .date-skin-rings,.date-mini .date-skin-sway{padding-top:min(9cqi,9cqb)}.date-mini .date-skin-chalk{border-width:3px}.date-mini .date-art{width:30%}
.date-current-mini{display:flex;width:70px;height:40px;flex:none;container-type:size;overflow:hidden;align-items:center;justify-content:center;gap:2px}.date-current-mini .b-date-number{font-size:25px!important}.date-current-mini .b-clock-date{font-size:6px!important}.date-current-mini .classroom-calendar-card{width:100%;height:100%}.date-current-mini .sticker-smart{height:100%;width:100%}
@media(max-width:860px){.date-preset-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:650px){.date-preset-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.date-editor-dialog{padding:12px!important}.date-editor-dialog>header{top:-12px}.date-mini{height:83px}.date-timezone{margin-left:0}}
@media(max-width:380px){.date-preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.gelara-date,.gelara-date *,.gelara-date:after,.gelara-date *:after{animation:none!important;transition:none!important}}

.date-skin-pastel .date-cap{color:var(--date-ink)}

.date-skin-school .date-cap{color:var(--date-ink)}

.date-skin-clean .date-cap,.date-skin-pro .date-cap,.date-skin-agenda .date-cap{color:var(--date-ink)}

.date-legacy{margin-top:12px;font-size:12px;color:#62718a}.date-legacy summary{cursor:pointer;padding:7px 0}.date-legacy-content{display:flex;align-items:center;padding:6px 0}
.date-legacy .date-current-mini{width:70px!important;height:40px!important;max-width:70px;max-height:40px;min-width:0;min-height:0;flex:0 0 70px;overflow:hidden;contain:size layout paint;container-type:size}
/* Preserve the old face and data; constrain its typography by the widget's actual height. */
.b-widget.type-date:has(>.b-widget-body>.b-date-number){container-type:size}
.b-widget.type-date>.b-widget-body>.b-date-number{font-size:clamp(8px,min(31cqi,53cqb),185px)!important}
.b-widget.type-date>.b-widget-body:has(>.b-date-number)>.b-clock-date{font-size:clamp(6px,min(5.5cqi,14cqb),36px)!important}
@container(max-height:160px){.b-widget.type-date>.b-widget-body:has(>.b-date-number){padding:min(3cqi,3cqb)!important;gap:2px!important}}

/* A single fitted SVG keeps all seven columns aligned at every aspect ratio. */
.gelara-date.date-monthly{padding:min(3cqi,3cqb);border:1px solid color-mix(in srgb,var(--date-accent) 30%,transparent);border-radius:min(4cqi,20px)}
.month-sheet{display:block;width:100%;height:100%;min-width:0;min-height:0;font-family:inherit;font-variant-numeric:tabular-nums}
.month-heading{font-weight:750}.date-skin-month-blue{border-top:min(2cqb,9px) solid var(--date-accent)!important}
.date-skin-month-warm{font-family:Georgia,serif;box-shadow:inset 0 -6px 0 #d6b28e30}
.date-skin-month-color{background:linear-gradient(135deg,#fff2d8,#f4e8f5 60%,#e1f5ee);border:2px dashed #ddbc75!important}
.date-skin-month-color .month-heading{fill:#92516f}.date-skin-month-gelara{border-bottom:5px solid #89b8db!important}

.month-compact{display:none;width:100%;height:100%;font-family:inherit}
@container(max-width:180px){.date-monthly .month-sheet{display:none}.date-monthly .month-compact{display:block}}
@container(max-height:160px){.date-monthly .month-sheet{display:none}.date-monthly .month-compact{display:block}}
.date-mini .month-sheet{display:block!important}.date-mini .month-compact{display:none!important}

/* The split body owns scrolling; legacy modal overflow must not escape it. */
.b-dialog.b-split-panel.date-editor-dialog>.b-dialog-body{overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;touch-action:pan-y;scrollbar-gutter:stable}