/* 取り込んで作った CSS（scripts/import-demo.mjs）。手で直さない */
:root{--white:#faf8f4;--brown:#3a2a20;--cream:#e6dccb;--rust:#a4532e;--line:#3a2a203d;--serif:'Yu Mincho','Hiragino Mincho ProN',Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--white);color:var(--brown);font-family:'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;font-size:14px;line-height:2;letter-spacing:.05em;padding-bottom:32px}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid var(--brown);outline-offset:6px}img{display:block;width:100%;height:auto;object-fit:cover}figure,blockquote,dl,dd{margin:0}h1,h2,h3,p{margin:0}h1,h2,h3,.serif{font-family:var(--serif);font-weight:400}h2{font-size:clamp(25px,2.5vw,36px);line-height:1.8;letter-spacing:.1em;margin-bottom:30px}h3{font-size:22px;letter-spacing:.1em}p+p{margin-top:22px}.header{height:120px;padding:0 4.5%;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:center;gap:20px}.brand svg{width:51px;fill:none;stroke:currentColor;stroke-width:2.4}.brand>span{font-family:var(--serif);font-size:27px;line-height:1.3;letter-spacing:.18em}.brand small{display:block;font:11px/2 Georgia,serif;letter-spacing:.12em;margin-top:6px}.desktop-nav{display:flex;gap:30px;align-items:center;font-family:Georgia,serif;font-size:14px;letter-spacing:.07em}.desktop-nav a:not(.outline){border-bottom:1px solid transparent}.desktop-nav a:hover{border-color:var(--brown)}.outline{border:1px solid var(--brown);padding:7px 25px}.menu-toggle{display:none}.hero{padding:0 3% 0;display:grid;grid-template-columns:minmax(0,1fr) 22%;position:relative;gap:3%;align-items:stretch}.hero-photo{aspect-ratio:3/2;animation:arrive 1.4s ease-out both}.hero-copy{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:48px}.hero h1{writing-mode:vertical-rl;font-size:clamp(30px,3.5vw,52px);line-height:1.85;letter-spacing:.15em}.hero h1 span{display:block}.hero h1 span+span{padding-top:2em}.hero-copy p{font-size:11px;line-height:2.3;letter-spacing:.05em}.scroll{grid-column:1/-1;font:11px Georgia,serif;letter-spacing:.12em;width:50px;margin-top:25px;display:block}.scroll span{display:block;width:1px;height:45px;background:var(--brown);margin:12px 0 0 4px}.section{max-width:1280px;margin:auto;padding:110px 55px}.split{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}.about{padding-top:100px;padding-bottom:140px}.portrait{aspect-ratio:2/3;max-height:650px}.about-copy p:not(.eyebrow){line-height:2.5;font-size:13px}.eyebrow{font:15px/1.5 Georgia,serif;letter-spacing:.13em;margin-bottom:26px}.eyebrow:after{content:'';display:block;width:38px;border-bottom:1px solid var(--brown);margin-top:18px}.menu-section{border-top:1px solid var(--line)}.menu-layout{display:grid;grid-template-columns:1fr 1fr;column-gap:7%;row-gap:28px;align-items:start}.menu-group h3{border-top:1px solid var(--brown);padding:20px 0 12px}.menu-group h3 small{font:12px Georgia,serif;margin-left:14px}.prices>div{display:flex;justify-content:space-between;gap:16px;padding:10px 0}.prices dt{font-size:14px}.prices dd,.price{color:var(--rust);font:23px/1.8 Georgia,serif;white-space:nowrap}.prices dd span,.price span{font-size:13px;margin-left:3px}.menu-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}.menu-photos img{aspect-ratio:1}.menu-photos figcaption{font:11px/2.5 Georgia,serif;letter-spacing:.07em}.coffee{grid-column:1;grid-row:1}.coffee-photos{grid-column:2;grid-row:1}.food{grid-column:1;grid-row:2}.food-photos{grid-column:2;grid-row:2}.morning{grid-column:1/-1;display:grid;grid-template-columns:32% 1fr;background:var(--cream);margin-top:25px;align-items:center}.morning img{aspect-ratio:1.3}.morning>div{padding:25px 10%;position:relative}.morning h3{margin:12px 0}.morning p{font-size:13px}.morning .price{font:30px Georgia,serif;position:absolute;bottom:30px;right:8%;margin:0}.tag{display:inline-block;border:1px solid var(--rust);color:var(--rust);font-size:11px;line-height:1.8;padding:3px 10px}.note{font-size:11px;line-height:1.8;margin-top:22px}.menu-section>.note{text-align:right}.cream{background:var(--cream)}.beans-content{gap:8%;align-items:start}.roaster{aspect-ratio:4/5}.photo-caption{font:12px/2 Georgia,serif;margin-top:15px}.bean-list{margin:30px 0}.bean-list>div{border-top:1px solid var(--line);padding:20px 0;display:flex;justify-content:space-between;gap:15px;align-items:center}.bean-list>div:last-child{border-bottom:1px solid var(--line)}.bean-list dt{font-family:var(--serif);font-size:17px}.bean-list small{display:block;font:11px/1.8 'Yu Gothic',sans-serif;margin-top:8px;letter-spacing:0}.bean-list dd{white-space:nowrap;font:12px Georgia,serif}.bean-list dd span{color:var(--rust);font-size:18px;margin-left:8px}.beans-bag{display:flex;align-items:center;gap:30px}.beans-bag img{width:125px;aspect-ratio:1}.beans-bag p{font-family:var(--serif);font-size:18px;line-height:2}.seats{max-width:1440px;padding-bottom:65px}.interior{aspect-ratio:2.35}.seat-columns{display:grid;grid-template-columns:1fr 1.35fr;gap:5%;margin-top:45px}.seat-columns h2{font-size:27px;margin-bottom:18px}.seat-columns p{font-size:12px}.seat-columns .eyebrow{font-size:14px;margin-bottom:16px}.seat-columns .eyebrow:after{display:none}.takeout{border-left:1px solid var(--line);padding-left:8%;display:flex;gap:24px;align-items:center}.takeout img{width:145px;aspect-ratio:1}.qa{display:grid;grid-template-columns:1fr 2fr;gap:9%}.qa h2{font-size:28px}.questions>div{padding:26px 0;border-top:1px solid var(--line)}.questions>div:last-child{border-bottom:1px solid var(--line)}.questions dt{font-family:var(--serif);font-size:19px;margin-bottom:10px}.questions dd{font-size:13px}.voices h2{margin-bottom:15px}.voices>p:not(.eyebrow){font-size:13px}.voice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:42px}.voice-grid figure{padding:30px;border:1px dashed #8a7765;background:var(--white)}blockquote{font:20px/1.9 var(--serif);margin:24px 0}.voice-grid figcaption{font-size:11px}.access{align-items:start;grid-template-columns:1fr 1.2fr;gap:7%}.access-list>div{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:17px 0;border-bottom:1px solid var(--line)}.access-list>div:first-child{border-top:1px solid var(--line)}.access-list small{display:block;font-size:11px}.contact{border:1px solid var(--brown);padding:25px 15px;text-align:center;margin-top:35px}.contact p{font-size:12px}.phone{display:block;font:32px/1.8 Georgia,serif;letter-spacing:.05em}.contact small{font-size:10px;display:block}.map{width:100%;display:block;margin-top:20px}footer{background:var(--brown);color:var(--white);text-align:center;padding:70px 20px 50px}.footer-brand{font:32px/1.6 var(--serif);letter-spacing:.2em}.footer-brand small{font:12px/2 Georgia,serif;letter-spacing:.12em;display:block}footer p{font-size:11px;line-height:2.5;margin:30px 0 20px}footer>small{font-size:10px}.back-top{display:block;font-size:11px;margin-top:32px}.demo-banner{position:fixed;bottom:0;left:0;right:0;background:var(--brown);color:var(--white);height:32px;display:flex;align-items:center;justify-content:center;font-size:10px;letter-spacing:.12em;z-index:20}.skip{position:fixed;left:20px;top:-100px;background:var(--white);padding:10px;z-index:50}.skip:focus{top:10px}dialog{background:var(--white);color:var(--brown);border:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:25px 7% 70px;overflow:auto}dialog::backdrop{background:var(--white)}.dialog-top{display:flex;align-items:center;justify-content:space-between}.dialog-top>span{font-size:24px;letter-spacing:.15em}.close-menu{border:0;background:none;font:42px/1 Georgia,serif;width:48px;height:48px}dialog nav{max-width:600px;margin:30px auto}dialog nav a{display:block;font:clamp(19px,3vw,28px)/2.8 var(--serif)}dialog nav small{font:12px Georgia,serif;margin-left:18px}dialog .dialog-info{border-top:1px solid var(--line);padding-top:25px;max-width:600px;margin:20px auto;font-size:12px}.dialog-info small{font-size:10px}.dialog-demo{position:fixed;bottom:0;left:0;right:0;background:var(--brown);color:var(--white);text-align:center;font-size:10px;height:32px;line-height:32px}.reveal{animation:arrive 1.1s ease-out both}@keyframes arrive{from{opacity:.35;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(min-width:1600px){.hero{max-width:1600px;margin:auto}.header{max-width:1600px;margin:auto}}
@media(max-width:1000px){.header{height:100px}.desktop-nav{gap:18px}.brand>span{font-size:23px}.brand svg{width:40px}.outline{padding:5px 12px}.section{padding:85px 35px}.split{gap:6%}.about-copy p:not(.eyebrow){font-size:12px}.takeout{display:block}.takeout img{margin-top:20px;width:120px}.bean-list>div{display:block}.bean-list dd{margin-top:10px}.morning .price{position:static;margin-top:12px}.voice-grid figure{padding:22px}.voice-grid blockquote{font-size:18px}.hero-copy p{font-size:10px}}
@media(max-width:700px){html{scroll-padding-top:20px}body{font-size:13px}.header{height:92px;padding:0 6%;gap:10px}.brand{gap:12px}.brand>span{font-size:23px}.brand small{font-size:9px;margin-top:5px;letter-spacing:.06em}.brand svg{width:33px}.desktop-nav{display:none}.menu-toggle{display:block;border:0;background:none;width:44px;height:48px;padding:8px 4px}.menu-toggle span{display:block;border-top:1px solid var(--brown);margin:7px 0}.menu-toggle small{font:9px Georgia,serif;letter-spacing:.1em}.hero{display:block;padding:0 5%}.hero-photo{aspect-ratio:1;object-position:43% center}.hero-copy{flex-direction:row-reverse;align-items:flex-end;justify-content:space-between;padding:30px 3% 0;gap:15px}.hero h1{font-size:31px;line-height:1.8;letter-spacing:.13em}.hero-copy p{font-size:10px;padding-bottom:8px;line-height:2.4}.scroll{margin:25px 0 0 4px}.scroll span{height:30px}.section{padding:75px 6%}.split{display:block}.about{padding-top:65px}.portrait{width:85%;max-height:none;aspect-ratio:2/3}.about-copy{padding:45px 3% 0 8%}.about h2{font-size:25px;margin-bottom:26px}.about-copy p:not(.eyebrow){font-size:12px;line-height:2.3}.desktop-break{display:none}.eyebrow{font-size:13px;margin-bottom:22px}.eyebrow:after{margin-top:12px;width:30px}h2{font-size:27px;margin-bottom:25px}.menu-layout{display:flex;flex-direction:column;gap:25px}.menu-layout>*{width:100%}.menu-photos{gap:10px}.prices dt{font-size:13px}.prices dd{font-size:22px}.menu-group h3{font-size:21px;padding-top:18px}.prices>div{padding:9px 0}.morning{display:block;margin-top:5px}.morning img{aspect-ratio:1.6}.morning>div{padding:25px}.morning .price{position:static;margin:14px 0 0}.menu-section>.note{text-align:left}.roaster{aspect-ratio:3/2}.beans-content>.split{display:block}.beans-content>div+div{margin-top:45px}.beans-content h2{font-size:27px}.bean-list>div{display:flex}.bean-list dt{font-size:15px}.bean-list small{font-size:10px}.bean-list dd{font-size:10px;margin:0}.bean-list dd span{font-size:16px;margin-left:3px}.beans-bag img{width:110px}.beans-bag p{font-size:17px}.interior{aspect-ratio:1.25;object-position:40% center}.seat-columns{display:block;margin-top:35px}.seat-columns h2{font-size:26px}.takeout{display:flex;border-left:0;border-top:1px solid var(--line);padding:30px 0 0;margin-top:30px;gap:15px}.takeout img{width:85px;margin:0}.takeout h2{font-size:21px}.takeout p{font-size:11px}.qa{display:block;padding-top:20px}.questions{margin-top:35px}.questions dt{font-size:18px}.questions dd{font-size:12px}.voice-grid{display:block;margin-top:30px}.voice-grid figure+figure{margin-top:18px}.voice-grid figure{padding:26px}.voice-grid blockquote{font-size:20px;margin:20px 0}.voices>p:not(.eyebrow){font-size:12px}.access>div+div{margin-top:35px}.access-list>div{grid-template-columns:75px 1fr;font-size:12px}.phone{font-size:30px}.contact{padding:22px 10px}.contact p{font-size:11px}.contact small{font-size:9px}.map{margin-top:15px}footer{padding-top:55px}.footer-brand{font-size:28px}footer p span{display:block;height:0;font-size:0}.demo-banner{font-size:10px}.dialog-top>span{font-size:22px}dialog nav{margin-top:30px}dialog nav a{font-size:21px;line-height:3}dialog nav small{font-size:11px;margin-left:10px}.note{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}