body[data-page=home] .site-content { width:min(1100px,calc(100% - 48px)); margin:0 auto; }
.home-simple-intro { text-align:center; padding:54px 0 28px; }
.home-simple-intro h1 { font-size:clamp(1.9rem,3vw,2.6rem); font-weight:750; letter-spacing:-.04em; }
.home-midi-form { display:flex; justify-content:center; align-items:center; gap:12px; max-width:900px; margin:0 auto; }
.home-midi-form label { margin:0; min-width:0; }
.home-upload { display:flex; align-items:center; gap:14px; flex:1; min-width:0; max-width:540px; }
.home-upload-label { flex-shrink:0; font-size:.85rem; font-weight:650; color:var(--ink); }
.home-midi-dropzone { flex:1; min-width:0; border-radius:10px; }
.home-midi-browse { display:flex; align-items:center; gap:12px; width:100%; min-height:46px; padding:9px 13px; border:1px dashed var(--border); text-align:left; }
.home-midi-browse svg { flex:0 0 22px; width:22px; height:22px; color:var(--accent); }
.home-midi-browse span { font-size:.85rem; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.home-midi-dropzone.is-dragging .home-midi-browse { border-color:var(--accent); background:var(--panel-soft); box-shadow:0 0 0 3px var(--accent); }
.home-midi-dropzone.is-dragging svg { transform:translateY(-2px); }
.home-midi-form>button { min-height:46px; padding:10px 22px; white-space:nowrap; }
.home-midi-status { margin:14px auto 0; text-align:center; font-size:.8rem; color:var(--danger); overflow-wrap:anywhere; }
.home-preview-panel { margin:38px auto 70px; padding:18px; border:1px solid var(--border); border-radius:20px; background:var(--card); }
.home-preview-heading { display:flex; align-items:center; justify-content:space-between; padding:0 5px 16px; }
.home-preview-heading h2 { margin:0; font-size:.9rem; font-weight:650; }
.home-preview-heading>div { display:flex; align-items:center; gap:12px; }
.home-preview-heading span { font-size:.75rem; color:var(--accent); }
.home-preview-heading>button { min-width:100px; padding:7px 22px; }
.home-preview-panel canvas { display:block; width:100%; height:auto; border-radius:10px; }
body[data-page=home] .site-footer { margin-top:0; }
.home-tool-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin:0 0 30px; }
.home-tool-grid article { display:flex; flex-direction:column; align-items:start; padding:28px; border:1px solid var(--border); border-radius:16px; background:var(--card); }
.home-tool-grid svg { width:34px; height:34px; color:var(--accent); margin-bottom:24px; }
.home-tool-grid h2 { font-size:1.35rem; margin:0 0 12px; }
.home-tool-grid p { color:var(--ink-soft); font-size:.9rem; margin:0 0 24px; }
.home-tool-grid a { margin-top:auto; font-size:.85rem; font-weight:650; text-decoration:none; }
.home-account-invite { display:flex; gap:24px; justify-content:space-between; align-items:center; padding:30px 0 65px; }
.home-account-invite h2 { font-size:1.4rem; margin:0 0 8px; }
.home-account-invite p { max-width:580px; margin:0; font-size:.85rem; color:var(--ink-soft); }
.home-account-actions { display:flex; gap:10px; flex-shrink:0; }.home-account-invite>a { flex-shrink:0; }
@media(max-width:800px) {
  body[data-page=home] .site-content { width:calc(100% - 28px); }
  .home-simple-intro { padding:40px 0 26px; }
  .home-midi-form { flex-wrap:wrap; gap:12px; }
  .home-midi-form>button { flex:1 1 100%; padding-inline:14px; font-size:.8rem; }
  .home-upload { flex:1 1 100%; max-width:none; }
  .home-upload { gap:10px; }.home-upload-label { font-size:.8rem; }.home-midi-browse { padding-inline:10px; gap:8px; }
  .home-preview-panel { padding:10px; border-radius:14px; margin-bottom:60px; }
  .home-preview-heading { padding:3px 3px 12px; }
  .home-tool-grid { grid-template-columns:1fr; gap:16px; }
  .home-tool-grid article { padding:24px; }.home-tool-grid svg { margin-bottom:18px; }
  .home-account-invite { align-items:start; flex-direction:column; padding:15px 0 50px; gap:20px; }
}