:root{--paper:#f8f5ed;--ink:#333b35;--muted:#838576;--wine:#733a49;--line:#d5d6c9}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit;cursor:pointer;color:inherit;min-height:44px;border:1px solid var(--line);background:transparent;padding:10px 20px;border-radius:2px}button:hover{border-color:var(--ink)}button:focus-visible{outline:2px solid var(--wine);outline-offset:4px}[hidden]{display:none!important}main{max-width:640px;margin:auto;padding:22px 20px max(20px,env(safe-area-inset-bottom))}#intro{position:fixed;z-index:10;inset:0;overflow:auto;background:var(--paper);display:flex;align-items:center;flex-direction:column;text-align:center;padding:clamp(25px,6svh,60px) 24px 24px}.edition{font-size:9px;letter-spacing:.24em;color:var(--muted)}.hero{width:clamp(170px,28svh,250px);height:clamp(140px,24svh,210px);margin:22px 0 12px}.eyebrow{font-size:9px;letter-spacing:.26em;color:var(--wine);margin:0 0 14px}h1{font:normal clamp(34px,8vw,48px)/1.05 Georgia,"Times New Roman",serif;letter-spacing:.08em;margin:0}h1 span{display:block;font:12px/1.8 "Yu Gothic",sans-serif;letter-spacing:.2em;margin-top:15px}.intro-copy{font-size:12px;line-height:2.1;color:#717669;margin:22px 0}.primary{background:var(--ink);color:var(--paper);border:0;min-width:238px;padding:16px 23px;font-size:13px;letter-spacing:.08em}.primary span{margin-left:32px}.intro-hint{font-size:10px;color:var(--muted);margin:18px 0 30px}.bottom{margin-top:auto}header{display:flex;justify-content:space-between;align-items:center;gap:12px}.wordmark{font:21px Georgia,serif;letter-spacing:.08em}.wordmark span{display:block;font:9px sans-serif;letter-spacing:.13em;color:var(--muted);margin-top:6px}.clock{text-align:right}.clock>span{display:block;font-size:8px;letter-spacing:.18em;color:var(--muted);margin-bottom:5px}.clock output{font:23px/1 Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:.03em}.rule{height:1px;background:var(--line);margin-top:18px}#note{font-size:10px;line-height:1.7;text-align:center;color:#777d70;margin:14px 0 2px}.stage{position:relative}canvas{display:block;width:100%;height:min(59svh,610px);touch-action:none;user-select:none;-webkit-user-select:none}.guide{display:flex;align-items:center;justify-content:center;gap:7px;color:#81715b;height:52px;font-size:10px}.guide svg{width:77px;height:46px}footer{border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;gap:8px}footer button{font-size:11px;padding:8px 15px}.service-label{margin-left:auto;font-size:8px;letter-spacing:.16em;color:var(--muted)}#status{font-size:10px;color:#777d70;min-height:28px;line-height:1.6;margin:10px 0}#result{position:absolute;top:3%;left:0;right:0;text-align:center;font:italic 26px Georgia,serif;color:var(--wine);pointer-events:none}#result span{display:block;font:10px sans-serif;letter-spacing:.1em;margin-top:8px}@media(max-width:380px){main{padding:16px 12px}.wordmark{font-size:18px}.clock output{font-size:21px}#note{font-size:9px}}@media(max-height:670px){.hero{margin:10px 0;height:135px}.intro-copy{margin:14px 0}.intro-hint{margin:12px 0}.bottom{margin-top:14px}}

.play-hint{font-size:12px;color:#72766b;text-align:center;margin:15px 0 0}#result-panel{margin-top:24px;border-top:1px solid var(--line,#d5d6c9);padding-top:20px;text-align:center}#result-panel h2{font:30px Georgia,serif;color:#733a49;margin:0 0 8px}.result-actions{display:flex;justify-content:center;gap:10px;align-items:center;margin:18px 0}.result-actions .primary{display:inline-flex;align-items:center;text-decoration:none;min-height:44px;padding:10px 24px}#download:not([href]){opacity:.45;pointer-events:none}#result-image{display:block;width:min(100%,400px);height:auto;margin:16px auto}#diagnostics{font-size:11px;white-space:pre-wrap}button:disabled{opacity:.5}details summary{cursor:pointer;padding:10px}
a.primary{text-decoration:none;display:inline-block} .result-actions{flex-wrap:wrap}.result-actions .primary{min-width:0}
