/* Enlarged ReGrease Pro wordmark on clean white headers. */
/* Keep the page as the scrolling container so sticky headers follow it. */
html,body{overflow-x:clip}
html{scroll-padding-top:124px}
#root .topbar,#advancedWorkspaceRoot .rgp-page-brand,.machine-brand{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 3px 16px #17283b0d}
#root .topbar{background:#fff;color:#202b3c;box-shadow:0 3px 16px #17283b0d;min-height:108px;height:auto;padding-top:16px;padding-bottom:16px;gap:24px;flex-wrap:wrap}
#root .header-note{color:#647081}
#root .brand-lockup{max-width:100%;min-width:0}
#root .app-logo{width:500px;height:74px;border-left:0;padding-left:0;max-width:100%}
#root .app-logo img{object-fit:contain;object-position:50% 50%;filter:none;transform:none;image-rendering:auto;mix-blend-mode:normal;background:transparent}
/* The sticky header is in normal flow; the old fixed-header spacer is obsolete. */
#root main{padding-top:0}
#root .shell{max-width:1400px;padding:20px 32px 116px}
#root .intro{align-items:center;gap:32px;padding:6px 2px 20px}
#root .intro h1{font-size:32px;line-height:1.18;letter-spacing:-1px}
#root .intro p{font-size:15px;line-height:1.5;max-width:520px}
#root .mode-selector{margin:4px 0 14px;padding:5px;border-radius:13px;overflow:visible}
#root .mode-selector button{display:grid;place-items:center;min-height:48px;padding:7px 14px;border-radius:9px;text-align:center}
#root .mode-selector button span{font-size:17px;line-height:1.15}
#root .card{padding:22px}
#root .section-title{margin-bottom:18px}
#root .grid{gap:16px}
#root .control{height:48px}
#advancedWorkspaceRoot .rgp-page-brand{flex-wrap:wrap}
#advancedWorkspaceRoot .rgp-page-brand>div{display:grid;grid-template-columns:140px minmax(0,440px);gap:24px;width:min(100%,604px)}
#advancedWorkspaceRoot .rgp-page-brand img{width:100%;max-width:100%;height:auto}
#advancedWorkspaceRoot .rgp-page-brand img:last-child{width:100%;height:76px;object-fit:contain;object-position:50% 50%;mix-blend-mode:normal;background:transparent}
.machine-brand>div{display:grid;grid-template-columns:140px minmax(0,440px);gap:24px;width:min(100%,604px)}
.machine-brand img{width:100%;max-width:100%;height:auto}
.machine-brand img:last-child{width:100%;height:76px;object-fit:contain;object-position:50% 50%;mix-blend-mode:normal;background:transparent}
@media(max-width:760px){
  html{scroll-padding-top:192px}
  #root .topbar{padding:12px 16px;min-height:88px}
  #root .brand-lockup{gap:12px;width:100%}
  #root .lubrigo-logo{width:90px;height:34px}
  #root .app-logo{flex:1;min-width:0;width:auto;height:62px}
  #root .shell{padding:16px 16px 144px}
  #root .intro{display:block;padding:0 0 16px}
  #root .intro h1{font-size:27px;letter-spacing:-.6px}
  #root .intro p{margin-top:10px;font-size:14px}
  #root .mode-selector{margin-top:3px;padding:4px;border-radius:12px}
  #root .mode-selector button{min-height:46px;padding:6px 10px;border-radius:8px}
  #root .mode-selector button span{font-size:16px}
  #root .card{padding:18px}
  #root .actions{position:static}
  #advancedWorkspaceRoot .rgp-page-brand>div,.machine-brand>div{grid-template-columns:90px minmax(0,1fr);gap:12px;width:100%}
  #advancedWorkspaceRoot .rgp-page-brand img:last-child,.machine-brand img:last-child{width:100%;height:62px}
}
@media(max-width:390px){
  #root .lubrigo-logo{width:78px;height:30px}
  #root .app-logo{height:50px}
  #advancedWorkspaceRoot .rgp-page-brand>div,.machine-brand>div{grid-template-columns:78px minmax(0,1fr);gap:10px}
  #advancedWorkspaceRoot .rgp-page-brand img:last-child,.machine-brand img:last-child{height:50px}
}
@media print{
  #root .topbar,#advancedWorkspaceRoot .rgp-page-brand,.machine-brand{position:static;box-shadow:none}
  #advancedWorkspaceRoot .rgp-print-brand img:last-child{width:100mm;height:18mm;object-fit:cover;object-position:50% 46%}
  .machine-brand>div{grid-template-columns:38mm 100mm;width:150mm;gap:8mm}
  .machine-brand img:last-child{max-width:100mm;width:100mm;height:18mm}
}

/* Unified white/blue header. Keep this final rule free of legacy graphite/yellow styling. */
#root .topbar,#advancedWorkspaceRoot .rgp-page-brand,.machine-brand{
  background:#fff;color:#172536;border-top:2px solid #0057b8;border-bottom:1px solid #c9d2da;box-shadow:none
}
#root .header-note{color:#172536}
#root .app-logo img,#advancedWorkspaceRoot .rgp-page-brand img:last-child,.machine-brand img:last-child{mix-blend-mode:normal;background:transparent}
#advancedWorkspaceRoot .rgp-page-brand nav button,.machine-brand nav button{color:#0057b8}
#advancedWorkspaceRoot .rgp-page-brand nav button:hover,.machine-brand nav button:hover{background:#e8f2fc;color:#003f87}