:root { --background:#0b1020; --panel:#151d30; --border:#28354b; --muted:#93a1bc; --accent:#8ba7ff; --text:#f3f6ff; }
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% -10%,#1a2845 0%,#0b1020 52%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh}.shell{min-height:100vh}.topbar{height:78px;padding:0 max(32px,calc((100vw - 1180px)/2));border-bottom:1px solid rgba(255,255,255,.075)}.brand{font-size:19px;font-weight:760;letter-spacing:-.7px}.brand-light{font-weight:420}.brand-icon{background:#344a82;color:#cbd8ff;padding:9px 11px;border-radius:10px;margin-right:9px}.brand-suffix{color:#8595af;font-size:13px;font-weight:500;letter-spacing:0;margin-left:9px}.status{font-size:12px;color:#c6d3e7;border:1px solid var(--border);border-radius:999px;padding:8px 13px;white-space:nowrap}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#e1b45c;margin-right:8px}.status.ready .status-dot{background:#4ed6a2}.status.offline .status-dot{background:#ff7a91}.content{max-width:1100px;padding-top:73px;padding-bottom:80px}.intro{margin-bottom:51px}.eyebrow{font-size:11px;letter-spacing:2.3px;font-weight:750;color:#94adff;margin-bottom:17px}.intro h1{font-weight:780;letter-spacing:-1.7px;font-size:clamp(32px,4.1vw,49px)}.accent{color:#99b0ff}.intro p{color:#a2aec5;font-size:15px;margin-top:17px}.panel{background:var(--panel);border:1px solid var(--border);border-radius:15px;box-shadow:0 18px 38px #0002;overflow:hidden}.panel-heading{border-bottom:1px solid var(--border);padding:20px 25px;min-height:73px}.panel-heading h2{display:inline;font-size:16px;font-weight:660;vertical-align:middle}.step{color:#a9bcff;background:#28375c;border-radius:7px;font-size:12px;font-weight:750;padding:7px 9px;margin-right:9px}.format-label{color:#8b9ab3;font-size:10px;letter-spacing:.4px}.panel-body{padding:25px}.dropzone{border:2px dashed #3a4b69;border-radius:12px;min-height:270px;display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;background:#121b2f;transition:.2s}.dropzone:hover,.dropzone.dragging{border-color:#9db4ff;background:#1c2942}.upload-icon{font-size:34px;color:#9db4ff;margin-bottom:18px}.drop-title{font-weight:660;font-size:16px}.drop-subtitle{font-size:13px;color:#93a2bb;margin-top:8px}.browse{color:#acc0ff;font-weight:660}.small-note{font-size:11px;color:#71819e;margin-top:19px}#imagePreview{max-width:95%;max-height:216px;object-fit:contain;vertical-align:middle}.preview-prompt{font-size:11px;color:#8fa2c5;margin-top:12px}.selected-file{display:flex;align-items:center;gap:10px;padding:13px 2px;color:#b8c8e6;font-size:12px}.selected-file span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.remove-file{border:0;background:transparent;color:#96a4c0}.field-label,.result-label{font-size:10px;letter-spacing:1.5px;color:#97a8c7;font-weight:760;display:block;margin:19px 0 10px}.form-select{background-color:#10182a;color:#dae5fb;border-color:#32405a;padding:12px;font-size:13px}.form-select:focus{background-color:#10182a;color:#dae5fb;box-shadow:0 0 0 3px #536fbc35;border-color:#7193f6}.solve-button{margin-top:21px;background:#91a9ff;color:#091329;font-size:14px;font-weight:750;padding:13px;border:0}.solve-button:hover:not(:disabled){background:#bac8ff;color:#091329}.solve-button:disabled{background:#576584;color:#bdc8dc;border:0}.results-body{min-height:419px}.empty-result{text-align:center;display:flex;align-items:center;justify-content:center;flex-direction:column;height:365px}.result-icon{font-size:37px;color:#7185aa;background:#202d48;width:76px;height:76px;border-radius:19px;display:flex;align-items:center;justify-content:center;margin-bottom:24px}.empty-result h3{font-size:16px;font-weight:650}.empty-result p{color:var(--muted);font-size:13px;max-width:230px;margin:10px auto 0;line-height:1.7}.result-box{background:#0d1628;border:1px solid #38496a;border-radius:12px;min-height:90px;padding:19px;display:flex;align-items:center;gap:12px;justify-content:space-between}.result-box span{font-size:27px;font-weight:800;letter-spacing:3px;overflow-wrap:anywhere}.copy-button{border:1px solid #425477;background:#283857;color:#cddcff;border-radius:8px;width:40px;height:40px;flex-shrink:0}.copy-button:hover{background:#405680}.result-meta{color:#7cddaf;font-size:12px;margin-top:23px}.result-meta span{float:right;color:#95a7c7}.result-disclaimer{font-size:12px;color:#95a5be;margin-top:26px;line-height:1.6}.btn-outline-secondary{color:#c1cde5;border-color:#485672}.btn-outline-secondary:hover{background:#29364c;border-color:#667696}.footer-note{color:#6f809e;font-size:12px;margin-top:46px}@media(max-width:767px){.topbar{padding:0 18px}.brand{font-size:16px}.brand-suffix{display:none}.format-label{display:none}.content{padding-top:52px}.intro{margin-bottom:36px}.panel-body{padding:18px}.panel-heading{padding:20px}.results-body{min-height:280px}.empty-result{height:235px}}

.main-nav{display:flex;gap:10px;align-items:center}.main-nav a{font-size:13px;padding:8px 13px;border-radius:8px;text-decoration:none;color:#aabbd7}.main-nav a:hover,.main-nav a.active{color:#f3f6ff;background:#283958}.dropzone a{color:#b3c5ff}.sample-card{display:flex;flex-direction:column}.sample-image-wrap{background:#10182a;min-height:190px;height:190px;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--border);padding:18px}.sample-image{max-height:100%;max-width:100%;object-fit:contain;cursor:grab}.sample-image:active{cursor:grabbing}.sample-body{padding:18px}.sample-filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c4d2ec;font-size:13px}.download-button{display:flex;align-items:center;padding:0 15px}.empty-samples{padding:80px 24px}.empty-samples p{color:var(--muted)}.empty-samples code,.footer-note code{color:#aebfff}@media(max-width:767px){.topbar{gap:8px}.main-nav{gap:0}.main-nav a{padding:7px 8px}.status{display:none}}