.cloud-header { display:flex; align-items:center; gap:14px; min-width:0; }
.cloud-status { display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--muted); max-width:260px; line-height:1.4; }
.cloud-status .icon { width:18px; height:18px; flex-shrink:0; }
.cloud-status-online { color:var(--teal); }
.cloud-status-error { color:var(--red); }
.cloud-status-example { color:#926715; }
.cloud-account-button { gap:8px; min-width:77px; }
.cloud-avatar { display:inline-grid; place-items:center; width:29px; height:29px; flex:0 0 auto; border-radius:50%; background:#eaf0fe; color:var(--blue); font-size:13px; font-weight:700; }
.cloud-mark { display:grid; place-items:center; flex:0 0 auto; width:46px; height:46px; border-radius:12px 12px 17px 12px; background:#edf2ff; color:var(--blue); }
.cloud-mark .icon { width:27px; height:27px; }
#cloud-settings,.cloud-settings-panel { grid-column:1 / -1; }
.cloud-settings-title { display:flex; gap:13px; align-items:center; }
.cloud-settings-title p { font-size:13px; color:var(--muted); margin-top:4px; overflow-wrap:anywhere; }
.cloud-settings-status { display:flex; align-items:center; flex-wrap:wrap; gap:8px 22px; margin:18px 0; }
.cloud-settings-status > span:last-child:not(.cloud-status) { color:var(--muted); font-size:12px; }
#cloud-dialog { width:min(610px,calc(100% - 40px)); padding:30px; }
.cloud-dialog-heading { margin-bottom:26px; }
.cloud-product { display:block; font-size:12px; color:var(--blue); font-weight:650; margin-bottom:5px; }
.cloud-intro { display:grid; grid-template-columns:46px 1fr; gap:8px 14px; margin-bottom:22px; }
.cloud-intro .cloud-mark { grid-row:1 / 3; }
.cloud-intro h3 { font-size:19px; letter-spacing:-.35px; }
.cloud-intro p,.cloud-lead { color:#53677f; font-size:14px; line-height:1.7; }
.cloud-intro > p { grid-column:2; }
#cloud-dialog form { margin-top:22px; }
#cloud-dialog label { font-size:14px; }
#cloud-dialog input { font-size:16px; min-height:50px; }
#cloud-dialog input:focus { border-color:var(--blue); }
#cloud-dialog .button.full { min-height:49px; }
#cloud-code { font-variant-numeric:tabular-nums; letter-spacing:.3em; font-size:23px; text-align:center; }
.cloud-auth-tools { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:5px; margin-top:12px; }
.cloud-privacy { color:var(--muted); font-size:12px; line-height:1.65; margin:16px 0 6px; }
.cloud-preview-notice,.cloud-preview-code { color:#6d5727; background:#fff8e9; border:1px solid #f0e1bd; border-radius:8px; padding:12px 14px; font-size:12px; line-height:1.6; margin-block:16px; }
.cloud-preview-code strong { display:inline-block; margin-left:8px; letter-spacing:.15em; font-size:18px; }
.cloud-preview-code span { display:block; }
.cloud-identity { display:flex; align-items:center; gap:12px; margin-bottom:18px; }
.cloud-identity .cloud-avatar { width:42px; height:42px; font-size:18px; }
.cloud-identity strong,.cloud-identity span:not(.cloud-avatar) { display:block; overflow-wrap:anywhere; }
.cloud-identity strong { font-size:16px; }
.cloud-identity > div > span { font-size:13px; color:var(--muted); margin-top:3px; }
.cloud-compare { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:22px 0; }
.cloud-counts { border-block:1px solid var(--line); padding:15px 0; margin-bottom:18px; }
.cloud-compare .cloud-counts { margin-bottom:0; }
.cloud-counts h3 { font-size:13px; margin-bottom:12px; }
.cloud-counts dl { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin:0; }
.cloud-counts dt { color:var(--muted); font-size:11px; }
.cloud-counts dd { margin:4px 0 0; color:var(--ink); font-variant-numeric:tabular-nums; font-size:23px; font-weight:650; }
.cloud-counts p { color:var(--muted); font-size:11px; margin-top:12px; }
.cloud-save-summary { border-left:3px solid var(--blue); padding:3px 0 3px 15px; margin:22px 0; }
.cloud-save-summary p,.cloud-cached p { color:var(--muted); font-size:13px; line-height:1.7; margin:6px 0 12px; }
.cloud-cached { padding:15px; border:1px solid var(--line); border-radius:9px; margin-block:18px; }
.cloud-buttons { display:flex; flex-wrap:wrap; gap:10px; margin-top:17px; }
.cloud-buttons .button { white-space:normal; }
.cloud-account-bottom { border-top:1px solid var(--line); margin-top:25px; padding-top:18px; }
.cloud-account-bottom > p { color:var(--muted); font-size:12px; line-height:1.7; }
#cloud-dialog .cloud-consent { display:flex; align-items:flex-start; gap:10px; margin-top:18px; font-size:12px; font-weight:400; line-height:1.65; }
#cloud-dialog .cloud-consent input { min-height:18px; width:18px; margin:2px 0 0; flex:0 0 auto; }
.cloud-error { color:var(--red); border:1px solid #efc4c5; border-radius:8px; background:#fff3f3; padding:12px 14px; font-size:13px; line-height:1.65; margin-top:20px; }
.cloud-offline { color:#6d5727; font-size:13px; margin-top:17px; line-height:1.6; }
.cloud-loading { color:var(--muted); font-size:14px; padding-block:30px; }
@media (max-width:760px) {
  .topbar { gap:10px; flex-wrap:wrap; }
  .cloud-header { gap:10px; }
  .cloud-status { font-size:11px; max-width:180px; }
}
@media (max-width:520px) {
  .topbar-actions { width:100%; justify-content:space-between; }
  .cloud-header { flex:1; justify-content:space-between; }
  .cloud-status { max-width:calc(100vw - 170px); }
  .cloud-account-button { min-width:73px; padding:9px 12px; }
  .cloud-account-label { display:none; }
  .cloud-account-button:has(.cloud-avatar) { min-width:44px; padding:6px; }
  #cloud-dialog { width:100%; max-height:calc(100dvh - 16px); padding:25px 20px calc(24px + env(safe-area-inset-bottom)); }
  .cloud-dialog-heading h2 { font-size:22px; }
  .cloud-compare { grid-template-columns:minmax(0,1fr); gap:0; }
  .cloud-counts h3 { font-size:14px; }
  .cloud-counts dt { font-size:12px; }
  .cloud-intro { grid-template-columns:1fr; }
  .cloud-intro .cloud-mark { grid-row:auto; margin-bottom:5px; }
  .cloud-intro > p { grid-column:auto; }
  .cloud-buttons > .button { flex:1 1 170px; }
}

.customer-shop-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-left:240px;padding:.65rem max(1rem,env(safe-area-inset-right));background:#102747;color:#fff;font:500 .875rem/1.4 system-ui,sans-serif;flex-wrap:wrap}.customer-shop-nav a{color:#fff;text-decoration:underline;text-underline-offset:.2em}.customer-shop-nav a:focus-visible{outline:3px solid #fff;outline-offset:4px}@media(max-width:760px){.customer-shop-nav{margin-left:0}}