:root{color-scheme:dark;font:15px/1.6 system-ui,"Malgun Gothic",sans-serif;color:#e7edf7;background:#10151f}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;gap:24px;padding:14px 24px;border-bottom:1px solid #30394c}h1{font-size:20px;margin:0}header span,.hint{color:#9aa9bf}a{color:#8dbdff}main{display:grid;grid-template-columns:minmax(0,1fr) 320px;min-height:calc(100vh - 65px)}#viewport{position:relative;min-height:540px;height:calc(100vh - 65px);overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:none}#status{position:absolute;top:16px;left:16px;right:16px;pointer-events:none;padding:8px 12px;background:#10151fd9;border-radius:6px}aside{padding:24px;background:#192130;border-left:1px solid #30394c}label{display:block;margin:10px 0 5px}#rename .row{margin:0}#rename input{flex:1;min-width:0}#names-token{width:100%}#rename-status,#file{margin:4px 0;overflow-wrap:anywhere}select,button,input{font:inherit;color:inherit;background:#263349;border:1px solid #52627a;border-radius:6px;padding:8px}select{width:100%}button{cursor:pointer}button:disabled,select:disabled{opacity:.5}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid #8dbdff;outline-offset:3px}.row{display:flex;gap:8px;margin:16px 0}fieldset{border:0;padding:0;margin:0;min-width:0}h2{font-size:16px;margin:24px 0 8px}.check{display:flex;align-items:center;gap:9px;overflow-wrap:anywhere}.hint,#description,#metrics{font-size:13px}#metrics{color:#a6d8ce}@media(max-width:760px){header{flex-wrap:wrap;gap:12px}header span{display:none}main{grid-template-columns:1fr}#viewport{height:55vh;min-height:320px}aside{border-left:0;border-top:1px solid #30394c}}
button.danger{background:#b3261e;border-color:#d9443b;color:#fff}button.danger:hover{background:#d0322a}
/* 버튼 글자는 줄바꿈하지 않고, 공간이 모자라면 버튼 단위로 다음 줄로 */
.row{flex-wrap:wrap;align-items:center}.row button{white-space:nowrap;flex:0 0 auto;padding:6px 12px}
