html,body{height:100%;min-height:0;box-sizing:border-box}body{display:flex;flex-direction:column;margin:0;padding:10px 14px 6px;gap:8px}body>header{flex:none;margin:0;padding:0;border:0}header h1{font-size:23px;margin:4px 260px 16px;text-align:center;min-height:36px}.toolbar{gap:6px;padding:8px;border-radius:12px;background:var(--card-bg);border:1px solid var(--border-color);justify-content:center}.tool-btn,.preset-select{padding:6px 9px;font-size:12px}body>.board-container{flex:1;min-height:0;display:flex;flex-direction:column;gap:8px;padding:10px}.staff-viewport{flex:1;min-height:0;height:auto!important}.grand-staff{position:absolute;top:0}.instructions{flex:none;margin:0;padding:6px;font-size:11px;line-height:1.4}body>footer{flex:none;margin:0!important;padding:3px!important;font-size:10px!important;line-height:14px!important}.symmetry-studio-brand{position:fixed;right:65px;top:14px;z-index:1000;display:flex;align-items:center;gap:8px;direction:ltr;min-height:38px;font:800 17px/1.2 system-ui;color:var(--text-color,#eef4fc);white-space:nowrap}.symmetry-studio-brand img{width:30px;height:30px}html body #spec-btn{position:fixed!important;top:14px!important;left:14px!important;right:auto!important;width:38px!important;height:38px!important}.symmetry-fullscreen{position:fixed;top:14px;left:64px;z-index:1001;padding:7px 12px;min-height:38px;border:1px solid #63c9ef;border-radius:9px;background:#17415e;color:#fff;font:700 13px system-ui;cursor:pointer}@media(max-width:700px){header h1{margin:62px 0 8px;font-size:20px}.symmetry-studio-brand{font-size:13px;gap:5px}.symmetry-studio-brand img{width:26px;height:26px}.toolbar{gap:4px;padding:5px}.tool-btn,.preset-select{padding:4px 6px;font-size:10px}.instructions{font-size:10px}}