:root{
  --wall:#1238d4;--wine:#0a1f8f;--ink:#08113d;--plaster:#fff1e8;--plaster2:#ffd9c7;
  --apricot:#ff9a73;--mint:#d6ddff;--muted:#c3cdfb;--hot:#ff5f3d;
  --serif:"Segoe UI Black","Avenir Next","Helvetica Neue",system-ui,-apple-system,Ubuntu,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Ubuntu,Cantarell,sans-serif;
  --ease:cubic-bezier(.2,.8,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--wall);color:var(--plaster);font:17px/1.65 var(--sans);min-height:100dvh;padding-bottom:110px;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
a{color:var(--apricot);text-underline-offset:3px}
a:hover{color:var(--mint)}
:focus-visible{outline:3px solid var(--mint);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:8px;background:var(--mint);color:var(--ink);padding:10px 14px;z-index:100}
.skip:focus{left:8px}
[hidden]{display:none!important}
h1,h2,h3{font-family:var(--serif);font-weight:900;line-height:.95;margin:0 0 .4em;letter-spacing:-.035em;overflow-wrap:break-word;hyphens:auto}
em,i{font-style:normal}
h1{font-size:clamp(2.4rem,7.4vw,6.4rem)}
h2{text-transform:uppercase}
h2{font-size:clamp(1.9rem,4.4vw,3.6rem)}
h3{font-size:1.6rem}
p{max-width:64ch}
.label{font:600 .74rem/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--apricot)}
.wrap{width:min(1240px,92vw);margin:0 auto}
/* top strip */
.topstrip{display:flex;justify-content:space-between;align-items:center;padding:18px 4vw;font:.75rem var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border-bottom:1px dashed rgba(244,231,211,.2)}
.topstrip a{color:var(--plaster);text-decoration:none}
/* wordmark */
.mark{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--plaster)}
.stamp{width:44px;height:44px;border-radius:12px;background:var(--ink);color:var(--apricot);display:grid;place-items:center;position:relative;flex:none}
.stamp b{font:900 1rem var(--serif)}
.stamp svg{position:absolute;inset:0;animation:spin 18s linear infinite}
.mark span{font:900 1.2rem var(--serif);letter-spacing:-.03em}
.mark span i{color:var(--apricot);font-style:normal}
@keyframes spin{to{transform:rotate(360deg)}}
/* guide pill */
.guide{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:40;display:flex;align-items:center;gap:14px;background:var(--apricot);color:var(--ink);padding:8px 8px 8px 10px;border-radius:18px;border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);max-width:94vw}
.guide .mark{color:var(--ink)}
.guide .mark span{display:none}
.room{font:.72rem var(--mono);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.guide button,.btn{font:600 .85rem var(--mono);letter-spacing:.06em;text-transform:uppercase;border:0;border-radius:999px;padding:12px 18px;cursor:pointer;background:var(--ink);color:var(--plaster);text-decoration:none;display:inline-flex;align-items:center;gap:8px;transition:transform .3s var(--ease),background .2s}
.btn:hover{transform:translateY(-2px);color:var(--ink);background:var(--mint)}
.btn.alt{background:var(--apricot);color:var(--ink)}
.btn.ghost{background:transparent;color:var(--plaster);box-shadow:inset 0 0 0 1.5px var(--plaster)}
.btn.ghost:hover{color:var(--ink)}
/* floor plan */
.plan{position:fixed;inset:0;z-index:60;background:var(--ink);color:var(--plaster);padding:6vh 5vw 130px;overflow:auto;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.plan.open{opacity:1;visibility:visible}
.plan-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1.5px solid rgba(244,231,211,.35);margin-top:24px}
.plan-grid a{display:block;padding:22px;min-height:140px;border:1px solid rgba(244,231,211,.18);text-decoration:none;color:var(--plaster);transition:background .25s}
.plan-grid a:nth-child(1){grid-column:span 2;grid-row:span 2}
.plan-grid a:nth-child(6){grid-column:span 2}
.plan-grid a:hover,.plan-grid a[aria-current]{background:var(--wall)}
.plan-grid a[aria-current] .label::after{content:"  · you are here";color:var(--mint)}
.plan-grid strong{display:block;font:900 1.8rem/1 var(--serif);letter-spacing:-.03em;margin-top:8px}
.plan-grid a:nth-child(1) strong{font-size:3.4rem}
.plan-grid small{color:var(--muted)}
.plan{background:var(--wall)}
.plan-grid a:hover,.plan-grid a[aria-current]{background:var(--hot)!important}
.plan .close{position:absolute;top:20px;right:5vw}
/* hero */
.hero{position:relative;padding:9vh 0 10vh;overflow:hidden}
.hero .spot{position:absolute;width:640px;height:640px;border-radius:50%;background:radial-gradient(circle,rgba(255,173,122,.28),transparent 65%);left:var(--x,60%);top:var(--y,30%);transform:translate(-50%,-50%);pointer-events:none;transition:left .4s var(--ease),top .4s var(--ease)}
.hero h1 em{color:var(--apricot)}
.hero .lede{font-size:1.25rem;max-width:46ch}
.hero-row{display:grid;grid-template-columns:1.4fr 1fr;gap:5vw;align-items:end;position:relative}
.ticket{background:var(--plaster);color:var(--ink);padding:24px;border-radius:20px;border:3px solid var(--ink);position:relative;transform:rotate(-3deg);box-shadow:8px 8px 0 var(--hot)}
.ticket::before,.ticket::after{display:none;content:"";position:absolute;top:50%;width:22px;height:22px;border-radius:50%;background:var(--wall);transform:translateY(-50%)}
.ticket::before{left:-11px}.ticket::after{right:-11px}
.ticket .label{color:var(--wall)}
.ticket dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font:.85rem var(--mono);margin:12px 0 0}
.ticket dt{opacity:.6}
/* exhibits */
.exhibit{padding:12vh 0;position:relative;isolation:isolate}
.exhibit:nth-of-type(even){background:var(--apricot);color:var(--ink)}
.exhibit:nth-of-type(even) .label,.exhibit:nth-of-type(even) a{color:var(--ink)}
.exhibit:nth-of-type(even) .roomno{color:var(--plaster2)}
.exhibit:nth-of-type(even) .walllabel{color:var(--ink)}
.exhibit+.exhibit{border-top:1px dashed rgba(244,231,211,.18)}
.roomno{font:900 clamp(5rem,16vw,13rem)/0.8 var(--serif);color:var(--wine);position:absolute;left:-1vw;top:3vh;z-index:-1;letter-spacing:-.06em;pointer-events:none;user-select:none}
.salon{display:grid;grid-template-columns:repeat(12,1fr);gap:28px;margin-top:40px}
.frame{background:var(--plaster);color:var(--ink);padding:28px;border:3px solid var(--ink);border-radius:22px 22px 22px 4px;box-shadow:10px 10px 0 var(--ink);transition:transform .5s var(--ease)}
.frame:hover{transform:translate(-4px,-4px)}
.frame h3{color:var(--wall)}
.frame .label{color:var(--wall)}
.frame a{color:var(--wall);font-weight:600}
.frame.mint{background:var(--mint)}
.frame.apricot{background:var(--apricot)}
.frame.dark{background:var(--ink);color:var(--plaster)}
.frame.dark h3,.frame.dark .label,.frame.dark a{color:var(--apricot)}
.c3{grid-column:span 3}.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}.c12{grid-column:span 12}
.drop{margin-top:60px}.drop2{margin-top:120px}
.walllabel{font:.8rem/1.5 var(--mono);color:var(--muted);border-left:2px solid var(--apricot);padding-left:12px;margin-top:14px;max-width:44ch}
figure{margin:0}
figure img{width:100%;height:auto;display:block;border-radius:24px;border:3px solid var(--ink);box-shadow:-10px 10px 0 var(--hot)}
figcaption{font:.78rem/1.5 var(--mono);color:var(--muted);margin-top:10px}
ul.tick{list-style:none;padding:0}
ul.tick li{padding:8px 0 8px 28px;position:relative;border-bottom:1px dashed currentColor}
ul.tick li::before{content:"";position:absolute;left:0;top:16px;width:12px;height:12px;border-radius:50%;background:var(--apricot);box-shadow:inset 0 0 0 3px var(--wall)}
/* marquee */
.marquee{overflow:hidden;padding:14px 0;background:var(--hot);color:var(--plaster);margin:0;max-width:100%}
.marquee div{display:flex;gap:48px;width:max-content;animation:mq 40s linear infinite;font:900 1.8rem var(--serif);text-transform:uppercase;letter-spacing:-.02em}
@keyframes mq{to{transform:translateX(-50%)}}
/* timeline */
.route{counter-reset:s;list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:2px solid var(--apricot);margin-top:40px}
.route li{counter-increment:s;padding:26px 18px 0 0;position:relative}
.route li::before{content:"0" counter(s);position:absolute;top:-22px;left:0;background:var(--apricot);color:var(--ink);border-radius:999px;padding:2px 12px;font:900 1.4rem var(--serif);color:var(--apricot)}
.route b{display:block;font:900 1.3rem var(--serif);margin-bottom:6px}
/* faq */
details{border-bottom:1px dashed rgba(244,231,211,.3);padding:18px 0}
summary{cursor:pointer;font:800 1.3rem/1.2 var(--serif);letter-spacing:-.02em;list-style:none;display:flex;justify-content:space-between;gap:20px}
summary::after{content:"+";font-family:var(--mono);color:var(--apricot)}
details[open] summary::after{content:"–"}
summary::-webkit-details-marker{display:none}
/* forms */
form .field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}
label{font:600 .76rem var(--mono);letter-spacing:.08em;text-transform:uppercase}
input,select,textarea{font:1rem var(--sans);padding:12px 14px;border-radius:4px;border:1.5px solid var(--wall);background:#fffaf2;color:var(--ink)}
textarea{min-height:150px;resize:vertical}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.check{display:flex;gap:10px;align-items:flex-start;font:.95rem var(--sans);text-transform:none;letter-spacing:0;font-weight:400}
.check input{margin-top:4px;width:18px;height:18px}
.status{margin-top:16px;padding:16px;border-radius:4px;font-size:.95rem}
.status.ok{background:var(--mint);color:var(--ink)}
.status.err{background:#ffd9cc;color:#5a0d16;border:2px solid #b3261e}
.seg{display:flex;gap:0;border:1.5px solid var(--wall);border-radius:999px;overflow:hidden;width:max-content;margin-bottom:18px}
.seg label{padding:10px 18px;cursor:pointer}
.seg input{position:absolute;opacity:0}
.seg label:has(input:checked){background:var(--wall);color:var(--plaster)}
.seg label:has(input:focus-visible){outline:3px solid var(--apricot)}
/* map */
.mapph{aspect-ratio:4/3;border:2px dashed var(--apricot);display:grid;place-items:center;text-align:center;padding:24px;background:repeating-linear-gradient(45deg,transparent 0 14px,rgba(255,173,122,.06) 14px 28px)}
/* tool */
.tool{display:grid;grid-template-columns:1.2fr 1fr;gap:28px}
.tool fieldset{border:0;padding:0;margin:0 0 22px}
.tool legend{font:900 1.4rem var(--serif);margin-bottom:10px;color:var(--wall)}
.meter{height:18px;background:var(--plaster2);border-radius:999px;overflow:hidden;border:1.5px solid var(--wall)}
.meter i{display:block;height:100%;background:var(--wall);width:0;transition:width .6s var(--ease)}
.score{font:900 6rem/1 var(--serif);color:var(--apricot);letter-spacing:-.05em}
pre.out{white-space:pre-wrap;font:.82rem/1.5 var(--mono);background:var(--ink);color:var(--mint);padding:16px;border-radius:4px;max-height:340px;overflow:auto}
/* footer */
footer.exit{margin-top:8vh;padding:8vh 0 4vh;background:var(--ink)}
.stub{display:grid;grid-template-columns:2fr 1fr 1fr;background:var(--plaster);color:var(--ink);border-radius:8px;overflow:hidden}
.stub>div{padding:28px;border-right:2px dashed var(--wall)}
.stub>div:last-child{border-right:0;background:var(--apricot)}
.stub a{color:var(--wall)}
.stub ul{list-style:none;padding:0;margin:0;line-height:2}
.stub h2{font-size:2.4rem;color:var(--wall)}
.fine{font:.75rem var(--mono);color:var(--muted);margin-top:22px;display:flex;flex-wrap:wrap;gap:18px;justify-content:space-between}
.linkbtn{background:none;border:0;color:var(--apricot);font:inherit;text-decoration:underline;cursor:pointer;padding:0}
/* cookie */
.cookie{position:fixed;left:16px;right:16px;bottom:90px;margin:auto;max-width:560px;z-index:70;background:var(--mint);color:var(--ink);padding:20px;border-radius:8px;border:2px solid var(--ink);box-shadow:0 20px 40px -10px rgba(0,0,0,.6)}
.cookie[hidden]{display:none}
.cookie .acts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.cookie .btn{justify-content:center}
.cookie a{color:var(--wall)}
/* reveal */
.reveal{opacity:0;transform:translateY(-24px) rotate(-1deg);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.prose h2{margin-top:1.6em;font-size:2rem}
.prose{max-width:760px}
/* home collage */
.hero{padding:6vh 0 10vh}
.hero.home{padding-top:2vh}
.giantmark{font:900 clamp(5rem,23vw,22rem)/1 var(--serif);letter-spacing:-.07em;margin:0 0 .08em -.04em;color:var(--apricot);white-space:nowrap;position:relative;z-index:1;pointer-events:none}
.giantmark span{color:var(--plaster);-webkit-text-stroke:0}
.collage{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:minmax(60px,auto);gap:20px;position:relative}
.collage .ph img{height:100%;object-fit:cover}
.collage .ph.a{grid-column:6/13;grid-row:1/4;transform:rotate(2deg)}
.collage .ph.b{grid-column:1/6;grid-row:3/6;transform:rotate(-3deg);z-index:2}
.collage .intro{grid-column:1/6;grid-row:1/3;align-self:start}
.collage .intro h1{font-size:clamp(1.9rem,3.6vw,3rem);text-transform:uppercase}
.collage .intro h1 em{background:var(--hot);color:var(--plaster);padding:0 .15em;border-radius:8px}
.collage .ticket{grid-column:7/12;grid-row:4/6;align-self:center;z-index:3}
.collage-cap{grid-column:1/13;font:.75rem/1.5 var(--mono);color:var(--muted)}
.collage-cap a{color:var(--plaster)}
/* inner hero */
.inner-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:2vw 5vw;align-items:end;position:relative}
.inner-grid .tag{grid-column:1/3;background:var(--ink);color:var(--apricot);width:max-content;max-width:100%;padding:8px 14px;border-radius:999px}
.inner-grid h1{grid-column:1/2;text-transform:uppercase;margin:0}
.inner-grid h1 em{color:var(--apricot)}
.ledebox{grid-column:2/3;background:var(--plaster);color:var(--ink);padding:26px;border:3px solid var(--ink);border-radius:4px 28px 28px 28px;box-shadow:10px 10px 0 var(--hot)}
.ledebox .lede{margin:0 0 .6em}
.ledebox .btn.ghost{color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
.stripe{grid-column:1/3;height:14px;border-radius:999px;background:repeating-linear-gradient(90deg,var(--apricot) 0 40px,var(--hot) 40px 80px,var(--plaster) 80px 120px)}
.hero .spot{background:radial-gradient(circle,rgba(255,154,115,.35),transparent 65%)}
@media (max-width:900px){
  .collage{grid-template-columns:1fr 1fr}
  .collage>*{grid-column:auto!important;grid-row:auto!important}
  .collage .intro,.collage .ticket,.collage-cap{grid-column:1/3!important}
  .inner-grid{grid-template-columns:1fr}.inner-grid>*{grid-column:1/-1!important}
  .hero-row,.tool{grid-template-columns:1fr}
  .salon{grid-template-columns:1fr}
  .salon>*{grid-column:auto!important;margin-top:0!important}
  .route{grid-template-columns:1fr;border-top:0;border-left:2px solid var(--apricot)}
  .route li{padding:10px 0 26px 50px}.route li::before{left:-14px;top:6px}
  .plan-grid{grid-template-columns:1fr 1fr}
  .plan-grid a:nth-child(n){grid-column:auto;grid-row:auto}
  .plan-grid a:nth-child(1){grid-column:span 2}
  .stub{grid-template-columns:1fr}.stub>div{border-right:0;border-bottom:2px dashed var(--wall)}
}
@media (max-width:560px){.row2{grid-template-columns:1fr}.room{max-width:110px}.plan-grid{grid-template-columns:1fr}.plan-grid a:nth-child(1){grid-column:auto}.ticket{transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal{opacity:1;transform:none}
}
