*{-webkit-tap-highlight-color:transparent}html,body{margin:0;height:100%;background:#e9dfcc;color:#2e2219;font-family:Hiragino Sans,Noto Sans JP,sans-serif;overflow:hidden;touch-action:none}body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#wrap{position:fixed;inset:0}canvas{position:absolute;inset:0;display:block;background:transparent;touch-action:none}#version{position:absolute;right:8px;bottom:calc(6px + env(safe-area-inset-bottom));margin:0;font-size:10px;line-height:1;color:#2e221973;pointer-events:none}button{font:inherit;font-size:15px;padding:10px 20px;border:0;border-radius:999px;background:#2e2219;color:#fff;cursor:pointer;white-space:nowrap;transition:transform .08s,filter .08s}button:active,button.pressed{transform:translateY(2px);filter:brightness(1.3)}button:focus-visible{outline:3px solid #c8402a;outline-offset:2px}#result{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(92vw,340px);max-height:94vh;overflow:auto;box-sizing:border-box;background:#fffdf7;border-radius:14px;padding:16px 18px;box-shadow:0 10px 30px #3c28144d;text-align:center;color:#2e2219}#result.hidden{display:none}#photoWrap{position:relative;width:fit-content;max-width:100%;margin:0 auto 8px}#photo{cursor:pointer}#photoMenu{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-radius:8px;background:#2e221973}#photoMenu.hidden,#photoToast.hidden{display:none}#photoMenu button{min-width:140px;padding:9px 18px;font-size:14px;font-weight:700;background:#fffdf7;color:#2e2219;box-shadow:0 2px #00000040}#photoToast{position:absolute;left:50%;bottom:10px;transform:translate(-50%);margin:0;padding:6px 12px;border-radius:999px;background:#2e2219d9;color:#fff;font-size:13px;white-space:nowrap;pointer-events:none}#result img{display:block;max-width:100%;max-height:280px;margin:0 auto;border-radius:8px;background:#f3ece0}#result p{margin:0 0 10px;font-size:14px}#result #resultText{display:flex;align-items:baseline;justify-content:center;gap:4px;margin:2px 0 12px;line-height:1;color:#2e2219}#resultText .hLabel{font-size:15px;font-weight:700}#resultText .hNum{font-size:44px;font-weight:900;color:#c8402a;letter-spacing:.01em;text-shadow:0 2px 0 #fbe3d8}#resultText .hUnit{font-size:18px;font-weight:800;color:#c8402a}@media(max-height:699px){#resultText .hNum{font-size:34px}#resultText .hUnit{font-size:15px}#result img{max-height:220px}}#result .title{display:inline-block;margin:2px 0 10px;padding:6px 16px 7px;font-size:30px;font-weight:900;letter-spacing:.12em;line-height:1.15;color:#111;background:#ffd900;border:3px solid #111;border-radius:3px;box-shadow:inset 0 0 0 2px #ffd900,inset 0 0 0 4px #111,0 3px #111;transform:rotate(-1.5deg)}#result .title small{display:block;margin-bottom:2px;font-size:15px;letter-spacing:.4em;text-indent:.4em}#result .done{margin:0 0 2px;font-size:13px;color:#c8402a;font-weight:700;letter-spacing:.2em}#result .nameRow{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:10px}#result #ramenName{font-size:18px;font-weight:700;margin:0;line-height:1.4;word-break:break-all;text-wrap:balance}#speak{display:flex;align-items:center;justify-content:center;flex:none;width:44px;height:44px;margin:-9px 0;padding:0;border-radius:50%;background:none;color:inherit;font-size:19px;line-height:1}#speak[hidden]{display:none}#speak.nudge{animation:nudge 1.1s ease-in-out infinite;background:#fbe3d8}@keyframes nudge{0%,to{transform:scale(1)}15%{transform:scale(1.18) rotate(-8deg)}30%{transform:scale(1.18) rotate(8deg)}45%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){#speak.nudge{animation:none}}#result .btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.xbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;box-sizing:border-box;padding:10px 20px;border-radius:999px;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .08s,filter .08s;-webkit-tap-highlight-color:transparent}.xbtn{background:#c8402a;color:#fff;min-width:120px;box-shadow:0 3px #8e2a1b}.xbtn .shareIcon{flex:none;margin-top:-2px}.xbtn:active,.xbtn.pressed{transform:translateY(2px);box-shadow:0 1px #8e2a1b;filter:brightness(1.1)}.xbtn:focus-visible{outline:3px solid #2e2219;outline-offset:2px}#result .again{margin-top:10px;background:#8a6a4e}#result .credit{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin:12px 0 0;font-size:12px;line-height:1.2;color:#2e221980}#result .credit a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}#result .credit a:hover{color:#2e2219}