/* LuckyStudio unified workbench v1: one branded entrance, two isolated draft modes. */
:root{--lw-surface:#08130e;--lw-elevated:#122b1c;--lw-border:#3c7050;--lw-glow:#98f7b5}
.lw-studio-mode-nav{display:flex;align-items:center;gap:5px;flex-wrap:wrap;background:#081b12;border:1px solid #41694d;padding:5px;border-radius:13px;font:750 12px/1.2 system-ui,sans-serif;flex:none}
.lw-studio-mode-nav a{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:39px;padding:9px 13px;text-decoration:none;border-radius:9px;color:#bbe5ca;border:1px solid transparent;white-space:nowrap}
.lw-studio-mode-nav a:hover,.lw-studio-mode-nav a:focus-visible{color:#f6fff8;background:#1c442e;border-color:#75bd8d;outline-offset:2px}
.lw-studio-mode-nav a[aria-current="page"]{background:linear-gradient(125deg,#bdfbd0,#84eab0);color:#082516;border-color:#8df4b4;font-weight:900;box-shadow:0 3px 18px #4edb8140}
.lw-studio-mode-nav .lw-mode-home{width:39px;padding:8px;font-size:18px;color:#d0ffe1}
.lwstudio-dialog .lwstudio-head{flex-wrap:wrap}
.lwstudio-dialog .lwstudio-head-actions{flex-wrap:wrap;justify-content:flex-end}
.lwstudio-dialog .lw-studio-mode-nav{order:-1}
body:has(.editor-section) .studio-topbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
body:has(.editor-section) .studio-topbar .lw-studio-mode-nav{margin-left:auto}
body:has(.editor-section) .editor-panel,
.lwstudio-dialog .lwstudio-controls{scrollbar-width:thin;scrollbar-color:#40734e #0b1710}
body:has(.editor-section) .tabbar .tab,
.lwstudio-dialog .lwstudio-tabs button{border-radius:9px;min-height:43px;font:780 11px/1.25 system-ui,sans-serif}
body:has(.editor-section) .tabbar .tab.active,
.lwstudio-dialog .lwstudio-tabs button.active{background:linear-gradient(125deg,#bcfaca,#7fdfa2);color:#08301a;border:1px solid #a6f7ba}
body:has(.editor-section) .editor-panel,
body:has(.editor-section) .preview-panel,
.lwstudio-dialog .lwstudio-controls{background-color:#0b1811;border-color:#396248}
body:has(.editor-section) .preview-toolbar,
.lwstudio-dialog .lwstudio-preview-bar{min-height:53px;background:#0b2015}
@media(max-width:820px){
 .lwstudio-dialog .lwstudio-head-actions{width:100%;justify-content:space-between}
 .lwstudio-dialog .lw-studio-mode-nav{max-width:calc(100% - 52px);flex:1}
 .lwstudio-dialog .lw-studio-mode-nav a:not(.lw-mode-home){flex:1;padding:9px 6px;min-width:70px}
 body:has(.editor-section) .studio-topbar .lw-studio-mode-nav{width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){.lw-studio-mode-nav a{transition:none!important}}
/* Preview typography must respond to preview width, NOT device viewport width.
   Previous vw sizing produced six-line headings inside a 700px mock browser. */
.lwstudio-preview-frame{container-type:inline-size}
.lwstudio-live-page .live-hero>div:first-child{min-width:0}
.lwstudio-live-page .live-hero h3{hyphens:auto;overflow-wrap:break-word}
.lwstudio-preview-frame:not(.mobile) .live-preview.layout-wasteland-terminal[data-sector="autoservis"] .live-hero:has(.lws-raster-photo){
 grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr)!important;
 padding:clamp(16px,2.5cqw,34px)!important;
 gap:clamp(14px,2.2cqw,28px)!important;
 min-height:340px!important;
}
.lwstudio-preview-frame:not(.mobile) .live-preview.layout-wasteland-terminal[data-sector="autoservis"] .live-hero h3{
 font-size:clamp(27px,4.35cqw,46px)!important;
 line-height:1.07!important;
 letter-spacing:-.045em!important;
}
@media(max-width:740px){
 .lwstudio-preview-frame .live-preview.layout-wasteland-terminal[data-sector="autoservis"] .live-hero:has(.lws-raster-photo){grid-template-columns:1fr!important}
 .lwstudio-preview-frame.mobile .live-preview.layout-wasteland-terminal[data-sector="autoservis"] .live-hero h3{font-size:clamp(25px,8cqw,32px)!important}
}