.hmp-tool{--hmp-bg:#07111b;--hmp-panel:#0c1927;--hmp-line:#1d3748;--hmp-text:#e9f3f7;--hmp-muted:#8ea6b5;max-width:1040px;margin:30px auto;padding:0 0 18px;color:var(--hmp-text);background:radial-gradient(ellipse at 80% -10%,color-mix(in srgb,var(--hmp-accent) 16%,transparent),transparent 38%),linear-gradient(145deg,#07111b,#0a1825 58%,#08121c);border:1px solid #1c384b;border-radius:18px;overflow:hidden;box-shadow:0 28px 75px #06101d55;font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;position:relative}.hmp-tool *{box-sizing:border-box}.hmp-bar{height:54px;padding:0 25px;display:flex;align-items:center;justify-content:space-between;background:#07111dcc;border-bottom:1px solid var(--hmp-line)}.hmp-logo{display:flex;align-items:center;gap:9px;font-size:12px;font-weight:850;letter-spacing:.16em}.hmp-logo b{display:grid;place-items:center;width:25px;height:25px;color:var(--hmp-accent);border:1px solid var(--hmp-accent);border-radius:7px;font-size:14px}.hmp-logo i{font-style:normal;color:#69859a;font-size:9px;letter-spacing:.2em;margin-left:5px}.hmp-state{font-size:9px;letter-spacing:.13em;color:#88a4b5;display:flex;align-items:center;gap:8px}.hmp-state b,.hmp-led,.hmp-result-head i{width:7px;height:7px;border-radius:50%;background:var(--hmp-accent);box-shadow:0 0 10px var(--hmp-accent)}.hmp-heading{padding:30px 34px 23px;display:flex;align-items:center;justify-content:space-between;gap:20px}.hmp-eyebrow{font-size:9px;letter-spacing:.2em;color:var(--hmp-accent);font-weight:800}.hmp-heading h2{font-size:clamp(22px,3vw,31px);line-height:1.15;letter-spacing:.025em;color:#f2f8fa;margin:7px 0}.hmp-heading p{max-width:640px;margin:0;color:#9bb1bf;font-size:13px}.hmp-tag{white-space:nowrap;border:1px solid #29495c;border-radius:5px;padding:8px 11px;color:#a7c1cf;font:10px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.12em}.hmp-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:20px;padding:0 34px 24px}.hmp-controls,.hmp-result{min-width:0}.hmp-drop{min-height:202px;border:1px dashed #355b70;border-radius:11px;background:linear-gradient(135deg,#0b1c2a,#0a1724);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;text-align:center;cursor:pointer;position:relative;padding:22px;transition:.2s}.hmp-drop:hover,.hmp-drop.dragging{border-color:var(--hmp-accent);background:#102630;box-shadow:inset 0 0 34px color-mix(in srgb,var(--hmp-accent) 7%,transparent)}.hmp-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.hmp-plus{width:32px;height:32px;border:1px solid color-mix(in srgb,var(--hmp-accent) 65%,#18354a);border-radius:9px;display:grid;place-items:center;color:var(--hmp-accent);font-size:23px;margin-bottom:2px}.hmp-drop strong{font-size:14px;color:#e9f4f8}.hmp-drop small{font-size:11px;color:#95adbc}.hmp-drop em{margin-top:7px;font-style:normal;font-size:9px;letter-spacing:.07em;color:#638197}.hmp-selected{height:38px;display:flex;align-items:center;gap:9px;border-bottom:1px solid var(--hmp-line);color:#9cb2be;font-size:10px}.hmp-led{width:6px;height:6px;background:#3c5869;box-shadow:none;flex:0 0 auto}.hmp-tool.has-file .hmp-led{background:var(--hmp-accent);box-shadow:0 0 8px var(--hmp-accent)}.hmp-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hmp-weight{color:#66859a;white-space:nowrap}.hmp-run{width:100%;height:45px;margin-top:17px;padding:0 15px;display:flex;justify-content:space-between;align-items:center;border:0;border-radius:6px;background:linear-gradient(100deg,var(--hmp-accent),color-mix(in srgb,var(--hmp-accent) 60%,#54a8ff));color:#04131d;font-size:10px;font-weight:900;letter-spacing:.15em;cursor:pointer;transition:.2s}.hmp-run b{font-size:18px}.hmp-run:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px)}.hmp-run:disabled{opacity:.4;cursor:not-allowed}.hmp-status{min-height:31px;margin:8px 0 0;color:#91a9b7;font-size:10px}.hmp-share{border:1px solid #29485b;background:#0b1a27;color:var(--hmp-accent);border-radius:5px;padding:8px 11px;font-size:9px;letter-spacing:.1em;font-weight:800;cursor:pointer}.hmp-share[hidden]{display:none}.hmp-result{border:1px solid #1a3549;background:#081522;border-radius:10px;overflow:hidden}.hmp-result-head{height:37px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #183247;color:#7794a7;letter-spacing:.14em;font-size:9px;font-weight:800}.hmp-result-head i{width:6px;height:6px}.hmp-preview{margin:15px auto 12px;width:min(84%,440px);height:225px;position:relative;display:grid;place-items:center;overflow:hidden;background-color:#0c1b2a;background-image:linear-gradient(45deg,#12283a 25%,transparent 25%),linear-gradient(-45deg,#12283a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#12283a 75%),linear-gradient(-45deg,transparent 75%,#12283a 75%);background-size:18px 18px;background-position:0 0,0 9px,9px -9px,-9px 0;border:1px solid #24445a;border-radius:7px}.hmp-preview:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(transparent 50%,#53e6dd08 50%);background-size:100% 4px}.hmp-image,.hmp-video{max-width:100%;max-height:100%;object-fit:contain;display:block}.hmp-video[hidden],.hmp-image[hidden]{display:none}.hmp-empty{position:absolute;color:#496a7e;letter-spacing:.16em;font-size:9px}.hmp-empty[hidden]{display:none}.hmp-corner{position:absolute;width:11px;height:11px;z-index:1;opacity:.55}.hmp-corner-a{top:7px;left:7px;border-top:1px solid var(--hmp-accent);border-left:1px solid var(--hmp-accent)}.hmp-corner-b{bottom:7px;right:7px;border-bottom:1px solid var(--hmp-accent);border-right:1px solid var(--hmp-accent)}.hmp-metrics{margin:0 12px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #183247;border-bottom:1px solid #183247}.hmp-metrics div{padding:10px 5px;border-right:1px solid #183247;text-align:center}.hmp-metrics div:last-child{border:0}.hmp-metrics small{display:block;color:#648398;font-size:8px;letter-spacing:.1em}.hmp-metrics strong{display:block;color:#c1d7e2;font-size:10px;letter-spacing:.04em;margin-top:3px;overflow:hidden;text-overflow:ellipsis}.hmp-output{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;color:#6e8da0;font-size:8px;letter-spacing:.1em}.hmp-output strong{color:#aec5d1;font-size:8px}.hmp-foot{margin:0 34px;padding-top:13px;border-top:1px solid #183247;display:flex;justify-content:space-between;gap:10px;color:#5f7d91;font-size:8px;letter-spacing:.08em}.hmp-foot i{font-style:normal;color:var(--hmp-accent)}.hmp-drop:focus-visible,.hmp-run:focus-visible,.hmp-share:focus-visible{outline:2px solid var(--hmp-accent);outline-offset:3px}@media(max-width:740px){.hmp-heading{padding:24px 20px 18px;align-items:flex-start;flex-direction:column}.hmp-grid{grid-template-columns:1fr;padding:0 20px 18px}.hmp-bar{padding:0 17px}.hmp-foot{margin:0 20px;flex-direction:column}.hmp-preview{width:90%;height:210px}}@media(prefers-reduced-motion:reduce){.hmp-tool *{scroll-behavior:auto!important;transition:none!important}}