*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial}
.container{display:flex;height:100vh}
.sidebar{width:360px;overflow:auto;border-right:1px solid #ddd;padding:16px}
.viewer{flex:1;position:relative;background:#111}
#canvas{width:100%;height:100%}
.form label{display:block;margin-top:8px;color:#333}
.form input,.form select{width:100%;padding:8px;margin-top:4px;border:1px solid #ccc;border-radius:4px}
.row{display:flex;gap:8px}
.row input{flex:1}
#btnCalc{margin-top:12px;width:100%;padding:10px;background:#2563eb;color:#fff;border:none;border-radius:4px;cursor:pointer}
#btnCalc:hover{background:#1d4ed8}
.metrics h2{margin-top:16px;font-size:16px}
#metrics,#advice{font-family:Consolas,monospace;color:#222;white-space:pre-wrap}