@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;700;900&family=Noto+Sans+JP:wght@400;500;700;900&family=Roboto+Mono:wght@400;700&display=swap');
:root{--red:#da3926;--cream:#f7eed6;--ink:#211b17;--yellow:#f8ce4b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans JP',sans-serif}button{font:inherit;cursor:pointer}a{color:inherit}.skip{position:absolute;left:-9999px;z-index:30}.skip:focus{left:12px;top:12px;background:white;padding:12px}.demo-banner{background:var(--ink);color:white;text-align:center;font-size:10px;line-height:1.7;padding:8px 20px}header{background:var(--cream);padding:13px 4%;display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid var(--ink)}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;font-size:19px;font-weight:900;white-space:nowrap}.brand-mark{width:45px;height:45px;display:grid;place-items:center;background:var(--red);color:white;font-size:22px}.brand small{display:block;font:9px 'Roboto Mono',monospace;letter-spacing:.07em}header nav{display:flex;gap:30px;font:11px 'Roboto Mono',monospace}header nav a{text-decoration:none}
.hero{min-height:700px;background:var(--red);color:var(--cream);display:grid;grid-template-columns:.45fr 1fr .8fr;overflow:hidden}.hero-number{font:900 clamp(180px,20vw,380px)/.8 'Barlow Condensed',sans-serif;letter-spacing:-.09em;writing-mode:vertical-rl;text-orientation:mixed;position:relative;border-right:3px solid var(--cream);display:flex;align-items:center;justify-content:center}.hero-number span{font:10px 'Roboto Mono',monospace;letter-spacing:.15em;writing-mode:horizontal-tb;position:absolute;bottom:30px;left:20px}.hero-title{padding:55px 8% 50px;display:flex;flex-direction:column;align-items:flex-start}.hero-title>span,.hero-slot>span,.scene-index>span,.scene-photo>span,.visit-heading>span,.output-screen>span,.receipt>span,.exit>span{font:10px 'Roboto Mono',monospace;letter-spacing:.1em}.hero h1{font-size:clamp(95px,10vw,180px);line-height:1.12;letter-spacing:-.16em;margin:65px 0 30px;font-weight:900}.hero-title p{font-size:13px;line-height:2.2;max-width:400px}.hero-title a{margin-top:auto;text-decoration:none;border-bottom:2px solid;padding:10px 0;font-size:12px}.hero-slot{border-left:3px solid var(--cream);display:flex;flex-direction:column;padding:20px}.slot-photo{height:100%;min-height:570px;overflow:hidden;position:relative}.slot-photo img{width:100%;height:100%;position:absolute;object-fit:cover;object-position:47% center;animation:slotpan 12s ease-in-out infinite alternate}.hero-slot>span{text-align:right;padding-top:14px}@keyframes slotpan{to{transform:scale(1.14) translateY(-3%)}}.ticker{background:var(--yellow);display:flex;justify-content:space-around;gap:40px;overflow:hidden;padding:17px 0;border-block:3px solid var(--ink);font-size:21px;font-weight:900;white-space:nowrap}
.scenes{display:grid;grid-template-columns:.8fr 1.4fr .22fr;gap:0;padding:110px 5%;min-height:750px}.scene-index{padding:15px 7% 0 0;display:flex;flex-direction:column}.scene-index h2{font-size:clamp(44px,5vw,85px);line-height:1.3;letter-spacing:-.1em;margin:35px 0}.scene-index p{font-size:12px;line-height:2.3;margin-top:auto;max-width:320px}.scene-photo{height:590px;position:relative;overflow:hidden;border:3px solid var(--ink)}.scene-photo img{width:100%;height:100%;object-fit:cover}.scene-photo span{position:absolute;bottom:0;left:0;background:var(--cream);padding:11px}.scene-rail{display:grid;grid-template-rows:repeat(3,1fr);border:3px solid var(--ink);border-left:0;background:var(--yellow)}.scene-rail b{display:grid;place-items:center;font-size:clamp(30px,4vw,70px)}.scene-rail b+b{border-top:3px solid var(--ink)}
.visit{background:var(--red);padding:110px 5% 130px}.visit-heading{max-width:1420px;margin:0 auto 50px;color:var(--cream);display:grid;grid-template-columns:.4fr 1.2fr .7fr;align-items:end;gap:20px}.visit-heading h2{font-size:clamp(55px,6vw,100px);line-height:1.15;letter-spacing:-.12em;margin:0}.visit-heading p{font-size:12px;line-height:2.2;max-width:330px}.machine{max-width:1420px;margin:auto;background:var(--cream);border:5px solid var(--ink);box-shadow:18px 18px 0 #78261c;display:grid;grid-template-columns:1fr 1fr}.machine-controls{padding:35px 45px;border-right:5px solid var(--ink)}.choice-group{border-bottom:3px solid var(--ink);padding:10px 0 28px;margin-bottom:23px}.choice-group h3{font-size:18px;margin:0 0 20px}.choice-group h3 span{font:700 31px 'Barlow Condensed',sans-serif;margin-right:18px}.options{display:grid;grid-template-columns:1fr 1fr;gap:12px}.option{min-height:102px;text-align:left;border:3px solid var(--ink);background:#fffaf0;box-shadow:5px 5px 0 var(--ink);font-size:13px;font-weight:900;padding:13px}.option b{display:block;font:700 31px 'Barlow Condensed',sans-serif}.option.active{background:var(--yellow)}.machine-note{font-size:10px;line-height:1.8}.machine-output{padding:35px;background:#24201c}.output-screen{border:3px solid #978d79;padding:12px;background:#1b1c17;color:white}.output-screen>span{display:block;margin-bottom:10px}.seat-view{height:350px;position:relative;overflow:hidden}.seat-view img{width:100%;height:100%;object-fit:cover;transition:transform .8s,filter .8s}.seat-view.window img{object-position:left center}.seat-view.counter img{transform:scale(1.35) translateX(-12%);filter:saturate(.6)}.receipt{background:#fffaf0;max-width:400px;margin:32px auto 0;padding:25px 25px 35px;color:var(--ink);clip-path:polygon(0 0,100% 0,100% 97%,97% 100%,94% 97%,91% 100%,88% 97%,85% 100%,82% 97%,79% 100%,76% 97%,73% 100%,70% 97%,67% 100%,64% 97%,61% 100%,58% 97%,55% 100%,52% 97%,49% 100%,46% 97%,43% 100%,40% 97%,37% 100%,34% 97%,31% 100%,28% 97%,25% 100%,22% 97%,19% 100%,16% 97%,13% 100%,10% 97%,7% 100%,4% 97%,0 100%)}.receipt h3{font-size:25px;text-align:center;border-bottom:2px dashed;padding-bottom:18px}.receipt dl{margin:0}.receipt dl div{display:flex;justify-content:space-between;border-bottom:1px dashed #aaa;padding:9px 0;font-size:12px}.receipt dt{font-weight:700}.receipt dd{margin:0}.receipt button{width:100%;background:var(--ink);color:white;border:0;padding:13px;margin-top:25px;font-size:11px}.receipt small{display:block;font-size:9px;line-height:1.8;margin-top:14px}
.exit{text-align:center;padding:120px 20px}.exit h2{font-size:clamp(48px,6vw,90px);line-height:1.3;letter-spacing:-.1em;margin:25px}.exit p{font-size:11px;line-height:2}.exit a{display:inline-block;margin-top:22px;border-bottom:2px solid;text-decoration:none;padding:9px;font-size:12px}footer{background:var(--ink);color:white;padding:25px 4%;display:flex;justify-content:space-between;font:10px 'Roboto Mono',monospace}footer a{text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #4e9cb5;outline-offset:3px}
@media(max-width:1100px){.hero{grid-template-columns:.3fr 1fr}.hero-slot{grid-column:1/-1;height:430px;border-left:0;border-top:3px solid var(--cream)}.slot-photo{min-height:0}.hero-number{font-size:210px}.hero h1{font-size:100px}.scenes{grid-template-columns:1fr 1.4fr .2fr}.visit-heading{grid-template-columns:1fr 2fr}.visit-heading p{grid-column:2}.machine{grid-template-columns:1fr}.machine-controls{border-right:0;border-bottom:5px solid var(--ink)}.machine-output{display:grid;grid-template-columns:1fr 1fr;gap:25px}.receipt{margin:0}}
@media(max-width:650px){header{padding:11px 4%}.brand{font-size:15px}.brand-mark{width:35px;height:35px;font-size:18px}.brand small{font-size:7px}header nav a:not(:last-child){display:none}.hero{grid-template-columns:70px 1fr}.hero-number{font-size:65px;text-orientation:upright;letter-spacing:-.06em}.hero-number span{font-size:7px;left:8px}.hero-title{padding:35px 6%}.hero h1{font-size:clamp(55px,15vw,90px);margin:65px 0 30px}.hero-title p{font-size:11px}.hero-slot{height:390px}.scenes{padding:75px 4%;grid-template-columns:1fr 54px}.scene-index{grid-column:1/-1;padding:0 0 30px}.scene-index h2{font-size:55px}.scene-photo{height:380px}.scene-rail b{font-size:27px}.visit{padding:75px 4%}.visit-heading{display:block}.visit-heading h2{font-size:60px;margin:20px 0}.machine{box-shadow:8px 8px 0 #78261c}.machine-controls{padding:25px 20px}.option{min-height:95px;font-size:11px;padding:9px}.machine-output{display:block;padding:20px}.seat-view{height:260px}.receipt{margin:25px auto 0}.exit{padding:90px 20px}footer{flex-direction:column;gap:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.slot-photo img{animation:none}.seat-view img{transition:none}}
/* A full meal photograph beside a vertical noren-style title. */
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 290px;min-height:640px;overflow:hidden;background:var(--cream)}
.hero-slot{position:relative;grid-column:1;grid-row:1;min-height:640px;height:auto;padding:0;border:0;display:block}
.slot-photo{position:absolute;inset:0;min-height:0;height:auto}
.slot-photo img{display:block;width:100%;height:100%;position:static;object-fit:cover;object-position:50% 53%;animation:none}
.hero-slot>span{position:absolute;left:18px;bottom:18px;padding:9px 12px;background:var(--cream);color:var(--ink)}
.hero-title{grid-column:2;grid-row:1;padding:26px 12%;background:var(--red);color:var(--cream);border-left:3px solid var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center}
.hero-title>span,.hero-title small{font:10px 'Roboto Mono',monospace;letter-spacing:.1em}
.hero h1{writing-mode:vertical-rl;text-orientation:upright;font-size:clamp(52px,5vw,78px);line-height:1.1;letter-spacing:.02em;margin:0;font-weight:900;white-space:nowrap}
.hero-note{display:flex;align-items:center;justify-content:space-between;gap:35px;padding:26px 5%;background:var(--cream);border-bottom:3px solid var(--ink)}
.hero-note p{font-size:13px;line-height:1.8;margin:0;max-width:760px}.hero-note a{flex:none;font-size:12px;font-weight:900;text-decoration:none;border-bottom:3px solid var(--red);padding:7px 0}
@media(max-width:1100px){.hero{grid-template-columns:minmax(0,1fr) 210px;min-height:570px}.hero-slot{grid-column:1;grid-row:1;min-height:570px;height:auto;border:0}.hero-title{grid-column:2;grid-row:1}.hero h1{font-size:clamp(48px,6vw,64px)}}
@media(max-width:650px){.hero{display:block;min-height:510px}.hero-slot{position:absolute;inset:0;min-height:0;height:auto;border:0}.slot-photo{inset:0}.slot-photo img{object-position:51% center}.hero-title{position:absolute;z-index:1;top:0;right:0;bottom:0;width:112px;padding:16px 8px;border-left:3px solid var(--ink)}.hero-title>span{font-size:8px;line-height:1.5;writing-mode:vertical-rl}.hero-title small{font-size:8px;writing-mode:vertical-rl}.hero h1{font-size:42px;line-height:1.1;margin:0}.hero-slot>span{left:10px;bottom:10px;font-size:8px}.hero-note{display:block;padding:20px 5%}.hero-note p{font-size:11px;margin-bottom:9px}.hero-note a{display:inline-block}}
