/* REFRM v111 — premium visual system. Additive layer over the existing editor styles. */
:root{
  --bg:#080b10;
  --panel:#10151d;
  --panel2:#151c26;
  --panel3:#1d2632;
  --line:rgba(202,216,238,.14);
  --line-soft:rgba(202,216,238,.08);
  --fg:#f5f7fb;
  --mut:#a5b0c2;
  --faint:#6c788b;
  --acc:#e4e4ea;
  --acc-hi:#ffffff;
  --acc-soft:rgba(255,255,255,.12);
  --acc-2:#8bbdff;
  --ok:#7fe0b0;
  --r-sm:9px;
  --r:14px;
  --r-lg:22px;
  --sh-1:0 2px 8px rgba(0,0,0,.24);
  --sh-2:0 16px 48px rgba(0,0,0,.34);
  --sh-pop:0 24px 80px rgba(0,0,0,.46);
  --ease:cubic-bezier(.2,.75,.25,1);
}
[data-theme="light"]{
  --bg:#f1f4f7;--panel:#fff;--panel2:#f7f9fb;--panel3:#edf1f5;
  --line:rgba(24,37,54,.15);--line-soft:rgba(24,37,54,.08);
  --fg:#111b28;--mut:#536176;--faint:#8793a5;
  --acc:#5b8a17;--acc-hi:#47710e;--acc-soft:rgba(91,138,23,.12);--acc-2:#376fc0;
}
html{scroll-behavior:smooth}
body{letter-spacing:-.008em}
button,select,input,textarea{font-family:var(--font)}
button{transition:transform .22s var(--ease),box-shadow .22s var(--ease),border-color .22s var(--ease),background .22s var(--ease),color .22s var(--ease),filter .22s var(--ease)}
button:hover:not(:disabled){transform:translateY(-2px)}
button:active:not(:disabled){transform:translateY(0) scale(.985)}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--acc);outline-offset:3px}
.primary{background:linear-gradient(135deg,#f6f8fc 0%,#e4e4ea 52%,#a9df4c 100%);color:#10170a;border-color:rgba(229,255,183,.65);box-shadow:0 8px 24px rgba(166,220,75,.16),inset 0 1px rgba(255,255,255,.7);font-weight:750}
.primary svg{stroke:#17220b}
.primary:hover:not(:disabled){filter:brightness(1.04);box-shadow:0 12px 34px rgba(166,220,75,.25),inset 0 1px rgba(255,255,255,.8)}
.ghost:hover:not(:disabled),.ib:hover:not(:disabled){box-shadow:0 7px 22px rgba(0,0,0,.14)}

/* Atmospheric application surface */
#app{background:var(--bg)}
#top{background:rgba(15,20,28,.94);backdrop-filter:blur(18px);border-bottom-color:var(--line-soft)}
[data-theme="light"] #top{background:rgba(255,255,255,.92)}
.brand-mark{background:linear-gradient(145deg,#f6f8fc,#a8b0bc 58%,#7f8b9b);box-shadow:0 5px 24px rgba(255,255,255,.23)}
.logo{letter-spacing:.2em}
#rail{background:var(--panel);border-right-color:var(--line-soft)}
#rail button{border-radius:14px;transition:all .22s var(--ease)}
#rail button:hover:not(.on){transform:translateX(2px);background:var(--panel2)}
#rail button.on{background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(139,189,255,.05));box-shadow:inset 3px 0 var(--acc);color:var(--acc-hi)}
#left,#right,#tl,#player{background:var(--panel)}
#left,#right{border-color:var(--line-soft)}
.pane{animation:paneIn .28s var(--ease)}
.pc,.mode,.engine-choice,.empty,.restorebox,.card{border-radius:var(--r)}
.pc:hover:not(.on),.engine-choice:hover:not(.on),.mode:hover:not(.on){transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,.16)}
.pc.on,.engine-choice.on,.mode.on{border-color:var(--acc);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 6px 18px rgba(0,0,0,.12)}
#stage{background:radial-gradient(ellipse at 48% 40%,#19212d 0%,#080b10 72%)}
#cvwrap{border-radius:12px;box-shadow:0 22px 60px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06)}
#tl{border-top-color:var(--line)}
#tlbar{background:linear-gradient(180deg,rgba(255,255,255,.018),transparent)}
#tlscroll{background-color:#10151d}
#track{background-color:#0b1017}
.seg{background:rgba(255,255,255,.16)}
.seg.sel{border-color:var(--acc-hi);box-shadow:0 0 0 1px var(--acc),0 4px 20px rgba(255,255,255,.16)}
#ph{box-shadow:0 0 12px rgba(255,112,141,.7)}

/* Landing: cinematic backdrop and carefully composed two-column hero */
#landing{isolation:isolate;display:flex;flex-direction:column;overflow-x:hidden;background:#080b10;color:#f5f7fb;--tx:#f5f7fb;--tx2:#a5b0c2;--bg:#080b10;--bg2:#10151d;--bd:rgba(202,216,238,.14);}
#landing::before,#landing::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1}
#landing::before{background:radial-gradient(ellipse 620px 440px at 17% 22%,rgba(105,146,63,.19),transparent 72%),radial-gradient(ellipse 600px 460px at 92% 10%,rgba(78,113,183,.16),transparent 72%),radial-gradient(ellipse 560px 500px at 55% 95%,rgba(95,64,145,.12),transparent 74%),linear-gradient(135deg,#080b10 0%,#0c1119 54%,#090d13 100%);animation:ambientDrift 18s ease-in-out infinite alternate}
#landing::after{inset:-2px;background-image:linear-gradient(rgba(203,222,244,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(203,222,244,.028) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(180deg,rgba(0,0,0,.7),transparent 78%);opacity:.5}
@keyframes ambientDrift{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.045) translate3d(-1%,1%,0)}}
.land-top{position:relative;z-index:2;flex:none;min-height:78px;padding:16px clamp(18px,4.5vw,68px);border-bottom:1px solid rgba(221,235,255,.085);background:rgba(8,11,16,.64);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.land-brand{gap:11px;font-size:18px;letter-spacing:.16em;font-weight:850;color:#f6f8fb}
.land-brand .logo{width:39px;height:39px;border:1px solid rgba(235,255,208,.56);border-radius:12px;background:linear-gradient(145deg,#e1ff9e 0%,#b5e95b 55%,#6d9644 100%);color:#121a0a;box-shadow:0 6px 26px rgba(183,238,99,.18);font-size:22px;letter-spacing:-.08em}
.land-user{gap:9px}
.chipbtn{padding:10px 15px;border-radius:999px;border:1px solid rgba(214,229,248,.14);background:rgba(255,255,255,.035);color:#e4eaf4;font-size:12.5px;backdrop-filter:blur(10px)}
.chipbtn:hover{background:rgba(255,255,255,.08);border-color:rgba(214,229,248,.25)}
.land-main{position:relative;z-index:1;flex:1;display:grid;grid-template-columns:minmax(0,.96fr) minmax(410px,1.04fr);align-items:center;gap:clamp(32px,5.5vw,88px);width:min(100%,1390px);max-width:1390px;margin:0 auto;padding:clamp(34px,5vh,72px) clamp(22px,5vw,70px) 62px}
.land-story{position:relative;min-width:0;align-self:center;animation:heroRise .72s var(--ease) both}
.land-eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 24px;color:#ffffff;font-size:10.5px;letter-spacing:.17em;font-weight:800;text-transform:uppercase}
.eyebrow-dot,.showcase-live i{display:inline-block;width:7px;height:7px;background:#e4e4ea;border-radius:50%;box-shadow:0 0 0 4px rgba(255,255,255,.11),0 0 17px rgba(255,255,255,.5)}
.land-eyebrow i{width:20px;height:1px;background:rgba(205,224,245,.22);margin:0 2px}
.eyebrow-muted{color:#8591a5;font-weight:700}
.land-story h1{max-width:670px;margin:0;color:#f7f9fc;text-align:left;font-family:Montserrat,Inter,sans-serif;font-size:clamp(44px,5.45vw,78px);line-height:1.02;letter-spacing:-.075em;font-weight:850}
.land-story h1 span{display:inline-block;padding-bottom:.08em;color:transparent;background:linear-gradient(100deg,#e1ffa4 3%,#bbf36b 42%,#a9d6ff 104%);-webkit-background-clip:text;background-clip:text;filter:drop-shadow(0 10px 30px rgba(161,207,98,.08))}
.land-sub{max-width:490px;margin:22px 0 0;color:#aeb8c8;text-align:left;font-size:clamp(14px,1.15vw,16px);line-height:1.75;font-weight:400;letter-spacing:-.01em}
.land-benefits{display:flex;flex-wrap:wrap;gap:9px;margin-top:24px}
.land-benefits span{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid rgba(211,228,247,.11);border-radius:999px;background:rgba(255,255,255,.028);color:#c8d1df;font-size:11px;font-weight:600;white-space:nowrap}
.land-benefits svg{width:14px;height:14px;color:#e4e4ea}
.land-showcase{position:relative;width:min(100%,500px);height:270px;margin:30px 0 0 8px;perspective:1000px;isolation:isolate}
.showcase-orbit{position:absolute;pointer-events:none;border:1px solid rgba(204,234,169,.12);border-radius:50%;transform:rotate(-18deg)}
.orbit-a{width:390px;height:188px;left:12px;top:34px}
.orbit-b{width:450px;height:228px;left:-4px;top:14px;border-color:rgba(135,169,227,.09);transform:rotate(18deg)}
.showcase-window{position:absolute;left:35px;top:10px;width:262px;padding:9px;border:1px solid rgba(220,236,255,.19);border-radius:18px;background:linear-gradient(155deg,rgba(255,255,255,.105),rgba(255,255,255,.025) 38%),rgba(13,18,26,.78);box-shadow:0 30px 70px rgba(0,0,0,.42),inset 0 1px rgba(255,255,255,.09);transform:rotate(-5deg);animation:windowFloat 7s ease-in-out infinite}
.showcase-head{display:flex;align-items:center;gap:8px;padding:3px 2px 9px;color:#8997aa;font-size:7px;letter-spacing:.13em;font-weight:800}
.window-dots{display:flex;gap:3px}.window-dots i{width:5px;height:5px;border-radius:50%;background:#495568}.window-dots i:first-child{background:#e4e4ea}.showcase-live{display:flex;align-items:center;gap:5px;margin-left:auto;color:#c2d2b4;font-size:6px;letter-spacing:.08em}.showcase-live i{width:5px;height:5px;box-shadow:none}
.showcase-stage{position:relative;overflow:hidden;height:176px;border-radius:11px;background:linear-gradient(145deg,#263d45 0%,#19252e 40%,#313b2e 100%);isolation:isolate}
.scene-light{position:absolute;width:190px;height:190px;right:-48px;top:-70px;background:radial-gradient(circle,rgba(207,255,145,.8),rgba(99,161,111,.24) 30%,transparent 72%);filter:blur(4px)}
.scene-glow{position:absolute;inset:0;background:linear-gradient(145deg,transparent 12%,rgba(16,25,28,.1) 38%,rgba(5,9,15,.76) 100%),linear-gradient(25deg,rgba(110,143,95,.35),transparent 58%)}
.scene-person{position:absolute;left:102px;bottom:-7px;width:85px;height:148px;filter:drop-shadow(8px 5px 12px rgba(0,0,0,.32))}
.person-head{position:absolute;z-index:2;top:5px;left:25px;width:37px;height:46px;border-radius:46% 46% 43% 43%;background:linear-gradient(135deg,#e4b58d,#9b654e);box-shadow:inset -8px -2px 0 rgba(70,38,33,.22)}
.person-head::before{content:"";position:absolute;left:-3px;top:-8px;width:43px;height:24px;border-radius:50% 50% 22% 18%;background:#20262a;transform:rotate(-9deg)}
.person-body{position:absolute;left:0;bottom:0;width:85px;height:103px;border-radius:36px 36px 0 0;background:linear-gradient(100deg,#e4e4ea 0%,#658b45 52%,#283c34 100%);clip-path:polygon(27% 0,75% 0,100% 100%,0 100%)}
.scene-caption{position:absolute;left:13px;bottom:15px;z-index:3;display:flex;flex-direction:column;line-height:1.1;letter-spacing:.12em;text-shadow:0 2px 5px #000}.scene-caption span{font-size:7px;color:#e9f6e1;font-weight:800}.scene-caption b{margin-top:3px;color:#d6ff95;font-size:13px;letter-spacing:.035em}
.scene-frame{position:absolute;z-index:4;left:70px;top:26px;width:115px;height:135px;border:1px solid rgba(220,255,184,.75);border-radius:3px;box-shadow:0 0 0 120px rgba(7,12,17,.15),0 0 24px rgba(255,255,255,.17)}
.scene-frame span{position:absolute;width:7px;height:7px;border-color:#ffffff;border-style:solid}.scene-frame span:nth-child(1){left:-1px;top:-1px;border-width:2px 0 0 2px}.scene-frame span:nth-child(2){right:-1px;top:-1px;border-width:2px 2px 0 0}.scene-frame span:nth-child(3){left:-1px;bottom:-1px;border-width:0 0 2px 2px}.scene-frame span:nth-child(4){right:-1px;bottom:-1px;border-width:0 2px 2px 0}
.scene-tag{position:absolute;right:8px;top:8px;z-index:4;display:flex;align-items:center;gap:4px;padding:5px 7px;border:1px solid rgba(222,255,192,.25);border-radius:6px;background:rgba(10,18,14,.58);backdrop-filter:blur(8px);font-size:7px;font-weight:700;color:#dcffad}.scene-tag svg{width:10px;height:10px}
.showcase-timeline{display:flex;align-items:center;gap:7px;padding:10px 2px 1px;color:#7d8a9e;font-size:7px;font-variant-numeric:tabular-nums}.timeline-wave{display:flex;align-items:center;gap:2px;height:16px;flex:1}.timeline-wave i{display:block;flex:1;height:var(--h,40%);border-radius:2px;background:linear-gradient(180deg,#ffffff,#7eaa4e);opacity:.85}.timeline-wave i:nth-child(3n){height:75%}.timeline-wave i:nth-child(4n){height:28%}.timeline-wave i:nth-child(5n){height:94%}.timeline-wave i:nth-child(2n){opacity:.45}
.float-card{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;padding:11px 13px;border:1px solid rgba(218,235,255,.17);border-radius:13px;background:linear-gradient(140deg,rgba(255,255,255,.105),rgba(255,255,255,.035)),rgba(14,20,29,.82);box-shadow:0 20px 55px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.07);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);animation:floatBob 6s ease-in-out infinite}
.float-card>div{display:flex;flex-direction:column;gap:3px}.float-card b{color:#f2f6fc;font-size:10px;white-space:nowrap}.float-card>div span{color:#9daabd;font-size:8.5px;white-space:nowrap}.float-caption{right:0;top:44px;animation-delay:-1.5s}.float-clips{right:18px;bottom:26px;animation-delay:-3.3s}.float-icon{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:rgba(255,255,255,.12);color:#ffffff}.float-icon svg{width:16px;height:16px}.float-check{display:grid;place-items:center;width:18px;height:18px;margin-left:2px;border-radius:50%;background:#e4e4ea;color:#111a0a}.float-check svg{width:11px;height:11px;stroke-width:3}.clip-stack{position:relative;width:28px;height:31px;display:block}.clip-stack i{position:absolute;bottom:0;width:17px;height:25px;border:1px solid rgba(221,255,181,.64);border-radius:4px;background:linear-gradient(145deg,#4c6541,#19242a)}.clip-stack i:nth-child(1){left:0;transform:rotate(-12deg)}.clip-stack i:nth-child(2){left:6px;transform:translateY(-2px);background:linear-gradient(145deg,#6e9662,#24332e)}.clip-stack i:nth-child(3){left:12px;transform:rotate(12deg);background:linear-gradient(145deg,#bbdf8a,#527048)}
@keyframes heroRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes windowFloat{0%,100%{transform:rotate(-5deg) translateY(0)}50%{transform:rotate(-4deg) translateY(-6px)}}
@keyframes floatBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}

/* Import surface — focused and tactile, without touching its behavior */
.land-workspace{position:relative;align-self:center;min-width:0;width:100%;padding:19px;border:1px solid rgba(216,232,250,.15);border-radius:26px;background:linear-gradient(155deg,rgba(255,255,255,.075),rgba(255,255,255,.012) 34%),rgba(15,21,30,.84);box-shadow:0 35px 100px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.08);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);animation:heroRise .8s .08s var(--ease) both}
.workspace-intro{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:1px 2px 13px;color:#d7e2f0;font-size:10px;letter-spacing:.15em;font-weight:800}
.workspace-number{display:flex;align-items:center;gap:7px;color:#647187;font-variant-numeric:tabular-nums}.workspace-number i{display:inline-block;width:30px;height:2px;border-radius:3px;background:linear-gradient(90deg,#e4e4ea,#7183a3)}
.land-drop{position:relative;overflow:hidden;width:100%;max-width:none;padding:16px;border:1px solid rgba(220,234,250,.13);border-radius:19px;gap:16px;background:linear-gradient(180deg,rgba(255,255,255,.035),transparent 42%),rgba(12,17,25,.78);box-shadow:inset 0 1px rgba(255,255,255,.05);transition:border-color .25s var(--ease),box-shadow .25s var(--ease),transform .25s var(--ease)}
.land-drop::before{content:"";position:absolute;top:0;left:16%;right:16%;height:1px;background:linear-gradient(90deg,transparent,rgba(208,255,151,.65),rgba(145,188,255,.48),transparent);opacity:.45;pointer-events:none}
.land-drop.over{border-color:rgba(216,255,145,.74);transform:translateY(-2px);box-shadow:0 0 0 4px rgba(255,255,255,.075),0 24px 65px rgba(0,0,0,.28)}
.src-tabs{position:relative;z-index:1;align-self:stretch;gap:5px;padding:5px;border-radius:13px;border-color:rgba(210,228,247,.09);background:rgba(3,7,12,.35)}
.src-tabs button{min-height:43px;border-radius:10px;color:#8895a8;font-size:12px}
.src-tabs button[aria-selected=true]{color:#eaffcf;background:linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.07));border:1px solid rgba(255,255,255,.24);box-shadow:inset 0 1px rgba(255,255,255,.045)}
.src-tabs button[aria-selected=true] svg{color:#ffffff}
.src-pane{padding:24px 10px 10px;gap:12px;animation:heroRise .28s var(--ease)}
.land-drop b{font-size:16px;letter-spacing:-.02em;color:#f4f8fc}
.land-drop .dim{font-size:12px;color:#77869a}
.big-ic{width:32px!important;height:32px!important;box-sizing:content-box;padding:13px;border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.15),rgba(139,189,255,.09));border:1px solid rgba(215,245,180,.14);color:#ffffff!important;box-shadow:0 10px 28px rgba(0,0,0,.2)}
#landpick{min-width:160px;min-height:47px;padding:0 22px;border-radius:13px}
#landdrop .hint{color:#8290a4;font-size:11px}
.land-workspace .yt{max-width:none;margin-top:0}
.yt-row{gap:9px}
.yt-row input{height:48px;border-radius:12px;border-color:rgba(216,232,250,.15);background:rgba(3,7,12,.45);color:#f4f8fc}
.yt-row input::placeholder{color:#738097}
.yt-row input:focus{border-color:rgba(255,255,255,.6);box-shadow:0 0 0 3px rgba(255,255,255,.09)}
.yt-row .primary{height:48px;border-radius:12px;padding:0 17px}
.yt-local-explainer{font-size:10.5px;line-height:1.55;color:#8492a5!important;margin:6px 0 0}
.yt-prev{border:1px solid rgba(215,231,248,.12);border-radius:15px;background:rgba(255,255,255,.025);padding:12px;box-shadow:none}
.yt-q button{border-color:rgba(213,230,248,.12);background:rgba(4,8,14,.35);border-radius:11px}
.yt-q button[aria-checked=true]{border-color:rgba(255,255,255,.48);background:rgba(255,255,255,.09)}
.yt-actions{gap:8px}
.yt-actions button{min-height:43px;border-radius:11px}
.land-workspace .land-ready{width:100%;max-width:none}
.land-file{border-color:rgba(215,231,248,.13);background:rgba(255,255,255,.035);border-radius:14px}
.set{border-color:rgba(215,231,248,.1);background:rgba(5,9,15,.32);border-radius:17px;box-shadow:none}
.set-h{color:#b4c0d1}
.set .tog{border-color:rgba(215,231,248,.1);background:rgba(255,255,255,.025)}
.set .tog:hover{border-color:rgba(255,255,255,.35);transform:translateY(-1px)}
.set .tog:has(input:checked){border-color:rgba(255,255,255,.34);background:rgba(255,255,255,.06)}
.seg4 button,.chips button,.priority-choice{border-color:rgba(215,231,248,.12);background:rgba(255,255,255,.025)}
.seg4 button[aria-checked=true],.chips button[aria-checked=true],.priority-choice.on,.priority-choice[aria-checked=true]{border-color:rgba(255,255,255,.64);background:rgba(255,255,255,.09);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.seg4 button[aria-checked=true] i{border-color:var(--acc-hi)}
.priority-choice:hover{border-color:rgba(255,255,255,.4)}
#landgen{position:relative;overflow:hidden;min-height:58px;margin-top:12px;border-radius:14px;background:linear-gradient(115deg,#e3ffa8 0%,#e4e4ea 52%,#a9df4e 100%);color:#11190a;box-shadow:0 12px 34px rgba(171,225,85,.16),inset 0 1px rgba(255,255,255,.65);font-size:14px;letter-spacing:-.02em}
#landgen::after{content:"";position:absolute;top:-90%;bottom:-90%;left:-35%;width:22%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transition:left .65s var(--ease);pointer-events:none}
#landgen:hover:not(:disabled)::after{left:120%}
#landgen svg{stroke:#16220a}
#landgen:hover:not(:disabled){filter:none;box-shadow:0 17px 42px rgba(171,225,85,.24),inset 0 1px rgba(255,255,255,.8)}
.land-proc{border-color:rgba(215,231,248,.14);background:rgba(5,9,15,.4);border-radius:17px}
.land-bar{height:7px;background:rgba(217,234,253,.09)}
.land-bar i{background:linear-gradient(90deg,#b2e65d,#dbffa0,#8dbdff);box-shadow:0 0 20px rgba(255,255,255,.22)}
.land-pct{background:linear-gradient(110deg,#e2ffa8,#a8d1ff);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.land-steps li{border-color:rgba(216,232,250,.12);color:#8d9bb0}
.land-steps li.done{color:#dfffb0;border-color:rgba(255,255,255,.35)}
.land-steps li.now{background:linear-gradient(135deg,#f6f8fc,#b5e95b);color:#18200e;border-color:transparent;animation:pulseStep 1.8s ease-in-out infinite}
.land-error{color:#ff9da9;text-align:left}
#landmsg{max-width:none;text-align:left;margin:10px 0 0}

/* Existing editor controls inherit the new palette, with restrained depth and precise motion. */
.filechip,.userchip{background:var(--panel2);border-color:var(--line-soft)}
.phead{background:linear-gradient(180deg,rgba(255,255,255,.025),transparent);border-color:var(--line-soft)}
#inspect .isec{border-color:var(--line-soft)}
.isec summary:hover{color:var(--acc-hi)}
#stage{box-shadow:inset 0 0 80px rgba(0,0,0,.16)}
#drop{border-color:rgba(255,255,255,.34);background:linear-gradient(140deg,rgba(255,255,255,.045),rgba(139,189,255,.025))}
#drop.over{border-color:var(--acc-hi);background:rgba(255,255,255,.08)}
.drop-ic{border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 30px rgba(0,0,0,.2)}
#toasts .toast{backdrop-filter:blur(16px);border-color:var(--line);background:rgba(17,23,32,.94)}
[data-theme="light"] #toasts .toast{background:rgba(255,255,255,.94)}

/* Tablet and mobile: story first, functional import panel second. */
@media(max-width:1100px){
  .land-main{grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);gap:28px;padding-left:26px;padding-right:26px}
  .land-story h1{font-size:clamp(42px,5.3vw,62px)}
  .land-showcase{transform:scale(.9);transform-origin:left top;width:111%;margin-bottom:-22px}
  .land-benefits{gap:7px}.land-benefits span{font-size:10px;padding:7px 9px}
  .land-workspace{padding:15px;border-radius:22px}
}
@media(max-width:860px){
  #landing{overflow-y:auto;overscroll-behavior-y:contain}
  .land-top{min-height:68px;padding:13px 20px}
  .land-main{display:flex;flex-direction:column;align-items:stretch;gap:24px;width:100%;padding:42px 22px calc(38px + env(safe-area-inset-bottom,0px));}
  .land-story{width:100%;text-align:center}
  .land-eyebrow{justify-content:center;margin-bottom:20px;font-size:9px;letter-spacing:.14em}
  .land-story h1{max-width:680px;margin-inline:auto;text-align:center;font-size:clamp(43px,8vw,66px);letter-spacing:-.07em}
  .land-sub{max-width:560px;text-align:center;margin:16px auto 0;font-size:15px}
  .land-benefits{justify-content:center;margin-top:18px}
  .land-showcase{width:min(500px,100%);margin:25px auto -6px;transform:none}
  .land-workspace{width:min(620px,100%);margin:0 auto;padding:17px}
}
@media(max-width:540px){
  .land-top{padding:12px 15px}
  .land-brand{font-size:15px;letter-spacing:.13em;gap:8px}
  .land-brand .logo{width:34px;height:34px;border-radius:10px;font-size:20px}
  .land-user{gap:5px}.chipbtn{padding:8px 10px;font-size:11px}
  .land-main{padding:31px 14px calc(28px + env(safe-area-inset-bottom,0px));gap:19px}
  .land-eyebrow{font-size:8px;gap:7px;margin-bottom:16px}
  .land-story h1{font-size:clamp(37px,10vw,49px);line-height:1.04}
  .land-sub{font-size:13px;line-height:1.68;margin-top:14px}
  .land-benefits{gap:7px;margin-top:16px}
  .land-benefits span{font-size:9.5px;padding:7px 9px;gap:5px}
  .land-benefits span:last-child{display:none}
  .land-showcase{height:205px;width:100%;margin:18px auto -2px;transform:scale(.92);transform-origin:top center}
  .showcase-window{left:calc(50% - 139px);top:5px;width:246px;transform:rotate(-4deg)}
  .showcase-stage{height:140px}
  .scene-person{transform:scale(.85);transform-origin:bottom center;left:93px}
  .scene-frame{height:116px;left:65px;top:21px}
  .float-caption{right:-5px;top:27px;transform:scale(.9)}
  .float-clips{right:0;bottom:12px;transform:scale(.88)}
  .float-card{padding:8px 9px;gap:6px}
  .float-card b{font-size:9px}.float-card>div span{font-size:7.5px}
  .float-icon{width:25px;height:25px}
  .land-workspace{padding:11px;border-radius:19px;gap:0}
  .workspace-intro{margin:3px 3px 11px;font-size:9px}
  .land-drop{padding:12px;border-radius:15px;gap:13px}
  .src-tabs button{font-size:11px;min-height:41px;padding:7px 5px}
  .src-pane{padding:18px 6px 8px;gap:10px}
  .land-drop b{font-size:14px}
  #landpick{min-height:44px}
  .land-workspace .set{padding:12px;gap:10px}
  .land-workspace .priority-grid{grid-template-columns:1fr 1fr}
  .land-workspace .priority-choice{min-height:88px}
  #landgen{min-height:54px;font-size:13px}
  .yt-row{flex-direction:column}.yt-row .primary{width:100%}
  .land-workspace .land-file{padding:10px}
  .land-workspace .land-proc{padding:25px 17px}
}
@media(prefers-reduced-motion:reduce){
  #landing::before,.land-story,.land-workspace,.showcase-window,.float-card,.land-steps li.now{animation:none!important}
  button,#landgen::after{transition:none!important}
  button:hover:not(:disabled){transform:none}
}