.gx-stroop{width:100%;max-width:680px;margin:20px auto;color:#273e4d;font-family:system-ui,-apple-system,"Noto Sans JP",sans-serif}.gx-stroop *{box-sizing:border-box}.gx-stroop [hidden],.st-shell [hidden]{display:none!important}.st-shell{display:grid;grid-template-areas:"head" "hud" "progress" "stage" "choices" "tools" "foot";gap:6px;padding:8px;border:2px solid #9d7944;border-radius:18px;background:linear-gradient(145deg,#f7e9c7,#e4cf9c 65%,#d1b276);box-shadow:0 10px 30px #1c2e4033;isolation:isolate}.st-head{grid-area:head;display:flex;align-items:center;justify-content:space-between;gap:5px;min-width:0}.st-brand small{display:block;font-size:8px;letter-spacing:2px;color:#6d573a;font-weight:900}.st-brand strong{display:block;white-space:nowrap;font-size:clamp(16px,4.1vw,24px);font-weight:950;letter-spacing:-.6px;text-shadow:0 1px #fff5d7}.st-head-tools{display:flex;gap:4px}.st-shell button,.st-shell select{font-family:inherit;font-size:13px;font-weight:800;line-height:1.25;color:#263d4d;border:1px solid #937647;background:#fff2d1;border-radius:10px;cursor:pointer;min-height:44px;touch-action:manipulation}.st-shell button{padding:8px 10px;box-shadow:0 3px 0 #664f2a4d}.st-head-tools button{min-width:44px;padding:6px 4px;font:800 11px/1.2 system-ui}.st-shell button:hover:not(:disabled){background:#fff9e9}.st-shell button:focus-visible,.st-shell select:focus-visible{outline:3px solid #9a3f43;outline-offset:2px}.st-shell button:disabled{cursor:default;opacity:.48;box-shadow:none}.st-primary{background:#973a48!important;color:#fff5d9!important;border-color:#702836!important}.st-hud{grid-area:hud;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:5px}.st-hud>div{padding:5px 8px;border:1px solid #b09b70;border-radius:9px;background:#fff2d1}.st-hud span,.st-stats span{display:block;font-size:10px;font-weight:800;color:#6b604c}.st-hud strong{display:block;font-size:20px;line-height:1.15;font-weight:950;color:#213748}.st-progress{grid-area:progress;display:flex;justify-content:space-between;gap:5px;font-size:11px;line-height:20px}.st-progress .is-low{color:#982737;font-weight:900}.st-arena{grid-area:stage;position:relative;min-width:0;min-height:0;height:clamp(300px,80vw,350px);border-radius:13px;overflow:hidden;border:1px solid #876c3e;background:#162a3a}.st-canvas{display:block;width:100%;height:100%;touch-action:none}.st-question{position:absolute;inset:30px 24px 84px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;pointer-events:none;text-align:center}.st-cue{display:block;padding:6px 16px;border:1px solid #f1d194;border-radius:7px;background:#e4bd74;color:#202f40;font-size:17px;line-height:1.2;font-weight:950}.st-cue[data-cue=word]{background:#c6d9ef;border-color:#e0efff}.st-word{display:block;font:950 clamp(65px,18vw,100px)/1.15 system-ui;text-shadow:0 3px 0 #0008}.st-feedback{display:block;font-size:clamp(11px,3.3vw,15px);line-height:1.4;font-weight:800;color:#f4e7c7;min-height:20px}.st-feedback.is-wrong{color:#ffd0cb}.st-panel{position:absolute;inset:6px;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:10px;border-radius:12px;border:1px solid #aa8550;background:#fbefce;box-shadow:0 6px 20px #0c233d55;text-align:center;overflow:auto}.st-panel-bar{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;flex-shrink:0}.gx-stroop .st-panel h2{margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;font-family:inherit!important;font-size:clamp(17px,4.6vw,23px)!important;font-weight:950;line-height:1.2!important;letter-spacing:0!important;flex:1;color:#263d4d}.gx-stroop .st-panel h2::before,.gx-stroop .st-panel h2::after{display:none!important}.st-back{width:44px;min-width:44px;height:44px;flex:none;font-size:11px!important;padding:5px!important}.st-modes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px}.st-modes button{padding:7px 2px;font-size:12px}.st-modes [aria-pressed=true]{background:#35556b!important;color:#fff4d2!important}.st-level{display:flex;align-items:center;gap:10px;justify-content:space-between;font-size:12px;font-weight:850}.st-level select{flex:1;padding:8px 10px;min-width:0}.st-note{margin:0;font-size:12px;line-height:1.45;color:#635944}.st-choices{grid-area:choices;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.st-choices button{height:51px;display:flex;justify-content:center;align-items:center;gap:12px;font-size:26px;font-weight:950;touch-action:none}.st-choices small{font-size:10px;opacity:.6}.st-mark{width:18px;height:18px;display:block;border:2px solid #532b3a;background:#d83f60;border-radius:50%}.st-mark-1{border-radius:2px;background:#417dc5;border-color:#213f71}.st-mark-2{width:20px;height:20px;border:0;border-radius:0;background:#c8a322;clip-path:polygon(50% 0,100% 100%,0 100%)}.st-mark-3{border-radius:2px;background:#269663;border-color:#165438;transform:rotate(45deg);width:15px;height:15px}.st-choices button.is-correct{opacity:1!important;background:#c7e9ca;border:3px solid #2a7254}.st-choices button.is-wrong{opacity:1!important;background:#ffcecb;border:3px solid #a33143}.st-play-tools{grid-area:tools;display:grid;grid-template-columns:1fr 1fr;gap:6px;min-height:44px}.st-play-tools button{font-size:12px;padding:7px 3px}.st-foot{grid-area:foot;display:flex;justify-content:space-between;gap:6px;min-height:14px;font-size:9px;line-height:14px;color:#645840}.st-status{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none}.st-points strong{display:block;font-size:34px;line-height:1;font-weight:950;color:#973a48}.st-points span{font-size:9px;letter-spacing:3px;font-weight:850}.st-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.st-stats>div{border:1px solid #b59e70;border-radius:7px;padding:5px 3px;background:#fff7e3}.st-stats strong{display:block;font-size:17px;line-height:1.2;color:#263d4d}.st-result-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.st-result-actions button{padding:7px 3px;font-size:12px}.st-supplies{display:grid;grid-template-columns:1fr 1fr;gap:7px}.st-supplies button{min-height:54px;padding:5px}.st-supplies strong,.st-supplies span{display:block}.st-supplies span{font-size:10px;margin-top:3px}.st-portal{position:fixed!important;inset:0!important;width:auto!important;max-width:none!important;margin:0!important;z-index:2147483600!important;padding:0!important}.st-expanded,.st-shell:fullscreen{width:100%;max-width:none;height:100dvh;height:100svh;border-radius:0;border:0;padding:max(6px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));grid-template-rows:auto auto auto minmax(0,1fr) auto auto auto}.st-expanded .st-arena,.st-shell:fullscreen .st-arena{height:auto}.st-shell:fullscreen::backdrop{background:#182a3b}@media(max-width:340px){.st-shell{padding:6px}.st-brand strong{font-size:16px}.st-head-tools{gap:3px}.st-note{font-size:11px}.st-panel{padding:8px;gap:6px}.st-modes button{font-size:11px}.st-hud strong{font-size:18px}.st-hud>div{padding:4px 7px}.st-foot{font-size:8px}.st-progress{font-size:10px}.st-play-tools button{font-size:11px}}@media(max-height:650px){.st-expanded .st-question,.st-shell:fullscreen .st-question{inset:26px 23px 76px;gap:2px}.st-expanded .st-word,.st-shell:fullscreen .st-word{font-size:46px}.st-expanded .st-cue,.st-shell:fullscreen .st-cue{font-size:14px;padding:4px 12px}.st-expanded .st-feedback,.st-shell:fullscreen .st-feedback{font-size:11px}.st-expanded .st-hud strong,.st-shell:fullscreen .st-hud strong{font-size:18px}.st-expanded .st-hud>div,.st-shell:fullscreen .st-hud>div{padding:3px 7px}.st-expanded .st-choices button,.st-shell:fullscreen .st-choices button{height:44px}.st-expanded,.st-shell:fullscreen{gap:5px}}@media(max-height:480px) and (min-width:500px){.st-expanded,.st-shell:fullscreen{grid-template-columns:minmax(230px,.85fr) minmax(260px,1fr);grid-template-areas:"head stage" "hud stage" "progress stage" "choices stage" "tools stage" "foot stage";grid-template-rows:44px 36px 18px minmax(88px,1fr) 44px 12px;gap:5px}.st-expanded .st-brand,.st-shell:fullscreen .st-brand{display:none}.st-expanded .st-head,.st-shell:fullscreen .st-head{justify-content:center}.st-expanded .st-head-tools,.st-shell:fullscreen .st-head-tools{gap:6px}.st-expanded .st-progress,.st-shell:fullscreen .st-progress{font-size:10px}.st-expanded .st-panel,.st-shell:fullscreen .st-panel{padding:7px;gap:5px}.gx-stroop .st-expanded .st-panel h2,.gx-stroop .st-shell:fullscreen .st-panel h2{font-size:17px!important}.st-expanded .st-points strong,.st-shell:fullscreen .st-points strong{font-size:28px}.st-expanded .st-stats>div,.st-shell:fullscreen .st-stats>div{padding:3px}.st-expanded .st-stats strong,.st-shell:fullscreen .st-stats strong{font-size:15px}.st-expanded .st-note,.st-shell:fullscreen .st-note{font-size:11px}.st-expanded .st-modes button,.st-shell:fullscreen .st-modes button{font-size:11px}.st-expanded .st-question,.st-shell:fullscreen .st-question{gap:6px}.st-expanded .st-word,.st-shell:fullscreen .st-word{font-size:70px}.st-expanded .st-foot,.st-shell:fullscreen .st-foot{font-size:8px;line-height:12px}}@media(prefers-reduced-motion:reduce){.gx-stroop *{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
