:root{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:#e3ece1;background:#184d60;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden}#map{position:fixed;inset:0;width:100%;height:100%;display:block;image-rendering:pixelated;outline-offset:-4px}.hud{position:fixed;background:#142b2be8;border:1px solid #80988b40;box-shadow:0 6px 24px #071d2333;border-radius:8px;backdrop-filter:blur(12px)}.topbar{top:20px;left:20px;display:flex;align-items:center;gap:18px;padding:10px 14px}h1{font-size:14px;letter-spacing:3px;margin:0;white-space:nowrap}h1 span{color:#b5d391;font-size:22px;vertical-align:middle;margin-right:7px}form{display:flex;align-items:center;gap:8px}form label{font-size:9px;color:#8ea99f;letter-spacing:1px}input:not([type=range]){width:145px;background:#0e2428;border:1px solid #52746b66;border-radius:4px;padding:8px;color:#c8d9c4;font:inherit;font-size:11px}button{font:inherit;font-size:11px;color:#d7e6ca;background:#335548;border:1px solid #799d6659;border-radius:4px;padding:8px 10px;cursor:pointer}button:hover{background:#426854}button:active{transform:translateY(1px)}:focus-visible{outline:2px solid #e9d99e;outline-offset:3px}.rules{top:20px;right:20px;width:268px;max-height:calc(100dvh - 110px);overflow:auto;scrollbar-width:thin}summary{padding:16px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:2px;font-weight:700;cursor:pointer;list-style:none}summary::-webkit-details-marker{display:none}summary span{font-size:16px;color:#9fb393}.rules[open] summary{border-bottom:1px solid #80988b26}.rules:not([open]) summary span{transform:rotate(-90deg)}.rules-content{padding:0 16px 12px}.hint{font-size:9px;line-height:1.6;color:#96aca0}.intro{margin:14px 0 20px}.rule{margin-bottom:17px}.rule>div{display:flex;align-items:center;justify-content:space-between;gap:12px}.rule label{font-size:11px}.rule output{font-size:10px;color:#c4dba5;font-variant-numeric:tabular-nums}input[type=range]{width:100%;margin:10px 0 0;accent-color:#b9cd88;height:13px;cursor:pointer}.rule p{font-family:system-ui,sans-serif;font-size:10px;line-height:1.4;color:#92a79f;margin:5px 0 0}#reset{width:100%;background:transparent;border-color:#78968960}.compass{position:fixed;left:25px;top:100px;font-size:12px;color:#c0d4cb;text-align:center;pointer-events:none;line-height:1.5}.compass span{display:block;font-size:25px}.readout{left:20px;bottom:20px;padding:12px 14px;display:flex;align-items:center;gap:10px;font-size:10px;min-height:40px}.live-dot{width:6px;height:6px;flex-shrink:0;border-radius:50%;background:#b3cb8a}#land{color:#9db293;border-left:1px solid #6f8e7759;padding-left:12px;margin-left:4px}.legend{right:20px;bottom:20px;display:flex;gap:12px;padding:13px;font-size:9px;color:#b6c9ba}.legend-item{display:flex;align-items:center;gap:5px}.swatch{width:8px;height:8px;border-radius:2px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:1000px){.legend{bottom:70px;left:20px;right:auto}.topbar{gap:10px}.rules{top:85px}}@media(max-width:600px){.topbar{top:10px;left:10px;right:10px;padding:8px;gap:8px;flex-wrap:wrap}h1{font-size:11px;letter-spacing:2px}h1 span{font-size:17px;margin-right:3px}form{flex:1;gap:4px}form label{display:none}input:not([type=range]){width:100%;min-width:60px}button{padding:8px}#random span{display:none}.rules{top:70px;right:10px;width:245px;max-height:calc(100dvh - 140px)}.readout{left:10px;right:10px;bottom:10px;flex-wrap:wrap;font-size:9px;padding:10px;gap:7px}.legend{left:10px;bottom:65px;gap:8px;flex-wrap:wrap;max-width:calc(100vw - 20px);padding:9px;font-size:8px}.compass{left:17px;top:82px}#land{margin-left:auto}}
.learn-link{font-size:10px;color:#c7dba9;text-decoration:none;white-space:nowrap}.learn-link:hover{text-decoration:underline}