:root {
  --site-gutter: 16px;
  --site-content-standard: 1120px;
  --site-content-wide: 1400px;
  --site-content-narrow: 880px;
  --site-bg-texture: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.025'/%3E%3C/svg%3E");
}
@media (min-width: 760px) {
  :root { --site-gutter: 24px; }
}
@media (min-width: 1180px) {
  :root { --site-gutter: 36px; }
}
.site-shell,
.site-shell-wide {
  width: min(var(--site-content-wide), calc(100vw - var(--site-gutter) - var(--site-gutter)));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}
.site-shell-standard {
  width: min(var(--site-content-standard), calc(100vw - var(--site-gutter) - var(--site-gutter)));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}
.site-shell-narrow {
  width: min(var(--site-content-narrow), calc(100vw - var(--site-gutter) - var(--site-gutter)));
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  padding-left: 0;
  padding-right: 0;
}
@media (max-width: 767px) {
  .site-shell,
  .site-shell-wide { --site-gutter: var(--space-mobile-gutter); }
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
img,svg{display:block}
.hidden{display:none!important}
.block{display:block}
.inline-block{display:inline-block}
.flex{display:flex}
.inline-flex{display:inline-flex}
.grid{display:grid}
.relative{position:relative}
.absolute{position:absolute}
.fixed{position:fixed}
.inset-0{inset:0}
.top-0{top:0}
.left-0{left:0}
.right-0{right:0}
.z-0{z-index:var(--layer-base)}
.z-1{z-index:var(--layer-content)}
.mx-auto{margin-left:auto;margin-right:auto}
.ml-1{margin-left:var(--space-ui-1)}
.ml-2{margin-left:var(--space-ui-2)}
.mt-0\.5{margin-top:var(--space-ui-0-5)}
.mt-1{margin-top:var(--space-ui-1)}
.mt-1\.5{margin-top:var(--space-ui-1-5)}
.mt-2{margin-top:var(--space-ui-2)}
.mb-1{margin-bottom:var(--space-ui-1)}
.mb-1\.5{margin-bottom:var(--space-ui-1-5)}
.mb-2{margin-bottom:var(--space-ui-2)}
.mb-3{margin-bottom:var(--space-ui-3)}
.mb-4{margin-bottom:var(--space-ui-4)}
.mb-5{margin-bottom:var(--space-ui-5)}
.mb-6{margin-bottom:var(--space-ui-6)}
.p-1\.5{padding:var(--space-ui-1-5)}
.p-3{padding:var(--space-ui-3)}
.p-4{padding:var(--space-ui-4)}
.p-6{padding:var(--space-ui-6)}
.p-8{padding:var(--space-ui-8)}
.px-1\.5{padding-left:var(--space-ui-1-5);padding-right:var(--space-ui-1-5)}
.px-2{padding-left:var(--space-ui-2);padding-right:var(--space-ui-2)}
.px-2\.5{padding-left:var(--space-ui-2-5);padding-right:var(--space-ui-2-5)}
.px-3{padding-left:var(--space-ui-3);padding-right:var(--space-ui-3)}
.px-4{padding-left:var(--space-ui-4);padding-right:var(--space-ui-4)}
.py-0\.5{padding-top:var(--space-ui-0-5);padding-bottom:var(--space-ui-0-5)}
.py-1{padding-top:var(--space-ui-1);padding-bottom:var(--space-ui-1)}
.py-1\.5{padding-top:var(--space-ui-1-5);padding-bottom:var(--space-ui-1-5)}
.py-2{padding-top:var(--space-ui-2);padding-bottom:var(--space-ui-2)}
.py-2\.5{padding-top:var(--space-ui-2-5);padding-bottom:var(--space-ui-2-5)}
.py-3{padding-top:var(--space-ui-3);padding-bottom:var(--space-ui-3)}
.py-6{padding-top:var(--space-ui-6);padding-bottom:var(--space-ui-6)}
.py-8{padding-top:var(--space-ui-8);padding-bottom:var(--space-ui-8)}
.py-12{padding-top:var(--space-scale-rem-3);padding-bottom:var(--space-scale-rem-3)}
.py-16{padding-top:var(--space-scale-rem-4);padding-bottom:var(--space-scale-rem-4)}
.pt-1{padding-top:var(--space-ui-1)}
.pt-4{padding-top:var(--space-ui-4)}
.pb-2{padding-bottom:var(--space-ui-2)}
.pb-12{padding-bottom:var(--space-scale-rem-3)}
.pb-16{padding-bottom:var(--space-scale-rem-4)}
.pr-3{padding-right:var(--space-ui-3)}
.space-y-1\.5>:not([hidden])~:not([hidden]){margin-top:var(--space-ui-1-5)}
.space-y-3>:not([hidden])~:not([hidden]){margin-top:var(--space-ui-3)}
.max-w-3xl{max-width:var(--size-content-3xl)}
.max-w-5xl{max-width:var(--size-content-5xl)}
.w-3{width:var(--size-scale-px-12)}
.w-3\.5{width:var(--size-scale-px-14)}
.w-4{width:var(--size-scale-px-16)}
.w-5{width:var(--size-scale-px-20)}
.w-7{width:var(--size-scale-px-28)}
.w-8{width:var(--size-scale-px-32)}
.w-14{width:var(--size-scale-px-56)}
.w-16{width:var(--size-scale-px-64)}
.w-32{width:var(--size-scale-px-128)}
.w-80{width:var(--size-scale-px-320)}
.w-full{width:100%}
.h-3{height:var(--size-scale-px-12)}
.h-3\.5{height:var(--size-scale-px-14)}
.h-4{height:var(--size-scale-px-16)}
.h-5{height:var(--size-scale-px-20)}
.h-7{height:var(--size-scale-px-28)}
.h-14{height:var(--size-scale-px-56)}
.min-h-screen{min-height:100vh}
.min-w-0{min-width:0}
.flex-1{flex:1 1 0%}
.flex-col{flex-direction:column}
.flex-wrap{flex-wrap:wrap}
.flex-shrink-0{flex-shrink:0}
.items-center{align-items:center}
.justify-center{justify-content:center}
.justify-between{justify-content:space-between}
.gap-0\.5{gap:var(--space-ui-0-5)}
.gap-1{gap:var(--space-ui-1)}
.gap-1\.5{gap:var(--space-ui-1-5)}
.gap-2{gap:var(--space-ui-2)}
.gap-3{gap:var(--space-ui-3)}
.gap-4{gap:var(--space-ui-4)}
.gap-x-6{column-gap:var(--space-ui-6)}
.gap-y-1{row-gap:var(--space-ui-1)}
.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.aspect-\[2\/3\]{aspect-ratio:2/3}
.aspect-video{aspect-ratio:16/9}
.overflow-hidden{overflow:hidden}
.overflow-x-auto{overflow-x:auto}
.border{border:var(--size-scale-px-1) solid var(--border)}
.border-b{border-bottom:var(--size-scale-px-1) solid var(--border)}
.border-t{border-top:var(--size-scale-px-1) solid var(--border)}
.border-collapse{border-collapse:collapse}
.border-red-900{border-color:var(--visual-error-border)}
.last\:border-0:last-child{border:0}
.rounded{border-radius:var(--radius-ui-xs)}
.rounded-md{border-radius:var(--radius-ui-sm)}
.rounded-lg{border-radius:var(--radius-ui-md)}
.rounded-xl{border-radius:var(--radius-ui-lg)}
.rounded-full{border-radius:var(--radius-pill)}
.object-cover{object-fit:cover}
.text-center{text-align:center}
.text-\[9px\]{font-size:var(--type-label)}
.text-\[10px\]{font-size:var(--type-kicker)}
.text-\[11px\]{font-size:var(--type-meta)}
.text-xs{font-size:var(--type-scale-rem--75);line-height:var(--leading-utility-xs)}
.text-sm{font-size:var(--type-scale-rem--875);line-height:var(--leading-utility-sm)}
.text-base{font-size:var(--type-scale-rem-1);line-height:var(--leading-utility-base)}
.text-lg{font-size:var(--type-scale-rem-1-125);line-height:var(--leading-utility-lg)}
.text-xl{font-size:var(--type-scale-rem-1-25);line-height:var(--leading-utility-xl)}
.font-medium{font-weight:500}
.font-semibold{font-weight:600}
.font-bold{font-weight:700}
.font-extrabold{font-weight:800}
.italic{font-style:italic}
.leading-snug{line-height:var(--leading-utility-snug)}
.leading-tight{line-height:var(--leading-utility-tight)}
.leading-relaxed{line-height:var(--leading-utility-relaxed)}
.break-all{word-break:break-all}
.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.whitespace-nowrap{white-space:nowrap}
.text-white{color:var(--text-primary)}
.text-red-400{color:var(--visual-error-text)}
.text-green-400{color:var(--status-green)}
.text-green-600{color:var(--visual-success-solid)}
.text-yellow-400{color:var(--resource-badge-remux-text)}
.bg-slate-800{background:var(--bg-surface)}
.bg-slate-700{background:var(--bg-surface-hover)}
.bg-blue-600{background:var(--status-blue)}
.border-slate-600{border-color:var(--visual-border-medium)}
.shadow-2xl{box-shadow:var(--shadow-dialog)}
.opacity-0{opacity:var(--opacity-hidden)}
.opacity-25{opacity:var(--opacity-subtle)}
.opacity-75{opacity:var(--opacity-quiet)}
.opacity-100{opacity:var(--opacity-visible)}
.transition{transition-property:color,background-color,border-color,opacity,transform;transition-duration:var(--motion-duration-base);transition-timing-function:var(--motion-ease-standard)}
.duration-100{transition-duration:var(--motion-duration-fast)}
.ease-out{transition-timing-function:var(--motion-ease-out)}
.animate-spin{animation:spin var(--motion-duration-spin) linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.hover\:text-white:hover{color:var(--text-primary)}
.hover\:text-\[\#d4a04a\]:hover{color:var(--accent)}
.hover\:opacity-80:hover{opacity:var(--opacity-hover)}
.hover\:bg-blue-700:hover{background:var(--status-blue-hover)}
.active\:bg-blue-800:active{background:var(--status-blue-active)}
@media (min-width:640px){
  .sm\:w-40{width:var(--size-scale-px-160)}
  .sm\:gap-6{gap:var(--space-ui-6)}
  .sm\:text-2xl{font-size:var(--type-scale-rem-1-5);line-height:var(--leading-utility-xs)}
  .sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (prefers-reduced-motion:reduce){
  .animate-spin{animation:none}
  .transition{transition-duration:var(--motion-duration-instant)}
}

  html { padding-top: constant(safe-area-inset-top); padding-top: env(safe-area-inset-top, 0); background: var(--bg-body); background-image: var(--site-bg-texture); }
	  body { background: var(--bg-body); background-image: var(--site-bg-texture); font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI', system-ui, sans-serif; color: var(--text-primary); font-size: var(--type-section); line-height: 1.45; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
	  button { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
	  .calendar-shell { min-height:100vh; padding-top:var(--space-scale-px-16); padding-bottom:0; display:flex; flex-direction:column; }
	  .calendar-shell > .site-policy-footer { margin-top:auto; }
  /* UI-005 3b: episode-row-local tokens (not in ui-tokens.css -- that file is out of scope for
     this sub-stage; see docs/ui-audit/component-ownership-map.md 3b) collapsing the old flat
     desktop default + a separate !important mobile override at the 640px breakpoint into a single
     continuous clamp() spanning 320->1024px. Endpoints unchanged versus the pre-existing
     computed values (measured via getComputedStyle):
       --ep-row-gap        3.2px @320  -> 12px @1024+  (was gap-3 util + --mobile-density-gap)
       --ep-row-pad-block  4.8px @320  -> 10px @1024+  (was py-2.5 util + --mobile-density-card-pad)
       --ep-row-pad-inline 4.8px @320  -> 12px @1024+  (was px-3 util + --mobile-density-card-pad)
       --ep-row-radius     8px   @320  -> 0px  @1024+  (was --radius-mobile-md + unset default;
                                                          no visible effect, the poster list
                                                          wrapper in calendarPage.ts already
                                                          clips via overflow:hidden, but included
                                                          so the computed-style step disappears)
       --ep-row-svg-size   9.89844px@320 -> 16px @1024+ (.ep-row > svg had no CSS default at all
                                                          above 640px -- 16px came from the <svg>
                                                          element's own width/height HTML
                                                          attributes in calendarPage.ts)
       --calendar-poster-w 30px  @320  -> 44px @1024+  (was --size-calendar-poster-width)
       --calendar-poster-h 45px  @320  -> 66px @1024+  (was --size-calendar-poster-height,
                                                          aspect-ratio 2:3 preserved)
       --ep-row-text-sm    10px  @320  -> 12.5px@1024+ (was --type-card-title / --mobile-density-section)
       --ep-row-text-xs    8px   @320  -> 11px  @1024+ (was --type-meta / --mobile-density-meta)
     text-sm/text-xs are deliberately NOT expressed by editing --type-card-title/--type-label
     themselves (those tokens are shared across 3a/3b/3d/3e/3f, see component-ownership-map.md);
     these two selectors just stop consuming them and carry their own local formula instead, so
     other consumers of --type-card-title elsewhere are unaffected. */
  :root {
    --ep-row-gap: clamp(.2rem, -.05rem + 1.25vw, .75rem);
    --ep-row-pad-block: clamp(.3rem, .15227rem + .73864vw, .625rem);
    --ep-row-pad-inline: clamp(.3rem, .09545rem + 1.02273vw, .75rem);
    --ep-row-radius: clamp(0rem, .72727rem - 1.13636vw, .5rem);
    --ep-row-svg-size: clamp(.61865rem, .44531rem + .86670vw, 1rem);
    --calendar-poster-w: clamp(1.875rem, 1.47727rem + 1.98864vw, 2.75rem);
    --calendar-poster-h: clamp(2.8125rem, 2.21591rem + 2.98295vw, 4.125rem);
    --ep-row-text-sm: clamp(.625rem, .55398rem + .35511vw, .78125rem);
    --ep-row-text-xs: clamp(.5rem, .41477rem + .42614vw, .6875rem);
  }
  .ep-row { cursor: pointer; transition: background 0.15s; gap: var(--ep-row-gap); padding: var(--ep-row-pad-block) var(--ep-row-pad-inline); border-radius: var(--ep-row-radius); }
  .ep-row:hover { background: var(--bg-surface-hover); }
  .ep-row > svg { width: var(--ep-row-svg-size); height: var(--ep-row-svg-size); }
  .day-header-label { color: var(--text-primary); font-size:var(--type-section); line-height:var(--leading-section); }
  /* This selector also matched .ep-row img/.flex-shrink-0>div's old mobile-only !important
     override (same elements), so that redundant rule is removed below rather than duplicated. */
  .calendar-poster-thumb,
  .calendar-poster-fallback { width:var(--calendar-poster-w); height:var(--calendar-poster-h); aspect-ratio:2 / 3; border-radius:var(--radius-ui-xs); background:var(--bg-surface); }
  .calendar-poster-thumb { display:block; object-fit:cover; }
  .calendar-poster-fallback { display:flex; align-items:center; justify-content:center; color:var(--text-muted); font-size:var(--type-compact-label); }
  /* line-height keeps referencing var(--leading-meta) unconditionally (the old mobile override
     restated a literal 1.3, which is exactly --leading-meta's own 640px value -- removing the
     duplicate, not changing behavior). */
  .ep-row .text-sm { font-size:var(--ep-row-text-sm); line-height:var(--leading-meta); }
  .ep-row .text-xs { font-size:var(--ep-row-text-xs); line-height:var(--leading-meta); }
  .day-past .day-header-label { color: var(--text-muted); }
  .day-today .day-header-label {
    display: inline-block;
    padding: var(--space-scale-px-2) var(--space-scale-px-10);
    border-radius: var(--radius-ui-xs);
    background: var(--accent);
    color: var(--visual-body-solid);
    font-weight: 700;
  }
  .day-today { opacity: var(--opacity-visible); }
  /* My follows (assets-src/pages/calendar.js): signed-in readers only, current month only. It reuses the
     day header and .ep-row looks, and a line under it separates it from the dates. */
  .follow-block { scroll-margin-top: var(--space-scale-px-16); margin-bottom: var(--space-scale-px-28); padding-bottom: var(--space-scale-px-18); border-bottom: var(--size-scale-px-1) solid var(--border); }
  .follow-box { border-color: var(--border); }
  .follow-box > .follow-row + .follow-row,
  .follow-box > .follow-row + .follow-toggle,
  .follow-all > .follow-row { border-top: var(--size-scale-px-1) solid var(--border-row); }
  .follow-row-title { display: flex; align-items: center; gap: var(--space-scale-px-6); min-width: 0; color: var(--text-primary); }
  .follow-row-title > .truncate { min-width: 0; }
  .follow-row-meta { color: var(--text-muted); }
  .follow-row-chevron { color: var(--text-faint); }
  .follow-new-badge { flex-shrink: 0; padding: 0 var(--space-scale-px-5); border-radius: var(--radius-ui-xs); background: var(--visual-accent-fill-soft); color: var(--accent); font-size: var(--ep-row-text-xs); line-height: var(--leading-section); font-weight: var(--weight-label); }
  .follow-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: var(--size-scale-px-44); margin: 0; padding: var(--ep-row-pad-block) var(--ep-row-pad-inline); border: 0; background: transparent; color: var(--text-muted); font-size: var(--ep-row-text-sm); text-align: left; transition: background 0.15s; }
  .follow-toggle:hover { background: var(--bg-surface-hover); }
  .follow-toggle-chevron { width: var(--ep-row-svg-size); height: var(--ep-row-svg-size); transition: transform 0.2s; }
  .follow-toggle[aria-expanded="true"] .follow-toggle-chevron { transform: rotate(180deg); }
  /* Today's header shares its line with the jump link back to the block. */
  .follow-today-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-scale-px-8); }
  .follow-today-link { flex-shrink: 0; color: var(--accent); font-size: var(--ep-row-text-sm); white-space: nowrap; }
  .follow-today-link:hover { color: var(--accent-hover); }
  @media (prefers-reduced-motion: reduce) { .follow-toggle-chevron { transition: none; } }
  .calendar-back-link {
    min-height: var(--size-scale-px-44);
    min-width: var(--size-scale-px-44);
    padding: 0 var(--space-scale-px-4);
    color: var(--text-muted);
    transition: color 0.15s ease, opacity 0.15s ease;
  }
  .calendar-back-link:hover { color: var(--text-secondary); }
  .language-toggle,
  .calendar-month-btn,
  .calendar-month-label {
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--visual-calendar-border);
    box-shadow: none;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, opacity 0.15s ease;
    -webkit-tap-highlight-color: transparent;
  }
  .language-toggle {
    min-width: var(--size-scale-px-44);
    min-height: var(--size-scale-px-44);
    width: var(--size-scale-px-44);
    border-radius: var(--radius-ui-md);
    background: var(--visual-calendar-surface);
    color: var(--text-secondary);
    font-size: var(--type-meta);
    font-weight: 800;
    line-height: 1;
  }
  .language-toggle:hover {
    background: var(--visual-calendar-surface-hover);
    border-color: var(--visual-calendar-border-hover);
    color: var(--text-primary);
  }
  .deep-page-header-actions { display:flex; align-items:center; gap:var(--space-scale-px-8); }
  .deep-nav-actions { display:flex; align-items:center; gap:var(--space-scale-px-8); }
  .deep-nav-icon { width:var(--size-scale-px-44); min-width:var(--size-scale-px-44); height:var(--size-scale-px-44); display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--visual-calendar-border); border-radius:var(--radius-ui-md); background:var(--visual-calendar-surface); color:var(--text-secondary); transition:background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease; }
  .deep-nav-icon:hover { background:var(--visual-calendar-surface-hover); border-color:var(--visual-calendar-border-hover); color:var(--text-primary); }
  .deep-nav-icon:active { transform:translateY(1px); }
  .deep-nav-icon svg { width:var(--size-scale-px-19); height:var(--size-scale-px-19); }
  .deep-nav-vip { color:var(--accent); }
  .calendar-month-btn {
    min-width: var(--size-scale-px-76);
    min-height: var(--size-scale-px-44);
    border-radius: var(--radius-ui-sm);
    background: var(--visual-calendar-card);
    color: var(--text-muted);
  }
  .calendar-month-btn:hover {
    background: var(--visual-calendar-card-hover);
    border-color: var(--visual-calendar-border-hover);
    color: var(--text-secondary);
  }
  .calendar-month-label {
    min-width: var(--size-scale-px-132);
    min-height: var(--size-scale-px-44);
    border-radius: var(--radius-ui-sm);
    background: var(--visual-calendar-accent-soft);
    border-color: var(--visual-calendar-accent-border);
    color: var(--accent);
  }
  .calendar-month-label:hover {
    background: var(--visual-calendar-accent-hover);
    border-color: var(--visual-calendar-accent-hover-border);
  }
  .calendar-month-btn:active,
  .calendar-month-label:active,
  .language-toggle:active,
  .calendar-back-link:active { opacity: var(--opacity-secondary); }
  .spinner { border: 2px solid var(--bg-surface); border-top-color: var(--accent); border-radius: 50%; width: var(--size-scale-px-24); height: var(--size-scale-px-24); animation: spin 0.7s linear infinite; }
  @keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 640px) {
  :root {
    --mobile-density-control:var(--size-mobile-control);
    --mobile-density-section:var(--type-section);
    --mobile-density-body:var(--type-card-copy);
    --mobile-density-meta:var(--type-meta);
    --mobile-density-gap:var(--space-mobile-gap);
    --mobile-density-card-pad:var(--space-mobile-card-pad);
  }
  body { font-size:var(--mobile-density-body); }
  .calendar-shell { padding-top:var(--space-scale-px-7); }
  .calendar-back-link,
  .language-toggle,
  .deep-nav-icon { min-height:var(--mobile-density-control); }
  .language-toggle,
  .deep-nav-icon { min-width:var(--mobile-density-control); width:var(--mobile-density-control); height:var(--mobile-density-control); }
  .calendar-back-link { min-width:0; font-size:var(--type-control); line-height:1.2; }
  .calendar-back-link svg { width:var(--size-mobile-icon); height:var(--size-mobile-icon); }
  .language-toggle,
  .deep-nav-icon { font-size:var(--type-control); }
  .deep-page-header-actions,
  .deep-nav-actions { gap:var(--space-scale-px-4); }
  .deep-nav-icon svg { width:var(--size-mobile-icon); height:var(--size-mobile-icon); }
  .calendar-month-btn { position:relative; min-width:var(--size-mobile-date-button); min-height:var(--mobile-density-control); font-size:var(--mobile-density-body); }
  .calendar-month-label { position:relative; min-width:var(--size-mobile-date-label); min-height:var(--mobile-density-control); font-size:var(--mobile-density-body); }
  /* UI-011: invisible hit-area expansion toward 44x44 on mobile. */
  .calendar-month-btn::after,
  .calendar-month-label::after {
    content:"";
    position:absolute;
    inset: min(-2px, calc((var(--mobile-density-control) - 44px) / 2));
  }
  .calendar-shell .mb-5 { margin-bottom:var(--space-scale-rem-0-75); }
  .calendar-shell .mb-6 { margin-bottom:var(--space-scale-rem-1); }
  .calendar-shell .mb-2 { margin-bottom:var(--space-scale-rem-0-375); }
  .day-today .day-header-label { padding:var(--space-scale-px-2) var(--space-scale-px-8); }
  .day-header-label { font-size:var(--mobile-density-section); }
  /* UI-005 3b: .ep-row gap/padding/border-radius, .ep-row img/.flex-shrink-0>div (poster) size,
     .ep-row .text-sm/.text-xs font-size, and .ep-row > svg size are now single continuous
     clamp()s defined once, unconditionally, above -- this mobile-only !important layer that
     used to create the hard step at 640px is removed, not moved. */
  .calendar-back-link,
  .language-toggle,
  .deep-nav-icon,
  .calendar-month-btn,
  .calendar-month-label { border-radius:var(--radius-ui-sm)!important; }
}

  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
  }