.site-header{background:#fff;border-bottom:1px solid #e2e8f0;color:#1e293b;position:relative;z-index:20;font-family:Inter,"Segoe UI",sans-serif}.site-header-inner{max-width:1800px;margin:auto;min-height:72px;padding:12px 24px;display:flex;align-items:center;gap:25px}.site-header-inner>a{font:650 25px Inter,"Segoe UI",sans-serif;color:#152036;text-decoration:none;white-space:nowrap}.site-header-inner>a span{color:#b78218}#site-navigation{display:flex;align-items:center;justify-content:flex-end;gap:2px;flex:1}#site-navigation>a,.site-dropdown>summary{display:block;color:#1e293b;text-decoration:none;font-size:15px;font-weight:600;padding:9px 10px;white-space:nowrap;border-radius:5px}#site-navigation>a:hover,.site-dropdown>summary:hover{background:#fff5d8;color:#9a6700}#site-navigation>a[aria-current]{color:#0369a1;background:#e8f5fc}.site-dropdown{position:relative}.site-dropdown>summary{cursor:pointer;list-style:none}.site-dropdown>summary:after{content:' ▾'}.site-dropdown>div{position:absolute;z-index:25;left:0;top:100%;min-width:230px;max-height:65vh;overflow:auto;background:white;border:1px solid #e2e8f0;box-shadow:0 10px 30px #0002;border-radius:8px;padding:8px}.site-dropdown>div a{display:block;color:#334155;text-decoration:none;padding:9px 12px;font-size:15px}.site-dropdown>div a:hover{background:#fff5d8}#site-menu{display:none;color:#1e293b;background:white;border-color:#cbd5e1}.skip-link{position:absolute;top:-100px;left:20px;z-index:1000;background:white;color:#111;padding:12px}.skip-link:focus{top:5px}.topbar{height:86px;padding:16px 24px}.studio-logo{width:48px;height:48px;object-fit:contain}.studio-wordmark{font-size:23px;letter-spacing:-.6px;display:flex;flex-direction:column;gap:4px}.brand .studio-wordmark small{display:block;font-size:9px;letter-spacing:2px;color:#b7bdc7}.workspace{height:calc(100dvh - 158px);min-height:570px}.empty h1{font-size:36px;font-weight:500;letter-spacing:-1.2px;line-height:1.15;margin:16px 0}.welcome-logo{object-fit:contain;filter:drop-shadow(0 8px 25px #171a56)}.library .section-title h2{margin:0;font-size:16px;font-weight:600}.site-footer{background:#0b0d13;color:#cbd5e1;border-top:1px solid #ffffff14;font-family:Inter,"Segoe UI",sans-serif}.footer-inner{max-width:1400px;margin:auto;padding:45px 24px 20px}.footer-promos{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:40px}.footer-promos section{padding:28px;border-radius:12px;background:linear-gradient(135deg,#211b0e,#161820);border:1px solid #f5c54240}.footer-promos span{font:700 10px 'Segoe UI',sans-serif;letter-spacing:1.3px;color:#f5c542}.footer-promos h2{font-size:25px;color:white;margin:12px 0}.footer-promos p{line-height:1.6;color:#b8bdc9}.footer-promos a{display:inline-block;margin-top:8px;padding:11px 18px;border-radius:6px;background:#f5c542;color:#201a09;text-decoration:none;font-weight:bold}.footer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:35px;padding-bottom:35px;border-bottom:1px solid #ffffff14}.footer-grid h3{color:white;font-size:20px;margin:0 0 18px}.footer-grid a{display:block;color:#94a3b8;text-decoration:none;font-size:15px;line-height:1.5;margin:0 0 9px}.footer-grid a:hover{color:#f5c542}.footer-grid h3:not(:first-child){margin-top:26px}.footer-bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:24px 0 8px;font-size:14px;color:#8d97a8}.footer-bottom a{color:#f5c542;text-decoration:none}.startup-error{padding:20px;background:#3a2020;color:#fff;position:fixed;bottom:0;left:0;right:0;z-index:500;margin:0;text-align:center}.site-header details{margin:0}.site-header nav{scrollbar-width:thin}
@media(max-width:1500px){#site-menu{display:block;margin-left:auto}#site-navigation{display:none}#site-navigation.is-open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;max-height:75vh;overflow:auto;background:white;padding:16px 24px;border-bottom:1px solid #cbd5e1}#site-navigation>a{padding:11px}.site-dropdown>div{position:static;box-shadow:none;max-height:35vh}.site-header-inner{min-height:72px}}
@media(max-width:800px){.topbar{height:auto;min-height:110px}.workspace{height:auto;min-height:650px}.studio-wordmark{font-size:20px}.studio-logo{width:42px;height:42px}.footer-grid{grid-template-columns:1fr 1fr}.footer-promos{grid-template-columns:1fr}.site-header-inner{padding:12px 18px}.footer-inner{padding:30px 18px}.studio{min-height:65dvh}.site-header nav a{font-size:16px}.project-title{min-width:100px}}
@media(max-width:520px){.footer-grid{grid-template-columns:1fr 1fr;gap:24px 16px}.footer-grid h3{font-size:18px}.footer-grid a{font-size:14px}.topbar{padding:12px}.empty h1{font-size:30px}.workspace{min-height:0}.studio{height:72dvh}.top-actions{flex-wrap:wrap}.footer-promos section{padding:22px}.crop-actions>span{flex-basis:100%}}

/* Official Presetpedia branding and compact navigation */
.site-header{background:#fafbfc;border-bottom:1px solid #dfe5e9;font-family:Inter,"Segoe UI",sans-serif}.site-header-inner{max-width:1440px;padding:10px 28px;gap:32px;min-height:80px}.site-header-inner>a.official-brand{display:flex;align-items:center;flex-shrink:0}.official-brand img{display:block;width:170px;height:auto;max-height:61px;object-fit:contain}#site-navigation{gap:6px}#site-navigation>a,.site-dropdown>summary{font-family:Inter,"Segoe UI",sans-serif;font-size:17px;font-weight:600;padding:11px 14px;color:#34404e;border-radius:8px}#site-navigation>a:hover,.site-dropdown>summary:hover{background:#edf1f4;color:#18242f}#site-navigation>a[aria-current]{background:#182126;color:#d0f18b;border:1px solid #182126;box-shadow:0 3px 8px #18212618}.site-dropdown>div{border-radius:12px;padding:8px;min-width:245px;border-color:#e0e6eb}.site-dropdown>div a{font-family:Inter,"Segoe UI",sans-serif;font-size:16px;border-radius:6px;line-height:1.4}.site-dropdown>div a:hover{background:#eff5e8}.site-dropdown[open]>summary{background:#edf1f4}.site-dropdown:last-child>div{right:0;left:auto}.workspace{height:calc(100dvh - 166px)}.footer-promos{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:stretch}.footer-promos .mega-promo{padding:0;overflow:hidden;display:flex;flex-direction:column}.footer-promos a.mega-art{display:block;margin:0;padding:0;border-radius:0;background:transparent;line-height:0}.mega-art img{width:100%;height:auto;display:block;aspect-ratio:5/2;object-fit:contain}.mega-copy{padding:24px 28px}.footer-promos>section:not(.mega-promo){display:flex;flex-direction:column;justify-content:center}.footer-promos>section:not(.mega-promo)>a{align-self:flex-start}.site-dropdown>summary:focus-visible{outline:2px solid #507f20;outline-offset:2px}
@media(min-width:961px){#site-menu{display:none}#site-navigation{display:flex}#site-navigation.is-open{position:static;flex-direction:row;align-items:center;padding:0;max-height:none;background:transparent;border:0;overflow:visible}.site-dropdown>div{position:absolute;box-shadow:0 10px 30px #0002;max-height:65vh}}
@media(max-width:960px){.site-header-inner{padding:9px 18px;min-height:72px}.official-brand img{width:150px}#site-menu{display:block;margin-left:auto}#site-navigation{display:none}#site-navigation.is-open{display:flex;align-items:stretch;gap:5px}.site-dropdown:last-child>div{left:0;right:auto}.site-dropdown>div{position:static;max-height:35vh;box-shadow:none}.footer-promos{grid-template-columns:1fr}.workspace{height:auto}}
@media(max-width:520px){.official-brand img{width:140px}.mega-copy{padding:20px}.footer-promos .mega-promo{padding:0}.site-header-inner{gap:16px}}

/* Keep the mobile app promotion sized to its content. */
.footer-promos .app-promo{align-self:center;padding:28px;min-width:0}.app-promo h2{font-family:Inter,"Segoe UI",sans-serif;font-size:28px;line-height:1.25;letter-spacing:-.5px}.app-promo p{margin:0 0 16px}.footer-promos .app-promo>a{margin-top:0}
@media(min-width:961px) and (max-width:1100px){.site-header-inner{gap:18px;padding-inline:20px}#site-navigation{gap:2px}#site-navigation>a,.site-dropdown>summary{padding-inline:9px}.official-brand img{width:150px}}
@media(max-width:520px){.footer-promos .app-promo{padding:22px}.app-promo h2{font-size:25px}}

/* Shared Studio typography across the surrounding site. */
.site-footer h2,.site-footer h3{font-family:inherit;font-weight:600;letter-spacing:-.5px;text-wrap:balance}.footer-promos h2{font-size:clamp(24px,2.2vw,30px);line-height:1.2;margin:12px 0 14px}.footer-promos p{font-size:15px;line-height:1.65}.footer-promos a{font-weight:600;font-size:14px}.footer-grid h3{font-size:18px;line-height:1.35;letter-spacing:-.25px}.footer-grid a{font-size:14px;line-height:1.6}.footer-bottom{font-size:13px;line-height:1.6}.studio-wordmark{font-weight:650}

/* Put preset selection first in the mobile editing workflow. */
@media(max-width:800px){.library{grid-row:1;max-height:360px;border-top:0;border-bottom:1px solid var(--line)}.studio{grid-row:2}.develop{grid-row:2}}
@media(max-width:520px){.library{order:0;height:360px;flex-shrink:0}.studio{order:1}.develop{order:2}}

/* PresetStudio Android promotion in the editor toolbar. */
.top-actions .studio-app-promo{display:inline-flex;align-items:center;gap:9px;flex-shrink:0;padding:8px 13px;margin-right:12px;border:1px solid #a9c78166;border-radius:8px;background:#a9c78114;color:#e4f1d4;text-decoration:none;font-family:inherit;white-space:nowrap;transition:background .15s,border-color .15s}
.studio-app-promo span{font-size:13px;font-weight:600;line-height:1.2}.studio-app-promo small{display:block;margin-top:3px;font-size:10px;font-weight:400;color:#b7c6a8}.studio-app-promo:hover{background:#a9c78129;border-color:#a9c781}.studio-app-promo:focus-visible{outline:2px solid #c5e29f;outline-offset:3px}
@media(max-width:1100px){.top-actions .studio-app-promo{padding:7px 9px;margin-right:4px}.studio-app-promo small{display:none}}
@media(max-width:800px){.top-actions{flex-wrap:wrap}.top-actions .studio-app-promo{margin-right:auto}}

/* Mobile recommendation for the native PresetStudio app. */
.mobile-app-dialog{position:relative;text-align:center;width:min(390px,calc(100vw - 28px));padding:30px 24px 24px;border-color:#688846;background:linear-gradient(155deg,#222a25,#15191b 62%);overflow:visible}.mobile-app-dialog>img{display:block;margin:0 auto 14px;border-radius:18px;filter:drop-shadow(0 12px 22px #0008)}.mobile-app-close-form{position:absolute;top:8px;right:8px}.mobile-app-close-form button{width:38px;height:38px;padding:0;border:0;background:transparent;color:#c8d0d4;font-size:18px}.mobile-app-eyebrow{margin:0 0 8px;color:#bde886;font-size:10px;font-weight:700;letter-spacing:1.7px}.mobile-app-dialog h2{margin:0;color:#fff;font-size:25px;line-height:1.18;letter-spacing:-.55px}.mobile-app-dialog>p:not(.mobile-app-eyebrow){margin:13px auto 0;max-width:310px;color:#c3cbcf;font-size:14px;line-height:1.6}.mobile-app-actions{display:grid;gap:9px;margin-top:22px}.mobile-app-actions a,.mobile-app-actions button{display:block;width:100%;box-sizing:border-box;padding:12px 16px;border-radius:8px;text-align:center;font:600 14px/1.25 Inter,"Segoe UI",sans-serif;text-decoration:none}.mobile-app-actions a.primary{background:#d0f18b;color:#20291a}.mobile-app-actions form{margin:0}.mobile-app-actions .quiet{background:#252c2f;color:#e6ebed;border-color:#424c50}.mobile-app-dialog::backdrop{background:#050708cc;backdrop-filter:blur(5px)}
@media(min-width:801px){.mobile-app-dialog{display:none}}