.menu-dialog{--ink:#242620;--text:#221a15;--muted:#706057;--paper:#fff;--accent:#e37900;--door-duration:600ms;--door-ease:cubic-bezier(.22,.61,.36,1);background:var(--paper);color:var(--text);padding:0;margin:0;border:0;width:100%;height:100svh;max-width:none;max-height:none;overflow:auto}.menu-dialog::backdrop{background:#0008}.menu-dialog .mono{font:400 11px/1.5 var(--mono);color:var(--muted)}
.menu-layout{min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;padding:30px 5vw 88px;gap:60px}.menu-header,.menu-footer{display:flex;align-items:start;justify-content:space-between;gap:24px}.logo{display:block;position:relative;width:131px;height:22px;flex:none}.logo img{position:absolute;max-width:none}.close{border:0;background:none;padding:0;width:24px;height:24px}.close img{display:block;width:24px;height:24px}.menu-content{display:grid;grid-template-columns:minmax(0,1fr) 710px;align-items:center;gap:24px;max-width:1382px;width:100%;margin:auto}.intro{min-width:0}.intro>.mono{margin:0 0 30px}.intro h2{font-size:85px;font-weight:500;letter-spacing:-2.5px;line-height:1.15;margin:0;height:294px}.intro h2 span{display:block}.intro .script{font-family:'Edwardian Script ITC','Bickham Script Pro 3',cursive;font-size:150px;line-height:71px;font-weight:400;letter-spacing:0}.intro .accent{color:var(--accent)}
.plan-shell{width:710px;max-width:100%;container-type:inline-size}.house-plan{width:100%;height:376px;background:var(--ink);padding:8px;display:grid;grid-template-columns:230px 1fr 230px;position:relative}.wing{display:grid;grid-template-rows:180px 180px}.room{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:180px;background:var(--paper);border:4px solid var(--ink);font-size:14px;font-weight:700;line-height:1.5;text-align:center;isolation:isolate}.room-label{max-width:200px;position:relative;z-index:2;pointer-events:none}.room-number{position:absolute;left:11px;top:8px;font:400 9px/1.5 'Geist Mono',monospace;color:var(--muted)}.room--center{height:360px;border-left:0;border-right:0}.room--center .room-number{left:15px}.entry{position:absolute;bottom:-5px;left:310px;width:90px;height:12px;background:var(--paper);pointer-events:none}.room:focus-visible{outline-offset:-10px;z-index:5}.room:is(:hover,:focus-visible){z-index:3}.room:is(:hover,:focus-visible) .room-label{color:var(--accent)}
/* La geometría y los trazos SVG son los originales de Figma.
   Solo gira la hoja: ni el muro, ni el arco, ni la habitación se rotan. */
.door{position:absolute;top:109px;width:63px;height:63px;pointer-events:none;z-index:1}.room--right .door{left:-4px}.room--left .door{right:-4px}.door-axis{width:63px;height:63px;transform:rotate(90deg)}.door-axis svg{position:absolute;left:-4px;top:0;width:67px;height:63px;overflow:visible}.door-leaf{transform-box:view-box;transition:transform var(--door-duration) var(--door-ease);transform:rotate(var(--closed-angle));transform-origin:var(--hinge-x) var(--hinge-y)}.room--right{--hinge-x:2px;--hinge-y:63px;--closed-angle:90deg}.room--left{--hinge-x:2px;--hinge-y:2px;--closed-angle:-90deg}.door-sweep{opacity:0;transition:opacity var(--door-duration) var(--door-ease)}
.door-axis{display:block;position:relative}
.menu-content,.plan-shell{min-width:0}.plan-shell{width:100%;max-width:710px}
@media(hover:hover){body[data-mode='hover'] .room:hover .door-leaf{transform:rotate(0deg)}body[data-mode='hover'] .room:hover .door-sweep{opacity:1}}
body[data-mode='hover'] .room:focus-visible .door-leaf,body[data-mode='open'] .door-leaf,body[data-mode='figma'] .room[data-figma-open='true'] .door-leaf{transform:rotate(0deg)}
body[data-mode='hover'] .room:focus-visible .door-sweep,body[data-mode='open'] .door-sweep,body[data-mode='figma'] .room[data-figma-open='true'] .door-sweep{opacity:1}
.menu-footer{font-size:10px;max-width:1382px;width:100%;margin:0 auto}@media(max-width:1250px){.menu-content{grid-template-columns:minmax(280px,1fr) minmax(0,710px);gap:35px}.intro h2{font-size:64px;height:235px}.intro .script{font-size:112px;line-height:58px}.house-plan{height:52.9577cqw;padding:1.12676cqw;grid-template-columns:32.3944cqw 1fr 32.3944cqw}.wing{grid-template-rows:25.3521cqw 25.3521cqw}.room{height:25.3521cqw;border-width:.56338cqw;font-size:1.97183cqw}.room--center{height:50.7042cqw;border-left:0;border-right:0}.room-number{font-size:1.2676cqw;left:1.5493cqw;top:1.12676cqw}.room--center .room-number{left:2.11268cqw}.door{top:15.3521cqw;width:8.87324cqw;height:8.87324cqw}.room--left .door{right:-.56338cqw}.room--right .door{left:-.56338cqw}.door-axis{transform-origin:0 0;transform:scale(calc(100cqw / 710px)) translate(63px,0) rotate(90deg)}.entry{left:43.66197cqw;width:12.67606cqw;height:1.69014cqw;bottom:-.70423cqw}}
@media(max-width:820px){.menu-layout{padding:24px 24px 135px;gap:48px}.menu-content{grid-template-columns:1fr;gap:42px}.intro>.mono{font-size:9px;margin-bottom:20px}.intro h2{font-size:52px;height:184px}.intro .script{font-size:94px;line-height:45px}.plan-shell{margin:auto}.menu-footer{flex-direction:column;gap:10px;font-size:8px}.demo-controls{flex-wrap:wrap;justify-content:center;width:max-content;max-width:calc(100vw - 20px)}.demo-controls button{padding:8px;font-size:10px}.speed{font-size:10px}.status{bottom:115px;max-width:90vw;width:max-content}.room{font-size:max(10px,1.97183cqw)}}
@media(prefers-reduced-motion:reduce){.door-leaf,.door-sweep{transition:none}}

.menu-layout{padding-bottom:30px;min-height:100svh}.menu-dialog .intro h2{font-size:72px;letter-spacing:-2px;height:auto;line-height:1.15;font-weight:500;margin:0}.menu-dialog .intro h2 span{color:var(--text)}.menu-dialog .intro h2 em{display:block;font:400 150px/.8 var(--script);color:var(--accent);letter-spacing:0;padding-bottom:.2em}.menu-dialog .room{font-family:var(--sans);padding:0;transition:color .3s}.menu-dialog .room:hover,.menu-dialog .room:focus-visible{background:var(--paper)}.menu-dialog .door{bottom:auto;border:0;border-radius:0;transform:none;background:none}.menu-dialog .entry{border:0;transform:none}.menu-dialog .room--right .door{right:auto}.menu-dialog .room--left .door{left:auto}
@media(max-width:1250px){.menu-dialog .intro h2{font-size:54px}.menu-dialog .intro h2 em{font-size:116px}}
@media(max-width:820px){.menu-layout{padding-bottom:32px}.menu-dialog .intro h2{display:block;font-size:42px}.menu-dialog .intro h2 em{font-size:96px}.menu-content{min-height:0;max-width:none}.menu-dialog .room{font-size:max(10px,1.97183cqw)}}