:root{--bg:#fff4e0;--bg-2:#ffe9c7;--card:#fff;--ink:#4a3b32;--ink-soft:#8a7466;--accent:#ffb74d;--accent-deep:#f4a22b;--sky:#b3e5fc;--mint:#b9e8c9;--pink:#ffc9d6;--lilac:#dcd0f5;--good:#7ccf9a;--good-deep:#4eb676;--warn:#ffd180;--radius:22px;--tap:64px;--shadow:0 4px 0 #785a3c2e;--font:"Hiragino Maru Gothic ProN", "BIZ UDPGothic", "Yu Gothic UI", "Meiryo", "Noto Sans JP", system-ui, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--bg-2);color:var(--ink);font-family:var(--font);overscroll-behavior:none;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;font-weight:700;overflow:hidden}button{font:inherit;color:inherit;cursor:pointer}.app{background:var(--bg);width:100%;max-width:520px;height:100dvh;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);flex-direction:column;margin:0 auto;display:flex;position:relative;overflow:hidden}.screen{flex-direction:column;flex:1;gap:10px;min-height:0;padding:10px 14px 14px;animation:.25s ease-out fadeIn;display:flex}.reduce-motion .screen{animation:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.screen.scroll{touch-action:pan-y;overflow-y:auto}.center{text-align:center;justify-content:center;align-items:center}h1,h2,h3,p{margin:0}.btn{min-height:var(--tap);min-width:var(--tap);border-radius:var(--radius);background:var(--accent);box-shadow:var(--shadow);border:0;justify-content:center;align-items:center;gap:8px;padding:10px 22px;font-size:22px;font-weight:800;transition:transform 80ms;display:inline-flex}.btn:active{transform:translateY(3px);box-shadow:0 1px #785a3c2e}.btn.big{min-height:80px;padding:12px 30px;font-size:28px}.btn.good{background:var(--good)}.btn.sky{background:var(--sky)}.btn.pink{background:var(--pink)}.btn.lilac{background:var(--lilac)}.btn.ghost{background:#ffffffb3}.btn.small{min-height:56px;padding:6px 14px;font-size:18px}.btn:disabled{opacity:.45;cursor:default}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:12px}.talk{align-items:center;gap:8px;display:flex}.bubble{box-shadow:var(--shadow);background:#fff;border-radius:20px;flex:1;align-items:center;gap:10px;min-height:70px;padding:12px 16px;font-size:24px;line-height:1.35;display:flex;position:relative}.bubble:before{content:"";border:9px solid #0000;border-left:0;border-right-color:#fff;margin-top:-9px;position:absolute;top:50%;left:-10px}.bubble .icon{font-size:34px}.topbar{align-items:center;gap:10px;display:flex}.dots{flex:1;gap:6px;display:flex}.dots i{background:#0000001a;border-radius:8px;flex:1;height:14px;transition:background .3s}.dots i.on{background:var(--good)}.dots i.now{background:var(--accent)}.pill{box-shadow:var(--shadow);white-space:nowrap;background:#fff;border-radius:999px;flex:none;padding:6px 12px;font-size:16px}.stage{flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.stage .card{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;width:100%;min-height:150px;display:flex}.choices{gap:12px;display:grid}.choice{border-radius:var(--radius);min-height:96px;box-shadow:var(--shadow);background:#fff;border:4px solid #0000;justify-content:center;align-items:center;padding:6px;font-size:34px;font-weight:800;display:flex;position:relative}.choice:active{transform:translateY(3px)}.choice.correct{border-color:var(--good-deep);background:#e6f8ec}.choice.wrong{opacity:.5;background:#eee;border-color:#ccc;animation:.3s nudge}.reduce-motion .choice.wrong{animation:none}.choice.hint{border-color:var(--accent-deep);animation:1.6s ease-in-out infinite breathe}.reduce-motion .choice.hint{animation:none}.choice .mark{font-size:28px;position:absolute;top:4px;right:8px}@keyframes nudge{25%{transform:translate(-6px)}75%{transform:translate(6px)}}@keyframes breathe{50%{transform:scale(1.04)}}.big-text{letter-spacing:.06em;font-size:56px;font-weight:900}.mid-text{font-size:40px;font-weight:900}.emoji-xl{font-size:92px;line-height:1}.emoji-lg{font-size:56px;line-height:1}.emoji-md{font-size:44px;line-height:1}.confetti{pointer-events:none;z-index:50;position:absolute;inset:0;overflow:hidden}.confetti span{font-size:26px;animation:1.6s ease-in forwards fall;position:absolute;top:-30px}.reduce-motion .confetti span{opacity:.9;animation:none;top:40%}@keyframes fall{to{opacity:.8;transform:translateY(105dvh)rotate(260deg)}}.nav{gap:8px;display:flex}.nav .btn{flex-direction:column;flex:1;gap:0;font-size:18px;line-height:1.1}.nav .btn span:first-child{font-size:28px}.sheet{z-index:40;background:#3c281466;justify-content:center;align-items:center;padding:24px;display:flex;position:absolute;inset:0}.sheet .card{text-align:center;flex-direction:column;align-items:center;gap:14px;width:100%;max-height:100%;padding:20px;display:flex;overflow:auto}.muted{color:var(--ink-soft)}.row{align-items:center;gap:10px;display:flex}.grow{flex:1}@media (orientation:landscape) and (height<=480px){.app{max-width:100%}.screen{padding:6px 10px}.bubble{min-height:48px;padding:6px 12px;font-size:18px}.choice{min-height:64px}.emoji-xl{font-size:64px}}.choices.list .choice{min-height:72px;font-size:28px}.title-logo{color:#e8743b;text-shadow:0 3px #fff;font-size:40px;font-weight:900;line-height:1.2}.title-sub{color:var(--ink-soft);font-size:24px}.bob{animation:3.2s ease-in-out infinite bob}.reduce-motion .bob{animation:none}@keyframes bob{50%{transform:translateY(-6px)}}.cell{box-shadow:var(--shadow);background:#fff;border:0;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-height:84px;padding:6px 4px;display:flex}.cell .name{text-align:center;font-size:14px;line-height:1.1}.cell .pair{font-size:30px;line-height:1.1}.cell.locked{box-shadow:none;color:var(--ink-soft);background:#ffffff8c}.grid3{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.grid4{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.part{min-height:72px;box-shadow:var(--shadow);background:#fff;border:4px solid #0000;border-radius:18px;justify-content:center;align-items:center;font-size:34px;display:flex;position:relative}.part.sel{border-color:var(--good-deep);background:#e6f8ec}.part.locked{box-shadow:none;color:var(--ink-soft);background:#ffffff80}.swatch{border:3px solid #0000001f;border-radius:50%;width:40px;height:40px}.tabs{gap:8px;display:flex}.tabs .btn{flex:1;padding:6px;font-size:18px}.tabs .btn.on{background:var(--accent)}.tabs .btn:not(.on){background:#fff}.gift{border-radius:var(--radius);min-height:150px;box-shadow:var(--shadow);background:#fff;border:0;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:6px;font-size:22px;display:flex}.gift .emoji-xl{font-size:76px}.badge-new{color:#fff;background:#ff8a80;border-radius:999px;padding:2px 12px;font-size:16px}.ticket{box-shadow:var(--shadow);background:#fff;border:4px dashed #f4a22b;border-radius:18px;align-items:center;gap:14px;padding:16px 20px;font-size:26px;display:flex}.ring{width:150px;height:150px}.keypad{grid-template-columns:repeat(3,1fr);gap:8px;width:100%;display:grid}.keypad .btn{background:#fff;min-height:56px;font-size:24px}.bar{background:#eee;border-radius:8px;flex:1;height:16px;overflow:hidden}.bar>i{background:var(--good);border-radius:8px;height:100%;display:block}.switch-row{justify-content:space-between;align-items:center;gap:10px;width:100%;font-size:18px;display:flex}.seg{gap:6px;display:flex}.seg button{background:#f4ede3;border:3px solid #0000;border-radius:14px;min-height:48px;padding:4px 14px;font-size:18px}.seg button.on{background:var(--accent);border-color:var(--accent-deep)}.parent-body{text-align:left;flex-direction:column;gap:12px;width:100%;font-size:16px;display:flex}.parent-body h3{margin-top:4px;font-size:18px}details.about{background:#fff8ee;border-radius:14px;padding:0 12px}details.about+details.about{margin-top:8px}details.about summary{cursor:pointer;align-items:center;min-height:52px;font-size:16px;font-weight:800;display:flex}.about-body{flex-direction:column;gap:10px;padding-bottom:12px;font-size:15px;font-weight:600;line-height:1.6;display:flex}.about-block h4{color:#e8743b;margin:0 0 4px;font-size:15px}.about-block ul{margin:0;padding-left:1.2em}.about-block li+li{margin-top:4px}.about-table{border-collapse:collapse;width:100%;font-size:14px;line-height:1.5}.about-table th,.about-table td{vertical-align:top;text-align:left;border:1px solid #ecdcc4;padding:6px 8px}.about-table th{background:#ffe9c7}
