/* Layout adapted from the Futro1 SwissClippingBot V1.0.1 dashboard. */
:root{color-scheme:dark;--bg:#0d1016;--panel:#161b24;--line:#2a313e;--muted:#9da7b8;--text:#edf1f8;--lime:#d3fa83;--violet:#b5a6f6;--red:#ffaca7;--radius:14px;font-family:Inter,"Segoe UI",Arial,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:1rem;line-height:1.5}button,input,select{font:inherit}button,a,input,select,summary{outline-offset:4px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--lime)}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.42}button,a{transition:background .15s,border-color .15s}button:not(:disabled):hover{filter:brightness(1.13)}.topbar{height:90px;border-bottom:1px solid var(--line);padding:0 5.5%;display:flex;align-items:center;justify-content:space-between;background:#11151d}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;color:var(--text);font-weight:850;letter-spacing:.4px;font-size:15px}.thin{font-weight:450}.brand small{display:block;letter-spacing:2.1px;font-size:.875rem;color:var(--muted);margin-top:4px}.brand small b{background:#30382b;color:var(--lime);padding:2px 5px;border-radius:3px;margin-left:6px}.brandmark{width:39px;height:39px;border-radius:11px;background:var(--lime);color:#111a0c;font-weight:950;font-style:italic;font-size:28px;display:flex;align-items:center;justify-content:center;transform:rotate(-7deg);letter-spacing:-5px;padding-right:6px}.brandmark span{font-size:24px}.connection{font-size:.875rem;color:var(--muted);display:flex;align-items:center;gap:9px}.connection i{width:7px;height:7px;border-radius:50%;background:#aaa}.connection.online i{background:var(--lime);box-shadow:0 0 12px #d3fa8350}.connection.offline i{background:#ffb37f}main{max-width:1320px;margin:auto;padding:45px 36px 24px}.heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow{font-size:.875rem;font-weight:700;letter-spacing:2px;color:var(--lime);margin-bottom:10px}h1{font-size:clamp(32px,4vw,47px);letter-spacing:-1.7px;line-height:1.1;margin:0 0 12px;font-weight:760}.heading p{margin:0;color:var(--muted);font-size:1rem}.local-tag{border:1px solid var(--line);padding:7px 11px;border-radius:5px;font-size:.875rem;letter-spacing:1.3px;color:var(--muted);white-space:nowrap}.local-tag span{color:var(--violet);padding-left:12px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--radius);padding:21px 0;margin-bottom:26px;background:#121720}.metrics>div{display:flex;align-items:center;gap:15px;padding:0 24px;border-right:1px solid var(--line)}.metrics>div:last-child{border:0}.metric-icon{border:1px solid #333b4a;border-radius:10px;width:42px;height:42px;display:grid;place-items:center;color:var(--violet);font-size:23px}.metrics div div>span{display:block;font-size:28px;font-weight:650;line-height:1.2;letter-spacing:-.5px}.metrics div div>span.metric-word{font-size:18px;letter-spacing:0}.metrics small{color:var(--muted);font-size:.875rem}.workspace{display:grid;grid-template-columns: .92fr 1.3fr;gap:24px;margin-bottom:25px}.panel{border:1px solid var(--line);background:var(--panel);border-radius:var(--radius);padding:26px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.section-index{color:var(--muted);font-size:.875rem;letter-spacing:1.7px;font-weight:650}h2{font-size:20px;letter-spacing:-.5px;line-height:1.3;margin:5px 0 0}h3{font-size:1rem;margin:0}.count{background:#212835;border:1px solid #323c4d;padding:3px 8px;border-radius:5px;color:#c3cbd9;font-size:.875rem;white-space:nowrap}.hint{color:var(--muted);font-size:.875rem;margin:15px 0 22px}.channels{display:flex;flex-direction:column;gap:10px;max-height:285px;overflow:auto;margin-bottom:16px}.channel{display:flex;align-items:center;gap:11px;border:1px solid var(--line);border-radius:9px;padding:14px 12px;background:#11161f}.channel.selected{border-color:#738750;background:#1b241b}.channel label{display:flex;gap:11px;align-items:center;flex:1;min-width:0;cursor:pointer}.channel input{accent-color:var(--lime);width:16px;height:16px;margin:0}.avatar{flex:0 0 35px;height:35px;display:grid;place-items:center;background:#333047;color:#cec0ff;border-radius:10px;font-size:15px;font-weight:700}.channel-name{font-size:.875rem;font-weight:650;overflow-wrap:anywhere}.channel-info{min-width:0;flex:1}.channel-sub{display:block;font-size:.875rem;color:var(--muted);margin-top:3px}.channel-sub.live{color:var(--lime)}.toggle{border:1px solid #404857;padding:3px 8px;font-size:.875rem;border-radius:12px;background:transparent;color:#bcc5d4;white-space:nowrap}.toggle.on{color:var(--lime);border-color:#657549;background:#283222}.input-row{border:1px solid #3c4658;display:flex;border-radius:7px;align-items:center;padding:4px 5px 4px 12px;color:var(--muted)}.input-row input{color:var(--text);border:0;background:transparent;min-width:0;width:100%;padding:8px;outline-offset:0;font-size:.875rem}.square-button{width:31px;height:31px;background:#2b3443;color:var(--text);border:1px solid #3b465a;border-radius:5px;font-size:23px;line-height:1}.footnote{font-size:.875rem;color:var(--muted);margin:14px 0 0;max-width:380px}.badge{font-size:.875rem;font-weight:700;letter-spacing:1px;border-radius:4px;padding:5px 9px}.quiet{border:1px solid #514769;background:#2b263e;color:#d0befa}.encoder-row{display:flex;justify-content:space-between;gap:20px;align-items:center;padding-top:8px}.encoder-row p{margin:5px 0 0;font-size:.875rem;color:var(--muted)}.segment{display:flex;padding:4px;background:#10151e;border:1px solid #343d4c;border-radius:8px;gap:3px}.segment button{min-width:87px;padding:7px 12px;background:transparent;border:1px solid transparent;border-radius:5px;color:var(--muted);font-size:.875rem;font-weight:750}.segment small{display:block;font-size:.875rem;letter-spacing:.5px;font-weight:450;margin-top:2px}.segment button[aria-pressed=true]{background:#2a3427;border-color:#6e8056;color:var(--lime)}.processing-note{display:flex;gap:20px;font-size:.875rem;color:var(--muted);margin:22px 0 23px;flex-wrap:wrap}.processing-note span:before{content:'✓';color:var(--violet);margin-right:6px}.clip-button{width:100%;display:flex;align-items:center;justify-content:space-between;border:0;border-radius:9px;background:var(--lime);color:#1b2412;padding:18px 23px;font-size:22px;font-weight:750;text-align:left}.clip-button .clip-symbol{font-size:28px;margin-right:18px}.clip-button>span:nth-child(2){flex:1}.clip-button>span:last-child{font-size:30px;font-weight:400}.clip-button small{display:block;font-size:.875rem;font-weight:500;margin-top:3px}.capture-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:15px;color:var(--muted);font-size:.875rem}.text-button{border:0;background:transparent;color:var(--text);padding:0;text-decoration:underline;text-underline-offset:4px;white-space:nowrap;font-size:.875rem}.worker-detail{font-size:.875rem;color:#edbc86;margin:10px 0 0;overflow-wrap:anywhere}.jobs-panel{padding-bottom:0;overflow:hidden}.job-tools{display:flex;gap:10px;align-items:center}select{background:#111721;color:#c4cddd;border:1px solid #344055;border-radius:6px;padding:7px 12px;font-size:.875rem}.table-wrap{overflow:auto;margin:23px -26px 0}table{width:100%;border-collapse:collapse;text-align:left}th{padding:11px 24px;font-weight:550;letter-spacing:1px;font-size:.875rem;color:var(--muted);border-block:1px solid var(--line);background:#121822;white-space:nowrap}td{padding:17px 24px;border-bottom:1px solid var(--line);font-size:.875rem;color:#b7c2d4}td:first-child{min-width:210px;width:40%}td:last-child{text-align:right;white-space:nowrap}tr:last-child td{border-bottom:0}.clip-name{font-weight:650;font-size:.875rem;color:var(--text);margin-bottom:3px;max-width:440px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clip-meta{font-size:.875rem;color:var(--muted)}.status{white-space:nowrap;border-radius:5px;font-size:.875rem;background:#292a3d;color:#cec5fd;display:inline-block;padding:5px 8px}.status.done{background:#263725;color:#c1e6aa}.status.failed{background:#3e272c;color:var(--red)}.status.processing{background:#36321f;color:#f0db8d}.error-detail{font-size:.875rem;color:var(--red);max-width:300px;margin-top:5px;overflow-wrap:anywhere}.action-button{background:transparent;border:1px solid #414f65;border-radius:6px;padding:6px 10px;color:var(--text);font-size:.875rem}.action-button:hover{background:#2a3342}.encoder-chip{font-family:Consolas,monospace;font-size:.875rem;border:1px solid #41464f;padding:3px 6px;border-radius:4px}.empty{text-align:center;color:var(--muted);padding:24px 14px;font-size:.875rem}.jobs-empty{padding:36px 12px 42px}.jobs-empty>span{font-size:27px;color:var(--violet)}.jobs-empty h3{margin-top:8px;color:#d9dfeb}.jobs-empty p{margin-bottom:0}.requests-section{display:grid;grid-template-columns:.75fr 1.45fr;gap:24px;padding:30px 0;border-bottom:1px solid var(--line)}.requests-section h2{font-size:15px;margin:0}.requests-section p{font-size:.875rem;color:var(--muted)}.requests{font-size:.875rem}.request-row{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:9px 0;border-bottom:1px solid #252c37}.request-row:last-child{border:0}.request-row .message{color:var(--muted);text-align:right}.request-row .message.error{color:var(--red)}.paths{padding:21px 0;color:var(--muted);font-size:.875rem}.paths summary{cursor:pointer;display:list-item;width:fit-content}.paths dl{display:grid;grid-template-columns:120px 1fr;gap:9px}.paths dd{margin:0;overflow-wrap:anywhere;color:#cbd4e1}.paths p{max-width:790px}footer{border-top:1px solid var(--line);padding-top:18px;font-size:.875rem;font-weight:650;letter-spacing:1px;color:#919caf;display:flex;gap:18px;align-items:center}footer span{color:#5f6a7d}footer small{margin-left:auto;letter-spacing:0;font-weight:400}.alert{padding:13px 18px;border:1px solid #6b5231;border-radius:8px;background:#30281e;color:#f4d4a6;font-size:.875rem;margin-bottom:20px}.alert.success{background:#243020;border-color:#586f44;color:var(--lime)}dialog{width:min(960px,94vw);padding:22px;border:1px solid #445069;background:#171d28;border-radius:14px;color:var(--text)}dialog::backdrop{background:#000b}dialog video{display:block;width:100%;max-height:72vh;background:black}.preview-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.preview-head h2{margin:0;font-size:16px}.download-link{display:inline-block;margin-top:16px;color:var(--lime);font-size:.875rem}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.muted{color:var(--muted)}[hidden]{display:none!important}@media(max-width:950px){.metrics>div{padding:0 16px;gap:10px}.metric-icon{display:none}.workspace{grid-template-columns:1fr 1.1fr;gap:16px}.panel{padding:20px}.encoder-row{align-items:flex-start;flex-direction:column;gap:12px}.capture-panel .hint br{display:none}.table-wrap{margin-left:-20px;margin-right:-20px}.capture-footer{align-items:flex-start}.local-tag{display:none}}@media(max-width:680px){.topbar{padding:0 20px;height:80px}.brand{font-size:.875rem}.brandmark{width:32px;height:32px;font-size:24px}.connection{font-size:.875rem;max-width:130px;text-align:right}main{padding:28px 18px}.heading{margin-bottom:24px}.heading p{font-size:.875rem}.metrics{grid-template-columns:1fr 1fr;padding:4px 0;gap:0}.metrics>div{padding:15px 18px}.metrics>div:nth-child(2){border:0}.metrics>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.workspace{grid-template-columns:1fr}.metrics div div>span{font-size:23px}.metrics div div>span.metric-word{font-size:16px}.encoder-row{flex-direction:row;align-items:center;gap:10px}.segment button{min-width:67px;padding:7px}.processing-note{gap:9px}.capture-footer{gap:10px}.capture-footer>span{max-width:180px}.requests-section{grid-template-columns:1fr;gap:8px}.table-wrap{margin-top:18px}th,td{padding:13px 17px}.job-tools{gap:6px}h2{font-size:18px}footer span{display:none}.paths dl{grid-template-columns:1fr}.paths dd{margin-bottom:8px}}
/* Keep off-screen labels inside the page when their table scrolls. */
.sr-only{left:0;top:0}.table-wrap{position:relative}

.watermark-panel{margin-bottom:25px}.watermark-layout{display:grid;grid-template-columns:1fr .8fr;gap:40px;align-items:center}.watermark-panel fieldset{border:0;margin:0;padding:0;min-width:0}.watermark-toggle{display:flex;align-items:center;gap:10px;font-size:.875rem;margin-bottom:18px;font-weight:600}.watermark-toggle input{accent-color:var(--lime);width:16px;height:16px;margin:0}.watermark-inputs{display:grid;grid-template-columns:1fr 1fr;gap:16px 22px}.watermark-inputs label{font-size:.875rem;color:var(--muted);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:7px}.watermark-inputs .wide{grid-column:1/-1}.watermark-inputs input,.watermark-inputs select{width:100%;min-width:0}.watermark-inputs input[type=text]{border:1px solid #3c4658;border-radius:6px;padding:9px 11px;background:#111721;color:var(--text);font-size:.875rem}.watermark-inputs input[type=color]{height:33px;background:#111721;border:1px solid #3c4658;border-radius:6px;padding:3px;cursor:pointer}.watermark-inputs input[type=range]{accent-color:var(--lime);height:20px;margin:0;cursor:pointer}.watermark-inputs output{color:var(--text)}.watermark-actions{display:flex;align-items:center;gap:15px;margin-top:20px}.watermark-actions button{font-size:.875rem;border-color:#768b56;color:var(--lime);padding:8px 12px}.watermark-actions span{font-size:.875rem;color:var(--muted)}.watermark-preview{min-width:0}.watermark-preview canvas{display:block;width:100%;height:auto;background:#111722;border:1px solid #344052;border-radius:9px}.watermark-preview p{font-size:.875rem;color:var(--muted);margin:9px 0 0}.watermark-preview #wm-position-hint{color:var(--violet)}@media(max-width:800px){.watermark-layout{gap:25px}}@media(max-width:680px){.watermark-layout{grid-template-columns:1fr}.watermark-actions{gap:10px}.watermark-preview{max-width:100%}}
/* Public prototype additions; retain the Control Studio palette and layout. */
@font-face{font-family:ClipWatermark;src:url('./assets/graffiti.woff') format('woff');font-display:swap}
html{scroll-behavior:smooth}body{font-size:1rem}.topbar{min-height:90px;height:auto;padding-block:18px;gap:1.5rem;flex-wrap:wrap}.brand{flex-shrink:0}.brand small{font-size:.75rem;letter-spacing:.13em}.studio-nav{display:flex;align-items:center;gap:1.5rem}.back-link{color:var(--muted);text-decoration:none;font-size:.875rem}.back-link:hover{color:var(--lime)}.language-switch{display:flex;gap:.4rem}.language-switch button{min-height:44px;min-width:44px;border:1px solid var(--line);background:#161c26;color:var(--text);border-radius:5px;font-size:.875rem;font-weight:700}.language-switch button[aria-pressed=true]{border-color:var(--lime);color:var(--lime);background:#273224}.skip-link{position:fixed;top:-10rem;left:1rem;background:var(--lime);color:var(--bg);padding:.8rem 1rem;z-index:20}.skip-link:focus{top:1rem}.demo-banner{display:flex;gap:1.2rem;align-items:center;border:1px solid #5a5140;border-left:4px solid var(--lime);background:#171d20;padding:1rem 1.25rem;margin-bottom:2rem;font-size:.875rem;color:#c7d0db}.demo-banner strong{color:var(--lime);flex-shrink:0;font-size:.875rem;letter-spacing:.03em}.local-tag{font-size:.75rem}.heading p,.hint{font-size:1rem}.metrics small{font-size:.875rem}.section-index{font-size:.75rem}.footnote{font-size:.875rem;max-width:none}.channel-sub{font-size:.875rem;line-height:1.5}.channel-name{font-size:1rem}.channel{padding:14px 12px}.channels{max-height:345px}.channel input,.watermark-toggle input{width:20px;height:20px;flex-shrink:0}.toggle{min-height:36px;font-size:.875rem}.input-row input{font-size:1rem}.square-button{width:44px;min-width:44px;height:44px}.capture-footer{flex-wrap:wrap}.capture-footer>span{max-width:350px;font-size:.875rem}.text-button{min-height:44px;text-align:left;white-space:normal;font-size:.875rem}.segment button{min-width:95px;font-size:1rem}.segment small{font-size:.75rem}.processing-note{font-size:.875rem}.processing-note span:before{content:none}.badge{font-size:.75rem}.clip-button small{font-size:.875rem}.clip-button{font-size:1.5rem}.watermark-inputs label,.watermark-toggle,.watermark-actions button{font-size:1rem}.watermark-inputs input[type=text]{font-size:1rem}.watermark-inputs select{min-height:44px;font-size:1rem}.watermark-inputs input[type=color]{height:44px}.watermark-actions{flex-wrap:wrap}.watermark-actions span{font-size:.875rem}.profile-frame{aspect-ratio:16/9;width:100%;position:relative;container-type:inline-size;border:1px solid #344052;border-radius:9px;background:linear-gradient(135deg,#27364a,#141d2c);overflow:hidden}.frame-label{position:absolute;inset:0;display:grid;place-items:center;font-size:.875rem;color:#c3ccdc}.frame-caption{position:absolute;bottom:7%;width:100%;text-align:center;font-size:clamp(.625rem,2.2cqw,.875rem);color:#c3ccdc}.watermark-overlay{position:absolute;max-width:86%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:ClipWatermark,Arial,sans-serif;font-size:calc(var(--wm-size,24) * .078125cqw);line-height:1.35;text-shadow:1px 1px #000}.watermark-overlay[data-position=top_right]{top:3%;right:3%}.watermark-overlay[data-position=top_left]{top:3%;left:3%}.watermark-overlay[data-position=bottom_right]{bottom:3%;right:3%}.watermark-overlay[data-position=bottom_left]{bottom:3%;left:3%}.watermark-preview p{font-size:.875rem}.watermark-preview #wm-position-hint{color:var(--violet)}.clip-meta,.error-detail,.encoder-chip,.status{font-size:.875rem}.clip-name{font-size:1rem;white-space:normal;overflow-wrap:anywhere}.action-button{font-size:.875rem;min-height:44px}.table-wrap{outline-offset:-3px}.table-wrap th{font-size:.75rem}.table-wrap td{font-size:.875rem}.table-wrap th:nth-child(4){min-width:145px}.job-tools select{font-size:.875rem;min-height:44px}.requests-section p,.requests{font-size:.875rem}.request-row{gap:1rem;flex-wrap:wrap}.request-row>span{overflow-wrap:anywhere}.request-row .message{text-align:left}.preview-head h2{font-size:1.1rem;overflow-wrap:anywhere}.preview-head{gap:1rem}dialog{max-height:90vh;overflow:auto}dialog .hint{font-size:.875rem;margin-bottom:0}footer{font-size:.75rem;flex-wrap:wrap}footer small{font-size:.875rem}.workspace,.watermark-layout,.panel{min-width:0}.count{font-size:.875rem}.brandmark{letter-spacing:-5px}.alert{font-size:1rem}
@media(max-width:1100px){.workspace{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}.encoder-row{flex-direction:column;align-items:flex-start;gap:1rem}.metrics>div{padding:0 16px}.metric-icon{display:none}.watermark-layout{gap:1.5rem;grid-template-columns:minmax(0,1fr) minmax(0,.8fr)}}
@media(max-width:800px){.topbar{padding-inline:24px}.studio-nav{gap:1rem;flex-wrap:wrap}.demo-banner{align-items:flex-start;flex-direction:column;gap:.5rem}.workspace{grid-template-columns:1fr}.watermark-layout{grid-template-columns:1fr}.watermark-preview{max-width:600px}.heading .local-tag{display:none}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));padding:0}.metrics>div{padding:18px}.metrics>div:nth-child(2){border-right:0}.metrics>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.encoder-row{flex-direction:row;align-items:center;flex-wrap:wrap}}
@media(max-width:560px){.topbar{padding:18px}.studio-nav{width:100%;justify-content:space-between}.back-link{max-width:62%;line-height:1.5}.brand{font-size:.875rem}.brand small{font-size:.75rem}.brandmark{width:36px;height:36px}main{padding:24px 18px}.heading p{font-size:1rem}.panel{padding:20px 16px}.table-wrap{margin-inline:-16px}.panel-head{align-items:flex-start;flex-wrap:wrap}.job-tools{width:100%;justify-content:space-between}.channel{gap:8px;padding:12px 8px}.channel label{gap:8px}.channel .avatar{display:none}.channel-name{font-size:.9375rem}.toggle{padding-inline:8px}.capture-footer{gap:.5rem}.capture-footer>span{max-width:none}.clip-button{padding:16px}.clip-button .clip-symbol{margin-right:12px}.clip-button>span:last-child{font-size:24px}.metrics div div>span.metric-word{font-size:1rem}.watermark-actions{gap:.8rem}.watermark-inputs{gap:1rem}.requests-section{grid-template-columns:1fr}footer small{margin-left:0}footer>span{display:block}.frame-label{font-size:.8125rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}