.ad-app { max-width: 960px; margin-inline: auto; }
.ad-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ad-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin-block: 1rem; }
.ad-editor-doors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-block: 1rem; }
.ad-editor-doors fieldset { min-width: 0; border: 1px solid var(--border); border-radius: 12px; padding: 1rem; }
.ad-editor-doors legend { padding-inline: .4rem; font-weight: 700; }
.ad-editor-doors textarea { resize: vertical; }
.ad-app input, .ad-app select, .ad-app textarea { width: 100%; min-width: 0; box-sizing: border-box; }
.ad-app textarea, .ad-app p, .ad-app h2, .ad-app h3 { overflow-wrap: anywhere; }
.ad-view { --ad-bg: #f8efe5; --ad-door: #8c2235; --ad-ink: #fff; --ad-heading: #552333; background: var(--ad-bg); color: var(--ad-heading); padding: 1.25rem; border-radius: 16px; }
.ad-view[data-ad-theme="night"] { --ad-bg: #172443; --ad-door: #304b72; --ad-heading: #f4f7ff; }
.ad-view[data-ad-theme="pastel"] { --ad-bg: #f8eaf2; --ad-door: #ded4f1; --ad-ink: #38254e; --ad-heading: #38254e; }
.ad-view[data-ad-theme="kids"] { --ad-bg: #fff2c7; --ad-door: #177c71; --ad-heading: #21443c; }
.ad-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .7rem; }
.ad-door { min-height: 76px; border: 2px solid transparent; border-radius: 12px; background: var(--ad-door); color: var(--ad-ink); font: inherit; font-size: 1.3rem; font-weight: 700; cursor: pointer; }
.ad-door::before { content: "🎄"; display: block; font-size: 1rem; }
[data-ad-theme="night"] .ad-door::before { content: "🌙"; }
[data-ad-theme="pastel"] .ad-door::before { content: "✨"; }
[data-ad-theme="kids"] .ad-door::before { content: "⛄"; }
.ad-door:hover { border-color: currentColor; }
.ad-door:focus-visible { outline: 3px solid var(--ad-heading); outline-offset: 3px; }
.ad-opened { border-color: currentColor; animation: ad-open .35s ease-out; }
@keyframes ad-open { from { transform: perspective(400px) rotateY(-25deg); } to { transform: perspective(400px) rotateY(0); } }
.ad-detail { padding: 1rem; margin-top: 1rem; border: 1px solid currentColor; border-radius: 12px; }
.ad-detail p { white-space: pre-wrap; }
.ad-detail a { display: inline-block; color: inherit; font-weight: 700; padding: .6rem 1rem; border: 1px solid currentColor; border-radius: 8px; }
.ad-print { display: none; }
[data-theme="dark"] .ad-view { --ad-bg: #32252b; --ad-door: #95334a; --ad-heading: #fff0e5; }
[data-theme="dark"] .ad-view[data-ad-theme="night"] { --ad-bg: #111b32; --ad-door: #304b72; --ad-heading: #f4f7ff; }
[data-theme="dark"] .ad-view[data-ad-theme="pastel"] { --ad-bg: #30283b; --ad-door: #ded4f1; --ad-heading: #f6eaff; }
[data-theme="dark"] .ad-view[data-ad-theme="kids"] { --ad-bg: #1d342f; --ad-door: #186e65; --ad-heading: #fff2c7; }
@media (max-width: 600px) {
  .ad-form, .ad-editor-doors { grid-template-columns: minmax(0, 1fr); }
  .ad-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
  .ad-view { padding: .75rem; }
  .ad-door { min-height: 68px; }
}
@media (prefers-reduced-motion: reduce) { .ad-opened { animation: none; } }
@page advent { size: auto; margin: 15mm; }
@media print {
  body:has(.ad-app) { background: white; color: black; }
  body:has(.ad-app) > :not(main), body:has(.ad-app) .tool-head, body:has(.ad-app) .back-link,
  body:has(.ad-app) .tool-guide, body:has(.ad-app) [data-ad-slot], .ad-app > :not(.ad-print) { display: none !important; }
  .ad-app { border: 0; padding: 0; box-shadow: none; max-width: none; }
  .ad-print { display: block; page: advent; color: black; }
  .ad-print section { break-inside: avoid; border-bottom: 1px solid #777; }
  .ad-print p { white-space: pre-wrap; }
}

/* The script fills the ideas hint and the door editors on load; reserve their space so nothing below jumps (CLS). */
#ad-ideas-note { min-height: 1.5em; }
#ad-doors:empty { min-height: 100vh; }