/* 4th Dimension Disorder — shared styles for every room */
:root{
  --char:#171717; --char-2:#222120; --cream:#F2E6CD; --cream-2:#E8D9BA; --paper:#fbf4e4;
  --rust:#B95332; --rust-dk:#9A4227; --teal:#397C79; --teal-dk:#2c6361; --mustard:#D69A35;
  --ink:#1d1b18; --muted:#5d554a;
  --display:"Rubik Dirt", "Impact", sans-serif;
  --cond:"Barlow Condensed", "Arial Narrow", sans-serif;
  --body:"Barlow", system-ui, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--cream);color:var(--ink);font:400 17px/1.55 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--mustard);outline-offset:3px}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
@media (min-width:720px){.wrap{padding:0 24px}}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--mustard);color:var(--char);padding:8px 12px;z-index:20}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hidden{display:none!important}

/* grain texture on dark areas */
.grain{position:relative;isolation:isolate}
.grain::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;opacity:.18;
  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 type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .95 0 0 0 0 .85 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- header and room menu ---------- */
header.top{background:var(--char);color:var(--cream);position:sticky;top:0;z-index:10;border-bottom:3px solid var(--rust)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:58px}
.brand{display:flex;align-items:center;text-decoration:none;flex:0 0 auto}
.brand img{height:40px;width:auto}
@media (max-width:420px){.brand img{height:30px}}
nav.rooms ul{list-style:none;margin:0;padding:0;display:flex;gap:4px}
nav.rooms a{display:flex;flex-direction:column;align-items:center;text-decoration:none;padding:6px 10px;border-radius:4px;border-bottom:3px solid transparent;line-height:1}
nav.rooms a b{font:400 19px/1 var(--display);letter-spacing:.3px;white-space:nowrap}
nav.rooms a small{font:600 12px/1 var(--cond);letter-spacing:1.6px;text-transform:uppercase;color:#bfb196;margin-top:4px}
nav.rooms a:hover{background:#2a2826}
nav.rooms a[aria-current="page"]{border-bottom-color:var(--mustard)}
/* phones: the rooms sit in a scrollable strip under the logo, always visible */
@media (max-width:900px){
  .top .wrap{flex-direction:column;align-items:stretch;gap:0;padding:0}
  .brand{padding:8px 16px 4px}
  nav.rooms{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;border-top:1px solid #333}
  nav.rooms::-webkit-scrollbar{display:none}
  nav.rooms ul{gap:0;padding:0 8px;width:max-content}
  nav.rooms a{padding:7px 10px 6px}
  nav.rooms a b{font-size:16px}
  nav.rooms a small{font-size:10.5px;margin-top:3px}
  body.lobby nav.rooms{display:none}
  body.lobby .brand{padding:8px 16px 8px}
}

/* ---------- buttons ---------- */
.btn{display:inline-block;background:var(--rust);color:#fff6e6;text-decoration:none;font:700 19px/1 var(--cond);letter-spacing:.6px;padding:14px 22px;border-radius:4px;border:0;cursor:pointer}
.btn:hover{background:var(--rust-dk)}
.btn.teal{background:var(--teal)}.btn.teal:hover{background:var(--teal-dk)}
.btn.ghost{background:transparent;border:2px solid currentColor;color:inherit}
.ext::after{content:" \2197";font-size:.85em}

/* ---------- lobby (homepage) ---------- */
.welcome{background:var(--char);color:var(--cream);position:relative;overflow:hidden}
.welcome .bg{position:absolute;inset:0;background:url(/images/hero.jpg) center 34%/cover no-repeat;opacity:.55}
.welcome .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,23,.15) 0%,rgba(23,23,23,.35) 45%,rgba(23,23,23,.92) 100%)}
.welcome .wrap{position:relative;padding-top:92px;padding-bottom:18px}
.welcome h1{font:400 clamp(31px,8.4vw,64px)/1 var(--display);margin:0 0 10px;max-width:13em;text-wrap:balance;text-shadow:0 2px 0 rgba(0,0,0,.4)}
.welcome p{margin:0;font-size:16.5px;line-height:1.4;color:#efe2c6;max-width:34em}
@media (min-width:900px){
  .welcome .bg{left:auto;width:58%;opacity:.9;background-position:center 40%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 35%);mask-image:linear-gradient(90deg,transparent,#000 35%)}
  .welcome .bg::after{background:linear-gradient(90deg,rgba(23,23,23,.6),rgba(23,23,23,0) 60%)}
  .welcome .wrap{padding-top:90px;padding-bottom:90px}
  .welcome p{font-size:20px}
}
.doors{background:var(--char);padding:6px 0 26px}
.door-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (min-width:900px){.door-grid{grid-template-columns:repeat(4,1fr);gap:18px}.doors{padding:28px 0 40px}}
.door{position:relative;display:flex;flex-direction:column;justify-content:flex-start;min-height:146px;padding:13px 12px 12px;border-radius:70px 70px 6px 6px/36px 36px 6px 6px;text-decoration:none;color:var(--cream);overflow:hidden;border:2px solid rgba(0,0,0,.35);box-shadow:inset 0 0 0 4px rgba(255,255,255,.08)}
.door b{font:400 22px/1 var(--display);position:relative;z-index:1;max-width:7em}
.door small{font:700 12px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;opacity:.85;margin-top:5px;position:relative;z-index:1}
.door .host{position:absolute;right:4px;bottom:0;height:78%;width:auto;max-width:62%;object-fit:contain;object-position:bottom right;pointer-events:none}
.door .knob{position:absolute;left:12px;bottom:14px;width:10px;height:10px;border-radius:50%;background:var(--mustard);box-shadow:0 0 0 2px rgba(0,0,0,.35)}
.door:hover{filter:brightness(1.08)}
.door.teal{background:var(--teal)}
.door.rust{background:var(--rust)}
.door.mustard{background:var(--mustard);color:var(--char)}
.door.mustard .knob{background:var(--char)}
.door.desk{background:#2b2724}
.door.desk .host{height:92%;max-width:66%;border-radius:4px;opacity:.95;-webkit-mask-image:linear-gradient(90deg,transparent,#000 30%);mask-image:linear-gradient(90deg,transparent,#000 30%)}
@media (min-width:900px){.door{min-height:250px;padding:20px 18px}.door b{font-size:30px}.door small{font-size:13px}}
.door.shop{flex-direction:row;align-items:center;justify-content:space-between;min-height:92px;margin-top:10px;border-radius:6px;background:var(--cream);color:var(--char);border:2px solid var(--cream);padding:12px 16px}
.door.shop b{font-size:24px;max-width:none}
.door.shop small{display:block;opacity:.75}
.door.shop span.txt{display:block;font-size:14.5px;color:var(--muted);margin-top:4px;max-width:22em}
.door.shop .host{position:static;height:86px;max-width:none;flex:0 0 auto}
@media (min-width:900px){.door.shop{margin-top:18px;min-height:120px;padding:16px 26px}.door.shop .host{height:110px}.door.shop b{font-size:30px}}

.quick{padding:34px 0 10px}
.quick h2,.hall h2,.room-sec h2{font:400 clamp(28px,6vw,42px)/1 var(--display);margin:0 0 6px;color:var(--char)}
.quick p.sub,.room-sec p.sub{margin:0 0 16px;color:var(--muted)}
.picks{display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width:720px){.picks{grid-template-columns:repeat(3,1fr);gap:18px}}
.pick{display:flex;gap:12px;align-items:center;background:var(--paper);border:2px solid var(--char);border-radius:4px;padding:10px;text-decoration:none}
.pick img{width:84px;height:84px;object-fit:cover;border-radius:3px;flex:0 0 auto;background:var(--char)}
.pick .k{font:700 13px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--rust-dk)}
.pick b{display:block;font:700 20px/1.1 var(--cond);margin:4px 0 3px}
.pick span{font-size:14.5px;color:var(--muted);line-height:1.35}
.pick:hover{background:#fff}

.hall{padding:40px 0 10px}
.hall-map{position:relative;border:2px solid var(--char);border-radius:6px;overflow:hidden;background:var(--char)}
.hall-map img{width:100%;height:auto}
.hall-map a{position:absolute;border-radius:4px;min-width:24px;min-height:24px}
.hall-map a:hover,.hall-map a:focus-visible{box-shadow:0 0 0 3px var(--mustard),0 0 24px rgba(214,154,53,.6)}
.hall p.sub{margin:0 0 14px;color:var(--muted)}

.about{background:var(--teal);color:#f7efdc;margin-top:44px}
.about .wrap{display:grid;grid-template-columns:1fr;gap:12px;padding-top:40px;padding-bottom:40px}
.about h2{font:400 clamp(30px,5vw,48px)/1 var(--display);margin:0}
.about p{margin:0 0 12px;font-size:17px}
.about .note{font-size:15px;opacity:.9}
@media (min-width:900px){.about .wrap{grid-template-columns:1fr 1.3fr;gap:40px;padding-top:60px;padding-bottom:60px;align-items:center}}

/* ---------- room pages ---------- */
.room-head{background:var(--char);color:var(--cream);overflow:hidden}
.room-head .wrap{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;padding-top:22px;padding-bottom:0}
.sign{position:relative;width:min(100%,560px);aspect-ratio:900/231;display:flex;flex-direction:column;align-items:center;justify-content:center;background:center/100% 100% no-repeat;color:var(--char);text-align:center;margin-bottom:22px;flex:0 1 auto}
.sign h1{font:400 clamp(25px,7.2vw,46px)/1 var(--display);margin:0;padding:0 11%}
.sign .micro{font:700 clamp(9.5px,2.55vw,14px)/1.15 var(--cond);letter-spacing:clamp(.6px,.3vw,2px);text-transform:uppercase;color:var(--muted);margin-top:4px;padding:0 9%;white-space:nowrap}
.sign.teal{background-image:url(/images/hotel/sign-teal.webp)}
.sign.rust{background-image:url(/images/hotel/sign-rust.webp)}
.sign.mustard{background-image:url(/images/hotel/sign-mustard.webp)}
.sign.charcoal{background-image:url(/images/hotel/sign-charcoal.webp)}
.room-head .host{height:clamp(120px,32vw,230px);width:auto;flex:0 0 auto}
.room-intro{background:var(--char);color:#e7dbc0;padding:0 0 22px}
.room-intro p{margin:0;max-width:44em;font-size:16.5px}
.room-banner{border-bottom:3px solid var(--char)}
.room-banner img{width:100%;height:clamp(170px,40vw,400px);object-fit:cover;object-position:center 30%}
.room-sec{padding:36px 0 6px}

/* chips that jump within a room */
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 4px}
.chips a{font:700 15px/1 var(--cond);letter-spacing:.4px;text-decoration:none;border:2px solid var(--char);border-radius:999px;padding:7px 12px;background:var(--paper)}
.chips a:hover{background:var(--mustard)}

/* episodes */
.eps{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:720px){.eps{grid-template-columns:repeat(2,1fr);gap:20px}}
.ep{display:block;text-decoration:none;background:var(--char);color:var(--cream);border-radius:6px;overflow:hidden;border:2px solid #000}
.ep .pic{position:relative;aspect-ratio:3/2;overflow:hidden;background:#000}
.ep .pic img{width:100%;height:100%;object-fit:cover}
.ep .pic .playbtn{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;background:var(--mustard);display:grid;place-items:center;box-shadow:0 4px 0 #8a5f1c}
.ep .pic .playbtn::before{content:"";border-left:20px solid var(--char);border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:5px}
.ep .pic .num{position:absolute;left:10px;top:10px;background:rgba(23,23,23,.85);font:700 13px/1 var(--cond);letter-spacing:2px;padding:6px 8px;border-radius:3px}
.ep .txt{padding:12px 14px 14px}
.ep h3{font:400 24px/1.05 var(--display);margin:0 0 4px}
.ep p{margin:0;color:#cdbf9f;font-size:15px;line-height:1.4}
.ep:hover .playbtn{background:var(--rust)}

/* videos */
.vid{position:relative;border-radius:6px;overflow:hidden;background:#000;aspect-ratio:16/9;border:2px solid #000;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.vid video{width:100%;height:100%;display:block;object-fit:cover}
.vid .snd{position:absolute;right:12px;bottom:12px;background:rgba(23,23,23,.82);color:var(--cream);border:1px solid rgba(242,230,205,.5);border-radius:999px;font:600 15px/1 var(--cond);letter-spacing:.4px;padding:9px 14px;cursor:pointer}
.vid .snd:hover{background:var(--rust)}
.trailers{display:grid;grid-template-columns:1fr;gap:22px}
@media (min-width:900px){.trailers{grid-template-columns:repeat(2,1fr)}}
.trailer h3{font:700 22px/1.1 var(--cond);margin:0 0 8px}
.trailer p{margin:8px 0 0;font-size:15px;color:var(--muted)}
.trailer p a{color:var(--rust-dk);font-weight:600}

/* printables */
.prints{display:grid;grid-template-columns:1fr;gap:16px}
@media (min-width:720px){.prints{grid-template-columns:repeat(3,1fr);gap:20px}}
.print{display:flex;flex-direction:column;text-decoration:none;background:var(--paper);border:2px solid var(--char);border-radius:4px;overflow:hidden}
.print .pic{aspect-ratio:11/8.5;display:grid;place-items:center;position:relative}
.print .pic img{max-height:78%;width:auto}
.print.cert-rust .pic{background:#faf3e3;box-shadow:inset 0 0 0 10px #faf3e3,inset 0 0 0 13px var(--rust),inset 0 0 0 17px #faf3e3,inset 0 0 0 18px var(--rust)}
.print.cert-teal .pic{background:#faf3e3;box-shadow:inset 0 0 0 10px #faf3e3,inset 0 0 0 13px var(--teal),inset 0 0 0 17px #faf3e3,inset 0 0 0 18px var(--teal)}
.print.cert-rust .pic img{filter:invert(36%) sepia(60%) saturate(700%) hue-rotate(340deg)}
.print.cert-teal .pic img{filter:invert(40%) sepia(30%) saturate(700%) hue-rotate(130deg)}
.print.license .pic{background:#4f8091}
.print.license .pic img{max-height:86%;border-radius:8px}
.print .body{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.print .k{font:700 12.5px/1 var(--cond);letter-spacing:2px;text-transform:uppercase;color:var(--rust-dk)}
.print h3{font:700 22px/1.1 var(--cond);margin:0}
.print p{margin:0;font-size:15px;color:var(--muted);flex:1}
.print .go{margin-top:8px;font:700 17px/1 var(--cond);letter-spacing:.4px;color:var(--teal-dk)}
.print:hover{background:#fff}
.privacy-note{margin:18px 0 0;padding:12px 14px;border:2px dashed #b8a98d;border-radius:4px;font-size:15px;color:var(--muted)}

/* shop cards (Gift Shop) */
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media (max-width:980px){.grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:720px){.grid{grid-template-columns:repeat(2,1fr);gap:12px}}
@media (max-width:330px){.grid{grid-template-columns:1fr}}
.card{display:flex;flex-direction:column;background:var(--paper);border:2px solid var(--char);border-radius:3px;overflow:hidden;min-width:0}
.card .pic{aspect-ratio:1/1;background:var(--char);position:relative}
.card.book .pic{aspect-ratio:3/4;background:#e6d6b5;padding:16px;display:flex;align-items:center;justify-content:center}
.card.book .pic img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;box-shadow:0 6px 14px rgba(23,23,23,.35)}
.card .pic img{width:100%;height:100%;object-fit:cover}
.card .body{padding:12px 12px 14px;display:flex;flex-direction:column;gap:6px;flex:1}
.card h3{font:700 19px/1.1 var(--cond);margin:0;overflow-wrap:anywhere}
.card p{margin:0;font-size:14.5px;line-height:1.45;color:var(--muted);flex:1}
.card .buy{margin-top:8px;display:block;text-align:center;font:700 17px/1 var(--cond);letter-spacing:.4px;padding:12px 8px;border-radius:3px;text-decoration:none;background:var(--teal);color:#fff8ea}
.card .buy:hover{background:var(--teal-dk)}
.card .buy.soon{background:transparent;color:var(--muted);border:2px dashed #b8a98d;cursor:default}
.tag{position:absolute;top:8px;left:8px;background:var(--mustard);color:var(--char);font:700 13px/1 var(--cond);padding:5px 7px;border-radius:2px}
@media (min-width:721px){.card h3{font-size:21px}.card .body{padding:14px}}
.ph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:var(--cream);text-align:center;padding:16px}
.ph svg{width:46%;height:auto;opacity:.9}
.ph span{font:400 15px/1.1 var(--display);opacity:.75}
.subhead{grid-column:1/-1;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 12px;margin:26px 0 -4px;padding-bottom:8px;border-bottom:2px solid var(--char);scroll-margin-top:110px}
.subhead:first-child{margin-top:0}
.subhead h3{font:400 28px/1 var(--display);margin:0;color:var(--rust-dk)}
.subhead span{font-size:15px;color:var(--muted)}
.subhead .also{flex-basis:100%;font-size:14.5px}
.subhead .also a{color:var(--teal-dk);font-weight:600}
.series-art{grid-column:1/-1;margin:4px 0 4px;border-radius:6px;overflow:hidden;border:2px solid #000;background:#0b0b0b}
.series-art img{width:100%;height:auto}
.shop-note{margin:0 0 16px;color:var(--muted);font-size:15px}

/* game banners (Arcade) */
.games{display:grid;gap:18px}
.game{display:grid;grid-template-columns:240px 1fr;gap:22px;align-items:center;background:#000;color:#9dffb6;border:2px solid var(--char);border-radius:3px;padding:16px;text-decoration:none;box-shadow:inset 0 0 40px rgba(51,255,102,.08)}
.game img{width:100%;aspect-ratio:1/1;object-fit:cover;border:1px solid #1c9c40}
.game .tagline{font:600 15px/1 var(--cond);letter-spacing:2px;color:#ffb000;margin:0 0 6px}
.game h3{font:700 30px/1.05 var(--cond);margin:0 0 8px;color:#33ff66}
.game p{margin:0 0 14px;color:#b9f5c8;font-size:16px;max-width:38em}
.game .play{display:inline-block;background:#33ff66;color:#000;font:700 19px/1 var(--cond);letter-spacing:.6px;padding:12px 20px;border-radius:3px}
.game:hover .play{background:#ffb000}
@media (max-width:620px){.game{grid-template-columns:1fr;gap:14px;padding:14px}.game h3{font-size:26px}}
.game.toon{background:#fff6e0;color:#1d1b1b;border:3px solid #1d1b1b;border-radius:16px;box-shadow:6px 6px 0 #119e98}
.game.toon img{border:3px solid #1d1b1b;border-radius:12px}
.game.toon .tagline{color:#119e98}
.game.toon h3{color:#ef4f93;font-size:34px}
.game.toon p{color:#4a423b}
.game.toon .play{background:#ffc934;color:#1d1b1b;border:3px solid #1d1b1b;border-radius:12px;box-shadow:3px 3px 0 #1d1b1b}
.game.toon:hover .play{background:#ef4f93;color:#fff}
.game.quiet{background:#4f8091;color:#fcf6e8;border:2px solid #335a67;border-radius:14px;box-shadow:none}
.game.quiet img{border:0;border-radius:10px}
.game.quiet .tagline{color:#f3c79b;font-family:Georgia,serif;letter-spacing:3px}
.game.quiet h3{color:#fcf6e8;font-family:Georgia,"Times New Roman",serif;font-weight:700}
.game.quiet p{color:#e9efe9}
.game.quiet .play{background:#fcf6e8;color:#2a3f49;border-radius:999px;font-family:Georgia,serif}
.game.quiet:hover .play{background:#d77b3a;color:#fff}
.game.noir{background:#0b0b0b;color:#ece6d8;border:2px solid #000;border-radius:3px;box-shadow:inset 0 0 60px rgba(205,22,22,.12)}
.game.noir img{border:1px solid #2a2a2a}
.game.noir .tagline{color:#cd1616;letter-spacing:4px}
.game.noir h3{color:#ece6d8;text-transform:uppercase;letter-spacing:1px}
.game.noir p{color:#b9b2a5}
.game.noir .play{background:#cd1616;color:#fff;border-radius:2px;letter-spacing:2px;text-transform:uppercase}
.game.noir:hover .play{background:#ece6d8;color:#0b0b0b}
.game.cosmic{background:#141210;color:#F3E6C4;border:2px solid #000;border-radius:10px;box-shadow:inset 0 0 70px rgba(224,164,58,.14)}
.game.cosmic img{border:0;border-radius:6px}
.game.cosmic .tagline{color:#E0A43A;letter-spacing:3px}
.game.cosmic h3{color:#F3E6C4;font-family:var(--display);font-weight:400;font-size:34px}
.game.cosmic p{color:#d8ccaa}
.game.cosmic .play{background:#E0A43A;color:#141210;border-radius:999px}
.game.cosmic:hover .play{background:#C4512B;color:#F3E6C4}

/* front desk (temporary) */
.soon-box{background:var(--paper);border:2px solid var(--char);border-radius:4px;padding:18px;margin-top:4px}
.soon-box h2{font:400 30px/1 var(--display);margin:0 0 8px}
.soon-box ul{margin:8px 0 0;padding-left:20px}

/* ---------- footer ---------- */
footer.site{background:var(--char);color:#d9ccb0;padding:40px 0 28px;font-size:15px;margin-top:50px}
footer.site .cols{display:grid;grid-template-columns:1fr;gap:24px}
@media (min-width:720px){footer.site .cols{grid-template-columns:1.3fr 1fr 1fr}}
footer.site h3{font:700 20px var(--cond);color:var(--cream);margin:0 0 10px}
footer.site ul{list-style:none;padding:0;margin:0}
footer.site li{margin:6px 0}
footer.site a{color:#efe3c8}
footer.site .fine{border-top:1px solid #333;margin-top:30px;padding-top:18px;font-size:13.5px;color:#a89c84}
footer.site .fine p{margin:0 0 8px;max-width:70em}
body.lobby footer.site{margin-top:0}

.pick .thumb{width:84px;height:84px;flex:0 0 auto;border-radius:3px;background:#faf3e3;display:grid;place-items:center;box-shadow:inset 0 0 0 3px #faf3e3,inset 0 0 0 5px var(--rust)}
.pick .thumb img{width:66px;height:66px;object-fit:contain;background:none;filter:invert(36%) sepia(60%) saturate(700%) hue-rotate(340deg)}

@media (min-width:900px){.room-head .wrap{justify-content:flex-start;gap:36px}}
.room-banner.top img{object-position:center 8%}

/* =================== THE HOTEL =================== */
.scene-frame{position:relative;max-width:980px;margin:0 auto;border-bottom:3px solid var(--char)}
@media (min-width:980px){.scene-frame{border:3px solid var(--char);border-top:0;border-radius:0 0 8px 8px;overflow:hidden}}
.scene-frame>img{width:100%;height:auto}
.scene-band{background:var(--char)}
.hot{position:absolute;display:block;border-radius:6px;background:transparent;border:0;padding:0;cursor:pointer}
.hot:hover,.hot:focus-visible{box-shadow:0 0 0 3px var(--mustard),0 0 26px rgba(214,154,53,.55)}
.hot.ding{animation:ding .6s ease}
@keyframes ding{0%,100%{transform:rotate(0)}20%{transform:rotate(-8deg)}40%{transform:rotate(7deg)}60%{transform:rotate(-4deg)}80%{transform:rotate(2deg)}}
.waves{position:absolute;left:53.4%;top:17%;width:0;height:0;pointer-events:none}
.waves i{position:absolute;left:-30px;top:-30px;width:60px;height:60px;border-radius:50%;border:3px solid rgba(214,154,53,.85);opacity:0;animation:wave 3.6s ease-out infinite}
.waves i:nth-child(2){animation-delay:1.2s}.waves i:nth-child(3){animation-delay:2.4s}
@keyframes wave{0%{transform:scale(.3);opacity:.9}100%{transform:scale(3.2);opacity:0}}
.envelope{position:absolute;left:66%;top:49%;width:6%;aspect-ratio:3/2;background:#F2E6CD;border:2px solid #171717;border-radius:2px;opacity:0;pointer-events:none}
.envelope::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom right,transparent 49%,#171717 50%,transparent 53%),linear-gradient(to bottom left,transparent 49%,#171717 50%,transparent 53%);background-size:100% 100%;clip-path:polygon(0 0,100% 0,50% 60%)}
.envelope.go{animation:mail 1.6s ease-in-out forwards}
@keyframes mail{0%{opacity:0;transform:translate(0,0) scale(1)}15%{opacity:1}80%{opacity:1;transform:translate(340%,-150%) scale(.7) rotate(-6deg)}100%{opacity:0;transform:translate(380%,-160%) scale(.5)}}

.desk-wrap{display:grid;grid-template-columns:1fr;gap:26px}
@media (min-width:900px){.desk-wrap{grid-template-columns:1.1fr .9fr;gap:36px;align-items:start}}
.ledger{background:#fbf4e4;border:2px solid var(--char);border-radius:4px;padding:16px 16px 6px}
.ledger h2,.paper h2{font:400 clamp(26px,5.6vw,36px)/1 var(--display);margin:0 0 4px}
.ledger .sub,.paper .sub{color:var(--muted);margin:0 0 12px;font-size:15px}
.ledger ul{list-style:none;margin:0;padding:0}
.reg-row{display:grid;grid-template-columns:1fr;gap:2px;padding:10px 0 12px;border-bottom:1px dashed #c9b893}
.reg-row:last-child{border-bottom:0}
.reg-row .stamp{justify-self:start;font:700 12px/1 var(--cond);letter-spacing:1.6px;text-transform:uppercase;color:var(--rust);border:2px solid var(--rust);border-radius:3px;padding:4px 6px;transform:rotate(-2deg);margin-bottom:4px;opacity:.85}
.reg-row .who{font:700 19px/1.15 var(--cond)}
.reg-row .who i{font:italic 400 15px var(--body);color:var(--muted)}
.reg-row .note{font:400 17px/1.4 Georgia,"Times New Roman",serif;overflow-wrap:anywhere}
.empty{color:var(--muted);font-style:italic}
.preview-note{background:var(--mustard);color:var(--char);font:700 14px/1.3 var(--cond);letter-spacing:.4px;padding:8px 10px;border-radius:3px;margin:0 0 12px}

.paper{background:var(--paper);border:2px solid var(--char);border-radius:4px;padding:16px;box-shadow:5px 5px 0 var(--char)}
.paper .field{display:flex;flex-direction:column;margin-top:12px}
.paper label{font:700 13px/1.2 var(--cond);letter-spacing:1.6px;text-transform:uppercase;color:var(--muted)}
.paper label small{text-transform:none;letter-spacing:0;font-weight:500}
.paper input,.paper textarea{font:400 17px/1.4 var(--body);color:var(--ink);background:#fffaf0;border:0;border-bottom:2px solid var(--char);padding:8px 6px;border-radius:0;outline:none;width:100%}
.paper textarea{min-height:120px;resize:vertical;border:2px solid var(--char);border-radius:3px}
.paper input:focus,.paper textarea:focus{border-color:var(--teal);background:#fff}
.paper .count{align-self:flex-end;font-size:13px;color:var(--muted);margin-top:3px}
.paper .count.low{color:var(--rust-dk);font-weight:600}
.paper .rules{font-size:14.5px;color:var(--muted);margin:14px 0 0;padding:10px 0 0;border-top:1px dashed #b8a98d}
.paper .rules b{color:var(--ink)}
.paper .ts{margin-top:12px;min-height:0}
.paper button[type=submit]{margin-top:14px;width:100%}
.form-msg{margin:10px 0 0;font-size:15.5px;font-weight:600}
.form-msg.ok{color:var(--teal-dk)}
.form-msg.err{color:var(--rust-dk)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.paper.typewriter textarea{font:400 17px/1.55 "Courier New",Courier,monospace;min-height:220px;background:#fffdf6 repeating-linear-gradient(transparent 0 25.5px,#efe3c8 25.5px 26.5px)}

.hotel-rooms{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:720px){.hotel-rooms{grid-template-columns:repeat(3,1fr);gap:18px}}
.hroom{display:block;text-decoration:none;background:var(--char);color:var(--cream);border-radius:6px;overflow:hidden;border:2px solid #000}
.hroom img{width:100%;aspect-ratio:3/2;object-fit:cover}
.hroom .txt{padding:12px 14px 14px}
.hroom b{display:block;font:400 23px/1.05 var(--display)}
.hroom span{display:block;color:#cdbf9f;font-size:15px;margin-top:4px;line-height:1.4}
.hroom:hover img{filter:brightness(1.1)}

.txlog{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.tx{background:#121a1a;color:#e9f1e6;border:2px solid #000;border-radius:6px;padding:12px 14px 12px;box-shadow:inset 0 0 30px rgba(57,124,121,.25)}
.tx-head{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font:700 12.5px/1 var(--cond);letter-spacing:1.6px;text-transform:uppercase;color:var(--mustard);margin-bottom:8px}
.tx p{margin:0 0 6px;font:400 17px/1.45 "Courier New",Courier,monospace;overflow-wrap:anywhere}
.tx-sig{font-size:14.5px;color:#a9c3be}
.txpanel{background:var(--char);color:var(--cream);border-radius:6px;padding:16px;border:2px solid #000}
.txpanel h2{color:var(--cream)}
.txpanel .sub{color:#cdbf9f}
.txpanel .empty{color:#a9c3be}
.crisis{font-size:14.5px;background:#fff3df;border-left:4px solid var(--rust);padding:10px 12px;margin:12px 0 0;color:var(--ink)}

/* =================== THE LIVING ROOM =================== */
.lounge{position:relative;width:100%;max-width:1100px;margin:0 auto;aspect-ratio:1536/1024;overflow:hidden;background:#0d0d0d}
@media (min-width:1100px){.lounge{border:3px solid var(--char);border-top:0;border-radius:0 0 8px 8px}}
.lounge>*{position:absolute}
.lounge .view{left:4.167%;top:20.02%;width:35.81%;height:32.52%;object-fit:cover;opacity:0;transition:opacity 1.2s}
.lounge .view.on{opacity:1}
.lounge .roomimg{inset:0;width:100%;height:100%}
.lounge .glow{left:35.8%;top:35.1%;width:70%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(255,214,140,.38),rgba(255,214,140,.12) 55%,rgba(255,214,140,0));pointer-events:none;mix-blend-mode:screen;transition:opacity .6s}
.lounge .pic{left:52.41%;top:20.12%;width:19.53%;transform-origin:50% 0;transition:transform .8s cubic-bezier(.3,1.6,.5,1);filter:drop-shadow(2px 4px 3px rgba(0,0,0,.35))}
.lounge .lamp{left:29.10%;top:27.93%;width:13.41%;transition:filter .5s}
.lounge .sofa{left:40.04%;top:53.61%;width:44.27%;transition:top 1s ease,transform 1s ease;filter:drop-shadow(0 8px 5px rgba(0,0,0,.35))}
.lounge .spill{left:39.06%;top:84.38%;width:19.53%;opacity:0;transition:opacity .8s}
.lounge .table{left:48.18%;top:67.87%;width:27.99%;filter:drop-shadow(0 10px 6px rgba(0,0,0,.35))}
.lounge .radio{left:9.77%;top:41.8%;width:12.37%}
.lounge .radio img{width:100%;height:auto;display:block}
.lounge .radio .dial{position:absolute;left:28%;top:63%;width:44%;height:17%;border-radius:4px;background:radial-gradient(closest-side,rgba(255,230,150,.55),rgba(255,230,150,0));mix-blend-mode:screen}
.lounge .radio .needle{position:absolute;left:50.07%;top:81.57%;width:2px;height:18%;background:#B95332;box-shadow:0 0 0 .5px #171717;transform-origin:50% 100%;transform:translate(-50%,-100%) rotate(0deg);transition:transform 1.4s cubic-bezier(.3,1.3,.5,1)}
@media (min-width:700px){.lounge .radio .needle{width:3px}}
.lounge[data-s="1"] .sofa{top:3%;transform:scaleY(-1);filter:none}
.lounge[data-p="1"] .pic{transform:rotate(-2.5deg)}
.lounge[data-p="2"] .pic{transform:rotate(-9deg)}
.lounge[data-l="1"] .glow{animation:flick 3.2s infinite steps(1)}
.lounge[data-l="1"] .lamp{animation:flicklamp 3.2s infinite steps(1)}
.lounge[data-l="2"] .glow{opacity:0}
.lounge[data-l="2"] .lamp{filter:brightness(.55) saturate(.8)}
@keyframes flick{0%{opacity:1}8%{opacity:.15}11%{opacity:1}46%{opacity:.4}49%{opacity:1}52%{opacity:.1}55%{opacity:1}}
@keyframes flicklamp{0%{filter:none}8%{filter:brightness(.6)}11%{filter:none}46%{filter:brightness(.8)}49%{filter:none}52%{filter:brightness(.55)}55%{filter:none}}
@media (prefers-reduced-motion:reduce){.lounge[data-l="1"] .glow{opacity:.45}.lounge[data-l="1"] .lamp{filter:brightness(.8)}}
.lounge[data-c="1"] .spill{opacity:1}
.lounge[data-r="0"] .needle{transform:translate(-50%,-100%) rotate(-42deg)}
.lounge[data-r="1"] .needle{transform:translate(-50%,-100%) rotate(-20deg)}
.lounge[data-r="2"] .needle{transform:translate(-50%,-100%) rotate(2deg)}
.lounge[data-r="3"] .needle{transform:translate(-50%,-100%) rotate(22deg)}
.lounge[data-r="4"] .needle{transform:translate(-50%,-100%) rotate(42deg)}
.room-desc{max-width:1100px;margin:0 auto;padding:12px 16px 0;color:var(--muted);font-size:15px}
.sign.long h1{font-size:clamp(20px,5.4vw,36px);line-height:.95}
.sign.long .micro{font-size:clamp(9px,2.3vw,13px)}
.lounge[data-s="1"] .sofa{top:-7%}
.lounge .pic{z-index:2}
.print.oracle .pic{background:var(--mustard);background-image:radial-gradient(rgba(23,23,23,.12) 1px,transparent 1.3px);background-size:14px 14px}
.print.oracle .pic img{max-height:62%}
@media (min-width:720px){.prints{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1000px){.prints{grid-template-columns:repeat(4,1fr)}}
.print .pic{aspect-ratio:4/3;overflow:hidden}
.print .pic img{height:76%;max-height:none;width:auto;max-width:86%;object-fit:contain}
.print.license .pic img{height:88%}
.print.oracle .pic img{height:56%}
.print .pic{display:block;position:relative}
.print .pic img{position:absolute;inset:0;margin:auto;width:86%;height:76%;max-width:none;object-fit:contain}
.print.license .pic img{height:90%;width:90%}
.print.oracle .pic img{height:58%}
.card .also-on{flex:0 0 auto;margin:8px 0 0;font-size:14px;color:var(--muted);text-align:center;line-height:1.5}
.card .also-on a{color:var(--teal-dk);font-weight:700;text-decoration:none;border-bottom:1px solid currentColor;padding:2px 0}
.card .also-on a:hover{color:var(--rust-dk)}
