*{box-sizing:border-box;}
html,body{margin:0;height:100%;font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg-0);color:var(--text-0);}
#app-root{display:flex;flex-direction:column;height:100vh;}
#app-header{display:flex;align-items:center;justify-content:space-between;padding:0.75rem 1.5rem;
  background:var(--bg-1);border-bottom:1px solid var(--glass-border);}
.logo{font-size:1.1rem;margin:0;} .logo span{color:var(--accent);font-weight:300;margin-left:.4rem;}
#theme-toggle{cursor:pointer;font-size:1.4rem;padding:.3rem .6rem;border-radius:.6rem;}
#theme-toggle:hover{background:var(--glass);}
#screen-container{flex:1;overflow:auto;position:relative;}
.screen{width:100%;height:100%;padding:1rem;display:grid;}
.home-screen{grid-template-rows:auto 1fr;place-items:center;position:relative;overflow:hidden;}
.home-menu{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.8rem;
  max-width:1100px;width:100%;z-index:2;padding:1rem;}
.build-screen{grid-template-columns:220px 1fr 260px;gap:.8rem;height:100%;}
#bike-canvas-wrap{position:relative;border-radius:1rem;overflow:hidden;background:var(--bg-2);}
#bike-canvas{width:100%;height:100%;display:block;}
#parts-tray,#inspector-panel{overflow-y:auto;padding:.8rem;border-radius:1rem;}
@media (max-width:900px){.build-screen{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;}}