:root{--ink:#214a42;--muted:#657873;--paper:#fffdf7;--green:#4f9b79;--coral:#e57560;--gold:#e7b04d;--blue:#5f98b5;--violet:#7d70a4;--shadow:0 18px 48px rgba(48,70,52,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;overflow-x:hidden;color:var(--ink);font-family:"Trebuchet MS","Segoe UI",sans-serif;background:radial-gradient(circle at 12% 3%,#fff7d9 0 11%,transparent 28%),linear-gradient(135deg,#f5f0df,#e8f1dd)}button,a{font:inherit}.app{width:min(1120px,calc(100% - 32px));margin:24px auto 38px}.game-bar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px;padding:12px 18px;border:1px solid rgba(69,96,74,.18);border-radius:24px;background:rgba(255,253,247,.92);box-shadow:0 10px 28px rgba(49,73,55,.08)}.game-brand{display:flex;align-items:center;gap:12px;min-width:0;padding:3px 8px 3px 3px;border-radius:16px;color:var(--ink);text-decoration:none}.game-brand:hover{background:#eef4e4}.game-brand:focus-visible{outline:4px solid rgba(232,177,77,.6);outline-offset:3px}.game-brand>span:last-child{display:grid;gap:2px}.game-brand strong{font-size:20px;line-height:1.1}.game-brand small{color:var(--muted);font-weight:700}.game-icon{display:grid;place-items:center;width:54px;height:54px;flex:0 0 54px;border-radius:17px;background:#e8edf1}.game-icon svg{width:46px;height:46px}.leaf-a{fill:#5f98b5}.leaf-b{fill:#e27b62}.leaf-line{fill:none;stroke:#fff5d6;stroke-width:2;stroke-linecap:round}.warm-dot{fill:#edb54d}.age-pill,.facts span,.counter,.task-head>span,.panel-head>span{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;border:1px solid #d9dfc9;border-radius:999px;background:#fffef9;color:#365f55;font-weight:800;white-space:nowrap}.screen{display:none}.screen.is-active{display:block}.hero,.panel,.play-card,.result{overflow:hidden;border:1px solid rgba(83,108,76,.18);border-radius:34px;background:rgba(255,253,247,.97);box-shadow:var(--shadow)}.hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.94fr)}.hero-art{min-height:520px;background:#dce6cd}.hero-art img{display:block;width:100%;height:100%;object-fit:cover}.hero-copy{align-self:center;padding:54px 48px 190px}.eyebrow{margin:0 0 9px;color:#b35e4c;font-size:13px;font-weight:900;letter-spacing:.12em}.hero h1{margin:0 0 22px;font-size:clamp(38px,4.2vw,60px);line-height:1.03;letter-spacing:-.035em}.hero-copy>p:not(.eyebrow){margin:0 0 22px;color:var(--muted);font-size:20px;line-height:1.55}.facts{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}.primary,.secondary,.hint,.plain,.back{border:0;border-radius:16px;cursor:pointer;font-weight:900;transition:transform .16s,background .16s,box-shadow .16s}.primary{padding:16px 24px;background:var(--green);color:#fff;box-shadow:0 10px 20px rgba(58,127,96,.22)}.primary:hover{transform:translateY(-2px);background:#438c6c}.primary:focus-visible,.secondary:focus-visible,.hint:focus-visible,.plain:focus-visible,.back:focus-visible,.route-card:focus-visible,.hideout:focus-visible,.tabs button:focus-visible{outline:4px solid rgba(232,177,77,.62);outline-offset:3px}.steps{position:absolute;right:28px;bottom:24px;left:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding:0;list-style:none}.steps li{display:flex;align-items:center;gap:12px;min-height:100px;padding:16px 17px;border:1px solid #e3d7b7;border-radius:22px;background:rgba(255,253,247,.95);box-shadow:0 8px 20px rgba(91,75,44,.08)}.steps b{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:13px;background:var(--coral);color:#fff;font-size:21px}.steps span{display:grid;gap:4px}.steps strong{font-size:16px}.steps small{color:var(--muted);line-height:1.25}.panel{padding:34px}.panel-head,.play-head,.task-head{display:flex;align-items:center;justify-content:space-between;gap:18px}.panel-head h2,.play-head h2,.task-head h3{margin:0}.panel-head h2{font-size:38px}.route-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:26px 0}.route-card{display:grid;grid-template-rows:180px auto auto;min-width:0;padding:0;overflow:hidden;border:2px solid transparent;border-radius:26px;background:#f7f4e8;color:var(--ink);text-align:left;cursor:pointer;box-shadow:0 10px 24px rgba(57,77,54,.09);transition:transform .16s,border-color .16s}.route-card:hover{transform:translateY(-4px);border-color:var(--route)}.route-art{position:relative;display:grid;place-items:center;background:linear-gradient(150deg,color-mix(in srgb,var(--route) 28%,#fff),#e7eedf)}.route-art:after{position:absolute;right:11%;bottom:14px;left:11%;height:20px;border-radius:50%;background:rgba(49,70,54,.14);filter:blur(6px);content:""}.route-art img{position:relative;z-index:1;max-width:64%;max-height:148px;object-fit:contain;filter:drop-shadow(0 9px 7px rgba(50,60,45,.18))}.route-copy{display:grid;gap:8px;padding:20px 20px 12px}.route-copy small{color:#a35648;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.route-copy strong{font-size:25px}.route-copy span{color:var(--muted);font-weight:700}.route-foot{align-self:end;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;padding:14px 20px 20px;color:#46695f;font-weight:900}.route-foot i{height:8px;overflow:hidden;border-radius:99px;background:#dfe5d4}.route-foot b{display:block;height:100%;background:var(--route)}.plain{padding:12px 4px;background:transparent;color:#4e7066}.plain:hover{text-decoration:underline}.play-card{padding:26px}.play-head{padding-bottom:14px}.play-head h2{font-size:32px}.back{width:50px;height:50px;flex:0 0 50px;background:#eef2df;color:var(--ink);font-size:25px}.progress{height:10px;margin-bottom:24px;overflow:hidden;border-radius:20px;background:#e4e7d8}.progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--blue),var(--gold),var(--coral));transition:width .25s}.play-layout{display:grid;grid-template-columns:minmax(305px,.72fr) minmax(510px,1.28fr);gap:24px;align-items:start}.clue-side{display:grid;gap:15px}.task-head{align-items:flex-start}.task-head p{margin:0 0 5px;color:#a65d49;font-size:12px;font-weight:900;letter-spacing:.1em}.task-head h3{font-size:27px}.target-card{display:grid;grid-template-columns:108px 1fr;align-items:center;gap:16px;min-height:136px;margin:0;padding:18px;border:2px solid #dfc67c;border-radius:23px;background:#faeec9}.target-card img{width:102px;height:102px;object-fit:contain;filter:drop-shadow(0 7px 6px rgba(58,61,45,.17))}.target-card div{display:grid;gap:5px}.target-card span{color:#9d5b48;font-size:12px;font-weight:900;letter-spacing:.08em}.target-card strong{font-size:24px}.target-card p{margin:0;color:#645f51;line-height:1.35}.legend{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.legend span{display:flex;align-items:center;gap:6px;padding:9px 7px;border-radius:13px;background:#f2f3ea;font-size:12px;font-weight:900}.legend i{width:15px;height:15px;flex:0 0 15px;border-radius:50%}.legend .cold{background:#669ab6}.legend .warm{background:#e1ad4e}.legend .hot{background:#e57560}.feedback{display:grid;gap:4px;min-height:82px;padding:15px 17px;border:1px solid #d6dfc8;border-radius:18px;background:#edf2e5}.feedback strong{font-size:17px}.feedback span{color:var(--muted);line-height:1.35}.feedback[data-tone="error"]{border-color:#efb29d;background:#fff0e8}.feedback[data-tone="success"]{border-color:#a7d1ad;background:#e5f3e7}.feedback[data-tone="hint"]{border-color:#b9bde2;background:#eef0ff}.feedback[data-tone="cold"]{border-color:#a9c7d6;background:#eaf4f8}.feedback[data-tone="warm"]{border-color:#e5c476;background:#fff6d9}.feedback[data-tone="hot"]{border-color:#eca18d;background:#ffebe4}.actions{display:grid;grid-template-columns:minmax(110px,.74fr) minmax(155px,1.26fr);gap:12px}.hint,.secondary{padding:15px 18px;border:1px solid #d8c798;background:#f2ead5;color:#704f2d}.hint:hover,.secondary:hover{background:#eadfbe}.field-side{min-width:0}.hideout-field{position:relative;width:min(100%,640px);margin:0 auto;padding:13px;overflow:hidden;border:9px solid #587766;border-radius:30px;background:#d5e1c4 center/cover no-repeat;box-shadow:inset 0 0 0 2px rgba(255,255,255,.55),0 14px 28px rgba(46,70,52,.17)}.hideout-field:before{position:absolute;inset:0;background:rgba(234,240,211,.67);content:"";pointer-events:none}.hideout-grid{position:relative;z-index:2;display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr));width:100%;aspect-ratio:3/2;border:2px solid rgba(63,93,68,.22);border-radius:18px;background:rgba(235,239,210,.25)}.hideout{position:relative;display:grid;place-items:center;min-width:0;min-height:0;padding:4px;border:0;border-right:1px dashed rgba(62,91,67,.2);border-bottom:1px dashed rgba(62,91,67,.2);background:rgba(255,253,224,.08);cursor:pointer}.hideout:hover{background:rgba(255,244,187,.3)}.hideout.is-selected{background:rgba(255,235,148,.48);box-shadow:inset 0 0 0 4px #e8aa42}.hideout.is-hint-row{box-shadow:inset 0 0 0 3px rgba(123,103,170,.68)}.hideout.is-selected.is-hint-row{box-shadow:inset 0 0 0 4px #e8aa42,0 0 0 3px rgba(123,103,170,.55)}.leaf-pile{position:relative;width:72%;height:58%}.leaf-pile i{position:absolute;width:45%;height:58%;border-radius:85% 15% 78% 22%;background:#73905d;box-shadow:inset 0 -3px rgba(50,91,55,.16);transform:rotate(-26deg)}.leaf-pile i:nth-child(1){left:4%;bottom:0}.leaf-pile i:nth-child(2){right:4%;bottom:0;transform:scaleX(-1) rotate(-26deg)}.leaf-pile i:nth-child(3){left:28%;bottom:8%;background:#829c65;transform:rotate(-42deg)}.leaf-pile i:nth-child(4){left:13%;top:0;background:#8aa16a;transform:rotate(-14deg)}.leaf-pile i:nth-child(5){right:13%;top:0;background:#78945f;transform:scaleX(-1) rotate(-14deg)}.signal-label{position:absolute;right:4px;bottom:4px;left:4px;z-index:3;padding:3px 2px;border-radius:8px;background:rgba(255,255,255,.9);font-size:clamp(8px,1.15vw,13px);line-height:1.1;text-align:center}.hideout.is-cold{background:rgba(86,151,184,.34)}.hideout.is-cold .leaf-pile i{background:#6595ae}.hideout.is-warm{background:rgba(236,188,83,.38)}.hideout.is-warm .leaf-pile i{background:#cfa24c}.hideout.is-hot{background:rgba(232,111,86,.38)}.hideout.is-hot .leaf-pile i{background:#d66f59}.found-card{position:absolute;inset:9%;z-index:5;display:grid;place-items:center;align-content:center;gap:4px;border-radius:30px;background:rgba(255,249,219,.95);box-shadow:0 15px 38px rgba(39,65,45,.24);animation:pop .28s ease}.found-card[hidden]{display:none}.found-card img{width:min(48%,210px);height:min(52%,210px);object-fit:contain;filter:drop-shadow(0 10px 8px rgba(58,59,42,.2))}.found-card strong{font-size:clamp(24px,3.5vw,39px)}.found-card span{color:#ae5949;font-weight:900}@keyframes pop{from{transform:scale(.8);opacity:0}}.field-note{margin:10px 0 0;color:var(--muted);font-size:13px;font-weight:800;text-align:center}.tabs{display:flex;justify-content:center;gap:9px;margin-top:22px}.tabs button{width:42px;height:42px;border:0;border-radius:13px;background:#eef0e2;color:#507067;font-weight:900;cursor:pointer}.tabs button.is-active{background:var(--ink);color:#fff}.tabs button.is-done{background:#dcebd7;color:#2f7259}.result{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;min-height:440px;padding:52px}.result h2{margin:0 0 18px;font-size:48px}.result p:not(.eyebrow){color:var(--muted);font-size:20px;line-height:1.5}.result-stats{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0}.result-stats>*{padding:11px 15px;border-radius:14px;background:#eef2e3}.result-actions{display:flex;flex-wrap:wrap;gap:12px}.result figure{display:grid;place-items:center;min-height:300px;margin:0;border-radius:28px;background:linear-gradient(145deg,#dfe9cf,#f7e5ad)}.result figure img{max-width:72%;max-height:250px;object-fit:contain;filter:drop-shadow(0 12px 10px rgba(48,70,51,.2))}
@media(max-width:900px){.hero{grid-template-columns:.9fr 1.1fr}.hero-art{min-height:470px}.hero-copy{padding:38px 30px 180px}.hero h1{font-size:42px}.play-layout{grid-template-columns:minmax(275px,.72fr) minmax(400px,1.28fr);gap:16px}.play-card{padding:20px}.target-card{grid-template-columns:82px 1fr}.target-card img{width:78px;height:78px}.result{padding:38px}}
@media(max-width:700px){.app{width:min(100% - 18px,1120px);margin-top:10px}.game-bar{padding:9px 10px;border-radius:20px}.game-brand strong{font-size:17px}.game-brand small{font-size:12px}.game-icon{width:46px;height:46px;flex-basis:46px}.age-pill{display:none}.hero{display:block}.hero-art{min-height:0;aspect-ratio:3/2}.hero-copy{padding:28px 22px 24px}.hero h1{font-size:36px}.hero-copy>p:not(.eyebrow){font-size:18px}.steps{position:static;grid-template-columns:1fr;padding:0 18px 20px}.steps li{min-height:78px}.panel,.play-card{border-radius:25px}.panel{padding:22px 16px}.panel-head{align-items:flex-start}.panel-head h2{font-size:31px}.panel-head>span{padding:8px 10px;font-size:12px}.route-grid{grid-template-columns:1fr}.route-card{grid-template-rows:auto auto;grid-template-columns:120px 1fr}.route-art{grid-row:1/3;min-height:170px}.route-art img{max-width:84%}.route-copy{padding:18px 14px 8px}.route-copy strong{font-size:22px}.route-foot{padding:8px 14px 16px}.play-head h2{font-size:25px}.play-head .counter{padding:7px 9px;font-size:12px}.play-layout{grid-template-columns:1fr}.field-side{grid-row:1}.hideout-field{width:min(100%,590px);padding:8px;border-width:7px;border-radius:23px}.task-head h3{font-size:23px}.actions{position:sticky;bottom:8px;z-index:7;padding:8px;border-radius:18px;background:rgba(255,253,247,.95);box-shadow:0 7px 22px rgba(45,66,49,.13)}.result{grid-template-columns:1fr;padding:30px 22px}.result h2{font-size:38px}.result figure{grid-row:1;min-height:230px}}
@media(max-width:420px){.game-brand small{display:none}.game-brand strong{font-size:16px}.hero h1{font-size:32px}.facts span{padding:8px 10px;font-size:13px}.route-card{grid-template-columns:96px 1fr}.route-copy{padding-left:12px}.route-copy strong{font-size:20px}.route-foot{font-size:13px}.play-card{padding:14px 10px}.back{width:42px;height:42px;flex-basis:42px}.play-head{gap:9px}.play-head h2{font-size:21px}.hideout-field{padding:5px;border-width:6px}.hideout-grid{aspect-ratio:1.35}.hideout{padding:1px}.leaf-pile{width:82%;height:61%}.signal-label{right:1px;bottom:1px;left:1px;font-size:8px}.target-card{grid-template-columns:72px 1fr;padding:14px}.target-card img{width:68px;height:68px}.target-card strong{font-size:20px}.legend span{justify-content:center;padding:8px 3px;font-size:10px}.legend i{width:12px;height:12px;flex-basis:12px}.actions{grid-template-columns:1fr 1.25fr}.hint,.primary{padding:13px 9px;font-size:14px}.tabs{gap:6px}.tabs button{width:37px;height:37px}.result-actions{display:grid}.result-actions button{width:100%}}
