/* Shared text-resilience layer.
   Loaded after route styles so copy, not an arbitrary box, determines height. */
:where(
  .top>*,.legal-top>*,.top-actions>*,.hero>*,.region-grid>*,.region>*,
  .rule-grid>*,.rule>*,.city-list>*,.city-guide>*,.coming>*,
  .contact-grid>*,.frow>*,.faq-heading>*,.ticket-reminder>*,
  .site-footer-top>*,.site-footer-brand-row>*,.site-footer-links>*,
  .time-button>*,.time-copy,.holiday-link>*,.carchip>*,.mx-menu .row>*,
  .mx-legendbar>*,.mx-strip>*,.ns-head>*,.ns-hero>*,.ns-row>*,
  .ns-row .rtxt,.ns-utilities>*,.ns-session>*,.ns-feedback>*,
  .lot-fact>*,.lot-tip>*
){
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

:where(
  .time-copy strong,.toast,.sweepchip,.holiday-link .hl-rule,
  .holiday-link .hl-action,.carchip .cc-t,.loadchip span,.installchip,
  .mx-menu .row>span:not(.arr),.mx-legendbar .li,.mx-strip .tx,
  .mx-toastbig,.mx-toastbig a,.ns-row .rtxt strong,.ns-row .rtxt span,
  .ns-quiet,.ns-end-parking,.ns-community-toggle,.ns-feedback,
  .ns-more,.ns-expand,.ns-util span,.lot-fact,.lot-tip,.site-footer-links a,
  .site-footer-note,.city-link,.answer,.ticket-reminder p
){
  white-space:normal;
  text-overflow:clip;
  overflow:visible;
  overflow-wrap:break-word;
}

:where(
  .time-button,.toast,.sweepchip,.holiday-link,.carchip,.loadchip,
  .installchip,.mx-menu .row,.mx-strip,.ns-row,.ns-quiet,
  .ns-session,.ns-end-parking,.ns-community-toggle,.ns-feedback,
  .ns-more,.ns-expand,.lot-fact,.lot-tip,.site-footer-links a,.answer,
  .ticket-reminder,.rule,.city-guide,.coming
){
  height:auto;
  min-height:fit-content;
  box-sizing:border-box;
}

:where(
  .time-button,.holiday-link,.mx-menu .row,.ns-row,.ns-quiet,
  .ns-end-parking,.ns-community-toggle,.ns-feedback,.ns-more,
  .ns-expand,.site-footer-links a
){
  min-height:44px;
}

/* These selectors deliberately outrank route CSS. The earlier :where() rules
   provide broad defaults; this block holds the variable-copy invariants. */
html body .time-copy strong,
html body .toast,
html body .sweepchip,
html body .holiday-link .hl-rule,
html body .holiday-link .hl-action,
html body .carchip .cc-t,
html body .loadchip span,
html body .installchip,
html body .mx-menu .row>span:not(.arr),
html body .mx-legendbar .li,
html body .mx-strip .tx,
html body .mx-toastbig,
html body .mx-toastbig a,
html body .ns-row .rtxt strong,
html body .ns-row .rtxt span,
html body .ns-quiet,
html body .ns-end-parking,
html body .ns-community-toggle,
html body .ns-feedback,
html body .ns-more,
html body .ns-expand,
html body .ns-util span,
html body .lot-fact,
html body .lot-tip,
html body .site-footer-links a,
html body .site-footer-note,
html body .city-link,
html body .answer,
html body .ticket-reminder p{
  white-space:normal;
  text-overflow:clip;
  overflow:visible;
  overflow-wrap:break-word;
}
html body .time-button,
html body .toast,
html body .sweepchip,
html body .holiday-link,
html body .carchip,
html body .loadchip,
html body .installchip,
html body .mx-menu .row,
html body .mx-strip,
html body .ns-row,
html body .ns-quiet,
html body .ns-session,
html body .ns-end-parking,
html body .ns-community-toggle,
html body .ns-feedback,
html body .ns-more,
html body .ns-expand,
html body .lot-fact,
html body .lot-tip,
html body .site-footer-links a,
html body .answer,
html body .ticket-reminder,
html body .rule,
html body .city-guide,
html body .coming{
  height:auto;
  min-height:fit-content;
  box-sizing:border-box;
}
html body .time-button,
html body .holiday-link,
html body .mx-menu .row,
html body .ns-row,
html body .ns-quiet,
html body .ns-end-parking,
html body .ns-community-toggle,
html body .ns-feedback,
html body .ns-more,
html body .ns-expand,
html body .site-footer-links a{
  min-height:44px;
}

html body .time-button{
  padding-block:6px;
  align-items:center;
}
.time-copy{
  flex:1 1 auto;
  min-width:0;
  line-height:1.35;
}
.time-copy strong{
  width:100%;
  max-width:none;
}
.time-live,.time-change,.time-arrow{flex:0 0 auto}

.toast{
  width:fit-content;
  max-width:min(640px,calc(100% - 32px));
  padding:10px 14px;
  line-height:1.5;
  border-radius:10px;
}
.sweepchip{
  width:fit-content;
  max-width:min(560px,calc(100% - 24px));
  line-height:1.45;
  border-radius:12px;
}
.carchip{
  width:fit-content;
  max-width:min(560px,calc(100% - 24px));
  align-items:flex-start;
  border-radius:14px;
}
.carchip .cc-t{flex:1 1 auto;line-height:1.45}
.loadchip,.installchip{line-height:1.45;border-radius:14px}

.mx-menu .row{
  align-items:flex-start;
  padding-block:11px;
  line-height:1.45;
}
.mx-menu .row>svg,.mx-menu .row>.arr{flex:0 0 auto}
.mx-menu .row>.arr{align-self:flex-start}
.mx-legendbar .li{--lg-lh:1.35;--lg-sw-h:3px;align-items:flex-start;line-height:var(--lg-lh)}
/* flex-start keeps a wrapped label's swatch on its own first line, but a 3px
   bar then sits on that line's top edge, roughly 6px above the text's optical
   centre. Derive the nudge from the same line-height and swatch height so the
   three values cannot drift apart. */
.mx-legendbar .sw{margin-top:calc((var(--lg-lh) * 1em - var(--lg-sw-h)) / 2)}
.mx-strip{
  align-items:flex-start;
  width:fit-content;
  max-width:min(560px,calc(100vw - 90px));
  padding-top:7px;
  padding-bottom:7px;
}
.mx-strip .tx{line-height:1.45}

.ns-row,.ns-feedback,.lot-fact,.lot-tip{align-items:flex-start}
.ns-quiet,.ns-end-parking{line-height:1.4;text-align:center}
.ns-community-toggle,.ns-more,.ns-expand{line-height:1.45;text-align:left}
.site-footer-links a{align-items:flex-start;padding-top:12px;padding-bottom:12px}
.site-footer-note{max-width:72ch}

html[lang="ko"] :where(
  h1,h2,h3,p,li,th,td,summary,button,a,label,small,strong,
  .answer,.toast,.sweepchip,.carchip,.mx-strip,.ns-row,
  .site-footer-links,.site-footer-note
){
  word-break:keep-all;
  overflow-wrap:break-word;
}
html[lang="en"] :where(
  h1,h2,h3,p,li,th,td,summary,button,a,label,small,strong,
  .answer,.toast,.sweepchip,.carchip,.mx-strip,.ns-row,
  .site-footer-links,.site-footer-note
){
  word-break:normal;
  overflow-wrap:break-word;
}

@media(min-width:641px) and (max-width:1024px){
  :where(.rule,.city-guide,.coming,.hero,.answer){
    padding-left:min(24px,3vw);
    padding-right:min(24px,3vw);
  }
  .rule-grid,.city-list,.contact-grid{min-width:0}
}

@media(max-width:640px){
  h1{
    font-size:clamp(32px,10vw,42px);
    line-height:1.08;
  }
  :where(.hero,.rule,.city-guide,.coming,.answer,form){
    height:auto;
    padding-left:18px;
    padding-right:18px;
  }
  .time-button{width:min(100%,calc(100vw - 24px))}
  .time-copy{min-width:0}
  .toast{width:min(100% - 32px,560px);padding:8px 11px}
  .sweepchip,.carchip,.loadchip,.installchip{max-width:calc(100% - 24px)}
  .mx-strip{max-width:calc(100vw - 90px)}
  .actions{grid-template-columns:1fr}
  .actions .primary{grid-column:auto}
  .legal-top,.top-actions{min-width:0}
}

@media(max-width:430px){
  .top,.legal-top{
    align-items:flex-start;
    flex-wrap:wrap;
  }
  .top .langnav,.legal-top .top-actions{
    width:100%;
  }
  .top .langnav .langbtn{flex:1 1 0}
  .top-actions{justify-content:space-between;flex-wrap:wrap}
  .rule.has-character,.rule:nth-child(even).has-character{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    min-height:0;
    padding-right:0;
  }
  .rule-character,.rule-character--marty{
    position:static;
    justify-self:end;
    width:auto;
    height:76px;
    margin-top:12px;
  }
  .faq-heading{
    grid-template-columns:minmax(0,1fr);
  }
  .faq-character{
    justify-self:end;
    height:76px;
  }
  .ticket-reminder{
    grid-template-columns:1fr;
  }
  .ticket-reminder img{
    justify-self:start;
    height:68px;
  }
}

@media(max-width:400px){
  html body .mx-pill-logo{height:22px}
  html body .mx-pill{padding:0 3px 0 5px;gap:4px}
  html body .mx-pill .searchwrap{gap:3px}
}
@media(max-width:340px){
  html body .mx-pill-logo{display:none}
}