/* AZRA Composer Pro — dark / white / yellow. Drop-in skin over the existing composer ids. */
:root{--cp-y:#FFD60A;--cp-y2:#e6bf00;--cp-line:#232323;--cp-card:#0c0c0c;--cp-mut:#8a8a8a}
.cp-sp{flex:1}
/* media card */
.cp-media{margin:10px 0 4px;border:1px solid var(--cp-line);border-radius:18px;background:var(--cp-card);overflow:hidden}
.cp-stage{position:relative;background:#000;display:grid;place-items:center;max-height:46dvh}
.cp-stage video{max-width:100%;max-height:46dvh;display:block}
.cp-play{position:absolute;inset:auto auto 12px 12px;width:44px;height:44px;border-radius:50%;border:0;background:var(--cp-y);color:#000;font-size:16px;cursor:pointer}
.cp-rm{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(0,0,0,.7);color:#fff;font-size:16px;cursor:pointer}
.cp-tl{padding:12px 14px 14px;direction:ltr}
.cp-row{display:flex;justify-content:space-between;font:600 12px 'JetBrains Mono',monospace;color:#fff;margin-bottom:8px}
.cp-row b{color:var(--cp-y)}
.cp-track{position:relative;height:56px;border-radius:10px;touch-action:none;user-select:none}
.cp-strip{position:absolute;inset:0;display:flex;border-radius:10px;overflow:hidden;background:#161616}
.cp-strip canvas{flex:1;min-width:0;height:100%;object-fit:cover;opacity:.55}
.cp-dim{position:absolute;top:0;bottom:0;background:rgba(0,0,0,.72);pointer-events:none}
.cp-win{position:absolute;top:-3px;bottom:-3px;border:3px solid var(--cp-y);border-radius:10px;pointer-events:none}
.cp-h{position:absolute;top:-3px;bottom:-3px;width:22px;background:var(--cp-y);cursor:ew-resize;display:grid;place-items:center;touch-action:none}
.cp-h::after{content:"";width:3px;height:20px;border-radius:2px;background:#000}
.cp-h.a{border-radius:10px 0 0 10px;margin-left:-22px}.cp-h.b{border-radius:0 10px 10px 0}
.cp-ph{position:absolute;top:-6px;bottom:-6px;width:2px;background:#fff;pointer-events:none;box-shadow:0 0 0 1px #000}
.cp-note{font-size:12px;color:var(--cp-mut);margin-top:10px;direction:inherit}
.cp-busy{position:absolute;inset:0;background:rgba(0,0,0,.85);display:grid;place-items:center;font:700 14px 'JetBrains Mono',monospace;color:var(--cp-y);z-index:9}
.cp-code{margin:8px 0;padding:10px 12px;background:#0c0c0c;border:1px solid var(--cp-line);border-radius:12px;font:13px 'JetBrains Mono',monospace;color:#ddd}
@media(prefers-reduced-motion:reduce){.cp-ring .v,.cp-post{transition:none}}

/* photo editor */
.cp-ps{touch-action:none}.cp-ps .cp-cv{max-width:100%;max-height:56dvh;width:auto;height:auto;display:block;cursor:grab;touch-action:none}
.cp-cnt{position:absolute;top:10px;left:10px;background:rgba(0,0,0,.7);color:#fff;border-radius:999px;padding:5px 10px;font:700 12px 'JetBrains Mono',monospace}
.cp-rot{position:absolute;bottom:12px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:var(--cp-y);color:#000;font-size:20px;cursor:pointer}
.cp-pt{padding:12px 14px 14px}
.cp-pills,.cp-tabs{display:flex;gap:6px;margin-bottom:10px}
.cp-pills button{flex:1;border:1px solid var(--cp-line);background:#111;color:#fff;border-radius:999px;padding:8px 0;font:700 12px 'JetBrains Mono',monospace;cursor:pointer}
.cp-pills button.on{background:var(--cp-y);color:#000;border-color:var(--cp-y)}
.cp-tabs{border-bottom:1px solid var(--cp-line)}.cp-tabs button{flex:1;background:none;border:0;border-bottom:3px solid transparent;color:var(--cp-mut);padding:10px 0;font-weight:800;font-size:14px;cursor:pointer}
.cp-tabs button.on{color:#fff;border-bottom-color:var(--cp-y)}
.cp-fl{display:flex;gap:8px;overflow-x:auto;padding:4px 0 10px}.cp-fl[hidden],.cp-adj[hidden]{display:none}
.cp-fl button{flex:none;background:none;border:0;color:var(--cp-mut);font-size:12px;font-weight:700;cursor:pointer;display:grid;gap:5px;justify-items:center}
.cp-fl canvas{width:64px;height:64px;border-radius:12px;border:2px solid transparent;object-fit:cover}
.cp-fl button.on{color:var(--cp-y)}.cp-fl button.on canvas{border-color:var(--cp-y)}
.cp-adj{display:grid;gap:4px;padding:6px 0 10px}.cp-adj label{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:10px;color:#fff!important;font-size:13px!important}
.cp-adj input{accent-color:var(--cp-y);width:100%;height:28px}
.cp-th{display:flex;gap:8px;align-items:center;overflow-x:auto;padding:4px 0}
.cp-th button{flex:none;width:52px;height:52px;border-radius:10px;border:2px solid transparent;padding:0;background:#111;overflow:hidden;cursor:pointer;color:var(--cp-y);font-size:24px}
.cp-th button.on{border-color:var(--cp-y)}.cp-th img{width:100%;height:100%;object-fit:cover;display:block}
.cp-th .cp-add{border:2px dashed #444}.cp-th .cp-mv{width:38px;height:38px;border-radius:50%;background:#1a1a1a;font-size:22px}.cp-th .cp-sp{flex:1}