:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#111513;color:#e2e5de;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 42%,#1b231e 0,transparent 55%)}main{max-width:480px;margin:auto;padding:max(24px,env(safe-area-inset-top)) 26px max(22px,env(safe-area-inset-bottom));min-height:100svh}button,input{-webkit-tap-highlight-color:transparent;font:inherit}button{cursor:pointer;color:inherit;background:none;border:0;min-height:44px;padding:10px;border-radius:10px}button:focus-visible,input:focus-visible,#orb:focus-visible{outline:2px solid #c4d4bb;outline-offset:5px}button:disabled{opacity:.28;cursor:default}header{display:flex;align-items:center;justify-content:space-between}.brand{font-size:10px;letter-spacing:2.8px;color:#9fa89d}#sound{font-size:11px;color:#a4ada2;border:1px solid #303930;border-radius:24px;padding:6px 13px;min-height:36px}.heading{text-align:center;margin-top:33px}#mode{font-size:9px;letter-spacing:2.6px;color:#939e91;margin:0 0 5px}#place{font-size:26px;font-weight:350;max-width:100%;overflow-wrap:anywhere}#stamp{font-size:12px;color:#899385;margin-top:4px}#orb{position:relative;touch-action:none;user-select:none;-webkit-user-select:none;aspect-ratio:1;margin:8px -12px 0;cursor:grab}#orb svg{width:100%;height:100%;overflow:visible}.orb-label{position:absolute;bottom:6%;left:0;right:0;text-align:center;font-size:8px;letter-spacing:2.8px;color:#8d9b89;pointer-events:none}.history-nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:-3px;font-size:10px;color:#9ca696}.history-nav button{font-size:20px;min-width:44px}.rating-head{display:flex;justify-content:space-between;margin:16px 0 10px;font-size:14px;font-weight:350}.rating-head span{color:#929e8c;font-size:12px}.rating-head b{color:#dce6d5;font-size:20px;font-weight:400}input[type=range]{width:100%;margin:0;height:28px;accent-color:#c7d5bc;touch-action:pan-y;background:transparent}input[type=range]::-webkit-slider-runnable-track{height:2px;background:#58644f}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:-7px;width:16px;height:16px;border-radius:50%;background:#dce6d2}input[type=range]{-webkit-appearance:none}.ticks,.ends{display:flex;justify-content:space-between;color:#818e7b;font-size:10px;margin-top:5px}.ends{font-size:9px;margin-top:10px}.hint{text-align:center;font-size:10px;line-height:1.8;color:#8d9987;margin:21px 0}footer{display:flex;gap:8px;transition:opacity .15s;justify-content:space-between}body.rotating footer{opacity:0;pointer-events:none}.primary{background:#cbd7c0;color:#192016;padding:14px 18px;border-radius:26px;font-size:12px}.secondary{border:1px solid #394435;border-radius:26px;font-size:11px;padding:12px 15px}#message{text-align:center;min-height:20px;color:#bcccb0;font-size:12px;line-height:1.6}h1{font-size:27px;font-weight:350}.stat-top{display:flex;align-items:center;justify-content:space-between;margin-top:24px}.stat-top button{font-size:12px}.muted,.privacy{font-size:12px;color:#99a491;line-height:1.7}.privacy{margin-top:28px;font-size:10px}.row{display:block;width:100%;text-align:left;border:1px solid #43513c;background:#d3e7be06;margin:12px 0;padding:16px;border-radius:10px}.row-top{display:flex;justify-content:space-between;font-size:10px;color:#a8b09f}.row-place{font-size:15px;margin:10px 0;overflow-wrap:anywhere}.bar{height:3px;background:#c3d7b260;border-radius:4px}.empty{padding:48px 10px;text-align:center;color:#aab59f;line-height:1.8;font-size:14px}dialog{background:#1a211b;color:#dce3d7;border:1px solid #4c5846;border-radius:20px;padding:24px;width:calc(100% - 36px);max-width:420px}dialog::backdrop{background:#000a}dialog h2{font-size:23px;font-weight:400}dialog label{font-size:12px}dialog input{width:100%;background:#10170f;color:#e2e5de;border:1px solid #4a5743;border-radius:8px;padding:14px;margin-top:10px;font-size:16px}dialog p{font-size:12px;line-height:1.6;color:#a7b39e}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}[hidden]{display:none!important}@media(min-width:700px){main{margin:30px auto;border:1px solid #30392e;border-radius:32px;min-height:850px}}@media(max-height:740px){.heading{margin-top:12px}#orb{max-width:290px;margin:0 auto}.hint{margin:12px 0}.rating-head{margin-top:5px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Мягкий оттенок морской волны вокруг рельефа. */
#orb{background:radial-gradient(ellipse at 50% 46%,transparent 35%,#4aaca70d 51%,#42bdb50a 61%,transparent 73%)}
