:root{font-family:Inter,ui-rounded,Noto Sans,system-ui,sans-serif;color:#234b3d;--deep:#4e8354}*{box-sizing:border-box}html,body{margin:0;min-height:100%;overflow-x:hidden}button,select{font:inherit}button{cursor:pointer}.hero{display:grid;grid-template-columns:minmax(260px,470px) 1fr;gap:clamp(28px,6vw,70px);align-items:center}.hero>img{width:100%;border-radius:32px;box-shadow:0 22px 60px #466a3b2b}.eyebrow{margin:0;color:#4e8354;font-size:.75rem;font-weight:900;letter-spacing:.14em}.hero h1{font-size:clamp(2.7rem,7vw,5rem);line-height:.94;letter-spacing:-.05em;margin:.15em 0}.hero p{line-height:1.55}.primary{border:0;border-radius:15px;padding:14px 24px;background:linear-gradient(135deg,#5a9d60,#3f754a);color:#fff;font-weight:900;box-shadow:0 8px 20px #416d4633}.hero details{margin-top:16px;border-top:1px solid #b4cfaa;padding-top:10px}.hero summary{font-weight:900}.battle-content{min-height:0;display:grid;grid-template-rows:minmax(0,1fr) 50px 30px;gap:8px;place-items:center;padding:10px 16px}.board{width:min(88vw,calc(100svh - 245px),560px);aspect-ratio:1;display:grid;grid-template-columns:repeat(6,1fr);gap:5px;padding:7px;border-radius:23px;background:#b8d8b5;box-shadow:0 14px 35px #436d4227}.cell{position:relative;min-width:0;border:0;border-radius:9px;background:#f3f4d9;box-shadow:inset 0 -3px #c0d7b4}.cell.source{background:#f6c13f}.cell.goal{background:#a8dba8}.cell.mirror{background:#edf4d8}.cell.mirror:after{content:"";position:absolute;inset:14%;background:linear-gradient(45deg,transparent 44%,#6f9cbd 45% 55%,transparent 56%);transition:transform .16s ease}.cell.beam{box-shadow:inset 0 0 0 4px #f4ca45,0 0 10px #f7ce4c}.cell.hit{animation:glow .8s infinite}.tools{display:flex;gap:8px}.tools button,dialog button{min-height:44px;border:1px solid #b2c99d;border-radius:12px;background:#fbfff0;color:#234b3d;padding:9px 15px;font-weight:850}.status{margin:0;text-align:center;font-weight:850;font-size:.83rem}dialog{width:min(430px,calc(100% - 28px));border:0;border-radius:25px;text-align:center;padding:28px;color:#234b3d;background:#fbfff0;box-shadow:0 28px 80px #304b3377}dialog::backdrop{background:#203d26aa;backdrop-filter:blur(4px)}.result-mark{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;margin:auto;background:#f2bd3f;color:#fff;font-size:2rem;font-weight:950}dialog h2{margin:.2rem 0}dialog>div:last-child{display:flex;justify-content:center;gap:9px;margin-top:18px}dialog .primary{background:#4f8654;color:#fff}@keyframes glow{50%{filter:brightness(1.25)}}@media(max-width:680px){.hero{grid-template-columns:1fr;text-align:center;gap:18px}.hero>img{width:min(70vw,320px);justify-self:center}.hero h1{font-size:clamp(2.5rem,13vw,4rem)}}@media(max-height:500px)and (orientation:landscape){.battle-content{grid-template-columns:minmax(260px,330px) 180px;grid-template-rows:1fr 30px;justify-content:center;gap:8px 18px;padding:6px}.board{grid-column:1;grid-row:1/3;width:min(300px,calc(100svh - 70px))}.tools{grid-column:2;grid-row:1;display:grid;width:100%;align-self:center}.status{grid-column:2;grid-row:2}}.ad-reserve{width:min(100%,920px);height:var(--wp-ad-reserve-height, 0px);margin:auto;background:#17243a}.cell{background:transparent;box-shadow:none}.cell.source{background:transparent url(../../assets/animal-sunbeam-garden-source-block-v14.webp) center/contain no-repeat}.cell.goal{background:transparent url(../../assets/animal-sunbeam-garden-flower-block-v14.webp) center/contain no-repeat}.cell.goal.hit{background-image:url(../../assets/animal-sunbeam-garden-flower-hit-block-v14.webp)}.cell.mirror{background:transparent}.cell.mirror:after{inset:2%;background:url(../../assets/animal-sunbeam-garden-mirror-block-v14.webp) center/contain no-repeat;filter:drop-shadow(0 3px 2px #25463444)}.board{background-image:none}.cell,.cell.mirror{background-color:transparent;background-image:url(../../assets/animal-sunbeam-garden-cell-block-v14.webp);background-position:center;background-repeat:no-repeat;background-size:100% 100%}@media(max-height:500px)and (orientation:landscape){body #battle .board{width:min(264px,calc(100svh - 126px))}}.cell.gate{z-index:4;isolation:isolate;background:transparent}.cell.gate:before{content:"";position:absolute;z-index:2;inset:13%;background:linear-gradient(145deg,#e1f3a5 0 24%,#9dc86c 24% 62%,#5f914c 62%);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);filter:drop-shadow(0 3px 2px #25463466);transition:filter .28s ease,transform .28s cubic-bezier(.2,.85,.25,1.15)}.cell.gate:after{content:"";position:absolute;z-index:3;left:18%;right:18%;top:41%;height:18%;border-radius:2px;background:linear-gradient(180deg,#fff8b3,#f5ca45 42%,#a87332 76%,#fff2a0);box-shadow:0 0 6px #fff2a077;transition:transform .28s cubic-bezier(.2,.85,.25,1.15),opacity .28s ease}.cell.gate[data-open=true]:after{transform:scaleY(.2);opacity:.62}.cell.gate.turning[data-open=false]:after{transform:scaleY(.2);opacity:.62}.cell.gate.turning[data-open=true]:after{transform:scaleY(1.45);opacity:1}dialog[open]{animation:sunbeamDialogIn .28s cubic-bezier(.2,.8,.25,1) both}dialog[open]::backdrop{animation:sunbeamBackdropIn .24s ease-out both}#result[open] .result-character{transform-origin:50% 85%;animation:sunbeamCharacterIn .48s cubic-bezier(.16,1.25,.32,1) both}@keyframes sunbeamDialogIn{0%{opacity:0;transform:translateY(11px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes sunbeamBackdropIn{0%{opacity:0}to{opacity:1}}@keyframes sunbeamCharacterIn{0%{opacity:0;transform:translateY(10px) scale(.72)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){dialog[open],dialog[open]::backdrop,#result[open] .result-character{animation:none!important}.cell.gate:before,.cell.gate:after,.cell.mirror:after,.beam-layer{transition:none!important}}#battle .cell{transition:filter .16s ease,box-shadow .16s ease}#battle .cell[data-lit=true]{filter:brightness(1.15);box-shadow:inset 0 0 0 2px #ffe89b66}#battle .cell.mirror[data-rot]:after{transform:rotate(var(--mirror-angle,0deg));transition:transform .18s cubic-bezier(.2,.8,.25,1),filter .16s ease}#battle .cell.mirror[data-lit=true]:after{filter:drop-shadow(0 0 4px #fff0a1)}#battle .cell.bloom{z-index:4}#battle .bloom-art{position:absolute;inset:10%;display:block;pointer-events:none;background:url(../../assets/animal-sunbeam-garden-flower-block-v14.webp) center/contain no-repeat;transition:filter .18s ease,opacity .18s ease}#battle .cell.bloom[data-awake=false] .bloom-art{filter:saturate(.45) brightness(.78)}#battle .cell.bloom[data-awake=true] .bloom-art{background-image:url(../../assets/animal-sunbeam-garden-flower-hit-block-v14.webp);filter:drop-shadow(0 0 4px #e9ff9a)}#battle .cell.bloom[data-awake=true]{box-shadow:inset 0 0 0 2px #bdf58688}#battle .cell.bloom:after{content:"";position:absolute;inset-inline-end:5%;bottom:5%;width:14%;height:14%;background:#6d9b65;box-shadow:inset -2px -2px #385a3d}#battle .cell.bloom[data-awake=true]:after{background:#ffe46b;box-shadow:inset -2px -2px #9b7b33,0 0 5px #ffef9b}#battle .beam-glow{stroke:var(--beam-color,#ffe565);stroke-width:10;opacity:.36;filter:none}#battle .beam-core{stroke:#fffce1;stroke-width:3.5;filter:none}#battle .beam-layer g[data-source="1"] .beam-core{stroke:#e5fff6}#battle .beam-tip{fill:var(--beam-color,#ffe565);opacity:.7;pointer-events:none}#battle .beam-tip[data-stop=edge],#battle .beam-tip[data-stop=loop]{fill:#ffa678}#battle .beam-tip[data-stop=lotus]{fill:#caff9e}#battle .board{transition:box-shadow .28s ease;box-shadow:0 10px 28px #173a2d66,inset 0 0 0 2px #d4dc82,0 0 calc(var(--garden-charge,0)*26px) #f1dc77a6}#battle .board.solved .beam-core,#battle .cell.hit{animation:none}#battle .board .cell.goal.hit:before{animation:sunbeamLotusAwake .52s cubic-bezier(.2,.8,.25,1) both}#battle .light-spark{position:absolute;z-index:9;display:block;width:6px;height:6px;background:#ffe985;box-shadow:inset -2px -2px #c78a39;pointer-events:none}#battle .cell-flash{position:absolute;z-index:10;inset:5%;border:3px solid #fff3a4;box-shadow:inset 0 0 8px #ffe58288;pointer-events:none;clip-path:polygon(0 12%,12% 12%,12% 0,88% 0,88% 12%,100% 12%,100% 88%,88% 88%,88% 100%,12% 100%,12% 88%,0 88%)}#battle #status{height:2.8em;min-height:2.8em;font-size:13px;line-height:1.4;margin:8px 0;min-width:0;width:100%;overflow:hidden}#battle .objective-line,#battle .feedback-line{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4}#battle .objective-line{font-weight:950;color:#375b32;font-variant-numeric:tabular-nums}#battle .feedback-line{font-weight:750;color:#234b3d}#battle .tools button{transition:filter .14s ease,background-color .14s ease}@keyframes sunbeamLotusAwake{0%{transform:translate(11.5%) scale(.75);filter:brightness(1.6)}45%{transform:translate(11.5%) scale(1.15);filter:brightness(1.2)}to{transform:translate(11.5%) scale(1);filter:brightness(1)}}@media(prefers-reduced-motion:reduce){#battle .board .cell.goal.hit:before{animation:none}#battle .cell,#battle .board,#battle .bloom-art,#battle .cell.mirror[data-rot]:after{transition:none}}.battle-content{position:relative;isolation:isolate;display:grid;grid-template-columns:1fr;grid-template-rows:1fr;place-items:center;padding:12px 16px;overflow:hidden}.battle-content:before{content:"";position:absolute;z-index:-2;inset:0;background:linear-gradient(#12392caf,#12392caf),url(../../assets/animal-sunbeam-garden-scenery-block-v14.webp) center 42%/cover no-repeat;filter:saturate(.82)}.battle-content:after{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(circle at 50% 38%,#f9ed9270,transparent 36%),linear-gradient(180deg,transparent 60%,#08261ee0)}.garden-panel{width:min(100%,680px);display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;gap:9px;padding:14px;border:1px solid #f5df85aa;border-radius:28px;background:linear-gradient(155deg,#faffefed,#d8e9bde8);box-shadow:0 18px 50px #071b16aa,inset 0 1px #fff}.board{position:relative;width:min(calc(100vw - 62px),calc(100svh - 320px),570px);min-width:250px;isolation:isolate;overflow:hidden;border:6px solid #5b843f;border-radius:24px;background:#244f3b;box-shadow:0 10px 28px #173a2d66,inset 0 0 0 2px #d4dc82}.cell{z-index:1;border-radius:4px}.cell.beam{box-shadow:inset 0 0 0 2px #fff4a933;filter:brightness(1.05)}.cell.source,.cell.goal,.cell.mirror{z-index:4}.cell.goal{background-image:none}.cell.goal:before{content:"";position:absolute;inset:0;background:url(../../assets/animal-sunbeam-garden-flower-block-v14.webp) center/contain no-repeat;transform:translateY(-3.5%);pointer-events:none}.cell.goal.hit:before{background-image:url(../../assets/animal-sunbeam-garden-flower-hit-block-v14.webp);transform:translate(11.5%)}.cell.mirror:after{transition:transform .3s cubic-bezier(.2,.85,.25,1.25),filter .3s ease;transform-origin:center}.cell.mirror[data-rot="1"]:after{transform:rotate(90deg)}.cell.mirror.turning[data-rot="0"]:after{transform:rotate(90deg) scale(1.08);filter:drop-shadow(0 0 7px #fff7b8)}.cell.mirror.turning[data-rot="1"]:after{transform:rotate(180deg) scale(1.08);filter:drop-shadow(0 0 7px #fff7b8)}.board.is-turning .beam-layer{opacity:1;filter:none}.beam-layer{position:absolute;z-index:5;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;transition:opacity .2s ease}.beam-layer polyline{fill:none;stroke-linecap:round;stroke-linejoin:round}.beam-glow{stroke:#ffd83d;stroke-width:16;opacity:.55;filter:drop-shadow(0 0 7px #fff199)}.beam-core{stroke:#fff8b8;stroke-width:5;filter:drop-shadow(0 0 3px #fff)}.board.solved .beam-core{stroke:#fffef0;animation:beamPulse .75s ease-in-out infinite alternate}.garden-panel #status{min-height:22px;margin:0;color:#234b3d;font-size:.86rem;font-weight:900}.tools{width:min(100%,420px);display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.tools button{min-height:46px;border:1px solid #789e64;border-radius:13px;background:#fffef0;color:#284d3a;font-weight:900;box-shadow:0 4px 10px #31523a22}.tools button:active{transform:translateY(1px)}dialog>div:last-child{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}dialog>div:last-child button{min-width:0;padding-inline:8px}dialog button:disabled{opacity:.45;cursor:not-allowed}body[data-screen=battle] dialog{inset-block-end:56px;max-height:calc(100svh - 72px);overflow-y:auto}@keyframes beamPulse{to{stroke-width:7;filter:drop-shadow(0 0 7px #fff)}}@media(max-width:680px){.garden-panel{padding:10px;border-radius:22px}.board{width:min(calc(100vw - 44px),calc(100svh - 270px),570px)}}@media(max-height:500px)and (orientation:landscape){.battle-content{grid-template-columns:1fr;grid-template-rows:1fr;justify-content:stretch;padding:6px 10px}.garden-panel{place-self:center;width:min(720px,100%);grid-template-columns:minmax(260px,1fr) 210px;grid-template-rows:1fr auto;gap:8px 14px;padding:8px 12px}body #battle .board{grid-column:1;grid-row:1/3;width:min(308px,calc(100svh - 82px));min-width:0;padding:4px;gap:4px}.garden-panel #status{grid-column:2;grid-row:1;align-self:end}.tools{grid-column:2;grid-row:2;width:100%}}.tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.tools button{min-width:0}#status{height:2.8em;line-height:1.4;overflow:hidden;margin:8px 0}.cell.source:after{content:attr(data-direction);position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:clamp(18px,3vw,30px);font-weight:900;text-shadow:0 2px 3px #263915;pointer-events:none}.cell.hint-target{outline:3px solid #fff5aa;outline-offset:-3px;box-shadow:inset 0 0 12px #fbe85c,0 0 10px #ffd847}
