:root{--p:#9B1D5A;--s:#F4F4F6;--t:#222;--bg:#fff;--br:#d6d6dc;--a:#1E73BE}@media(prefers-color-scheme:dark){:root{--s:#241d21;--t:#eee;--bg:#161214;--br:#4a3a42}}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;font-family:'Noto Sans',system-ui,sans-serif;background:var(--bg);color:var(--t);line-height:1.5}header{padding:18px 14px 4px;max-width:760px;margin:auto}h1{margin:0;font-size:1.5rem;color:var(--p)}header p{margin:4px 0 0;opacity:.8;font-size:.95rem}main{max-width:760px;margin:auto;padding:8px 12px 20px}.box{border:2px dashed var(--p);background:var(--s);border-radius:12px;padding:26px;text-align:center;margin-top:10px}#ed{background:var(--s);border:1px solid var(--br);border-radius:12px;padding:12px;margin-top:6px}button{background:var(--p);color:#fff;border:0;border-radius:8px;padding:9px 16px;font:inherit;cursor:pointer}button.g{background:var(--a)}button:disabled{opacity:.45;cursor:default}button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--a);outline-offset:2px}.row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}.nav{justify-content:center;margin-top:0}.b button{flex:1}.pl{text-align:center;font-weight:700;margin:2px 0 6px}.c{text-align:center}.w{position:relative;display:inline-block;max-width:100%;border:1px solid var(--br);touch-action:none;cursor:crosshair}#cv{display:block;max-width:100%;max-height:clamp(220px,calc(100vh - 290px),620px);width:auto;height:auto}#sel{position:absolute;border:2px solid var(--p);pointer-events:none;display:none}#sel i{position:absolute;width:14px;height:14px;background:var(--p);border:2px solid #fff;border-radius:50%}#sel i:nth-child(1){left:-8px;top:-8px}#sel i:nth-child(2){left:calc(50% - 8px);top:-8px}#sel i:nth-child(3){right:-8px;top:-8px}#sel i:nth-child(4){right:-8px;top:calc(50% - 8px)}#sel i:nth-child(5){right:-8px;bottom:-8px}#sel i:nth-child(6){left:calc(50% - 8px);bottom:-8px}#sel i:nth-child(7){left:-8px;bottom:-8px}#sel i:nth-child(8){left:-8px;top:calc(50% - 8px)}.tabs{display:flex;gap:10px;margin:12px 0}.tab{flex:1;display:flex;gap:8px;align-items:center;justify-content:center;background:var(--bg);color:var(--t);border:2px solid var(--br)}.tab.on{border-color:var(--p);color:var(--p);font-weight:700}select{font:inherit;padding:7px;border-radius:8px;border:1px solid var(--br);background:var(--bg);color:var(--t)}label{display:flex;gap:6px;align-items:center}input[type=number]{width:68px;font:inherit;padding:7px;border-radius:8px;border:1px solid var(--br);background:var(--bg);color:var(--t)}#msg{margin:8px 0 0;font-size:.9rem}#msg:empty{display:none}