.scanner-shell{max-width:1500px;margin:auto;padding:46px 42px 90px}.scanner-heading{margin-bottom:30px}.scanner-heading h1{font-size:clamp(32px,4vw,52px);line-height:1.07;letter-spacing:-2px;margin:16px 0}.scanner-heading h1 em{color:#c2acff;font-style:normal}.scanner-heading p{color:#b9c3da;max-width:700px;line-height:1.7}.scanner-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start}.scanner-controls{display:grid;gap:18px;padding:24px;background:#191e32;border:1px solid #ffffff1c;border-radius:22px}.scanner-step{font-size:11px;font-weight:800;letter-spacing:.12em;color:#c2acff}.scanner-controls label{display:grid;gap:9px;font-size:13px;font-weight:650;color:#e2e6f4}.scanner-controls select,.scanner-controls input:not([type=checkbox]):not([type=range]){width:100%;min-height:44px;border:1px solid #58617a;background:#101525;color:#f1f3ff;border-radius:10px;padding:10px;font:inherit}.scanner-controls input[type=range]{width:100%;accent-color:#c2acff;min-height:30px}.scanner-controls .scanner-check{display:flex;align-items:center;font-weight:500;line-height:1.5}.scanner-check input{width:20px;height:20px;accent-color:#c2acff}.scanner-controls output{float:right;color:#c5f8cb}.scanner-name,.scanner-note,.scanner-controls small{font-size:12px;color:#aebbd2;line-height:1.6;margin:0;overflow-wrap:anywhere}.scanner-note{border-top:1px solid #ffffff1c;padding-top:18px}.scanner-status{font-size:13px;line-height:1.6;color:#c5f8cb;margin:0}.scanner-status.is-error{color:#ffbaad}.scanner-workspace{min-width:0}.scanner-empty{padding:85px 30px;border:1px dashed #69718a;background:#13182a;border-radius:22px;text-align:center;color:#aebbd2}.scanner-empty>span{display:block;color:#c2acff;font-size:60px}.scanner-empty h2{font-size:24px;color:#f3f3fe}.scanner-previews{display:grid;grid-template-columns:1fr 1fr;gap:18px;min-width:0}.scanner-previews figure{margin:0;min-width:0;border:1px solid #ffffff25;background:#13182a;border-radius:18px;overflow:hidden}.scanner-previews figcaption{padding:18px;display:grid;gap:7px;font-size:13px;color:#e6e3fa}.scanner-previews figcaption span{font-size:12px;color:#aebbd2;line-height:1.5}.scanner-crop{position:relative;margin:15px 22px 22px;line-height:0}.scanner-crop canvas{width:100%;height:auto;display:block}.scanner-outline{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.scanner-outline polygon{fill:#c2acff0d;stroke:#bd9eff;stroke-width:.7;vector-effect:non-scaling-stroke}.scanner-corner{position:absolute;width:34px;height:34px;border-radius:50%;transform:translate(-50%,-50%);border:3px solid white;background:#7855c9;color:white;font-size:12px;font-weight:800;touch-action:none;cursor:grab;box-shadow:0 2px 9px #0009;z-index:2}.scanner-corner:active{cursor:grabbing}.scanner-corner:focus-visible{outline:4px solid #c5f8cb;outline-offset:3px}.scanner-crop-actions{display:flex;flex-wrap:wrap;gap:8px;padding:0 15px 18px}.scanner-crop-actions button{flex:1;font-size:12px;min-height:44px;padding:10px 12px}.scanner-result-frame{min-height:320px;display:grid;place-items:center;margin:15px 22px 22px;background:#0b0f1c;overflow:hidden}.scanner-result canvas{display:block;width:100%;height:auto;background:white}.scanner-pending{padding:25px;color:#8996b1;text-align:center;font-size:13px}.scanner-export{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:24px;padding:22px;border:1px solid #75927b55;background:#18271f;border-radius:18px}.scanner-export>div{flex:1 0 100%}.scanner-export p{font-size:13px;color:#bfd1c5;margin:9px 0 0}.scanner-shell [hidden]{display:none!important}.scanner-shell button:disabled{opacity:.45;cursor:wait}.scanner-controls :is(select,input,button):focus-visible{outline:2px solid #c2acff;outline-offset:3px}@media(max-width:1100px){.scanner-layout{grid-template-columns:270px minmax(0,1fr)}.scanner-previews{grid-template-columns:1fr}}@media(max-width:780px){.scanner-shell{padding:24px 18px 65px}.scanner-heading h1{letter-spacing:-1px;font-size:34px}.scanner-layout{grid-template-columns:minmax(0,1fr)}.scanner-controls{padding:22px}.scanner-previews{grid-template-columns:minmax(0,1fr)}.scanner-controls select,.scanner-controls input{font-size:16px}.scanner-corner{width:40px;height:40px}.scanner-export>button{width:100%}.scanner-empty{padding:45px 20px}.scanner-controls .button{min-height:48px}}
