html,body,#root{min-height:100%}body{margin:0}img{max-width:100%}:root{--bg:#0f1720;--panel:#17212c;--panel-2:#1e2a37;--line:#2b3a4a;--text:#e8eef5;--muted:#96a7b8;--accent:#3ba9a0;--accent-hi:#4ac4b9;--danger:#e2607a;--warn:#e0a13c;--radius:12px}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;margin:0;font:15px/1.55 Segoe UI,system-ui,-apple-system,sans-serif}.page{max-width:1180px;margin:0 auto;padding:28px 22px 40px}.header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px;display:flex}.header h1{letter-spacing:-.02em;margin:0;font-size:25px}.header__sub{color:var(--muted);margin:5px 0 0;font-size:14px}.badges{flex-wrap:wrap;gap:8px;display:flex}.badge{background:var(--panel-2);border:1px solid var(--line);color:var(--muted);border-radius:999px;padding:4px 11px;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:12px}.badge--warn{color:var(--warn);background:#2a2113;border-color:#4a3a1e}.badge--danger{color:var(--danger);background:#2c161c;border-color:#4d2531}.layout{grid-template-columns:minmax(320px,400px) 1fr;align-items:start;gap:22px;display:grid}@media (width<=880px){.layout{grid-template-columns:1fr}}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:18px}.stage{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);flex-direction:column;justify-content:center;min-height:440px;padding:18px;display:flex}.tabs{background:var(--bg);border-radius:10px;gap:6px;margin-bottom:16px;padding:4px;display:flex}.tab{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:7px;flex:1;padding:9px 10px;font-size:13.5px;transition:background .15s,color .15s}.tab--active{background:var(--panel-2);color:var(--text)}.tab:disabled{cursor:not-allowed;opacity:.55}.label{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin:0 0 7px;font-size:12.5px;font-weight:600;display:block}.textarea{border:1px solid var(--line);background:var(--bg);width:100%;color:var(--text);font:inherit;resize:vertical;border-radius:9px;margin-bottom:14px;padding:11px 12px;font-size:13px;line-height:1.5}.textarea:focus-visible,.drop:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.textarea:disabled{opacity:.6}.rule{border:0;border-top:1px solid var(--line);margin:18px 0 16px}.btn{width:100%;font:inherit;text-align:center;cursor:pointer;border:0;border-radius:9px;padding:11px 14px;font-weight:600;text-decoration:none;transition:background .15s,transform 50ms;display:inline-block}.btn:active:not(:disabled){transform:translateY(1px)}.btn--primary{background:var(--accent);color:#05201e}.btn--primary:hover:not(:disabled){background:var(--accent-hi)}.btn--ghost{border:1px solid var(--line);color:var(--text);background:0 0;margin-top:9px}.btn--ghost:hover{border-color:var(--accent);color:var(--accent-hi)}.btn:disabled{opacity:.5;cursor:not-allowed}.styles{flex-wrap:wrap;gap:7px;margin-bottom:10px;display:flex}.chip{border:1px solid var(--line);background:var(--bg);color:var(--muted);font:inherit;cursor:pointer;border-radius:999px;padding:7px 13px;font-size:13px;transition:border-color .15s,color .15s}.chip--active{border-color:var(--accent);color:var(--accent-hi);background:#12292a}.chip:disabled{opacity:.5;cursor:not-allowed}.hint{color:var(--muted);margin:0 0 14px;font-size:12.5px}.hint--center{text-align:center;margin-top:12px;margin-bottom:0}.notice{color:#f0d4a4;background:#2a2113;border:1px solid #4a3a1e;border-radius:9px;margin:0 0 14px;padding:10px 12px;font-size:12.5px;line-height:1.6}.notice code{background:#0000004d;border-radius:4px;padding:1px 5px;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:11.5px}.error,.field-error{color:#f2b6c2;background:#2c161c;border:1px solid #4d2531;border-radius:9px;margin:14px 0 0;padding:10px 12px;font-size:13px}.drop{border:2px dashed var(--line);text-align:center;cursor:pointer;border-radius:11px;padding:34px 18px;transition:border-color .15s,background .15s}.drop:hover:not(.drop--disabled),.drop--over{border-color:var(--accent);background:#12292a}.drop--disabled{opacity:.5;cursor:not-allowed}.drop__icon{font-size:28px}.drop__title{margin:10px 0 5px;font-weight:600}.drop__hint{color:var(--muted);margin:0;font-size:12.5px}.cam{aspect-ratio:4/3;background:var(--bg);border:1px solid var(--line);border-radius:11px;width:100%;margin-bottom:12px;position:relative;overflow:hidden}.cam__video{object-fit:cover;width:100%;height:100%;display:block}.cam__idle{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;font-size:13px;display:flex;position:absolute;inset:0}.cam__idle p{margin:8px 0 0}.cam__icon{font-size:28px}.cam__guide{pointer-events:none;border:2px dashed #ffffff73;border-radius:50%;width:62%;height:82%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cam__quality{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:11px;display:flex}.cam__quality-label{letter-spacing:.03em;text-transform:uppercase;color:var(--muted);margin-right:2px;font-size:11.5px;font-weight:600}.cam__res{color:var(--muted);margin-left:auto;font-family:ui-monospace,Cascadia Code,Consolas,monospace;font-size:11px}.chip--sm{padding:4px 10px;font-size:12px}.cam__controls{flex-direction:column;gap:9px;display:flex}.cam__row{gap:9px;display:flex}.cam__row .btn{margin-top:0}.placeholder{text-align:center;color:var(--muted)}.placeholder__icon{margin-bottom:10px;font-size:42px}.placeholder--busy p{margin:6px 0 0}.spinner{border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:34px;height:34px;margin:0 auto 14px;animation:.85s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:2.4s}}.single img{border-radius:10px;width:100%;display:block}.compare{-webkit-user-select:none;user-select:none;border-radius:10px;width:100%;line-height:0;position:relative;overflow:hidden}.compare__base{width:100%;display:block}.compare__overlay{object-fit:cover;width:100%;height:100%;position:absolute;inset:0}.compare__divider{pointer-events:none;z-index:2;background:#ffffffe6;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0}.compare__grip{color:#0f1720;text-align:center;letter-spacing:-1px;background:#fffffff0;border-radius:50%;width:38px;height:38px;font-size:15px;font-weight:700;line-height:38px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 2px 10px #0006}.compare__tag{z-index:2;color:#fff;letter-spacing:.05em;text-transform:uppercase;pointer-events:none;background:#0f1720c7;border-radius:999px;padding:3px 10px;font-size:11.5px;font-weight:600;line-height:1.7;position:absolute;top:10px}.compare__tag--left{left:10px}.compare__tag--right{right:10px}.compare__range{opacity:0;cursor:ew-resize;z-index:3;appearance:none;background:0 0;width:100%;height:100%;margin:0;position:absolute;inset:0}.compare__range::-webkit-slider-thumb{-webkit-appearance:none;cursor:ew-resize;width:44px;height:100%}.compare__range::-moz-range-thumb{cursor:ew-resize;border:0;width:44px;height:100%}.compare:focus-within .compare__divider{box-shadow:0 0 0 2px var(--accent)}.boot{background:var(--bg);min-height:100vh}.gate{justify-content:center;align-items:center;min-height:100vh;padding:22px;display:flex}.gate__card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);text-align:center;width:100%;max-width:340px;padding:30px 26px}.gate__icon{font-size:34px}.gate__card h1{letter-spacing:-.01em;margin:12px 0 4px;font-size:21px}.gate__sub{color:var(--muted);margin:0 0 20px;font-size:13.5px}.gate__input{border:1px solid var(--line);background:var(--bg);width:100%;color:var(--text);font:inherit;text-align:center;letter-spacing:.1em;border-radius:9px;margin-bottom:11px;padding:11px 12px}.gate__input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.disclaimer{color:#f0d4a4;background:#2a2113;border:1px solid #4a3a1e;border-radius:10px;margin:22px 0 0;padding:12px 15px;font-size:12.5px;line-height:1.6}.disclaimer strong{color:var(--warn)}
