:root{color-scheme:dark;font:16px system-ui;background:#131a1c;color:#dbe7e7}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px;border-bottom:1px solid #40535a}a{color:#88d3de;font-size:14px}button,select,input[type=number]{background:#22343a;color:inherit;border:1px solid #506770;border-radius:4px;padding:8px;font:inherit}button{cursor:pointer}button:hover{background:#37545d}main{display:grid;grid-template-columns:230px minmax(350px,1fr) 280px;height:calc(100vh - 115px)}aside{padding:16px;overflow:auto;border-right:1px solid #40535a}label{display:block;font-size:14px;margin:12px 0}select{display:block;width:100%;margin-top:5px}input[type=number]{width:100%;margin-top:5px}input[type=range]{accent-color:#6bc9dd;width:100%}h2{font-size:18px}p{font-size:14px;line-height:1.5;color:#9fb2b7}.viewport{display:flex;flex-direction:column;min-width:0}#stage{flex:1;min-height:360px;overflow:hidden}footer{display:flex;gap:8px;align-items:center;padding:12px}footer input{min-width:30px}output{font-size:14px;padding:10px;white-space:pre-line}#status{font-size:14px;color:#8edbd0}@media(max-width:1000px){main{grid-template-columns:180px minmax(320px,1fr);height:auto}.viewport{min-height:560px}main>aside:last-child{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:16px}header{gap:8px}button{font-size:14px}}
#stage{position:relative}#stage canvas{position:absolute;inset:0;display:block}.viewport{height:calc(100vh - 135px);min-height:500px}
#hud-editor{padding:20px;border-top:1px solid #40535a}.hud-tools{display:flex;gap:14px;flex-wrap:wrap;align-items:center}#hud-fields{display:flex;gap:12px}#hud-fields label{max-width:140px}#hud-frame{height:600px;border:1px solid #40535a;max-width:100%;display:block;margin:20px auto;background:#172226}
@media(min-width:851px){main{grid-template-columns:180px minmax(300px,1fr) 240px;height:calc(100vh - 115px)}main>aside:last-child{grid-column:auto;display:block}aside{max-height:calc(100vh - 115px)}}
#hud-editor{overflow-x:auto}#hud-frame{max-width:none}input[type=text],#hud-name{background:#22343a;color:#dbe7e7;border:1px solid #506770;border-radius:4px;padding:8px;max-width:100%}
.coordinate-pair{min-width:0;margin:12px 0;padding:10px;border:1px solid #40535a;border-radius:6px}.coordinate-pair legend{font-size:13px;color:#a9dfe6}.coordinate-pad{display:grid;grid-template-columns:repeat(3,36px);grid-template-rows:repeat(2,34px);gap:4px;width:max-content;margin:4px auto;outline-offset:4px}.coordinate-pad:focus-within{outline:2px solid #6bc9dd}.coordinate-pad button{padding:0;font-size:21px}.coordinate-pad [data-direction=ArrowUp]{grid-column:2;grid-row:1}.coordinate-pad [data-direction=ArrowLeft]{grid-column:1;grid-row:2}.coordinate-pad [data-direction=ArrowDown]{grid-column:2;grid-row:2}.coordinate-pad [data-direction=ArrowRight]{grid-column:3;grid-row:2}.coordinate-readout{display:block;text-align:center;padding:5px;font-size:12px}.coordinate-pair small{display:block;font-size:11px;line-height:1.4;color:#9fb2b7}.coordinate-values{display:grid;grid-template-columns:1fr 1fr;gap:8px}.coordinate-values label{min-width:0;font-size:12px}.coordinate-values input{min-width:0}#hud-fields .coordinate-pair{width:280px;flex-shrink:0}
#weapon-orientation button,#linked-sides button{width:100%;margin:4px 0;font-size:12px}#weapon-orientation .stance-presets{display:flex;gap:5px}#weapon-orientation input[type=checkbox],#linked-sides input{accent-color:#6bc9dd}#weapon-orientation legend{color:#e3c78c}#weapon-orientation{border-color:#7e704f}#tip-angle:disabled{opacity:.5}
#outfit-preview button,.effect-presets button{width:100%;margin:4px 0;font-size:12px}#outfit-preview{border-color:#627a4d}#outfit-preview legend{color:#b8cba0}