/* rolka Studio — aplikacja do tworzenia i zarządzania krótkim wideo. */
:root {
  --bg:#f5f6f8;--surface:#fff;--side:#191b20;--sunk:#f1f3f5;
  --ink:#202229;--ink-2:#414650;--muted:#747b87;--faint:#89909b;
  --line:#e9ecf0;--line-2:#dce0e6;--accent:#f05231;--accent-ink:#fff;--accent-soft:#fff0eb;
  --ok:#20815f;--ok-soft:#e9f6ef;--warn:#a76c17;--warn-soft:#fff5e5;
  --stage:#191b20;--stage-ink:#f6f7f9;--stage-muted:#979ca8;--stage-line:#35383f;
  --f-serif:"Geist","Helvetica Neue",system-ui,sans-serif;
  --shadow-1:0 2px 5px #18233703,0 0 0 1px var(--line);
  --shadow-2:0 12px 32px -16px #202a4330;
  color-scheme:light;
}
body{font-size:13px;letter-spacing:-.012em;background:var(--bg)}
.app{grid-template-columns:236px minmax(0,1fr)}
.side{background:var(--side);padding:28px 18px 20px;border:0;gap:20px;color:#a4a9b4;z-index:11}
.logo{color:#fff;text-decoration:none;gap:9px;padding:0 7px;font-family:var(--f-sans);font-size:29px;font-weight:650;letter-spacing:-1.8px;line-height:1}
.logo-dot{color:#ff7653}.studio-mark{width:31px;height:35px;color:#fff;background:var(--accent);display:grid;place-items:center;border-radius:9px;box-shadow:0 4px 15px #f0523133}
.studio-mark svg{width:24px;height:24px}.logo .badge{letter-spacing:1.2px;font-size:8px;font-weight:500;color:#9da2af;border:1px solid #42454d;padding:5px 6px;margin-left:auto}
.client{margin-top:14px;padding:12px 11px;background:#25282f;border:1px solid #373a42;box-shadow:none;color:#f1f2f5;border-radius:11px}
.client .av{width:33px;height:33px;border-radius:9px}.client b{font-size:12px}.client small{font-size:10px;color:#a4a9b4}.client svg{width:14px;color:#989eab}
.newbtn{background:var(--accent);color:white;border-radius:10px;padding:12px;font-size:12px;box-shadow:0 5px 16px #f0523115}
.studio-nav-label,.navlbl{font:500 9px var(--f-sans);text-transform:uppercase;letter-spacing:1.4px;color:#7e8593;padding:0 10px}
.studio-nav-label{margin:9px 0 -12px}.nav{gap:5px}.navlbl{margin:23px 0 8px}
.nav a{color:#aab0bc;font-size:12px;font-weight:450;gap:11px;padding:11px 12px;border-radius:9px;position:relative;transition:background .15s,color .15s}
.nav a svg{width:17px;height:17px;color:#828a99}.nav a:hover{background:#ffffff08;color:#fff}
.nav a.on{background:#2b2e36;color:#fff;box-shadow:none}.nav a.on svg{color:#ff815e}
.nav a.on::before{content:"";position:absolute;left:-18px;top:12px;bottom:12px;background:#ff6c47;width:3px;border-radius:0 3px 3px 0}
.nav .cnt{color:#8f96a4;font-size:10px;background:#ffffff08;padding:1px 6px;border-radius:4px}.nav a.on .cnt{color:#d9dde5}.nav .live{background:#ff815e}
.side>.grow{min-height:20px}.usage{border:1px solid #373a43;box-shadow:none;background:#22252c;border-radius:11px;padding:14px;gap:10px}
.usage .row{color:#a4aab7;font-size:11px}.usage .row b{color:#f3f4f7;font-size:11px}.usage small{color:#9199a9;font-size:10px;line-height:1.7}
.usage a{color:#ff9c7d;font-size:11px}.dots{gap:4px}.dots i{height:4px;background:#ff7653}.dots i.left{background:#3f444e;box-shadow:none}
.me{border-top:1px solid #30333a;padding:18px 6px 0;font-size:12px;color:#eef0f5;gap:10px}.me .av{background:#353943;color:#dedfe5;box-shadow:none;width:31px;height:31px;font-size:10px}.me small{color:#8c93a2;font-size:10px}
.main{background:var(--bg)}.top{height:72px;padding:0 36px;background:#ffffffec;border-bottom:1px solid #e7eaf0;backdrop-filter:blur(18px);z-index:10;flex-shrink:0}
.crumbs{font-size:11px;gap:10px}.crumbs>span:first-child{color:#838a96}.crumbs>span[aria-hidden]{color:#c4c8d0}.crumbs b{font-weight:500;color:#404550}
.search{border:1px solid #e6e9ee;background:#f8f9fb;box-shadow:none;width:258px;height:36px;border-radius:8px;padding:0 9px;gap:7px;color:#969ca8;position:relative}
.search input{border:0;box-shadow:none;outline:none;background:transparent;min-width:0;flex:1;width:100px;padding:0;font:11px var(--f-sans);color:var(--ink)}
.search input::placeholder{color:#9299a6}.search kbd{border:1px solid #e1e5eb;border-radius:4px;font:9px var(--f-mono);padding:2px 4px;color:#a0a6b1;white-space:nowrap;margin:0}
.search .voice-control{margin:0;gap:0;flex:0}.search .voice-button{padding:4px!important;border:0!important;background:transparent!important;border-radius:4px!important}.search .voice-button span{display:none}.search .voice-button svg{width:12px;height:14px}
.search .voice-status:not(:empty){position:absolute;top:42px;right:0;width:240px;padding:10px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-2);border-radius:8px;z-index:20}
.studio-export-tag{margin-left:4px;display:flex;align-items:center;gap:7px;font-size:10px;color:#737b89;white-space:nowrap}.studio-export-tag>span{height:6px;width:6px;border-radius:50%;background:#536173}
.view{max-width:1600px;margin-inline:auto;padding:35px 36px 70px}.vhead{align-items:center;margin-bottom:28px;gap:20px}.vhead>div:first-child{min-width:0}
h1{font:600 clamp(28px,2.8vw,42px)/1.15 var(--f-sans);letter-spacing:-1.7px;color:#24262c}h1 em{font-style:normal;color:#858d9a}#t-nowa{font-size:clamp(29px,2.8vw,41px);letter-spacing:-1.9px}#t-nowa>span{color:#7c8491}
#t-rolka{font-size:30px;max-width:760px;line-height:1.25;letter-spacing:-1.1px}
.vhead p{font-size:12px;line-height:1.7;margin-top:10px;color:#828996;max-width:650px}
.studio-eyebrow{color:#f05b39;font-size:9px;font-weight:600;letter-spacing:1.8px;margin-bottom:10px}.studio-title-dot{color:var(--accent)}
.studio-draft{display:flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid var(--line);border-radius:7px;font-size:10px;color:#838b97;background:#fff;white-space:nowrap}.studio-draft i{width:5px;height:5px;background:#89939e;border-radius:50%}
.studio-draft.saved i{background:#2a9e70}.studio-draft.saved{color:#687a73}
.btn{border-radius:8px;font-size:11px;font-weight:550;padding:10px 14px;min-height:36px;box-shadow:inset 0 0 0 1px var(--line-2);transition:background .15s,box-shadow .15s,transform .15s}
.btn-dark,.btn-accent{box-shadow:none}.btn-dark{background:#25282e;color:#fff}.btn-accent{background:var(--accent);color:#fff}.btn:hover{box-shadow:inset 0 0 0 1px #b8c0cb;background:#f9fafc}.btn-dark:hover{background:#353a44;color:#fff;box-shadow:0 4px 12px #20233715}.btn-accent:hover{background:#df4728;color:#fff;box-shadow:0 5px 15px #f0523120}
.studio-steps{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border-bottom:1px solid #dfe4eb;margin:5px 0 28px;gap:12px}
.studio-steps button{padding:0 0 15px;background:none;border:0;text-align:left;display:flex;align-items:center;gap:8px;color:#818997;font-size:10px;cursor:pointer;position:relative;white-space:nowrap}
.studio-steps button>span{border:1px solid #dce1e8;border-radius:6px;display:grid;place-items:center;width:23px;height:23px;font:9px var(--f-mono);background:#fff;flex-shrink:0}
.studio-steps button>svg{margin-left:auto;width:13px;height:13px;color:#b8bdc7}.studio-steps button.on{color:#272b33;font-weight:600}.studio-steps button.on::after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--accent)}
.studio-steps button.on>span{background:var(--accent);border-color:var(--accent);color:white}.studio-steps button.done:not(.on)>span{background:#e7f5ed;border-color:#d7ecdf;color:#248059}
.editor{grid-template-columns:minmax(0,1fr) 348px;gap:24px}.panel{gap:18px}
.blk{box-shadow:0 0 0 1px #e6e9ee,0 2px 5px #202a4303;border-radius:14px;scroll-margin-top:94px;overflow:clip}
.blk>summary{padding:19px 22px;gap:11px}.blk>summary .n{width:28px;height:28px;border-radius:8px;font-size:10px;background:#f2f4f7;color:#929aa7}.blk>summary .n.done{background:#fff0eb;color:#dc5536}
.blk>summary b{font-size:13px;font-weight:600;letter-spacing:-.2px}.blk>summary .val{font-size:10px;color:#9199a5;max-width:48%}.blk>summary .chev{width:12px;height:12px}
.blk[open]>summary{border-bottom:1px solid #f0f2f5}.blk .in{padding:20px 22px 22px;gap:19px}
.field>.l{font-size:11px;font-weight:600;gap:7px}.field>.l span{font-size:10px;color:#939ba7}.field{gap:9px}
textarea,input[type=text],input[type=email],input[type=password],select{font:12px/1.65 var(--f-sans);padding:11px 12px;background:#fafbfd;color:#373d48;border:1px solid #e0e5ec;box-shadow:none;border-radius:8px;transition:border-color .15s,box-shadow .15s}
input[type=text]::placeholder,textarea::placeholder{color:#a1a8b4}textarea{min-height:108px}textarea:focus,input[type=text]:focus,select:focus{outline:none;border-color:#ef896f;box-shadow:0 0 0 3px #f052310b}
#opis{min-height:111px}.hint{color:#8c94a1;font-size:10px;line-height:1.7}.two{gap:16px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.limit{gap:7px}.limit .row{font-size:10px;color:#929aa6}.limit .row b{font-size:10px;color:#6f7887}.lbar{height:3px;background:#f0f2f6}.lbar i{background:#f47856}
#drop{min-height:155px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;background:#fbfcfe;border:1.5px dashed #d8dfe9;border-radius:11px;padding:20px 14px;color:#939caa;font-size:10px}
#drop:hover,#drop.over{border-color:var(--accent);background:#fff8f5}#drop .ic{width:43px;height:43px;border-radius:12px;background:#fff1eb;color:var(--accent);box-shadow:none}#drop .ic svg{width:22px;height:22px}
#drop b{font-size:13px;color:#3b414d;font-weight:550;margin-bottom:4px}.studio-file-tags{display:flex;justify-content:center;gap:6px;margin-top:11px}.studio-file-tags>span{display:inline-block;font:8px var(--f-mono);color:#929aa7;background:#f0f3f7;border-radius:4px;padding:4px 6px}
.clips:empty{display:none}.clip{box-shadow:0 0 0 1px var(--line);background:#fbfcfe;border-radius:9px}.clip .tx{font-size:11px}.clip .tx small{font-size:10px}
.clean-fold{border:1px solid #e9edf3;border-radius:9px;background:#fff;overflow:hidden}.clean-fold>summary{display:flex;list-style:none;align-items:center;gap:10px;padding:12px 14px;cursor:pointer}.clean-fold>summary::-webkit-details-marker{display:none}.clean-fold>summary>svg{width:14px;height:14px;margin-left:auto;color:#a2a9b6;flex-shrink:0}.clean-fold[open]>summary>svg{transform:rotate(180deg)}
.clean-fold-icon{display:grid;place-items:center;background:#fff4ee;border-radius:7px;color:#ed754f;width:28px;height:28px;font-size:16px}.clean-fold>summary b{font-size:11px;font-weight:550;display:block;color:#525a67}.clean-fold>summary small{font-size:9px;color:#989fac;display:block;margin-top:2px}
.clean{border-radius:0;box-shadow:none}.clean .item{padding:13px 14px;background:#fafbfd;border-top:1px solid #eceff4}.clean .item b{font-size:11px}.clean .item span{font-size:10px;line-height:1.7}.clean .item select{margin-top:8px}.clean .item .seg .face{font-size:9px;padding:5px 9px}
.tg{width:34px;height:20px}.tg i::after{width:14px;height:14px}.tg input:checked+i{background:var(--accent)}.tg input:checked+i::after{transform:translateX(14px)}
.seg{gap:6px}.seg .face{font-size:10px;padding:7px 11px;border-radius:7px;background:#fafbfd;box-shadow:0 0 0 1px #e4e8ee}.seg .opt input:checked+.face{background:#fff1eb;color:#d75634;box-shadow:inset 0 0 0 1px #f7c6b7;font-weight:600}
.opt input:checked+.face{box-shadow:0 0 0 1.5px var(--accent);background:#fff}.opt:hover .face{box-shadow:0 0 0 1px #b6bdca}
.presets .face{border-radius:10px}.presets .tb{border-radius:6px}.presets b{font-size:11px}.presets small{font-size:9px;line-height:1.6}.howbox{box-shadow:none;border:1px solid var(--line);border-radius:9px;font-size:10px}.howbox div{background:#fafbfd;padding:12px}.howbox b{font-size:8px;color:#9aa2ad}
.ftabs{border-radius:7px;background:#f0f2f6}.ftabs button{font-size:10px;padding:6px 9px}.fonts .nm,.looks .nm{font-size:10px}.fonts .nm small{font-size:9px}.fonts .sample{height:74px}.looks .face{border-radius:8px}.looks .sample{height:60px}
.sw{gap:8px}.sw .opt .face{width:25px;height:25px}.sw .opt input:checked+.face{box-shadow:0 0 0 2px #4e5664,inset 0 0 0 3px white}.switch b{font-size:11px}.switch span{font-size:10px}.gstyle .nm{font-size:10px}.sub-h{font-size:9px;letter-spacing:1px}input[type=range]{accent-color:var(--accent)}.ticks{font-size:9px}
#ed .voice-control{margin:0}.voice-control .voice-button{font-size:10px;padding:6px 9px;border:1px solid #e3e7ed;border-radius:6px;background:#fff;color:#737c8b;gap:5px}.voice-control .voice-button svg{width:12px;height:14px}.voice-status{font-size:10px!important;color:#8a93a1!important}
.stage{position:sticky;top:94px;border:1px solid #e4e8ee;border-radius:15px;background:#fff;color:var(--ink);padding:17px;gap:13px;box-shadow:0 6px 18px -12px #15234124}
.studio-stage-title{display:flex;align-items:center;gap:9px}.studio-preview-icon{width:31px;height:34px;border-radius:8px;background:#fff1eb;color:var(--accent);display:grid;place-items:center}.studio-preview-icon svg{width:21px;height:21px}.studio-stage-title strong{font-size:12px;font-weight:600;display:block}.studio-stage-title small{font-size:9px;color:#929ba8;display:block;margin-top:2px}.studio-ratio{margin-left:auto;color:#969eaa;font:9px var(--f-mono);border:1px solid #e5e8ef;border-radius:4px;padding:3px 5px}
.studio-monitor{padding:13px 16px 16px;background:#1c1e24;border-radius:10px;position:relative;overflow:hidden;background-image:linear-gradient(#ffffff03 1px,transparent 1px),linear-gradient(90deg,#ffffff03 1px,transparent 1px);background-size:22px 22px}
.stage-h{font-size:7px;letter-spacing:1px;color:#8f97a5;margin-bottom:15px}.stage-h .rec{color:#9fa7b4;gap:5px}.stage-h .rec i{width:4px;height:4px;animation:none;background:#f47552}.stage #tc{letter-spacing:0;font-size:8px;color:#8c94a2}
.stage .phone{width:218px;max-width:100%;padding:3px;border:1px solid #535863;background:#090a0c;border-radius:11px;box-shadow:0 10px 24px #0005}.stage .phone .screen{border-radius:8px}.stage .island,.detail .island,.mont .island{display:none}
.studio-timeline{display:grid;gap:5px;margin-top:15px}.cuts{height:15px;gap:3px}.cuts span{border-radius:2px;background:#3e424d}.cuts span.g::after{background:#f07856;height:2px}.bar{height:2px;background:#353b46}.bar i{background:#f07856}
.specs{gap:4px;justify-content:space-between}.specs span{font-size:7px;padding:3px 5px;color:#8a93a0;border:1px solid #edf0f4;border-radius:4px}.specs b{color:#606a79;font-weight:500}
.studio-preview-hint{margin:0;color:#929aa7;font-size:9px;line-height:1.6;text-align:center;padding:0 5px}
.go{padding-top:14px;border-color:#eceff4;gap:9px}.go .row{font-size:9px;color:#9099a6}.go .row b{font-size:9px;color:#687281;font-weight:500;max-width:62%;text-align:right}.go .btn-accent{font-size:12px;padding:13px;min-height:44px;border-radius:8px;justify-content:space-between;padding-inline:18px;margin-top:2px}
.studio-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:0 0 34px}.studio-stat{border:1px solid var(--line);border-radius:12px;background:#fff;padding:19px;display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none;position:relative;transition:border-color .15s}.studio-stat:hover{border-color:#c9d1dc}.stat-icon{height:40px;width:40px;display:grid;place-items:center;background:#f0f3fa;color:#657896;border-radius:10px;flex-shrink:0}.stat-icon svg{width:21px;height:21px}.stat-icon.green{color:#399270;background:#e9f7ef}.stat-icon.orange{color:#eb8d49;background:#fff2e7}.studio-stat div>span{font-size:10px;color:#8b94a1;display:block}.studio-stat strong{font-size:26px;font-weight:600;line-height:1.4;letter-spacing:-.7px}.stat-note{font-size:8px;color:#a3aab5;margin-left:auto;align-self:flex-end;padding-bottom:6px;max-width:85px;text-align:right}
.studio-list-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}.studio-list-head h2{margin:0;font-size:15px;font-weight:600;letter-spacing:-.4px}.studio-list-head>span{font-size:10px;color:#959daa}
.tabs{padding:0;gap:23px;background:transparent;border-radius:0;border-bottom:1px solid var(--line);width:100%;overflow:visible;margin-bottom:23px}.tabs button{padding:0 0 12px;border-radius:0;font-size:11px;color:#9098a5;position:relative;white-space:nowrap}.tabs button.on{box-shadow:none;background:none;color:#343a44;font-weight:600}.tabs button.on::after{content:"";height:2px;background:var(--accent);bottom:-1px;position:absolute;left:0;right:0}.tabs button span{font:9px var(--f-sans);color:#9aa3af;background:#edf0f5;padding:2px 5px;border-radius:4px;margin-left:6px}.tabs button.on span{background:#fff0e8;color:#e87a53}
.grid{grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:20px}.rc{box-shadow:none;border:1px solid #e5e9ef;border-radius:12px;transition:transform .2s,border-color .2s,box-shadow .2s}.rc:hover{border-color:#cbd2dd;box-shadow:0 9px 20px -10px #27334935;transform:translateY(-3px)}
.rc .screen{aspect-ratio:4/4.8;position:relative}.rc .screen::after{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-40%);font-size:16px;padding:16px 19px;border:1px solid #ffffff50;border-radius:50%;color:#fff;background:#ffffff1a;backdrop-filter:blur(8px);opacity:0;transition:opacity .2s,transform .2s}.rc:hover .screen::after{opacity:1;transform:translate(-50%,-50%)}
.rc .dur{right:10px;bottom:10px;border-radius:5px;font-size:9px;padding:3px 6px}.studio-version{position:absolute;top:11px;right:11px;border:1px solid #ffffff35;background:#10121655;color:white;backdrop-filter:blur(8px);font:8px var(--f-mono);padding:3px 5px;border-radius:4px}
.rc .body{padding:14px 13px;gap:11px}.rc .t{font-size:11px;font-weight:550;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:29px;line-height:1.5}.rc .meta{font-size:9px;gap:5px}.pill{font-size:9px;padding:3px 7px}.pill::before{height:4px;width:4px}
.newcard{border:1px dashed #d9dfe8;border-radius:12px;min-height:310px;background:#fafbfd;color:#9aa2af;font-size:10px;padding:20px;gap:13px}.newcard:hover{border-color:#ee9678;background:#fff9f5}.newcard .pl{box-shadow:none;background:#fff0e8;color:#ed6842;border:1px solid #f9ddcf;width:49px;height:49px;border-radius:13px}.newcard b{font:550 14px var(--f-sans);letter-spacing:-.3px}.studio-empty{grid-column:2/-1;display:grid;place-content:center;color:#929ba9;text-align:center;gap:12px;padding:30px}.studio-empty p{margin:0;font-size:12px}
.detail{grid-template-columns:322px minmax(0,1fr);gap:24px}.player{background:#20232b;padding:14px;border-radius:14px;border:1px solid #2c3039}.player .phone{border-radius:9px;box-shadow:none;padding:0;background:#000}.player .screen{border-radius:7px}.detail>.player{position:sticky;top:94px}.box{border-radius:13px;border:1px solid var(--line);box-shadow:none;padding:23px;gap:17px}.box h3{font-size:13px}.box .sub{font-size:11px;line-height:1.7;color:#8a93a1}.ai{gap:9px}.ai div{border:1px solid #edf0f4;border-radius:8px;background:#fafbfd;padding:12px}.ai b{font:550 25px var(--f-sans);letter-spacing:-1px}.ai span{font-size:9px;line-height:1.5;display:block;margin-top:5px}
.ce-free{font-size:9px;padding:4px 8px}.ce-grid{gap:18px}.ce-grid label,.ce-seek{font-size:11px}.ce-grid output,.ce-seek output{font-size:10px}.ce-checks label{font-size:10px}.ce-text summary{font-size:11px}.ce-heading .btn{font-size:10px}.ce-editor{scroll-margin-top:90px}
.bigpct b{font:600 74px/1 var(--f-sans);letter-spacing:-4px}.bigpct span{font-size:12px;color:#9099a7}.pbar{height:5px;background:#e6eaf0}.pbar i{background:var(--accent)}.stages{box-shadow:none;border:1px solid var(--line);border-radius:13px}.stages li{padding:19px 21px;gap:13px}.stages li b{font-size:12px}.stages li small{font-size:10px;margin-top:3px}.stages li.on{background:#fff8f4}.stages li.done .d{background:#dff1e7;color:#348564}.stages li .t{font-size:9px}.donebox{border-radius:12px;background:#252c35}.donebox b{font:550 22px var(--f-sans)}
.versions{gap:6px}.versions button{font-size:10px;padding:6px 9px;border-radius:6px}.versions button.on{background:#303641;color:#fff}.tline .lane{height:21px}.tline .lane span{border-radius:3px}.tline .lane span.k{background:#6b778b}.legend{font-size:9px}.quick button{font-size:10px;border-radius:6px;padding:6px 8px}.msg{font-size:11px;line-height:1.8;border-radius:10px}.msg small{font-size:9px}.msg.me{background:#333b48;color:white;border:0}.ask input{font-size:11px}.ask .btn{font-size:11px}.chat{gap:17px}
.atable{border:1px solid var(--line);box-shadow:none;border-radius:12px}.atable th{font-size:9px;letter-spacing:.7px;text-transform:uppercase;background:#fafbfd;color:#929ba7}.atable td{font-size:11px}.plan{border:1px solid var(--line);box-shadow:none;border-radius:13px}.plan.pop{border-color:#ef896c}.plan .pr{font-family:var(--f-sans)}.brandrow{border:1px solid var(--line);box-shadow:none;border-radius:9px;background:#fafbfd}.brandrow b{font-size:12px}.brandrow small,.brandrow a{font-size:10px}.toast{font-size:12px;background:#303845;color:#fff;border:1px solid #ffffff18;box-shadow:0 8px 30px #12203725;border-radius:9px}
@media(min-width:1700px){.view{padding:42px 42px 80px}.editor{grid-template-columns:minmax(0,1fr) 378px;gap:30px}.stage .phone{width:235px}.grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}}
@media(min-width:1041px) and (max-width:1180px){.editor{grid-template-columns:minmax(0,1fr) 310px}.stage{position:sticky!important;top:94px}.stage .phone{width:194px}.studio-stage-title small{font-size:8px}.studio-steps{gap:5px}.studio-steps button{font-size:9px;gap:5px}.studio-steps button svg{display:none}.stat-note{display:none}}
@media(max-width:1040px){.editor{grid-template-columns:minmax(0,1fr)}.stage{position:static!important;max-width:480px;width:100%;justify-self:center}.stage .phone{width:230px}.studio-stat{padding:15px;gap:10px}.stat-note{display:none}.detail{grid-template-columns:minmax(0,1fr)}.detail>.player{position:static;max-width:320px;margin:auto;width:100%}.studio-export-tag{display:none}.studio-steps{overflow-x:auto;grid-template-columns:repeat(6,minmax(115px,1fr));gap:12px}.studio-steps button svg{display:none}}
@media(max-width:900px){.app{grid-template-columns:minmax(0,1fr)}.side{padding-top:26px}.top{height:62px;padding-inline:20px}.menu-btn{display:grid;background:#fff;border:1px solid #e1e6ee;border-radius:7px;width:31px;height:31px}.search{display:none}.view{padding:28px 24px 60px}.vhead{margin-bottom:24px}h1{font-size:34px}#t-nowa{font-size:33px}.studio-stat strong{font-size:24px}.studio-stats{gap:12px}.studio-steps{margin-bottom:22px}}
@media(max-width:560px){.view{padding:24px 16px 50px}.top{padding-inline:16px}.vhead{gap:15px}.vhead p{font-size:11px}.studio-eyebrow{font-size:8px;letter-spacing:1.5px}h1,#t-nowa{font-size:29px;letter-spacing:-1px}#t-rolka{font-size:25px}.studio-draft{font-size:9px;padding:6px 8px}.studio-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:26px}.studio-stat{padding:12px;display:grid;gap:8px}.stat-icon{width:29px;height:29px;border-radius:7px}.stat-icon svg{width:17px;height:17px}.studio-stat div>span{font-size:8px}.studio-stat strong{font-size:23px}.studio-list-head h2{font-size:13px}.studio-list-head>span{display:none}.tabs{gap:18px;overflow-x:auto}.tabs button{font-size:10px}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.newcard{min-height:260px;padding:14px;font-size:9px}.newcard b{font-size:12px}.rc .body{padding:10px;gap:8px}.rc .t{font-size:10px}.rc .meta{font-size:8px;flex-wrap:wrap}.pill{font-size:8px}.blk>summary{padding:16px}.blk .in{padding:17px 16px}.blk>summary b{font-size:12px}.blk>summary .val{max-width:38%;font-size:9px}.clean-fold>summary small{font-size:8px}.studio-file-tags{flex-wrap:wrap}#drop{min-height:160px}.box{padding:18px}.two{grid-template-columns:minmax(0,1fr)}.field>.l{font-size:11px;flex-wrap:wrap}.field>.l span{font-size:9px}.voice-control .voice-button{font-size:11px;padding:7px 9px}textarea,input[type=text],select{font-size:14px}.stage{max-width:100%}.stage .phone{width:218px}.studio-steps{grid-template-columns:repeat(6,110px)}.stage-h{font-size:8px}.studio-stage-title strong{font-size:13px}.studio-stage-title small{font-size:10px}.specs span{font-size:8px}.go .btn-accent{font-size:13px}.bigpct b{font-size:64px}.ce-grid{gap:16px}.ce-grid label,.ce-seek{font-size:12px}.ce-checks label{font-size:11px}.ce-actions .btn{font-size:12px}.caption-editor .hint{font-size:11px}.msg{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
/* Czytelność kontrolek przy pracy na monitorze. */
@media(min-width:901px){
 .nav a{font-size:13px}.client b{font-size:13px}.client small{font-size:11px}.crumbs{font-size:12px}
 .vhead p{font-size:13px}.btn{font-size:12px}.field>.l{font-size:12px}.field>.l span{font-size:11px}
 textarea,input[type=text],input[type=email],input[type=password],select{font-size:13px}
 .hint{font-size:11px}.blk>summary b{font-size:14px}.blk>summary .val{font-size:11px}
 .limit .row,.limit .row b{font-size:11px}.clean-fold>summary b{font-size:12px}.clean-fold>summary small{font-size:10px}
 .clean .item b{font-size:12px}.clean .item span{font-size:11px}.seg .face{font-size:11px}
 #drop{font-size:11px}#drop b{font-size:14px}.studio-file-tags>span{font-size:9px}
 .studio-steps button{font-size:11px}.studio-stat div>span{font-size:11px}.stat-note{font-size:9px}
 .rc .t{font-size:12px}.rc .meta{font-size:10px}.pill{font-size:10px}.newcard{font-size:11px}.newcard b{font-size:15px}
 .studio-list-head h2{font-size:16px}.tabs button{font-size:12px}.studio-stage-title strong{font-size:13px}
 .studio-stage-title small{font-size:10px}.specs span{font-size:8px}.studio-preview-hint{font-size:10px}
 .go .row,.go .row b{font-size:10px}.voice-control .voice-button{font-size:11px}.voice-status{font-size:11px!important}
 .box h3{font-size:14px}.box .sub{font-size:12px}.ce-grid label,.ce-seek{font-size:12px}.ce-checks label{font-size:11px}
 .msg{font-size:12px}.ask input{font-size:12px}
}
.grid{grid-template-columns:repeat(auto-fill,minmax(238px,1fr))}.studio-version{z-index:1}
#preflightResult{font-size:12px;line-height:1.7}.studio-empty .btn{justify-self:center}
@media(max-width:560px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tabs{overflow-x:auto}}
.ce-grid input[type=range],.ce-seek input{accent-color:var(--accent)}
.studio-color-input{display:flex;align-items:center;gap:10px;border:1px solid #e0e5ec;background:#fafbfd;padding:7px 10px;border-radius:8px;min-height:42px}
.ce-grid .studio-color-input input[type=color]{width:29px;height:26px;padding:0;background:none;border:0;box-shadow:none;border-radius:5px;flex-shrink:0;cursor:pointer;appearance:none;-webkit-appearance:none}
.studio-color-input input[type=color]::-webkit-color-swatch-wrapper{padding:0}.studio-color-input input[type=color]::-webkit-color-swatch{border:1px solid #0000000a;border-radius:5px}.studio-color-input input[type=color]::-moz-color-swatch{border:1px solid #0000000a;border-radius:5px}
.studio-color-input code{font:10px var(--f-mono);color:#7c8797;letter-spacing:.3px;pointer-events:none}
.studio-color-input:focus-within{border-color:#ef896f;box-shadow:0 0 0 3px #f052310b}

.client .av{display:grid;place-items:center;font-size:13px;font-weight:650}

/* Aktualnie odtwarzana wersja i skróty do faktycznie wyrenderowanych przejść. */
.reel-update{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;margin-bottom:22px;border:1px solid var(--accent);background:var(--accent-soft);border-radius:12px;font-size:13px}
.reel-update .btn{flex-shrink:0}.player-version{margin:0 0 12px;color:#fff;font-size:12px;font-weight:600}
.transition-review{margin-top:14px;color:#d4d8e1;font-size:12px}.transition-review p{margin:0 0 10px}.transition-review>div{display:grid;gap:8px}.transition-review .btn{justify-content:center;background:#303642;border:1px solid #505969;color:#fff;box-shadow:none;font-size:12px}
.transition-review .btn:hover{background:#424c5b}
@media(max-width:560px){.reel-update{align-items:stretch;flex-direction:column;padding:14px}.reel-update .btn{white-space:normal}}