.mobile-only { display:none; }
.ms-dialog { --ms-ink:#22322d; --ms-line:#dfe5e1; --ms-accent:var(--app-color,var(--product-color,#455847)); --ms-soft:var(--app-tint,var(--product-soft,#edf3ef)); position:fixed; inset:0; width:100%; max-width:none; height:100dvh; max-height:none; margin:0; padding:0; border:0; border-radius:0; background:#fff; color:var(--ms-ink); font-family:Manrope,Arial,sans-serif; overflow:hidden; }
.ms-dialog[open] { display:flex; flex-direction:column; }
.ms-dialog * { box-sizing:border-box; }
.ms-dialog [hidden] { display:none !important; }
.ms-dialog button { font:inherit; cursor:pointer; }
.ms-dialog::backdrop { background:#fff; }
.ms-open, .ms-open body { overflow:hidden; overscroll-behavior:none; }
.ms-header { display:flex; align-items:center; gap:8px; min-height:64px; padding:8px 18px; padding-top:max(8px,env(safe-area-inset-top)); flex-shrink:0; }
.ms-header>button { width:40px; height:44px; padding:10px; border:0; background:transparent; color:inherit; }
.ms-header svg { width:22px; height:22px; }
.ms-header h2 { font-size:19px; font-weight:750; letter-spacing:-.6px; margin:0; flex:1; line-height:1.2; outline:none; }
.ms-demo { color:#738077; font-size:11px; }
.ms-build { flex:1; min-height:0; overflow:auto; padding:15px 24px 20px; overscroll-behavior:contain; }
.ms-look .brand-control, .ms-look .brand-workshop { margin:0; padding:0; border:0; box-shadow:none; background:transparent; border-radius:0; display:grid; grid-template-columns:72px minmax(0,1fr); column-gap:14px; }
.ms-look .workshop-heading, .ms-look .looks { display:none; }
.ms-look label, .ms-look .brand-name-field { grid-column:2; grid-row:1; padding:3px 0 0; margin:0; color:#78837c; font-size:11px; font-weight:600; }
.ms-look #product-name { grid-column:2; grid-row:1; align-self:end; width:100%; height:38px; border:0; border-bottom:1px solid var(--ms-line); border-radius:0; box-shadow:none; background:transparent; margin:19px 0 0; padding:4px 0; font:700 20px Manrope,Arial,sans-serif; color:var(--ms-ink); letter-spacing:-.5px; }
.ms-look .brand-name-field #product-name { margin:0; }
.ms-look .bk { display:contents; }
.ms-look .bk-icon-trigger { grid-column:1; grid-row:1; width:68px; height:68px; padding:0; border:0; position:relative; align-self:center; }
.ms-look .bk-current-icon { width:64px; height:64px; border-radius:19px; }
.ms-look .bk-icon-trigger>span:nth-child(2) { display:none; }
.ms-look .bk-edit { position:absolute; right:0; bottom:0; width:23px; height:23px; background:white; box-shadow:0 1px 5px #23342d25; }
.ms-look .bk-palette-heading { grid-column:1/-1; margin:20px 0 10px; }
.ms-look .bk-palette-heading b { font-size:12px; }
.ms-look .bk-color-name { font-size:11px; }
.ms-look .bk-palettes { grid-column:1/-1; gap:9px; }
.ms-look .bk-palettes>button { height:36px; border-radius:11px; }
.ms-tools-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin:27px 0 13px; }
.ms-tools-heading h3 { font-size:15px; letter-spacing:-.4px; margin:0; font-weight:750; }
.ms-count { color:#7b887f; font-size:11px; white-space:nowrap; }
.ms-tools { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.ms-tool-row { position:relative; min-width:0; }
.ms-tools [data-ms-tool] { display:grid; grid-template-columns:23px minmax(0,1fr) 17px; align-items:center; gap:8px; min-height:68px; padding:12px 10px; width:100%; border:1px solid var(--ms-line); border-radius:15px; text-align:left; background:#fff; color:var(--ms-ink); transition:background-color 160ms,border-color 160ms; }
.ms-tools [data-ms-tool][aria-pressed=true], .ms-tools [data-ms-tool][aria-pressed=mixed] { background:var(--ms-soft); border-color:color-mix(in srgb,var(--ms-accent) 36%,white); }
.ms-tool-icon { display:flex; color:var(--ms-accent); }
.ms-tool-icon svg { width:22px; height:22px; }
.ms-tools b { font-size:12px; font-weight:700; line-height:1.4; letter-spacing:-.15px; }
.ms-check { display:grid; place-items:center; border:1px solid #bdc9c1; width:17px; height:17px; border-radius:50%; }
.ms-check svg { width:15px; height:15px; opacity:0; }
.ms-tools [aria-pressed=true] .ms-check, .ms-tools [aria-pressed=mixed] .ms-check { color:#fff; background:var(--ms-accent); border-color:var(--ms-accent); }
.ms-tools [aria-pressed=true] .ms-check svg, .ms-tools [aria-pressed=mixed] .ms-check svg { opacity:1; }
.ms-footer { flex-shrink:0; padding:12px 24px max(14px,env(safe-area-inset-bottom)); display:flex; gap:12px; background:#fff; border-top:1px solid #edf0ee; }
.ms-footer button { height:51px; border-radius:15px; font-size:14px; font-weight:750; }
.ms-primary { flex:1; background:var(--ms-ink); border:1px solid var(--ms-ink); color:white; }
.ms-edit { flex:0 0 86px; background:#fff; border:1px solid var(--ms-line); color:var(--ms-ink); }
.ms-result { flex:1; min-height:0; display:flex; flex-direction:column; overflow:hidden; }
.ms-context { flex-shrink:0; display:flex; justify-content:center; padding:0 20px 12px; gap:6px; }
.ms-context button { border:0; background:#f1f4f2; color:#6d7971; border-radius:30px; padding:9px 17px; font-size:12px; font-weight:700; }
.ms-context button[aria-pressed=true] { background:var(--ms-ink); color:#fff; }
.ms-stage { flex:1; min-height:0; overflow:hidden; }
#mobile-studio .ms-stage>.device, #mobile-studio .ms-stage>.product-device { position:relative; width:100%; max-width:none; height:100%; max-height:none; min-height:0; aspect-ratio:auto; padding:0; margin:0; border:0; border-radius:0; background:#fff; box-shadow:none; transform:none; overflow:hidden; }
#mobile-studio .ms-stage>.device::before, #mobile-studio .ms-stage>.device::after, #mobile-studio .ms-stage>.product-device::before, #mobile-studio .ms-stage>.product-device::after { display:none; }
#mobile-studio .device-chrome, #mobile-studio .device-camera, #mobile-studio .device-home, #mobile-studio .phone-home-indicator { display:none; }
#mobile-studio .phone-screen, #mobile-studio .product-app { height:100%; min-height:0; display:flex; flex-direction:column; border-radius:0; border:0; box-shadow:none; padding:0; }
#mobile-studio .app { flex:1; min-height:0; display:flex; flex-direction:column; }
#mobile-studio .app-header { flex-shrink:0; padding:12px 21px; margin:0; min-height:64px; border-bottom:1px solid #edf0ee; }
#mobile-studio .app-header>b { font-size:16px; }
#mobile-studio .app-layout { flex:1; min-height:0; display:flex; flex-direction:column-reverse; height:auto; overflow:hidden; }
#mobile-studio .app-content { flex:1; min-height:0; height:auto; overflow:auto; padding:22px; overscroll-behavior:contain; }
#mobile-studio .app-layout>nav { flex:0 0 62px; min-height:62px; margin:0; }
#mobile-studio .app-layout>nav>button b, #mobile-studio .app-nav .nav-label { font-size:10px; }
.ms-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.ms-dialog button:focus-visible { outline:2px solid var(--ms-accent); outline-offset:3px; }
@media(max-width:760px) {
  .ms-ready .mobile-only { display:inline; }
  .ms-ready .desktop-only { display:none; }
  .ms-ready #studio .builder-controls, .ms-ready #build .controls { display:none; }
  .ms-ready #studio .composer, .ms-ready #build .builder { display:block; }
  .ms-ready #studio .preview-toolbar, .ms-ready #build .preview-toolbar { display:none; }
  .ms-ready #studio .preview-sticky, .ms-ready #build .preview-column { position:static; }
  .ms-ready .mobile-preview-button { display:none; }
  .ms-ready #studio .studio-bottom, .ms-ready #studio .preview-foot, .ms-ready #build .preview-footer { display:none; }
  .ms-ready #studio .preview-column, .ms-ready #build .preview-column { display:none; }
  .ms-ready .ms-launch { display:flex; align-items:center; justify-content:center; width:100%; min-height:58px; border:0; border-radius:16px; background:#22322d; color:white; font:750 15px Manrope,Arial,sans-serif; }
  .ms-ready #studio, .ms-ready #build { padding-block:35px; }
  .ms-ready #studio .section-heading, .ms-ready #build .section-heading { margin-bottom:22px; }
  .ms-ready #build .product-tabs { margin-bottom:20px; }
  .ms-ready #build .section-heading p { display:none; }
  .ms-ready .hero-products { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:14px; padding-bottom:12px; }
  .ms-ready .hero-products .product-tile { flex:0 0 86%; scroll-snap-align:start; }
  .ms-ready .hero-products .product-tile-copy>span { display:none; }
}
.ms-launch { display:none; }
.ms-launch-dialog { width:min(430px,calc(100% - 32px)); max-height:85dvh; padding:30px; border:1px solid #dfe5e1; border-radius:24px; color:#22322d; background:white; font-family:Manrope,Arial,sans-serif; }
.ms-launch-dialog::backdrop { background:#17261f77; backdrop-filter:blur(5px); }
.ms-launch-dialog h2 { font-size:29px; line-height:1.15; margin:20px 0; letter-spacing:-1px; }
.ms-launch-dialog p { font-size:14px; line-height:1.7; }
.ms-launch-dialog ul { padding-left:20px; font-size:14px; line-height:1.9; }
.ms-launch-dialog .ms-primary { width:100%; padding:15px; border-radius:14px; font:700 14px Manrope,Arial,sans-serif; margin-top:12px; }
.ms-launch-dialog small { display:block; font-size:11px; line-height:1.6; margin-top:14px; }
.ms-launch-close { position:absolute; right:18px; top:13px; border:0; background:none; padding:8px; font-size:25px; color:inherit; }
@media(max-height:700px) {
  .ms-build { padding-top:7px; }
  .ms-tools-heading { margin-top:19px; }
  .ms-tools [data-ms-tool] { min-height:57px; }
  .ms-look .bk-palette-heading { margin-top:13px; }
}
@media(prefers-reduced-motion:no-preference) { .ms-dialog[data-mode=result] .ms-result { animation:ms-enter 180ms ease-out; } @keyframes ms-enter { from { opacity:.5; } to { opacity:1; } } }
@media(prefers-reduced-motion:reduce) { .ms-dialog * { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
.ms-header { min-height:53px; padding-block:4px; border-bottom:1px solid #edf0ea; }
.ms-header .ms-edit { flex:0 0 auto; width:auto; min-width:44px; height:44px; padding:8px; border:0; background:none; font-size:12px; font-weight:700; color:#4f6657; }
.ms-header h2 { font-size:16px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.ms-workspaces{position:relative;flex:1;min-width:0;color:#302b36;font:700 14px Manrope,Arial,sans-serif}.ms-workspaces>summary{display:flex;align-items:center;gap:5px;padding:10px 0;list-style:none;cursor:pointer;width:fit-content;max-width:100%}.ms-workspaces>summary::-webkit-details-marker{display:none}.ms-workspaces>summary>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ms-workspaces>summary>svg{width:14px;height:14px;flex-shrink:0;color:#96849e}.ms-workspaces>div{position:absolute;top:calc(100% + 7px);left:0;z-index:20;min-width:235px;max-width:calc(100vw - 75px);padding:7px;border-radius:15px;border:1px solid #eae5ed;background:#fff;box-shadow:0 15px 40px #32213d20}.ms-workspaces button{width:100%;display:block;text-align:left;border:0;background:none;padding:14px 12px;border-radius:9px;font:600 12px Manrope,Arial,sans-serif;color:#93849b}.ms-workspaces button[aria-pressed=true]{background:#f4edf7;color:#493654}.ms-workspaces button[aria-pressed=true]::after{content:'✓';float:right;margin-left:12px}.ms-workspaces>summary:focus-visible{outline:2px solid var(--app-color,#715a7d);outline-offset:3px;border-radius:5px}
#mobile-studio[data-mode=result] .app-header, #mobile-studio .ms-context { display:none; }
#mobile-studio[data-mode=result] .ms-stage { padding-bottom:env(safe-area-inset-bottom); background:#fff; }
.ms-tool-row:has(.ms-config) [data-ms-tool] { padding-right:33px; grid-template-columns:21px minmax(0,1fr); }
.ms-tool-row:has(.ms-config) .ms-check { position:absolute; right:11px; top:10px; width:14px; height:14px; }
.ms-config { position:absolute; right:3px; bottom:2px; border:0; background:none; color:#647668; width:31px; height:31px; padding:7px; }.ms-config svg { width:17px; height:17px; }
.ms-subtools { flex:1; min-height:0; overflow:auto; padding:18px 24px; }.ms-subtools h3 { font-size:23px; letter-spacing:-.7px; margin:25px 0; }.ms-sub-back { border:0; background:none; padding:0; color:#728477; font-size:12px !important; }.ms-subtools>div { display:grid; gap:8px; }.ms-subtools [data-ms-child] { display:flex; justify-content:space-between; align-items:center; min-height:55px; padding:15px; border:1px solid #dfe6df; background:white; color:#334b39; border-radius:12px; }.ms-subtools [data-ms-child] b { font-size:13px; }.ms-subtools [data-ms-child] span { opacity:0; }.ms-subtools [aria-pressed=true] { background:var(--ms-soft); border-color:var(--ms-accent); }.ms-subtools [aria-pressed=true] span { opacity:1; }
