/* Latlight Christmas calendar (holidays/christmas.html). Loaded after holidays.css; same layout,
   warm navy-and-gold palette, snow, fairy lights, a lit town and Advent doors that look like presents. */
.xm-page{--hd-bg:#121a2b;--hd-surface:#262a44;--hd-line:rgba(255,226,180,.14);--hd-text:#fbf6ee;--hd-muted:#cbc3b8;--hd-accent:#f0b85a;--hd-gold:#f6d27a;
  --xm-cran:#c7392f;--xm-pine:#2f6b52;--xm-card:#323a5e;--xm-frost:#e6f1ff;
  --tl-bg:#121a2b;--tl-bg2:#182038;--tl-surface:#262a44;--tl-accent:#f0b85a;
  background:radial-gradient(1200px 600px at 75% 0%,rgba(255,160,70,.12),transparent 60%),linear-gradient(180deg,#141b2e,#121a2b 40%,#16142a) fixed}
.xm-page #wrapper,.xm-page #main{background:transparent}
html,body.xm-page{overflow-x:clip}
.xm-snow{position:fixed;inset:0;width:100%;height:100%;z-index:9;pointer-events:none}

/* Hero: lit town, fairy lights, snow drift */
.xm-hero#banner.hd-hero{background:radial-gradient(520px 320px at 78% 62%,rgba(255,170,80,.28),transparent 70%),linear-gradient(180deg,#0f1630 0%,#1a1d3a 55%,#2a1f2c 100%)!important}
.xm-lights{position:absolute;left:0;right:0;top:3.25rem;height:34px;z-index:3;pointer-events:none;overflow:hidden}
.xm-lights svg{width:100%;height:34px;display:block}
.xm-page .bulb{animation:xm-twinkle 2.4s ease-in-out infinite}
.xm-page .bulb:nth-of-type(3n){animation-delay:.8s}.xm-page .bulb:nth-of-type(3n+1){animation-delay:1.6s}
@keyframes xm-twinkle{0%,100%{opacity:1}50%{opacity:.35}}
.xm-scene{position:absolute;inset:0;pointer-events:none;z-index:1}
.xm-scene svg{position:absolute;right:0;bottom:0;width:min(820px,52%);height:auto}
.xm-page .win{animation:xm-flick 5s ease-in-out infinite}.xm-page .win:nth-of-type(2n){animation-delay:2s}
@keyframes xm-flick{0%,100%{opacity:1}48%{opacity:.85}50%{opacity:.6}52%{opacity:.9}}
.xm-drift{position:absolute;left:0;right:0;bottom:-1px;height:46px;pointer-events:none;z-index:2}
.xm-drift svg{width:100%;height:100%;display:block}
.xm-hero .hd-hero-inner{grid-template-columns:minmax(0,1fr);max-width:76rem;padding-bottom:6rem}
.xm-hero .hd-hero-inner>div{max-width:38rem}
.xm-page .hd-hero h1{font-size:3.4rem;color:#fff7e8;text-shadow:0 0 30px rgba(255,180,90,.35)}
.xm-page .hd-eyebrow:before{content:"\2744";margin-right:.5rem;color:var(--xm-frost)}
.xm-fact{margin:-.4rem 0 1.6rem;max-width:34rem;font-size:.98rem;line-height:1.55;color:var(--xm-frost);border-left:2px solid var(--hd-accent);padding:0 0 0 .9rem}
.xm-page .hd-count li{background:rgba(38,42,68,.85);border-color:rgba(240,184,90,.3)}
.xm-page .hd-count b{color:#ffe2b0}
.xm-page .hd-btn-primary{color:#1b2036!important}
.xm-page .hd-section h2:after{content:"";display:block;width:4.5rem;height:10px;margin-top:.5rem;background:radial-gradient(circle at 5px 5px,var(--xm-cran) 4px,transparent 4.5px) 0 0/22px 10px repeat-x,linear-gradient(var(--xm-pine),var(--xm-pine)) 0 4px/100% 2px no-repeat}
.xm-page .hd-section-head{align-items:flex-start}

/* Waiting note before 1 December */
.xm-wait{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;margin:0 0 1.6rem;padding:1.1rem 1.4rem;border-radius:18px;background:rgba(38,42,68,.86);border:1px solid rgba(240,184,90,.35);color:var(--hd-text);box-shadow:0 0 40px -10px rgba(255,170,80,.22)}
.xm-wait[hidden]{display:none}
.xm-wait b{color:#ffe2b0}

/* Advent doors */
.xm-doors{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem}
.xm-door{position:relative;aspect-ratio:1/1.12;border-radius:12px;border:1px solid rgba(240,184,90,.45)!important;padding:.7rem;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;text-decoration:none;color:var(--hd-text)!important;
  background:linear-gradient(180deg,rgba(20,26,45,.1),rgba(20,26,45,.92) 72%),var(--pic) center/cover,#262a44;box-shadow:0 10px 24px rgba(0,0,0,.35);transition:transform .2s,border-color .2s}
.xm-door:hover,.xm-door:focus-visible{transform:translateY(-3px);border-color:var(--hd-accent)!important;outline:none}
.xm-door:before{content:"";position:absolute;top:-6px;right:12px;width:26px;height:16px;z-index:3;background:radial-gradient(circle at 30% 60%,var(--xm-cran) 5px,transparent 5.5px),radial-gradient(circle at 70% 60%,var(--xm-cran) 5px,transparent 5.5px),radial-gradient(ellipse at 50% 100%,#2f6b52 60%,transparent 62%)}
.xm-d{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:#fff}
.xm-n{font-size:2.1rem;line-height:1;font-weight:700;font-family:Georgia,serif;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.xm-t{font-size:.76rem;line-height:1.25;color:#e8e3f0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.xm-bow{display:none}
.xm-door.hd-today{box-shadow:0 0 0 4px rgba(240,184,90,.25),0 0 40px rgba(255,160,70,.45);border-color:var(--hd-accent)!important}
/* locked door = wrapped present */
.xm-door.hd-locked{background:repeating-linear-gradient(45deg,#8e2a22 0 12px,#9d3229 12px 24px);border-color:rgba(255,220,160,.25)!important;cursor:default}
.xm-door.hd-locked:nth-child(3n+2){background:repeating-linear-gradient(45deg,#1f5640 0 12px,#246349 12px 24px)}
.xm-door.hd-locked:nth-child(3n){background:repeating-linear-gradient(45deg,#2a3a6e 0 12px,#30437c 12px 24px)}
.xm-door.hd-locked:hover{transform:none}
.xm-door.hd-locked:before{left:0;right:0;top:24%;width:auto;height:10%;background:linear-gradient(90deg,#c9902c,#f6d27a,#c9902c);z-index:0}
.xm-door.hd-locked:after{content:"";position:absolute;top:0;bottom:0;right:20%;width:10%;background:linear-gradient(180deg,#c9902c,#f6d27a,#c9902c);z-index:0}
.xm-door.hd-locked .xm-bow{display:block;position:absolute;top:calc(29% - 14px);right:calc(25% - 18px);width:36px;height:28px;z-index:2;background:radial-gradient(ellipse 9px 7px at 9px 14px,#f6d27a 98%,transparent),radial-gradient(ellipse 9px 7px at 27px 14px,#f6d27a 98%,transparent),radial-gradient(circle 5px at 18px 14px,#c9902c 98%,transparent)}
.xm-door.hd-locked .xm-d,.xm-door.hd-locked .xm-t{visibility:hidden}
.xm-door.hd-locked .xm-n{visibility:visible;position:relative;z-index:1;margin-top:auto;color:#fff6e4;font-size:2.4rem}
.xm-door.hd-locked .hd-lock{position:absolute;inset:auto .45rem .45rem auto;width:auto;height:auto;padding:.2rem .5rem;border-radius:8px;background:rgba(0,0,0,.4);flex-direction:row;gap:.3rem;z-index:3}
.xm-door.hd-locked .hd-lock svg{width:.9rem;height:.9rem;margin:0;color:#fff6e4;filter:none}
.xm-door.hd-locked .hd-lock b{font-size:.6rem;letter-spacing:.06em;font-weight:600;color:#fff6e4}
.xm-door.hd-locked .hd-lock span{display:none}

/* Behind the doors: film + dish */
.xm-days{display:flex;flex-direction:column;gap:2.4rem}
.xm-day{scroll-margin-top:5rem}
.xm-day.hd-locked{display:none}
.xm-day.hd-today .xm-day-n{background:var(--hd-accent);color:#1b2036}
.xm-day-head{display:flex;align-items:center;gap:1rem;margin:0 0 1rem}
.xm-day-n{display:grid;place-items:center;width:3.2rem;height:3.2rem;border-radius:50%;border:2px solid var(--hd-accent);font-family:Georgia,serif;font-size:1.5rem;font-weight:700;color:#ffe2b0;flex:none}
.xm-day-head div span{display:block;font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--hd-muted)}
.xm-day-head div b{display:block;font-size:1.2rem;color:var(--hd-text)}
.xm-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;align-items:stretch}
.xm-card{display:flex;flex-direction:column;border-radius:18px;overflow:hidden;background:var(--xm-card);box-shadow:0 10px 28px rgba(0,0,0,.3);text-decoration:none;color:var(--hd-text)!important}
.xm-film{border:2px solid #3fb27f}
.xm-dish{border:1px solid rgba(255,255,255,.12)!important;transition:transform .2s,border-color .2s}
.xm-dish:hover{transform:translateY(-3px);border-color:var(--hd-accent)!important}
.xm-card img{width:100%;aspect-ratio:1.45;height:auto;object-fit:cover;display:block;background:#1b2036}
.xm-film img{object-position:center 40%}
.xm-card-body{padding:1rem 1.15rem 1.15rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.xm-kind{font-size:.62rem;letter-spacing:.2em;font-weight:700;text-transform:uppercase;color:#8ee9a8}
.xm-dish .xm-kind{color:#f2c17a}
.xm-page .xm-card h3{margin:0;padding:0;font-size:1.15rem;line-height:1.3;letter-spacing:0;text-transform:none;color:#fff}
.xm-card h3 small{font-size:.85rem;color:var(--hd-muted);font-weight:400}
.xm-meta{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--hd-muted)}
.xm-page .xm-card p{margin:0;padding:0;font-size:.93rem;line-height:1.55;color:#d7daea;flex:1}
.xm-link{align-self:flex-start;margin-top:.3rem;font-size:.68rem;letter-spacing:.16em;font-weight:700;text-transform:uppercase;color:var(--hd-accent)!important;text-decoration:none}
.xm-page .hd-warn{vertical-align:2px}

/* Full recipes: the step list is created by taste-lab-pro.js; give the cards this page's colours */
.xm-page .recipe-section{background:var(--xm-card)}
.xm-page .hd-meta{margin:.2rem 0 1rem}
.xm-page .hd-meta li{background:rgba(0,0,0,.18)}
.xm-page #footer{background:#0f1526}
.xm-page .hd-next div{border-color:rgba(240,184,90,.3)}

@media (max-width:1100px){.xm-doors{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:860px){
  .xm-scene svg{width:120%;right:-10%;opacity:.4}
  .xm-pair{grid-template-columns:1fr}
  .xm-page .hd-hero h1{font-size:2.5rem}
}
@media (max-width:520px){.xm-doors{grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem}.xm-n{font-size:1.7rem}.xm-t{font-size:.66rem}}
@media (prefers-reduced-motion:reduce){.xm-page .bulb,.xm-page .win{animation:none}.xm-door,.xm-dish{transition:none}.xm-door:hover,.xm-dish:hover{transform:none}}
@media print{.xm-snow,.xm-lights,.xm-scene,.xm-drift,#doors,#days{display:none!important}}