:root{color-scheme:dark;font-family:system-ui,sans-serif}body{margin:0;background:#14151a;color:#e6e6e6}.root{display:flex;flex-direction:column;height:100vh}.topbar{display:flex;align-items:center;gap:24px;padding:10px 16px;background:#1d1f27;border-bottom:1px solid #2a2d38}.topbar h1{font-size:16px;margin:0;white-space:nowrap}.deeplink{display:flex;gap:8px;flex:1;min-width:0}.deeplink .bucket{width:140px}.deeplink .key{flex:1;min-width:0}.deeplink input{padding:6px 8px;background:#14151a;color:#e6e6e6;border:1px solid #2a2d38;border-radius:4px;font-family:monospace;font-size:12px}.deeplink button{padding:6px 16px}.session{display:flex;align-items:center;gap:10px;flex:none;white-space:nowrap}.session .whoami{font-size:12px;color:#9aa0ac}.session .logout{padding:6px 12px;background:#14151a;color:#cde;border:1px solid #2a2d38;border-radius:4px;cursor:pointer}.session .logout:hover{background:#23262f}.filenav{display:flex;align-items:center;gap:6px;flex:none}.filenav .arrow{padding:6px 8px;line-height:1;background:#14151a;color:#e6e6e6;border:1px solid #2a2d38;border-radius:4px;cursor:pointer}.filenav .arrow:disabled{opacity:.35;cursor:default}.filenav .filecount{min-width:60px;text-align:center;font-family:monospace;font-size:12px;color:#9aa0ac}.filenav .err{color:#e5735b}.filenav .spinner{display:inline-block;width:12px;height:12px;border:2px solid #2a2d38;border-top-color:#9aa0ac;border-radius:50%;animation:filenav-spin .7s linear infinite}@keyframes filenav-spin{to{transform:rotate(360deg)}}.app{display:grid;grid-template-columns:1fr 240px 280px;gap:16px;padding:16px;flex:1;min-height:0;box-sizing:border-box}.mid-column{display:flex;flex-direction:column;gap:16px;min-height:0}.mid-column>.panel{flex:1;min-height:0}main{display:flex;flex-direction:column;gap:12px;min-width:0;min-height:0}.spectrogram-layout{flex:1;display:grid;grid-template-columns:52px 1fr;grid-template-rows:1fr 24px;min-height:0;min-width:0}.spectrogram-layout>*{min-width:0;min-height:0}.y-axis{position:relative;grid-column:1;grid-row:1}.x-axis{position:relative;grid-column:2;grid-row:2}.y-axis .tick,.x-axis .tick{position:absolute;font-size:11px;color:#99a;white-space:nowrap}.y-axis .tick{right:6px;transform:translateY(50%)}.x-axis .tick{top:4px;transform:translate(-50%)}.axis-title{position:absolute;top:0;left:4px;font-size:10px;color:#667}.spectrogram{position:relative;grid-column:2;grid-row:1;background:#000;border-radius:6px;overflow:hidden;cursor:crosshair;touch-action:none}.spectrogram-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;image-rendering:pixelated}.grid{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:repeating-linear-gradient(to right,rgba(255,255,255,.12) 0 1px,transparent 1px 10%),repeating-linear-gradient(to top,rgba(255,255,255,.12) 0 1px,transparent 1px 10%)}.hover-tooltip{position:absolute;padding:2px 6px;background:#14151ad9;border:1px solid #2a2d38;border-radius:4px;color:#e6e6e6;font-size:11px;font-family:monospace;white-space:nowrap;pointer-events:none;z-index:2}.annot-box{position:absolute;border:1px solid;pointer-events:none;box-sizing:border-box}.annot-box.accept{border-color:#4ade80;background:#4ade8024}.annot-box.decline{border-color:#f87171;background:#f8717124}.annot-box.unsure{border-color:#fbbf24;background:#fbbf2424}.annot-box.drawing{border:1px dashed #fff;background:#ffffff1a}.annot-form{position:absolute;z-index:3;width:200px;max-width:90%;display:flex;flex-direction:column;gap:6px;padding:8px;background:#1d1f27f7;border:1px solid #3a3d48;border-radius:6px;cursor:default}.annot-form .annot-range{font-size:10px;color:#9aa;font-family:monospace}.annot-form .annot-user{font-size:11px;color:#8ad}.annot-form select,.annot-form input,.annot-form textarea{background:#14151a;color:#e6e6e6;border:1px solid #2a2d38;border-radius:4px;padding:4px 6px;font-size:12px;font-family:inherit;resize:vertical}.annot-form .annot-verdict{display:flex;gap:6px}.annot-form .annot-verdict button{flex:1;padding:4px;font-size:12px;background:#23262f;color:#bcd;border:1px solid #2a2d38;border-radius:4px;cursor:pointer}.annot-form .annot-verdict button.active.accept{background:#1d5c34;border-color:#4ade80;color:#eaffef}.annot-form .annot-verdict button.active.decline{background:#5c2323;border-color:#f87171;color:#ffeaea}.annot-form .annot-verdict button.active.unsure{background:#5c4a1d;border-color:#fbbf24;color:#fff7e6}.annot-form .annot-actions{display:flex;gap:6px}.annot-form .annot-actions button{flex:1;padding:5px;cursor:pointer}.annot-form .annot-actions .save{background:#2f6fdc;color:#fff;border:none;border-radius:4px}.panel .annots{list-style:none;margin:0;padding:0;font-size:12px}.panel .annots li{padding:6px 0;border-bottom:1px solid #2a2d38}.panel .annots .annot-head{display:flex;align-items:center;gap:6px}.panel .annots .badge{font-size:10px;text-transform:uppercase;padding:1px 5px;border-radius:3px}.panel .annots .badge.accept{background:#1d5c34;color:#eaffef}.panel .annots .badge.decline{background:#5c2323;color:#ffeaea}.panel .annots .badge.unsure{background:#5c4a1d;color:#fff7e6}.panel .annots .link{flex:1;text-align:left;background:none;border:none;color:#8ad;cursor:pointer;font-family:monospace;font-size:11px;padding:0}.panel .annots .del{background:none;border:none;color:#f87171;font-size:16px;line-height:1;cursor:pointer;padding:0 2px}.panel .annots .annot-label{color:#cde;margin-top:2px}.panel .annots .annot-comment{color:#bcd;margin-top:2px;word-break:break-word}.panel .annots .annot-meta{color:#778;font-size:11px;margin-top:2px}.playhead{position:absolute;top:0;bottom:0;width:2px;background:#ff4d4d;pointer-events:none}.selection{position:absolute;top:0;bottom:0;background:#ffffff2e;border-left:1px solid #fff;border-right:1px solid #fff;pointer-events:none}.controls{display:flex;align-items:center;gap:16px;flex-wrap:nowrap;min-height:32px;overflow:hidden}.controls button{padding:6px 16px}.controls .speed{color:#8ad}.controls .loop{color:#ad8}.controls .gain{display:flex;align-items:center;gap:6px}.view-controls{display:flex;align-items:center;gap:20px;font-size:13px;color:#bcd;flex-wrap:nowrap;min-height:28px}.view-controls label{display:flex;align-items:center;gap:6px}.view-controls label.disabled{opacity:.4}.freq-views{display:flex;gap:4px}.freq-views button{padding:4px 10px;font-size:12px;background:#2a2d38;color:#bcd;border:1px solid #3a3f4d;border-radius:4px;cursor:pointer}.freq-views button:hover{background:#353945}.freq-views button.active{background:#4a90d9;color:#fff;border-color:#4a90d9}.download{align-self:flex-start;padding:6px 16px;background:#2a2d38;color:#cde;text-decoration:none;border-radius:4px;font-size:13px}.download:hover{background:#353945}.panel{background:#1d1f27;border-radius:6px;padding:16px;overflow:auto}.panel.muted{color:#888}.panel-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 8px}.panel-header h2{margin:0}.annotate-sample{padding:4px 10px;font-size:12px;background:#2f6fdc;color:#fff;border:none;border-radius:4px;cursor:pointer}.threshold-slider{display:flex;align-items:center;gap:6px;font-size:12px;color:#9aa;white-space:nowrap}.confidence-slider{margin:12px 0 4px}.panel .row{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px solid #2a2d38}.panel dt{color:#9aa}.panel dd{margin:0;text-align:right}.panel dd.break-all{word-break:break-all;text-align:left}.panel .row.loc-position{flex-wrap:wrap;cursor:help}.panel .row.loc-position .loc-map{flex-basis:100%;width:100%;height:140px;border:0;border-radius:4px;margin-top:6px}.panel .detection{margin:0 0 10px;padding:6px 8px;background:#23262f;border-radius:4px}.panel .detection:last-child{margin-bottom:0}.panel h2{font-size:14px;margin:16px 0 8px}.panel h2:first-child{margin-top:0}.panel .subhead{font-size:12px;color:#9aa;margin:12px 0 4px}.panel .peaks{list-style:none;margin:0;padding:0;font-size:12px}.panel .peaks li{display:grid;grid-template-columns:18px auto auto 1fr auto;gap:8px;align-items:center;padding:4px 0 4px 6px;border-bottom:1px solid #2a2d38}.panel .peaks .rank{color:#667;text-align:right}.panel .peaks .freq{color:#cde;font-variant-numeric:tabular-nums}.panel .peaks .time{color:#9aa;font-family:monospace}.panel .peaks .bar{height:6px;border-radius:3px;background:#23262f;overflow:hidden}.panel .peaks .bar-fill{display:block;height:100%;border-radius:3px}.panel .peaks .db{font-family:monospace;font-variant-numeric:tabular-nums}.login{max-width:320px;margin:15vh auto;display:flex;flex-direction:column;gap:12px}.login input,.login button{padding:10px;font-size:16px}.message{padding:32px;text-align:center}.progress{width:240px;height:8px;margin:12px auto 0;background:#2a2d38;border-radius:4px;overflow:hidden}.progress-bar{height:100%;background:#4a90d9;transition:width .1s linear}.muted{color:#888}.error{color:#ff6b6b}.retry{margin-top:16px;padding:10px 20px;font-size:15px;cursor:pointer;background:#4a90d9;color:#fff;border:none;border-radius:4px}.retry:hover{background:#3a7bc0}.browser{padding:1rem 1.5rem}.crumbs{display:flex;flex-wrap:wrap;gap:.25rem;align-items:center;margin-bottom:.75rem}.crumb{background:none;border:none;color:#4a90d9;cursor:pointer;padding:.1rem .25rem;font:inherit}.crumb:hover{text-decoration:underline}.crumb:not(:last-child):after{content:"/";color:#888;margin-left:.25rem}table.tree{width:100%;border-collapse:collapse;font-size:.9rem}table.tree th,table.tree td{text-align:left;padding:.4rem .6rem;border-bottom:1px solid #2a2a2a}table.tree th:not(:first-child),table.tree td:not(:first-child){text-align:right}tr.folder-row{cursor:pointer}tr.folder-row:hover{background:#1f1f1f}.project-filters{display:flex;align-items:center;gap:6px;margin:.5rem 0}.project-filters button{padding:4px 10px;font-size:12px;background:#2a2d38;color:#bcd;border:1px solid #333;border-radius:4px;cursor:pointer}.project-filters button.active{background:#4a90d9;color:#fff;border-color:#4a90d9}.project-filters .start-reviewing{margin-left:auto;color:#4ade80;text-decoration:none;font-size:13px}.project-filters .start-reviewing:hover{text-decoration:underline}.pager{display:flex;align-items:center;gap:10px;margin-top:.75rem}.pager button{padding:4px 10px;cursor:pointer}.pager button:disabled{opacity:.4;cursor:default}.filelist{list-style:none;padding:0;margin:.5rem 0}.filelist li{padding:.3rem .6rem;border-bottom:1px solid #2a2a2a}.filelist li.unsure-row{background:#fbbf241a;border-left:3px solid #fbbf24}.filelist a{color:#4a90d9;text-decoration:none}.filelist a:hover{text-decoration:underline}button.explorer{margin-left:.5rem}button.explorer.active{background:#4a90d9;color:#fff;border-color:#4a90d9}.project-create{display:flex;flex-direction:column;gap:.5rem;max-width:480px;margin-bottom:1.5rem}.project-create input,.project-create textarea{padding:.5rem;font:inherit;background:#1a1a1a;color:inherit;border:1px solid #333;border-radius:4px}.project-create button{align-self:flex-start;padding:.5rem 1rem;cursor:pointer;background:#4a90d9;color:#fff;border:none;border-radius:4px}.project-create button:disabled{opacity:.6;cursor:default}.tour-highlight{position:fixed;z-index:1000;border:2px solid #4a90d9;border-radius:6px;box-shadow:0 0 0 9999px #0009;pointer-events:none;transition:top .15s ease,left .15s ease,width .15s ease,height .15s ease}.tour-tooltip{position:fixed;z-index:1001;width:280px;max-width:90vw;padding:14px;display:flex;flex-direction:column;gap:8px;background:#1d1f27;border:1px solid #3a3d48;border-radius:6px;box-shadow:0 4px 20px #0006}.tour-tooltip.centered{left:50%;top:50%;transform:translate(-50%,-50%)}.tour-tooltip h3{margin:0;font-size:15px}.tour-tooltip p{margin:0;font-size:13px;color:#bcd}.tour-tooltip .tour-progress{font-size:11px;color:#9aa0ac}.tour-tooltip .tour-actions{display:flex;justify-content:space-between;gap:8px;margin-top:4px}.tour-tooltip .tour-actions button{padding:6px 14px;font-size:13px;border-radius:4px;cursor:pointer}.tour-tooltip .tour-skip{background:none;border:1px solid #2a2d38;color:#9aa0ac}.tour-tooltip .tour-next{background:#4a90d9;color:#fff;border:none}.keyhelp-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100}.keyhelp{background:#1d1f27;border:1px solid #3a3d48;border-radius:8px;padding:20px 24px;max-width:90vw;max-height:80vh;overflow:auto}.keyhelp-title{font-size:15px;font-weight:600;margin-bottom:12px}.keyhelp table{border-collapse:collapse;margin-bottom:16px}.keyhelp td{padding:4px 10px;font-size:13px;border-bottom:1px solid #2a2d38}.keyhelp-keys{font-family:monospace;color:#4a90d9;white-space:nowrap}.keyhelp button{padding:6px 14px;background:#2f6fdc;color:#fff;border:none;border-radius:4px;cursor:pointer}.tags-topright{position:absolute;top:8px;right:8px;z-index:4;display:flex;flex-wrap:wrap;gap:4px;max-width:60%;justify-content:flex-end}.tag-chip{display:inline-flex;align-items:center;gap:4px;background:#2f6fdc40;border:1px solid #2f6fdc;color:#cfe0ff;border-radius:3px;padding:1px 6px;font-size:11px;white-space:nowrap}.tag-chip button{background:none;border:none;color:inherit;cursor:pointer;padding:0;font-size:12px;line-height:1}.tag-add{background:#2a2d38;color:#bcd;border:1px solid #444;border-radius:3px;width:20px;height:20px;line-height:1;cursor:pointer;font-size:13px}.tag-editor{position:absolute;top:calc(100% + 4px);right:0;z-index:5;width:220px;display:flex;flex-direction:column;gap:8px;padding:10px;background:#1d1f27fa;border:1px solid #3a3d48;border-radius:6px;cursor:default}.tag-editor-current{display:flex;flex-wrap:wrap;gap:4px}.tag-editor-add{display:flex;gap:6px}.tag-editor-add input{flex:1;background:#14151a;color:#e6e6e6;border:1px solid #2a2d38;border-radius:4px;padding:4px 6px;font-size:12px}.tag-editor-add button{background:#2f6fdc;color:#fff;border:none;border-radius:4px;padding:4px 10px;cursor:pointer;font-size:12px}.tag-editor-reuse{list-style:none;margin:0;padding:6px 0 0;max-height:140px;overflow-y:auto;border-top:1px solid #2a2d38}.tag-editor-reuse button{width:100%;text-align:left;background:none;border:none;color:#bcd;padding:3px 4px;font-size:12px;cursor:pointer;border-radius:3px}.tag-editor-reuse button:hover{background:#23262f}.tag-editor-close{align-self:flex-end;background:none;border:1px solid #2a2d38;color:#9aa0ac;border-radius:4px;padding:4px 10px;font-size:12px;cursor:pointer}.filelist .file-tags{display:inline-flex;flex-wrap:wrap;gap:4px;margin-left:6px}.tag-filter{display:flex;align-items:center;gap:6px;margin-bottom:.5rem}.tag-filter input{background:#14151a;color:#e6e6e6;border:1px solid #2a2d38;border-radius:4px;padding:4px 8px;font-size:12px;width:180px}.tag-filter button{background:none;border:1px solid #2a2d38;color:#9aa0ac;border-radius:4px;padding:3px 8px;font-size:12px;cursor:pointer}
