/* Every seasonal rule is opt-in. Removing data-theme restores the original DA. */
.halloween-only { display: none !important; }
html[data-theme="halloween"] {
  --red: #fa5968;
  --ink: #f1f0ee;
  --muted: #b4b6bc;
  --line: #383a40;
  --paper: #1b1d21;
  color-scheme: dark;
}
html[data-theme="halloween"] body { background: #111215; }
html[data-theme="halloween"] .halloween-only { display: block !important; }
html[data-theme="halloween"] .hero { display: none; }
html[data-theme="halloween"] :focus-visible { outline-color: #ff9c91; }
html[data-theme="halloween"] header { background: #101114f5; border-bottom-color: #3c252a; }
html[data-theme="halloween"] header .brand-wordmark { filter: brightness(0) invert(1); }
html[data-theme="halloween"] .nav nav a:hover { color: #ff737c; }
html[data-theme="halloween"] .button { background: #bb1222; border-color: #bb1222; border-radius: 3px; }
html[data-theme="halloween"] .button:hover { background: #d41b2c; border-color: #d41b2c; }
html[data-theme="halloween"] .button.outline { background: transparent; color: #f1f0ee; border-color: #74767b; }
html[data-theme="halloween"] .button.outline:hover { background: #34363a; }
html[data-theme="halloween"] .menu { color: #f1f0ee; }
html[data-theme="halloween"] .nav nav.open { background: #1b1d21; }
html[data-theme="halloween"] .live-dot { background: #ff5866; box-shadow: 0 0 0 4px #ff58661c; }

.halloween-hero {
  position: relative;
  overflow: hidden;
  background: radial-gradient(ellipse at 77% 52%, #69121e55, transparent 53%), linear-gradient(105deg, #101114f5 10%, #17181de8 70%, #101114eb), url('/assets/textures/aluminium-a4.webp') center / cover;
  border-bottom: 1px solid #494047;
}
.halloween-hero::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 90px;
  background: url('/assets/seasonal/drips.svg') top center / 1440px 90px repeat-x;
  pointer-events: none;
  opacity: .9;
}
.halloween-grid { display: grid; grid-template-columns: 1.1fr 1fr; align-items: center; gap: 80px; min-height: 745px; padding-top: 64px; padding-bottom: 54px; }
.halloween-copy { position: relative; z-index: 1; padding: 16px 0; }
.halloween-date { display: inline-flex; gap: 10px; align-items: center; color: #e0c6ca; font-size: 10px; font-weight: 700; letter-spacing: 2px; margin-bottom: 30px; }
.halloween-date::before { content: ''; width: 23px; height: 2px; background: #ed3c4d; }
.halloween-hero h1 { font-size: clamp(58px, 5.7vw, 82px); line-height: .99; letter-spacing: -.055em; }
.halloween-hero h1 em { display: inline-block; font-style: normal; color: #f04450; }
.halloween-hero .halloween-lead { margin-top: 28px; max-width: 390px; font-size: 18px; color: #d1d1d5; line-height: 1.65; }
.halloween-signature { margin-top: 20px; padding-left: 15px; border-left: 2px solid #ac1423; color: #aaaeb6; font-size: 13px; }
.halloween-signature strong { color: #f1f0ee; font-weight: 700; }
.halloween-hero .actions { gap: 22px; margin-top: 32px; }
.halloween-secondary { color: #d6d7dc; font-size: 13px; text-decoration: underline; text-underline-offset: 5px; padding: 12px 0; }
.halloween-print-note { margin-top: 14px; color: #a6a6af; font-size: 10px; letter-spacing: .3px; }
.halloween-art { position: relative; width: 100%; max-width: 398px; justify-self: center; margin: 0; }
.halloween-art::before { content: ''; position: absolute; inset: 9% -16%; background: #7c101a; filter: blur(60px); opacity: .3; pointer-events: none; }
.halloween-art a { position: relative; display: block; transform: rotate(2deg); box-shadow: 0 20px 70px #0009, 0 0 0 1px #ffffff25; transition: transform .25s; }
.halloween-art a:hover { transform: rotate(0); }
.halloween-art img { display: block; width: 100%; height: auto; }
.halloween-art figcaption { position: relative; display: flex; justify-content: space-between; margin-top: 23px; color: #b7afb5; font-size: 9px; letter-spacing: 1.3px; }
.halloween-art figcaption span:first-child { color: #f1d2d5; }
.halloween-stamp { margin-top: 32px; padding-top: 20px; border-top: 1px solid #ffffff21; display: flex; align-items: center; gap: 10px; font-size: 10px; color: #b8b9c0; letter-spacing: .5px; }
.halloween-stamp svg { color: #e12b3c; width: 23px; height: 23px; }

html[data-theme="halloween"] .promise-strip { background: #1c1e22; border-color: #37393e; }
html[data-theme="halloween"] .promise-strip svg,
html[data-theme="halloween"] .zone-title svg,
html[data-theme="halloween"] .diagnostic-seal svg { filter: grayscale(1) brightness(0) invert(.9); }
html[data-theme="halloween"] .protection-cards article { background: #1b1d21; border-color: #414046; border-radius: 4px; }
html[data-theme="halloween"] .protection-visual { background: radial-gradient(ellipse, #3b3e45, #23252b); border-color: #494148; }
html[data-theme="halloween"] .protection-cards .index { color: #c8c9d0; }
html[data-theme="halloween"] .how { background: linear-gradient(115deg, #191a1f, #25232a); border-block: 1px solid #39363d; }
html[data-theme="halloween"] .pricing article { background: #1b1d21; border-radius: 4px; }
html[data-theme="halloween"] .pricing .featured { border-top-left-radius: 0; border-top-right-radius: 0; }
html[data-theme="halloween"] .pricing .ribbon { border-radius: 3px 3px 0 0; background: #a51120; }
html[data-theme="halloween"] .diagnostic { background: radial-gradient(ellipse at top left, #a71626, #5b0d16); border-block: 1px solid #b82a37; }
html[data-theme="halloween"] .quiz { background: #17191d; border: 1px solid #ffffff25; border-radius: 5px; }
html[data-theme="halloween"] .progress { background: #383a40; }
html[data-theme="halloween"] .answer:hover { background: #292b30; border-color: #83858d; }
html[data-theme="halloween"] .answer:has(input:checked) { background: #4b1721; border-color: #f26370; }
html[data-theme="halloween"] .text-link { color: #f1f0ee; }
html[data-theme="halloween"] .studio-promo { background: linear-gradient(110deg, #25262b, #18191d); border-block: 1px solid #454047; }
html[data-theme="halloween"] .studio-sample { border-color: #757379; border-radius: 3px; }
html[data-theme="halloween"] .zone-card { background: #1b1d21; border-radius: 3px; }
html[data-theme="halloween"] footer { background: #090a0c; }
html[data-theme="halloween"] dialog { background: #1b1d21; color: #f1f0ee; }
html[data-theme="halloween"] .close { color: #f1f0ee; }
html[data-theme="halloween"] .skip { background: #1b1d21; color: #fff; }
.halloween-footer { margin-top: 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #aaaab3; font-size: 11px; }
.halloween-footer a { text-decoration: underline; text-underline-offset: 4px; }

/* The print engine retains its own colours and all original artwork. */
html[data-theme="halloween"] .editor-page { background: #16171b; }
html[data-theme="halloween"] .editor-controls { background: #191b1f; }
html[data-theme="halloween"] .editor-nav>span { color: #b4b6bc; }
html[data-theme="halloween"] .editor-preview { background-color: #24262c; background-image: radial-gradient(#ffffff1c .8px, transparent .8px); }
html[data-theme="halloween"] .preview-toolbar,
html[data-theme="halloween"] .preview-caption,
html[data-theme="halloween"] .preview-note { color: #bfc0ca; }
html[data-theme="halloween"] .editor-controls input:not([type=radio]),
html[data-theme="halloween"] .editor-controls select,
html[data-theme="halloween"] .editor-controls textarea { background-color: #24262c; color: #f1f0ee; border-color: #656772; }
html[data-theme="halloween"] .editor-controls label small { color: #b4b6bc; }
html[data-theme="halloween"] .finish-options>label { background: #24262c; border-color: #656772; }
html[data-theme="halloween"] .finish-options>label:has(:checked) { background: #451822; }
html[data-theme="halloween"] .secondary-actions button { color: #f1f0ee; }
html[data-theme="halloween"] .editor-footer { background: #111215; }
html[data-theme="halloween"] .editor-footer p { color: #b4b6bc; }
.halloween-workshop { padding: 18px; margin-top: 24px; border: 1px solid #74343f; background: linear-gradient(135deg, #451822, #28191e); border-radius: 3px; }
.halloween-workshop .eyebrow { color: #ff929d; margin-bottom: 10px; font-size: 9px; }
.halloween-workshop h2 { font-size: 24px; letter-spacing: -.6px; }
.halloween-workshop p:not(.eyebrow) { font-size: 12px; margin-top: 10px; color: #d2bdc3; }
.halloween-workshop a { display: inline-block; font-size: 12px; font-weight: 700; margin-top: 14px; text-decoration: underline; text-underline-offset: 4px; }

@media (max-width: 1050px) {
  .halloween-grid { gap: 45px; min-height: 690px; }
  .halloween-hero h1 { font-size: 65px; }
  .halloween-art { max-width: 355px; }
}
@media (max-width: 760px) {
  .halloween-grid { grid-template-columns: 1fr; gap: 46px; padding-top: 58px; padding-bottom: 40px; min-height: 0; }
  .halloween-hero h1 { font-size: clamp(50px, 10vw, 68px); }
  .halloween-copy { padding: 0; }
  .halloween-date { font-size: 9px; letter-spacing: 1.3px; margin-bottom: 24px; }
  .halloween-hero .halloween-lead { font-size: 16px; margin-top: 24px; }
  .halloween-hero .actions { align-items: flex-start; gap: 10px 24px; margin-top: 25px; }
  .halloween-hero .button { padding: 15px 18px; font-size: 13px; }
  .halloween-signature { font-size: 12px; }
  .halloween-stamp { margin-top: 23px; padding-top: 16px; }
  .halloween-art { width: calc(100% - 20px); max-width: 340px; }
  .halloween-art a { transform: rotate(1deg); }
  .halloween-art figcaption { font-size: 8px; }
  .halloween-footer { align-items: flex-start; flex-direction: column; gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .halloween-art a { transition: none; }
}
@media print {
  html[data-theme="halloween"] { color-scheme: light; }
  html[data-theme="halloween"] .halloween-only { display: none !important; }
}

.halloween-contest-link { margin-top: 24px; font-size: 13px; color: #f1c3c9; }
.halloween-contest-link a { text-decoration: underline; text-underline-offset: 5px; }
