/* One merchant shell for setup, AI operations and the traditional backend. */
:root { --shell-nav-width:208px; --shell-header-height:72px; }
.shell-header,.shell-header *,.shell-sidebar,.shell-sidebar *,.shell-account,.shell-account * { box-sizing:border-box; }
.shell-header { position:fixed; inset:0 0 auto; z-index:610; display:grid; grid-template-columns:minmax(195px,1fr) auto minmax(300px,1fr); align-items:center; gap:22px; height:var(--shell-header-height); padding:0 26px; border-bottom:1px solid #dfe6f2; color:#233551; background:rgba(255,255,255,.94); box-shadow:0 4px 24px rgba(40,67,121,.035); backdrop-filter:blur(22px); }
.shell-header a { text-decoration:none; }
.shell-brand { display:flex; align-items:center; gap:10px; width:max-content; color:#213454!important; }
.shell-brand > span:last-child { display:flex; align-items:center; gap:11px; }
.shell-brand strong { font-size:19px; font-weight:800; letter-spacing:.08em; }
.shell-brand small { padding-left:11px; border-left:1px solid #d8e2f2; color:#536781; font-size:12px; font-weight:600; letter-spacing:.03em; white-space:nowrap; }
.shell-brand-symbol { position:relative; display:block; flex:0 0 auto; width:30px; height:31px; }
.shell-brand-symbol i { position:absolute; top:6px; width:9px; height:23px; border-radius:5px; background:linear-gradient(180deg,#16c3e0,#2f63f2); transform:rotate(27deg); }
.shell-brand-symbol i:nth-child(1) { left:2px; height:16px; top:11px; }
.shell-brand-symbol i:nth-child(2) { left:12px; top:2px; }
.shell-brand-symbol i:nth-child(3) { left:22px; height:14px; top:6px; }
.shell-header-center { justify-self:center; min-width:0; }
.shell-experience-switch { display:flex; align-items:center; gap:4px; padding:4px; border:1px solid #dfe6f1; border-radius:13px; background:#f3f6fb; }
.shell-experience-switch a { display:flex; align-items:center; justify-content:center; gap:6px; min-width:112px; height:34px; padding:0 15px; border-radius:9px; color:#728199!important; font-size:12px; font-weight:650; white-space:nowrap; transition:background .25s,box-shadow .25s,color .25s; }
.shell-experience-switch a.is-active { color:#2f63f2!important; background:#fff; box-shadow:0 3px 10px rgba(33,66,131,.09); }
.shell-experience-switch a:hover { color:#2f63f2!important; }
.shell-experience-switch i { font-style:normal; font-size:13px; }
.shell-header-tools { display:flex; align-items:center; justify-content:flex-end; gap:10px; min-width:0; }
.shell-reset-button,.shell-replay-button { flex:0 0 auto; min-height:32px; padding:0 10px; border:1px solid #dce5f1; border-radius:9px; color:#78869d; background:transparent; cursor:pointer; font:500 11px/1.4 Inter,"PingFang SC",sans-serif; white-space:nowrap; transition:background .2s,color .2s; }
.shell-reset-button:hover,.shell-replay-button:hover { color:#2f63f2; background:#edf3ff; }
.shell-reset-button[data-armed="true"] { border-color:#efc3ab; color:#b77345; background:#fff7f1; }
.shell-phase-detail { color:#8190a5; font-size:10px; white-space:nowrap; }
.shell-onboarding-progress { display:flex; align-items:center; gap:12px; white-space:nowrap; }
.shell-onboarding-progress > small { margin-right:4px; color:#8a98ad; font-size:11px; }
.shell-onboarding-progress > span { display:flex; align-items:center; gap:7px; color:#9ca9bb; font-size:12px; }
.shell-onboarding-progress > span > i { display:grid; place-items:center; width:25px; height:25px; border:1px solid #dce5f1; border-radius:50%; color:#9aa9bd; font-size:11px; font-style:normal; }
.shell-onboarding-progress > b { width:30px; height:1px; background:#dce5f1; }
.shell-onboarding-progress .is-current { color:#2f63f2; font-weight:650; }
.shell-onboarding-progress .is-current > i { border-color:#2f63f2; color:#fff; background:#2f63f2; box-shadow:0 0 0 4px #eef3ff; }
.shell-onboarding-progress .is-complete { color:#506885; }
.shell-onboarding-progress .is-complete > i { border-color:#d3eee6; color:#14a673; background:#ecf9f4; }
.shell-account { position:relative; flex:0 0 auto; color:#344258; font:400 12px/1.5 Inter,"PingFang SC","Microsoft YaHei",sans-serif; letter-spacing:0; text-align:left; }
.shell-account summary { display:flex; align-items:center; gap:10px; padding:4px 3px 4px 6px; border-radius:12px; cursor:pointer; list-style:none; }
.shell-account summary::-webkit-details-marker { display:none; }
.shell-account summary:hover { background:#f3f6fc; }
.shell-account summary > i { margin-left:7px; color:#94a1b3; font-size:12px; font-style:normal; }
.shell-account-avatar { display:grid; place-items:center; flex:0 0 auto; width:38px; height:38px; border-radius:50%; color:#fff; background:linear-gradient(135deg,#7b73de,#6260cb); box-shadow:0 4px 12px rgba(96,93,199,.18); font-size:16px; font-weight:750; }
.shell-account-label { display:flex; flex-direction:column; gap:2px; }
.shell-account-label strong { display:block; max-width:120px; overflow:hidden; color:#334255; font-size:12px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.shell-account-label small { display:flex; align-items:center; gap:6px; color:#8c97a8; font-size:9px; white-space:nowrap; }
.shell-account-label small > span { max-width:95px; overflow:hidden; text-overflow:ellipsis; }
.shell-account-label em { padding:1px 5px; border:1px solid #dceaff; border-radius:3px; color:#428bea; background:#f0f7ff; font-size:9px; font-style:normal; }
.shell-account-menu { position:absolute; top:calc(100% + 12px); right:0; z-index:710; width:250px; padding:8px; border:1px solid #dce5f0; border-radius:15px; background:#fff; box-shadow:0 18px 55px rgba(36,63,118,.16); animation:shell-menu-arrive .18s ease both; }
.shell-account-intro { display:flex; flex-direction:column; gap:3px; margin:0 5px 5px; padding:10px 5px 13px; border-bottom:1px solid #e9edf4; }
.shell-account-intro strong { color:#35445a; font-size:12px; font-weight:700; }
.shell-account-intro small { overflow-wrap:anywhere; color:#8593a7; font-size:10px; }
.shell-account-menu button { display:flex; align-items:center; justify-content:space-between; width:100%; height:37px; padding:0 11px; border:0; border-radius:8px; color:#596981; background:transparent; cursor:pointer; font:500 12px Inter,"PingFang SC",sans-serif; text-align:left; }
.shell-account-menu button:hover { color:#2f63f2; background:#f0f5ff; }
.shell-account-menu button > span { color:#9caabd; }
.shell-account-menu dl { margin:5px 0; padding:8px 11px; border-radius:8px; background:#f6f8fc; }
.shell-account-menu dl div { display:flex; justify-content:space-between; gap:12px; margin:5px 0; font-size:10px; }
.shell-account-menu dt { flex:0 0 auto; color:#8a97aa; }
.shell-account-menu dd { margin:0; overflow-wrap:anywhere; color:#465974; text-align:right; }
.shell-account-menu .shell-signout { color:#7e7184; }
.shell-sidebar { position:fixed; inset:var(--shell-header-height) auto 0 0; z-index:30; display:flex; flex-direction:column; width:var(--shell-nav-width); padding:27px 14px 20px; border-right:1px solid #dfe7f2; background:linear-gradient(168deg,#fcfdff 12%,#f3f7ff 76%,#edfafc); }
.shell-sidebar-heading { display:flex; align-items:center; gap:9px; padding:0 15px 21px; color:#577393; }
.shell-sidebar-heading > span { color:#2f63f2; font-size:17px; }
.shell-sidebar-heading small { font-size:11px; font-weight:700; letter-spacing:.06em; }
.shell-sidebar-heading > i { width:5px; height:5px; margin-left:auto; border-radius:50%; background:#16c3e0; box-shadow:0 0 9px rgba(22,195,224,.5); }
.shell-sidebar nav { display:flex; flex-direction:column; gap:7px; }
.shell-sidebar nav > a { position:relative; display:flex; align-items:center; gap:12px; min-height:47px; padding:0 15px; overflow:hidden; border:1px solid transparent; border-radius:13px; color:#65748b; font-size:13px; font-weight:550; text-decoration:none; transition:color .25s,background .25s,transform .25s; }
.shell-sidebar nav > a > i { display:grid; place-items:center; flex:0 0 20px; color:#8498b6; font-size:19px; font-style:normal; }
.shell-sidebar nav > a > span { position:static; display:block; opacity:1; transform:none; white-space:nowrap; }
.shell-sidebar nav > a > b { margin-left:auto; color:#7d9bed; font-size:12px; font-weight:400; opacity:0; transition:opacity .2s; }
.shell-sidebar nav > a[data-ai-nav="analysis"] { margin-top:21px; }
.shell-sidebar nav > a[data-ai-nav="analysis"]::before { position:absolute; inset:-13px 15px auto; height:1px; background:#dfe7f2; content:""; }
.shell-sidebar nav > a:hover { color:#2f63f2; background:#eef4ff; transform:translateX(2px); }
.shell-sidebar nav > a.is-active { border-color:#d9e5ff; color:#2f63f2; background:linear-gradient(100deg,#eaf0ff,#f1f8ff); box-shadow:0 5px 18px rgba(54,104,215,.055); font-weight:750; }
.shell-sidebar nav > a.is-active > i { color:#2f63f2; }
.shell-sidebar nav > a.is-active > b { opacity:1; }
.shell-sidebar-foot { display:flex; align-items:center; gap:8px; margin-top:auto; padding:20px 13px 0; color:#93a1b7; font-size:9px; }
.shell-sidebar-foot > i { width:5px; height:5px; border-radius:50%; background:#14a673; }
.shell-menu-toggle { display:none; }
.shell-header [hidden],.shell-sidebar[hidden],.shell-account [hidden],.admin-sidebar[hidden],.preview-console [hidden] { display:none!important; }
.has-merchant-shell .merchant-main { padding:var(--shell-header-height) 0 0; }
.has-merchant-shell.shell-operate .merchant-main { padding-left:var(--shell-nav-width); }
.has-merchant-shell .scene-hub-main { margin-left:0; padding-left:32px; }
.has-merchant-shell.shell-operate .scene-hub-main { margin-left:var(--shell-nav-width); }
.has-merchant-shell .task-scene { overflow:auto; scrollbar-width:thin; scrollbar-color:#dce5f4 transparent; }
.has-merchant-shell .task-scene__body { grid-template-columns:minmax(260px,.74fr) minmax(0,1.26fr); gap:clamp(20px,3vw,46px); }
.has-merchant-shell .product-task-layout,.has-merchant-shell .growth-layout { grid-template-columns:minmax(250px,.67fr) minmax(0,1.33fr); gap:clamp(22px,2.4vw,40px); }
.has-merchant-shell .product-task-layout > *,.has-merchant-shell .growth-layout > *,.has-merchant-shell .task-scene__body > * { min-width:0; }
.has-merchant-shell.shell-operate .task-copy > h1,.has-merchant-shell.shell-operate .product-task-copy > h1,.has-merchant-shell.shell-operate .growth-copy > h1 { font-size:clamp(34px,2.78vw,50px); }
.shell-traditional { --admin-sidebar:var(--shell-nav-width); }
.shell-traditional .admin-sidebar { top:var(--shell-header-height); }
.shell-traditional .admin-sidebar-caption { height:53px; padding:22px 27px 9px; color:#95a0b0; font-size:10px; font-weight:600; letter-spacing:.06em; }
.shell-traditional .admin-nav { height:calc(100svh - var(--shell-header-height) - 53px); }
.shell-traditional .admin-main { padding-top:94px; }
.shell-storefront .preview-console { display:flex; align-items:center; gap:20px; height:72px; color:#485d79; background:rgba(255,255,255,.96); }
.shell-storefront .preview-console .preview-back { flex:0 0 auto; color:#60728c; }
.shell-storefront .preview-console .preview-back span { border-color:#dce5f2; color:#557199; }
.shell-storefront .preview-status { margin-left:auto; }
.shell-storefront .preview-devices { position:static; margin-left:auto; border-color:#dce5f1; }
.shell-storefront .preview-actions { margin-left:auto; }
.shell-storefront .preview-next { flex:0 0 auto; }
.shell-storefront .preview-actions > [data-shell-account] { margin-left:10px; }
.shell-storefront .storefront-stage { padding-top:72px; }
.shell-storefront .product-detail,.shell-storefront .cart-drawer,.shell-storefront .checkout-flow,.shell-storefront .store-mobile-panel { top:72px; }
@keyframes shell-menu-arrive { from { opacity:0; transform:translateY(-5px); } to { opacity:1; transform:none; } }
@media(max-width:1390px) {
  .shell-header { padding-inline:20px; gap:16px; }
  .shell-phase-detail { display:none; }
  .shell-onboarding-progress { gap:9px; }
  .shell-onboarding-progress > small { display:none; }
  .has-merchant-shell.shell-operate .task-scene { padding-inline:24px; }
  .has-merchant-shell.shell-operate .product-task-layout,.has-merchant-shell.shell-operate .growth-layout { grid-template-columns:minmax(240px,.66fr) minmax(0,1.34fr); gap:22px; }
}
@media(max-width:1190px) {
  .shell-header { grid-template-columns:1fr auto 1fr; gap:12px; padding-inline:16px; }
  .shell-account-label small > span { max-width:72px; }
  .shell-onboarding-progress > b { width:18px; }
  .shell-replay-button { display:none; }
  .has-merchant-shell.shell-operate.task-body { overflow:auto; }
  .has-merchant-shell.shell-operate .task-main { height:auto; }
  .has-merchant-shell.shell-operate .task-scene { height:auto; min-height:calc(100svh - 72px); overflow:visible; padding-bottom:35px; }
  .has-merchant-shell.shell-operate .product-task-layout,.has-merchant-shell.shell-operate .growth-layout,.has-merchant-shell.shell-operate .task-scene__body { grid-template-columns:1fr; align-items:start; gap:25px; }
  .has-merchant-shell.shell-operate .product-task-copy,.has-merchant-shell.shell-operate .growth-copy,.has-merchant-shell.shell-operate .task-copy { max-width:100%; }
  .has-merchant-shell.shell-operate .task-copy > h1,.has-merchant-shell.shell-operate .product-task-copy > h1,.has-merchant-shell.shell-operate .growth-copy > h1 { margin:16px 0 12px; font-size:42px; }
  .has-merchant-shell.shell-operate .task-scene__head { grid-template-columns:1fr auto; }
  .has-merchant-shell.shell-operate .task-phase-rail { display:none; }
}
@media(max-width:920px) {
  .shell-header { grid-template-columns:auto 1fr auto; gap:10px; }
  .shell-brand strong { font-size:17px; }
  .shell-brand > span:last-child { gap:8px; }
  .shell-brand small { padding-left:8px; font-size:11px; }
  .shell-account-label { display:none; }
  .shell-account summary { gap:2px; }
  .shell-experience-switch a { min-width:91px; padding-inline:10px; }
  .shell-onboarding-progress { gap:7px; }
  .shell-onboarding-progress > span { gap:5px; font-size:10px; }
  .shell-onboarding-progress > span > i { width:22px; height:22px; }
  .has-merchant-shell .task-scene__body { grid-template-columns:1fr; }
  .shell-traditional .admin-nav span,.shell-traditional .admin-nav b,.shell-traditional .admin-nav em { display:block; }
  .shell-traditional .admin-nav > a,.shell-traditional .admin-nav-group > button { justify-content:flex-start; padding:0 11px; }
  .shell-traditional .admin-subnav { padding-left:16px; }
  .shell-traditional .admin-subnav a { justify-content:flex-start; padding:0 9px; }
  .shell-storefront .preview-console { gap:10px; padding-inline:12px; }
  .shell-storefront .preview-status { display:none; }
}
@media(max-width:700px) {
  .shell-header { gap:8px; padding:0 13px; }
  .shell-brand-symbol { transform:scale(.87); transform-origin:left center; width:26px; }
  .shell-brand { gap:6px; }
  .shell-brand > span:last-child { display:flex; flex-direction:column; align-items:flex-start; gap:0; }
  .shell-brand strong { font-size:15px; }
  .shell-brand small { padding:0; border:0; font-size:9px; }
  .shell-header-tools { gap:5px; }
  .shell-reset-button { min-height:29px; padding-inline:7px; font-size:9px; }
  .shell-account-avatar { width:31px; height:31px; font-size:14px; }
  .shell-account summary > i { display:none; }
  .shell-onboarding-progress { gap:6px; }
  .shell-onboarding-progress > span { flex-direction:column; gap:2px; font-size:9px; }
  .shell-onboarding-progress > b { width:16px; }
  .shell-onboarding-progress > span > i { width:20px; height:20px; font-size:9px; }
  .shell-operate .shell-header { grid-template-columns:auto auto 1fr auto; }
  .shell-operate .shell-brand small { display:none; }
  .shell-operate .shell-brand-symbol { display:none; }
  .shell-menu-toggle { display:flex; align-items:center; justify-content:center; gap:4px; height:33px; padding:0 7px; border:1px solid #dce5f2; border-radius:8px; color:#607897; background:#fff; font:600 10px Inter,"PingFang SC",sans-serif; cursor:pointer; }
  .shell-menu-toggle > i { font-style:normal; }
  .shell-experience-switch { padding:3px; gap:2px; border-radius:10px; }
  .shell-experience-switch a { min-width:69px; height:29px; padding:0 8px; font-size:10px; }
  .shell-experience-switch i { display:none; }
  .shell-operate .shell-reset-button { display:none; }
  .shell-sidebar,.shell-traditional .admin-sidebar { z-index:600; width:208px; transform:translateX(-101%); transition:transform .25s ease; box-shadow:12px 0 30px rgba(33,60,111,.1); }
  .shell-menu-open .shell-sidebar,.shell-menu-open.shell-traditional .admin-sidebar { transform:translateX(0); }
  .has-merchant-shell.shell-operate .merchant-main { padding-left:0; padding-bottom:0; }
  .has-merchant-shell.shell-operate .scene-hub-main { margin-left:0; }
  .shell-traditional .admin-main { margin-left:0; padding-top:91px; }
  .has-merchant-shell .scene-hub-main { padding-left:16px; }
  .has-merchant-shell.shell-operate .task-scene { padding-inline:16px; }
  .has-merchant-shell.shell-operate .ai-run-layout { grid-template-columns:1fr; }
  .has-merchant-shell.shell-operate .ai-run-layout > :last-child { grid-column:auto; }
  .shell-storefront .preview-devices { display:none; }
  .shell-storefront .preview-console .preview-back b { display:block; font-size:10px; }
  .shell-storefront .preview-actions { gap:6px; }
  .shell-storefront .preview-actions > [data-shell-account] { margin-left:0; }
  .shell-storefront .preview-reset { font-size:8px; }
}
@media(prefers-reduced-motion:reduce) { .shell-sidebar,.shell-sidebar nav>a,.shell-account-menu { animation:none; transition:none; } }