@import url('../memory/style.css');
:root{background:#f8f3e7;color:#526e65}.brand-mark{background:#f8e3c4}.brand h1{color:#607a65}.brand small{color:#a18d6d}
.path-world{display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 15%,#f8f8dc,#dcead5 72%,#c8dec9);border-color:#bfd4bf}
.garden-view{position:relative;flex:1;min-height:0}.path-order{min-width:0;top:13px;border-color:#d4c092;border-bottom-color:#b7a373;padding:8px 12px 10px 15px}.path-order .order-content{gap:12px}.order-house{width:39px;height:40px}#question{font-size:18px;color:#627c62}.listen{width:46px;height:46px}.round-progress{top:24px}.progress-star{width:19px;height:19px}
.path-dock{flex-shrink:0;position:relative;display:flex;align-items:center;justify-content:center;gap:32px;margin:0 20px 15px;padding:14px 24px 18px;background:linear-gradient(#fff5dc,#f8e3b9);border:3px solid #fff9e8;border-bottom:7px solid #c49c6b;box-shadow:0 0 0 2px #c6aa7e,0 8px 20px #44684615;border-radius:27px;z-index:2}
#palette{display:grid;grid-template-columns:repeat(3,88px);grid-template-rows:repeat(2,78px);gap:12px 16px}.arrow-choice{display:grid;place-items:center;min-width:72px;min-height:72px;width:88px;height:78px;border:4px solid #fffbea;outline:2px solid #557b6c;border-radius:23px;background:var(--arrow-color);color:#fffdf0;box-shadow:0 6px #557b6c,0 8px 13px #657b6020;touch-action:manipulation;-webkit-user-select:none;user-select:none;cursor:pointer}.arrow-choice[data-direction=up]{grid-column:2;grid-row:1}.arrow-choice[data-direction=left]{grid-column:1;grid-row:2}.arrow-choice[data-direction=down]{grid-column:2;grid-row:2}.arrow-choice[data-direction=right]{grid-column:3;grid-row:2}.arrow-choice svg{width:58px;height:58px}.arrow-choice[aria-disabled=false]:hover{filter:brightness(1.06)}.arrow-choice[aria-disabled=false]:active{transform:translateY(4px);box-shadow:0 2px #557b6c}.arrow-choice[aria-disabled=true]{cursor:default}.arrow-choice:focus-visible,.tool-button:focus-visible{outline:4px solid #226bbb;outline-offset:5px}
.tool-button{display:grid;place-items:center;flex-shrink:0;min-width:52px;min-height:52px;border-radius:17px;background:#f4c75d;color:#795728;border:3px solid #fff7de;outline:2px solid #ad7e37;box-shadow:0 4px #a97d40;touch-action:manipulation}.tool-button .icon{width:29px;height:29px}.dock-footer{display:flex;flex-direction:column;align-items:center;gap:12px;max-width:180px}.path-feedback{font-size:14px;line-height:1.8;color:#79613e;text-align:center;margin:0}.path-feedback.success{color:#346d4e}
.path-demo{display:flex;justify-content:center;align-items:center;gap:9px;margin:22px 0;color:#61aaa3}.path-demo svg{width:58px;height:58px}.path-demo span{font-size:55px}.dialog-mark{background:#f7e8c8}.primary{background:#3e9a82;border-color:#267761;box-shadow:0 4px #296b58}.primary:hover{background:#31856f}
.fallback-path{position:absolute;top:90px;bottom:22px;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:repeat(var(--size),1fr);gap:10px;aspect-ratio:1;max-width:85%;padding:16px;background:#c5d8a4;border:6px solid #e3bb78;border-radius:25px}.fallback-path span{display:grid;place-items:center;min-width:0;font-size:clamp(24px,4vw,52px);border-radius:18px}.path-cell{background:#fff3c9;box-shadow:0 4px #c6bb8b}.path-cell.goal{outline:4px solid #edaf72}.fallback-path .blocked{background:#90b978}
@media(orientation:portrait){.path-dock{margin:0 21px 20px;padding:20px 22px 24px;gap:36px}#palette{grid-template-columns:repeat(3,96px);grid-template-rows:repeat(2,88px);gap:14px 18px}.arrow-choice{width:96px;height:88px}.arrow-choice svg{width:64px;height:64px}}
@media(max-width:900px){.brand h1{font-size:14px}.brand small{font-size:8px}.path-order{top:13px}#question{font-size:17px}.round-progress{left:19px}}
@media(max-width:600px){body{min-height:650px}.brand h1{font-size:11px}.brand small{font-size:6px}.path-order{top:11px;padding:7px 9px}.order-house{width:29px;height:31px}.path-order .order-content{gap:8px}#question{font-size:13px}.listen{width:38px;height:38px}.round-progress{top:80px;left:15px;gap:5px}.progress-star{width:13px;height:13px}#progress{display:flex;gap:2px}.path-dock{margin:0 10px 13px;padding:12px 10px 16px;gap:14px;border-radius:23px}#palette{grid-template-columns:repeat(3,62px);grid-template-rows:repeat(2,60px);gap:10px}.arrow-choice{min-width:60px;min-height:60px;width:62px;height:60px;border-width:3px;border-radius:18px}.arrow-choice svg{width:46px;height:46px}.dock-footer{max-width:90px;gap:10px}.path-feedback{font-size:11px}.tool-button{min-width:46px;min-height:46px}.fallback-path{top:130px;padding:10px;gap:7px}}
@media(max-height:700px) and (min-width:601px){.path-dock{padding-block:10px 14px;margin-bottom:12px}#palette{grid-template-rows:repeat(2,62px);gap:10px 15px}.arrow-choice{height:62px;min-height:62px}.arrow-choice svg{width:49px;height:49px}.path-feedback{font-size:12px}.order-house{width:30px;height:30px}#question{font-size:15px}.listen{width:37px;height:37px}}