/* Approved FRSH Creative shell; existing Turnilo workflow layouts remain intact.
   Exact SVG artwork and narrow parent+badge composition: hq-brand-preview.html. */
:root{--hq-ink:#090d20;--hq-muted:#5c667c;--hq-green:#2453d4;--hq-canvas:#fff;--hq-line:#dce3ee;--company-blue:#3e72ff;--company-lime:#caff49}
.layout.reference-layout{grid-template-columns:280px minmax(0,1fr)}
.reference-layout .sidebar{background:#090d20;background-image:none;padding:28px 16px 20px}
.reference-brand{display:block;width:248px;height:74px;margin:0 0 28px}
.reference-brand>.hq-light-logo{display:block;width:auto;height:auto}
.reference-brand>.hq-dark-logo{display:none;width:auto;height:auto}
.company-lockup{display:flex;align-items:center;gap:18px;width:248px;max-width:100%}
.reference-brand .company-parent{display:block;width:180px;height:74px;object-fit:contain;filter:none}
.reference-brand .company-hq-badge{display:block;width:50px;height:auto;object-fit:contain;filter:none}
.nav a{color:#fff}.nav a.active{background:var(--company-lime);color:#090d20}.nav a.active .nav-icon{filter:brightness(0)}.nav a:hover{background:#ffffff16}.nav a.active:hover{background:var(--company-lime)}
body{background:#fff}.btn.primary{background:#2453d4;border-color:#2453d4;color:white}.btn.primary:hover{background:#1e48b9;border-color:#1e48b9}.text-action,.inbox-context-section a,.vendor-table a,.vendor-email-row{color:#2453d4}
.search-control .search{background:#f5f7fa}.header-meta{gap:18px}.profile-menu{margin-left:12px}.bottom-nav a[aria-current],.bottom-nav [aria-current]{background:#ecf5d3;color:#090d20}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #3e72ff;outline-offset:3px}
.login-brand{background:#090d20;color:white}.login-brand .brand{margin:0 0 38px}.login-brand .brand .company-login-logo{display:block;width:310px;max-width:100%;height:auto;filter:none}.login-brand h1{color:white}.login-brand .eyebrow{color:#caff49}.login-box{background:#fff}.login-box h2{color:#090d20}.login-box .btn.primary{background:#2453d4;border-color:#2453d4}
@media(max-width:1200px) and (min-width:701px){.header-meta time,.header-divider{display:none}.topbar{gap:18px}.search-control{min-width:180px}.header-meta{gap:10px}}
@media(max-width:700px){.layout.reference-layout{display:block}.reference-layout .sidebar,.business-detail-layout .sidebar{background:#fff;height:auto;min-height:106px;padding:16px 20px;flex-wrap:wrap;gap:8px 12px}.reference-brand{width:248px;height:74px;margin:0;max-width:calc(100% - 45px)}.reference-brand>.hq-light-logo{display:none}.reference-brand>.hq-dark-logo,.business-detail-layout .reference-brand>.hq-dark-logo{display:block;width:auto;height:auto}.reference-brand .company-parent{width:180px;height:74px;max-width:calc(100% - 68px)}.reference-brand .company-hq-badge{width:50px;height:auto}.company-lockup{width:248px;max-width:100%;gap:18px}.mobile-tools button{color:#090d20}.sidebar.menu-open .nav{background:#090d20}.sidebar.menu-open .nav a{color:white}.sidebar.menu-open .nav a.active{color:#090d20}.mobile-detail-meta{flex:1 0 100%;justify-content:flex-end;margin-left:0!important}.business-detail-layout .mobile-detail-meta{display:flex}.topbar{background:#fff}.login-brand{padding:28px 24px}.login-brand .brand .company-login-logo{width:280px}.login-brand h1{font-size:34px}}
@media(max-width:359px){.reference-layout .sidebar,.business-detail-layout .sidebar{padding-left:16px;padding-right:16px}.reference-brand{max-width:none;width:100%;height:auto}.company-lockup{width:248px;flex-wrap:wrap}.reference-brand .company-parent{max-width:none}.mobile-tools{margin-left:auto}.login-brand .brand .company-login-logo{width:248px}}
/* Mobile regression checks: visible controls and a menu anchored below its real header. */
@media(max-width:700px){.reference-layout .sidebar,.business-detail-layout .sidebar{position:relative}.mobile-tools .ui-icon{filter:brightness(0)}.sidebar.menu-open .nav{position:absolute;top:100%;left:0;right:0;max-height:60dvh;overflow:auto}.sidebar.menu-open .nav a.active{background:#caff49;color:#090d20}.sidebar.menu-open .nav a.active .nav-icon{filter:brightness(0)}}
/* FRSH Creative website alignment: approved palette/type, existing workspace geometry. */
:root{--hq-ink:#090d20;--hq-muted:#666c80;--hq-green:#2453d4;--hq-canvas:#fff;--hq-line:#e2e7ef;--hq-mint:#edf2fb;--hq-blue:#edf2fb;--company-blue:#3e72ff;--company-lime:#caff49}
body{font-family:Arial,Helvetica,sans-serif;color:var(--hq-ink);background:var(--hq-canvas)}
body :where(h1,h2,h3,h4,p,a,button,input,select,textarea,span,div,table,th,td,label,small,strong,time){font-family:Arial,Helvetica,sans-serif!important}
.btn.primary,.login-box .btn.primary{background:var(--company-blue);border-color:var(--company-blue);color:var(--hq-ink)}
.btn.primary:hover,.login-box .btn.primary:hover{background:#caff49;border-color:#caff49;color:var(--hq-ink)}
.btn:not(.primary){color:var(--hq-ink);border-color:var(--hq-line)}
.text-action,.inbox-context-section a,.vendor-table a,.vendor-email-row{color:#2453d4}
.reference-table th,.table-wrap th{background:#f5f7fb;color:var(--hq-ink)}
.search-control .search{background:#f7f9fc;border-color:var(--hq-line)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #2453d4;outline-offset:5px}
.sidebar a:focus-visible{outline-color:var(--company-lime)}
/* Status badges and alert colors retain their established semantic meanings. */
dialog{background:#fff;color:var(--hq-ink);border:1px solid var(--hq-line)}
dialog :where(p,label,input,select,textarea){color:var(--hq-ink)}
dialog :where(input,select,textarea){background:#fff;border-color:var(--hq-line)}
dialog::backdrop{background:rgba(9,13,32,.48)}