:root{color:#e8f1f8;background-color:#0b1f2f;font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5}body{background:#0b1f2f;margin:0}*{box-sizing:border-box}.app{flex-direction:column;gap:1rem;max-width:1200px;margin:0 auto;padding:1rem;display:flex}header h1{margin:0}header .muted{margin-top:.25rem}.controls{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:.75rem;display:grid}.panel{background:#122c46;border:1px solid #1f3f63;border-radius:12px;padding:1rem}.video-wrapper{border-radius:10px;position:relative;overflow:hidden}.video-feed{background:#000;width:100%;display:block}.frame-guide{pointer-events:none;border:2px dashed #fff9;border-radius:8px;position:absolute;inset:10%}button,.file-label{cursor:pointer;color:#fff;text-align:center;background:#2d7df4;border:none;border-radius:10px;width:100%;padding:.75rem 1rem;font-weight:600}button:disabled{opacity:.5;cursor:not-allowed}.file-label input{display:none}.slider-label{margin-bottom:.5rem;display:block}input[type=range]{width:100%}.actions{flex-direction:column;gap:.5rem;display:flex}main{grid-template-columns:1fr;gap:1rem;display:grid}@media (width>=900px){main{grid-template-columns:2fr 1fr}}.overlay-wrapper{background:#04101c;border:1px solid #1f3f63;border-radius:12px;width:100%;position:relative;overflow:auto}.base-canvas,.overlay-canvas{width:100%;height:auto;display:block}.overlay-canvas{pointer-events:none;position:absolute;inset:0}.side-panel{background:#122c46;border:1px solid #1f3f63;border-radius:12px;min-height:320px;padding:1rem}.decoded{white-space:pre-wrap;background:#0f2237;border-radius:8px;min-height:120px;padding:.75rem}.muted{color:#b6c8dd;font-size:.9rem}.error{color:#ffb4a2}ul{padding-left:1rem}