:root {
        --ink: #12141c;
        --panel: #1b1e29;
        --panel-raised: #232838;
        --hairline: #333a4f;
        --paper: #edf0f7;
        --muted: #9aa1ba;
        --faint: #6b7288;
        --ember: #e3a53f;
        --ember-strong: #f2bc5e;
        --lagoon: #5fb8b0;
        --violet: #a08cdb;
        --sky: #5b9bd5;
        --shadow: 0 18px 40px -20px rgba(0, 0, 0, 0.6);
        --radius-lg: 18px;
        --radius-md: 12px;
        --radius-sm: 8px;
        --font-display: "Fraunces", Georgia, "Iowan Old Style", serif;
        --font-body:
          "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
      }

      @media print {
        :root {
          --ink: #fbf8f1;
          --panel: #ffffff;
          --panel-raised: #f5efe1;
          --hairline: #d9d0ba;
          --paper: #211d13;
          --muted: #5a543f;
          --faint: #837b5e;
          --ember: #93641b;
          --ember-strong: #93641b;
          --lagoon: #2c7972;
          --violet: #5c4aa0;
          --sky: #1f5c8a;
          --shadow: none;
        }
      }

      *,
      *::before,
      *::after {
        box-sizing: border-box;
      }

      html {
        background: var(--ink);
      }

      body {
        margin: 0;
        background: var(--ink);
        color: var(--paper);
        font-family: var(--font-body);
        font-size: 15px;
        line-height: 1.5;
        -webkit-font-smoothing: antialiased;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
      }

      /* ---------- Trip header ---------- */

      .trip-header {
        max-width: 760px;
        margin: 0 auto;
        padding: 4rem 1.5rem 2.5rem;
        text-align: center;
      }

      .trip-eyebrow {
        font-family: var(--font-mono);
        font-size: 0.72rem;
        font-weight: 600;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: var(--ember);
      }

      .trip-title {
        margin: 0.6rem 0 0.5rem;
        font-family: var(--font-display);
        font-weight: 600;
        font-size: clamp(2.1rem, 5vw, 3.1rem);
        letter-spacing: -0.01em;
        color: var(--paper);
      }

      .trip-subtitle {
        margin: 0;
        color: var(--muted);
        font-size: 1rem;
      }

      .trip-subtitle strong {
        color: var(--paper);
        font-weight: 600;
      }

      @media print {
        .trip-header {
          padding: 0 0 1.25rem;
          text-align: left;
          border-bottom: 2px solid var(--paper);
          margin-bottom: 1.5rem;
        }
        .trip-title {
          font-size: 1.9rem;
        }
      }

      /* ---------- Overall document ---------- */

      itinerary-daily-plans {
        display: block;
        max-width: 760px;
        margin: 0 auto;
        padding: 0 1.5rem 5rem;
      }

      ul.day-panel-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 1.4rem;
      }

      @media print {
        itinerary-daily-plans {
          max-width: none;
          padding: 0;
        }
        ul.day-panel-list {
          gap: 0;
        }
        .day-panel-list > li + li {
          page-break-before: always;
        }
      }

      /* ---------- Day panel ---------- */

      itinerary-day-panel {
        display: block;
      }

      .dayPanel {
        background: var(--panel);
        border: 1px solid var(--hairline);
        border-radius: var(--radius-lg);
        box-shadow: var(--shadow);
        overflow: hidden;
      }

      @media print {
        .dayPanel {
          border-radius: 0;
          box-shadow: none;
          border: none;
          break-inside: avoid;
        }
      }

      .dayHeader {
        position: relative;
        padding: 0.9rem 1.2rem 1rem;
        background: var(--panel-raised);
      }

      .dayHeader h3 {
        margin: 0;
      }

      .dayHeader .clickable[role="button"] {
        display: flex;
        align-items: center;
        gap: 0.65rem;
        cursor: default;
      }

      /* the empty "Select" glyph becomes a stamped date marker */
      .dayHeader itinerary-font-icon {
        flex: 0 0 auto;
        display: none;
        width: 1.7rem;
        height: 1.7rem;
        border-radius: 50%;
        background: radial-gradient(
          circle at 32% 28%,
          var(--ember-strong),
          var(--ember) 70%
        );
        box-shadow:
          inset 0 0 0 2px rgba(0, 0, 0, 0.15),
          0 4px 10px -5px rgba(227, 165, 63, 0.55);
      }

      @media print {
        .dayHeader itinerary-font-icon {
          box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.15);
        }
      }

      .dayTitle {
        font-family: var(--font-display);
        font-weight: 600;
        font-size: 1.15rem;
        color: var(--paper);
      }

      /* perforated tear-line signature between header and plan list */
      .dayPlans {
        position: relative;
        padding: 1rem 1.2rem 0.9rem;
        border-top: 1px dashed var(--hairline);
      }

      .dayPlans::before,
      .dayPlans::after {
        content: "";
        position: absolute;
        top: -7px;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        background: var(--ink);
        border: 1px solid var(--hairline);
      }

      .dayPlans::before {
        left: -7px;
      }
      .dayPlans::after {
        right: -7px;
      }

      @media print {
        .dayPlans::before,
        .dayPlans::after {
          background: var(--ink);
        }
      }

      .dayPlans {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
      }

      .parkHoursCards {
        display: flex;
        flex-direction: column;
        gap: 0.4rem;
      }

      /* the "Hide/Show Park Hours" control has no script behind it in this static copy */
      a.show-hide-park-hours {
        display: none !important;
      }

      #parkHoursDisclaimer .park-hours-disclaimer {
        margin-top: 0.4rem;
        font-size: 0.78rem;
        color: var(--faint);
        text-align: center;
      }

      /* ---------- Plan cards ---------- */

      itinerary-plan-card {
        display: block;
      }

      .row.splash {
        display: none;
      }

      .planCard {
        background: var(--ink);
        border: 1px solid var(--hairline);
        border-left: 6px solid var(--hairline);
        border-radius: var(--radius-md);
        padding: 0.6rem 0.85rem;
      }

      @media print {
        .planCard {
          break-inside: avoid;
        }
      }

      .planCard.fastpass,
      .planCard.dining {
        border-left-color: var(--ember);
      }
      .planCard.park_hours {
        border-left-color: var(--lagoon);
      }
      .planCard.resort {
        display: none;
      }

      .planCard.resortMain {
        border-left-color: var(--violet);
      }

      .planCard[id^="flight-"] {
        border-left-color: var(--sky);
      }

      .planCard.note {
        border-left-color: var(--violet);
      }

      .planCard.custom {
        border-left-color: var(--faint);
      }

      .planCard .row {
        display: flex;
        align-items: flex-start;
        gap: 1.1rem;
      }

      .planCard .row + .row {
        margin-top: 0.5rem;
        padding-top: 0.5rem;
        border-top: 1px dashed var(--hairline);
      }

      .planCard .card-icon {
        flex: 0 0 auto;
        width: 0.5rem;
        height: 0.5rem;
        margin-top: 0.3rem;
        border-radius: 50%;
        background: var(--faint);
        display: none;
      }

      .planCard.fastpass .card-icon,
      .planCard.dining .card-icon {
        background: var(--ember);
      }
      .planCard.park_hours .card-icon {
        background: var(--lagoon);
      }
      .planCard.resortMain .card-icon {
        background: var(--violet);
      }
      .planCard[id^="flight-"] .card-icon {
        background: var(--sky);
      }

      .card-time,
      .time,
      .timeHeader {
        font-family: var(--font-mono);
      }

      .card-time {
        flex: 0 0 auto;
        min-width: 5.5rem;
        font-size: 0.85rem;
        font-weight: 600;
        color: var(--paper);
      }

      .card-time.splash {
        text-transform: uppercase;
        letter-spacing: 0.06em;
        font-size: 0.68rem;
        color: var(--ember);
        font-weight: 600;
        display: none;
      }

      .timeHeader {
        font-size: 0.68rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--faint);
        margin-bottom: 0.15rem;
      }

      .time {
        font-size: 0.85rem;
        color: var(--paper);
      }
      .hour {
        font-weight: 600;
      }

      .card-image {
        display: none;
      }

      .card-details {
        flex: 1 1 auto;
        min-width: 0;
      }

      .notice {
        display: none;
      }

      .title {
        font-size: 1.02rem;
        font-weight: 600;
        color: var(--paper);
        margin-bottom: 0.2rem;
      }

      .title a {
        color: inherit;
        text-decoration: none;
      }
      .title a:hover {
        text-decoration: underline;
      }
      .mobile-title-icon {
        display: none;
      }

      .location {
        color: var(--muted);
        font-size: 0.87rem;
      }

      .location-detail:not(:last-child)::after {
        content: " \2022 ";
        color: var(--faint);
      }

      .detailsCell {
        margin-top: 0.25rem;
        font-size: 0.83rem;
        color: var(--muted);
      }

      .detailsCell.confirmation span {
        font-family: var(--font-mono);
        color: var(--paper);
      }
      .detailsCell.date {
        color: var(--paper);
      }

      .locationHours,
      .earlyEntryHours {
        margin-top: 0.35rem;
        font-size: 0.83rem;
        color: var(--muted);
      }

      .locationHours .hours,
      .earlyEntryHours .hours {
        font-family: var(--font-mono);
        color: var(--paper);
      }

      .earlyEntryHours {
        display: none;
      }

      /* dead expand/collapse controls: reveal what they hid, drop the control itself */
      .show-details-button,
      .expandContentButton {
        display: none !important;
      }
      .hiddenDetails[hidden] {
        display: block !important;
        margin-top: 0.5rem;
        padding-top: 0.5rem;
        border-top: 1px dashed var(--hairline);
      }

      /* ---------- Buttons ---------- */

      .card-cta {
        display: none;
      }

      /* ---------- Guests ---------- */

      .card-guests {
        display: none;
      }

      /* ---------- Small utility classes used inline ---------- */

      .font12 {
        font-size: 12px;
      }
      .font14 {
        font-size: 14px;
      }
      .font16 {
        font-size: 16px;
      }
      .font18 {
        font-size: 18px;
      }
      .heavy {
        font-weight: 700;
      }
      .medium {
        font-weight: 500;
      }

      /* responsive short/long text pairs: show the long form, matching print */
      .d-hide {
        display: none;
      }
      .m-hide {
        display: inline;
      }

      @media (max-width: 560px) {
        .d-hide {
          display: inline;
        }
        .m-hide {
          display: none;
        }
      }

      @media print {
        .d-hide {
          display: none !important;
        }
        .m-hide {
          display: inline !important;
        }
      }