.template-studio{--studio-canvas:#0b1230;--studio-panel:#101b3b;--studio-border:#28385e;--studio-text:#e7ebfb;--studio-muted:#a8b8da;--studio-blue:#0d3ad6;--studio-cyan:#02bbf7;height:100dvh;min-height:500px;display:flex;flex-direction:column;background:var(--studio-canvas);color:var(--studio-text);font-family:inherit}.studio-header{height:76px;flex-shrink:0;display:flex;align-items:center;gap:18px;padding:0 28px;background:#000433;border-bottom:1px solid var(--studio-border)}.studio-back{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--studio-border);border-radius:50%;color:inherit}.studio-title h1{font-size:16px;line-height:1.4;margin:0;font-weight:600}.studio-title>span{font-size:12px;color:var(--studio-muted)}.template-studio button{cursor:pointer;font:inherit}.template-studio a:focus-visible,.template-studio button:focus-visible{outline:2px solid var(--studio-cyan);outline-offset:3px}.studio-use{margin-left:auto;display:flex;align-items:center;gap:16px;background:var(--studio-blue);color:white;border:0;border-radius:7px;padding:12px 18px;font-size:13px!important}.studio-use:hover:not(:disabled){background:#174bea}.studio-back:hover{background:var(--studio-panel);border-color:#90a4ec}.studio-devices button:hover:not([aria-pressed=true]){background:#1b2b50;color:var(--studio-text)}.studio-use:disabled{opacity:.5;cursor:not-allowed}.studio-toolbar{position:relative;background:var(--studio-panel);border-bottom:1px solid var(--studio-border);display:flex;align-items:center;justify-content:center;padding:0 12px;overflow:visible;gap:12px;flex-shrink:0}.studio-devices{display:flex;gap:4px;background:#080f29;border-radius:9px;padding:4px}.studio-devices button{display:flex;align-items:center;gap:7px;border:0;background:transparent;color:var(--studio-muted);padding:9px 17px;border-radius:6px;font-size:12px}.studio-devices button[aria-pressed=true]{background:var(--studio-blue);color:#ffffff;box-shadow:0 1px 3px #00043340}.studio-workspace{display:flex;flex:1 1;min-height:0}.studio-preview{flex:1 1;flex-direction:column}.studio-canvas,.studio-preview{min-width:0;min-height:0;display:flex}.studio-canvas{flex:1 1;align-items:center;justify-content:center;overflow:hidden;background-image:radial-gradient(#263554 .7px,transparent 0);background-size:16px 16px}.studio-device{flex-shrink:0;background:white;box-shadow:0 12px 40px #00043340;outline:1px solid var(--studio-border);overflow:hidden}.studio-device-ios{border-radius:30px;outline:6px solid #28385e}.studio-device-android{border-radius:18px;outline:5px solid #243452}.studio-device-web{border-radius:6px}.studio-editor{width:clamp(320px,34vw,520px);min-height:0;min-width:0;flex-shrink:0;background:var(--studio-panel);border-right:1px solid var(--studio-border);display:flex;flex-direction:column}.studio-editor-content{flex:1 1;min-height:0;overflow:hidden}.studio-editor p,.studio-error{font-size:12px;color:#fab1b0;padding:10px 16px;margin:0}@media (max-width:700px){.studio-header{padding:0 16px;height:66px;gap:10px}.studio-use{padding:11px 12px;gap:7px}.studio-toolbar{background:var(--studio-panel);border-bottom:1px solid var(--studio-border);padding:0 12px}.studio-devices button{padding:9px 12px}.studio-editor{width:100%;border-right:0;border-bottom:1px solid var(--studio-border);height:38%;flex-shrink:0}.studio-workspace{flex-direction:column}.studio-title h1{font-size:14px}.studio-canvas{min-height:160px}}.studio-canvas{position:relative}.studio-companion{position:absolute;right:20px;bottom:20px;width:154px;height:267px;overflow:hidden;border:4px solid #28385e;border-radius:18px;background:#f6f3ed;box-shadow:0 12px 30px #0005}.studio-companion>button{position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;background:transparent;cursor:pointer}.studio-companion>button:focus-visible{outline:2px solid var(--studio-cyan);outline-offset:-3px}.studio-companion-screen{width:440px;height:780px;transform:scale(.332);transform-origin:top left}@media (max-width:1000px){.studio-companion{width:110px;height:189px;right:12px;bottom:12px}.studio-companion-screen{transform:scale(.232)}}