@import url('base.css');

/* v3: art-led responsive LP. All visual artwork remains in the source PNGs. */
:root{--chocolate:#633a25;--cream:#fff8e6;--ink:#60381f;--pink:#e82e8e}
body{background:#ffd4ab var(--nishi-waffle-image) repeat;background-size:530px;color:var(--ink);font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}
.image-hero{position:relative;width:min(1536px,100%);margin:auto;background:#ffdbb5;isolation:isolate}
.image-hero picture,.image-hero img,.story-art picture,.story-art img{display:block;width:100%;height:auto}
.hero-hit{position:absolute;z-index:2;display:block;min-height:44px;background:transparent;border-radius:99px;text-decoration:none;transition:box-shadow .15s}
.hero-hit:hover,.hero-hit:focus-visible{box-shadow:0 0 0 4px #fff9e9,0 0 0 7px #e83592}
.hero-hit--about{left:57.4%;top:1%;width:12.8%;height:4.8%}
.hero-hit--playnav{left:71.4%;top:1%;width:8.8%;height:4.8%}
.hero-hit--accessnav{left:81.4%;top:1%;width:14.1%;height:4.8%}
.hero-hit--play{left:20.3%;top:87.8%;width:29%;height:8.7%}
.hero-hit--access{left:50.9%;top:87.8%;width:29%;height:8.7%}
.story-art{position:relative;width:min(1254px,100%);margin:64px auto 48px;isolation:isolate}
.story-art #howto{position:absolute;top:43%;left:0}
.section{padding:44px 20px;background:none;border:0}
.section-inner{max-width:1160px;width:100%}
.section-inner.narrow{max-width:1020px}
.illustrated-panel{border:62px solid transparent;border-image-source:var(--nishi-cream-frame-image);border-image-slice:22% fill;border-image-width:100px;border-image-repeat:round;padding:5px 24px 22px;isolation:isolate}
.chocolate-heading{display:flex;align-items:center;justify-content:center;position:relative;margin:0 auto 22px;width:min(560px,100%);height:auto;aspect-ratio:1536/520;padding:0;border:0;background:none;box-shadow:none;color:#fff9e8;font-family:"Hiragino Kaku Gothic StdN","Hiragino Kaku Gothic ProN",sans-serif;letter-spacing:.035em;font-size:30px;font-weight:900;line-height:1.25;z-index:0}
.chocolate-heading::before{content:"";position:absolute;inset:0;width:100%;height:100%;border:0;transform:none;background:var(--nishi-confectionery-image) center top/100% auto no-repeat;box-shadow:none;mix-blend-mode:multiply;z-index:-1}
.chocolate-heading::after{display:none}
.chocolate-heading>span{position:absolute;top:55%;left:5%;width:90%;transform:translateY(-50%);text-shadow:0 2px 1px #3d1e0c70}
.section-lead{font-size:22px;font-weight:800;margin:0 0 14px}
.section-description{font-size:15px;font-weight:600;margin:0 0 30px}
.cream-panel{background:transparent;border:0;border-radius:0;padding:10px 0 24px;box-shadow:none}
.quest-toolbar{margin:28px auto 8px;width:min(730px,100%);font-weight:700}
.quest-toolbar button{background:#fff8e6;border:2px solid #b26c3b;box-shadow:0 3px 0 #c0925240}
.quest-groups{gap:8px;display:block}
.quest-group{background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;margin:0 auto 8px}
.quest-toggle{position:relative;isolation:isolate;width:min(800px,100%);min-height:165px;margin:auto;padding:26px 64px;gap:24px;border:0;background:transparent;border-radius:0}
.quest-toggle::before{content:"";position:absolute;z-index:-1;inset:0;background:var(--nishi-confectionery-image) center 85.9375%/100% 266.667% no-repeat;mix-blend-mode:multiply;pointer-events:none}
.quest-index{background:#754227;color:#fff8df;box-shadow:inset 0 0 0 2px #ad7245,0 3px 0 #4c2a1b;border:3px dashed #a4704a;width:57px;height:57px;font-size:20px;border-radius:37%;transform:rotate(-8deg)}
.quest-label{font-size:28px;font-weight:900;gap:8px 18px}
.quest-label small{font-size:15px;line-height:1.65;font-weight:700}
.quest-count{background:#fff4d199;color:#754322;padding:3px 13px;font-size:13px;font-weight:700}
.quest-plus{background:#6d3b24;box-shadow:0 2px 0 #f0c274;width:35px;height:35px;font-size:26px;line-height:33px}
.quest-panel{margin:5px 0 28px;padding:32px 15px;background:#f8e8c180;border:0;border-top:3px dotted #d4aa70;border-radius:0 0 28px 28px}
.quest-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 22px}
.quest-item .zoom-link{border:0;border-radius:7px;box-shadow:0 5px 12px #5b351317}
.quest-caption{font-size:13px;font-weight:800;line-height:1.6}
.map-guide{font-size:17px;margin-top:28px}
.text-link{color:#b91364;font-size:17px}
.maps{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:34px 0 10px;align-items:start}
.map-card{padding:0;border:0;border-radius:0;box-shadow:none;background:none}
.map-card figcaption{font-size:22px;margin-bottom:22px;font-weight:900}
.map-card figcaption>span{background:#e84580;box-shadow:0 3px 0 #b92259;border-radius:12px;font-size:24px}
.map-card .zoom-link{border:3px solid #d8b171;background:#fff8d8;box-shadow:0 5px 0 #d8b17140;border-radius:14px}
.zoom-label{background:#ffe4a8;color:#74421e;font-size:14px;font-weight:800;min-height:50px}
.information-grid{display:grid;grid-template-columns:1fr 1fr;max-width:1320px;margin:auto;gap:0;align-items:stretch}
.information-grid .section{padding-inline:12px;display:flex}
.information-grid .illustrated-panel{padding:0 0 10px;border-width:48px;border-image-width:78px}
.information-grid .section-inner{max-width:none}
.information-grid .chocolate-heading{font-size:27px;margin-bottom:24px}
.information-grid .section-inner.narrow{display:flex;flex-direction:column;justify-content:flex-start}
.event-facts{padding:10px 0 0;width:min(760px,100%);margin:auto}
.event-facts>div{grid-template-columns:86px 1fr;gap:16px;border-bottom:2px dotted #c4945e;padding:24px 0}
.event-facts dt{font-size:16px}.event-facts dd{font-size:18px}
.event-facts dd strong{color:#db267e;font-size:24px}
.access-panel{padding:6px 0 0;display:flex;flex-direction:column;align-items:center}
.venue-name{font-size:25px;font-weight:900;line-height:1.5}
.address{font-size:15px;margin:18px 0 34px;line-height:1.9}
.button.pink{background:linear-gradient(#f742a4,#ea2384);border:3px solid #b81562;box-shadow:0 5px 0 #be1b6135,inset 0 2px 0 #ffacd3;font-size:17px;min-height:62px;line-height:1.5;font-weight:900}
.access-panel .button{min-width:0;width:100%;padding-inline:20px}
.notices-panel{padding:3px 10px 20px}
.notices-panel li{font-size:16px;font-weight:600;line-height:2.1;padding:11px 0}
.site-footer{margin-top:62px;background:radial-gradient(ellipse at 50% 20%,#7a482d 0,#613922 70%);padding:78px 24px 28px;overflow:visible}
.site-footer::before{height:24px;top:-23px;background:radial-gradient(circle at 22px 24px,#633a25 23px,transparent 24px) 0 0/44px 25px repeat-x}
.organizers{font-size:20px;line-height:2;font-weight:800}.footer-label{font-size:15px;font-weight:700}
.producer-logo{width:290px}.footer-divider{margin:32px 0;font-size:10px;letter-spacing:17px}
.footer-sprinkles{position:absolute;top:40px;left:7%;right:7%;height:130px;pointer-events:none;overflow:hidden}
.footer-sprinkles i{position:absolute;width:9px;height:25px;border-radius:3px;transform:rotate(25deg);background:#f9cf62}
.footer-sprinkles i:nth-child(2){top:50px;left:4%;background:#f265a2;transform:rotate(-35deg)}
.footer-sprinkles i:nth-child(3){top:80px;left:10%;background:#8bcbbc;transform:rotate(45deg)}
.footer-sprinkles i:nth-child(4){top:20px;right:3%;background:#f265a2;transform:rotate(60deg)}
.footer-sprinkles i:nth-child(5){top:80px;right:10%;background:#a4d875;transform:rotate(-30deg)}
.footer-sprinkles i:nth-child(6){top:110px;right:1%;background:#f9cf62;transform:rotate(65deg)}
.dialog-help{background:#fff7e5}
@media(max-width:1050px) and (min-width:768px){.information-grid{grid-template-columns:1fr;max-width:1050px}.information-grid .section{padding-inline:20px}.information-grid .illustrated-panel{border-width:62px;border-image-width:100px;padding:5px 24px 22px}.information-grid .chocolate-heading{font-size:30px}.access-panel .button{max-width:520px}.event-facts>div{grid-template-columns:150px 1fr}.event-facts dd{font-size:21px}.quest-toggle{padding:24px 44px}.quest-label{font-size:25px}.maps{gap:22px}}
@media(max-width:767px){
  body{background-size:310px}
  .image-hero{width:100%;}
  .hero-hit--about{left:13%;top:4.8%;width:31%;height:3.5%}
  .hero-hit--playnav{left:47%;top:4.8%;width:19%;height:3.5%}
  .hero-hit--accessnav{left:68%;top:4.8%;width:22%;height:3.5%}
  .hero-hit--play{left:7.5%;top:78.2%;width:85%;height:8.9%}
  .hero-hit--access{left:7.5%;top:88%;width:85%;height:8.2%}
  .story-art{width:100%;max-width:620px;margin:36px auto 12px}
  .story-art #howto{top:39%}
  .section{padding:30px 5px}
  .illustrated-panel{border-width:23px;border-image-width:52px;padding:15px 2px 30px}
  .chocolate-heading{width:calc(100% + 14px);max-width:410px;left:-7px;font-size:22px;margin-bottom:14px;aspect-ratio:1536/520}
  .chocolate-heading::before{inset:0;width:100%;height:100%;transform:none}
  .section-lead{font-size:16px;margin:0 0 12px;line-height:1.9}
  .section-description{font-size:12px;margin-bottom:20px;line-height:1.9;padding-inline:5px}
  .quest-toolbar{margin:22px 5px 8px;width:calc(100% - 10px);font-size:13px}
  .total-number{font-size:25px}.quest-toolbar button{font-size:11px;padding:7px 12px;min-height:44px}
  .quest-toggle{padding:19px 18px;gap:10px;min-height:110px;width:100%}
  .quest-index{width:35px;height:35px;font-size:14px;border-width:2px;flex:none}
  .quest-label{font-size:18px;gap:2px 7px;line-height:1.7}
  .quest-label small{font-size:10px;line-height:1.7}
  .quest-count{font-size:9px;padding:1px 7px}.quest-plus{width:26px;height:26px;font-size:21px;line-height:24px;flex:none}
  .quest-group{margin-bottom:4px}.quest-panel{padding:24px 9px;margin:0 4px 22px}
  .quest-grid{grid-template-columns:1fr;gap:26px}.quest-caption{font-size:12px}
  .map-guide{font-size:12px;line-height:1.9;margin:25px 5px 5px}.text-link{font-size:14px}
  .maps{grid-template-columns:1fr;gap:38px;margin:26px 8px 0}
  .map-card{padding:0}.map-card figcaption{font-size:18px;margin-bottom:19px;gap:11px}
  .map-card figcaption>span{min-width:43px;height:37px;font-size:20px;border-radius:9px}
  .map-card .zoom-link{border-width:2px;border-radius:11px}.zoom-label{min-height:48px;font-size:12px}
  .information-grid{grid-template-columns:1fr;max-width:620px}
  .information-grid .section{padding:30px 5px}
  .information-grid .illustrated-panel{border-width:23px;border-image-width:52px;padding:15px 12px 32px}
  .information-grid .chocolate-heading{width:calc(100% + 34px);left:-17px;font-size:22px;margin-bottom:22px;max-width:none}
  .event-facts{padding:0 3px}
  .event-facts>div{grid-template-columns:65px 1fr;gap:14px;padding:22px 0}
  .event-facts dt{font-size:13px}.event-facts dd{font-size:15px}.event-facts dd strong{font-size:21px}
  .access-panel{padding:0 0 0}.venue-name{font-size:22px;line-height:1.65}
  .address{font-size:13px;margin:16px 0 28px;line-height:2}
  .access-panel .button{font-size:13px;min-height:58px;gap:8px;padding-inline:12px;border-width:2px}
  .notices-panel{padding:0 10px 0}
  .notices-panel li{font-size:13px;line-height:2.1;padding:10px 0;font-weight:600}
  .site-footer{margin-top:55px;padding:59px 20px 30px}.organizers{font-size:16px}.footer-label{font-size:13px}.producer-logo{width:238px}.footer-sprinkles{left:5%;right:5%}.footer-sprinkles i{width:5px;height:14px}
}
@media(min-width:601px) and (max-width:767px){.section-inner{max-width:620px}.section-inner.narrow{max-width:620px}.quest-label small{font-size:13px}.quest-toggle{padding-inline:45px}}
