.studio-layout{color:#263b44;background:#f2f4f1;grid-template-columns:242px minmax(0,1fr);min-height:100vh;font-family:system-ui;display:grid}.studio-layout *{box-sizing:border-box}.studio-layout button{cursor:pointer}.studio-layout button:disabled{opacity:.5;cursor:not-allowed}.studio-sidebar{color:#e9f1f1;background:#1e3a48;flex-direction:column;gap:24px;padding:29px 19px;display:flex}.studio-brand{color:#fff;letter-spacing:2px;font-size:21px;font-weight:800;text-decoration:none}.studio-brand small{letter-spacing:3px;margin-left:32px;font-size:10px;display:block}.studio-side-heading,.studio-eyebrow{letter-spacing:2.1px;color:#b89f72;font-size:10px;font-weight:750}.studio-side-heading{color:#bad1d3}.studio-sidebar .studio-field span{color:#ccdfe1}.studio-sidebar .studio-field select{color:#1d3b46;background:#fff}.studio-nav{gap:5px;display:grid}.studio-nav button{color:#d3e2e5;text-align:left;background:0 0;border:0;border-radius:8px;padding:12px 13px}.studio-nav button.active,.studio-nav button:hover{color:#fff;background:#345968}.studio-back{color:#d8e6e8;margin-top:auto;font-size:13px}.studio-main{min-width:0;padding:29px clamp(16px,3vw,42px)}.studio-top{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:15px;margin-bottom:22px;display:flex}.studio-top h1{letter-spacing:-1px;margin:9px 0;font-size:clamp(26px,3vw,36px)}.studio-top p{color:#70818c;font-size:12px}.studio-actions{flex-wrap:wrap;gap:8px;display:flex}.studio-primary,.studio-ghost{border:1px solid #cdd9d7;border-radius:8px;padding:11px 14px;font-size:12px;font-weight:700}.studio-primary{color:#fff;background:#1e3a48;border-color:#1e3a48}.studio-ghost{color:#26434e;background:#fff}.studio-work{grid-template-columns:minmax(290px,1fr) minmax(300px,390px);align-items:start;gap:21px;display:grid}.studio-controls{gap:15px;min-width:0;display:grid}.studio-panel{background:#fff;border:1px solid #e1e8e5;border-radius:16px;padding:22px}.studio-panel h2{margin:0 0 14px;font-size:18px}.studio-panel p{color:#70818a;font-size:12px;line-height:1.6}.studio-field{color:#445b66;gap:7px;margin:13px 0;font-size:12px;font-weight:650;display:grid}.studio-field input:not([type=file]),.studio-field select,.studio-field textarea{background:#fff;border:1px solid #d4deda;border-radius:8px;width:100%;min-width:0;padding:11px;font:13px system-ui}.studio-field textarea{resize:vertical}.studio-field input[type=file]{width:100%;font-size:12px}.studio-switch{flex-wrap:wrap;gap:6px;display:flex}.studio-switch button{color:#385360;background:#fff;border:1px solid #d8dedc;border-radius:7px;padding:8px 11px;font-size:12px}.studio-switch button.active{color:#fff;background:#23424b}.studio-note{color:#73858d;font-size:11px}.studio-range{color:#455d68;gap:8px;margin:15px 0;font-size:12px;display:grid}.studio-range span{justify-content:space-between;gap:8px;display:flex}.studio-range input{accent-color:#456a64;width:100%}.studio-check{align-items:center;gap:10px;font-size:13px;display:flex}.studio-themes{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.studio-themes button{color:#3d5962;text-align:center;background:#fff;border:2px solid #e6eae5;border-radius:9px;gap:8px;padding:8px;display:grid}.studio-themes button.selected{border-color:#b39a6a}.studio-themes button span{border:1px solid;place-items:center;height:62px;font:31px Georgia;display:grid}.studio-themes button b{font-size:11px}.studio-colors{flex-wrap:wrap;gap:20px;display:flex}.studio-colors label{justify-items:center;gap:5px;font-size:12px;display:grid}.studio-colors input{background:0 0;border:0;width:52px;height:48px}.studio-repeat{border:1px solid #e6ebe8;border-radius:10px;margin:15px 0;padding:15px}.studio-repeated-title{justify-content:space-between;align-items:center;display:flex}.studio-repeated-title button{color:#9c3737;background:0 0;border:0;font-size:12px}.studio-gallery{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.studio-gallery>div{gap:5px;display:grid}.studio-gallery img{object-fit:cover;border-radius:9px;width:100%;height:120px}.studio-gallery button{color:#853d3d;background:#f4e6e6;border:0;border-radius:7px;padding:8px;font-size:11px}.studio-sections{gap:7px;display:grid}.studio-sections>div{border:1px solid #e3e8e7;border-radius:8px;align-items:center;gap:7px;padding:10px;display:flex}.studio-sections label{flex:1;align-items:center;gap:9px;font-size:13px;display:flex}.studio-sections button{background:#edf0ed;border:0;border-radius:7px;padding:8px}.studio-error,.studio-success{border-radius:9px;justify-content:space-between;margin:11px 0;padding:12px 14px;display:flex}.studio-error{color:#9c3333;background:#fee9e6}.studio-success{color:#2e7250;background:#e4f4ed}.studio-preview{min-width:0;position:sticky;top:14px}.studio-preview-title{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;font-size:13px;display:flex}.studio-device{background:#fff;max-height:72vh;margin:auto;overflow-y:auto;box-shadow:0 16px 45px #0002}.studio-device.phone{border:8px solid #243a40;border-radius:27px;max-width:390px}.studio-device.wide{border:1px solid #d0d4d2;border-radius:7px;max-width:900px}.studio-preview-foot{color:#7d8a90;text-align:center;font-size:11px;line-height:1.6}.studio-auth{background:#f7f6f0;place-items:center;min-height:100vh;padding:25px;font:15px system-ui;display:grid}.studio-auth>div{background:#fff;border-radius:15px;max-width:490px;padding:35px}.studio-auth a{color:#1f5364}@media (max-width:1100px){.studio-layout{grid-template-columns:1fr}.studio-sidebar{gap:12px;padding:14px}.studio-nav{display:flex;overflow-x:auto}.studio-nav button{white-space:nowrap}.studio-back,.studio-side-heading{display:none}.studio-work{grid-template-columns:1fr 330px}.studio-main{padding:20px}}@media (max-width:740px){.studio-work{flex-direction:column-reverse;display:flex}.studio-preview{width:100%;position:relative}.studio-controls{width:100%}.studio-device{max-height:500px}.studio-device.phone{max-width:340px}.studio-top{align-items:flex-start}.studio-panel{padding:17px}.studio-themes{grid-template-columns:repeat(2,1fr)}}@media (min-width:1101px){.studio-work.desktop-preview{grid-template-columns:minmax(320px,380px) minmax(490px,1fr)}.studio-work.desktop-preview .studio-preview{min-width:0}}
