:root{--ink:#2b2420;--ink-soft:#5c5046;--paper:#f7f0e3;--paper-2:#efe4cf;--matcha:#7a8f3e;--pending:#9a8a72;--hanko:#b5402c;--shadow:0 calc(14 * var(--u)) calc(34 * var(--u)) #462d1429, 0 calc(2 * var(--u)) calc(6 * var(--u)) #462d141f;--shadow-soft:0 calc(6 * var(--u)) calc(18 * var(--u)) #462d1424, 0 1px calc(3 * var(--u)) #462d141a;--grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .25  0 0 0 0 .15  0 0 0 .09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");--spring:cubic-bezier(.2, 1.4, .4, 1);--glide:cubic-bezier(.2, .8, .2, 1)}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased;background:#a1aa96;margin:0;font-family:Zen Kaku Gothic New,system-ui,sans-serif;transition:background-color .8s;overflow:hidden}html:has(#end:not(.hidden)){background-color:#ece0c9}html:has(#end:not(.hidden)) body{background-color:#ece0c9}#stage{--u:calc(100cqw / 1440);width:min(100vw,177.778vh);height:min(100vh,56.25vw);position:fixed;top:50%;left:50%;overflow:hidden;translate:-50% -50%;container-type:size}#stage>*{--u:calc(100cqw / 1440)}canvas#game{cursor:default;width:100%;height:100%;display:block;position:absolute;inset:0}body.grab canvas#game{cursor:grab}body.grabbing canvas#game{cursor:grabbing}#hud{pointer-events:none;position:absolute;inset:0}#step-card{left:calc(24 * var(--u));bottom:calc(22 * var(--u));align-items:center;gap:calc(13 * var(--u));background:var(--grain), linear-gradient(180deg, #fbf6ec, #f4ead8);padding:calc(10 * var(--u)) calc(20 * var(--u)) calc(11 * var(--u)) calc(11 * var(--u));border-radius:calc(14 * var(--u));box-shadow:var(--shadow);width:calc(330 * var(--u));transition:opacity .45s ease, transform .55s var(--spring);display:flex;position:absolute;overflow:hidden}#step-card .bar{display:none}#step-card .bar i{width:0;height:100%;transition:width .7s var(--glide);background:#7a8f3e;display:block}#step-card.hidden{opacity:0;transform:translateY(calc(18 * var(--u)))}body.card-right #step-card{left:auto;right:calc(24 * var(--u))}#step-card.nudge{animation:.42s nudge}@keyframes nudge{20%{transform:translateX(calc(-5 * var(--u)))}45%{transform:translateX(calc(4 * var(--u)))}70%{transform:translateX(calc(-2 * var(--u)))}}#step-card .seal{font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(20 * var(--u));color:#fbf3e6;background:var(--hanko);background-image:var(--grain), radial-gradient(circle at 30% 25%, #c95238, #a8392a 70%);border-radius:calc(7 * var(--u));padding:calc(9 * var(--u)) calc(7 * var(--u));writing-mode:vertical-rl;letter-spacing:calc(3 * var(--u));min-height:calc(58 * var(--u));box-shadow:inset 0 0 0 calc(2 * var(--u)) #ffebd738, 0 calc(2 * var(--u)) calc(5 * var(--u)) #78281440;flex:none;justify-content:center;align-items:center;line-height:1.05;display:flex;transform:rotate(-2.5deg)}#step-card.hidden .seal{opacity:0;animation:none}#step-card:not(.hidden) .seal{animation:stamp .55s var(--spring) .12s both}@keyframes stamp{0%{opacity:0;transform:scale(1.5)rotate(-8deg)}60%{opacity:1}to{transform:scale(1)rotate(-2.5deg)}}#step-card .text{flex-direction:column;flex:1;min-width:0;display:flex}#step-card .eyebrow{align-items:center;gap:calc(10 * var(--u));font-family:Shippori Mincho,serif;font-size:calc(13 * var(--u));color:#5e5246;letter-spacing:calc(2 * var(--u));display:flex}#step-card .title{font-family:Shippori Mincho,serif;font-weight:700;font-size:calc(19 * var(--u));letter-spacing:.5px;margin-top:1px}#step-card .hint{font-size:calc(13.5 * var(--u));color:#4a4038;margin-top:calc(4 * var(--u));font-weight:500;line-height:1.45;transition:opacity .16s,transform .16s}#step-card .hint.swap{opacity:0;transform:translateY(calc(3 * var(--u)))}#step-card .progress{gap:calc(6 * var(--u));margin-top:calc(8 * var(--u));display:flex}#step-card .progress:empty{display:none}#step-card .progress i{width:calc(7 * var(--u));height:calc(7 * var(--u));background:#b8ab95;border-radius:50%;transition:background .3s;display:block}#step-card .progress i.on{animation:pip .45s var(--spring);background:#7a8f3e}@keyframes pip{0%{transform:scale(1.9)}to{transform:scale(1)}}#corner{right:calc(26 * var(--u));top:calc(26 * var(--u));gap:calc(10 * var(--u));pointer-events:auto;transition:opacity .5s;display:flex;position:absolute}#corner.hidden{opacity:0;pointer-events:none}button.round{width:calc(42 * var(--u));height:calc(42 * var(--u));background:var(--grain), #f8f1e4;color:var(--ink);font-family:Shippori Mincho,serif;font-size:calc(19 * var(--u));letter-spacing:0;box-shadow:var(--shadow-soft);border-radius:50%;justify-content:center;align-items:center;padding:0;font-weight:700;display:inline-flex}button.round:hover{background:var(--grain), #fffaf0;transform:translateY(calc(-2 * var(--u))) scale(1.06)}#btn-sound .mute{display:none}#btn-sound.off .mute{display:inline}#btn-sound.off .wave{display:none}#btn-sound.off{color:#9a8a72}#toast{z-index:0;isolation:isolate;transform:translate(-50%, calc(8 * var(--u)));align-items:center;gap:calc(2 * var(--u));opacity:0;transition:opacity .6s ease, transform .8s var(--glide);text-shadow:0 0 calc(2 * var(--u)) #fffaeef2, 0 0 calc(14 * var(--u)) #fff6e2f2, 0 0 calc(34 * var(--u)) #ffeec8cc, 0 0 calc(60 * var(--u)) #ffe8be8c;flex-direction:column;display:flex;position:absolute;top:46%;left:22%}#toast .k{font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(46 * var(--u));letter-spacing:calc(8 * var(--u));color:var(--ink)}#toast .s{font-family:Shippori Mincho,serif;font-size:calc(15 * var(--u));letter-spacing:calc(4 * var(--u));color:#4a4038;text-transform:lowercase;padding:calc(2 * var(--u)) calc(12 * var(--u)) calc(3 * var(--u));border-radius:calc(999 * var(--u));margin-top:calc(2 * var(--u));text-shadow:none;background:#faf4e8b3}#toast.show{opacity:1;transform:translate(-50%)}#toast .s,#toast .k{white-space:nowrap}#toast[data-where=top]{top:12%;left:50%}#toast[data-where=below]{top:auto;bottom:7%;left:50%}#toast[data-where=upright]{white-space:nowrap;top:9%;left:84%}#toast[data-where=anchor]{transform:translate(-50%, calc(-100% + calc(8 * var(--u))))}#toast[data-where=anchor].show{transform:translate(-50%,-100%)}#toast[data-where=anchor] .k{font-size:calc(40 * var(--u))}#toast .sp{width:calc(14 * var(--u));height:calc(14 * var(--u));opacity:0;pointer-events:none;clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);background:radial-gradient(circle,#fffef6 0 18%,#fff4d2cc 30%,#fff0c800 70%);position:absolute}#toast.show .sp{animation:1.6s ease-out both tw}#toast .sp{z-index:-1}#toast .sp:first-child{left:calc(-30 * var(--u));top:calc(36 * var(--u));animation-delay:.15s}#toast .sp:nth-child(2){right:calc(-28 * var(--u));top:calc(30 * var(--u));width:calc(18 * var(--u));height:calc(18 * var(--u));animation-delay:.35s}#toast .sp:nth-child(3){left:8%;bottom:calc(-34 * var(--u));width:calc(10 * var(--u));height:calc(10 * var(--u));animation-delay:.55s}#toast .sp:nth-child(4){right:10%;bottom:calc(-30 * var(--u));width:calc(11 * var(--u));height:calc(11 * var(--u));animation-delay:.75s}@keyframes tw{0%{opacity:0;transform:scale(.2)rotate(0)}30%{opacity:1;transform:scale(1.1)rotate(25deg)}to{opacity:0;transform:scale(.6)rotate(60deg)}}#tag,#bubble,#gesture{will-change:transform;position:absolute;top:0;left:0}#tag{background:var(--grain), #fbf6ec;border-radius:calc(10 * var(--u));padding:calc(5 * var(--u)) calc(10 * var(--u)) calc(6 * var(--u));box-shadow:var(--shadow-soft);opacity:0;transition:opacity .25s, scale .35s var(--spring);white-space:nowrap;flex-direction:column;align-items:center;display:flex;translate:-50% -100%;scale:.8}#tag:after{content:"";left:50%;bottom:calc(-5 * var(--u) - var(--tail,0px));width:calc(10 * var(--u));height:calc(10 * var(--u));border-radius:calc(2 * var(--u));background:#fbf6ec;position:absolute;transform:translate(-50%)rotate(45deg)}#tag:before{content:"";width:calc(3 * var(--u));height:var(--tail,0px);background:#fbf6ec;position:absolute;top:100%;left:50%;transform:translate(-50%)}#tag.lead:before{width:calc(1.5 * var(--u));box-shadow:0 0 0 calc(1 * var(--u)) #fbf6ece6;background:#4a4038}#tag.lead:after{width:calc(7 * var(--u));height:calc(7 * var(--u));border:calc(1.5 * var(--u)) solid #fbf6ec;box-sizing:content-box;bottom:calc(0px - var(--tail,0px));background:#4a4038;border-radius:50%;transform:translate(-50%,50%)}#tag.show{opacity:1;scale:1}#tag .k{font-family:Shippori Mincho,serif;font-weight:700;font-size:calc(16 * var(--u));letter-spacing:calc(2 * var(--u))}#tag .s{font-size:calc(11 * var(--u));color:var(--ink-soft);letter-spacing:.5px}#bubble{background:var(--grain), #fffaf1;border-radius:calc(16 * var(--u));padding:calc(10 * var(--u)) calc(18 * var(--u)) calc(11 * var(--u));box-shadow:var(--shadow);opacity:0;transform-origin:50% 100%;transition:opacity .3s, scale .5s var(--spring);white-space:nowrap;flex-direction:column;align-items:center;display:flex;translate:-50% -100%;scale:.6}#bubble:after{content:"";left:50%;bottom:calc(-6 * var(--u));width:calc(13 * var(--u));height:calc(13 * var(--u));border-radius:calc(2 * var(--u));background:#fffaf1;position:absolute;transform:translate(-50%)rotate(45deg)}#bubble.show{opacity:1;scale:1}#bubble .k{font-family:Shippori Mincho,serif;font-weight:700;font-size:calc(19 * var(--u));letter-spacing:calc(2 * var(--u))}#bubble .s{font-size:calc(12 * var(--u));color:var(--ink-soft);margin-top:calc(2 * var(--u))}#gesture{opacity:0;width:0;height:0;transition:opacity .4s}#gesture.show{opacity:1}#gesture .rot{width:0;height:0;transform:rotate(var(--ang,0deg));position:absolute;top:0;left:0}#gesture .rot:before{content:"";border:calc(2 * var(--u)) dashed #fffcf0d9;filter:drop-shadow(0 1px calc(2 * var(--u)) #3c281459);position:absolute}#gesture i{width:calc(16 * var(--u));height:calc(16 * var(--u));margin:calc(-8 * var(--u)) 0 0 calc(-8 * var(--u));box-shadow:0 0 0 calc(3 * var(--u)) #fffaf059, 0 calc(2 * var(--u)) calc(6 * var(--u)) #3c281459;background:#fffaf0;border-radius:50%;position:absolute}#gesture.circle .rot:before{width:calc(56 * var(--u));height:calc(34 * var(--u));left:calc(-28 * var(--u));top:calc(-17 * var(--u));border-radius:50%}#gesture.circle i{animation:1.4s linear infinite g-circle}@keyframes g-circle{0%{transform:translate(0, calc(-17 * var(--u)))}25%{transform:translate(calc(28 * var(--u)), 0)}50%{transform:translate(0, calc(17 * var(--u)))}75%{transform:translate(calc(-28 * var(--u)), 0)}to{transform:translate(0, calc(-17 * var(--u)))}}#gesture.flick .rot:before{width:calc(84 * var(--u));height:0;left:calc(-42 * var(--u));border-width:calc(2 * var(--u)) 0 0 0;border-radius:0;top:0}#gesture.flick i{animation:.42s cubic-bezier(.45,0,.55,1) infinite alternate g-flick}@keyframes g-flick{0%{transform:translateX(calc(-40 * var(--u)))}to{transform:translateX(calc(40 * var(--u)))}}#gesture.stroke .rot:before{width:calc(76 * var(--u));height:0;left:calc(-38 * var(--u));border-width:calc(2 * var(--u)) 0 0 0;border-radius:0;top:0}#gesture.stroke .rot:after{content:"";left:calc(34 * var(--u));top:calc(-6 * var(--u));border:calc(6 * var(--u)) solid transparent;border-left:calc(9 * var(--u)) solid #fffcf0e6;position:absolute}#gesture.stroke i{animation:1s cubic-bezier(.4,0,.3,1) infinite g-stroke}@keyframes g-stroke{0%{transform:translateX(calc(-36 * var(--u)));opacity:0}15%{opacity:1}75%{transform:translateX(calc(32 * var(--u)));opacity:1}to{transform:translateX(calc(36 * var(--u)));opacity:0}}#stamp{width:calc(34 * var(--u));height:calc(34 * var(--u));border-radius:calc(6 * var(--u));font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(20 * var(--u));color:#fbf3e6;background-image:var(--grain), radial-gradient(circle at 30% 25%, #c95238, #a8392a 70%);opacity:0;justify-content:center;align-items:center;display:flex;position:absolute;top:0;left:0;translate:-50% -50%;box-shadow:inset 0 0 0 1.5px #ffebd740}#stamp.show{animation:hanko .95s var(--glide) forwards}@keyframes hanko{0%{opacity:0;transform:scale(1.8)rotate(-14deg)}14%{opacity:1;transform:scale(.92)rotate(-6deg)}24%{transform:scale(1)rotate(-6deg)}70%{opacity:1;transform:translateY(calc(-6 * var(--u))) scale(1) rotate(-6deg)}to{opacity:0;transform:translateY(calc(-16 * var(--u))) scale(.9) rotate(-6deg)}}button{font-family:Shippori Mincho,serif;font-size:calc(18 * var(--u));letter-spacing:calc(3 * var(--u));background:var(--ink);color:var(--paper);border-radius:calc(999 * var(--u));padding:calc(13 * var(--u)) calc(40 * var(--u));cursor:pointer;box-shadow:var(--shadow);transition:transform .25s var(--spring), background .2s, box-shadow .25s;border:0;font-weight:700}button:hover{transform:translateY(calc(-2 * var(--u))) scale(1.04);background:#3d332c}button:active{transition-duration:80ms;transform:translateY(1px)scale(.97)}button:focus-visible{outline:calc(2 * var(--u)) solid var(--hanko);outline-offset:calc(3 * var(--u))}button.ghost{color:var(--ink);background:0 0;box-shadow:inset 0 0 0 1.5px #2b242059}button.ghost:hover{background:#fffaf099}.screen{flex-direction:column;justify-content:center;align-items:center;transition:opacity 1s;display:flex;position:absolute;inset:0}.screen.hidden{opacity:0;pointer-events:none}#title{padding-left:calc(86 * var(--u));background:radial-gradient(34% 60% at 22%,#f4ead88c,#f4ead800 100%);align-items:flex-start}#title.hidden .title-inner{transform:translateX(calc(-30 * var(--u)));opacity:0}.title-inner{text-align:center;background:var(--grain), linear-gradient(180deg, #fbf6ecf7, #f4ead8f5);padding:calc(46 * var(--u)) calc(58 * var(--u)) calc(34 * var(--u));border-radius:calc(22 * var(--u));box-shadow:var(--shadow);transition:transform .9s var(--glide), opacity .7s;animation:rise 1.1s var(--glide) both;position:relative}@keyframes rise{0%{opacity:0;transform:translateY(calc(16 * var(--u)))}}.title-inner .seal{width:calc(58 * var(--u));height:calc(58 * var(--u));border-radius:calc(9 * var(--u));color:#fbf3e6;background-image:var(--grain), radial-gradient(circle at 30% 25%, #c95238, #a8392a 70%);font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(34 * var(--u));box-shadow:inset 0 0 0 calc(2 * var(--u)) #ffebd740, 0 calc(3 * var(--u)) calc(8 * var(--u)) #78281440;animation:stamp-t .7s var(--spring) .55s both;justify-content:center;align-items:center;display:inline-flex;transform:rotate(-4deg)}@keyframes stamp-t{0%{opacity:0;transform:scale(1.7)rotate(-14deg)}55%{opacity:1}to{transform:scale(1)rotate(-4deg)}}.title-inner .steam{left:50%;top:calc(6 * var(--u));width:calc(40 * var(--u));height:calc(40 * var(--u));margin-left:calc(-20 * var(--u));pointer-events:none;position:absolute}.title-inner .steam i{width:calc(3 * var(--u));height:calc(26 * var(--u));border-radius:calc(3 * var(--u));opacity:0;background:linear-gradient(#78645000,#78645047);animation:3.4s ease-in-out infinite steam;position:absolute;bottom:0;left:50%}.title-inner .steam i:nth-child(2){margin-left:calc(-9 * var(--u));animation-delay:1.1s}.title-inner .steam i:nth-child(3){margin-left:calc(8 * var(--u));animation-delay:2.2s}@keyframes steam{0%{opacity:0;transform:translateY(calc(8 * var(--u))) scaleY(.6) skewX(0)}30%{opacity:1}to{opacity:0;transform:translateY(calc(-14 * var(--u))) scaleY(1.1) skewX(14deg)}}.title-inner h1{font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(74 * var(--u));margin:calc(18 * var(--u)) 0 0;letter-spacing:calc(10 * var(--u));padding-left:calc(10 * var(--u));line-height:1.1}.title-inner h1,.title-inner h2,.title-inner p,.title-inner button,.title-inner .small,.title-inner .brush{animation:fadein .9s var(--glide) both}.title-inner h1{animation-delay:.25s}.title-inner h2{animation-delay:.4s}.title-inner .brush{animation-delay:.55s}.title-inner p{animation-delay:.7s}.title-inner button{animation-delay:.85s}.title-inner .small{animation-delay:1s}@keyframes fadein{0%{opacity:0;transform:translateY(calc(6 * var(--u)))}}.title-inner h2{font-family:Shippori Mincho,serif;font-weight:500;font-size:calc(18 * var(--u));margin:calc(6 * var(--u)) 0 0;letter-spacing:calc(12 * var(--u));padding-left:calc(12 * var(--u));text-transform:uppercase;color:var(--ink-soft)}.title-inner .brush{height:calc(10 * var(--u));width:calc(120 * var(--u));margin:calc(16 * var(--u)) auto calc(14 * var(--u));opacity:.55;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 10'><path d='M2 6 C 30 2, 70 3, 118 5 C 80 8, 40 8, 2 6 Z' fill='%232b2420'/></svg>") 50%/contain no-repeat}.title-inner p{margin:0 0 calc(26 * var(--u));color:var(--ink-soft);font-size:calc(15 * var(--u))}.title-inner .small{margin-top:calc(18 * var(--u));font-size:calc(12 * var(--u));color:#8a7c6a;letter-spacing:.5px}#end{background:var(--grain), radial-gradient(ellipse at 40% 45%, #f6efe2, #ece0c9 75%)}.end-inner{align-items:center;gap:calc(56 * var(--u));padding:calc(24 * var(--u));max-width:100%;display:flex}.polaroid{background:var(--grain), #fffbf3;padding:calc(16 * var(--u)) calc(16 * var(--u)) calc(20 * var(--u));border-radius:calc(3 * var(--u));box-shadow:0 calc(26 * var(--u)) calc(60 * var(--u)) #3c281447, 0 calc(3 * var(--u)) calc(8 * var(--u)) #3c281426;position:relative;transform:rotate(-2.4deg)}#end:not(.hidden) .polaroid{animation:drop 1s var(--glide) both}@keyframes drop{0%{transform:translateY(calc(-50 * var(--u))) rotate(-9deg);opacity:0}}.polaroid .tape{left:50%;top:calc(-14 * var(--u));width:calc(110 * var(--u));height:calc(28 * var(--u));margin-left:calc(-55 * var(--u));box-shadow:0 1px calc(2 * var(--u)) #3c28141f;background:#ecdebebf;position:absolute;transform:rotate(3deg)}.polaroid .print{background:#f2ead8;border-radius:1px;overflow:hidden}.polaroid img{width:calc(560 * var(--u));aspect-ratio:5/4;object-fit:cover;display:block}#end:not(.hidden) .polaroid img{animation:3.2s ease-out .5s both develop}@keyframes develop{0%{filter:sepia(.9) brightness(1.7) contrast(.5) blur(calc(2 * var(--u)));opacity:.55}to{filter:none;opacity:1}}.polaroid .caption{margin-top:calc(14 * var(--u));padding:0 calc(4 * var(--u));justify-content:space-between;align-items:baseline;display:flex}.polaroid .caption .ink{font-family:Zen Kurenaido,Shippori Mincho,serif;font-size:calc(22 * var(--u));color:#3a3029}.polaroid .caption .meta{align-items:baseline;gap:calc(8 * var(--u));font-size:calc(12.5 * var(--u));color:#8a7c6a;letter-spacing:.5px;display:flex}.polaroid .caption .meta b{color:var(--hanko);font-family:Shippori Mincho,serif;font-size:calc(17 * var(--u))}.end-side{max-width:calc(340 * var(--u));flex-direction:column;align-items:flex-start;display:flex}#end:not(.hidden) .end-side>*{animation:fadein .9s var(--glide) both}#end:not(.hidden) .end-side>:nth-child(2){animation-delay:.9s}#end:not(.hidden) .end-side>:first-child{animation-delay:.7s}#end:not(.hidden) .end-side>:nth-child(3){animation-delay:1.3s}#end:not(.hidden) .end-side>:nth-child(4){animation-delay:1.8s}.ichigo{font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(44 * var(--u));letter-spacing:calc(8 * var(--u))}.ichigo-en{font-family:Shippori Mincho,serif;font-size:calc(14 * var(--u));letter-spacing:calc(4 * var(--u));color:var(--ink-soft);margin-top:calc(2 * var(--u))}.haiku{font-family:Shippori Mincho,serif;font-size:calc(19 * var(--u));white-space:pre-line;margin:calc(30 * var(--u)) 0 calc(34 * var(--u));padding-left:calc(16 * var(--u));border-left:calc(2 * var(--u)) solid #b5402c80;line-height:1.8}.end-buttons{gap:calc(12 * var(--u));flex-wrap:wrap;display:flex}.end-buttons button{font-size:calc(16 * var(--u));padding:calc(12 * var(--u)) calc(28 * var(--u))}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}#veil{opacity:0;pointer-events:none;background:radial-gradient(#faf4e8eb,#f0e6d2f7);transition:opacity .45s;position:absolute;inset:0}#veil.show{opacity:1}#toast[data-where=spot] .k,#toast[data-where=upright] .k{font-size:calc(58 * var(--u));letter-spacing:calc(12 * var(--u))}#toast[data-where=spot] .s,#toast[data-where=upright] .s{font-size:calc(16 * var(--u))}#toast[data-where=veil]{z-index:5;top:44%;left:50%}#toast[data-where=veil] .k{font-size:calc(52 * var(--u));letter-spacing:calc(14 * var(--u))}#veil{z-index:4}#say{left:50%;bottom:calc(26 * var(--u));align-items:baseline;gap:calc(10 * var(--u));max-width:calc(100% - calc(32 * var(--u)));background:var(--grain), linear-gradient(180deg, #fffaf1, #f6ecda);border-radius:calc(999 * var(--u));padding:calc(9 * var(--u)) calc(22 * var(--u)) calc(10 * var(--u)) calc(10 * var(--u));box-shadow:var(--shadow);opacity:0;transform:translate(-50%, calc(14 * var(--u))) scale(.96);transition:opacity .3s ease, transform .5s var(--spring);white-space:nowrap;display:flex;position:absolute}#say.show{opacity:1;transform:translate(-50%)scale(1)}#say .who{font-family:Shippori Mincho,serif;font-weight:800;font-size:calc(11 * var(--u));letter-spacing:1px;color:#fbf3e6;background:var(--hanko);border-radius:calc(999 * var(--u));padding:calc(4 * var(--u)) calc(9 * var(--u)) calc(5 * var(--u));align-self:center}#say .k{font-family:Shippori Mincho,serif;font-weight:700;font-size:calc(19 * var(--u));letter-spacing:calc(2 * var(--u));color:var(--ink)}#say .s{font-size:calc(12.5 * var(--u));color:var(--ink-soft)}body.touch{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;overscroll-behavior:none}body.touch #stage{touch-action:none}body.touch #stage button{touch-action:manipulation}body.touch button:hover,body.touch button.round:hover{transform:none}body.portrait #stage{--sl:env(safe-area-inset-left,0px);--sr:env(safe-area-inset-right,0px);--st:env(safe-area-inset-top,0px);--sb:env(safe-area-inset-bottom,0px);--u:calc(100cqw / 400);width:100vw;height:100dvh;top:50%;left:50%}body.portrait #stage>*{--u:calc(100cqw / 400)}@media (aspect-ratio>=1){body.portrait #stage{width:56.25dvh}}body.portrait #step-card,body.portrait.card-right #step-card{left:calc(10 * var(--u));right:calc(10 * var(--u));bottom:calc(10 * var(--u) + var(--sb,0px));gap:calc(14 * var(--u));width:auto;padding:calc(12 * var(--u)) calc(16 * var(--u)) calc(13 * var(--u)) calc(12 * var(--u));border-radius:calc(14 * var(--u))}body.portrait #step-card .seal{font-size:calc(22 * var(--u));min-height:calc(66 * var(--u));padding:calc(10 * var(--u)) calc(8 * var(--u))}body.portrait #step-card .eyebrow{font-size:calc(14.5 * var(--u))}body.portrait #step-card .title{font-size:calc(21 * var(--u))}body.portrait #step-card .hint{font-size:calc(15.5 * var(--u));line-height:1.4}body.portrait #step-card .progress i{width:calc(8 * var(--u));height:calc(8 * var(--u))}body.portrait #corner{right:calc(12 * var(--u) + var(--sr,0px));top:calc(12 * var(--u) + var(--st,0px))}body.portrait button.round{width:calc(44 * var(--u));height:calc(44 * var(--u))}body.portrait #toast{top:20%;left:50%}body.portrait #toast[data-where=top]{top:10%}body.portrait #toast[data-where=below]{bottom:26%}body.portrait #toast[data-where=upright]{top:9%;left:50%}body.portrait #toast .k{font-size:calc(40 * var(--u));letter-spacing:calc(6 * var(--u))}body.portrait #toast[data-where=spot] .k,body.portrait #toast[data-where=upright] .k{font-size:calc(44 * var(--u));letter-spacing:calc(8 * var(--u))}body.portrait #toast .s,body.portrait #toast[data-where=spot] .s,body.portrait #toast[data-where=upright] .s{font-size:calc(14 * var(--u));letter-spacing:calc(3 * var(--u))}body.portrait #toast[data-where=veil] .k{font-size:calc(44 * var(--u));letter-spacing:calc(10 * var(--u))}body.portrait #say{bottom:calc(150 * var(--u));white-space:normal;max-width:calc(100% - calc(24 * var(--u)));border-radius:calc(20 * var(--u))}body.portrait #say .k{font-size:calc(18 * var(--u))}body.portrait #say .s{font-size:calc(13 * var(--u))}body.portrait #tag .k{font-size:calc(17 * var(--u))}body.portrait #tag .s{font-size:calc(12 * var(--u))}body.portrait #bubble .s{font-size:calc(13 * var(--u))}body.portrait #title{padding:calc(26 * var(--u)) calc(14 * var(--u)) 0;background:radial-gradient(80% 34% at 50% 20%,#f4ead899,#f4ead800 100%);justify-content:flex-start;align-items:center}body.portrait #title.hidden .title-inner{transform:translateY(calc(-24 * var(--u)))}body.portrait .title-inner{padding:calc(24 * var(--u)) calc(34 * var(--u)) calc(20 * var(--u));border-radius:calc(20 * var(--u))}body.portrait .title-inner .seal{width:calc(46 * var(--u));height:calc(46 * var(--u));font-size:calc(27 * var(--u))}body.portrait .title-inner h1{font-size:calc(54 * var(--u));margin-top:calc(12 * var(--u));letter-spacing:calc(8 * var(--u));padding-left:calc(8 * var(--u))}body.portrait .title-inner h2{font-size:calc(15 * var(--u));letter-spacing:calc(10 * var(--u));padding-left:calc(10 * var(--u))}body.portrait .title-inner .brush{margin:calc(12 * var(--u)) auto calc(10 * var(--u))}body.portrait .title-inner p{font-size:calc(15 * var(--u));margin:0}.title-foot{left:0;right:0;bottom:calc(22 * var(--u));flex-direction:column;align-items:center;transition:opacity .7s;display:flex;position:absolute}.title-foot button{font-size:calc(19 * var(--u));padding:calc(15 * var(--u)) calc(52 * var(--u));animation:fadein .9s var(--glide) .85s both}.title-foot .small{margin-top:calc(12 * var(--u));font-size:calc(13 * var(--u));color:#5e5246;letter-spacing:.5px;padding:calc(3 * var(--u)) calc(12 * var(--u));border-radius:calc(999 * var(--u));animation:fadein .9s var(--glide) 1s both;background:#faf4e8b8}#title.hidden .title-foot{opacity:0}body.portrait .end-inner{gap:calc(14 * var(--u));padding:calc(16 * var(--u));flex-direction:column}body.portrait .polaroid{padding:calc(12 * var(--u)) calc(12 * var(--u)) calc(14 * var(--u))}body.portrait .polaroid img{width:calc(318 * var(--u))}body.portrait .polaroid .caption .ink{font-size:calc(19 * var(--u))}body.portrait .end-side{text-align:center;max-width:calc(360 * var(--u));align-items:center}body.portrait .ichigo{font-size:calc(34 * var(--u));letter-spacing:calc(6 * var(--u))}body.portrait .ichigo-en{font-size:calc(13 * var(--u))}body.portrait .haiku{font-size:calc(16 * var(--u));margin:calc(12 * var(--u)) 0 calc(16 * var(--u));border-left:0;padding-left:0;line-height:1.65}body.portrait .end-buttons{justify-content:center}body.portrait .end-buttons button{font-size:calc(16 * var(--u));padding:calc(13 * var(--u)) calc(24 * var(--u))}
