:root{color-scheme:dark;font-family:Segoe UI,Malgun Gothic,sans-serif;color:#e9e5d6;background:#101713}*{box-sizing:border-box}body{margin:0}header{height:65px;padding:12px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #334038}strong{letter-spacing:3px;font-family:Georgia,serif;font-size:19px}strong span{font:10px Segoe UI;color:#b7bb9b;letter-spacing:2px;margin-left:12px}small{display:block;color:#8e9b8b;margin-top:3px;font-size:10px}a{font-size:12px;color:#abb7a8;text-decoration:none}main{max-width:1600px;margin:auto}#field{height:calc(100dvh - 184px);min-height:360px;position:relative;overflow:hidden;background:#18241a}canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair;outline-offset:-3px}.field-note{position:absolute;top:18px;left:20px;font-size:11px;color:#e1e5cf;text-shadow:0 1px 3px #000;pointer-events:none;background:#111b13cb;padding:8px 12px;border-radius:4px}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#a8b980;margin-right:6px}.amber{color:#d8b975;margin-left:12px}#message{position:absolute;bottom:18px;left:20px;font-size:12px;background:#111b13d9;padding:8px 12px;border-radius:4px;max-width:70%;pointer-events:none}.zoom{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:5px;background:#111b13df;border:1px solid #53604a;border-radius:6px;padding:3px}.zoom button{border:0;background:transparent;min-width:38px;padding:6px}.zoom output{font-size:11px;width:36px;text-align:center}button{color:#eae5d6;background:#253327;border:1px solid #53604a;border-radius:5px;min-height:44px;padding:10px 18px;font:inherit;font-size:13px;cursor:pointer}button:hover{background:#394635}button:focus-visible{outline:2px solid #f1ce82;outline-offset:3px}.primary{background:#c5aa6c;color:#172016;border-color:#d4bb83;font-weight:700;min-width:145px}.primary:hover{background:#dfc285}.primary.active{background:#33483b;color:#e5d7b0}.controls{display:flex;gap:30px;align-items:center;padding:12px 24px;border-top:1px solid #43503c}.readout{display:flex;flex-direction:column;gap:4px;font-size:12px}.readout span{font-size:11px;color:#a3b29d}footer{padding:0 24px 10px;color:#93a08d;font-size:10px;display:flex;gap:8px 24px;flex-wrap:wrap}details{width:100%;max-width:850px}summary{cursor:pointer}details p{line-height:1.8} @media(max-width:600px){header{height:57px;padding:10px 14px}strong{font-size:15px;letter-spacing:2px}strong span{font-size:8px;margin-left:5px}header a{font-size:10px}#field{height:calc(100dvh - 236px);min-height:300px}.controls{padding:10px 12px;gap:10px;flex-wrap:wrap}.primary{min-width:135px}.readout{font-size:11px}.readout:last-child{flex-basis:100%;flex-direction:row;justify-content:space-between}footer{padding:0 12px 10px;gap:5px}.field-note{left:10px;top:10px;font-size:9px;padding:7px}.amber{margin-left:6px}#message{left:10px;bottom:12px;max-width:65%;font-size:10px}.zoom{right:10px;bottom:12px}}
:root .field-note{pointer-events:auto;max-width:calc(100% - 40px);display:flex;align-items:center;gap:8px;flex-wrap:wrap}.field-note select{font:inherit;background:#17251b;color:#e9e5d6;border:1px solid #53604a;border-radius:4px;max-width:310px;padding:5px;min-height:32px}.debug-toggle{display:flex;gap:3px;align-items:center;cursor:pointer}#loading{color:#c7c5a1;font-size:10px}#inspector{position:absolute;top:78px;left:20px;max-width:80%;font-size:10px;color:#ead6a3;background:#112015ed;padding:7px;pointer-events:none}canvas.loading{opacity:.45}#message{overflow-wrap:anywhere;max-height:35%;overflow:hidden}button:disabled{opacity:.5;cursor:wait}@media(max-width:600px){:root .field-note{left:10px;max-width:calc(100% - 20px);gap:5px}.field-note select{max-width:225px;font-size:10px}.debug-toggle{font-size:10px}#loading{flex-basis:100%;font-size:9px}#inspector{left:10px;top:100px;font-size:9px}small{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
#login{position:fixed;inset:0;background:#101713f5;z-index:20;display:grid;place-items:center}#login[hidden]{display:none}#login form{padding:28px;border:1px solid #75664a;border-radius:8px;max-width:90vw}#login label{display:block;margin:15px 0}input{font:inherit;padding:9px;background:#1b2b20;color:#eee;border:1px solid #667357}#stats,#connection,#away{padding:5px 20px;font-size:12px}#connection{color:#b6c29f}#away{color:#cabb96;font-size:10px}aside{position:fixed;right:18px;bottom:105px;max-height:55vh;overflow:auto;max-width:92vw;background:#142019f5;border:1px solid #ac9668;padding:18px;z-index:4;font-size:12px}aside p{margin:5px 0}aside button{margin:4px}#field{height:calc(100dvh - 265px)}.controls{gap:12px;flex-wrap:wrap}header button{padding:4px 10px;min-height:34px}.field-note label.debug-toggle{display:none}@media(max-width:600px){#field{height:calc(100dvh - 350px);min-height:300px}#stats{font-size:11px;padding:5px 12px}#away{font-size:9px}.controls button{padding:8px 12px}aside{bottom:150px}}

#loadError{position:absolute;inset:90px 12px auto;background:#172119f5;border:1px solid #c99965;padding:16px;z-index:6;overflow-wrap:anywhere;max-height:65%;overflow:auto;font-size:12px}#loadError[hidden]{display:none}