*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#1a1a1a;background:#f5f5f5;padding:24px;font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Meiryo,sans-serif}h1{margin-bottom:8px;font-size:24px}.subtitle{color:#888;margin-bottom:24px;font-size:14px}.nav-bar{gap:8px;margin-bottom:24px;display:flex}.nav-bar a{color:#1a1a1a;background:#fff;border:1px solid #ddd;border-radius:6px;padding:6px 16px;font-size:13px;text-decoration:none;transition:all .15s}.nav-bar a:hover{color:#6366f1;border-color:#6366f1}.nav-bar a.active{color:#fff;background:#6366f1;border-color:#6366f1}.upload-section{flex-wrap:wrap;align-items:center;gap:24px;margin-bottom:32px;display:flex}.dropzone{text-align:center;cursor:pointer;background:#fff;border:2px dashed #ccc;border-radius:12px;flex-shrink:0;padding:32px 40px;transition:border-color .15s,background .15s}.dropzone:hover,.dropzone.drag-over{background:#f8f7ff;border-color:#6366f1}.dropzone h2{margin-bottom:4px;font-size:16px}.dropzone p{color:#888;font-size:13px}.preview-img{border:1px solid #ddd;border-radius:8px;max-width:200px;max-height:200px;display:none}.text-input-section{margin-bottom:32px}.text-input-section textarea{resize:vertical;border:1px solid #ddd;border-radius:8px;width:100%;max-width:600px;min-height:80px;padding:12px;font-family:inherit;font-size:14px}.text-input-section textarea:focus{border-color:#6366f1;outline:none}.btn-primary{color:#fff;cursor:pointer;background:#6366f1;border:none;border-radius:8px;padding:10px 24px;font-size:14px;font-weight:600;transition:background .15s}.btn-primary:hover{background:#4f46e5}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-sm{cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:6px;padding:6px 14px;font-size:12px;transition:all .15s}.btn-sm:hover{color:#6366f1;border-color:#6366f1}.results-grid{gap:16px;display:none}.results-grid.visible{display:grid}.results-grid.cols-2{grid-template-columns:repeat(2,1fr)}.results-grid.cols-3{grid-template-columns:repeat(3,1fr)}@media (max-width:900px){.results-grid.cols-2,.results-grid.cols-3{grid-template-columns:1fr}}.card{background:#fff;border:1px solid #e0e0e0;border-radius:12px;flex-direction:column;gap:8px;padding:16px;display:flex}.card h3{align-items:center;gap:8px;font-size:16px;display:flex}.badge{color:#166534;background:#e8fde8;border-radius:4px;padding:2px 8px;font-size:11px;font-weight:400}.badge.warn{color:#92400e;background:#fef3c7}.card-status{color:#888;min-height:18px;font-size:13px}.card-status.error{color:#e53e3e}.card-metrics{color:#6366f1;min-height:18px;font-size:13px;font-weight:600}.canvas-container{aspect-ratio:1;background:#f0f0f0;border-radius:8px;width:100%;position:relative;overflow:hidden}.canvas-container canvas{object-fit:contain;width:100%;height:100%;display:block}.image-container{aspect-ratio:16/9;background:#f0f0f0;border-radius:8px;justify-content:center;align-items:center;width:100%;display:flex;overflow:hidden}.image-container img{object-fit:contain;max-width:100%;max-height:100%}.image-container .placeholder{color:#aaa;font-size:13px}.audio-player,.audio-player audio{width:100%}.waveform-canvas{background:#f8f8f8;border-radius:6px;width:100%;height:80px}.card-actions{flex-wrap:wrap;gap:8px;display:flex}.memo-field{resize:vertical;border:1px solid #e0e0e0;border-radius:6px;width:100%;min-height:48px;padding:8px;font-family:inherit;font-size:13px}.memo-field:focus{border-color:#6366f1;outline:none}.memo-field::placeholder{color:#bbb}.empty-state{text-align:center;color:#888;background:#fff;border:1px dashed #ddd;border-radius:12px;padding:48px 24px;font-size:14px}.save-panel{background:#fff;border:1px solid #e0e0e0;border-radius:12px;margin-top:32px;padding:24px}.save-panel h2{margin-bottom:16px;font-size:18px}.save-title-row{margin-bottom:16px}.save-title-row label{color:#888;margin-bottom:4px;font-size:13px;display:block}.save-title-row input{border:1px solid #ddd;border-radius:6px;width:100%;max-width:400px;padding:8px 12px;font-family:inherit;font-size:14px}.save-title-row input:focus{border-color:#6366f1;outline:none}.save-candidates{flex-direction:column;gap:12px;margin-bottom:16px;display:flex}.save-candidate-row{border:1px solid #e0e0e0;border-radius:8px;padding:12px}.save-candidate-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.save-candidate-name{font-size:14px;font-weight:500}.btn-select{cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:6px;padding:4px 12px;font-size:12px;transition:all .15s}.btn-select:hover{color:#16a34a;border-color:#16a34a}.btn-select.selected{color:#fff;background:#16a34a;border-color:#16a34a}.save-actions{align-items:center;gap:12px;display:flex}.slider-compare{aspect-ratio:16/9;cursor:col-resize;border-radius:8px;width:100%;margin-bottom:16px;display:none;position:relative;overflow:hidden}.slider-compare.visible{display:block}.slider-compare img{object-fit:contain;width:100%;height:100%;position:absolute;top:0;left:0}.slider-compare .slider-overlay{width:50%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.slider-compare .slider-overlay img{width:200%;max-width:none}.slider-compare .slider-handle{background:#6366f1;width:3px;height:100%;position:absolute;top:0;left:50%;transform:translate(-50%)}.slider-compare .slider-handle:after{content:"⟷";color:#fff;background:#6366f1;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:14px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
