@import url('../farm/style.css');
:root{background:#f8f3e7;color:#665674}.brand-mark{background:#e8d9ee}.brand-mark svg{width:34px;height:34px}.brand small{color:#a18aaa;font-size:9px;letter-spacing:1.4px}.brand h1{color:#725d84}.shadows-world{background:radial-gradient(ellipse at 50% 12%,#fff3dc,#ede8f0 65%,#e1e8dc);border-color:#d9cfe0}.shadows-order{min-width:0;padding:12px 14px 13px 18px;border-color:#d5c3df;border-bottom-color:#af97c4;box-shadow:0 5px 20px #76608a15}.shadows-order .order-content{gap:15px}.order-shadow{width:43px;height:43px}#question{margin:0;color:#725982;font:500 20px/1.5 Mitr,sans-serif;outline:none}.listen{width:51px;height:51px;background:#9872ba;color:#fffef2;border:3px solid #fffdf3;outline:2px solid #725294;box-shadow:0 4px #725294}.listen:hover{background:#835ca6}.round-progress{top:29px}.bottom-note{left:24px;bottom:25px;min-height:58px;padding:9px 16px;border:2px solid #d7c8df;border-bottom:4px solid #b6a3c3;max-width:60%;gap:12px}.bottom-note>.icon{color:#8e74a7;width:26px;height:29px}.bottom-note p{font-size:12px;color:#806b8b}.bottom-note.success{background:#ecf6d9;border-color:#89b177}.bottom-note.success p{color:#407446}.shadows-world .hint-button{top:auto;position:absolute;right:28px;bottom:29px;z-index:5;display:grid;place-items:center;width:62px;height:62px;background:#efbd61;color:#795728;border:3px solid #fff9df;border-radius:21px;outline:2px solid #ad7e37;box-shadow:0 5px #a97d40;cursor:pointer;touch-action:manipulation}.hint-button .icon{width:31px;height:31px}.hint-button:hover{background:#f5cd7b}.hint-button:disabled{opacity:.45;cursor:default}.hint-button:focus-visible{outline:4px solid #1d639b;outline-offset:5px}.feedback-wrong .shadows-order{border-color:#d8a76b}.dialog-mark{display:grid;place-items:center;width:90px;height:84px;margin:0 auto 12px;border-radius:27px;background:#eee0f1}.dialog-mark svg{width:72px;height:65px}.shadow-demo{display:flex;gap:20px;align-items:center;justify-content:center;margin:20px auto}.shadow-demo svg{width:86px;height:86px}.shadow-demo .demo-arrow{width:28px;height:28px;color:#aa94b6}.shadow-demo span{padding:10px;border:3px solid #d1bddb;border-radius:20px;background:#fff7e7}.demo-silhouette{filter:brightness(0);opacity:.68}.primary{background:#9271ad;border-color:#70518b;box-shadow:0 4px #65467f}.primary:hover{background:#7d5b9a}.primary .icon{width:23px;height:23px;margin-left:7px;vertical-align:middle}.tap-help{font-size:12px;line-height:1.8;color:#8f7b9b}.motion-setting input{accent-color:#9271ad}.close{background:#e7d9ee;color:#806196}.fallback-shadows{position:absolute;inset:21% 4% 16%;display:grid;grid-template-rows:minmax(140px,1fr) auto;justify-items:center;gap:35px}.fallback-target{display:grid;place-items:center;width:min(320px,55%);height:100%;max-height:330px;background:#fff7e5;border:10px solid #b296cc;outline:3px solid #fffdf1;border-radius:32px;box-shadow:0 8px #9176ac;cursor:pointer}.fallback-target svg{width:80%;height:80%}.fallback-target.silhouette svg{filter:brightness(0);opacity:.68}.fallback-target.hinted{outline:5px solid #eab743;outline-offset:5px}.fallback-choices{width:100%;display:flex;justify-content:center;gap:35px}.fallback-choices button{display:grid;place-items:center;width:25%;max-width:170px;aspect-ratio:1;background:#fff0ce;border:5px solid #fffdf0;outline:4px solid #c5994e;border-radius:30px;box-shadow:0 7px #bb934d;cursor:pointer;touch-action:manipulation}.fallback-choices button:nth-child(2){background:#daefea;outline-color:#579e94;box-shadow:0 7px #579e94}.fallback-choices button:nth-child(3){background:#efdfef;outline-color:#a37bad;box-shadow:0 7px #a37bad}.fallback-choices svg{width:75%;height:75%}.fallback-choices button.wrong{outline-color:#d57f67;background:#f8e0ce}.fallback-shadows button:focus-visible{outline:4px solid #2a689d;outline-offset:5px}.fallback-shadows button:disabled{cursor:default}.shadow-controls button[data-kind="choice"]{touch-action:none;-webkit-user-select:none;user-select:none}
@media(max-width:900px){.brand h1{font-size:14px}.brand small{font-size:8px}.shadows-order{top:18px}.bottom-note{left:20px}.round-progress{left:20px}.fallback-choices{gap:27px}}
@media(max-width:600px){.brand h1{font-size:10px}.brand small{font-size:6px;letter-spacing:.7px}.shadows-order{top:15px;padding:9px 11px}.shadows-order .order-content{gap:9px}.order-shadow{width:29px;height:32px}#question{font-size:15px}.listen{width:43px;height:43px}.round-progress{top:106px;left:17px;flex-direction:row;gap:9px;align-items:center}#progress{display:flex;gap:3px}.progress-star{width:17px;height:17px}.bottom-note{left:15px;bottom:22px;min-height:50px;padding:8px 11px;gap:7px;max-width:72%}.bottom-note p{font-size:10px}.bottom-note>.icon{width:23px}.shadows-world .hint-button{right:20px;bottom:27px;width:48px;height:49px;border-radius:17px}.hint-button .icon{width:26px;height:26px}.fallback-shadows{inset:28% 4% 18%;gap:35px}.fallback-target{border-width:7px}.fallback-choices{gap:18px}.fallback-choices button{border-width:3px;border-radius:19px}.shadow-demo{gap:12px}.shadow-demo svg{width:70px;height:70px}}
@media(max-height:650px) and (min-width:601px){.shadows-order{top:10px;padding-block:6px}#question{font-size:17px}.order-shadow{width:35px;height:36px}.listen{width:44px;height:44px}.round-progress{top:20px}.bottom-note{bottom:16px}.shadows-world .hint-button{bottom:20px;width:53px;height:53px}}