#livecamsection{--lc-accent:#66f5bd}.lc-capture{display:flex;gap:14px;align-items:flex-start}.lc-preview{display:block;width:132px;aspect-ratio:4/3;object-fit:cover;background:#080d13;border:1px solid #536174;border-radius:10px;flex:none}.lc-controls{display:flex;gap:8px;flex-wrap:wrap;min-width:0}.lc-controls button[aria-pressed=true]{border-color:var(--lc-accent);box-shadow:inset 0 -2px var(--lc-accent)}.lc-controls .lc-status{width:100%;font-size:.85rem;margin:0;color:var(--muted,#b2bed0)}.lc-controls label{display:flex;gap:8px;align-items:center;font-size:.8rem}.lc-meter{max-width:140px;height:14px}.lc-sources,.lc-layout-controls{display:flex;gap:14px;flex-wrap:wrap;margin:16px 0}.lc-sources label,.lc-layout-controls label{display:flex;gap:8px;align-items:center;min-width:0;font-size:.9rem}.lc-sources select{max-width:210px}.lc-commentbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px}.lc-commentbar h3{margin:0 auto 0 0}.lc-commentbar label{font-size:.85rem}.lc-comments{height:clamp(320px,48vh,680px);overflow:auto;overscroll-behavior:contain;margin:12px 0 20px;border:1px solid #425066;border-radius:10px;background:#080d1329;scrollbar-gutter:stable}.lc-comments:empty:before{content:'Comentariile TikTok LIVE vor apărea aici.';display:block;padding:24px;color:var(--muted,#b2bed0)}.lc-comments article{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:16px;border-bottom:1px solid #64748b40}.lc-comments strong{font-size:1rem;color:var(--lc-accent);overflow-wrap:anywhere}.lc-comments p{grid-column:1;font-size:clamp(1.1rem,2vw,1.45rem);line-height:1.4;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.lc-comments button{grid-column:2;grid-row:1/3;align-self:center;font-size:.8rem}.lc-editor summary{cursor:pointer;font-weight:600;padding:12px 0}.lc-editor>p{font-size:.85rem;color:var(--muted,#b2bed0)}.lc-stage{position:relative;width:min(100%,340px);aspect-ratio:9/16;background:#111824;overflow:hidden;border:1px solid #64748b;border-radius:6px}.lc-stage iframe{position:absolute;inset:0;width:1080px;height:1920px;transform:scale(calc(340 / 1080));transform-origin:top left;pointer-events:none;border:0}.lc-frame{position:absolute;touch-action:none;cursor:move;border:2px solid var(--lc-accent);background:#66f5bd28;box-sizing:border-box;display:flex;align-items:center;justify-content:center;color:#fff;min-width:10px;min-height:10px}.lc-frame:focus-visible{outline:3px solid #fff;outline-offset:2px}.lc-frame span{font-size:11px;pointer-events:none;text-shadow:0 1px 4px #000}.lc-resize{position:absolute!important;right:-3px;bottom:-3px;width:24px!important;height:24px;min-height:0!important;padding:0!important;border-radius:4px!important;background:#fff!important;cursor:nwse-resize;touch-action:none}.lc-layout-controls input[type=color]{width:42px;padding:2px}.lc-layout-controls input[type=checkbox],.lc-commentbar input{width:auto}@media(max-width:600px){.lc-preview{width:108px}.lc-capture{gap:10px}.lc-controls{gap:6px}.lc-controls button{font-size:.82rem;padding:8px}.lc-sources{gap:10px}.lc-sources label{flex:1 1 140px;flex-wrap:wrap}.lc-sources select{width:100%;max-width:100%}.lc-comments article{padding:12px;gap:4px 8px}.lc-comments button{font-size:.75rem;padding:7px}.lc-stage{width:min(100%,300px)}.lc-stage iframe{transform:scale(calc(300 / 1080))}}
.lc-admin{margin-top:18px;border-top:1px solid #64748b55;padding-top:12px}.lc-admin summary{cursor:pointer;font-weight:600}.lc-admin form{display:grid;gap:12px;max-width:540px;margin-top:14px}.lc-admin label{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.lc-admin textarea,.lc-admin input[type=password]{width:100%;box-sizing:border-box}.lc-admin input[type=checkbox]{width:auto}.lc-admin p{font-size:.85rem;color:var(--muted,#b2bed0)}

/* The live workspace shares the viewport with the application navigation. */
#livecamsection{position:relative;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:10px;height:var(--lc-workspace-height,70dvh);min-height:180px;min-width:0}
#livecamsection .lc-capture{align-items:center;min-width:0}
#livecamsection .lc-controls{align-items:center;flex:1}
#livecamsection .lc-status{line-height:1.35;overflow-wrap:anywhere}
#livecamsection .lc-commentbar{margin:0;gap:8px}
#livecamsection .lc-commentbar h3{font-size:1rem}
#livecamsection .lc-commentbar label{display:flex;align-items:center;gap:6px}
#livecamsection .lc-commentbar input{margin:0}
#livecamsection .lc-comments{height:auto;min-height:0;margin:0;overflow:auto;touch-action:pan-y}
.lc-settings>summary{cursor:pointer;color:var(--muted,#b2bed0);font-size:.85rem;padding:7px 0;width:max-content}
.lc-settings-panel{display:none}
.lc-settings[open]>.lc-settings-panel{display:block;position:absolute;z-index:20;inset:0 0 44px;padding:18px;background:var(--panel,#151b27);border:1px solid #536174;border-radius:12px;overflow:auto;overscroll-behavior:contain;box-shadow:0 8px 30px #0008}
.lc-settings[open]>summary{color:var(--lc-accent)}
.lc-settings-panel .lc-sources{margin-top:0}
.lc-settings-panel input,.lc-settings-panel select{margin-top:0}
#livecamsection button:focus-visible,#livecamsection summary:focus-visible{outline:2px solid var(--lc-accent);outline-offset:3px}
@media(max-width:650px){
 #app:has(#livecam:not(.hidden))>main{padding:12px 16px;margin:0}
 #app:has(#livecam:not(.hidden))>main>header{margin-bottom:10px;gap:8px}
 #app:has(#livecam:not(.hidden))>main>header h1{font-size:24px;margin-bottom:2px}
 #app:has(#livecam:not(.hidden))>main>header p{font-size:12px;margin:0}
 #app:has(#livecam:not(.hidden)) .workspace-toolbar{margin-bottom:8px}
 #livecamsection{gap:8px}
 #livecamsection .lc-preview{width:96px}
 #livecamsection .lc-controls{gap:6px}
 #livecamsection .lc-controls button{min-height:36px;padding:7px 9px;font-size:.78rem;flex:1 1 40%}
 #livecamsection .lc-controls [data-lc=stop]{flex:0 1 auto}
 #livecamsection .lc-controls label{font-size:.72rem;gap:5px}
 #livecamsection .lc-meter{width:64px}
 #livecamsection .lc-status{font-size:.75rem}
 #livecamsection .lc-commentbar h3{font-size:.92rem}
 #livecamsection .lc-commentbar>button{font-size:.78rem;padding:7px 10px;min-height:34px}
 #livecamsection .lc-commentbar label{font-size:.75rem;flex:1 0 100%}
 #livecamsection .lc-comments article{padding:10px;gap:3px 8px}
 #livecamsection .lc-comments p{font-size:1.05rem;line-height:1.35}
 #livecamsection .lc-comments strong{font-size:.88rem}
 #livecamsection .lc-comments button{min-height:36px;padding:7px}
}
@media(max-height:500px) and (orientation:landscape){
 #app:has(#livecam:not(.hidden)){grid-template-columns:150px minmax(0,1fr)}
 #app:has(#livecam:not(.hidden))>aside{padding:10px}
 #app:has(#livecam:not(.hidden))>main{padding:10px 16px;margin:0}
 #app:has(#livecam:not(.hidden))>main>header{margin-bottom:6px}
 #app:has(#livecam:not(.hidden))>main>header h1{font-size:20px;margin:0}
 #app:has(#livecam:not(.hidden))>main>header p{display:none}
 #livecamsection{gap:6px}
 #livecamsection .lc-preview{width:80px}
 #livecamsection .lc-controls button{font-size:.75rem;padding:6px 8px;min-height:32px}
 #livecamsection .lc-status{font-size:.72rem}
 #livecamsection .lc-commentbar{gap:6px}
 #livecamsection .lc-commentbar label{flex:initial;font-size:.72rem}
 #livecamsection .lc-commentbar h3{font-size:.85rem}
}
#livecamsection>.lc-settings{margin:0;padding:0;border-top:1px solid var(--line,#273044)}
@media(max-width:650px){
 #app:has(#livecam:not(.hidden)) .workspace-toolbar:has(#workspace-status:empty){justify-content:flex-end}
 #app:has(#livecam:not(.hidden)) #workspace-status:empty{display:none}
 #app:has(#livecam:not(.hidden)) #error:empty{display:none}
 #livecamsection .lc-preview{width:80px}
 #livecamsection .lc-controls button{font-size:.74rem;padding:6px;min-width:0}
}
#app:has(#livecam:not(.hidden)) #error:empty{display:none}
@media(max-height:500px) and (orientation:landscape){
 #app:has(#livecam:not(.hidden)) .workspace-toolbar{margin-bottom:6px}
 #app:has(#livecam:not(.hidden)) #workspace-status:empty{display:none}
 #livecamsection .lc-commentbar>button{padding:6px 9px;font-size:.75rem}
}
@media(max-width:650px){
 #livecamsection .lc-controls{display:grid;grid-template-columns:1fr 1fr;align-items:center}
 #livecamsection .lc-controls [data-lc=stop]{grid-column:1;grid-row:2}
 #livecamsection .lc-controls label{grid-column:2;grid-row:2;flex-wrap:wrap;gap:2px}
 #livecamsection .lc-controls .lc-status{grid-column:1/-1;grid-row:3}
 #livecamsection .lc-meter{width:100%;max-width:88px;height:10px}
 #livecamsection .lc-commentbar [data-lc=resume]{padding:6px;font-size:.72rem}
}
@media(max-width:650px){
 #livecamsection .lc-commentbar h3{flex:1 1 calc(100% - 100px)}
 #livecamsection .lc-commentbar label{flex:1 1 auto;font-size:.7rem}
}