@import url(vendor/fonts.css?v=6);
/* Aurora tokens — see D:\AI\Projects\UI-STYLE-GUIDE.md */
:root{
  --bg:#EEF1F5; --panel:#FFFFFF; --panel-2:#F5F7FA;
  --text:#15181D; --text-soft:#3A3F49; --muted:#8B93A1;
  --line:rgba(20,26,36,.10); --dark:#15171C;
  --shadow-sm:0 1px 2px rgba(16,24,40,.04), 0 1px 1px rgba(16,24,40,.03);
  --shadow-md:0 6px 20px rgba(16,24,40,.07), 0 1px 2px rgba(16,24,40,.04);
  --shadow-lg:0 16px 40px rgba(16,24,40,.10), 0 2px 6px rgba(16,24,40,.05);
  --shadow-air:0 36px 64px -28px rgba(24,32,52,.16), 0 8px 20px -6px rgba(24,32,52,.06);
  --accent:#2FE3D6; --accent-ink:#0B8F86; --accent-soft:rgba(47,227,214,.14);
  --r-xl:28px; --r-l:20px; --r-m:14px; --r-s:8px; --r-pill:999px;
  --space-xs:6px; --space-sm:12px; --space-md:18px; --space-lg:20px;
  --ease:cubic-bezier(.16,1,.3,1);
  --dur-fast:140ms; --dur:220ms; --dur-slow:380ms;
}
*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;}
body{background:var(--bg);color:var(--text);font-family:'Inter',-apple-system,'Segoe UI',Arial,sans-serif;font-size:12.5px;font-weight:400;-webkit-font-smoothing:antialiased;overflow:hidden;}
button,input,select{font-family:inherit;font-size:inherit;color:inherit;}
button{cursor:pointer;border:none;background:none;}

.app{display:grid;grid-template-columns:minmax(0,1fr) 400px;height:100vh;}

/* ---------- stage ---------- */
.stage{position:relative;display:flex;flex-direction:column;min-width:0;min-height:0;}
.stage-view{
  flex:1;min-height:0;position:relative;display:flex;align-items:center;justify-content:center;padding:28px;
  background-image:radial-gradient(rgba(20,26,36,.05) 1px, transparent 1.4px);background-size:18px 18px;
}
.frame{position:relative;box-shadow:var(--shadow-lg);background:#000;line-height:0;}
.frame canvas{display:block;}
.pill{position:absolute;top:16px;left:16px;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);border-radius:var(--r-pill);padding:8px 16px;box-shadow:var(--shadow-md);font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;}
.empty-hint{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);pointer-events:none;}

.transport{
  margin:0 20px 20px;background:var(--panel);border-radius:var(--r-l);box-shadow:var(--shadow-air);
  padding:14px 18px;display:flex;flex-direction:column;gap:var(--space-sm);
}
.tr-row{display:flex;align-items:center;gap:var(--space-sm);}
.play{width:38px;height:38px;border-radius:50%;background:var(--dark);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);flex:none;}
.play:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);}
.play:active{transform:scale(.96);}
.time{font-variant-numeric:tabular-nums;color:var(--text-soft);min-width:118px;font-weight:500;}
.time span{color:var(--muted);font-weight:400;}
.scrub{position:relative;flex:1;height:56px;}
.scrub .segs{position:absolute;left:0;right:0;top:17px;height:14px;transform:translateY(-50%);border-radius:7px;background:var(--panel-2);overflow:hidden;}
.scrub .segs i{position:absolute;top:0;bottom:0;}
.scrub .segs i.hold{background:#E4E8EE;}
.scrub .segs i.trans{background:#C9D0DB;}
.scrub .segs i.mark{width:1px;background:rgba(20,26,36,.25);}
.scrub input{position:absolute;left:0;top:0;width:100%;height:34px;margin:0;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;}
.scrub input::-webkit-slider-runnable-track{height:34px;background:transparent;}
.scrub input::-webkit-slider-thumb{-webkit-appearance:none;width:3px;height:30px;margin-top:2px;border-radius:2px;background:var(--dark);box-shadow:0 0 0 2px #fff, 0 2px 6px rgba(16,24,40,.2);}
.slide-chips{display:flex;gap:6px;flex-wrap:wrap;}
.legend{display:flex;gap:14px;color:var(--muted);font-size:11.5px;align-items:center;}
.legend b{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px;}

/* ---------- sidebar ---------- */
.side{overflow-y:auto;padding:20px 20px 40px 4px;display:flex;flex-direction:column;gap:var(--space-lg);scrollbar-width:thin;}
.side-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 4px 0 18px;margin-bottom:-4px;}
.side-head h1{font-size:16px;font-weight:500;letter-spacing:-.2px;}
.side-head .acts{display:flex;gap:6px;}
.sc{background:var(--panel);border-radius:var(--r-l);padding:22px;box-shadow:var(--shadow-air);display:flex;flex-direction:column;gap:var(--space-md);transition:gap var(--dur-slow) var(--ease);opacity:0;transform:translateY(8px);animation:card-in .5s var(--ease) forwards;}
.sc.collapsed{gap:0;}
.st{font-size:16px;font-weight:500;display:flex;justify-content:space-between;align-items:center;cursor:pointer;color:var(--text);letter-spacing:-.2px;user-select:none;}
.st small{font-size:11.5px;color:var(--muted);font-weight:400;letter-spacing:0;margin-left:8px;}
.caret{color:var(--text-soft);display:flex;align-items:center;transition:transform var(--dur) var(--ease);}
.sc.collapsed .caret{transform:rotate(-90deg);}
.sc-body{display:grid;grid-template-rows:minmax(0,1fr);overflow:hidden;min-height:0;padding:8px;margin:-8px;transition:grid-template-rows var(--dur-slow) var(--ease);}
.sc.collapsed .sc-body{grid-template-rows:minmax(0,0fr);padding:0;margin:0;}
.sc-body-inner{overflow:hidden;min-height:0;padding:8px;margin:-8px;display:flex;flex-direction:column;gap:var(--space-sm);}
.sc.collapsed .sc-body-inner{padding:0;margin:0;}
@keyframes card-in{to{opacity:1;transform:translateY(0);}}
.sub{font-size:11.5px;color:var(--muted);margin-top:6px;}

/* rows */
.row{display:grid;grid-template-columns:92px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:26px;}
.row.two{grid-template-columns:92px minmax(0,1fr);}
.lbl{color:var(--text-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.row.hidden{display:none;}
.val-input{width:54px;text-align:right;background:var(--panel-2);border:none;border-radius:var(--r-s);padding:5px 7px;font-variant-numeric:tabular-nums;outline:none;transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);-moz-appearance:textfield;}
.val-input::-webkit-outer-spin-button,.val-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.val-input:hover{background:#ECEEF2;}
.val-input:focus{background:#fff;box-shadow:0 0 0 2px var(--dark);}
.txt-input{width:100%;background:var(--panel-2);border:none;border-radius:var(--r-s);padding:7px 9px;outline:none;transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.txt-input:hover{background:#ECEEF2;}
.txt-input:focus{background:#fff;box-shadow:0 0 0 2px var(--dark);}
select.sel{width:100%;background:var(--panel-2);border:none;border-radius:var(--r-s);padding:7px 9px;outline:none;cursor:pointer;-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M4 5.5L7 8.5L10 5.5' stroke='%233A3F49' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 8px center;padding-right:28px;transition:background-color var(--dur) var(--ease);}
select.sel:hover{background-color:#ECEEF2;}

/* slider */
.rng{-webkit-appearance:none;appearance:none;width:100%;height:20px;background:transparent;margin:0;cursor:pointer;}
.rng::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(to right,var(--dark) var(--p,0%),var(--panel-2) var(--p,0%));}
.rng:hover::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--dark) var(--p,0%),#ECEEF2 var(--p,0%));}
.rng::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;margin-top:-4.5px;background:var(--dark);border-radius:50%;cursor:pointer;box-shadow:0 0 0 2px #fff, 0 2px 6px rgba(16,24,40,.16);transition:box-shadow var(--dur) var(--ease),transform var(--dur-fast) var(--ease);}
.rng:hover::-webkit-slider-thumb{box-shadow:0 0 0 2px #fff, 0 0 0 5px rgba(21,23,28,.10), 0 2px 6px rgba(16,24,40,.16);}
.rng:active::-webkit-slider-thumb{transform:scale(1.15);box-shadow:0 0 0 2px #fff, 0 2px 6px rgba(16,24,40,.16);}
.rng::-moz-range-track{height:4px;border-radius:4px;background:var(--panel-2);}
.rng::-moz-range-progress{height:4px;border-radius:4px;background:var(--dark);}
.rng::-moz-range-thumb{width:13px;height:13px;border:none;background:var(--dark);border-radius:50%;box-shadow:0 0 0 2px #fff, 0 2px 6px rgba(16,24,40,.16);}

/* switch */
.switch{position:relative;width:34px;height:20px;flex:none;justify-self:end;}
.switch input{opacity:0;width:0;height:0;position:absolute;}
.switch-track{position:absolute;inset:0;background:#B4BBC7;border-radius:20px;transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);cursor:pointer;}
.switch-track:before{content:'';position:absolute;width:14px;height:14px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform var(--dur-slow) var(--ease);box-shadow:var(--shadow-sm);}
.switch:hover .switch-track{box-shadow:0 0 0 4px rgba(21,23,28,.06);}
.switch input:checked+.switch-track{background:var(--dark);}
.switch input:checked+.switch-track:before{transform:translateX(14px);}

/* segmented */
.mt{position:relative;display:flex;gap:2px;background:var(--panel-2);padding:3px;border-radius:var(--r-s);}
.mt-thumb{position:absolute;top:3px;bottom:3px;left:3px;width:0;background:#fff;border-radius:calc(var(--r-s) - 3px);box-shadow:var(--shadow-sm);transition:left var(--dur-slow) var(--ease),width var(--dur-slow) var(--ease);}
.mt button{position:relative;z-index:1;flex:1;padding:6px 4px;border-radius:calc(var(--r-s) - 3px);color:var(--muted);font-size:11.5px;font-weight:500;transition:color var(--dur) var(--ease);white-space:nowrap;}
.mt button:hover{color:var(--text-soft);}
.mt button.on{color:var(--text);}

/* color */
.color{display:flex;align-items:center;gap:8px;}
.color input[type=color]{-webkit-appearance:none;appearance:none;width:26px;height:26px;border:none;padding:0;border-radius:var(--r-s);background:none;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(20,26,36,.12);overflow:hidden;flex:none;}
.color input[type=color]::-webkit-color-swatch-wrapper{padding:0;}
.color input[type=color]::-webkit-color-swatch{border:none;border-radius:var(--r-s);}
.color .txt-input{font-variant-numeric:tabular-nums;text-transform:uppercase;}

/* chips & buttons */
.chip{background:var(--panel-2);border-radius:var(--r-pill);padding:6px 13px;font-size:11.5px;font-weight:500;color:var(--muted);transition:background var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur-fast) var(--ease);white-space:nowrap;}
.chip:hover{background:#ECEEF2;color:var(--text-soft);}
.chip:active{transform:scale(.96);}
.chip.on{background:var(--dark);color:#fff;}
.chip.on:hover{background:#2A2D34;}
.btn-p{position:relative;overflow:hidden;background:var(--dark);color:#fff;border-radius:var(--r-m);padding:12px;font-weight:500;font-size:12.5px;width:100%;box-shadow:var(--shadow-sm);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.btn-p::before{content:'';position:absolute;inset:0;background:linear-gradient(115deg, transparent 20%, rgba(255,255,255,.14) 50%, transparent 80%);background-size:260% 100%;background-position:170% 0;transition:background-position .9s ease-in-out;pointer-events:none;}
.btn-p:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);}
.btn-p:hover::before{background-position:-70% 0;}
.btn-p:active{transform:translateY(0) scale(.98);}
.btn-p:disabled{opacity:.5;pointer-events:none;}
.btn-label{position:relative;z-index:1;}
.btn-g{background:#E6EAF0;box-shadow:var(--shadow-sm);color:var(--text);border-radius:var(--r-m);padding:12px;font-weight:500;font-size:12.5px;width:100%;transition:background var(--dur) var(--ease),transform var(--dur-fast) var(--ease);}
.btn-g:hover{background:#DCE1E9;}
.btn-g:active{transform:scale(.98);}
.btn-s{background:#E6EAF0;color:var(--text-soft);border-radius:var(--r-s);padding:7px 12px;font-weight:500;font-size:11.5px;transition:background var(--dur) var(--ease);white-space:nowrap;}
.btn-s:hover{background:#DCE1E9;}
.btn-row{display:flex;gap:var(--space-xs);}
.btn-row>*{flex:1;}

/* drop area */
.drop-area{border-radius:var(--r-m);background:var(--panel-2);padding:18px 12px;text-align:center;color:var(--muted);transition:background var(--dur) var(--ease);cursor:pointer;}
.drop-area:hover{background:#EEF0F4;}
.drop-area.drag{background:var(--accent-soft);}
.drop-area b{display:block;color:var(--text-soft);font-weight:500;font-size:12.5px;}
.drop-area span{font-size:11.5px;}

/* slides list */
.slides{display:flex;flex-direction:column;gap:var(--space-xs);}
.slide{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;background:var(--panel-2);border-radius:var(--r-m);padding:8px;transition:box-shadow var(--dur) var(--ease),background var(--dur) var(--ease);}
.slide.cur{box-shadow:0 0 0 2px var(--dark);background:#fff;}
.slide.over{box-shadow:0 0 0 2px var(--accent);}
.slide .thumb{width:44px;height:58px;border-radius:var(--r-s);background:#DDE1E8 center/cover no-repeat;cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);}
.slide .thumb em{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-style:normal;font-size:18px;}
.slide .col{display:flex;flex-direction:column;gap:6px;min-width:0;}
.slide .top{display:flex;gap:6px;align-items:center;}
.slide .top .txt-input{background:#fff;box-shadow:var(--shadow-sm);}
.ib{width:24px;height:24px;border-radius:var(--r-s);color:var(--muted);display:flex;align-items:center;justify-content:center;flex:none;transition:background var(--dur) var(--ease),color var(--dur) var(--ease);}
.ib:hover{background:#fff;color:var(--text);}
.ib.grab{cursor:grab;}
.slide .coords{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;}
.slide .coords label{display:flex;flex-direction:column;gap:2px;font-size:10.5px;color:var(--muted);}
.slide .coords .val-input{width:100%;text-align:left;background:#fff;box-shadow:var(--shadow-sm);}
.slide .coords .val-input:focus{box-shadow:0 0 0 2px var(--dark);}
.slide.nocoord .coords label.ll .val-input{box-shadow:0 0 0 1.5px #F2A33A;}

/* toast / progress */
.toast{position:fixed;bottom:28px;left:calc((100vw - 400px)/2);transform:translate(-50%,8px);background:var(--dark);color:#fff;font-size:11.5px;font-weight:500;padding:9px 16px;border-radius:var(--r-pill);box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease);z-index:50;}
.toast.show{opacity:1;transform:translate(-50%,0);}
.prog{position:fixed;inset:0;background:rgba(238,241,245,.7);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;z-index:40;}
.prog.on{display:flex;}
.prog-card{background:#fff;border-radius:var(--r-l);box-shadow:var(--shadow-lg);padding:24px;width:360px;display:flex;flex-direction:column;gap:var(--space-sm);}
.prog-card h3{font-size:16px;font-weight:500;letter-spacing:-.2px;}
.bar{height:6px;border-radius:6px;background:var(--panel-2);overflow:hidden;}
.bar i{display:block;height:100%;width:0;background:var(--dark);border-radius:6px;transition:width .1s linear;}
.prog-card .meta{color:var(--muted);font-variant-numeric:tabular-nums;}
.note{font-size:11.5px;color:var(--muted);line-height:1.45;}
.note.warn{color:#B7791F;}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}}

/* undo / redo, projects, hints */
.ib2{width:32px;height:32px;border-radius:50%;background:var(--panel);color:var(--text);box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease),opacity var(--dur) var(--ease);}
.ib2:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);}
.ib2:active{transform:scale(.94);}
.ib2:disabled{opacity:.35;pointer-events:none;box-shadow:none;}
.side-head .acts{align-items:center;}
.sec-t{display:flex;align-items:center;justify-content:space-between;color:var(--text);font-weight:500;font-size:13px;margin-top:6px;}
.proj-name{display:flex;flex-direction:column;gap:6px;}
.dot{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:6px;}
.dot::before{content:'';width:7px;height:7px;border-radius:50%;background:var(--muted);}
.dot.ok::before{background:var(--accent);}
.dot.warn::before{background:#F2A33A;}
.proj-list{display:flex;flex-direction:column;gap:6px;max-height:230px;overflow-y:auto;padding:4px;margin:-4px;scrollbar-width:thin;}
.proj{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;background:var(--panel-2);border-radius:var(--r-m);padding:7px 8px;cursor:pointer;transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.proj:hover{background:#EEF0F4;}
.proj.cur{background:#fff;box-shadow:0 0 0 2px var(--dark);}
.proj .pth{width:34px;height:44px;border-radius:6px;background:#DDE1E8 center/cover no-repeat;box-shadow:var(--shadow-sm);}
.proj .pmeta{display:flex;flex-direction:column;gap:2px;min-width:0;}
.proj .pmeta b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.proj .pmeta span{color:var(--muted);font-size:11.5px;}
.ib.del.arm{width:auto;padding:0 9px;background:#FCE8E6;color:#B3261E;font-size:11.5px;font-weight:500;}
.hint{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:11.5px;color:var(--muted);white-space:nowrap;pointer-events:none;}
.stage-view{padding-bottom:36px;}

.sc.off .sc-body{opacity:.4;transition:opacity var(--dur) var(--ease);}
.sc .st .switch{justify-self:auto;}

.seglabels{position:absolute;left:0;right:0;top:36px;height:18px;}
.sl{position:absolute;top:0;height:18px;padding:0 4px;font-size:11px;color:var(--muted);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-left:1px solid var(--line);transition:color var(--dur) var(--ease);}
.sl:hover{color:var(--text-soft);}
.sl.cur{color:var(--text);font-weight:500;}

.lang{display:flex;background:#E6EAF0;border-radius:var(--r-pill);padding:2px;}
.lang button{padding:5px 9px;border-radius:var(--r-pill);font-size:11px;font-weight:500;color:var(--muted);transition:background var(--dur) var(--ease),color var(--dur) var(--ease);}
.lang button.on{background:#fff;color:var(--text);box-shadow:var(--shadow-sm);}
@media (max-width:900px){
  body{overflow:auto;}
  .app{grid-template-columns:minmax(0,1fr);height:auto;}
  .stage-view{min-height:70vh;}
  .side{padding:0 16px 40px;overflow:visible;}
  .toast{left:50%;}
}
.hint{white-space:normal;text-align:center;width:90%;}
@media (max-width:900px){.hint{position:static;transform:none;margin-top:8px;width:100%;}}

.fxb{display:none;font-style:normal;font-size:10px;font-weight:500;color:#fff;background:var(--dark);border-radius:var(--r-pill);padding:2px 6px;flex:none;}
.slide.hasfx .fxb{display:inline-block;}
.btn-s:disabled{opacity:.45;pointer-events:none;}

/* ================= Screen Mockup ================= */
.frame canvas{display:block;}
#ov{position:absolute;left:0;top:0;touch-action:none;cursor:default;}
.frame{flex:none;}
.stool{position:absolute;top:16px;right:16px;display:flex;gap:4px;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);padding:5px;border-radius:var(--r-pill);box-shadow:var(--shadow-md);z-index:2;}
.stool .chip{padding:6px 11px;background:transparent;}
.stool .chip:hover{background:#ECEEF2;}
.stool .chip.on{background:var(--dark);color:#fff;}
.empty-hint{z-index:1;text-align:center;}
.empty-hint b{display:block;font-weight:500;font-size:14px;color:var(--text-soft);margin-bottom:4px;}
.empty-hint span{font-size:11.5px;}
.empty-hint.off{display:none;}
.stage-view.drag .frame{box-shadow:0 0 0 3px var(--accent),var(--shadow-lg);}
.transport[hidden]{display:none;}
.scrub{height:34px;}
.scrub input{height:34px;}
.play svg{display:block;}

/* layers list */
.lays{display:flex;flex-direction:column;gap:var(--space-xs);}
.lay{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;background:var(--panel-2);border-radius:var(--r-m);padding:6px 8px;cursor:pointer;transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease),opacity var(--dur) var(--ease);}
.lay:hover{background:#EEF0F4;}
.lay.cur{background:#fff;box-shadow:0 0 0 2px var(--dark);}
.lay.hid{opacity:.5;}
.lay .lth{width:34px;height:34px;border-radius:var(--r-s);background:#DDE1E8 center/cover no-repeat;box-shadow:var(--shadow-sm);display:flex;align-items:center;justify-content:center;color:var(--text-soft);font-weight:500;font-size:13px;overflow:hidden;}
.lay .lnm{min-width:0;display:flex;flex-direction:column;gap:1px;}
.lay .lnm b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lay .lnm span{color:var(--muted);font-size:11px;}
.lay .lact{display:flex;gap:1px;}
.lay .ib{width:22px;height:22px;}
.lay .ib svg{display:block;}
.lay .ib.off{color:#B4BBC7;}
.lay .ib:disabled{opacity:.3;pointer-events:none;}

/* anchor 3x3 */
.agrid{display:grid;grid-template-columns:repeat(3,26px);grid-template-rows:repeat(3,26px);gap:4px;background:var(--panel-2);padding:4px;border-radius:var(--r-s);width:max-content;}
.agrid button{border-radius:calc(var(--r-s) - 3px);background:transparent;position:relative;transition:background var(--dur) var(--ease);}
.agrid button::after{content:'';position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;background:#B4BBC7;transform:translate(-50%,-50%);transition:background var(--dur) var(--ease),transform var(--dur) var(--ease);}
.agrid button:hover{background:#fff;}
.agrid button.on{background:#fff;box-shadow:var(--shadow-sm);}
.agrid button.on::after{background:var(--dark);transform:translate(-50%,-50%) scale(1.3);}
.row.top{align-items:start;}
.txt-area{width:100%;min-height:58px;resize:vertical;background:var(--panel-2);border:none;border-radius:var(--r-s);padding:8px 9px;outline:none;font-family:inherit;line-height:1.4;transition:background var(--dur) var(--ease),box-shadow var(--dur) var(--ease);}
.txt-area:hover{background:#ECEEF2;}
.txt-area:focus{background:#fff;box-shadow:0 0 0 2px var(--dark);}
.chips{display:flex;gap:6px;flex-wrap:wrap;}
.chips .chip{padding:5px 11px;background:#E6EAF0;}
.chips .chip.on{background:var(--dark);}
.sep{height:1px;background:var(--line);margin:2px 0;}
.mini{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-sm);}
.mini .field{display:flex;flex-direction:column;gap:var(--space-xs);}
.mini .field .val-input{width:100%;text-align:left;}
.field>span{font-size:11px;color:var(--muted);}
.btn-s.on{background:var(--dark);color:#fff;}
.sw-row{display:flex;gap:6px;align-items:center;}
.sw-row .swc{width:26px;height:26px;border-radius:var(--r-s);cursor:pointer;box-shadow:inset 0 0 0 1px rgba(20,26,36,.12);transition:transform var(--dur) var(--ease);flex:none;}
.sw-row .swc:hover{transform:scale(1.12);}
.sw-row .swc:active{transform:scale(.94);}
.hidden{display:none!important;}

/* video scrub bar */
.scrub{height:34px;display:flex;align-items:center;}
.scrub input{position:relative;top:auto;left:auto;height:20px;}
.scrub input::-webkit-slider-runnable-track{height:6px;border-radius:6px;background:linear-gradient(to right,var(--dark) var(--p,0%),var(--panel-2) var(--p,0%));}
.scrub input::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-4px;border-radius:50%;background:var(--dark);box-shadow:0 0 0 2px #fff,0 2px 6px rgba(16,24,40,.2);}
.scrub input::-moz-range-track{height:6px;border-radius:6px;background:var(--panel-2);}
.scrub input::-moz-range-progress{height:6px;border-radius:6px;background:var(--dark);}
.scrub input::-moz-range-thumb{width:14px;height:14px;border:none;border-radius:50%;background:var(--dark);box-shadow:0 0 0 2px #fff,0 2px 6px rgba(16,24,40,.2);}

/* stage undo/redo + bg colour chip in Layers */
.stool{align-items:center;}
.stool .ib2{width:28px;height:28px;box-shadow:none;background:transparent;}
.stool .ib2:hover{background:#ECEEF2;transform:none;box-shadow:none;}
.stool-sep{width:1px;height:16px;background:var(--line);margin:0 2px;}
.lay .bgc{-webkit-appearance:none;appearance:none;width:18px;height:18px;border:none;padding:0;border-radius:50%;background:none;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(20,26,36,.2);overflow:hidden;align-self:center;margin-right:4px;}
.lay .bgc::-webkit-color-swatch-wrapper{padding:0;}
.lay .bgc::-webkit-color-swatch{border:none;border-radius:50%;}
.lay .bgc::-moz-color-swatch{border:none;border-radius:50%;}