:root{--bg:#0a0d11;--panel:#11161d;--line:#27303a;--text:#edf2f5;--muted:#89939e;--cyan:#62e2d3;--amber:#efb84b;--red:#e35d56;--radius:18px;color-scheme:dark;font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif}*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:radial-gradient(circle at 80% 5%,#162028 0,transparent 30rem),var(--bg);color:var(--text);min-height:100vh}.topbar{height:70px;border-bottom:1px solid #1e252d;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1120px)/2));background:rgba(10,13,17,.84);backdrop-filter:blur(16px);position:sticky;top:0;z-index:20}.brand{display:flex;gap:10px;align-items:center;color:var(--text);font-weight:700;text-decoration:none;letter-spacing:.08em}.brand-mark{color:var(--cyan);font-size:26px}.admin-link,.button-link{color:var(--muted);text-decoration:none;font-size:14px;background:none;border:0;cursor:pointer}.admin-link:hover{color:var(--cyan)}.shell{max-width:1120px;margin:auto;padding:72px 24px}.hero{max-width:760px;margin-bottom:50px}.eyebrow{font-size:11px;color:var(--cyan);letter-spacing:.24em;font-weight:700;margin-bottom:14px}.hero h1,.admin-heading h1{font-size:clamp(42px,7vw,78px);line-height:1.06;margin:0;font-weight:800;letter-spacing:-.055em}.hero h1 em{color:var(--cyan);font-style:normal}.hero p,.admin-heading p{max-width:620px;color:var(--muted);line-height:1.8;font-size:16px}.panel{background:linear-gradient(145deg,rgba(20,26,33,.97),rgba(14,18,24,.97));border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 30px 80px #0008}.query-panel{padding:32px}.steps{display:flex;gap:32px;border-bottom:1px solid var(--line);padding-bottom:20px;margin-bottom:28px;color:#59636e;font-size:12px;letter-spacing:.08em}.steps .active{color:var(--cyan)}label{display:block}label>span{display:block;color:#b6bec6;font-size:13px;margin-bottom:9px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}select,input{width:100%;border:1px solid var(--line);border-radius:10px;background:#0b1015;color:var(--text);padding:13px 14px;font:inherit;outline:none}select:focus,input:focus{border-color:#4a8d88;box-shadow:0 0 0 3px #62e2d315}.upload-zone{margin-top:20px;min-height:190px;border:1px dashed #3c4854;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;background:#0b101577;transition:.2s}.upload-zone:hover,.upload-zone.drag{border-color:var(--cyan);background:#62e2d308}.upload-zone input{position:absolute;opacity:0;pointer-events:none;width:1px}.upload-zone strong{font-size:15px}.upload-zone small{color:var(--muted)}.upload-icon{display:grid!important;place-items:center;width:42px;height:42px;border-radius:50%;background:#62e2d315;color:var(--cyan)!important;font-size:24px;margin:0 0 4px!important}.crop-section{margin-top:28px}.section-head,.results-head,.admin-heading,.admin-map-head,.difficulty-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.section-head h2,.results h2,.panel h2{margin:0 0 6px;font-size:21px}.section-head p{margin:0;color:var(--muted);font-size:13px}.crop-stage{position:relative;margin-top:16px;display:inline-block;max-width:100%;line-height:0;overflow:hidden;border-radius:12px;background:#05070a;user-select:none;touch-action:none}.crop-stage canvas{max-width:100%;height:auto}.crop-box{position:absolute;border:2px solid var(--cyan);box-shadow:0 0 0 9999px #0009,inset 0 0 0 1px #0005;cursor:move;min-width:40px;min-height:40px}.crop-box:before,.match-bounds:before{content:"匹配区域";position:absolute;top:-25px;left:-2px;color:#06110f;background:var(--cyan);font-size:10px;line-height:20px;padding:0 7px;font-weight:700;white-space:nowrap}.crop-box i{position:absolute;width:18px;height:18px;right:-8px;bottom:-8px;border:3px solid var(--cyan);background:#091016;cursor:nwse-resize;border-radius:4px}.primary-button,.secondary-button,.danger-button{border:0;border-radius:10px;padding:13px 18px;font:inherit;font-weight:700;cursor:pointer}.primary-button{width:100%;margin-top:22px;display:flex;justify-content:space-between;background:var(--cyan);color:#06110f}.primary-button:hover{background:#84f0e3}.primary-button:disabled{opacity:.35;cursor:not-allowed}.primary-button.compact{width:auto;margin:0}.secondary-button{background:#222b34;color:var(--text);border:1px solid #35414c}.danger-button{background:#351c1e;color:#ffaca6;border:1px solid #633037;padding:9px 12px;font-size:12px}.text-button{border:0;background:none;color:var(--cyan);cursor:pointer}.text-button.danger,.danger{color:#ff817a}.status,.alert{margin-top:16px;padding:12px 14px;border:1px solid #2f5c57;background:#102724;color:#9cf5e9;border-radius:10px;font-size:13px}.status.error,.alert.error{border-color:#66383a;background:#2a1719;color:#ffaaa5}.empty-tip,.empty-admin{color:var(--muted);font-size:13px}.results{margin-top:70px}.results-head{margin-bottom:24px}.results-head h2{font-size:30px}.results-head>span{color:var(--muted);font-size:12px}.result-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.result-card{background:var(--panel);border:1px solid var(--line);border-radius:15px;overflow:hidden;cursor:pointer;transition:.2s}.result-card:hover{transform:translateY(-3px);border-color:#48726f}.result-visual{position:relative;overflow:hidden;background:#05070a;line-height:0;aspect-ratio:1}.result-visual img{width:100%;height:100%;object-fit:contain}.match-bounds{position:absolute;border:2px solid var(--cyan);box-shadow:0 0 0 9999px #0004}.result-body{display:grid;grid-template-columns:auto 1fr auto;gap:13px;padding:16px;align-items:center}.rank{font-size:24px;color:#53606b;font-weight:800}.result-name{overflow:hidden}.result-name strong{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.result-name small{color:var(--muted)}.score{font-size:20px;font-weight:800}.confidence{font-size:10px;border-radius:12px;padding:3px 7px;background:#27323d;color:#aab4bd}.confidence.高{background:#14372f;color:#75ead7}.confidence.低{background:#352520;color:#efb57c}dialog{width:min(95vw,1100px);height:min(92vh,900px);padding:0;border:1px solid #39434d;border-radius:16px;background:#080b0f;color:var(--text)}dialog::backdrop{background:#000c;backdrop-filter:blur(5px)}.viewer-stage{height:calc(100% - 36px);overflow:hidden;display:grid;place-items:center;cursor:grab}.viewer-stage:active{cursor:grabbing}#viewer-transform{position:relative;line-height:0;transform-origin:center}#viewer-image{max-width:88vw;max-height:82vh}.viewer-close{position:absolute;right:12px;top:10px;z-index:4;border:0;border-radius:50%;width:36px;height:36px;background:#192129;color:white;font-size:24px;cursor:pointer}.viewer-note{text-align:center;color:var(--muted);font-size:12px}.login-page{display:grid;place-items:center;padding:24px}.login-card{width:min(440px,100%);border:1px solid var(--line);border-radius:20px;padding:38px;background:var(--panel);box-shadow:0 30px 80px #000}.login-card .brand{margin-bottom:44px}.login-card h1{font-size:35px;margin:0}.login-card p{color:var(--muted);margin-bottom:28px}.login-card label{margin-top:16px}.admin-shell{padding-top:50px}.admin-heading{margin-bottom:32px}.admin-heading h1{font-size:58px}.admin-create,.admin-map{padding:24px;margin-bottom:20px}.inline-form{display:flex;gap:10px;align-items:center}.inline-form.grow{flex:1}.inline-form input{max-width:350px}.admin-map-head{border-bottom:1px solid var(--line);padding-bottom:18px}.difficulty-create{margin:18px 0}.difficulty{background:#0b1015;border:1px solid #202932;border-radius:12px;padding:18px;margin-top:14px}.difficulty-head{padding-bottom:13px}.difficulty-head .inline-form input{font-weight:700}.count{font-size:12px;color:var(--muted);white-space:nowrap}.upload-inline{display:flex;gap:10px;margin:8px 0 16px}.upload-inline input{padding:9px}.admin-images{display:grid;gap:8px}.admin-image{display:grid;grid-template-columns:80px 1fr auto;align-items:center;gap:14px;padding:10px;background:#121820;border-radius:9px}.admin-image img{width:80px;height:64px;object-fit:cover;border-radius:5px}.admin-image strong,.admin-image small{display:block}.admin-image strong{font-size:13px;word-break:break-all}.admin-image small{color:var(--muted);font-size:11px;margin-top:4px}.index-status{display:inline-block;font-size:10px;margin-top:6px;padding:2px 7px;border-radius:8px;background:#333;color:#bbb}.index-status.READY{background:#153a31;color:#78ead7}.index-status.FAILED{background:#3c2022;color:#ff9b95}.error-text{color:#ff8982!important}footer{text-align:center;padding:60px 20px;color:#47515b;font-size:12px}footer span{color:var(--cyan);margin:0 8px}@media(max-width:700px){.shell{padding:45px 15px}.query-panel{padding:20px}.field-grid,.result-grid{grid-template-columns:1fr}.steps{gap:15px;font-size:10px;overflow:auto}.hero{margin-bottom:32px}.hero p{font-size:14px}.result-body{grid-template-columns:auto 1fr}.score{grid-column:2}.admin-heading,.admin-map-head,.difficulty-head{align-items:flex-start;flex-direction:column}.inline-form,.upload-inline{width:100%;flex-wrap:wrap}.admin-image{grid-template-columns:65px 1fr}.admin-image img{width:65px}.admin-image form{grid-column:2}.topbar{padding:0 16px}}
.compare-dialog{width:min(98vw,1500px);height:min(94vh,920px);padding:18px}.compare-viewer{height:calc(100% - 42px);display:grid;grid-template-columns:1fr 1fr;gap:14px}.compare-pane{min-width:0;min-height:0;display:grid;grid-template-rows:auto 1fr;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#05070a}.compare-pane h3{margin:0;padding:12px 16px;border-bottom:1px solid var(--line);background:#10161d;font-size:14px}.compare-pane .viewer-stage,.query-compare-stage{height:auto;min-height:0;overflow:hidden;display:grid;place-items:center}.compare-pane #viewer-image,.query-compare-stage img{display:block;max-width:100%;max-height:100%;object-fit:contain}.query-compare-stage{padding:10px}.compare-dialog .viewer-note{height:30px;padding-top:10px}.compare-dialog .viewer-close{right:22px;top:22px}@media(max-width:760px){.compare-dialog{padding:10px}.compare-viewer{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.compare-pane h3{padding:8px 12px;font-size:12px}.compare-dialog .viewer-note{font-size:10px}.compare-dialog .viewer-close{right:14px;top:14px}}
.viewer-nav{height:42px;display:flex;align-items:center;justify-content:center;gap:16px;padding-right:48px}.viewer-nav button{border:1px solid #35414c;border-radius:8px;background:#182129;color:var(--text);padding:7px 13px;cursor:pointer}.viewer-nav button:hover{border-color:var(--cyan);color:var(--cyan)}.viewer-nav button:disabled{opacity:.35;cursor:not-allowed}.viewer-nav span{min-width:58px;text-align:center;color:var(--muted);font-size:12px}.compare-dialog .compare-viewer{height:calc(100% - 84px)}.back-to-top{position:fixed;right:22px;bottom:24px;z-index:30;width:44px;height:44px;border:1px solid #3b5d5a;border-radius:50%;background:#142421dd;color:var(--cyan);font-size:23px;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:.2s;box-shadow:0 8px 28px #0008}.back-to-top.visible{opacity:1;visibility:visible;transform:translateY(0)}.back-to-top:hover{background:#1d3430}@media(max-width:760px){.viewer-nav{height:38px;padding-right:38px;gap:8px}.viewer-nav button{padding:6px 9px;font-size:11px}.compare-dialog .compare-viewer{height:calc(100% - 78px)}.back-to-top{right:14px;bottom:16px;width:40px;height:40px}}
.compare-pane h3{display:flex;align-items:center;justify-content:space-between;gap:10px}.compare-pane h3 button{border:1px solid #35514f;border-radius:7px;background:#142421;color:var(--cyan);padding:5px 9px;font-size:11px;cursor:pointer}.compare-dialog.guide-only .compare-viewer{grid-template-columns:1fr}.compare-dialog.guide-only .compare-pane:last-child{display:none}.compare-dialog.guide-only #viewer-image{max-width:94vw;max-height:76vh}