@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&family=Noto+Serif+JP:wght@400;500;600;700&display=swap');
:root{--ink:#263f35;--sage:#526f5e;--muted:#8b9386;--line:#dedfd3;--cream:#f7f7ef}*{box-sizing:border-box}body{margin:0;background:var(--cream);color:var(--ink);font-family:'Noto Sans JP',sans-serif;font-size:14px}button,select{font:inherit}button,a,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:background .2s,transform .2s}button:active{transform:translateY(1px)}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #cb9960;outline-offset:4px}button:disabled{opacity:.4;cursor:not-allowed}button:disabled:active{transform:none}[hidden]{display:none!important}header{height:100px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 6%;max-width:1600px;margin:auto}.brand{text-decoration:none;color:var(--ink);font-family:Georgia,serif;font-size:32px;letter-spacing:-1px;display:flex;align-items:center;gap:10px}.brand-icon{border:1px solid #788777;border-radius:50%;width:36px;height:36px;text-align:center;font-size:28px;line-height:34px}.brand-sub{font-family:Arial,sans-serif;font-size:8px;letter-spacing:1.8px;align-self:flex-end;margin:0 0 8px 14px}.quiet{border:0;background:none;color:var(--sage);padding:10px;font-size:12px}.quiet span{margin-left:14px}main{max-width:1280px;padding:0 40px;margin:auto}.intro{text-align:center;padding:49px 0 35px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:#798776}.intro .eyebrow span{display:inline-block;width:6px;height:6px;background:#87957c;border-radius:50%;margin-right:9px;vertical-align:middle}h1{font-family:'Noto Serif JP',serif;font-weight:500;letter-spacing:4px;font-size:45px;margin:15px 0 15px}h1 em{font-style:normal;color:#768567}.intro p{color:#8a9184;font-size:12px;line-height:2.1;letter-spacing:1px;margin:0}.game-shell{display:grid;grid-template-columns:minmax(0,1fr) 340px;background:#fffef8;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 12px 50px #34443207}.scene{position:relative;min-height:650px;background:#e9e8db url('../public/party-venue.png') center/cover;isolation:isolate;overflow:hidden}.scene-shade{position:absolute;inset:0;background:linear-gradient(#f3f2e5d9 0%,#efecdd70 26%,#fff6e21a 46%,#c9b69214 72%,#e5dbc999 100%);z-index:-1}.scene-top{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;font-size:9px;letter-spacing:2px;color:#5e6b51;font-weight:600}.live-pill{background:#fffdf4a8;border:1px solid #ffffffaa;border-radius:25px;padding:8px 11px;letter-spacing:.7px;font-size:9px}.mission{text-align:center;position:absolute;top:96px;left:15px;right:15px;pointer-events:none;z-index:2}.mission .eyebrow{font-size:9px}.mission h2{font-family:'Noto Serif JP',serif;font-weight:500;font-size:26px;letter-spacing:2px;margin:12px 0 9px}.mission p{font-size:11px;color:#67735e;letter-spacing:.7px;margin:0}canvas{position:absolute;width:100%;height:auto;left:0;top:85px;touch-action:none;cursor:crosshair}#scene-caption{position:absolute;bottom:25px;left:10px;right:10px;text-align:center;font-size:10px;letter-spacing:1px;color:#606b52}aside{padding:38px 31px;border-left:1px solid var(--line)}aside h2{font-family:'Noto Serif JP',serif;font-size:27px;font-weight:500;line-height:1.65;letter-spacing:1.2px;margin:19px 0 15px}.muted{color:#87907e;font-size:12px;line-height:1.9;margin:0 0 22px}label{display:block;font-size:10px;color:#6d795f;margin:26px 0 10px}.select-wrap select{width:100%;font-size:11px;border:1px solid #dddccd;border-radius:7px;padding:12px 10px;background:#fffdf4;color:var(--ink);cursor:pointer}.levels{display:flex;flex-direction:column;gap:9px;margin:18px 0 22px;font-size:10px;color:#9a9e90}.levels b{font-weight:500;color:#64705b;margin:0 8px}.primary{display:flex;align-items:center;justify-content:space-between;border:none;width:100%;background:var(--sage);color:#fffdf5;border-radius:7px;padding:17px 19px;font-size:12px;letter-spacing:1px}.primary:hover{background:#3f5c4b}.primary span{font-size:18px}.tiny{font-size:9px;color:#959b89;line-height:1.9;margin:12px 0}.center{text-align:center}.instruction{border-top:1px solid var(--line);margin-top:22px;padding-top:18px;display:flex;align-items:center;gap:13px;color:#89937e}.instruction>span{font-size:24px}.instruction p{font-size:9px;line-height:1.9;margin:0}.bottom-note{display:flex;gap:20px;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 12px;margin-top:29px}.bottom-note>span:first-child{font-size:29px;filter:grayscale(.6)}.bottom-note b{font-size:11px;letter-spacing:.8px;font-weight:500}.bottom-note p{font-size:10px;color:#949b89;margin:7px 0 0}.note-mark{margin-left:auto;font-size:9px;letter-spacing:1.8px;color:#939c88}footer{max-width:1200px;margin:auto;padding:27px 0;display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#929a87}footer>span:first-child{font-family:Georgia,serif;font-size:19px;color:#63725e}footer button{border:0;background:none;color:inherit;font-size:9px}.target{display:flex;align-items:baseline;gap:12px;margin:13px 0 23px}.target strong{font:500 65px Georgia,serif;color:var(--sage)}.target span{font-size:12px;color:#88927c}.progress-label{display:flex;justify-content:space-between;font-size:11px;margin-bottom:10px;color:#849078}.progress-label b{color:#4c684f}.progress{height:5px;border-radius:5px;background:#e9ebdf;margin-bottom:18px;overflow:hidden}#cut-progress{height:100%;background:#b9bf95;transition:width .2s}.tools{display:flex;gap:9px;margin-bottom:20px}.tools button{width:50%;border:1px solid #dfe0d0;background:#fafaf2;color:#7b8971;border-radius:5px;padding:11px 3px;font-size:10px}.wide{width:100%;margin-top:8px}.score{display:flex;align-items:center;gap:8px;margin:18px 0 15px}.score strong{font:500 83px Georgia,serif;color:var(--sage);letter-spacing:-5px}.score>span{font:25px Georgia,serif;color:#98a486}.score small{display:block;font:10px 'Noto Sans JP',sans-serif;letter-spacing:1px;margin-top:4px}.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;margin:19px 0}.stats>div{display:flex;justify-content:space-between;font-size:10px;line-height:2.2}.stats span{color:#939985}.stats b{font-weight:500;color:#617455}.share{display:flex;justify-content:space-between;align-items:center;background:#fffdf7;border:1px solid #d4d7c7;border-radius:7px;width:100%;padding:13px 17px;font-size:12px;color:#3d4838;margin-bottom:10px}#result-scene{position:absolute;bottom:70px;left:20px;right:20px;text-align:center;animation:pop .6s ease-out;pointer-events:none}.guest-row{font-size:38px;letter-spacing:8px;filter:drop-shadow(0 4px 10px #ffff)}#result-scene>span{display:inline-block;background:#fffdf1e6;border-radius:20px;padding:8px 17px;margin-top:8px;font-size:11px;color:#67745b}.scene[data-theme=birthday]:before{content:'🎈';position:absolute;left:20px;top:180px;font-size:55px;transform:rotate(-12deg)}.scene[data-theme=home],.scene[data-theme=birthday]{background-image:url('../public/home-venue.png')}.scene[data-theme=hall]{background-image:url('../public/wedding-venue.png')}.scene[data-theme=picnic]:before{content:'🌼';position:absolute;right:25px;top:193px;font-size:42px}.scene[data-theme=patisserie]{background-position:25% center}.scene[data-theme=hall] .scene-shade{background:linear-gradient(#f7f0e7d9,#f9ead76b 35%,#fdf2e011 70%,#eadac788)}#details{background:#fffdf7;border:1px solid var(--line);border-radius:10px;margin-top:22px;padding:28px}#details h3{font-family:'Noto Serif JP',serif;font-size:23px;font-weight:500}#piece-list{display:grid;grid-template-columns:1fr 1fr;gap:12px 30px}.piece{display:flex;align-items:center;gap:10px;font-size:11px}.piece>span{color:#9da18f;min-width:20px}.piece b{width:54px;text-align:right;font-weight:500}.piece small{font-size:9px;color:#99a088;width:48px;text-align:right}.piece-track{height:5px;flex:1;background:#edf0e4;border-radius:10px;overflow:hidden}.piece-track>div{height:100%}dialog{border:1px solid #d5dac9;border-radius:14px;padding:38px;max-width:520px;width:90%;background:#fafaf2;color:var(--ink);box-shadow:0 25px 80px #263a3833}dialog::backdrop{background:#243b3066;backdrop-filter:blur(5px)}dialog h2{font:500 28px/1.7 'Noto Serif JP',serif}dialog ol{padding-left:21px;color:#788470;line-height:2.1;font-size:12px}dialog li{margin-bottom:12px}.close{position:absolute;right:14px;top:10px;border:0;background:none;font-size:27px;color:#667b5e}@keyframes pop{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(min-width:1200px){.scene{min-height:665px}canvas{top:50px}}@media(max-width:1000px){main{padding:0 24px}.game-shell{grid-template-columns:minmax(0,1fr) 300px}aside{padding:30px 25px}.scene{min-height:620px}canvas{top:115px}.mission h2{font-size:22px}.brand-sub{display:none}footer{padding:25px}}@media(max-width:760px){header{height:77px;padding:0 6%}.brand{font-size:27px}.brand-icon{width:30px;height:30px;font-size:24px;line-height:28px}main{padding:0 16px}.intro{padding:33px 0 25px}h1{font-size:32px;letter-spacing:2px}.intro p{font-size:10px}.intro .eyebrow{font-size:8px;letter-spacing:1.1px}.game-shell{grid-template-columns:1fr}.scene{height:490px;min-height:0;border-bottom:1px solid var(--line)}.scene-top{padding:19px 19px;font-size:8px;letter-spacing:1px}.mission{top:75px}.mission h2{font-size:24px}canvas{width:100%;top:103px}.mission p{font-size:10px}aside{border-left:0;padding:28px}.levels{flex-direction:row;flex-wrap:wrap;gap:10px}.levels b{margin:0 4px}aside h2{font-size:26px}#setup h2 br,#playing h2 br{display:none}.instruction{margin-top:16px}label{margin-top:18px}.bottom-note{gap:12px;padding:20px 0}.bottom-note b{font-size:10px}.bottom-note p{font-size:9px;line-height:1.9}.note-mark{display:none}footer{padding:24px 18px;font-size:8px}footer>span:nth-child(2){display:none}.target{margin:0 0 13px}.target strong{font-size:54px}.score{margin:3px 0 10px}.score strong{font-size:72px}#results h2 br{display:initial}#piece-list{grid-template-columns:1fr}.guest-row{font-size:30px;letter-spacing:4px}#result-scene{bottom:57px}#scene-caption{bottom:19px;font-size:8px}}@media(max-width:430px){.scene{height:425px}canvas{top:132px}.mission h2{font-size:21px}.mission{top:72px}.scene-top{padding:15px}.live-pill{font-size:8px;padding:7px}#result-scene{bottom:48px}.guest-row{font-size:26px}#result-scene>span{font-size:9px;padding:6px 13px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Full photographic ending, with the cake and tool hidden behind the story. */
.scene.finished canvas,.scene.finished .mission,.scene.finished::before,.scene.finished #scene-caption{display:none}
.scene.finished .scene-top{position:relative;z-index:4;color:#fff9ed;text-shadow:0 1px 8px #0009}
.scene.finished .live-pill{color:#344637;text-shadow:none}
#result-scene{inset:0;bottom:0;left:0;right:0;text-align:left;animation:photo-reveal .65s ease-out;z-index:2}
.result-photo{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.photo-story{position:absolute;bottom:0;left:0;right:0;padding:100px 34px 33px;color:#fffef4;background:linear-gradient(transparent,#1f3024b0 55%,#17271dd9)}
.photo-story .eyebrow{color:#f2efd4;font-size:9px}
.photo-story h3{font:500 25px/1.7 'Noto Serif JP',serif;margin:12px 0 8px;letter-spacing:1px}
.photo-story p{font-size:11px;letter-spacing:.5px;margin:0;color:#e7e9d9}
.scene::before{display:none}
@keyframes photo-reveal{from{opacity:0;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}
@media(max-width:760px){.photo-story{padding:70px 23px 24px}.photo-story h3{font-size:19px}.result-photo{object-position:50% 40%}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
canvas:focus-visible{outline:2px dashed #748869;outline-offset:-40px;border-radius:20px}

.hint-button{width:100%;border:1px solid #d6d9bc;border-radius:7px;background:#f5f4e6;padding:12px 16px;margin:0 0 12px;color:#68764e;font-size:11px;letter-spacing:.5px}.hint-button:hover,.hint-button[aria-pressed=true]{background:#ecebd4;border-color:#b3bd91}.hint-info{font-size:10px;line-height:1.9;color:#828465;background:#f8f7e9;border-radius:6px;padding:12px;margin:0 0 16px}

#result-title{white-space:pre-line}

.support-button{width:100%;padding:12px 14px;border:1px solid #d9cfb7;background:#faf6e9;color:#7b7159;border-radius:7px;font:inherit;font-size:11px;letter-spacing:.4px;margin-top:13px}.support-button:hover:not(:disabled){background:#f1e9d5}.support-button:disabled{opacity:.6;cursor:default}.support-note{font-size:9px;color:#929781;line-height:1.8;text-align:center;margin:8px 0 0}.footer-links{display:flex;align-items:center;gap:19px}footer .support-button{width:auto;margin:0;padding:10px 12px;border:1px solid #ded8c5;background:#f6f3e7;color:#81745a;border-radius:6px;font-size:10px}@media(max-width:600px){footer{flex-wrap:wrap;gap:18px}.footer-links{flex-wrap:wrap;gap:13px}}

.image-state{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:70px 28px 150px;background:linear-gradient(#fff9e89c,#eff0df80);color:#3f5746;text-align:center;font-size:12px;line-height:1.9}.image-retry{border:1px solid #83957b;border-radius:7px;padding:11px 18px;background:#fffdf4;color:#45624a}.result-photo{position:absolute;inset:0}.photo-story{z-index:1}

.header-actions{display:flex;align-items:center;gap:24px}.support-nav{display:inline-block;background:#78532c;color:#fff9ec;text-decoration:none;border-radius:7px;padding:12px 17px;font-size:12px;font-weight:700;white-space:nowrap}.support-nav:hover{background:#614122}.support-card{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:28px 0;padding:30px 34px;border:1px solid #d8b578;border-radius:12px;background:linear-gradient(110deg,#fff5dc,#f5e6c8);scroll-margin-top:20px}.support-card h2{font-size:25px;color:#674626;margin:9px 0}.support-card p{font-size:12px;line-height:1.9;color:#796349;margin:0}.support-action{min-width:220px;text-align:center}.support-action small{display:block;font-size:10px;margin-top:10px;color:#796349}.support-card .support-button,#support-result{background:#78532c;color:#fff9ec;border-color:#78532c;font-size:14px;font-weight:700;padding:17px 20px;margin-top:0;box-shadow:0 4px 12px #78532c19}.support-card .support-button:hover,#support-result:hover{background:#614122}#support-result{margin-top:13px}@media(max-width:600px){.header-actions{gap:12px}.support-nav{font-size:10px;padding:10px}.support-card{align-items:stretch;flex-direction:column;padding:24px;gap:18px}.support-action{min-width:0}.support-card p{font-size:11px}}