*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:#fafafa}body{color:#333;line-height:1.6}#app{max-width:1400px;margin:0 auto;padding:20px}header{text-align:center;margin-bottom:30px;border-bottom:2px solid #e0e0e0;padding-bottom:20px}header h1{margin:0;color:#333;font-size:2em}.subtitle{margin:10px 0 0;color:#666;font-size:1.1em}main{display:flex;flex-direction:column;gap:30px}.controls{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.btn{padding:12px 24px;font-size:1em;border:none;border-radius:6px;cursor:pointer;transition:all .3s ease;font-weight:500}.btn-primary{background-color:#007bff;color:#fff}.btn-primary:hover{background-color:#0056b3;transform:translateY(-2px);box-shadow:0 4px 12px #0056b34d}.btn-secondary{background-color:#6c757d;color:#fff}.btn-secondary:hover:not(:disabled){background-color:#5a6268;transform:translateY(-2px);box-shadow:0 4px 12px #5a62684d}.btn:disabled{opacity:.6;cursor:not-allowed}.plot-container{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:10px;box-shadow:0 2px 8px #0000001a}.annotation-container{background:#fff;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #0000001a}.annotation-header{display:flex;justify-content:space-between;align-items:center;padding:16px;background-color:#f5f5f5;border-bottom:1px solid #e0e0e0;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .2s ease}.annotation-header:hover{background-color:#eee}.annotation-header h3{margin:0;font-size:1.1em;color:#333}.toggle-icon{font-size:.8em;color:#666}.annotation-json{padding:16px;background:#fafafa;max-height:500px;overflow-y:auto}.file-name{margin:0 0 12px;font-size:.9em;color:#666;font-weight:500}.annotation-json pre{margin:0;padding:12px;background:#fff;border:1px solid #ddd;border-radius:4px;font-size:.85em;line-height:1.4;overflow-x:auto;color:#333}.info{text-align:center;padding:20px;background-color:#f8f9fa;border-radius:6px;color:#666;font-size:.95em}.info p{margin:0}.placeholder{color:#999;font-style:italic}.hidden{display:none}@media(max-width:768px){#app{padding:15px}header h1{font-size:1.5em}.controls{flex-direction:column}.btn{width:100%}#plot{height:400px!important}}.missalign-warn{background-color:#ffa5004d;border-left:4px solid orange;padding:8px 12px}.missalign-error{background-color:#ff00004d;border-left:4px solid red;padding:8px 12px}