:root{--ink:#1d1430;--night:#171433;--panel:#2a2257;--panel-deep:#1f1946;--paper:#fff;--muted:#b9b2dd;--pink:#ff8fbd;--yellow:#ffd84a;--font:"Cubic 11", "DotGothic16", "Galmuri11", system-ui, sans-serif;--px:2px;--ui:calc(var(--px) * 2)}*{box-sizing:border-box}html,body{background:var(--night);height:100%;color:var(--paper);font-family:var(--font);-webkit-font-smoothing:none;touch-action:manipulation;margin:0;overflow:hidden}html:has(#app[data-screen=result]){height:auto;overflow:visible}html:has(#app[data-screen=result]) body{height:auto;overflow:visible}#stage{image-rendering:pixelated;touch-action:none;position:fixed;inset:0 auto auto 0}html:has(#app[data-screen=result]) #stage{touch-action:pan-y}#app{pointer-events:none;position:fixed;inset:0}.screen{padding:max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));gap:12px;display:none;position:absolute;inset:0}#app[data-screen=title] .screen[data-screen=title],#app[data-screen=quiz] .screen[data-screen=quiz],#app[data-screen=reveal] .screen[data-screen=reveal],#app[data-screen=result] .screen[data-screen=result]{display:grid}.screen>:not(.slot){pointer-events:auto}.slot{place-self:stretch stretch;min-width:0;min-height:0}.window{border:solid #0000;border-width:calc(var(--ui) * 3);border-image:var(--frame-window) 3 fill / calc(var(--ui) * 3);filter:drop-shadow(calc(var(--ui) * 2) calc(var(--ui) * 2) 0 #0006);padding:14px 16px}.btn{--frame:var(--frame-btn-default);--frame-pressed:var(--frame-btn-default-pressed);font:inherit;color:var(--ink);border:solid #0000;border-width:calc(var(--ui) * 3);border-image:var(--frame) 3 fill / calc(var(--ui) * 3);--pad-y:7px;--lift:calc(var(--ui) + .08em);padding-block:calc(var(--pad-y) - var(--lift)) calc(var(--pad-y) + var(--lift));cursor:pointer;background:0 0;padding-inline:12px;font-size:16px}.btn:hover:not(:disabled){filter:brightness(1.06)}.btn:active:not(:disabled){border-image-source:var(--frame-pressed);--lift:calc(.08em - var(--ui) / 2);padding-block:calc(var(--pad-y) - var(--lift)) calc(var(--pad-y) + var(--lift))}.btn:focus-visible,.link:focus-visible,.icon-btn:focus-visible{outline:3px dashed var(--yellow);outline-offset:3px}.btn.primary{--frame:var(--frame-btn-primary);--frame-pressed:var(--frame-btn-primary-pressed)}.btn.big{--pad-y:11px;padding-inline:40px;font-size:22px}.btn:disabled{opacity:.45;cursor:default}.link{font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:none;padding:6px 2px;font-size:14px}.link:hover:not(:disabled){color:var(--paper)}.link:disabled{opacity:.4;cursor:default}.icon-btn{top:max(12px, env(safe-area-inset-top));z-index:5;width:44px;height:44px;font:inherit;color:var(--paper);border:solid #0000;border-width:calc(var(--ui) * 3);border-image:var(--frame-btn-dark) 3 fill / calc(var(--ui) * 3);padding:0 0 calc(var(--ui) * 2);cursor:pointer;pointer-events:auto;background:0 0;font-size:18px;line-height:1;position:fixed;right:12px}.lang-menu{top:max(12px, env(safe-area-inset-top));z-index:5;pointer-events:auto;font-size:13px;position:fixed;right:64px}.lang-menu summary{cursor:pointer;border:solid #0000;border-width:calc(var(--ui) * 3);border-image:var(--frame-btn-dark) 3 fill / calc(var(--ui) * 3);height:44px;padding:0 6px calc(var(--ui) * 2);align-items:center;list-style:none;display:flex}.lang-menu summary::-webkit-details-marker{display:none}.lang-menu summary:after{content:"▾";margin-left:6px}.lang-list{border:solid #0000;border-width:calc(var(--ui) * 3);border-image:var(--frame-window) 3 fill / calc(var(--ui) * 3);min-width:100%;padding:4px;display:grid;position:absolute;top:calc(100% + 4px);right:0}.lang-switch{white-space:nowrap;color:var(--paper);align-items:center;padding:8px 10px;text-decoration:none;display:flex}.lang-switch:hover,.lang-switch:focus-visible{color:var(--yellow)}#app:not([data-screen=title]) .lang-menu{display:none}.flag{width:18px;height:12px;image-rendering:pixelated;box-shadow:0 0 0 1px var(--ink);background:50%/100% 100% no-repeat;flex:none;margin-right:6px;display:inline-block}.flag-ja{background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0%200%2012%208' shape-rendering='crispEdges'><rect width='12' height='8' fill='%23ffffff'/><rect x='5' y='2' width='2' height='1' fill='%23bc002d'/><rect x='4' y='3' width='4' height='2' fill='%23bc002d'/><rect x='5' y='5' width='2' height='1' fill='%23bc002d'/></svg>")}.flag-ko{background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0%200%2012%208' shape-rendering='crispEdges'><rect width='12' height='8' fill='%23ffffff'/><rect x='5' y='2' width='2' height='1' fill='%23cd2e3a'/><rect x='4' y='3' width='4' height='1' fill='%23cd2e3a'/><rect x='4' y='4' width='4' height='1' fill='%230047a0'/><rect x='5' y='5' width='2' height='1' fill='%230047a0'/><rect x='1' y='1' width='2' height='1' fill='%231d1430'/><rect x='9' y='1' width='2' height='1' fill='%231d1430'/><rect x='1' y='6' width='2' height='1' fill='%231d1430'/><rect x='9' y='6' width='2' height='1' fill='%231d1430'/></svg>")}.flag-zh-tw{background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0%200%2012%208' shape-rendering='crispEdges'><rect width='12' height='8' fill='%23fe0000'/><rect x='0' y='0' width='6' height='4' fill='%23000095'/><rect x='2' y='1' width='2' height='2' fill='%23ffffff'/></svg>")}.icon-btn:active{border-image-source:var(--frame-btn-dark-pressed);padding:var(--ui) 0 0}.icon-btn[aria-pressed=true]{color:var(--muted);text-decoration:line-through}.kicker{color:var(--pink);letter-spacing:.08em;margin:0;font-size:14px}.hint{text-wrap:balance;word-break:keep-all;color:var(--muted);margin:0;font-size:13px;line-height:1.6}.site-links{flex-wrap:wrap;justify-content:center;gap:4px 14px;font-size:13px;display:flex}.site-links a{color:var(--muted)}.site-links a:focus-visible{outline:3px dashed var(--yellow);outline-offset:3px}.screen[data-screen=title]{grid-template-rows:minmax(0, var(--world-max-height,1fr)) auto;align-content:center;justify-items:center}.title-block{text-align:center;justify-items:center;gap:14px;padding-bottom:16px;display:grid}.logo{margin:0;line-height:0}.logo canvas{image-rendering:pixelated;object-fit:contain;max-width:100%}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.screen[data-screen=quiz]{grid-template-rows:auto 1fr minmax(0, var(--world-max-height,1fr)) auto 1fr;justify-items:center}.screen[data-screen=quiz]>.slot{grid-row:3}.screen[data-screen=quiz]>.dialog{grid-row:4}.hud{align-items:center;gap:10px;width:min(640px,100%);padding-right:52px;font-size:15px;display:flex}.qno{color:var(--yellow);min-width:3.2em}.meter{height:calc(var(--ui) * 6);border:solid #0000;border-width:calc(var(--ui) * 2);border-image:var(--frame-meter) 2 fill / calc(var(--ui) * 2);flex:1}.meter-fill{background:linear-gradient(#ffd6e8 0 var(--ui), transparent var(--ui)), linear-gradient(transparent calc(100% - var(--ui)), #d9548c 0), repeating-linear-gradient(90deg, var(--pink) 0 calc(var(--ui) * 4), #ff6aa8 calc(var(--ui) * 4) calc(var(--ui) * 8));width:0%;height:100%;transition:width .3s steps(6,end)}.meter-label{color:var(--muted);white-space:nowrap;font-size:13px}.dialog{grid-template-columns:auto minmax(0,1fr);gap:10px 12px;width:min(640px,100%);display:grid;position:relative}.dialog>:not(.portrait){grid-column:2}.dialog>.speaker,.dialog>.answers,.dialog>.sub{grid-column:1/-1}.portrait{image-rendering:pixelated;grid-area:1/1/span 2;align-self:start;margin-top:6px}.speaker{top:calc(var(--ui) * -5);color:var(--ink);border:solid #0000;border-width:calc(var(--ui) * 2);border-image:var(--frame-tag) 2 fill / calc(var(--ui) * 2);margin:0;padding:0 8px 2px;font-size:13px;position:absolute;left:0}.comment{min-height:0;color:var(--yellow);margin:4px 0 0;font-size:13px}.comment:empty{display:none}.comment,.question{line-break:strict;word-break:auto-phrase}:lang(ko),:lang(ko) .comment,:lang(ko) .question{word-break:keep-all}.question{min-height:3.2em;margin:4px 0 2px;font-size:clamp(17px,4.6vw,21px);line-height:1.6}.unshown{visibility:hidden}.answers{grid-template-columns:repeat(6,1fr);gap:10px 8px;display:grid}.answer{word-break:keep-all;grid-column:span 2;padding-inline:0;font-size:13px;line-height:1.3}.answer.yes,.answer.no{grid-column:span 3;font-size:17px}.answer.yes{--frame:var(--frame-btn-yes);--frame-pressed:var(--frame-btn-yes-pressed);order:-2}.answer.no{--frame:var(--frame-btn-no);--frame-pressed:var(--frame-btn-no-pressed);order:-1}.sub{justify-content:space-between;display:flex}.screen[data-screen=reveal]{grid-template-rows:minmax(0, var(--world-max-height,1fr)) auto;align-content:center;justify-items:center}.reveal-text{text-align:center;min-width:min(360px,100%);margin:0 0 24px;font-size:clamp(20px,5vw,28px)}.flash{background:var(--paper);opacity:0;pointer-events:none;position:fixed;inset:0}.flash.on{animation:.7s steps(7,end) forwards flash}@keyframes flash{0%{opacity:1}to{opacity:0}}#app[data-screen=result]{position:relative}#app[data-screen=result] .icon-btn{position:absolute}.screen[data-screen=result]{grid-template-rows:minmax(38vh,1fr) auto auto;min-height:100dvh;position:relative}.result-panel{gap:12px;animation:.4s steps(5,end) both rise;display:grid}.result-summary,.result-share{display:contents}@keyframes rise{0%{opacity:0;transform:translateY(40px)}}.result-title{color:var(--yellow);margin:0;font-size:clamp(24px,6.4vw,32px);font-weight:400;line-height:1.3}.legend{grid-template-columns:1fr 1fr;gap:8px 14px;margin:0;padding:0;list-style:none;display:grid}.legend li{grid-template-columns:28px 1fr auto;align-items:center;gap:8px;font-size:13px;display:grid}.legend .chip{width:30px;height:30px;color:var(--paper);border:solid #0000;border-width:calc(var(--ui) * 2);border-image:var(--frame-chip) 2 / calc(var(--ui) * 2);text-shadow:2px 0 var(--ink), -2px 0 var(--ink), 0 2px var(--ink), 0 -2px var(--ink);background-clip:padding-box;place-items:center;padding-bottom:.1em;font-size:16px;line-height:1;display:grid}.legend .bar{height:calc(var(--ui) * 3);background:var(--panel-deep);box-shadow:inset 0 var(--ui) 0 #00000059;margin-top:4px;display:block}.legend .bar>span{height:100%;box-shadow:inset 0 var(--ui) 0 #ffffff73, inset 0 0 0 var(--ui) #ffffff40;display:block}.legend .pct{color:var(--muted);font-size:12px}.items{gap:8px;display:grid}.items[hidden]{display:none}.item-list{flex-wrap:wrap;gap:6px 12px;margin:0;padding:0;list-style:none;display:flex}.item-list li{align-items:center;gap:6px;font-size:13px;display:flex}.item-list canvas{image-rendering:pixelated}.share-head{text-align:center;color:var(--pink);margin:4px 0 0}#share{padding-inline:12px}.share-apps{text-wrap:balance;word-break:keep-all;text-align:center;color:var(--muted);margin:-4px 0 0;font-size:13px}.share-sns{gap:12px;display:flex}.share-sns[hidden]{display:none}.share-sns .btn{flex:1;padding-inline:4px}.share-apps span{white-space:nowrap}@media (width<=559px){.share-sns{flex-direction:column}}.share-links{flex-wrap:wrap;justify-content:center;column-gap:20px;display:flex}.share-note{text-align:center;color:var(--yellow);margin:0;font-size:13px;line-height:1.5}.share-note:empty{display:none}.share-note a{color:var(--pink)}.share-label{color:var(--muted);margin-bottom:-8px;font-size:13px}.share-text{resize:vertical;width:100%;font:inherit;color:var(--paper);background:var(--panel-deep);border:var(--ui) solid var(--ink);box-shadow:inset 0 var(--ui) 0 #00000059;padding:8px 10px;font-size:13px;line-height:1.5}.share-text:focus-visible{outline:3px dashed var(--yellow);outline-offset:3px}.result-footer{padding:12px 0 8px}@media (width>=900px){.answers{grid-template-columns:repeat(5,1fr)}.answer,.answer.yes,.answer.no{order:0;grid-column:auto;font-size:15px}.screen[data-screen=result]{grid-template-rows:minmax(55vh,1fr) auto auto}.result-panel{justify-self:center;width:min(100%,860px);padding:20px 24px}.legend li{grid-template-columns:34px 1fr auto;gap:10px;font-size:15px}.legend .chip{width:36px;height:36px;font-size:20px}.legend .pct{font-size:14px}.result-title{font-size:36px}}@media (width>=1280px){.screen[data-screen=result]{grid-template-rows:minmax(0,1fr) auto;grid-template-columns:1fr clamp(680px,46vw,860px);align-items:center;column-gap:24px;padding:64px 24px 0}.screen[data-screen=result] .slot{align-self:stretch;max-height:calc(100dvh - 48px);position:sticky;top:24px}.result-panel{justify-self:stretch;width:auto}.result-footer{grid-column:1/-1}}@media (prefers-reduced-motion:reduce){.flash.on,.result-panel{animation:none}}