*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{width:100%;height:100%;margin:0;overflow:hidden}
body{font-family:"Trebuchet MS",Arial,sans-serif;color:#235567;background:#c9f1f1;display:flex;align-items:center;justify-content:center;overscroll-behavior:none;user-select:none;-webkit-user-select:none}
button{font:inherit;cursor:pointer;border:0;color:inherit;padding:0;touch-action:manipulation;background:none;min-width:0}
button:focus-visible{outline:3px solid #ed9757;outline-offset:3px}
button:disabled{cursor:default;filter:saturate(.45);opacity:.6}
button:active:not(:disabled){transform:translateY(3px) scale(.96)}
img{pointer-events:none;-webkit-user-drag:none;object-fit:contain}
p,h1,h2,h3{margin:0}
.stage{position:fixed;left:50%;top:50%;width:390px;height:694px;transform-origin:center;overflow:hidden;background:var(--art-garden,url('../assets/v4/garden.webp')) center/cover;border-radius:26px;box-shadow:0 18px 65px #2e8c9b30}
.screen{position:absolute;inset:0}
.icon{width:27px;height:27px;object-fit:contain;vertical-align:middle;flex:none}
.round{position:relative;width:47px;height:47px;display:grid;place-items:center;background:var(--art-round,url('../assets/v4/round.webp')) center/100% 100% no-repeat;transition:transform .16s;flex:none}
.round .icon{width:27px;height:27px}
.topbar{position:absolute;top:23px;left:22px;right:22px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.top-actions{display:flex;gap:9px}
.coin-pill{min-width:80px;height:41px;padding:4px 16px 6px 10px;display:flex;align-items:center;justify-content:center;gap:5px;background:var(--art-counter,url('../assets/v4/counter.webp')) center/100% 100% no-repeat;font-size:17px;font-weight:bold;color:#795321}
.coin-pill .icon{width:27px;height:27px}
.art-button{width:100%;min-width:0;height:66px;padding:9px 15px 12px;display:flex;align-items:center;justify-content:center;gap:11px;background:var(--art-button-gold,url('../assets/v4/button-gold.webp')) center/100% 100% no-repeat;font-weight:bold;font-size:20px;color:#684716;transition:transform .16s}
.art-button span{min-width:0;line-height:1.12;overflow-wrap:normal}
.art-button.cream{background-image:var(--art-button-cream,url('../assets/v4/button-cream.webp'));color:#235d69;font-size:16px}
.art-button.teal{background-image:var(--art-button-teal,url('../assets/v4/button-teal.webp'));color:#145c68}
.art-button.small{height:50px;font-size:15px;gap:8px;padding:7px 12px 9px}
.art-button .icon{width:28px;height:28px}
.home-logo{position:absolute;width:322px;height:224px;left:50%;top:84px;transform:translateX(-50%);object-fit:contain}
.home-controls{position:absolute;top:536px;left:42px;right:42px;display:grid;gap:11px}
.home-controls>.art-button{height:73px;font-size:23px}
.home-links{display:grid;grid-template-columns:minmax(0,1fr) 49px;gap:10px;align-items:center}
.home-links .round{width:49px;height:49px}
.page-title{position:absolute;top:91px;left:24px;right:24px;text-align:center}
.tiny-label{font-size:10px;font-weight:bold;letter-spacing:1.8px;text-transform:uppercase;color:#1c6377}
.page-title h1{font-size:31px;color:#fffced;text-shadow:0 2px 0 #237f96,0 4px 0 #237f9630;letter-spacing:-.8px;margin-top:5px}
.page-title p{font-size:13px;color:#205d69;font-weight:bold;margin-top:6px}
.days-panel{position:absolute;top:180px;left:24px;right:24px;height:441px;background:var(--art-panel,url('../assets/v4/panel.webp')) center/100% 100% no-repeat;padding:23px 24px 25px}
.days-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(4,89px);gap:11px 9px;width:100%}
.day-node{position:relative;height:89px;display:grid;place-items:center;background:var(--art-node-open,url('../assets/v4/node-open.webp')) center/contain no-repeat;transition:transform .16s}
.day-node.current{background-image:var(--art-node-current,url('../assets/v4/node-current.webp'))}
.day-node.done{background-image:var(--art-node-done,url('../assets/v4/node-done.webp'))}
.day-node.locked{background-image:var(--art-node-locked,url('../assets/v4/node-locked.webp'));opacity:.86;filter:none}
.day-number{font-size:26px;font-weight:bold;line-height:1;margin-bottom:14px}
.day-node.locked>.icon{width:28px;height:28px;margin-bottom:15px}
.day-state{position:absolute;bottom:11px;font-size:9px;letter-spacing:.3px;font-weight:bold;text-transform:uppercase}
.day-state .icon{width:12px;height:12px}
.days-bottom{position:absolute;top:638px;left:33px;right:33px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:12px;font-weight:bold}
.days-bottom .icon{width:19px;height:19px}
.days-bottom p{background:var(--art-counter,url('../assets/v4/counter.webp')) center/100% 100% no-repeat;padding:10px 14px;white-space:nowrap}
.days-bottom>span{font-size:9px;line-height:1.5;text-align:right;color:#185b56;max-width:90px}
.game-title{top:78px}
.game-title h1{font-size:29px}
.garden-dots{display:flex;justify-content:center;gap:7px;margin-top:7px}
.garden-dots span{width:15px;height:15px;background:var(--art-progress-off,url('../assets/v4/progress-off.webp')) center/contain no-repeat}
.garden-dots span.on{background-image:var(--art-progress-on,url('../assets/v4/progress-on.webp'))}
.game-hud{position:absolute;top:154px;left:35px;right:35px;height:61px;background:var(--art-button-cream,url('../assets/v4/button-cream.webp')) center/100% 100% no-repeat;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:8px 18px 11px;gap:16px}
.hud-stat{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
.hud-stat b{font-size:28px;color:#216b7a}
.hud-stat p{font-size:10px;letter-spacing:.8px;text-transform:uppercase;font-weight:bold;line-height:1.45}
.hud-stat .icon{width:24px;height:24px}
.hud-divider{display:none}
.board{position:absolute;top:229px;left:24px;right:24px;height:326px;background:var(--art-board,url('../assets/v4/board.webp')) center/100% 100% no-repeat;border-radius:23px;overflow:visible}
.board-grid{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);touch-action:none}
.tile{position:absolute;display:block;background:var(--art-tile,url('../assets/v4/tile.webp')) center/100% 100% no-repeat;width:var(--tile);height:var(--tile);transition:filter .16s,transform .12s;touch-action:none}
.tile>img{width:100%;height:100%}
.tile:disabled{opacity:1;filter:none}
.tile:hover:not(:disabled){filter:brightness(1.09)}
.tile.hinted{animation:hint-bounce .8s ease-in-out infinite;filter:drop-shadow(0 0 8px #ffd438)}
.tile.emitting{filter:brightness(1.28);transform:scale(1.045)}
.tile.gone{opacity:0;pointer-events:none;transform:none}
.effects{position:absolute;inset:0;pointer-events:none;overflow:visible;z-index:4}
.flying-arrow{position:absolute;pointer-events:none;filter:drop-shadow(0 0 4px #ffd64c)}
.flying-arrow[hidden]{display:none}
.tile-fragment{position:absolute;background:var(--art-tile,url('../assets/v4/tile.webp')) center/100% 100% no-repeat;pointer-events:none;will-change:transform,opacity}
.tile-fragment img{width:100%;height:100%}
.impact{position:absolute;pointer-events:none;will-change:transform,opacity}
.combo{position:absolute;left:22px;right:22px;bottom:14px;text-align:center;font-size:10px;font-weight:bold;color:#357f7e;pointer-events:none}
.guide-card{position:absolute;top:562px;left:25px;right:25px;height:64px;display:flex;align-items:center;background:var(--art-bubble,url('../assets/v4/bubble.webp')) center/100% 100% no-repeat;padding:7px 17px 13px 74px}
.guide-card>img{position:absolute;width:76px;height:84px;object-fit:contain;left:0;bottom:0}
.guide-card p{font-size:10.5px;font-weight:bold;line-height:1.3;color:#336f74;min-width:0}
.guide-card em{font-style:normal;font-size:8px;letter-spacing:1px;color:#9a783e;display:block;margin-bottom:2px}
.game-footer{position:absolute;top:637px;left:27px;right:27px;display:grid;grid-template-columns:minmax(0,1fr) 47px 47px;align-items:center;gap:9px}
.loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px;background:var(--art-garden,url('../assets/v4/garden.webp')) center/cover}
.loader>img{width:300px}
.loader p,.loader small{font-weight:bold;text-align:center;color:#194f62;background:var(--art-bubble,url('../assets/v4/bubble.webp')) center/100% 100% no-repeat;padding:12px 20px}
.loader button{padding:15px 28px;background:var(--art-button-gold,url('../assets/v4/button-gold.webp')) center/100% 100% no-repeat;font-weight:bold}
.modal-backdrop{position:absolute;inset:0;z-index:20;background:#245f665c;backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center}
.modal-panel{position:relative;width:338px;max-height:642px;min-height:350px;display:flex;align-items:center;flex-direction:column;padding:59px 34px 36px;background:var(--art-panel,url('../assets/v4/panel.webp')) center/100% 100% no-repeat;animation:panel-enter .22s ease-out;text-align:center;overflow:hidden}
.modal-panel.compact{min-height:330px}
.modal-close,.modal-back{position:absolute;top:15px;width:43px;height:43px}
.modal-close{right:15px}
.modal-back{left:15px}
.modal-close .icon{width:24px;height:24px}
.modal-back .icon{width:26px;height:26px}
.modal-panel h2{font-size:25px;letter-spacing:-.5px;line-height:1.15;margin:5px 0 8px;color:#236a74;width:100%;overflow-wrap:break-word}
.modal-eyebrow{color:#937241;letter-spacing:1.4px;font-size:9px;font-weight:bold;max-width:100%}
.modal-sub{font-size:13px;line-height:1.45;color:#497477;margin:3px 0 12px}
.modal-actions{width:100%;display:grid;gap:9px;margin-top:13px;flex:none}
.modal-actions .button-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
.button-row>.art-button{width:auto;font-size:13px;padding-left:8px;padding-right:8px;gap:6px}
.button-row .icon{width:21px;height:21px}
.result-art{width:150px;height:132px;object-fit:contain;margin:0 0 4px}
.star-row{display:flex;justify-content:center;align-items:center;gap:8px;margin:0 0 7px}
.star-row .icon{width:34px;height:34px;animation:star-in .45s both}
.star-row .icon:nth-child(2){width:43px;height:43px;animation-delay:.08s}
.star-row .icon:nth-child(3){animation-delay:.16s}
.reward{display:flex;gap:5px;align-items:center;justify-content:center;background:var(--art-counter,url('../assets/v4/counter.webp')) center/100% 100% no-repeat;padding:9px 16px;font-weight:bold;color:#805e22;font-size:12px;max-width:100%}
.reward .icon{width:21px;height:21px}
.toggle-row{width:100%;display:flex;align-items:center;justify-content:space-between;margin:5px 0;padding:4px 0;gap:9px}
.toggle-label{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:bold;min-width:0}
.toggle-label .icon{width:26px;height:26px}
.toggle{height:34px;width:66px;flex:none;background:var(--art-toggle-off,url('../assets/v4/toggle-off.webp')) center/100% 100% no-repeat;color:#244957;font-size:9px;text-align:right;padding-right:9px;font-weight:bold}
.toggle.on{background-image:var(--art-toggle-on,url('../assets/v4/toggle-on.webp'));text-align:left;padding-left:10px;padding-right:0}
.menu-note{font-size:10px;color:#658780;line-height:1.45;margin-top:13px;max-width:100%}
.help-steps{display:flex;flex-direction:column;gap:15px;width:100%;text-align:left;margin:12px 0}
.help-step{display:flex;align-items:center;gap:12px}
.help-step .sample{background:var(--art-tile,url('../assets/v4/tile.webp')) center/contain no-repeat;width:50px;height:50px;flex:none}
.help-step .sample img{width:100%;height:100%}
.help-step p{font-size:12px;line-height:1.4;color:#497477;min-width:0}
.help-step b{display:block;color:#236a74;font-size:14px;margin-bottom:3px}
.simulation-tag{font-size:9px;letter-spacing:.7px;font-weight:bold;background:var(--art-bubble,url('../assets/v4/bubble.webp')) center/100% 100% no-repeat;color:#386e68;padding:9px 15px;margin:4px 0 8px;max-width:100%}
.simulation-meter{width:100%;height:18px;background:var(--art-button-cream,url('../assets/v4/button-cream.webp')) center/100% 100% no-repeat;overflow:hidden;margin:22px 0}
.simulation-meter span{display:block;height:100%;background:var(--art-button-teal,url('../assets/v4/button-teal.webp')) left/100% 100% no-repeat;width:0}
.simulation-big{width:70px;height:70px;margin:20px auto 6px}
.result-percent{font-size:35px;font-weight:bold;color:#27878f;margin-bottom:6px}
.qa-label{position:absolute;top:4px;left:0;right:0;text-align:center;font-size:8px;letter-spacing:2px;z-index:15;pointer-events:none;color:#fff;background:#238b997a}
.particle{position:absolute;width:15px;height:15px;pointer-events:none;z-index:40;animation:confetti 1.15s ease-out forwards}
.toast{position:absolute;z-index:45;bottom:88px;left:26px;right:26px;background:var(--art-bubble,url('../assets/v4/bubble.webp')) center/100% 100% no-repeat;padding:14px 22px;font-size:12px;font-weight:bold;text-align:center;animation:panel-enter .16s ease-out;pointer-events:none}
.reduced *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
@keyframes hint-bounce{50%{transform:translateY(-4px) scale(1.035)}}
@keyframes panel-enter{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes star-in{from{transform:scale(.2) rotate(-20deg);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes confetti{from{transform:translate(0,0) rotate(0);opacity:1}to{transform:translate(var(--dx),var(--dy)) rotate(240deg);opacity:0}}
@media(max-width:500px){.stage{border-radius:0;box-shadow:none}}
@media(prefers-reduced-motion:reduce){button{transition:none}.hinted{animation:none!important}}