body{background:var(--sn-soft2,#fafafa);color:#292e2d}header{min-height:100px;height:100px;padding:0 28px;gap:10px;flex-wrap:nowrap;position:sticky;top:0}.brand{flex-shrink:0;font-size:25px;margin-right:24px}header nav{order:0;flex:1;flex-basis:auto;justify-content:center;gap:0;overflow:visible}nav a{min-width:80px;padding:18px 11px;border-radius:16px;font-size:13px;gap:8px}nav a.active{background:#ecfcf4}#backup[hidden]{display:none}.bell-button,.account-button{border:1px solid #ddd;border-radius:50%;width:42px;height:42px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#4c5150;text-decoration:none;position:relative}.company-menu{display:flex;align-items:center;gap:12px;max-width:200px;padding:13px 17px;border:1px solid #ddd;border-radius:25px;text-decoration:none;color:#333}.company-menu #company{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0;max-width:150px;font-size:12px}#notice-count:empty{display:none}#notice-count{position:absolute;top:-4px;right:-4px;border-radius:10px;font-size:10px;background:#378250;color:white;padding:2px 5px}.account-button{font-size:25px;margin-left:-12px;border-radius:0 25px 25px 0;background:var(--sn-surface,white)}main{max-width:1440px;margin:30px auto;padding:0 16px 50px}.dashboard-report{background:var(--sn-surface,white);border:1px solid #ddd;border-radius:14px;padding:30px;margin-bottom:16px}.report-filters{display:flex;align-items:center;gap:8px;margin-bottom:20px}.report-filters>select{width:280px;margin-right:auto;border-radius:0}.range-buttons{display:flex}.range-buttons button{border-radius:0;padding:9px 14px;margin-left:-1px}.report-filters input{padding:9px;width:145px;border-radius:0}.report-columns{display:grid;grid-template-columns:minmax(0,3fr) minmax(220px,1.2fr);gap:10px}.report-chart,.source-chart{border:1px solid #ddd;border-radius:0 0 12px 12px;overflow:hidden}.report-tabs{display:grid;grid-template-columns:repeat(4,1fr)}.report-tabs button{border-radius:0;border:0;border-right:1px solid #ddd;border-bottom:1px solid #ddd;background:var(--sn-soft,#f5f5f5);padding:18px 14px;text-align:left;font-size:15px;min-height:85px}.report-tabs button.selected{background:var(--sn-surface,#fff);border-top:2px solid #478957;border-bottom:0}.report-tabs strong{display:block;font-weight:400;font-size:18px;margin-top:10px}.chart-body{padding:12px 20px 18px;min-height:350px}.chart-body svg{width:100%;height:auto;display:block}.chart-legend{display:flex;justify-content:center;gap:60px;font-size:12px}.chart-legend span:first-child{color:#dc546c}.chart-legend span:last-child{color:#479b71}.source-chart{padding:15px}.source-chart h3{margin:0}.source-empty{aspect-ratio:1;border-radius:50%;background:var(--sn-soft,#f5f5f5);display:flex;align-items:center;justify-content:center;text-align:center;padding:32px;margin:80px auto 35px;max-width:270px;font-size:13px}.source-pie{border-radius:50%;aspect-ratio:1;max-width:240px;margin:40px auto}.source-chart ul{list-style:none;padding:0;font-size:12px}.source-chart li{padding:4px}.card{border-radius:14px}.cardhead{border-bottom:0;padding:28px}.cardhead h2{font-size:18px}.cardhead button{background:#337c4b;color:white;border:0}.grid{gap:16px}.settings-layout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:35px}.settings-layout aside{border-right:1px solid #ddd;padding:0 20px 20px 0}.settings-layout aside h3{font-size:14px;line-height:1.5;margin:12px 0 25px}.settings-layout aside h4{font-size:13px;margin:20px 0 10px}.settings-layout aside a{display:block;text-decoration:none;color:#333;font-size:13px;padding:9px;border-radius:4px}.settings-layout aside a.selected{background:#e7f4ec;color:#286843}.settings-content .settingsgrid{grid-template-columns:repeat(2,1fr)}@media(max-width:1150px){header{padding:0 16px}.brand{margin-right:5px;font-size:21px}nav a{min-width:66px;padding:15px 8px;font-size:12px}.company-menu{max-width:130px}.company-menu #company{max-width:85px}.account-button{display:none}.report-filters{flex-wrap:wrap}.report-columns{grid-template-columns:2.5fr 1fr}.report-tabs button{font-size:12px;padding:15px 8px}}@media(max-width:800px){header{height:auto;flex-wrap:wrap;padding:15px}header nav{order:3;flex-basis:100%;overflow-x:auto;justify-content:flex-start}.company-menu{margin-left:auto}.report-columns,.settings-layout{grid-template-columns:1fr}.settings-layout aside{border:0;display:flex;overflow:auto;gap:8px}.settings-layout aside h3,.settings-layout aside h4{display:none}.settings-layout aside a{white-space:nowrap}.dashboard-report{padding:14px}.source-empty{margin:20px auto}.report-filters>select{width:100%}.range-buttons{margin-right:auto}.report-filters input{width:135px}.chart-body{min-height:200px;padding:5px}.source-chart{display:none}}@media print{.settings-layout aside{display:none}.settings-layout{display:block}.report-filters{display:none}}
#login-screen{position:fixed;inset:0;z-index:100;background:#f5f7f5;display:grid;place-items:center;padding:20px}#login-screen form{background:var(--sn-surface,white);border:1px solid #dce4df;border-radius:16px;padding:38px;width:440px;max-width:100%;box-shadow:0 12px 45px #153a1510}#login-screen h1{font-weight:600;font-size:27px}#login-screen label{display:block;margin:16px 0 5px}#login-screen input{display:block;width:100%;margin-top:7px}#login-screen button{width:100%;margin-top:10px}#login-screen [role=alert]{color:#a22}.secret-key{font:17px monospace;overflow-wrap:anywhere;background:#f0f6f0;padding:15px}
body[data-page=settings]{background:var(--sn-surface,#fff)}body[data-page=settings] main{margin-top:0;padding-left:0;padding-right:32px;max-width:none}.settings-layout{grid-template-columns:296px minmax(0,1fr);gap:30px}.settings-layout aside{padding:30px;border-right:1px solid #eee}.settings-layout aside h3{font-size:16px}.settings-layout aside h4{margin-top:32px}.settings-layout aside a{padding:11px 10px;font-size:14px}.settings-content{padding-top:30px}.settings-content>.toolbar{margin-bottom:24px}.settings-content .card{border:0;border-top:1px solid #ddd;border-radius:0;box-shadow:none;padding-bottom:20px}.settings-content .cardhead{padding:30px 0 8px}.settings-content .cardbody{padding:12px 0}.settings-content button{border-radius:24px}.settings-content [name=currencyChoice]{max-width:400px}.settings-content pre{max-height:450px;overflow:auto}dialog:has(iframe){width:min(1100px,95vw)}@media(max-width:800px){body[data-page=settings] main{padding:0 15px}.settings-layout{grid-template-columns:1fr;gap:10px}.settings-layout aside{padding:10px 0}.settings-content{padding-top:10px}}

.settings-content .card>.body{padding:12px 0}.settings-content [name=currencyChoice]{display:block;margin:10px 0 25px;width:400px;max-width:100%}#label-fields input{display:block;max-width:440px}
.calendar-controls{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.calendar-controls h2{margin-right:auto}.calendar-filters{display:flex;gap:20px;flex-wrap:wrap;padding:16px 0}.calendar-filters input{width:auto}.calendar .calendar-heading{min-height:0;font-weight:600}.calendar-muted{background:var(--sn-soft2,#fafafa);color:#777}.calendar-date{padding:4px 8px;background:transparent;border:0}.calendar-hour{display:block;width:100%;text-align:left;border:0;border-top:1px solid #eee;background:transparent;border-radius:0;color:#6f7471;padding:8px;font-size:11px}.calendar-week{overflow:auto}.calendar-week .day{min-width:115px}.calendar-lead{background:#fff1dd;color:#7c591f}.calendar-job{background:#e6f1eb;color:#1d6242}.calendar-appointment{background:#e9eef9;color:#345a87}.calendar-extraShoot{background:#f3eafa;color:#75498e}.event{overflow-wrap:anywhere}

.calendar-allday{height:50px;overflow:auto}.calendar-timeline{height:1440px;position:relative}.calendar-timeline .calendar-hour{position:absolute;height:60px;padding:2px 3px 38px}.calendar-timeline .calendar-timed{position:absolute;z-index:1;margin:0;box-sizing:border-box;min-height:26px;overflow:auto;border:1px solid #d4dfd9;font-size:11px;line-height:1.25}.calendar-week .day{padding:5px}
.signature-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:12px 0}.signature-tools label{display:inline-flex;gap:6px;align-items:center;margin:0}.signature-tools input[type=color]{width:42px;height:32px;padding:2px}#mail-editor{overflow-wrap:anywhere}#mail-editor p{margin:0 0 10px}

/* Photography mark beside the existing product name. */
header .brand{display:inline-flex;align-items:center;gap:10px}
header .brand-logo{display:block;width:42px;height:42px;flex-shrink:0}
header .brand-name{font-weight:400;font-style:normal}
header .brand-name>span{font-weight:700;font-style:italic}
@media(max-width:1100px){header .brand{gap:7px}header .brand-logo{width:34px;height:34px}}

/* Display the supplied artwork intact, framing out its outer black margins. */
header .brand-logo-photo{position:relative;overflow:hidden;width:70px;height:70px;background:#000;border-radius:9px}
header .brand-logo-photo img{position:absolute;display:block;width:270%;max-width:none;height:auto;left:-54%;top:-29%}
@media(max-width:1100px){header .brand-logo-photo{width:52px;height:52px}}

header .brand-logo-photo{background:transparent;border-radius:0;overflow:visible}
header .brand-logo-photo img{position:static;width:100%;height:100%;max-width:100%;object-fit:contain}
.calendar-type-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:middle;border:1px solid rgba(0,0,0,.15)}
.first-steps{list-style:none;padding:0;margin:0}.first-steps li{padding:4px 0}.first-steps li.done{color:#1d6242}.first-steps li.done a{text-decoration:line-through;color:inherit}

/* Nine primary routes: allow desktop navigation to shrink instead of widening the page.
   Below 1400px the links use their own row. The <=991px hamburger layout is unchanged.
   These selectors also override the later studio-look/job-layout desktop link minimums. */
@media(min-width:992px){
 body>header{height:auto;min-height:100px;padding:8px 20px;gap:10px}
 body>header .brand{margin-right:8px}
 body>header #nav{min-width:0}
 body>header #nav>a{min-width:0;padding:10px 6px;text-align:center}
 body>header #nav>a>span{min-width:0;overflow-wrap:anywhere}
 body>header .company-menu{min-width:0;max-width:160px;padding:10px 12px}
 body>header .company-menu #company{min-width:0}
}
@media(min-width:992px) and (max-width:1399px){
 body>header{flex-wrap:wrap;gap:4px 10px}
 body>header .brand{margin-right:auto}
 body>header #nav{order:3;flex-basis:100%;width:100%;justify-content:space-between}
 body>header #nav>a{flex:1 1 0;padding:8px 6px;font-size:12px}
}
