/* DIRECT Business: the product brand, shared by the manager and both studios.
   Keep restaurant branding inside the shop preview; never recolor the guest shop. */
body[data-surface=manager]{background:var(--dm-warning-bg,#f6f6f4)}
body.peak-business-preview{--preview-height:44px}
#peak-app[data-surface=manager],body[data-surface=manager] .pc-dialog{
 --accent:#151714;--brand-deep:#151714;--gold:#d8ff36;--ink:#151714;
 --muted:#62675e;--line:#e2e5dc;--canvas:#f6f6f4;--soft:#f0f1ee;
 font-family:"Helvetica Neue",Arial,sans-serif;color:var(--ink);font-size:14px;
}
#peak-app[data-surface=manager] :is(h1,h2,h3,h4){font-weight:750;letter-spacing:-.035em}
#peak-app[data-surface=manager] :is(input,select,textarea){font-size:14px}
#peak-app[data-surface=manager] :is(button,input,select){min-height:44px}
#peak-app[data-surface=manager] button{font-size:13px}
#peak-app[data-surface=manager] button:hover{border-color:var(--dm-line,#a3aa99);background:var(--dm-subtle,#eef1e7)}
#peak-app[data-surface=manager] :focus-visible{outline:3px solid #697e06;outline-offset:3px}
#peak-app[data-surface=manager] #manager-body{outline:none}
#peak-app[data-surface=manager] .manager-layout{background:var(--canvas)}
#peak-app[data-surface=manager] .manager-sidebar{
 width:250px;padding:28px 18px 18px;background:#151714;color:#f6f6f4;
 border-right:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#565b50 #151714;
}
#peak-app[data-surface=manager] .manager-brand.business-brand{
 display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;justify-content:flex-start;
 gap:8px;width:100%;padding:0;margin:0 0 26px;min-height:48px;
 border:0;background:transparent;color:white;text-align:left;
}
#peak-app[data-surface=manager] .business-brand img{width:44px;height:44px;flex:0 0 44px;filter:brightness(0) invert(1)}
#peak-app[data-surface=manager] .business-brand>.business-brand-name{font-family:inherit;font-style:normal;font-size:19px;font-weight:800;line-height:1.15;letter-spacing:-.75px;white-space:nowrap;color:white}
#peak-app[data-surface=manager] .business-brand small{display:block;margin-top:6px;font-size:9px;font-weight:500;letter-spacing:2.4px;color:#d8ff36}
#peak-app[data-surface=manager] .restaurant-switch{padding:14px 12px;margin-bottom:17px;border:1px solid #ffffff21;border-radius:12px;background:#ffffff06;gap:10px}
#peak-app[data-surface=manager] .restaurant-switch strong{font-size:14px;font-weight:700;color:white;overflow-wrap:anywhere}
#peak-app[data-surface=manager] .restaurant-switch small{font-size:10px;color:#aeb4a6;margin-top:4px}
#peak-app[data-surface=manager] .restaurant-switch>.icon{color:#d8ff36;flex-shrink:0}
#peak-app[data-surface=manager] .manager-sidebar nav{display:block}
#peak-app[data-surface=manager] .business-nav-group{margin-bottom:18px}
#peak-app[data-surface=manager] .sidebar-label{display:block;padding:0 12px;margin:18px 0 8px;font-size:9px;font-weight:600;letter-spacing:1.5px;color:#949c89}
#peak-app[data-surface=manager] .manager-sidebar nav button{display:flex;width:100%;justify-content:flex-start;gap:11px;text-align:left;padding:11px 12px;margin:3px 0;min-height:43px;background:transparent;border:0;border-radius:8px;font-size:12px;font-weight:500;color:#c5cbbd}
#peak-app[data-surface=manager] .manager-sidebar nav button .icon{width:17px;height:17px;opacity:.85}
#peak-app[data-surface=manager] .manager-sidebar nav button:hover{background:#ffffff0f;color:white}
#peak-app[data-surface=manager] .manager-sidebar nav :is(button[aria-current=page],button.is-active-parent){background:#d8ff36;color:#151714;font-weight:750}
#peak-app[data-surface=manager] .manager-sidebar nav button b{margin-left:auto;padding:2px 6px;min-width:20px;border-radius:5px;background:#d8ff36;color:#151714;font-size:10px}
#peak-app[data-surface=manager] .manager-sidebar nav button[aria-current=page] b{background:#151714;color:#d8ff36}
#peak-app[data-surface=manager] .manager-sidebar :focus-visible{outline-color:#d8ff36}
#peak-app[data-surface=manager] .sidebar-bottom{margin-top:auto;border-top:1px solid #ffffff1a;padding:16px 4px 0}
#peak-app[data-surface=manager] .sidebar-bottom>button,#peak-app[data-surface=manager] .sidebar-bottom>a{padding:10px 2px;min-height:40px;justify-content:flex-start;border:0;background:none;color:#c2c9b8;font-size:11px}
#peak-app[data-surface=manager] .manager-account{border-color:#ffffff1a}
#peak-app[data-surface=manager] .manager-account strong{color:white;font-size:12px}
#peak-app[data-surface=manager] .manager-account small{color:#a5ad9b;font-size:10px}
#peak-app[data-surface=manager] .manager-account .avatar{background:#30342a;color:#d8ff36}
#peak-app[data-surface=manager] .manager-workspace{width:calc(100% - 250px);margin-left:250px;min-width:0;background:var(--canvas)}
#peak-app[data-surface=manager] .manager-topbar{height:72px;padding:0 36px;background:var(--dm-surface,#fff);border-bottom:1px solid var(--line);font-size:12px}
#peak-app[data-surface=manager] .manager-topbar .connection{font-size:11px}
#peak-app[data-surface=manager] .manager-main{width:100%;max-width:1510px;margin-inline:auto;padding:34px 36px 20px}
#peak-app[data-surface=manager] .page-heading{gap:22px;margin-bottom:28px;align-items:flex-end}
#peak-app[data-surface=manager] .page-heading .eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:700}
#peak-app[data-surface=manager] .page-heading h1{font-size:clamp(32px,3.1vw,46px);line-height:1.08;font-weight:800;letter-spacing:-1.7px;color:var(--dm-text,#151714);margin:12px 0}
#peak-app[data-surface=manager] .page-heading p{font-size:14px;line-height:1.65;max-width:650px;color:var(--dm-muted,#62675e)}
#peak-app[data-surface=manager] .page-actions{flex-wrap:wrap}
#peak-app[data-surface=manager] .page-actions :is(button,select){font-size:12px;min-height:42px}
#peak-app[data-surface=manager] [data-section=overview]>.page-heading{padding:30px 32px;border-radius:18px;background:#151714;color:white;align-items:flex-end}
#peak-app[data-surface=manager] [data-section=overview]>.page-heading h1{font-size:clamp(36px,3.8vw,54px);color:white;letter-spacing:-2px;line-height:1.03}
#peak-app[data-surface=manager] .business-heading-accent{color:#d8ff36}
#peak-app[data-surface=manager] [data-section=overview]>.page-heading .eyebrow{color:#b8c0aa}
#peak-app[data-surface=manager] [data-section=overview]>.page-heading p{color:#b8c0aa;max-width:480px;font-size:13px}
#peak-app[data-surface=manager] [data-section=overview]>.page-heading .page-actions{flex-direction:column;align-items:stretch}
#peak-app[data-surface=manager] [data-section=overview]>.page-heading .page-actions button:not(.primary){background:transparent;border-color:#ffffff30;color:white}
#peak-app[data-surface=manager] .manager-main .panel{background:var(--dm-surface,white);border:1px solid var(--line);border-radius:14px;box-shadow:none}
#peak-app[data-surface=manager] .manager-main .panel h2{font-size:22px;line-height:1.2;font-weight:750;letter-spacing:-.65px}
#peak-app[data-surface=manager] .section-heading p{font-size:12px;line-height:1.55}
#peak-app[data-surface=manager] .metric{padding:22px;background:var(--dm-surface,white);border:1px solid var(--line);border-radius:14px;box-shadow:none}
#peak-app[data-surface=manager] .metric>strong{font-size:clamp(28px,2.7vw,40px);font-weight:750;letter-spacing:-1.5px;line-height:1.15;color:var(--dm-text,#151714);font-variant-numeric:tabular-nums}
#peak-app[data-surface=manager] .metric-head span{font-size:12px;color:var(--dm-muted,#62675e)}
#peak-app[data-surface=manager] .metric-head .icon{color:var(--dm-muted,#6d785c)}
#peak-app[data-surface=manager] .metric>small{font-size:10px;color:var(--dm-muted,#737a69)}
#peak-app[data-surface=manager] button.primary{background:var(--dm-raised,#d8ff36);border-color:var(--dm-line,#d8ff36);color:var(--dm-text,#151714);font-weight:750}
#peak-app[data-surface=manager] button.primary:hover{background:var(--dm-raised,#c9ee2a);border-color:var(--dm-line,#c9ee2a)}
#peak-app[data-surface=manager] :is(.tag,.pill){border-radius:20px;font-size:11px}
#peak-app[data-surface=manager] .manager-footer{padding:24px 36px;font-size:10px;color:var(--dm-muted,#737a69);gap:14px;flex-wrap:wrap}
#peak-app[data-surface=manager] .business-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}
#peak-app[data-surface=manager] .business-shortcuts button{min-width:0;white-space:normal;justify-content:flex-start;text-align:left;gap:16px;padding:24px;border:1px solid var(--line);border-radius:14px;background:#d8ff36;border-color:#d8ff36}
#peak-app[data-surface=manager] .business-shortcuts button:nth-child(2){background:#fff;border-color:#e2e5dc}
#peak-app[data-surface=manager] .business-shortcuts button:hover{border-color:#8a9a63;background:#c9ee2a}
#peak-app[data-surface=manager] .business-shortcut-mark{display:grid;place-items:center;width:44px;height:44px;flex:0 0 44px;background:#151714;border-radius:12px;color:#d8ff36}
#peak-app[data-surface=manager] .business-shortcut-mark .icon{width:23px;height:23px}
#peak-app[data-surface=manager] .business-shortcuts button>span:nth-child(2){flex:1;min-width:0}
#peak-app[data-surface=manager] .business-shortcuts small{display:block;font-size:9px;font-weight:700;letter-spacing:1.4px;color:#62675e}
#peak-app[data-surface=manager] .business-shortcuts strong{display:block;margin:7px 0;font-size:20px;line-height:1.15;font-weight:750;letter-spacing:-.6px;color:#151714}
#peak-app[data-surface=manager] .business-shortcuts em{font-size:11px;font-style:normal;font-weight:400;color:#62675e}
#peak-app[data-surface=manager] .business-shortcuts button>.icon{width:18px;flex-shrink:0}
/* Both studios and the campaign dialog share the manager's type and controls. */
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-studio{--pc-ink:var(--dm-text,#151714);--pc-muted:var(--dm-muted,#62675e);--pc-line:var(--dm-line,#e2e5dc);--pc-paper:var(--dm-surface,#fff);font-family:"Helvetica Neue",Arial,sans-serif}
#peak-app[data-surface=manager] .ps-studio{--ps-ink:var(--dm-text,#151714);--ps-line:var(--dm-line,#e2e5dc);font-size:14px}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) :is(.pc-intro h2,.ps-heading h2){font-size:clamp(36px,4vw,54px);line-height:1.04;font-weight:800;letter-spacing:-1.8px}
#peak-app[data-surface=manager] :is(.pc-intro em,.ps-heading em){font-style:normal;font-weight:inherit;color:var(--dm-text,#151714);box-shadow:inset 0 -.3em #d8ff36}
#peak-app[data-surface=manager] :is(.pc-card h3,.ps-card h3){font-size:24px;line-height:1.15;font-weight:750;letter-spacing:-.7px}
#peak-app[data-surface=manager] :is(.pc-profile,.pc-plan,.ps-card){background:var(--dm-surface,white)}
#peak-app[data-surface=manager] :is(.pc-intro-note,.pc-message,.pc-date,.ps-badge,.ps-upload){background:var(--dm-subtle,#edf2df)}
#peak-app[data-surface=manager] .pc-intro-note>span{font-weight:700;color:var(--dm-text,#151714)}
#peak-app[data-surface=manager] .pc-art{background:#e9eddf;color:#151714}
#peak-app[data-surface=manager] .pc-sage{background:#d8ff36}
#peak-app[data-surface=manager] .pc-rose{background:#151714;color:#d8ff36}
#peak-app[data-surface=manager] .pc-peach{background:#e9ebef}
#peak-app[data-surface=manager] .pc-butter{background:#d8ff36}
#peak-app[data-surface=manager] .pc-art>b{font-weight:750}
#peak-app[data-surface=manager] .pc-tabs button[aria-pressed=true]{border-color:var(--dm-line,#151714)}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) :is(.pc-studio .pc-primary,.pc-profile button,.ps-studio .ps-primary){background:var(--dm-raised,#d8ff36);color:var(--dm-text,#151714);border-color:var(--dm-line,#d8ff36);font-weight:700}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) :is(.pc-studio .pc-primary,.ps-studio .ps-primary):hover{background:var(--dm-raised,#c9ee2a);border-color:var(--dm-line,#c9ee2a)}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-studio :focus-visible{outline-color:var(--dm-line,#697e06)}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-dialog{background:var(--dm-subtle,#f6f6f4);color:var(--dm-text,#151714)}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-dialog-top{background:var(--dm-surface,white)}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-dialog-top h2{font-size:30px;font-weight:750;letter-spacing:-1px}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-editor-preview h3{font-size:22px;font-weight:700}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) :is(.pc-message,.pc-budget){background:var(--dm-subtle,#e9eddf)}
:is(#peak-app[data-surface=manager],body[data-surface=manager]) .pc-message>strong{font-size:20px;font-weight:750}
#peak-app[data-surface=manager] .pc-studio details{border:0;padding:0}
#peak-app[data-surface=manager] .ps-studio .ps-rights{flex-direction:row}
#peak-app[data-surface=manager] .ps-studio input[type=color]{width:36px;max-width:36px;height:38px;min-height:38px;padding:2px}
#peak-app[data-surface=manager] .ps-upload input{max-width:180px;font-size:11px;padding:3px;border:0}
#peak-app[data-surface=manager] .ps-preview-toolbar button{display:inline-flex;min-height:38px}
#peak-app[data-surface=manager] .ps-device{border-color:#151714}
#peak-app[data-surface=manager] .ps-hero h3{color:inherit;font-size:31px;line-height:1.08;font-weight:750}
#peak-app[data-surface=manager] .ps-hero h3 em{font-style:normal;font-weight:inherit}
#peak-app[data-surface=manager] .ps-menu h4{font-size:22px;font-weight:750}
#peak-app[data-surface=manager] .ps-food p{font-size:9px;margin:5px 0}
#peak-app[data-surface=manager] .ps-shop-header small{font-size:7px}
#peak-app[data-surface=manager] .ps-menu>small{font-size:8px}
#peak-app[data-surface=manager] .preview-bar{height:44px;background:var(--dm-warning-bg,#ebede7);border-color:var(--dm-line,#dfe2d8);color:var(--dm-warning,#4b5044);font-size:9px;letter-spacing:.5px}
#peak-app[data-surface=manager] .preview-caption{font-size:10px}
#peak-app[data-surface=manager] .preview-switch{position:static;transform:none;left:auto;background:var(--dm-warning-bg,#dce3ce)}
#peak-app[data-surface=manager] .preview-switch button{min-height:30px;font-size:10px}
#peak-app[data-surface=manager] .preview-role-switch{font-size:10px}
#peak-app[data-surface=manager] .preview-role-switch select{min-height:30px;font-size:11px}
#peak-app[data-surface=manager] .preview-info{min-height:30px}
.business-preview-links{position:fixed;bottom:16px;right:20px;z-index:60}
.business-preview-links a{display:block;padding:9px 13px;font:11px "Helvetica Neue",Arial,sans-serif;background:var(--dm-warning-bg,white);border:1px solid var(--dm-line,#e2e5dc);border-radius:20px;color:var(--dm-warning,#151714);text-decoration:none}
#peak-app[data-surface=manager] :is(.manager-nav-close,.manager-nav-backdrop){display:none}
@media(min-width:901px){#peak-app[data-surface=manager] .manager-sidebar{transform:none}#peak-app[data-surface=manager] .manager-menu-toggle{display:none}}
@media(max-width:1200px){
 #peak-app[data-surface=manager] .manager-main{padding:26px}
 #peak-app[data-surface=manager] .manager-topbar{padding:0 26px}
 #peak-app[data-surface=manager] .business-shortcuts button{padding:20px;gap:12px}
 #peak-app[data-surface=manager] .business-shortcut-mark{display:none}
 #peak-app[data-surface=manager] .metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
 #peak-app[data-surface=manager] [data-section=overview]>.page-heading{flex-wrap:wrap}
 #peak-app[data-surface=manager] [data-section=overview]>.page-heading .page-actions{flex-direction:row}
 #peak-app[data-surface=manager] .preview-caption{display:none}
}
@media(max-width:900px){
 body.peak-nav-open{overflow:hidden}
 #peak-app[data-surface=manager] .manager-sidebar{width:272px;max-width:calc(100vw - 48px);z-index:110;transform:translateX(-100%);transition:transform .2s ease;box-shadow:12px 0 40px #15171422;padding-top:52px}
 #peak-app[data-surface=manager] .manager-sidebar.nav-open{transform:translateX(0)}
 #peak-app[data-surface=manager] .manager-nav-close{display:inline-flex;position:absolute;top:8px;right:12px;min-height:36px;width:36px;padding:8px;background:transparent;border:0;color:var(--dm-on-strong,white)}
 #peak-app[data-surface=manager] .manager-nav-backdrop:not([hidden]){display:block;position:fixed;inset:var(--preview-height,0px) 0 0;width:100%;height:auto;z-index:105;border:0;border-radius:0;background:#15171480;cursor:default}
 #peak-app[data-surface=manager] .manager-workspace{margin-left:0;width:100%}
 #peak-app[data-surface=manager] .manager-menu-toggle{display:inline-flex}
 #peak-app[data-surface=manager] .manager-main{padding:24px}
 #peak-app[data-surface=manager] .business-shortcut-mark{display:grid}
}
@media(max-width:600px){
 #peak-app[data-surface=manager] .manager-main{padding:20px 16px}
 #peak-app[data-surface=manager] .manager-topbar{height:60px;padding:0 16px;gap:8px}
 #peak-app[data-surface=manager] .manager-topbar>span{font-size:11px}
 #peak-app[data-surface=manager] .topbar-actions .connection{display:none}
 #peak-app[data-surface=manager] .page-heading h1{font-size:34px}
 #peak-app[data-surface=manager] [data-section=overview]>.page-heading{padding:24px;border-radius:14px;gap:18px}
 #peak-app[data-surface=manager] [data-section=overview]>.page-heading h1{font-size:38px;letter-spacing:-1.7px}
 #peak-app[data-surface=manager] .metric{padding:17px}
 #peak-app[data-surface=manager] .metric>strong{font-size:30px}
 #peak-app[data-surface=manager] .business-shortcuts{grid-template-columns:1fr;gap:12px;margin:18px 0}
 #peak-app[data-surface=manager] .business-shortcuts button{padding:19px}
 #peak-app[data-surface=manager] .business-shortcuts strong{font-size:20px}
 #peak-app[data-surface=manager] .manager-footer{padding:20px 16px}
 #peak-app[data-surface=manager] .preview-bar{padding:0 10px;gap:6px;font-size:8px}
 #peak-app[data-surface=manager] .preview-switch button{font-size:9px;padding:3px 7px}
 #peak-app[data-surface=manager] :is(.pc-intro h2,.ps-heading h2){font-size:40px;letter-spacing:-1.5px}
 #peak-app[data-surface=manager] .ps-heading{gap:10px;flex-wrap:wrap}
 .business-preview-links{display:none}
}
@media(prefers-reduced-motion:reduce){#peak-app[data-surface=manager] *{scroll-behavior:auto;transition:none}}

/* Less-used operations stay one click away, below the customer's daily work. */
#peak-app[data-surface=manager] .manager-sidebar .business-nav-more{border:0;border-top:1px solid #ffffff1a;border-radius:0;padding:12px 0 0;margin:10px 0 18px;background:transparent}
#peak-app[data-surface=manager] .business-nav-more summary{display:flex;align-items:center;gap:10px;padding:12px;min-height:44px;cursor:pointer;list-style:none;font-size:12px;font-weight:600;color:#c5cbbd}
#peak-app[data-surface=manager] .business-nav-more summary::-webkit-details-marker{display:none}
#peak-app[data-surface=manager] .business-nav-more summary .icon{width:16px;height:16px;flex-shrink:0}
#peak-app[data-surface=manager] .business-nav-more summary .icon:last-child{margin-left:auto;transition:transform .15s}
#peak-app[data-surface=manager] .business-nav-more[open] summary .icon:last-child{transform:rotate(90deg)}
#peak-app[data-surface=manager] .business-nav-more summary:hover{color:white;background:#ffffff0a;border-radius:8px}
#peak-app[data-surface=manager] .business-nav-more>div{padding-top:8px}
