:root{color-scheme:light;--paper:#fbf7ed;--ink:#19372e;--forest:#14392e;--mint:#dce9dc;--gold:#e4ba6d;--line:#ded8c9;--red:#8a342f;font:16px system-ui,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}[hidden]{display:none!important}.wrap{max-width:1160px;margin:auto;padding-inline:24px}.top{background:var(--forest);color:#fff9e9}.bar,.section-title,.toolbar,.actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.bar,.section-title{justify-content:space-between}.bar{min-height:70px}.brand{color:inherit;text-decoration:none;font:700 24px Georgia,serif}nav{display:flex;gap:4px;flex-wrap:wrap}nav button{background:transparent;color:inherit}nav button[aria-current]{background:#ffffff24}button,input,select{font:inherit}button{border:1px solid transparent;border-radius:8px;padding:9px 13px;background:var(--forest);color:white;font-weight:650;cursor:pointer}button:disabled{opacity:.48;cursor:default}button.secondary{background:transparent;color:var(--ink);border-color:var(--line)}button.danger{color:var(--red)}:focus-visible{outline:3px solid #a56120;outline-offset:3px}
.simulation{display:grid;grid-template-columns:1fr 1.1fr .55fr;gap:20px;align-items:center;margin:20px 0 26px;padding:14px 20px;background:#f0ebdd;border-radius:12px}.simulation small{display:block;margin-top:4px}.simulation output{margin-left:6px;color:var(--red)}label{display:block;font-weight:650}label small{font-weight:400}input,select{width:100%;margin-top:5px;padding:9px;border:1px solid #aaa998;border-radius:7px;background:white;color:var(--ink)}input[type=range]{display:block;padding:0;accent-color:var(--forest)}h2{font:500 36px Georgia,serif;margin:12px 0 18px}h3{margin:0 0 10px;font-size:1.13rem}p{line-height:1.5}.section-title span,small{color:#4c6056}.grid{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.panel{background:#fffdf7;border:1px solid var(--line);border-radius:12px;padding:17px;margin:12px 0}.panel label{margin-bottom:12px}.panel p{margin:6px 0 12px}.toolbar>div{flex:1;min-width:220px}.toolbar p{margin-bottom:0}.columns{display:grid;grid-template-columns:1fr 1fr;gap:14px}.columns .panel{min-width:0}.table-scroll{max-height:340px;overflow:auto}table{border-collapse:collapse;width:100%;text-align:left}th,td{padding:9px;border-bottom:1px solid var(--line);vertical-align:top}th{background:#f0ebdd;position:sticky;top:0}td code{font-size:.75rem}td button{font-size:.78rem;margin:0 4px 4px 0}.event{border-bottom:1px solid var(--line);padding:8px 0}.event summary{cursor:pointer}.event pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.78rem}#audit{max-height:300px;overflow:auto}#notice{background:var(--mint);border-radius:8px;padding:12px}#notice.error{background:#f4ded8;color:#752b24}dialog{width:min(660px,calc(100% - 28px));max-height:85vh;border:1px solid var(--line);border-radius:14px;background:#fffdf7;color:var(--ink);padding:20px}dialog::backdrop{background:#112e26aa}.dialog-close{text-align:right}.conflicts{max-height:240px;overflow:auto;background:#f5eddb;padding:10px 10px 10px 30px}a{color:var(--forest);text-underline-offset:3px}footer{padding-block:26px;color:#4c6056;font-size:.85rem}
@media(max-width:730px){.grid{grid-template-columns:repeat(4,1fr)}.columns{grid-template-columns:1fr;gap:0}.simulation{grid-template-columns:1fr 1fr;gap:10px}.simulation>div{grid-column:1/-1}}@media(max-width:430px){.wrap{padding-inline:13px}.bar{padding-block:8px}.grid{grid-template-columns:repeat(3,1fr);gap:7px}nav button{padding:7px}}

/* Décor de Noël */
:root {
  --forest: #123d32;
  --gold: #ebc783;
  --paper: #fcf7ec;
}
body {
  background: radial-gradient(ellipse at 50% 20%, #fffdf7, transparent 65%), var(--paper);
}
.top { border-bottom: 1px solid #d9b677; }
.brand { display: inline-flex; align-items: center; gap: 12px; }
.brand-logo {
  flex: none;
  box-sizing: content-box;
  padding: 3px 6px;
}
.brand-logo-crop {
  position: relative;
  display: block;
  width: 62px;
  height: 56px;
  overflow: hidden;
}
/* The original PNG has a large transparent margin around the logo. */
.brand-logo-crop img {
  position: absolute;
  top: -69.5px;
  left: -37px;
  width: 137px;
  height: auto;
  filter: brightness(0) invert(1);
}
.hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  align-items: center;
  min-height: 350px;
  margin-top: 24px;
  padding: 40px clamp(24px, 6vw, 70px);
  border: 1px solid #35594b;
  border-radius: 24px;
  background: linear-gradient(108deg, #112f28 12%, #184335 65%, #245344);
  color: #fff7e4;
  box-shadow: 0 8px 25px #123d321a;
}
.hero::after {
  position: absolute;
  inset: 8px;
  border: 1px solid #efcc8a45;
  border-radius: 17px;
  pointer-events: none;
  content: '';
}
.hero-copy { position: relative; z-index: 1; }
.hero h1 {
  margin: 14px 0 20px;
  font: 500 clamp(46px, 6.5vw, 80px)/.97 Georgia, serif;
  letter-spacing: -.035em;
}
.hero h1 em { color: #f4d391; font-weight: 400; }
.hero p { margin: 0; }
.hero-tagline { font: italic 500 clamp(14px, 1.65vw, 18px)/1.3 Georgia, serif; }
.eyebrow {
  color: #f2cd89;
  font-size: .75rem;
  font-weight: 750;
  letter-spacing: .16em;
}
.eyebrow span { margin-right: .35rem; }
.winter-ground {
  position: absolute;
  inset: auto 0 0;
  width: 100%;
  height: clamp(54px, 7.6vw, 84px);
  pointer-events: none;
}
.winter-scene {
  position: absolute;
  overflow: visible;
  right: -1px;
  bottom: -2px;
  width: min(59%, 620px);
  height: auto;
}
.simulation {
  border: 1px solid #e1d6bd;
  background: #f5efe1;
}
.opening-time {
  padding: 6px 12px;
  border: 1px solid #e1d6bd;
  border-radius: 20px;
  background: #fffbf0;
  font-size: .82rem;
}
.opening-time span { color: #895415; }
.door {
  --door-bg: #194739;
  --door-border: #285344;
  --door-ink: #fff4dc;
  --door-accent: #f3cf8c;
  --door-frame: #efcd874d;
  position: relative;
  min-height: 122px;
  overflow: hidden;
  padding: 0;
  perspective: 440px;
  border: 1px solid var(--door-border);
  border-radius: 13px;
  background: var(--door-bg);
  color: var(--door-ink);
  text-align: left;
  transition: transform 150ms ease, box-shadow 150ms ease;
}
.door-face {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
  padding: 14px 15px;
  background: linear-gradient(145deg, #ffffff10, transparent 65%), var(--door-bg);
  transform-origin: left center;
  backface-visibility: hidden;
}
.door-interior {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: radial-gradient(ellipse, #fce4a0, #ba833c 75%, #936024);
  color: #694410;
  font: 45px/1 Georgia, serif;
}
.door-face::before {
  position: absolute;
  inset: 5px;
  border: 1px solid var(--door-frame);
  border-radius: 9px;
  pointer-events: none;
  content: '';
}
.door.berry {
  --door-bg: #783d3c;
  --door-border: #6e3435;
}
.door.paper {
  --door-bg: #f5e8ca;
  --door-border: #e6d5b3;
  --door-ink: #264338;
  --door-accent: #835822;
  --door-frame: #b88e4955;
}
.door.available, .door.drawn {
  --door-bg: #f8e2af;
  --door-border: #ab762a;
  --door-ink: #43341f;
  --door-accent: #774c14;
  --door-frame: #aa762c73;
  box-shadow: inset 0 0 0 1px #fff4d6;
}
.door.drawn { --door-bg: #edcd8b; }
.door:hover { transform: translateY(-3px); box-shadow: 0 5px 12px #2639302b; }
.door strong { position: relative; font: 500 42px/1 Georgia, serif; }
.door-motif {
  position: absolute;
  top: 9px;
  right: 11px;
  color: var(--door-accent);
  font: 400 clamp(22px, 4vw, 43px)/1 Georgia, serif;
  opacity: .74;
}
.door-details { position: relative; display: grid; gap: 2px; margin-top: 4px; }
.door-time { font-size: .85rem; font-variant-numeric: tabular-nums; }
.door-status { font-size: .75rem; }
.reveal-card {
  padding: 5px 12px 18px;
  text-align: center;
}
.reveal-card h3 { font: 500 30px Georgia, serif; }
.reveal-emblem {
  display: inline-grid;
  place-items: center;
  width: 58px;
  height: 58px;
  margin-bottom: 12px;
  border: 1px solid #dabc83;
  border-radius: 50%;
  background: #f5e7c8;
  color: #815314;
  font: 32px Georgia, serif;
}
.festive-reveal .reveal-emblem { animation: reveal-star 650ms ease-out both; }
.festive-reveal > p:first-of-type {
  font: 500 28px Georgia, serif;
  animation: reveal-gift 700ms 260ms ease-out both;
}
.festive-reveal .reveal-result { animation: reveal-gift 500ms 640ms ease-out both; }
@keyframes reveal-gift {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
.reveal-result { font-weight: 650; }
@keyframes reveal-star {
  from { opacity: 0; transform: scale(.5) rotate(-35deg); }
  to { opacity: 1; transform: scale(1) rotate(0); }
}
.winner-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  padding: 0;
  list-style: none;
}
.winner-card {
  display: grid;
  gap: 6px;
  padding: 15px;
  border: 1px solid #e0d1b1;
  border-radius: 12px;
  background: #fffaf0;
}
.winner-date { color: #80571f; font-size: .83rem; font-weight: 750; }
@media (max-width: 730px) {
  .hero { min-height: 300px; }
  .winter-scene { width: 64%; right: -10%; opacity: .8; }
  .door { min-height: 103px; }
}
@media (max-width: 480px) {
  .hero { align-items: start; min-height: 390px; padding-top: 29px; }
  .hero h1 { font-size: clamp(36px, 10vw, 48px); }
  .winter-scene { width: 100%; right: -3%; opacity: 1; }
  .winter-santa { transform: translate(0, 200px); }
  .door { min-height: 94px; }
  .door-face { padding: 11px 10px; }
  .door strong { font-size: 34px; }
}
@media (prefers-reduced-motion: reduce) {
  .door { transition: none; }
  .door:hover { transform: none; }
  .festive-reveal .reveal-emblem,
  .festive-reveal > p:first-of-type,
  .festive-reveal .reveal-result { animation: none; }
}

[data-routine] .simulation > label { display: none; }
