:root{color-scheme:dark;--bg:#161029;--panel:#211635;--ink:#f5efff;--muted:#a598b8;--line:rgba(208,177,255,.12);--lavender:#c6a0ff;--gold:#edca88;--font:ui-rounded,"SF Pro Rounded","PingFang SC","Microsoft YaHei",system-ui,sans-serif;font-family:var(--font);font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);min-width:320px;min-height:100svh;-webkit-tap-highlight-color:transparent;background-image:radial-gradient(ellipse at 50% 28%,#34204c80,transparent 55%),radial-gradient(ellipse at 0 90%,#2c20444d,transparent 55%)}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit;border:0}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}button:active:not(:disabled){transform:translateY(2px)}button{transition:background .18s,opacity .18s,transform .18s}svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.ambient{position:fixed;inset:0;overflow:hidden;z-index:-1;pointer-events:none}.ambient:before,.ambient:after{content:"✧";position:absolute;color:#9d75c244;font-size:26px;left:12%;top:32%}.ambient:after{left:auto;right:12%;top:62%;font-size:38px}.ambient i{position:absolute;width:3px;height:3px;background:#cab7e4;border-radius:50%;opacity:.35;box-shadow:130px 100px #a993c1,230px -110px #ab7ec6,-70px 350px #b29bce,400px 230px #c3a7dc,200px 530px #d4b6e4,540px -50px #977aab;left:10%;top:22%}.ambient i:nth-child(2){left:59%;top:48%;opacity:.25}.ambient i:nth-child(3){left:82%;top:14%;opacity:.2}.app{max-width:1160px;margin:auto;padding:0 42px}.site-header{height:106px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;align-items:center;text-decoration:none;color:#f7efff;font-size:25px;font-weight:750;letter-spacing:-1px}.brand-light{font-weight:400;color:#c5afe1;margin-left:4px}.brand small{display:block;font-weight:400;letter-spacing:2.6px;color:#a591b7;font-size:9px;margin-top:4px}.brand-mark{width:45px;height:48px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,#4b3068,#322046);box-shadow:inset 0 1px 0 #d1a6fb22,0 5px 15px #09031230;color:#e4beff;transform:rotate(-7deg)}.brand-mark svg{width:30px;height:30px;stroke-width:1.5}.header-actions{display:flex;align-items:center;gap:12px}.icon-button{display:grid;place-items:center;width:39px;height:39px;background:transparent;color:#baaccb;border:1px solid #b392d41f;border-radius:50%;font-size:19px}.icon-button:hover{background:#ffffff0a;color:#f6e6ff}.icon-button svg{width:19px;height:19px}.level-menu{height:41px;display:flex;gap:9px;align-items:center;padding:0 15px;background:#a07cc113;border:1px solid #b392d426;border-radius:12px;font-size:12px;color:#d9c9eb}.level-menu svg{width:16px;height:16px}.level-menu b{font-size:10px;color:#a99ab9;font-weight:500;margin-left:5px;font-variant-numeric:tabular-nums}.intro{text-align:center;padding:31px 0 23px}.eyebrow{font-size:8px;font-weight:600;letter-spacing:3.5px;color:#a693b9;display:inline-flex;gap:8px;align-items:center}.eyebrow span{display:block;width:4px;height:4px;background:#d7b2f6;border-radius:50%;box-shadow:0 0 8px #c69bff}.intro h1{font-size:29px;letter-spacing:2px;font-weight:550;margin:12px 0 8px}.intro h1 em{font-style:normal;color:#dac1fa}.intro p{font-size:11px;letter-spacing:1px;color:#a598b4;margin:0}.game{max-width:860px;margin:auto;background:linear-gradient(145deg,#291d3d90,#1d142bba);border:1px solid #b193c329;border-radius:25px;box-shadow:0 24px 80px #0805103d,inset 0 1px 0 #e8d3ff06;padding:24px 32px 0;position:relative;overflow:hidden}.game:before{content:"";pointer-events:none;position:absolute;inset:0;background:radial-gradient(ellipse at 50% 25%,#6b3c9020,transparent 60%)}.game-topbar{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2}.level-heading{display:flex;gap:12px;align-items:center}.level-medallion{width:43px;height:43px;border:1px solid #c5a47766;box-shadow:inset 0 0 14px #edca8808;border-radius:13px;display:grid;place-items:center;color:var(--gold);font-weight:500;font-size:20px;font-variant-numeric:tabular-nums}.overline{color:#b8a3c7;letter-spacing:2px;font-size:8px}.level-heading h2{font-size:15px;letter-spacing:1px;margin:4px 0 0;font-weight:550}.game-stats{display:flex;align-items:center;gap:22px}.game-stats>div{display:flex;flex-direction:column;gap:5px;min-width:44px}.game-stats>div>span{font-size:9px;letter-spacing:1px;color:#a291b1}.game-stats strong{font-size:22px;font-weight:500;line-height:1;font-variant-numeric:tabular-nums}.game-stats strong b{font-weight:500}.game-stats small{font-size:12px;color:#95849f}.game-stats i{height:29px;width:1px;background:var(--line)}.scene{height:420px;position:relative;margin:4px -12px 0}.scene canvas{display:block;width:100%;height:100%;position:relative;z-index:1}.scene-orbit{position:absolute;border:1px solid #ae8dcc09;border-radius:50%;width:80%;height:62%;left:10%;top:20%;transform:rotate(-13deg);pointer-events:none}.scene-orbit:before{content:"";position:absolute;inset:19px -35px;border:1px solid #ae8dcc06;border-radius:50%;transform:rotate(27deg)}.bottle-targets{position:absolute;inset:0;z-index:2;pointer-events:none}.bottle-target{position:absolute;background:transparent;border-radius:20px;pointer-events:auto;padding:0;outline-offset:2px!important;transition:none}.bottle-target:disabled{pointer-events:none}.bottle-target:active{transform:none!important}.bottle-target:focus-visible{outline:1px solid #d1b2ef99;box-shadow:0 0 20px #c49cee11}.scene-caption{position:absolute;bottom:4px;left:0;width:100%;display:flex;gap:7px;align-items:center;justify-content:center;font-size:10px;color:#b6a3c6;letter-spacing:.6px;pointer-events:none;z-index:3;transition:opacity .2s}.scene-caption svg{width:12px;height:12px;color:#d0b1ee;fill:#d0b1ee;stroke-width:0}.scene-caption.hidden{opacity:0}.message{position:relative;min-height:31px;text-align:center;font-size:11px;color:#b3a0c4;letter-spacing:.6px;padding:10px 0 7px;line-height:1.5}.message.hint{color:#f0d8a9}.message.error{color:#efa5b5}.tools{position:relative;display:flex;justify-content:center;gap:32px;padding:16px 0 23px}.tool{background:transparent;min-width:90px;display:flex;flex-direction:column;align-items:center;gap:10px}.tool>span:last-child{font-size:11px;letter-spacing:1px;color:#d8c9e7;text-align:center}.tool small{display:block;font-size:8px;color:#8f7e9d;letter-spacing:.5px;margin-top:5px}.tool-icon{height:49px;width:54px;border:1px solid #be9ada38;border-radius:15px;display:grid;place-items:center;background:linear-gradient(150deg,#56406580,#332340bb);color:#d8bbee;box-shadow:inset 0 1px 0 #f4dfff0a,0 4px 0 #100a1b77;position:relative;transition:transform .2s,border-color .2s}.tool-icon svg{width:23px;height:23px}.tool:hover:not(:disabled) .tool-icon{transform:translateY(-3px);border-color:#c79feb70}.tool-hint .tool-icon{background:linear-gradient(145deg,#84603d66,#4d304a80);border-color:#d6ad7052;color:#f6d291}.tool-icon b{position:absolute;right:-6px;top:-5px;min-width:19px;padding:3px 4px;border:2px solid #24172f;border-radius:7px;font-size:9px;line-height:1;background:#a77cd0;color:#fcf6ff;font-weight:600}.tool-icon b[hidden]{display:none}.tool-hint .spark-badge{background:#d6ae6a;color:#352140}.tool:disabled{opacity:.33}.game-bottom{position:relative;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:14px 0;color:#8f7d9d;font-size:8px;letter-spacing:.5px}.game-bottom>span:first-child{display:flex;align-items:center;gap:6px}.game-bottom i{width:4px;height:4px;background:#91b79c;border-radius:50%}.little-star{font-size:12px;color:#b29bc4;margin-left:7px}footer{text-align:center;padding:22px 0 25px;font-size:9px;letter-spacing:1px;color:#a08caf}.footer-star{color:#b28bce;margin-right:7px;font-size:9px}.keyboard-tip{margin-left:22px;color:#6f5f80;font-size:8px;letter-spacing:.5px}.modal{color:var(--ink);background:linear-gradient(145deg,#342347,#21172f);border:1px solid #b892d345;border-radius:25px;padding:38px;width:min(510px,calc(100vw - 32px));max-height:85svh;overflow:auto;box-shadow:0 30px 100px #0009;text-align:center}.modal::backdrop{background:#0b061bb3;backdrop-filter:blur(9px)}.modal[open]{animation:modal-in .24s ease-out}.modal-close{position:absolute;right:15px;top:15px;background:transparent;padding:5px;color:#a996bb;display:grid;place-items:center;border-radius:8px}.modal-close svg{width:18px;height:18px}.modal h2{font-size:22px;font-weight:550;letter-spacing:1px;margin:13px 0}.modal p{font-size:11px;color:#b09bbf;line-height:1.9}.modal-kicker{font-size:8px;letter-spacing:2px;color:var(--gold)}.levels-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:25px 0}.level-tile{height:58px;border:1px solid #ac89c130;background:#7d5b9522;border-radius:12px;font-size:17px;position:relative;color:#c6b1d6}.level-tile.current{background:#9d75c52e;border-color:#cda6ef;color:white}.level-tile.cleared:after{content:"✦";position:absolute;right:5px;bottom:4px;color:var(--gold);font-size:9px}.level-tile:hover{background:#b18bd140}.modal-foot{font-size:10px;color:#b49ac7;letter-spacing:1px}.how-to{display:flex;gap:16px;text-align:left;padding:18px 0;border-bottom:1px solid var(--line)}.how-to>span{color:#d4adf2;font-size:12px;padding-top:3px}.how-to h3{font-size:12px;margin:0 0 7px;font-weight:500}.how-to p{margin:0;font-size:11px}.primary-button{background:linear-gradient(135deg,#ceb0f2,#aa7ed1);border:1px solid #e5caff44;border-radius:12px;color:#2e1c3f;padding:14px 22px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:18px;font-weight:650;box-shadow:0 4px 0 #694889;margin-top:23px;min-height:46px}.primary-button svg{width:17px;height:17px}.help-modal .primary-button{width:100%}.primary-button:hover{background:linear-gradient(135deg,#e2c6ff,#bb90e1)}.secondary-button{border:1px solid #b391cc44;border-radius:12px;background:#9a7aad16;color:#d9c9e9;padding:14px 18px;font-size:12px;margin-top:23px}.dialog-actions{display:flex;gap:12px;justify-content:center}.small-modal{max-width:400px}.win-modal{max-width:420px;padding-top:32px}.win-seal{margin:0 auto 23px;width:76px;height:76px;border-radius:24px;background:radial-gradient(circle,#b38a4f66,#4e3542aa);border:1px solid #d7ad6966;display:grid;place-items:center;box-shadow:0 0 45px #d7ad6922;transform:rotate(-8deg)}.win-seal svg{width:44px;height:44px;fill:#f8da9c;stroke-width:0;transform:rotate(8deg)}.win-stats{display:flex;justify-content:center;gap:40px;align-items:center;margin-top:28px}.win-stats span{font-size:10px;color:#af97bf}.win-stats strong{display:block;font-size:29px;color:#eee0ff;font-weight:500;margin-top:10px}.win-stats i{width:1px;height:45px;background:var(--line)}.win-modal .primary-button{width:100%;margin-top:30px}.text-button{display:block;margin:20px auto 0;background:transparent;color:#ab92bb;font-size:10px;letter-spacing:1px;padding:8px}@keyframes modal-in{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
@media(min-width:1000px) and (min-height:900px){.intro{padding-top:40px;padding-bottom:30px}.scene{height:470px}.game{padding-top:28px}.tools{padding-bottom:27px}}
@media(max-height:800px) and (min-width:650px){.site-header{height:78px}.intro{padding:20px 0}.intro h1{font-size:25px;margin:8px 0}.scene{height:340px}.tools{padding:10px 0 17px}.game{padding-top:19px}footer{padding:17px 0}}
@media(max-width:650px){.app{padding:0 18px}.site-header{height:79px}.brand{font-size:22px;gap:9px}.brand-mark{height:39px;width:37px;border-radius:12px}.brand-mark svg{width:25px;height:25px}.brand small{font-size:7px;letter-spacing:2px}.header-actions{gap:8px}.icon-button{width:32px;height:32px;font-size:16px}.icon-button svg{width:16px;height:16px}.level-menu{padding:0 10px;height:34px;font-size:10px;gap:6px}.level-menu b{display:none}.level-menu svg{width:14px;height:14px}.intro{padding:23px 0 20px}.eyebrow{font-size:7px;letter-spacing:2.5px}.intro h1{font-size:25px;margin:10px 0 8px;letter-spacing:1px}.intro p{font-size:10px;letter-spacing:.5px}.game{padding:19px 17px 0;border-radius:21px}.level-medallion{width:36px;height:38px;border-radius:11px;font-size:18px}.level-heading{gap:9px}.overline{font-size:7px;letter-spacing:1px}.level-heading h2{font-size:13px;margin-top:4px}.game-stats{gap:14px}.game-stats>div{min-width:30px}.game-stats strong{font-size:20px}.game-stats small{font-size:10px}.game-stats>div>span{font-size:8px}.scene{height:385px;margin:0 -10px}.scene-caption{font-size:8px;letter-spacing:0;bottom:0;gap:4px}.scene-caption svg{width:11px;height:11px}.message{font-size:9px;letter-spacing:0;padding:9px 0 4px;min-height:28px}.tools{gap:0;justify-content:space-between;padding:12px 0 18px}.tool{min-width:60px;gap:10px}.tool-icon{width:47px;height:46px;border-radius:14px}.tool-icon svg{width:22px;height:22px}.tool>span:last-child{font-size:10px;letter-spacing:.5px}.tool small{font-size:7px}.game-bottom{font-size:7px;letter-spacing:0;padding:12px 0}.game-bottom>span:last-child{font-size:7px}.little-star{display:none}.keyboard-tip{display:none}footer{padding:18px 0 24px;font-size:8px}.modal{padding:32px 23px}.modal h2{font-size:20px}.levels-grid{gap:8px}.level-tile{height:49px;font-size:15px}}
@media(max-width:650px) and (max-height:760px){.site-header{height:67px}.intro{padding:16px 0}.intro h1{font-size:23px}.scene{height:330px}.game{padding-top:16px}.tools{padding-top:8px;padding-bottom:15px}.game-bottom{padding:10px 0}footer{padding:14px 0}}
@media(max-width:360px){.app{padding:0 11px}.header-actions{gap:6px}.brand{font-size:20px}.brand-mark{width:33px;height:36px}.level-menu{padding:0 8px}.game{padding-left:13px;padding-right:13px}.game-bottom>span:last-child{font-size:6px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.level-tile{display:flex;align-items:center;justify-content:center;gap:4px}.level-tile svg{width:12px;height:12px;stroke-width:1.7}.level-tile.locked{color:#887496;background:#7555850e;border-color:#ac89c11a}.level-tile.locked:hover{background:#7555850e}.level-tile.auth-required{color:#edd4a0;border-color:#d6ad7080;background:#a7803826;box-shadow:0 0 16px #c6974110}.level-tile.auth-required:hover{background:#b18c4b40}.level-tile.locked.cleared:after{display:none}

/* Keep longer translations readable and mirror the interface for Urdu. */
.tool{max-width:25%}.tool small,.game-bottom,.modal p{overflow-wrap:anywhere}.game-bottom{gap:10px}.game-bottom>span{min-width:0}.stuck-entry{flex-shrink:0}.auth-details,.auth-result,.how-to{text-align:start}.brand,.scene,#level-count,#auth-id,#auth-status{direction:ltr}.auth-details dd{unicode-bidi:isolate}.modal-close{right:auto;inset-inline-end:15px}.auth-pages li{min-width:0}.how-to>div{min-width:0}
html[lang=ur]{font-family:"Noto Nastaliq Urdu","Geeza Pro",Arial,sans-serif}html[lang=ur] body{line-height:1.8}html[lang=ur] *{letter-spacing:normal!important}html[lang=ur] .intro h1{line-height:1.8}html[lang=ur] .modal p,html[lang=ur] .auth-result{line-height:2}html[dir=rtl] .primary-button svg{transform:scaleX(-1)}html[dir=rtl] .tool-icon b{right:auto;left:-6px}html[dir=rtl] .brand-mark svg{transform:none}
@media(max-width:650px){html[lang=ur] .tool small,html[lang=th] .tool small{font-size:9px}html[lang=ur] .message{font-size:11px}html[lang=ur] .game-bottom{font-size:8px}.tool>span:last-child{letter-spacing:0}.game-bottom>span:first-child{flex:1}.stuck-entry{max-width:48%;text-align:end;white-space:normal}}