
:root{--studio-border:#d9e1ed;--studio-blue:#254ee9;--studio-ink:#213755}
.studio-app{background:#f1f4f9}.studio-header{max-width:none;background:white;padding:19px 30px;border-bottom:1px solid var(--studio-border);gap:25px}.studio-header .brand{font-size:22px}.app-name{display:flex;gap:18px;align-items:center;border-left:1px solid var(--studio-border);padding-left:26px;margin-right:auto;font-size:14px}.session-badge{font-size:10px;color:#54705c;background:#edf4ee;border-radius:20px;padding:5px 10px}.home-link{font-size:11px;color:#5c6e88;text-decoration:underline;text-underline-offset:4px}.studio-shell{display:grid;grid-template-columns:220px minmax(0,1fr) 330px;min-height:calc(100vh - 133px)}.library{background:white;border-right:1px solid var(--studio-border);padding:34px 23px;display:flex;flex-direction:column;min-width:0}.studio-glyph{display:block;font-size:29px;color:var(--studio-blue);margin-bottom:20px}.library-title h1{font-size:31px;line-height:1.08;letter-spacing:-1.4px}.library-title>p{font-size:11px;color:#6c7e97;margin-top:14px}.library nav{display:flex;flex-direction:column;gap:8px;margin-top:30px}.library nav a{font-size:12px;border-radius:6px;padding:11px 13px;display:flex;gap:12px;color:#667893}.library nav .current{background:#edf1ff;color:var(--studio-blue);font-weight:600}.library-note{margin-top:auto;padding-top:70px}.library-note>span{font-size:28px;color:#6d83b5}.library-note h2{font:600 13px/1.4 Sans,Arial,sans-serif;letter-spacing:0;margin-top:10px}.library-note p{font-size:11px;color:#72819a;line-height:1.7}.formats{display:flex;gap:8px;margin-top:20px}.formats span{font-size:9px;border:1px solid var(--studio-border);padding:4px 8px;border-radius:3px;color:#78869c}.canvas-section{min-width:0;display:flex;flex-direction:column;padding:25px 30px 18px;gap:20px}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:11px;color:#60738e}.canvas-toolbar>div{display:flex;align-items:center;gap:9px;min-width:0}.canvas-light{width:6px;height:6px;border-radius:50%;background:#8ca5e5;flex-shrink:0}.canvas-toolbar .text-button{font-size:11px;white-space:nowrap}.canvas-surface{background-color:#eaf0f7;background-image:radial-gradient(#bdcada 1px,transparent 1px);background-size:18px 18px;border:1px solid #d1dce9;min-height:570px;flex:1;display:flex;flex-direction:column;position:relative;border-radius:5px;padding:45px 20px 25px}.studio-app .dropzone{margin:auto;min-height:310px;max-width:420px;width:100%;background:#ffffffee;border:1px dashed #a2b2cc;border-radius:10px;padding:35px 20px;box-shadow:0 12px 30px #21375508}.studio-app .dropzone strong{font-size:25px}.studio-app .dropzone .upload-symbol{font-size:40px!important;background:#edf2ff;width:65px;height:65px;display:grid;place-items:center;border-radius:12px;margin-bottom:15px}.studio-app .previews{padding:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:auto 0}.studio-app .preview img{height:240px;background-color:white;box-shadow:0 7px 15px #1e365214;border-radius:3px}.studio-app .preview figcaption{font-size:11px;color:#536e8d;line-height:1.7;background:#f7faffd9;padding:9px 12px;margin-top:8px;border-radius:3px}.studio-app .previews>.text-button{align-self:start;justify-self:start}.canvas-caption{display:flex;gap:25px;justify-content:center;font-size:10px;color:#69809b;align-items:center;margin-top:35px}.canvas-caption>span{font-size:18px;color:#91a2b9}.canvas-bottom{font-size:10px;color:#71829b;display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:28px}.adjustments{background:white;border-left:1px solid var(--studio-border);padding:30px 23px;min-width:0}.adjustment-heading{display:flex;gap:13px;align-items:center;padding-bottom:25px;border-bottom:1px solid #e6ecf4}.adjust-symbol{font-size:25px;color:var(--studio-blue)}.adjustment-heading h2{font-size:20px;letter-spacing:-.7px}.adjustment-heading p{font-size:10px;color:#7b89a1;margin:6px 0 0}.studio-app .settings{padding:25px 0 0}.studio-app .tabs{margin-bottom:25px}.studio-app .settings h3{font-size:23px}.studio-app .settings .quiet{font-size:11px}.studio-app .settings label:not(.check){font-size:11px;margin-top:18px}.studio-app .check{font-size:11px}.studio-app .export{font-size:12px;margin-top:9px}.studio-app .message{font-size:11px;line-height:1.65}.studio-app .downloads a{font-size:10px;padding:11px}.studio-help{margin-top:28px;border-top:1px solid #e0e6ef;padding-top:17px;font-size:11px;color:#6c7d97}.studio-help p{font-size:10px;line-height:1.8}.studio-footer{max-width:none;background:white;padding:15px 30px;border-top:1px solid var(--studio-border);font-size:10px;color:#8a97aa}.studio-footer>span:first-child{font-weight:600;color:#6a7e9c}.studio-footer>span:last-child{font-size:10px}
@media(min-width:1600px){.studio-shell{grid-template-columns:240px minmax(0,1fr) 360px}.canvas-section{padding:30px 45px 20px}.canvas-surface{min-height:660px}.studio-app .preview img{height:320px}}
@media(max-width:1100px){.studio-shell{grid-template-columns:170px minmax(0,1fr) 285px}.library{padding:27px 17px}.library-title h1{font-size:26px}.canvas-section{padding:23px 20px 15px}.canvas-toolbar{align-items:start;flex-direction:column;gap:7px}.canvas-surface{padding:30px 15px 20px}.adjustments{padding:27px 20px}.studio-app .dropzone strong{font-size:21px}.studio-app .previews{grid-template-columns:1fr}.studio-app .preview img{height:250px}.canvas-caption{gap:10px;font-size:9px}.canvas-caption>span{font-size:14px}.app-name{padding-left:18px;gap:10px}.studio-header{padding:18px 23px}}
@media(max-width:800px){.studio-shell{grid-template-columns:minmax(0,1fr) 300px}.library{display:none}.studio-header .home-link{display:none}.studio-app .previews{grid-template-columns:1fr}.canvas-surface{min-height:520px}.canvas-section{padding:25px 20px}.studio-footer{padding:15px 23px}.studio-footer>span:nth-child(2){display:none}}
@media(max-width:600px){.studio-header{padding:17px 6%;gap:14px;flex-wrap:wrap}.studio-header .brand{font-size:20px}.app-name{font-size:11px;padding-left:13px;margin-right:0;margin-left:auto}.session-badge{display:none}.studio-shell{grid-template-columns:1fr;min-height:0}.canvas-section{padding:21px 6% 16px;gap:16px}.canvas-toolbar{flex-direction:row;align-items:center;gap:10px;font-size:10px}.canvas-toolbar .text-button{font-size:10px}.canvas-surface{min-height:330px;padding:25px 17px 17px}.studio-app .dropzone{min-height:220px;padding:25px 12px}.studio-app .dropzone strong{font-size:21px}.studio-app .dropzone small{font-size:9px}.studio-app .dropzone .upload-symbol{width:48px;height:48px;font-size:30px!important;margin-bottom:8px}.canvas-caption{margin-top:22px;font-size:9px;gap:12px}.canvas-bottom{font-size:9px;gap:8px}.adjustments{border-left:0;border-top:1px solid var(--studio-border);padding:25px 6%}.adjustment-heading{padding-bottom:20px}.studio-app .settings{padding-top:20px}.studio-app .previews{grid-template-columns:1fr 1fr;gap:12px}.studio-app .preview img{height:150px}.studio-app .preview figcaption{font-size:9px;padding:7px;overflow-wrap:anywhere}.studio-app .previews>.text-button{font-size:10px;grid-column:1/-1}.studio-footer{padding:15px 6%;flex-wrap:nowrap}.studio-help{font-size:11px}.canvas-toolbar>div{max-width:58%}#file-count{overflow-wrap:anywhere}}
