:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#eef0f7;background:#090b10;font-synthesis:none}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;overflow-x:hidden;background:radial-gradient(ellipse 600px 430px at 50% 34%,#181624 0%,#0d0e16 52%,#090b10 100%)}
button,input{font:inherit}
button{cursor:pointer;border:0}
a{color:inherit;text-decoration:none}
[hidden]{display:none!important}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.topbar{height:76px;max-width:1240px;margin:auto;padding:0 36px;display:flex;align-items:center;justify-content:space-between}
.brand{font-size:20px;font-weight:750;letter-spacing:-.04em}
.brand span{color:#b5a4ff;padding:0 2px}
.swagger-link{display:inline-flex;align-items:center;gap:13px;background:#20202c;border-radius:12px;padding:10px 16px;font-size:14px;font-weight:600;transition:background .18s,transform .18s}
.swagger-link span{font-size:18px;color:#b9aafa;line-height:1}
main{max-width:1150px;padding:0 24px 100px;margin:auto}
.search-area{text-align:center;padding-top:28px}
h1{font-size:clamp(36px,5vw,56px);letter-spacing:-.055em;line-height:1.08;font-weight:750;margin:0}
.instruction{max-width:650px;margin:18px auto 0;color:#a9aabb;line-height:1.55;font-size:16px}
.instruction-first{white-space:nowrap}
.stage{width:min(720px,100%);height:360px;margin:23px auto 0;position:relative;display:flex;justify-content:center;align-items:center;overflow:hidden;background:radial-gradient(ellipse 45% 48% at 50% 60%,#34304977 0%,transparent 100%),#171923;border-radius:28px;box-shadow:0 26px 75px #0004;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;transition:transform .18s,box-shadow .18s,background-color .18s}
.stage *{user-select:none;-webkit-user-select:none}
.stage::before{content:"";position:absolute;inset:12px;border:2px dashed #666377;border-radius:20px;pointer-events:none}
.stage.has-image::before{display:none}
.stage:not(.has-image){cursor:pointer}
.stage.dragging{background:radial-gradient(ellipse 48% 50% at 50% 60%,#6e5f9c99 0%,transparent 100%),#222030}
.stage.dragging::before{border-color:#b6a2ff}
.animation{position:absolute;width:min(340px,80%);height:100%;display:flex;align-items:center;justify-content:center;transform:translateY(-30px);transition:opacity .2s}
.animation svg{width:100%!important;height:100%!important}
.stage.has-image .animation{opacity:0}
.stage-help{position:absolute;bottom:22px;display:flex;align-items:center;flex-direction:column;gap:4px;pointer-events:none}
.stage-hint{color:#d8d4e6;font-size:18px;font-weight:600}
.stage-formats{color:#a9a5b8;font-size:14px}
.stage.has-image .stage-help{display:none}
.image-editor{position:relative;z-index:1;max-width:100%;max-height:100%;user-select:none;touch-action:none;cursor:crosshair;box-shadow:0 22px 70px #0008;border-radius:14px;overflow:hidden}
.image-editor img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}
.crop-selection{position:absolute;z-index:2;background:#8f7ff548;box-shadow:inset 0 0 0 2px #bcaeff,0 0 16px #9e8eff66;pointer-events:none}
.crop-handle{position:absolute;width:15px;height:15px;background:#c8baff;border-radius:4px;box-shadow:0 2px 8px #0008;pointer-events:auto}
.crop-handle.nw{left:0;top:0;transform:translate(-50%,-50%);cursor:nwse-resize}
.crop-handle.n{left:50%;top:0;transform:translate(-50%,-50%);cursor:ns-resize}
.crop-handle.ne{right:0;top:0;transform:translate(50%,-50%);cursor:nesw-resize}
.crop-handle.e{right:0;top:50%;transform:translate(50%,-50%);cursor:ew-resize}
.crop-handle.se{right:0;bottom:0;transform:translate(50%,50%);cursor:nwse-resize}
.crop-handle.s{left:50%;bottom:0;transform:translate(-50%,50%);cursor:ns-resize}
.crop-handle.sw{left:0;bottom:0;transform:translate(-50%,50%);cursor:nesw-resize}
.crop-handle.w{left:0;top:50%;transform:translate(-50%,-50%);cursor:ew-resize}
.remove-image{position:absolute;z-index:3;right:18px;top:18px;width:38px;height:38px;border-radius:12px;background:#252736db;color:#f3f1ff;font-size:26px;line-height:1;display:grid;place-items:center;transition:background .18s}
.crop-hint{font-size:13px;color:#888b9f;margin:5px 0 0}
.actions{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;margin-top:20px}
.actions button{width:min(340px,100%)}
.actions button,.export-button{min-height:46px;border-radius:12px;padding:11px 19px;font-weight:650;font-size:14px;transition:background .18s,transform .18s}
.upload-button,.clear-crop,.export-button{background:#21232f;color:#e9e9f2}
.search-button{background:#a997f5;color:#17111f}
.search-button:disabled{opacity:.6;cursor:not-allowed;transform:none}
.search-button.busy{cursor:wait}
.search-button span{margin-left:10px;font-size:18px;line-height:0}
.status-message{min-height:22px;color:#b7a7ff;margin:14px auto 0;font-size:13px}
.status-message.error{color:#ff9da4}
.search-warning{width:min(720px,100%);margin:14px auto 0;padding:11px 14px;border-radius:11px;background:#342c22;color:#f0c989;text-align:left;font-size:13px;line-height:1.45}
.results{max-width:1000px;margin:70px auto 0;scroll-margin-top:30px}
.results-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}
h2{font-size:clamp(26px,3vw,36px);letter-spacing:-.045em;margin:0 0 8px}
.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:20px 0 26px}
.metric{background:#191b26;border-radius:12px;padding:13px 16px;display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.metric-label{color:#9a9caf;font-size:12px}
.metric-value{color:#f0eff9;font-size:15px;font-weight:700;white-space:nowrap}
.result-grid{display:flex;flex-direction:column;gap:12px}
.result-card{display:flex;align-items:stretch;min-height:160px;background:#191b26;border-radius:16px;overflow:hidden}
.result-photo{display:block;width:240px;height:160px;object-fit:cover;background:#11131c;flex:none}
.result-info{display:flex;flex:1;min-width:0;flex-direction:column;justify-content:space-between;gap:14px;padding:20px}
.result-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.result-details{min-width:0}
.rank{font-size:13px;font-weight:750;color:#baaaff}
.result-id-row,.dataset-id-row{display:flex;align-items:center;gap:8px;min-width:0;margin-top:5px}
.result-id,.dataset-id-row span{font-size:12px;color:#c6c5d4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.copy-id{display:grid;place-items:center;width:28px;height:28px;flex:none;padding:0;border:0;border-radius:7px;background:#2b2c3b;color:#ddd6fa;cursor:pointer}
.copy-id svg{display:block;width:19px;height:19px}
.copy-id.copied{color:#90e3b6}
.result-score{flex:none;font-size:15px;font-weight:700;color:#e8eaf6}
.result-status{align-self:flex-start;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:700}
.result-status.accepted{background:#15392a;color:#90e3b6}
.result-status.rejected{background:#482329;color:#ffadb4}
:focus-visible{outline:2px solid #bcaeff;outline-offset:3px}
@media(hover:hover) and (pointer:fine) and (min-width:701px){.swagger-link:hover{background:#303044;transform:translateY(-2px)}.stage:not(.has-image):hover{transform:translateY(-3px);box-shadow:0 32px 88px #0007,0 0 0 4px #9c8ae51f}.stage:not(.has-image):hover::before{border-color:#a89bc7}.stage:not(.has-image):active{transform:translateY(0) scale(.99);box-shadow:0 17px 50px #0006;background-color:#222335}.stage:not(.has-image):active::before{border-color:#c6b5ff}.remove-image:hover{background:#45445c}.copy-id:hover{background:#303044;color:#f0eff9}.actions button:hover,.export-button:hover{transform:translateY(-2px)}.upload-button:hover,.clear-crop:hover,.export-button:hover{background:#313445}.search-button:hover{background:#c0b2ff}}
@media(hover:none),(pointer:coarse),(max-width:700px){a,button,.stage,.stage *{-webkit-tap-highlight-color:transparent}a:active,a:focus{text-decoration:none}.stage:not(.has-image):active{transform:none;box-shadow:0 26px 75px #0004}}
@media(max-width:700px){.topbar{height:64px;padding:0 18px}.brand{font-size:18px}.swagger-link{font-size:13px;padding:9px 12px}main{padding:0 16px 65px}.search-area{padding-top:26px}.instruction{font-size:14px}.stage{height:330px;margin-top:16px}.animation{width:min(270px,90%);transform:translateY(-35px)}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{padding:10px;flex-direction:column;gap:5px}.result-card{min-height:135px}.result-photo{width:185px;height:135px}.result-info{padding:12px}.results-heading{align-items:start;flex-direction:column}}
@media(max-width:450px){.instruction{font-size:clamp(10.5px,3.65vw,13px)}.stage{height:290px}.animation{width:230px;transform:translateY(-38px)}.stage-hint{font-size:16px}.stage-formats{font-size:13px}.result-card{min-height:106px}.result-photo{width:132px;height:106px}.result-info{gap:8px;padding:10px}.result-top{gap:6px}.result-score{font-size:13px}.result-status{font-size:10px;padding:5px 6px}.copy-id{width:26px;height:26px}.copy-id svg{width:17px;height:17px}.remove-image{right:8px;top:8px}}
@media(max-width:360px){.instruction{margin-left:-5px;margin-right:-5px;max-width:calc(100% + 10px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
.search-controls{display:flex;align-items:flex-start;justify-content:center;gap:22px;width:min(720px,100%);margin:20px auto 0;text-align:left}
.search-controls .actions{width:min(340px,100%);flex:none;margin:0}
.controls-title{width:min(340px,100%);padding:0;margin:0 auto;color:#a9aabb;font-size:13px;font-weight:400;line-height:normal;letter-spacing:0;text-align:left}
.dataset-choices{flex:1;min-width:0;margin:0;padding:0;border:0}
.dataset-choices legend{padding:0;margin-bottom:10px;color:#a9aabb;font-size:13px;font-weight:400;line-height:normal;letter-spacing:0;text-align:left}
.dataset-choice{display:flex;align-items:center;gap:4px;min-height:39px;margin-bottom:5px;padding:4px;border-radius:11px;background:#20212d;transition:background .18s}
.dataset-choice:has(input:checked){background:#302c43}
.dataset-choice label{display:flex;align-items:center;gap:10px;min-width:0;flex:1;padding:3px 5px;color:#e2e2ee;font-size:13px;font-weight:550;cursor:pointer}
.dataset-choice label:has(input:disabled){color:#777989;cursor:default}
.dataset-choice input{appearance:none;width:18px;height:18px;margin:0;flex:none;display:grid;place-items:center;border-radius:6px;background:#484656;cursor:pointer}
.dataset-choice input:checked{background:#b4a2ff}
.dataset-choice input:checked::after{content:'✓';color:#17111f;font-size:15px;font-weight:800;line-height:1}
.dataset-choice input:disabled{cursor:default;background:#353642}
.dataset-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dataset-count{flex:none;margin-left:auto;color:#a9a5bc;font-size:11px;white-space:nowrap}
.dataset-choice a{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:8px;color:#afa2ed;background:#292837}
.dataset-choice a span{color:#b9aafa;font-size:19px;line-height:1}
.result-card{cursor:zoom-in}
.result-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.result-status.uncalibrated{background:#333044;color:#cbc2ee}
.heatmap-button{background:#282936;color:#ddd7f3;border-radius:8px;padding:7px 10px;font-size:12px;font-weight:650;cursor:pointer}
.photo-lightbox{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:20px;overflow:hidden;background:#0a0b0ff2;color:#f2f1f8;border:0}
.photo-lightbox::backdrop{background:#000c}
.lightbox-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:1500px;margin:0 auto;height:42px}
.lightbox-title{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lightbox-buttons{display:flex;align-items:center;gap:8px;flex:none}
.lightbox-buttons button{background:#272835;color:#eeecf7;border-radius:10px;min-height:38px;padding:8px 13px;font-size:13px}
.lightbox-close{font-size:25px!important;line-height:1;width:38px;padding:0!important}
.lightbox-space{height:calc(100vh - 126px);display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none;overscroll-behavior:contain}
.lightbox-image{display:block;max-width:100%;max-height:100%;object-fit:contain;cursor:zoom-in;transition:transform .14s ease;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.lightbox-image.zoomed{cursor:grab;transition:none}
.lightbox-image.zoomed:active{cursor:grabbing}
.lightbox-description{text-align:center;color:#a9aabb;font-size:12px;margin:9px 0 0}
.dataset-page{max-width:1320px;padding-top:24px}
.back-link{display:inline-block;color:#a9aabb;font-size:14px;margin-bottom:22px}
.dataset-page h1{font-size:clamp(30px,4vw,48px)}
.dataset-summary{color:#a9aabb;font-size:14px;margin:9px 0 22px}
.dataset-tools{display:flex;align-items:center;gap:15px;min-height:48px;margin-bottom:20px}
.dataset-upload,.load-more{display:inline-flex;align-items:center;justify-content:center;min-height:43px;padding:10px 16px;background:#a997f5;color:#17111f;border-radius:11px;font-size:14px;font-weight:700;cursor:pointer}
.dataset-upload.busy{opacity:.65;pointer-events:none}
#dataset-status{font-size:13px;color:#b8aaff}
#dataset-status.error{color:#ff9da4}
.dataset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.dataset-card{min-width:0;overflow:hidden;background:#191b26;border-radius:14px}
.dataset-photo{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#10121a;cursor:zoom-in}
.dataset-caption{padding:10px}
.dataset-id-row{margin-top:0}
.dataset-card-actions{display:flex;gap:7px;margin-top:10px}
.dataset-card-actions button{background:#282936;color:#e9e7f4;border-radius:8px;padding:8px 9px;font-size:11px}
.dataset-card-actions button:last-child{color:#ffb0b5}
.load-more{display:flex;margin:24px auto 0;background:#252632;color:#e9e7f4}
@media(hover:hover) and (pointer:fine){.dataset-choice:hover{background:#373447}.dataset-choice a:hover,.heatmap-button:hover,.dataset-card-actions button:hover{background:#48445f}.dataset-upload:hover{background:#c0b2ff}.back-link:hover{color:#fff}}
@media(max-width:700px){.search-controls{flex-direction:column;align-items:stretch;gap:16px}.search-controls .actions{width:100%}.dataset-choices{width:min(340px,100%);margin:auto}.result-card{cursor:default}.heatmap-button{font-size:11px}.photo-lightbox{padding:12px}.lightbox-title{font-size:11px}.lightbox-space{height:calc(100vh - 115px)}.dataset-page{padding-top:18px}.dataset-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.dataset-card-actions{flex-direction:column}.dataset-tools{flex-wrap:wrap}}
@media(hover:none),(pointer:coarse){.crop-handle{width:34px;height:34px;background:transparent;box-shadow:none}.crop-handle::after{content:"";position:absolute;inset:9px;background:#c8baff;border-radius:4px;box-shadow:0 2px 8px #0008}.lightbox-image{cursor:default}}
.result-actions{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.heatmap-button:disabled{opacity:.6;cursor:wait}
.pair-button{background:#3d3458;color:#eee6ff}
.pair-dialog{width:min(1160px,calc(100vw - 30px));max-width:none;max-height:calc(100vh - 30px);margin:auto;padding:24px;overflow:auto;background:#171923;color:#f3f1f9;border:0;border-radius:20px}
.pair-dialog::backdrop{background:#05050bbd}
.pair-header{display:flex;align-items:start;justify-content:space-between;gap:12px}
.pair-header h2{margin:0;font-size:22px;font-weight:700}
.pair-score{margin:7px 0 0;color:#cbc7d9;font-size:14px}
.pair-header-actions{display:flex;align-items:center;gap:10px;flex:none}
.pair-grid-label{display:flex;align-items:center;gap:7px;color:#cbc7d9;font-size:12px}
.pair-grid-size{appearance:none;min-height:38px;padding:7px 12px;border:0;border-radius:9px;background:#292b38;color:#f3f1f9;font:inherit;cursor:pointer}
.pair-grid-size:disabled{opacity:.6;cursor:wait}
.pair-close{width:38px;height:38px;flex:none;border:0;border-radius:10px;background:#292b38;color:#f3f1f9;font-size:26px;line-height:1;cursor:pointer}
.pair-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:20px;align-items:start}
.pair-photo{min-width:0}
.pair-photo-title{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:32px;margin-bottom:8px;color:#cbc7d9;font-size:13px}
.pair-toggle{border:0;border-radius:8px;background:#292b38;color:#e3ddf4;padding:7px 10px;font-size:12px;cursor:pointer}
.pair-map{position:relative;width:100%}
.pair-query-image,.pair-candidate-image{display:block;width:100%;height:auto;border-radius:12px;background:#10121a}
.pair-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));overflow:hidden;border-radius:12px}
.pair-grid[hidden]{display:none}
.pair-cell{min-width:0;min-height:0;padding:0;border:0;color:#fff;background:transparent;font-size:clamp(9px,1vw,12px);font-weight:700;text-shadow:0 1px 4px #000,0 0 6px #000;cursor:pointer}
.pair-grid[data-size="8"] .pair-cell{font-size:clamp(7px,.65vw,9px);white-space:nowrap}
.pair-cell.selected{filter:brightness(1.4);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.pair-cell:focus-visible{outline:2px solid #fff;outline-offset:-3px}
.pair-candidate-id{overflow-wrap:anywhere;color:#aaa8b9;font-size:12px}
.pair-selected{min-height:20px;margin:17px 0 10px;color:#f0ebfa;font-size:13px}
.pair-selected.error{color:#ff9da4}
.pair-legend{display:flex;flex-wrap:wrap;gap:8px 20px;color:#c6c4d0;font-size:12px}
.pair-legend[hidden]{display:none}
.pair-legend span{display:inline-flex;align-items:center;gap:7px}
.pair-legend i{display:inline-block;width:13px;height:13px;border-radius:4px}
.pair-positive{background:#48d793}.pair-negative{background:#ff586c}
.pair-note{margin:12px 0 0;color:#9d9caa;font-size:12px;line-height:1.5}
@media(max-width:700px){.result-actions{justify-content:flex-start}.lightbox-buttons button{font-size:11px;padding:8px 9px}.pair-dialog{width:100vw;max-height:100vh;height:100vh;padding:16px;border-radius:0}.pair-header h2{font-size:19px}.pair-header-actions{gap:6px}.pair-grid-label{font-size:11px}.pair-photos{grid-template-columns:1fr;gap:16px}.pair-query-image,.pair-candidate-image{max-height:none}.pair-cell{font-size:10px}.pair-grid[data-size="8"] .pair-cell{font-size:7px}}
