:root{--resource-card-amount-color: #1f305c}:is([data-session-resource],[data-overlay-resource],#craft-owned-resources b,#craft-owned-resources strong,#craft-balance,.craft-economy b,.craft-economy strong,.craft-economy span,.resource-grid b,.resource-strip b,.mobile-snake-resources b,.session-resources b,.resources-mobile b,.overlay-session-resources b,.resource-card b,.resource-card strong,.inventory-grid strong,.shop-item>strong,.shop-offer-resource-grid strong,.shop-progression-rewards b){color:var(--resource-card-amount-color)!important;text-shadow:none!important}.player-level-celebration{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:auto;padding:max(18px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));background:#030814e6;opacity:0;transition:opacity .22s ease;isolation:isolate}.player-level-celebration.is-visible{opacity:1}.player-level-celebration__scene{position:fixed;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;opacity:.5;filter:saturate(.85) brightness(.62);pointer-events:none}.player-level-celebration__card{width:min(920px,96vw);max-height:calc(100dvh - 36px);overflow:auto;padding:clamp(24px,5vw,52px);border:1px solid rgba(121,228,255,.7);border-radius:34px;background:linear-gradient(145deg,#0a1b33f5,#21123af0);box-shadow:0 0 34px #4cd7ff75,0 0 90px #9d5bff57,inset 0 1px #ffffff38;color:#f8fbff;text-align:center;transform:translateY(26px) scale(.96);animation:player-level-glow 2.6s ease-in-out infinite;transition:transform .28s cubic-bezier(.2,.9,.2,1)}.player-level-celebration.is-visible .player-level-celebration__card{transform:none}.player-level-celebration__card h2{margin:0 0 24px;font-size:clamp(32px,6vw,64px);line-height:1;text-shadow:0 0 20px rgba(95,224,255,.8)}.player-level-celebration__hero{display:flex;align-items:center;justify-content:center;gap:clamp(20px,5vw,46px);min-height:220px;padding:24px;border-radius:26px;background:#08172fcc;box-shadow:inset 0 0 24px #4fd9ff33}.player-level-celebration__hero>img{width:clamp(120px,25vw,220px);filter:drop-shadow(0 0 24px rgba(86,225,255,.76))}.player-level-celebration__hero span,.player-xp-reward span,.player-level-badge span{display:grid;gap:6px;text-align:left}.player-level-celebration__hero strong{font-size:clamp(38px,8vw,82px);line-height:1}.player-level-celebration__hero small{color:#c9f3ff;font-size:clamp(17px,3vw,28px)}.player-level-celebration__pack{margin:22px 0 12px;color:#ffe07b;font-weight:900;letter-spacing:.08em}.player-level-celebration__rewards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:20px}.player-level-celebration__rewards article{display:flex;align-items:center;gap:12px;min-width:0;padding:13px;border:1px solid rgba(177,231,255,.26);border-radius:18px;background:#ffffff14;text-align:left}.player-level-celebration__rewards img{width:54px;height:54px;object-fit:contain}.player-level-celebration__rewards span{display:grid;min-width:0}.player-level-celebration__rewards strong{font-size:22px}.player-level-celebration__rewards small{overflow:hidden;color:#c8d7e9;text-overflow:ellipsis}.player-level-celebration__chests{display:flex;justify-content:center;gap:16px;margin-top:20px}.player-level-celebration__chests article{display:grid;justify-items:center;width:min(360px,46%);padding:12px 22px 16px;border:1px solid rgba(255,222,105,.38);border-radius:22px;background:#0a1f3adb;box-shadow:inset 0 0 26px #5bd5ff29}.player-level-celebration__chests img{width:min(230px,100%);height:150px;object-fit:contain;filter:drop-shadow(0 0 20px rgba(255,218,86,.38))}.player-level-celebration__chests strong{color:#ffe174;font-size:28px}.player-level-celebration__benefits{margin:20px 0 0;padding:0;list-style:none;color:#ffe38a;font-size:clamp(17px,3vw,24px);font-weight:800}.player-level-celebration__claim{width:100%;min-height:76px;margin-top:24px;border:1px solid rgba(255,255,255,.45);border-radius:20px;background:linear-gradient(135deg,#34c8e7,#7658ee);box-shadow:0 12px 30px #35bfe84d;color:#fff;font:inherit;font-size:clamp(20px,4vw,30px);font-weight:900;cursor:pointer}.player-xp-reward,.player-level-badge{display:flex;align-items:center;justify-content:center;gap:14px;border:1px solid rgba(112,222,255,.42);border-radius:18px;background:#091b34d1;box-shadow:0 0 20px #45d3ff2e;color:#f8fbff}.player-xp-reward{margin:14px 0;padding:12px 18px}.player-xp-reward img{width:62px;height:62px;object-fit:contain}.player-xp-reward strong{font-size:24px}.player-xp-reward small{color:#bdefff}.player-level-badge{padding:8px 14px}.player-level-badge img{width:42px;height:42px;object-fit:contain}.player-level-badge strong{font-size:15px}.player-level-badge small{color:#bdefff;font-size:12px}.account-player-progress{display:grid;gap:12px;padding:16px 20px 18px;border:2px solid #cbddea;border-radius:20px;background:linear-gradient(135deg,#f7fcff,#eef4ff);box-shadow:inset 0 1px #ffffffe0;color:#183653}.account-player-progress--loading{min-height:92px;place-items:center;color:#667b8e;font-weight:800}.account-player-progress__summary{display:flex;align-items:center;gap:14px}.account-player-progress__summary img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 4px 8px rgb(62 128 190 / 24%))}.account-player-progress__summary span{display:grid;gap:3px;min-width:0}.account-player-progress__summary strong{font-size:1.15rem}.account-player-progress__summary small{color:#60758a;font-weight:800}.account-player-progress__bar{width:100%;height:18px;overflow:hidden;border:0;border-radius:999px;appearance:none;background:#d7e3ed}.account-player-progress__bar::-webkit-progress-bar{border-radius:999px;background:#d7e3ed}.account-player-progress__bar::-webkit-progress-value{border-radius:999px;background:linear-gradient(90deg,#58c7e9,#6b5cdd);box-shadow:0 0 12px #48bce27a}.account-player-progress__bar::-moz-progress-bar{border-radius:999px;background:linear-gradient(90deg,#58c7e9,#6b5cdd);box-shadow:0 0 12px #48bce27a}@keyframes player-level-glow{50%{box-shadow:0 0 48px #4cd7ff9e,0 0 112px #9d5bff75,inset 0 1px #ffffff47}}@media(max-width:620px){.player-level-celebration__hero{align-items:center;min-height:0}.player-level-celebration__rewards{grid-template-columns:repeat(2,minmax(0,1fr))}.player-level-celebration__rewards article{display:grid;justify-items:center;text-align:center}.player-level-celebration__rewards article:only-child{width:min(100%,220px);grid-column:1 / -1;justify-self:center}.player-level-celebration__rewards span{text-align:center}.player-level-celebration__chests{flex-wrap:wrap}.player-level-celebration__chests article{width:min(100%,260px)}}@media(prefers-reduced-motion:reduce){.player-level-celebration,.player-level-celebration__card{transition:none;animation:none}}.background-issue-overlay{position:fixed;z-index:10000;inset:0;display:grid;padding:max(18px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));place-items:center;background:#020c1fd1;backdrop-filter:blur(13px)}.background-issue-dialog{display:grid;position:relative;width:min(520px,100%);max-height:calc(100svh - 36px);gap:18px;padding:34px 28px 26px;overflow:auto;border:2px solid rgb(111 225 255 / 72%);border-radius:28px;color:#fff;background:radial-gradient(circle at 50% 0,rgb(35 142 227 / 35%),transparent 45%),linear-gradient(155deg,#0b2448,#07162f 64%,#100d38);box-shadow:0 28px 90px #0000007a,inset 0 0 0 1px #ffffff1a}.background-issue-help{position:absolute;top:14px;right:14px;width:42px;height:42px;border:2px solid rgb(134 226 255 / 75%);border-radius:50%;color:#073257;background:#f4fbff;font-size:1.25rem;font-weight:1000;cursor:pointer}.background-issue-summary{display:grid;justify-items:center;gap:10px;text-align:center}.background-issue-glyph{display:grid;width:62px;height:62px;place-items:center;border:2px solid #80e7ff;border-radius:50%;color:#071a34;background:#a8efff;box-shadow:0 0 28px #4ad3ff73;font-size:2rem;font-weight:1000}.background-issue-dialog h2,.background-issue-dialog h3,.background-issue-dialog p,.background-issue-dialog li,.background-issue-dialog small{color:#fff}.background-issue-dialog h2{margin:0;font-size:clamp(1.4rem,4vw,2rem)}.background-issue-dialog p{margin:0;line-height:1.5}.background-issue-details{padding:18px;border:1px solid rgb(128 231 255 / 34%);border-radius:18px;background:#020c1f8a}.background-issue-details h3{margin:0 0 10px}.background-issue-details ul{margin:0;padding-left:22px;line-height:1.48}.background-issue-details small{display:block;margin-top:14px;opacity:.58}.background-issue-details a{display:block;margin-top:16px;color:#78e5ff;font-weight:900;text-align:center}.background-issue-understood{min-height:58px;border:2px solid #75c8ec;border-radius:18px;color:#12365a;background:linear-gradient(#fff,#dff5ff);box-shadow:0 5px #4d83b7;font-size:1.05rem;font-weight:1000;cursor:pointer}.tutorial-stage{position:fixed;z-index:9000;inset:0;overflow:auto;color:#fff;background:linear-gradient(90deg,#01091c1f,#01091c0a),url(/assets/tutorials/echo-wide-v1.webp) center / cover no-repeat}.tutorial-stage-frame{display:grid;width:min(1450px,74vw);min-height:100svh;margin:0 auto 0 0;padding:clamp(28px,4.6vw,76px);grid-template-areas:"copy demo" "button demo";grid-template-columns:minmax(400px,1fr) minmax(330px,.78fr);grid-template-rows:1fr auto;align-items:center;gap:clamp(18px,3vw,48px);animation:tutorial-frame-enter .26s ease-out both}.tutorial-stage.leaving .tutorial-stage-frame{animation:tutorial-frame-exit .22s ease-in both}.tutorial-stage-copy{display:grid;grid-area:copy;max-width:720px;align-content:center;gap:15px;text-shadow:0 3px 12px rgb(0 0 0 / 75%)}.tutorial-stage-copy small{color:#73e5ff;font-size:clamp(.82rem,1.3vw,1.05rem);font-weight:1000;letter-spacing:.16em;text-transform:uppercase}.tutorial-stage-copy h2{margin:0;color:#fff;font-size:clamp(2rem,4.6vw,4.7rem);line-height:.98}.tutorial-stage-copy p{max-width:670px;margin:0;color:#fff;font-size:clamp(1rem,1.6vw,1.42rem);font-weight:700;line-height:1.48}.tutorial-stage-copy strong{max-width:620px;color:#72defc;font-size:clamp(.94rem,1.35vw,1.2rem);line-height:1.38}.tutorial-demo-window{grid-area:demo;justify-self:center;width:min(420px,30vw);min-width:320px;overflow:hidden;border:2px solid rgb(110 222 255 / 88%);border-radius:24px;color:#12375c;background:#eef8fff5;box-shadow:0 20px 70px #0000006b,inset 0 0 0 1px #fff;transform:rotate(-1deg)}.tutorial-demo-window header{display:flex;min-height:56px;padding:0 20px;align-items:center;justify-content:space-between;color:#fff;background:linear-gradient(90deg,#0d2b55,#143b72);font-size:.9rem;font-weight:1000;letter-spacing:.08em;text-transform:uppercase}.tutorial-demo-window header i,.tutorial-demo-window header i:before,.tutorial-demo-window header i:after{display:block;width:5px;height:5px;border-radius:50%;background:#80eaff;content:""}.tutorial-demo-window header i:before{transform:translate(-9px)}.tutorial-demo-window header i:after{transform:translate(9px,-5px)}.tutorial-demo-content{display:grid;position:relative;min-height:360px;padding:28px;place-items:center;overflow:hidden;background:radial-gradient(circle at 50% 10%,rgb(83 204 255 / 18%),transparent 45%),linear-gradient(#f7fcff,#e6f3ff)}.tutorial-stage-ok{grid-area:button;min-width:220px;min-height:64px;justify-self:start;border:2px solid #70c8ef;border-radius:19px;color:#12365a;background:linear-gradient(#fff,#dff5ff);box-shadow:0 6px #4e82b8,0 16px 34px #00000042;font-size:1.12rem;font-weight:1000;cursor:pointer}.demo-devices{display:flex;gap:24px;align-items:end}.demo-devices i{width:72px;height:132px;border:10px solid #13345c;border-radius:14px;background:#d6f4ff}.demo-devices b{width:110px;height:78px;border:10px solid #13345c;border-radius:12px;background:#d6f4ff}.demo-account-icon{display:grid;width:84px;height:84px;place-items:center;border-radius:50%;color:#fff;background:#1dcbed;box-shadow:0 0 28px #43d8ff;animation:tutorial-pulse 1.8s infinite}.demo-resources{display:flex;gap:8px}.demo-resources span{display:grid;width:58px;padding:9px 4px;justify-items:center;border:2px solid #5bc7f1;border-radius:14px;color:#13365c;background:#fff}.demo-resources b{color:#784ee7;font-size:1.45rem}.demo-resources small{color:#13365c;font-weight:1000}.demo-gesture-line{position:absolute;width:180px;height:5px;border-radius:5px;background:#43d7f8;animation:tutorial-swipe 1.8s infinite}.demo-board{display:grid;position:relative;gap:4px}.tetris-board{grid-template-columns:repeat(6,37px)}.demo-board i{display:grid;width:37px;height:37px;place-items:center;border:1px solid #a3cae5;border-radius:7px;color:#12365a;background:#dbeefa;font-style:normal;font-weight:1000}.tetris-board i.filled{background:#7d6bf2;box-shadow:inset 0 0 0 3px #ffffff57}.falling-piece{position:absolute;top:8px;left:49px;width:119px;height:37px;color:#fff;background:#20bfe7;text-align:center;line-height:37px;animation:tutorial-fall 2.3s infinite}.demo-swipe{position:absolute;bottom:15px;color:#1c9fc9;font-size:2.2rem;animation:tutorial-swipe 1.7s infinite}.demo-craft{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;color:#153a61;font-size:1.7rem}.demo-craft div,.demo-craft strong{display:grid;width:92px;height:92px;place-items:center;border:2px solid #58c9ed;border-radius:18px;background:#fff}.demo-craft button{grid-column:1 / -1;min-height:54px;border:0;border-radius:14px;color:#fff;background:#2fc7e7;font-size:1.5rem;animation:tutorial-pulse 1.6s infinite}.word-board{grid-template-columns:repeat(5,44px)}.word-board i{width:44px;height:44px}.word-board i.active{color:#fff;background:#586ce4}.word-trace{position:absolute;top:51px;left:24px;width:202px;height:5px;border-radius:5px;background:#44dcff;transform-origin:left;animation:tutorial-trace 2s infinite}.tutorial-demo-snake{grid-template-rows:1fr auto;gap:10px}.demo-snake-board{position:relative;width:min(292px,100%);aspect-ratio:1;padding:7px;border:5px solid rgb(255 255 255 / 92%);border-radius:24px;background:#c7dfef;box-shadow:inset 0 0 0 2px #8fbfd7,0 10px 28px #22558729;touch-action:manipulation}.demo-snake-grid,.demo-snake-layer{position:absolute;inset:7px;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(7,1fr);gap:3px}.demo-snake-grid i{border:1px solid rgb(139 202 235 / 32%);border-radius:22%;background:linear-gradient(145deg,#f8fdffd1,#c0def1a8);box-shadow:inset 0 1px #fffc}.demo-snake-segment,.demo-snake-target{position:absolute;top:calc(var(--demo-row) * (100% / 7) + 2px);left:calc(var(--demo-column) * (100% / 7) + 2px);display:grid;width:calc(100% / 7 - 4px);height:calc(100% / 7 - 4px);place-items:center;border:1px solid rgb(124 235 255 / 84%);border-radius:24%;background:radial-gradient(circle at 30% 18%,rgb(255 255 255 / 42%),transparent 28%),linear-gradient(145deg,#28d7ec,#316fc1 56%,#7257ca);box-shadow:inset 0 1px #ffffffc2,0 0 7px #3fc7ee40}.demo-snake-segment img{width:116%;height:116%;max-width:none;max-height:none;object-fit:contain;transform-origin:center;filter:drop-shadow(0 1px 2px rgb(3 19 56 / 28%))}.demo-snake-target{z-index:5;border:2px solid rgb(255 255 255 / 88%);color:#fff;background:linear-gradient(145deg,#f178a4,#7c5bd1);font-weight:1000;cursor:pointer;animation:tutorial-pulse 1.3s infinite}.demo-snake-target.moving{opacity:.35;animation:none}.demo-interaction-hint{color:#159ecb;font-size:1.65rem;font-weight:1000;animation:tutorial-target 1.8s infinite}.demo-tower{--tower-demo-columns: 10;--tower-demo-rows: 7;position:relative;width:min(340px,100%);aspect-ratio:10 / 7;overflow:hidden;border:6px solid #fff;border-radius:22px;background:#c8dfec;box-shadow:inset 0 0 0 2px #8fbfd7,0 10px 28px #22558729;touch-action:none}.demo-tower-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(7,1fr);gap:3px}.demo-tower-grid i{background:linear-gradient(145deg,#f8fdffb3,#c0def17a)}.demo-tower-block{position:absolute;z-index:2;left:calc(var(--demo-column) * (100% / var(--tower-demo-columns)) + 2px);bottom:calc(var(--demo-row) * (100% / var(--tower-demo-rows)) + 2px);display:grid;width:calc(var(--demo-length) * (100% / var(--tower-demo-columns)) - 4px);height:calc(100% / var(--tower-demo-rows) - 4px);place-items:center;padding:0 3px;overflow:hidden;border:1px solid rgb(255 255 255 / 82%);border-radius:8px;color:#fff;background:radial-gradient(circle at 25% 18%,rgb(255 255 255 / 32%),transparent 32%),linear-gradient(145deg,#5b82ed,#3d65c2);box-shadow:inset 0 1px #ffffffad,inset 0 -2px #11296733;font-size:clamp(.48rem,1.3vw,.72rem);font-weight:1000;text-overflow:ellipsis;cursor:grab;user-select:none}.demo-tower-block.tower-1{background:linear-gradient(145deg,#30d7ec,#278abf)}.demo-tower-block.tower-2{background:linear-gradient(145deg,#b184eb,#7452c7)}.demo-tower-block.tower-3{background:linear-gradient(145deg,#ff8bab,#c94f80)}.demo-tower-block.dragging{z-index:8;cursor:grabbing;filter:brightness(1.14);box-shadow:0 0 0 3px #70e2ffad}.tower-drag{position:absolute;z-index:12;top:14px;right:15px;color:#fff;font-size:2rem;text-shadow:0 2px 7px #134976;pointer-events:none;animation:tutorial-horizontal 1.8s infinite}@keyframes tutorial-frame-enter{0%{opacity:0;transform:scale(1.02)}}@keyframes tutorial-frame-exit{to{opacity:0;transform:scale(.99)}}@keyframes tutorial-pulse{50%{transform:scale(1.1);filter:brightness(1.2)}}@keyframes tutorial-swipe{0%,to{transform:translate(-55px);opacity:.35}50%{transform:translate(55px);opacity:1}}@keyframes tutorial-fall{0%{transform:translateY(0)}70%,to{transform:translateY(180px)}}@keyframes tutorial-trace{0%{transform:scaleX(.05)}65%,to{transform:scaleX(1)}}@keyframes tutorial-target{0%,to{transform:translateY(40px)}50%{transform:translate(55px,-20px)}}@keyframes tutorial-horizontal{0%,to{transform:translate(-25px)}50%{transform:translate(8px)}}@media(max-width:820px),(orientation:portrait){.tutorial-stage{background-color:#020b20;background-image:url(/assets/tutorials/echo-wide-v1.webp);background-position:76% top;background-size:auto 46svh;background-repeat:no-repeat}.tutorial-stage:before{position:absolute;z-index:0;inset:0 0 auto;height:46svh;background:linear-gradient(180deg,#020b200a 48%,#020b20);content:"";pointer-events:none}.tutorial-stage-frame{position:relative;z-index:1;width:100%;grid-template-areas:"copy" "demo" "button";grid-template-columns:1fr;grid-template-rows:auto auto auto;padding:calc(46svh + 20px) 18px 34px;align-content:start;gap:18px}.tutorial-stage-copy{align-content:start}.tutorial-stage-copy h2{font-size:clamp(2rem,9vw,3.5rem)}.tutorial-demo-window{width:min(390px,100%);min-width:0;justify-self:start}.tutorial-demo-content{min-height:260px;transform-origin:center}.tutorial-stage-ok{width:min(390px,100%);justify-self:start}}@media(prefers-reduced-motion:reduce){.tutorial-stage *,.tutorial-stage{animation-duration:1ms!important;animation-iteration-count:1!important}}
