[hidden]{display:none!important}
:root{--blue:#4ba1c7;--green:#2f7d62;--green-dark:#23624c;--red:#fa1d2d;--ink:#17202a;--muted:#68727d;--line:#dce3e7;--soft:#f3f7f8;--white:#fff;--ok:#14804a;--danger:#b42318;--shadow:0 18px 50px rgba(24,45,58,.12)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:var(--soft)}button,input,textarea{font:inherit}button{cursor:pointer}.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#e9f5f8,#f9fbfb)}.login-card{width:min(430px,100%);background:#fff;border:1px solid var(--line);border-radius:24px;padding:38px;box-shadow:var(--shadow)}.dragonfly,.brand-icon{color:var(--blue);font-size:32px}.login-card h1{margin:12px 0 6px;font-size:32px}.login-card p{color:var(--muted);line-height:1.5}.login-card label,.field{display:grid;gap:8px;margin:22px 0;font-weight:700}.login-card input,.field input,.field textarea{width:100%;border:1px solid #bcc8ce;border-radius:12px;padding:14px 16px;background:#fff;color:var(--ink);outline:none}.login-card input:focus,.field input:focus,.field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(75,161,199,.15)}.primary{border:0;border-radius:12px;background:var(--green);color:#fff;font-weight:800;padding:14px 22px;min-height:48px}.primary:hover{background:var(--green-dark)}.quiet{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 14px}.studio{min-height:100vh;display:grid;grid-template:76px 1fr/300px 1fr;grid-template-areas:"top top" "menu work"}.topbar{grid-area:top;display:flex;align-items:center;gap:28px;padding:0 26px;background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:12px;margin-right:auto;color:inherit;text-decoration:none;border-radius:10px;padding:5px 7px;margin-left:-7px}.brand:hover strong{text-decoration:underline}.brand:focus-visible{outline:3px solid rgba(75,161,199,.45);outline-offset:3px}.brand strong,.brand small{display:block}.brand small{color:var(--muted);margin-top:2px}.connection{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:14px}.connection span:first-child{width:10px;height:10px;border-radius:50%;background:#d19a12}.connection.ok span:first-child{background:var(--ok)}.connection.bad span:first-child{background:var(--danger)}.menu{grid-area:menu;padding:28px 18px;background:#fff;border-right:1px solid var(--line)}.menu-title{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;padding:0 12px 10px}.menu button{width:100%;border:0;background:transparent;border-radius:14px;padding:13px 12px;margin:4px 0;display:grid;grid-template-columns:34px 1fr;text-align:left;color:var(--ink)}.menu button>span{grid-row:1/3;font-size:20px;color:var(--green)}.menu button b{font-size:16px}.menu button small{color:var(--muted);margin-top:4px}.menu button.active{background:#eaf4f1}.menu button.active b{color:var(--green-dark)}.workspace{grid-area:work;padding:34px clamp(22px,5vw,70px);max-width:1120px;width:100%}.workspace-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:24px}.workspace-head h1{font-size:36px;margin:4px 0}.workspace-head p{margin:0;color:var(--muted)}.eyebrow{text-transform:uppercase;letter-spacing:.1em;font-weight:800;font-size:12px;color:var(--green)!important}.revision{font-size:13px;color:var(--muted);white-space:nowrap}.editor-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:0 7px 24px rgba(24,45,58,.06)}.field span{font-size:15px}.field small{font-weight:400;color:var(--muted)}.field textarea{resize:vertical;line-height:1.55}.savebar{display:flex;align-items:center;justify-content:flex-end;gap:20px;border-top:1px solid var(--line);padding-top:22px;margin-top:28px;position:sticky;bottom:0;background:#fff}.message{color:var(--muted);font-size:14px}.message.success{color:var(--ok);font-weight:700}.message.error{color:var(--danger);font-weight:700}.loading{background:#fff;border:1px solid var(--line);padding:30px;border-radius:18px;color:var(--muted)}.image-editor{display:grid;grid-template-columns:180px 1fr;gap:20px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:16px;margin:18px 0}.image-editor img{width:180px;height:120px;object-fit:cover;border-radius:10px;background:#e9eef0}.image-editor .image-actions{display:flex;gap:10px;flex-wrap:wrap}.image-editor input[type=file]{max-width:100%}.gallery{display:grid;gap:12px}.gallery-row{display:grid;grid-template-columns:84px 1fr auto auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px}.gallery-row img{width:84px;height:60px;object-fit:cover;border-radius:7px;background:#e9eef0}.gallery-row input{min-width:0;border:1px solid #c5d0d5;border-radius:9px;padding:10px}.small-button{border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 11px}.danger{color:var(--danger)}.upload-box{padding:18px;border:2px dashed #b8cbd3;border-radius:14px;background:#f8fbfc;margin:18px 0}.upload-box b{display:block;margin-bottom:8px}
@media(max-width:800px){.studio{grid-template:70px auto 1fr/1fr;grid-template-areas:"top" "menu" "work"}.topbar{padding:0 14px}.connection{display:none}.menu{border-right:0;border-bottom:1px solid var(--line);display:flex;overflow:auto;padding:10px}.menu-title{display:none}.menu button{min-width:170px}.workspace{padding:24px 16px}.workspace-head{display:block}.revision{margin-top:12px}.image-editor{grid-template-columns:1fr}.image-editor img{width:100%;height:180px}.gallery-row{grid-template-columns:70px 1fr}.gallery-row button{grid-row:2}.savebar{flex-direction:column;align-items:stretch}.savebar button{width:100%}}
.rich-field{padding:18px;border:1px solid var(--line);border-radius:16px;background:#fbfcfc}.rich-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.rich-toolbar button,.rich-toolbar select,.rich-toolbar input[type=color]{min-height:38px;border:1px solid #bcc8ce;border-radius:8px;background:#fff;padding:7px 10px}.rich-toolbar input[type=color]{width:46px;padding:4px}.rich-editor{min-height:150px;border:1px solid #bcc8ce;border-radius:12px;padding:16px;background:#fff;font-weight:400;line-height:1.55;overflow:auto}.rich-editor:focus{outline:0;border-color:var(--blue);box-shadow:0 0 0 4px rgba(75,161,199,.15)}
