:root{color-scheme:dark;--ink:#0b0e12;--line:#29343e;--text:#e8ebee;--muted:#96a3af;--lime:#9cff5a}*{box-sizing:border-box}body{margin:0;background:#090c10;color:var(--text);font:14px Inter,system-ui,sans-serif}.player-header{display:flex;align-items:center;gap:32px;padding:22px 28px;border-bottom:1px solid var(--line)}.wordmark{color:var(--text);text-decoration:none;font:600 21px 'Space Grotesk',sans-serif;letter-spacing:2px}.player-header p{margin:0;color:#c6cdd4}.direction{margin-left:auto;color:var(--muted);font:10px 'IBM Plex Mono',monospace;letter-spacing:1px;text-transform:uppercase}nav{display:flex;gap:6px;padding:14px 28px;overflow:auto}button{font:inherit;color:var(--text);background:#172029;border:1px solid #33404c;border-radius:5px;padding:10px 16px;cursor:pointer;white-space:nowrap}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--lime);outline-offset:4px}button:hover{border-color:var(--lime)}button:disabled{opacity:.4;cursor:default}nav button{background:transparent;border-color:transparent;padding:10px 14px}nav button[aria-current=true]{background:#1d2a1b;color:var(--lime);border-color:#354a30}nav small{display:block;color:var(--muted);font-size:10px;margin-top:5px}main{max-width:1920px;margin:0 auto;padding:0 24px 24px}#viewport{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--ink);border:1px solid var(--line);border-radius:8px}#stage{width:1920px;height:1080px;transform-origin:top left;position:absolute;top:0;left:0;overflow:hidden}#stage>[data-pencil-id]{left:0!important;top:0!important}#stage [data-pencil-name]{will-change:auto}.controls{display:flex;align-items:center;gap:12px;padding:18px 0 10px}.controls input{flex:1;min-width:80px;accent-color:var(--lime)}output{font:11px 'IBM Plex Mono',monospace;color:var(--muted)}#review:not(:disabled),#approve{background:var(--lime);color:#0b0e12;border-color:var(--lime)}.caption{display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}.caption p{color:#d4dce3;margin:8px 0}.caption span{font-size:10px;white-space:nowrap}.agent-cursor{position:absolute;z-index:200;pointer-events:none;display:flex;align-items:flex-start;gap:8px;filter:drop-shadow(0 3px 5px #0008)}.agent-cursor svg{width:24px;height:30px;flex-shrink:0}.agent-cursor span{background:var(--lime);color:#0b0e12;padding:8px 12px;font:500 13px 'IBM Plex Mono',monospace;border-radius:4px;margin-top:19px;white-space:nowrap}.work-highlight{position:absolute;z-index:150;border:2px solid var(--lime);pointer-events:none;border-radius:2px;box-shadow:0 0 0 4px #9cff5a0b}.scanline{position:absolute;height:2px;background:var(--lime);box-shadow:0 0 18px #9cff5a88;z-index:151;pointer-events:none}dialog{width:min(660px,calc(100vw - 32px));padding:40px;background:#111820;color:var(--text);border:1px solid #40505e;border-radius:12px}dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}dialog h1{font:500 30px 'Space Grotesk',sans-serif;margin:12px 0 18px}dialog p{line-height:1.6;color:#b5c0ca}dialog li{margin:14px 0;line-height:1.6}dialog .eyebrow{font:11px 'IBM Plex Mono',monospace;color:var(--lime);letter-spacing:2px}dialog .close{position:absolute;right:15px;top:15px;background:none;border:0;font-size:24px}.review-note{font-size:12px;border-top:1px solid var(--line);padding-top:20px}#revise{margin-left:8px}@media(max-width:650px){.player-header{padding:18px;gap:18px}.player-header p{font-size:12px}.direction{display:none}nav{padding:10px 12px}nav button{font-size:12px}main{padding:0 10px 20px}.controls{gap:7px;flex-wrap:wrap}.controls button{font-size:12px;padding:9px 10px}.caption{align-items:flex-start;flex-direction:column;gap:0}output{font-size:10px}.caption span{white-space:normal}dialog{padding:28px 22px}dialog h1{font-size:25px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.agent-cursor{align-items:center;gap:7px}.agent-cursor span{margin-top:0;padding:8px 12px}.agent-signal{display:block;width:12px;height:12px;border:2px solid #9cff5a;border-radius:50%;background:#0b0e12;box-shadow:0 0 0 4px #9cff5a22}.agent-cursor svg{display:none}
body.embedded .player-header,body.embedded #workflows{display:none}body.embedded main{padding:0}body.embedded #viewport{border:0;border-radius:0}body.embedded .controls{padding:12px 12px 4px;gap:8px}body.embedded .caption{padding:0 12px 6px}body.embedded .caption span{display:none}body.embedded .controls button{padding:7px 12px;font-size:12px}body.embedded .caption p{font-size:11px}body.embedded #time{font-size:10px}

.agent-signal{width:30px;height:30px;border:0;border-radius:0;box-shadow:none;background:transparent url("assets/synter-mark.png") center/contain no-repeat;flex-shrink:0}

body.agents-page{--muted:#96a3af}
[data-pencil-name="Meta size"],[data-pencil-name="LinkedIn size"],[data-pencil-name="Story size"]{color:#a4adb7!important}
@media(max-width:650px){#workflows button,.controls button,.controls input,dialog button,.wordmark{min-width:44px;min-height:44px}}
#workflows button{flex:0 0 auto}