@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;font-family:'DM Sans',sans-serif;color:#f6faf0;background:#102e36}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit;border:0}button:focus-visible,a:focus-visible{outline:3px solid #f9df9a;outline-offset:5px}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}header{position:fixed;top:0;left:0;width:100%;padding:32px 4.6%;display:flex;justify-content:space-between;align-items:center;z-index:3}.brand{font:700 28px 'Outfit',sans-serif;letter-spacing:5px;text-decoration:none;color:inherit;display:flex;align-items:center;gap:12px}.brand>span{color:#c1eeb9;font-size:34px}.brand small{font:500 9px 'DM Sans',sans-serif;letter-spacing:2px;margin-left:20px;padding-left:25px;border-left:1px solid #ffffff35}.tools{display:flex;gap:10px}.tools button{width:44px;height:44px;border:1px solid #ffffff30;background:#14363d80;border-radius:50%;font-size:21px;backdrop-filter:blur(12px)}.panel{position:absolute;left:9%;top:50%;transform:translateY(-46%);max-width:500px;z-index:2}.eyebrow{font-size:10px;letter-spacing:2.5px;color:#b6e6bd;font-weight:700;display:flex;align-items:center;gap:10px}.eyebrow i{height:6px;width:6px;background:#ccf5b1;border-radius:50%;box-shadow:0 0 15px #bbeeab}h1{font:500 clamp(58px,6.2vw,94px)/1.02 'Outfit',sans-serif;letter-spacing:-4px;margin:25px 0}h1 em{font-style:normal;color:#ceefb2}.panel p{font-size:16px;line-height:1.8;color:#c0d4d1;margin:0 0 27px}.modes{display:flex;gap:8px;margin-bottom:15px}.modes button{background:#102f3980;border:1px solid #ffffff25;border-radius:12px;text-align:left;padding:12px 18px;font-size:13px;min-width:160px}.modes button span{display:block;font-size:10px;color:#b6c7c8;margin-top:5px}.modes button.selected{border-color:#c6ecae;background:#b4e7ad12}.primary{background:#d0f3b0;color:#163c33;border-radius:12px;padding:18px 24px;font-weight:700;width:100%;font-size:16px;box-shadow:0 8px 40px #a1e9a312;transition:transform .2s,background .2s}.primary:hover{background:#e0ffcb;transform:translateY(-2px)}.primary span{float:right;font-size:23px;line-height:20px}.hint{font-size:11px;color:#a9c5c5;text-align:center;margin-top:17px}kbd{font:9px 'DM Sans',sans-serif;border:1px solid #ffffff35;border-radius:4px;padding:4px 7px;margin-right:4px}.record{font-size:9px;letter-spacing:1.4px;margin-top:28px;color:#99b7b8;display:flex;align-items:center;gap:10px}.record b{font-size:22px;color:#f3f9eb;letter-spacing:0;margin-left:6px}.record span{letter-spacing:0;font-size:11px}.world-label{position:absolute;right:8%;bottom:15%;text-align:right;pointer-events:none}.world-label span{font-size:9px;letter-spacing:3px;color:#b2d6c6}.world-label h2{font:400 25px 'Outfit',sans-serif;margin:10px 0}.world-label p{font-size:12px;color:#a9c4c2}footer{position:fixed;bottom:24px;left:4.6%;right:4.6%;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.8px;color:#90adad}#hud{position:fixed;top:105px;left:5%;right:5%;pointer-events:none;display:flex;justify-content:space-between}#hud[hidden]{display:none}#hud small{display:block;font-size:9px;letter-spacing:3px;color:#c2dad6}#score{font:500 56px 'Outfit',sans-serif}.hud-right{display:flex;align-items:flex-end;flex-direction:column;gap:12px;font-size:14px}#gems{color:#ffdd8c}#shield{font-size:11px;color:#b4e8f7}#toast{position:fixed;top:24%;width:100%;text-align:center;font:500 20px 'Outfit',sans-serif;pointer-events:none;text-shadow:0 2px 15px #102e36;transition:opacity .3s}.scrim{position:fixed;inset:0;z-index:5;background:#08262e70;backdrop-filter:blur(12px);display:grid;place-items:center}.scrim[hidden]{display:none}.dialog{width:min(390px,90vw);padding:34px;border:1px solid #ffffff25;background:#12333bee;border-radius:24px;text-align:center}.dialog .eyebrow{justify-content:center;font-size:9px}.dialog h2{font:500 40px 'Outfit',sans-serif;margin:20px 0 10px}.dialog p{color:#b8ceca;line-height:1.6;font-size:13px}#results{display:flex;justify-content:center;gap:55px;margin:24px 0}#results strong{font:500 43px 'Outfit',sans-serif;display:block}#results small{font-size:9px;letter-spacing:2px;color:#b4ccc7}.secondary{margin-top:15px;background:transparent;font-size:12px;color:#bfd5d0;padding:8px}.playing .brand small,.playing footer,.playing .world-label{display:none}@media(max-width:700px){header{padding:20px}.brand{font-size:23px}.brand small{display:none}.panel{left:7%;right:7%;top:49%;max-width:390px}h1{font-size:61px;letter-spacing:-3px}.panel p{font-size:14px}.eyebrow{font-size:8px;letter-spacing:1.8px}.modes button{min-width:0;flex:1;padding:12px}.world-label{display:none}footer{bottom:16px;justify-content:center}footer span:first-child{display:none}.record{margin-top:20px}#hud{top:90px}.tools button{width:39px;height:39px}}@media(max-height:690px){h1{font-size:54px;margin:16px 0}.panel p{margin-bottom:16px}.record{margin-top:14px}.panel{transform:translateY(-43%)}footer{display:none}}@media(prefers-reduced-motion:reduce){button{transition:none}}
[hidden]{display:none!important}

.modes button{min-width:0;flex:1;padding:12px 13px}.modes button span{line-height:1.4}.modes button[data-mode="expert"].selected{border-color:#f5bc88;background:#f5bc8818}#difficulty{font-size:11px;letter-spacing:.5px;color:#cfecb6}#difficulty[data-level="4"],#difficulty[data-level="5"],#difficulty[data-level="6"]{color:#ffca94}@media(max-width:380px){.modes button{padding:10px 8px;font-size:12px}.modes button span{font-size:9px}}