/*
 * OfficeCalculator Stable Workspace v35
 * Clean workspace layer rebuilt from the last stable v24 codebase.
 * No legacy workspace transforms, off-canvas canvas expansion, masks or oversized pseudo-elements.
 */
 :root{
  --oc30-brand:#2f5bea;
  --oc30-brand-2:#2147c6;
  --oc30-accent:#0f766e;
  --oc30-ink:#142132;
  --oc30-copy:#4d6279;
  --oc30-muted:#6d7f93;
  --oc30-bg:#edf2f7;
  --oc30-panel:#ffffff;
  --oc30-panel-2:#f7f9fc;
  --oc30-line:#d6e0ea;
  --oc30-sidebar:#0c1c31;
  --oc30-sidebar-2:#122842;
  --oc30-radius:20px;
  --oc30-shadow:0 18px 40px rgba(15,23,42,.08);
  --oc30-shadow-sm:0 10px 24px rgba(15,23,42,.06);
}
body.oc-dark,
html.oc-dark-preload{
  --oc30-ink:#edf3fb;
  --oc30-copy:#c2cfdd;
  --oc30-muted:#93a5b8;
  --oc30-bg:#0b1320;
  --oc30-panel:#111d2d;
  --oc30-panel-2:#152336;
  --oc30-line:#2a3b50;
  --oc30-sidebar:#081220;
  --oc30-sidebar-2:#0d1b31;
  --oc30-shadow:0 20px 46px rgba(0,0,0,.32);
  --oc30-shadow-sm:0 10px 26px rgba(0,0,0,.24);
}
html{max-width:100%;background:var(--oc30-bg)!important;overflow-x:hidden}
body[data-oc-workspace="stable-v30"]{
  min-height:100vh;
  width:100%;max-width:100%;margin:0!important;overflow-x:hidden!important;
  background:linear-gradient(180deg,rgba(37,99,235,.035),transparent 360px),var(--oc30-bg)!important;
  color:var(--oc30-ink)!important;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
html.oc-dark-preload body[data-oc-workspace="stable-v30"]{background:#0a111c!important;color:#f2f5f9!important}
body[data-oc-workspace="stable-v30"] *,body[data-oc-workspace="stable-v30"] *::before,body[data-oc-workspace="stable-v30"] *::after{box-sizing:border-box}
body[data-oc-workspace="stable-v30"] img,body[data-oc-workspace="stable-v30"] iframe,body[data-oc-workspace="stable-v30"] canvas,body[data-oc-workspace="stable-v30"] svg{max-width:100%}

/* Stable application shell */
body[data-oc-workspace="stable-v30"] .container{
  display:grid!important;grid-template-columns:300px minmax(0,1fr)!important;
  align-items:start!important;width:100%!important;max-width:none!important;min-height:100vh!important;
  margin:0!important;padding:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;
}
body[data-oc-workspace="stable-v30"] .left-column{
  position:sticky!important;top:0!important;left:auto!important;right:auto!important;bottom:auto!important;
  width:auto!important;max-width:none!important;height:100vh!important;min-height:100vh!important;
  margin:0!important;padding:24px 18px!important;overflow-y:auto!important;overflow-x:hidden!important;
  transform:none!important;border:0!important;border-right:1px solid rgba(148,163,184,.14)!important;border-radius:0!important;
  background:linear-gradient(180deg,var(--oc30-sidebar-2),var(--oc30-sidebar) 72%,#091422)!important;
  color:#d9e4f1!important;box-shadow:none!important;z-index:70!important;
}
body[data-oc-workspace="stable-v30"] .right-column{
  display:flex!important;flex-direction:column!important;min-width:0!important;width:100%!important;max-width:100%!important;
  min-height:100vh!important;margin:0!important;padding:18px clamp(18px,3vw,42px) 40px!important;
  overflow-x:hidden!important;transform:none!important;background:transparent!important;
}
body[data-oc-workspace="stable-v30"] .content{
  display:flex!important;flex:1!important;flex-direction:column!important;min-width:0!important;
  width:100%!important;max-width:1400px!important;margin:0 auto!important;overflow:visible!important;transform:none!important;
}
body[data-oc-workspace="stable-v30"] .content>*{max-width:100%}

/* Brand and navigation */
body[data-oc-workspace="stable-v30"] .site-name{
  position:relative!important;width:100%!important;margin:0 0 18px!important;padding:0 0 21px!important;
  border:0!important;border-bottom:1px solid rgba(148,163,184,.16)!important;overflow:visible!important;text-align:left!important;
}
body[data-oc-workspace="stable-v30"] .site-name a{
  display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;min-height:45px!important;
  color:#fff!important;font-size:1.08rem!important;font-weight:850!important;letter-spacing:-.025em!important;text-decoration:none!important;
}
body[data-oc-workspace="stable-v30"] .site-name a::before{
  display:block!important;flex:0 0 42px!important;width:42px!important;height:42px!important;margin:0!important;
  border-radius:13px!important;background-color:rgba(255,255,255,.075)!important;background-size:27px 27px!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)!important;
}
body[data-oc-workspace="stable-v30"] .site-name::after{
  content:"CALCULATOR WORKSPACE";position:absolute;left:56px;top:30px;color:#8ea3bc;font-size:.58rem;font-weight:800;letter-spacing:.12em;
}
body[data-oc-workspace="stable-v30"] .menu{display:flex!important;flex-direction:column!important;gap:0!important;min-width:0!important}
.oc30-nav-group{margin:0 0 17px}
.oc30-nav-label{display:block;margin:0 10px 8px;color:#7f93ad;font-size:.62rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
body[data-oc-workspace="stable-v30"] .menu .oc30-nav-group a{
  display:grid!important;grid-template-columns:32px minmax(0,1fr);align-items:center!important;gap:10px!important;
  width:100%!important;min-height:46px!important;margin:3px 0!important;padding:9px 11px!important;
  border:1px solid transparent!important;border-radius:12px!important;background:rgba(255,255,255,.015)!important;
  color:#cbd6e4!important;font-size:.9rem!important;font-weight:700!important;text-decoration:none!important;transform:none!important;
}
body[data-oc-workspace="stable-v30"] .menu .oc30-nav-group a:hover,
body[data-oc-workspace="stable-v30"] .menu .oc30-nav-group a:focus-visible{
  border-color:rgba(148,163,184,.18)!important;background:rgba(255,255,255,.06)!important;color:#fff!important;
}
body[data-oc-workspace="stable-v30"] .menu .oc30-nav-group a.current{
  border-color:rgba(96,165,250,.28)!important;background:linear-gradient(90deg,rgba(47,91,234,.24),rgba(47,91,234,.12))!important;color:#fff!important;box-shadow:inset 3px 0 #7cb2ff!important;
}
.oc30-nav-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:rgba(255,255,255,.08);font-size:.84rem}
.oc30-recent-copy{min-width:0}.oc30-recent-copy strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.76rem}.oc30-recent-copy small{display:block;margin-top:1px;color:#71839c;font-size:.57rem}
.oc30-sidebar-status{margin:3px 2px 0;padding:14px;border:1px solid rgba(148,163,184,.14);border-radius:14px;background:rgba(2,6,23,.18);color:#8ea0b7;font-size:.61rem;line-height:1.55}
.oc30-sidebar-status strong{display:flex;align-items:center;gap:7px;margin-bottom:3px;color:#dce6f2;font-size:.68rem}.oc30-sidebar-status strong::before{content:"";width:7px;height:7px;border-radius:50%;background:#34d399}

/* Command bar */
body[data-oc-workspace="stable-v30"] .oc-appbar{
  position:sticky!important;top:12px!important;z-index:60!important;display:grid!important;
  grid-template-columns:minmax(260px,1fr) auto!important;align-items:center!important;gap:9px!important;
  width:100%!important;max-width:1400px!important;min-height:64px!important;margin:0 auto 22px!important;padding:10px!important;
  border:1px solid var(--oc30-line)!important;border-radius:18px!important;background:color-mix(in srgb,var(--oc30-panel) 92%,transparent)!important;
  box-shadow:var(--oc30-shadow-sm)!important;backdrop-filter:blur(16px)!important;transform:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar-search{
  position:relative!important;display:flex!important;align-items:center!important;min-width:0!important;height:46px!important;
  padding:0 14px!important;border:1px solid var(--oc30-line)!important;border-radius:13px!important;background:var(--oc30-panel-2)!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar-search input{
  width:100%!important;min-width:0!important;min-height:40px!important;margin:0!important;padding:7px 10px!important;
  border:0!important;background:transparent!important;color:var(--oc30-ink)!important;box-shadow:none!important;font-size:.82rem!important;
}
body[data-oc-workspace="stable-v30"] .oc-search-shortcut{display:none!important}
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{
  width:auto!important;min-width:42px!important;max-width:none!important;min-height:42px!important;margin:0 0 0 4px!important;padding:8px 12px!important;
  border:1px solid var(--oc30-line)!important;border-radius:10px!important;background:var(--oc30-panel)!important;color:var(--oc30-copy)!important;
  box-shadow:none!important;font-size:.74rem!important;font-weight:780!important;transform:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action:hover{border-color:#a8bedf!important;background:#eff4fb!important;color:#1f3e72!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action:hover{background:#1b3152!important;color:#c7d7ff!important}
body[data-oc-workspace="stable-v30"] .oc-quick-share{border-color:transparent!important;background:linear-gradient(135deg,#2f5bea,#2147c6)!important;color:#fff!important}
body[data-oc-workspace="stable-v30"] .oc-search-panel{top:calc(100% + 7px)!important;left:0!important;right:0!important;max-height:420px!important;border:1px solid var(--oc30-line)!important;border-radius:12px!important;background:var(--oc30-panel)!important;box-shadow:var(--oc30-shadow)!important}

/* Page title and application cards */
.oc30-page-kicker{display:block;margin:2px 0 6px;color:var(--oc30-brand);font-size:.64rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
body[data-oc-workspace="stable-v30"] .content h1{
  margin:0 0 18px!important;color:var(--oc30-ink)!important;font-size:clamp(2rem,4vw,3.25rem)!important;line-height:1.03!important;letter-spacing:-.045em!important;
}
.oc30-trust-row{display:flex;flex-wrap:wrap;gap:7px;margin:-7px 0 20px}.oc30-trust-chip{padding:5px 9px;border:1px solid var(--oc30-line);border-radius:999px;background:var(--oc30-panel);color:var(--oc30-muted);font-size:.6rem;font-weight:750}
body[data-oc-workspace="stable-v30"] .cal-section,
body[data-oc-workspace="stable-v30"] .calculator-container,
body[data-oc-workspace="stable-v30"] .bt-tool,
body[data-oc-workspace="stable-v30"] .eq-app,
body[data-oc-workspace="stable-v30"] .oc-calculator-app{
  max-width:100%!important;border:1px solid var(--oc30-line)!important;border-radius:var(--oc30-radius)!important;background:var(--oc30-panel)!important;
  box-shadow:var(--oc30-shadow)!important;transform:none!important;
}
body[data-oc-workspace="stable-v30"] .cal-section{padding:clamp(22px,3.5vw,36px)!important;margin:0 0 26px!important;text-align:left!important}
body[data-oc-workspace="stable-v30"] .cal-section input,
body[data-oc-workspace="stable-v30"] .cal-section select,
body[data-oc-workspace="stable-v30"] .cal-section textarea{
  max-width:100%!important;min-height:45px!important;margin:7px 6px 12px 0!important;padding:10px 12px!important;
  border:1px solid var(--oc30-line)!important;border-radius:10px!important;background:var(--oc30-panel-2)!important;color:var(--oc30-ink)!important;box-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .cal-section input:focus,
body[data-oc-workspace="stable-v30"] .cal-section select:focus,
body[data-oc-workspace="stable-v30"] .cal-section textarea:focus{border-color:#7ea2ff!important;outline:0!important;box-shadow:0 0 0 4px rgba(37,99,235,.11)!important}
body[data-oc-workspace="stable-v30"] button,
body[data-oc-workspace="stable-v30"] .link-button,
body[data-oc-workspace="stable-v30"] .tool-button,
body[data-oc-workspace="stable-v30"] input[type="button"],
body[data-oc-workspace="stable-v30"] input[type="submit"]{
  border-radius:10px!important;background:linear-gradient(135deg,#2f5bea,#2147c6)!important;color:#fff!important;box-shadow:0 8px 17px rgba(37,99,235,.17)!important;
}
body[data-oc-workspace="stable-v30"] button:hover,
body[data-oc-workspace="stable-v30"] .link-button:hover,
body[data-oc-workspace="stable-v30"] .tool-button:hover{filter:brightness(.96);transform:none!important}
body[data-oc-workspace="stable-v30"] :is(div,p,span,output)[id^="result"],
body[data-oc-workspace="stable-v30"] :is(div,p,span,output)[id$="Result"],
body[data-oc-workspace="stable-v30"] .result-box,
body[data-oc-workspace="stable-v30"] .result-container{
  border-radius:12px!important;border-color:#b9cdf6!important;background:#edf4ff!important;color:#153b78!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] :is(div,p,span,output)[id^="result"],
body.oc-dark[data-oc-workspace="stable-v30"] :is(div,p,span,output)[id$="Result"],
body.oc-dark[data-oc-workspace="stable-v30"] .result-box,
body.oc-dark[data-oc-workspace="stable-v30"] .result-container{border-color:#31517d!important;background:#142b4b!important;color:#d8e8ff!important}
/* Never override the homepage calculator display. */
body[data-oc-workspace="stable-v30"] .display-panel #result{border:0!important;background:transparent!important;color:#f8fbff!important;box-shadow:none!important}

/* Content and discovery */
body[data-oc-workspace="stable-v30"] .content p{color:var(--oc30-copy)!important;line-height:1.75!important}
body[data-oc-workspace="stable-v30"] .content h2,body[data-oc-workspace="stable-v30"] .content h3{color:var(--oc30-ink)!important;letter-spacing:-.025em!important}
body[data-oc-workspace="stable-v30"] .oc-discovery,body[data-oc-workspace="stable-v30"] .oc-sitemap-group{border-color:var(--oc30-line)!important;background:var(--oc30-panel)!important;box-shadow:var(--oc30-shadow-sm)!important}
body[data-oc-workspace="stable-v30"] .oc-discovery-card,body[data-oc-workspace="stable-v30"] .oc-popular-link{border-color:var(--oc30-line)!important;background:var(--oc30-panel-2)!important;color:var(--oc30-ink)!important}
body[data-oc-workspace="stable-v30"] table{max-width:100%!important;border-color:var(--oc30-line)!important;background:var(--oc30-panel)!important}
body[data-oc-workspace="stable-v30"] footer{max-width:1400px!important;margin:28px auto 0!important;border-radius:18px!important;background:#0c182a!important;color:#aebed2!important;box-shadow:none!important}

/* Homepage calculator refinement */
body[data-oc-workspace="stable-v30"] .oc-calculator-app{overflow:hidden!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs{background:var(--oc30-panel-2)!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel{background:linear-gradient(145deg,#0a1220,#13223c)!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button:not(.equals):not(.operator):not(.clear){background:var(--oc30-panel-2)!important;color:var(--oc30-ink)!important;border:1px solid var(--oc30-line)!important;box-shadow:none!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .operator{background:#eef4ff!important;color:#1d4ed8!important;border:1px solid #bfd0f5!important;box-shadow:none!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .operator{background:#182d4e!important;color:#cbdcff!important;border-color:#31517d!important}

/* Mobile */
body[data-oc-workspace="stable-v30"] .menu-icon{display:none}
@media(max-width:960px){
  body[data-oc-workspace="stable-v30"] .container{display:block!important}
  body[data-oc-workspace="stable-v30"] .left-column{
    position:sticky!important;top:0!important;width:100%!important;height:auto!important;min-height:66px!important;max-height:none!important;
    padding:10px 14px!important;overflow:visible!important;border-right:0!important;z-index:100!important;
  }
  body[data-oc-workspace="stable-v30"] .site-name{margin:0!important;padding:0!important;border:0!important}
  body[data-oc-workspace="stable-v30"] .site-name::after{display:none}
  body[data-oc-workspace="stable-v30"] .menu-icon{display:grid!important;place-items:center!important;position:absolute;right:14px;top:12px;width:42px;height:42px;padding:0!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:10px!important;background:rgba(255,255,255,.08)!important;color:#fff!important;box-shadow:none!important}
  body[data-oc-workspace="stable-v30"] .menu{display:none!important;position:absolute!important;top:100%!important;left:0!important;width:100%!important;max-height:calc(100vh - 66px)!important;padding:14px!important;overflow:auto!important;background:#081220!important;box-shadow:0 20px 38px rgba(0,0,0,.28)!important}
  body[data-oc-workspace="stable-v30"] .menu.active{display:flex!important}
  body[data-oc-workspace="stable-v30"] .right-column{padding:13px 14px 30px!important}
  body[data-oc-workspace="stable-v30"] .oc-appbar{top:78px!important}
}
@media(max-width:700px){
  body[data-oc-workspace="stable-v30"] .oc-appbar{position:relative!important;top:auto!important;grid-template-columns:1fr!important}
  body[data-oc-workspace="stable-v30"] .oc-appbar-search{grid-column:1/-1!important}
  body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{margin:0 5px 0 0!important;padding:7px 10px!important;font-size:.65rem!important}
  body[data-oc-workspace="stable-v30"] .content h1{font-size:2rem!important}
  body[data-oc-workspace="stable-v30"] .cal-section{padding:18px!important}
}
@media(max-width:480px){
  body[data-oc-workspace="stable-v30"] .oc-appbar .oc-label,body[data-oc-workspace="stable-v30"] .oc-sound-state{display:none!important}
  body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{min-width:40px!important;margin-right:3px!important}
}
@media print{
  body[data-oc-workspace="stable-v30"] .left-column,body[data-oc-workspace="stable-v30"] .oc-appbar,body[data-oc-workspace="stable-v30"] .oc-backtop{display:none!important}
  body[data-oc-workspace="stable-v30"] .container{display:block!important}
  body[data-oc-workspace="stable-v30"] .right-column{padding:0!important}
}


/* ==========================================================
   v31 — compact single-row command bar
   The app bar contains direct child controls, so a two-column
   grid created unwanted extra rows. Flex keeps all actions
   compact and aligned beside the flexible search field.
   ========================================================== */
body[data-oc-workspace="stable-v30"] .oc-appbar{
  display:flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
}

body[data-oc-workspace="stable-v30"] .oc-appbar-search{
  flex:1 1 380px!important;
  width:auto!important;
  min-width:220px!important;
  max-width:none!important;
}

body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  width:auto!important;
  min-width:46px!important;
  max-width:none!important;
  margin:0!important;
  white-space:nowrap!important;
  line-height:1.1!important;
}

body[data-oc-workspace="stable-v30"] .oc-appbar #ocFavorite,
body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare,
body[data-oc-workspace="stable-v30"] .oc-appbar #ocSound,
body[data-oc-workspace="stable-v30"] .oc-appbar #ocTheme{
  grid-column:auto!important;
  grid-row:auto!important;
}

@media (max-width: 820px){
  body[data-oc-workspace="stable-v30"] .oc-appbar{
    flex-wrap:wrap!important;
  }
  body[data-oc-workspace="stable-v30"] .oc-appbar-search{
    flex:1 0 100%!important;
    width:100%!important;
  }
  body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{
    flex:1 1 auto!important;
    min-width:92px!important;
  }
}

@media (max-width: 480px){
  body[data-oc-workspace="stable-v30"] .oc-appbar{
    gap:6px!important;
    padding:8px!important;
  }
  body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{
    flex:1 1 calc(25% - 6px)!important;
    min-width:42px!important;
    margin:0!important;
  }
}


/* v32: Chrome extension promotion */
.oc-extension-promo{margin:30px 0 38px;padding:clamp(22px,4vw,42px);border:1px solid #c9d7f0;border-radius:24px;background:linear-gradient(135deg,#f8fbff 0%,#eef4ff 58%,#e7efff 100%);box-shadow:0 18px 48px rgba(31,79,208,.11);overflow:hidden}
.oc-extension-promo-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.88fr);gap:34px;align-items:center}
.oc-extension-eyebrow{display:inline-flex;padding:6px 10px;border-radius:999px;background:#dfeaff;color:#1f4fd0;font-size:.72rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.oc-extension-promo h2{margin:12px 0 10px!important;color:#101828!important;font-size:clamp(1.8rem,3vw,3rem)!important;line-height:1.06!important;letter-spacing:-.04em!important}
.oc-extension-promo p{max-width:700px;color:#52627d!important;font-size:1.02rem!important}
.oc-extension-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.oc-extension-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border-radius:12px;font-weight:800;text-decoration:none!important}
.oc-extension-primary{background:linear-gradient(135deg,#2d63ea,#1f4fd0);color:#fff!important;box-shadow:0 12px 26px rgba(45,99,234,.24)}
.oc-extension-secondary{background:#fff;color:#173f67!important;border:1px solid #c9d7f0}
.oc-extension-points{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.oc-extension-points li{padding:6px 10px;border:1px solid #d7e1f2;border-radius:999px;background:rgba(255,255,255,.72);color:#52627d;font-size:.76rem;font-weight:700}
.oc-extension-visual{display:block;padding:10px;border:1px solid #d7e1f2;border-radius:20px;background:#fff;box-shadow:0 18px 40px rgba(24,48,96,.14)}
.oc-extension-visual img{display:block;width:100%;height:auto;border-radius:13px}
body.oc-dark .oc-extension-promo{border-color:#2b3b5c;background:linear-gradient(135deg,#14213a,#101b30 58%,#172746)}
body.oc-dark .oc-extension-promo h2{color:#f4f7ff!important}
body.oc-dark .oc-extension-promo p{color:#aab7d0!important}
body.oc-dark .oc-extension-secondary,body.oc-dark .oc-extension-visual{background:#141e32;border-color:#2b3b5c;color:#dce8ff!important}
body.oc-dark .oc-extension-points li{border-color:#2b3b5c;background:#192641;color:#aab7d0}
@media(max-width:900px){.oc-extension-promo-grid{grid-template-columns:1fr}.oc-extension-visual{max-width:680px}}
@media(max-width:520px){.oc-extension-actions a{width:100%}.oc-extension-promo{border-radius:18px}}


/* v33 — banking calculator directory */
.oc-bank-intro{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  padding:24px;
  margin:18px 0 24px;
  border:1px solid var(--oc-line,#dbe4ef);
  border-radius:20px;
  background:linear-gradient(135deg,rgba(37,99,235,.08),rgba(14,165,233,.04));
}
.oc-bank-intro h2{margin:0 0 8px;font-size:clamp(22px,2.5vw,32px)}
.oc-bank-intro p{margin:0;max-width:780px}
.oc-bank-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 14px;border-radius:999px;
  background:#e8f2ff;color:#174b8f;font-weight:800;white-space:nowrap
}
.oc-bank-sections{display:grid;gap:22px;margin:24px 0}
.oc-bank-section{
  padding:24px;border:1px solid var(--oc-line,#dbe4ef);
  border-radius:20px;background:var(--oc-card,#fff);
  box-shadow:0 12px 32px rgba(15,23,42,.06)
}
.oc-bank-section h2{margin:0 0 6px}
.oc-bank-section>p{margin:0 0 18px}
.oc-bank-grid{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px
}
.oc-bank-card{
  display:flex;gap:12px;align-items:flex-start;
  min-width:0;padding:16px;border:1px solid var(--oc-line,#dbe4ef);
  border-radius:15px;background:var(--oc-soft,#f8fafc);
  color:inherit;text-decoration:none;transition:.18s ease
}
.oc-bank-card:hover{transform:translateY(-2px);border-color:#75a7ef;box-shadow:0 10px 22px rgba(37,99,235,.10)}
.oc-bank-card span:first-child{
  display:grid;place-items:center;flex:0 0 38px;height:38px;
  border-radius:11px;background:#e8f2ff;color:#1d4ed8;font-weight:900
}
.oc-bank-card strong{display:block;margin:1px 0 4px}
.oc-bank-card small{display:block;color:var(--oc-muted,#64748b);line-height:1.4}
.oc-bank-note{
  padding:16px 18px;border-left:4px solid #3b82f6;border-radius:10px;
  background:rgba(59,130,246,.07);color:var(--oc-muted,#475569)
}
.oc-dark .oc-bank-intro,.oc-dark .oc-bank-section{background:#111b2b;border-color:#2a3a50}
.oc-dark .oc-bank-card{background:#172235;border-color:#2a3a50}
.oc-dark .oc-bank-badge,.oc-dark .oc-bank-card span:first-child{background:#18345e;color:#bfdbfe}
.oc-banking-callout{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin:18px 0 24px;padding:18px 20px;border-radius:16px;
  border:1px solid #bdd4f6;background:#eff6ff
}
.oc-banking-callout strong{display:block;font-size:18px;margin-bottom:3px}
.oc-banking-callout a{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 14px;border-radius:10px;background:#2563eb;color:#fff;
  text-decoration:none;font-weight:800;white-space:nowrap
}
.oc-dark .oc-banking-callout{background:#13253f;border-color:#31527d}
@media(max-width:980px){.oc-bank-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){
  .oc-bank-intro{grid-template-columns:1fr}
  .oc-bank-grid{grid-template-columns:1fr}
  .oc-banking-callout{align-items:flex-start;flex-direction:column}
}


/* v34 professional refinements */
body[data-oc-workspace="stable-v30"] .left-column::-webkit-scrollbar{width:10px}
body[data-oc-workspace="stable-v30"] .left-column::-webkit-scrollbar-thumb{background:rgba(255,255,255,.08);border-radius:20px}
body[data-oc-workspace="stable-v30"] .oc-appbar{background:color-mix(in srgb,var(--oc30-panel) 96%,transparent)!important}
body[data-oc-workspace="stable-v30"] .oc30-primary-tool,body[data-oc-workspace="stable-v30"] .oc-card,body[data-oc-workspace="stable-v30"] .oc-discovery-card,body[data-oc-workspace="stable-v30"] .oc-bank-section,body[data-oc-workspace="stable-v30"] .oc-bank-intro,body[data-oc-workspace="stable-v30"] .oc-banking-callout{border-radius:22px!important;box-shadow:var(--oc30-shadow)!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app,body[data-oc-workspace="stable-v30"] .calculator-shell,body[data-oc-workspace="stable-v30"] .cal-section{border:1px solid var(--oc30-line)!important;background:var(--oc30-panel)!important;border-radius:24px!important;box-shadow:var(--oc30-shadow)!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel{background:linear-gradient(145deg,#0f1c30,#152745)!important;border:1px solid rgba(255,255,255,.04)!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs,body[data-oc-workspace="stable-v30"] .calculator-topbar{background:transparent!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab,body[data-oc-workspace="stable-v30"] .mode-tabs button{border-radius:11px!important;border:1px solid var(--oc30-line)!important;background:var(--oc30-panel)!important;color:var(--oc30-copy)!important;box-shadow:none!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab.active,body[data-oc-workspace="stable-v30"] .mode-tabs button.active{background:linear-gradient(135deg,#315fe7,#294dd0)!important;color:#fff!important;border-color:#315fe7!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button:not(.equals):not(.operator):not(.clear){background:var(--oc30-panel-2)!important;color:var(--oc30-ink)!important;border:1px solid var(--oc30-line)!important;border-radius:12px!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button:not(.equals):not(.operator):not(.clear):hover{background:#eef3fb!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .clear{background:#fdf0ee!important;color:#cc4b3a!important;border:1px solid #efc3bc!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .operator{background:#eef3fb!important;color:#284c9c!important;border:1px solid #c8d6ed!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .equals{background:linear-gradient(135deg,#315fe7,#284dd0)!important;color:#fff!important;border:1px solid #2d54da!important}
body[data-oc-workspace="stable-v30"] .small-control,body[data-oc-workspace="stable-v30"] .workspace-tab,body[data-oc-workspace="stable-v30"] .workspace-actions button,body[data-oc-workspace="stable-v30"] .business-tool-tab,body[data-oc-workspace="stable-v30"] .business-buttons button,body[data-oc-workspace="stable-v30"] .calculator-side button,body[data-oc-workspace="stable-v30"] .sidebar button{border-radius:12px!important}
body[data-oc-workspace="stable-v30"] .categories a,body[data-oc-workspace="stable-v30"] .oc-button-link{border-radius:12px!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel{background:linear-gradient(145deg,#0c1524,#162740)!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab,body.oc-dark[data-oc-workspace="stable-v30"] .mode-tabs button{background:#142236!important;border-color:#2b3f5a!important;color:#d6e0ec!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab.active,body.oc-dark[data-oc-workspace="stable-v30"] .mode-tabs button.active{background:linear-gradient(135deg,#2f5bea,#2147c6)!important;border-color:#315fe7!important;color:#fff!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button:not(.equals):not(.operator):not(.clear){background:#18263a!important;border-color:#30455f!important;color:#edf3fb!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .operator{background:#1a3153!important;color:#d8e5ff!important;border-color:#31507b!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .clear{background:#3a2326!important;color:#ffd9d1!important;border-color:#6b4349!important}
@media (max-width:1200px){body[data-oc-workspace="stable-v30"] .container{grid-template-columns:284px minmax(0,1fr)!important}}
@media (max-width:960px){body[data-oc-workspace="stable-v30"] .left-column{padding:12px 14px!important}body[data-oc-workspace="stable-v30"] .site-name a{min-height:48px!important;font-size:1rem!important}body[data-oc-workspace="stable-v30"] .menu{display:none!important;position:fixed!important;top:72px!important;left:12px!important;width:min(360px,calc(100vw - 24px))!important;max-height:calc(100vh - 86px)!important;padding:16px!important;border:1px solid rgba(148,163,184,.18)!important;border-radius:18px!important;background:linear-gradient(180deg,var(--oc30-sidebar-2),var(--oc30-sidebar))!important;box-shadow:0 24px 48px rgba(0,0,0,.28)!important;overflow:auto!important}body[data-oc-workspace="stable-v30"] .menu.active{display:flex!important}body[data-oc-workspace="stable-v30"] .right-column{padding:16px 14px 30px!important}}
@media (max-width:700px){body[data-oc-workspace="stable-v30"] .content{max-width:100%!important}body[data-oc-workspace="stable-v30"] .oc-calculator-app,body[data-oc-workspace="stable-v30"] .calculator-shell,body[data-oc-workspace="stable-v30"] .cal-section{border-radius:18px!important}}


/* ==========================================================
   v35 — result reliability and category-hero contrast
   ========================================================== */
body[data-oc-workspace="stable-v30"] .content .bt-category-hero{
  color:#fff!important;
  background:linear-gradient(135deg,#173f67 0%,#235f96 62%,#2f80c8 100%)!important;
}
body[data-oc-workspace="stable-v30"] .content .bt-category-hero h1{
  position:relative!important;
  z-index:2!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  text-shadow:0 1px 1px rgba(0,0,0,.08)!important;
}
body[data-oc-workspace="stable-v30"] .content .bt-category-hero p{
  position:relative!important;
  z-index:2!important;
  color:#eaf4ff!important;
  -webkit-text-fill-color:#eaf4ff!important;
  opacity:1!important;
}
body[data-oc-workspace="stable-v30"] .content .bt-category-hero .oc30-page-kicker{
  position:relative!important;
  z-index:2!important;
  color:#bfdbfe!important;
}
body[data-oc-workspace="stable-v30"] .content .bt-category-hero .oc30-trust-row{
  position:relative!important;
  z-index:2!important;
}
body[data-oc-workspace="stable-v30"] .content .bt-category-hero .oc30-trust-chip{
  border-color:rgba(255,255,255,.30)!important;
  background:rgba(255,255,255,.94)!important;
  color:#173f67!important;
}

/* Retirement calculator rebuilt around an explicit form. */
.oc-retirement-form{max-width:760px;margin:0}
.oc-retirement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.oc-retirement-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.oc-retirement-field label{margin:0!important;color:var(--oc30-ink)!important;font-weight:760!important}
.oc-retirement-field input{width:100%!important;margin:0!important}
.oc-retirement-actions{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 0}
.oc-retirement-actions button{min-width:132px!important;margin:0!important}
.oc-retirement-clear{background:var(--oc30-panel-2)!important;color:var(--oc30-copy)!important;border:1px solid var(--oc30-line)!important;box-shadow:none!important}
.oc-retirement-message{display:none;margin:14px 0 0!important;padding:11px 13px;border-left:4px solid #c2413a;border-radius:9px;background:#fff1f0;color:#8d2f2a!important;font-weight:700}
.oc-retirement-message.is-visible{display:block}
.oc-retirement-result{margin:22px 0 0;padding:20px;border:1px solid #bdd0ef;border-radius:16px;background:linear-gradient(135deg,#eef5ff,#fff);box-shadow:0 12px 26px rgba(30,64,175,.08)}
.oc-retirement-result[hidden]{display:none!important}
.oc-retirement-result-label{display:block;color:#2f5bea;font-size:.72rem;font-weight:900;letter-spacing:.10em;text-transform:uppercase}
.oc-retirement-main{display:block;margin:5px 0 7px;color:#173f67;font-size:clamp(1.75rem,4vw,2.7rem);font-weight:900;line-height:1.05;letter-spacing:-.035em}
.oc-retirement-summary{margin:0!important;color:var(--oc30-copy)!important}
.oc-retirement-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:17px 0 0}
.oc-retirement-stat{padding:13px;border:1px solid #d5e1f2;border-radius:12px;background:rgba(255,255,255,.82)}
.oc-retirement-stat span{display:block;color:var(--oc30-muted);font-size:.7rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.oc-retirement-stat strong{display:block;margin-top:5px;color:#173f67;font-size:1.05rem;overflow-wrap:anywhere}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-retirement-result{border-color:#31517d;background:linear-gradient(135deg,#142b4b,#152336)}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-retirement-main,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-retirement-stat strong{color:#d8e8ff!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-retirement-stat{border-color:#30455f;background:#111d2d}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-retirement-clear{background:#17263a!important;color:#d6e0ec!important;border-color:#30455f!important}
@media(max-width:700px){
  .oc-retirement-grid{grid-template-columns:1fr}
  .oc-retirement-stats{grid-template-columns:1fr}
  .oc-retirement-actions{display:grid;grid-template-columns:1fr 1fr}
  .oc-retirement-actions button{width:100%!important;min-width:0!important}
}


/* ==========================================================
   v36 — extension-inspired palette, modern category cards,
   wider footer and light calculator polish
   ========================================================== */
:root{
  --oc30-brand:#3367e8;
  --oc30-brand-2:#274fd4;
  --oc30-accent:#5b7cf0;
  --oc30-ink:#1f2d4a;
  --oc30-copy:#62708c;
  --oc30-muted:#7a879d;
  --oc30-bg:#eef3fb;
  --oc30-panel:#ffffff;
  --oc30-panel-2:#f6f8fd;
  --oc30-line:#cad5e6;
}
body[data-oc-workspace="stable-v30"]{
  background:linear-gradient(180deg,rgba(51,103,232,.045),transparent 360px),var(--oc30-bg)!important;
}
body[data-oc-workspace="stable-v30"] .left-column{
  background:linear-gradient(180deg,#11243f,#0d1d35 72%,#091626)!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-quick-share,
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action.oc-quick-share,
body[data-oc-workspace="stable-v30"] button,
body[data-oc-workspace="stable-v30"] .link-button,
body[data-oc-workspace="stable-v30"] .tool-button,
body[data-oc-workspace="stable-v30"] input[type="button"],
body[data-oc-workspace="stable-v30"] input[type="submit"]{
  background:linear-gradient(135deg,#3568e6,#2a52d0)!important;
}

/* Light professional calculator inspired by the extension */
body[data-oc-workspace="stable-v30"] .oc-calculator-app,
body[data-oc-workspace="stable-v30"] .calculator-shell{
  background:linear-gradient(180deg,#ffffff 0%,#f8faff 100%)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel{
  background:linear-gradient(135deg,#f5f7fc 0%,#eef2f9 100%)!important;
  border:1px solid #d2dbea!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.75)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel::after{
  background:radial-gradient(circle at top right,rgba(51,103,232,.12),transparent 48%)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel #result,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel output#result{
  color:#1a2743!important;
  -webkit-text-fill-color:#1a2743!important;
  text-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel #expression,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .expression{
  color:#667694!important;
  -webkit-text-fill-color:#667694!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel #displayMessage,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .display-message,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .memory-indicator{
  color:#5f6f8b!important;
  -webkit-text-fill-color:#5f6f8b!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs{
  background:#eef3fb!important;
  border:1px solid var(--oc30-line)!important;
  border-radius:18px!important;
  padding:6px!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab,
body[data-oc-workspace="stable-v30"] .mode-tabs button{
  background:transparent!important;
  border-color:transparent!important;
  color:#5e6d89!important;
  font-weight:800!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab.active,
body[data-oc-workspace="stable-v30"] .mode-tabs button.active{
  background:#fff!important;
  color:#3367e8!important;
  border-color:#d2dbea!important;
  box-shadow:0 4px 10px rgba(45,76,170,.06)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button:not(.equals):not(.operator):not([data-action="clear"]):not(.clear){
  background:#ffffff!important;
  color:#1f2d4a!important;
  border:1px solid #ccd6e7!important;
  box-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .operator,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad [data-action="operator"]{
  background:#edf3ff!important;
  color:#2c57d7!important;
  border:1px solid #cad7f4!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad [data-action="clear"],
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .clear{
  background:#fff0f1!important;
  color:#d42f2f!important;
  border:1px solid #f1cdd1!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .equals,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad [data-action="equals"]{
  background:linear-gradient(135deg,#3568e6,#2a52d0)!important;
  color:#fff!important;
  border:1px solid #2d55cf!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel{
  background:linear-gradient(135deg,#18273c 0%,#132033 100%)!important;
  border-color:#334963!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel #result,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel output#result{color:#eef4ff!important;-webkit-text-fill-color:#eef4ff!important}

/* Modern category experience */
body[data-oc-workspace="stable-v30"] .bt-category-hero,
body[data-oc-workspace="stable-v30"] .oc-category-hero{
  position:relative!important;
  overflow:hidden!important;
  margin:0 0 26px!important;
  padding:clamp(24px,4vw,42px)!important;
  border:1px solid #c7d6ef!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,#1f4e86 0%,#2a5f99 55%,#4a86c8 100%)!important;
  box-shadow:0 24px 44px rgba(22,56,106,.16)!important;
}
body[data-oc-workspace="stable-v30"] .bt-category-hero::after,
body[data-oc-workspace="stable-v30"] .oc-category-hero::after{
  content:"";position:absolute;right:-54px;top:-30px;width:240px;height:240px;border-radius:50%;background:rgba(255,255,255,.10);
}
body[data-oc-workspace="stable-v30"] .bt-category-hero>* ,
body[data-oc-workspace="stable-v30"] .oc-category-hero>*{position:relative;z-index:1}
body[data-oc-workspace="stable-v30"] .oc-category-hero .oc-category-hero-meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
body[data-oc-workspace="stable-v30"] .oc-category-hero .oc-category-count,
body[data-oc-workspace="stable-v30"] .oc-category-hero .oc-category-layout-note{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:.74rem;font-weight:780;
}
body[data-oc-workspace="stable-v30"] .oc-category-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin:14px 0 22px!important;
}
body[data-oc-workspace="stable-v30"] .oc-category-card{
  display:flex;align-items:flex-start;gap:14px;min-width:0;padding:18px;border:1px solid var(--oc30-line);border-radius:18px;background:var(--oc30-panel-2);color:var(--oc30-ink)!important;text-decoration:none!important;box-shadow:0 10px 24px rgba(20,36,62,.05);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body[data-oc-workspace="stable-v30"] .oc-category-card:hover{
  transform:translateY(-2px);border-color:#8eaeee;box-shadow:0 16px 30px rgba(35,76,170,.12)
}
body[data-oc-workspace="stable-v30"] .oc-category-card-icon{
  display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:14px;background:linear-gradient(135deg,#edf3ff,#dfe9ff);border:1px solid #cad7f4;color:#2f5bea;font-size:1.1rem;font-weight:900
}
body[data-oc-workspace="stable-v30"] .oc-category-card-body{min-width:0;display:flex;flex-direction:column;gap:5px}
body[data-oc-workspace="stable-v30"] .oc-category-card-title{display:block;color:var(--oc30-ink);font-size:1rem;font-weight:840;line-height:1.28}
body[data-oc-workspace="stable-v30"] .oc-category-card-desc{display:block;color:var(--oc30-copy);font-size:.84rem;line-height:1.55}
body[data-oc-workspace="stable-v30"] .oc-category-card-arrow{align-self:center;flex:0 0 auto;color:#3367e8;font-size:1.05rem;font-weight:800}
body[data-oc-workspace="stable-v30"] .oc-category-grid+.oc-category-grid{margin-top:8px}
body[data-oc-workspace="stable-v30"] .cal-section ol.oc-category-list-legacy{list-style:none!important;padding:0!important;margin:0!important}
body[data-oc-workspace="stable-v30"] .cal-section h2,
body[data-oc-workspace="stable-v30"] .cal-section h3{margin:18px 0 12px!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-category-card{background:#142236!important;border-color:#30455f!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-category-card-title{color:#eef4ff!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-category-card-desc{color:#b8c7db!important}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-category-card-icon{background:linear-gradient(135deg,#193150,#1a2b44)!important;border-color:#33517e!important;color:#d8e8ff!important}

/* Wider footer */
body[data-oc-workspace="stable-v30"] footer{
  width:100%!important;
  max-width:none!important;
  margin:34px 0 0!important;
  padding:34px clamp(18px,4vw,42px)!important;
  border-radius:24px!important;
}
body[data-oc-workspace="stable-v30"] footer .footer-menu{
  width:100%!important;
  max-width:1280px;
  margin:0 auto!important;
  font-size:1.05rem;
  line-height:2;
}
@media(max-width:1100px){
  body[data-oc-workspace="stable-v30"] .oc-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
  body[data-oc-workspace="stable-v30"] .oc-category-grid{grid-template-columns:1fr}
  body[data-oc-workspace="stable-v30"] .oc-category-hero .oc-category-hero-meta{flex-direction:column;align-items:flex-start}
}


/* v37 category and universal footer reliability */
body[data-oc-workspace="stable-v30"] .oc-category-hero,
body[data-oc-workspace="stable-v30"] .oc-category-hero h1,
body[data-oc-workspace="stable-v30"] .oc-category-hero p,
body[data-oc-workspace="stable-v30"] .oc-category-hero .oc30-page-kicker{
  opacity:1!important;visibility:visible!important;
}
body[data-oc-workspace="stable-v30"] .oc-category-hero h1{display:block!important;margin:0 0 14px!important;color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:none!important}
body[data-oc-workspace="stable-v30"] .oc-category-hero p{display:block!important;max-width:980px!important;margin:12px 0 0!important;color:#eaf2ff!important;-webkit-text-fill-color:#eaf2ff!important;line-height:1.72!important}
body[data-oc-workspace="stable-v30"] .oc-category-hero .oc30-page-kicker{color:#c9dcff!important}
body[data-oc-workspace="stable-v30"] .oc-category-directory .cal-section{padding:clamp(20px,3vw,32px)!important}
body[data-oc-workspace="stable-v30"] .oc-category-directory .cal-section>.oc-category-grid:first-child{margin-top:0!important}
body[data-oc-workspace="stable-v30"] footer.oc-universal-footer{max-width:none!important;width:100%!important;margin:42px 0 0!important;padding:0!important;background:linear-gradient(135deg,#0d1c31,#102641 62%,#17375a)!important}

/* ==========================================================
   v38 — exact Chrome-extension control palette and contrast
   Source palette: the supplied Office Calculator v6 stylesheet.
   ========================================================== */
:root{
  --ocx-bg:#edf2f9;
  --ocx-surface:#ffffff;
  --ocx-surface-soft:#f4f7fb;
  --ocx-surface-strong:#e9eef7;
  --ocx-text:#152036;
  --ocx-muted:#667189;
  --ocx-border:#dce3ee;
  --ocx-primary:#2563eb;
  --ocx-primary-hover:#1d4ed8;
  --ocx-primary-soft:#e8f0ff;
  --ocx-danger:#dc2626;
  --ocx-danger-soft:#feecec;
  --ocx-operator:#e9f0ff;
  --ocx-operator-text:#1d4ed8;
  --ocx-key:#ffffff;
  --ocx-key-hover:#f5f8fc;
  --ocx-shadow:0 18px 48px rgba(34,52,84,.18);
  --ocx-focus:0 0 0 3px rgba(37,99,235,.25);
}
body.oc-dark{
  --ocx-bg:#0e1420;
  --ocx-surface:#161e2c;
  --ocx-surface-soft:#1b2535;
  --ocx-surface-strong:#232e40;
  --ocx-text:#f2f5fb;
  --ocx-muted:#9ba7ba;
  --ocx-border:#2b374a;
  --ocx-primary:#5b8cff;
  --ocx-primary-hover:#7aa2ff;
  --ocx-primary-soft:#1c315a;
  --ocx-danger:#ff7777;
  --ocx-danger-soft:#41242b;
  --ocx-operator:#21365e;
  --ocx-operator-text:#a9c2ff;
  --ocx-key:#1b2535;
  --ocx-key-hover:#243146;
  --ocx-shadow:0 22px 58px rgba(0,0,0,.45);
  --ocx-focus:0 0 0 3px rgba(91,140,255,.35);
}

body[data-oc-workspace="stable-v30"]{
  --oc30-brand:var(--ocx-primary);
  --oc30-brand-2:var(--ocx-primary-hover);
  --oc30-ink:var(--ocx-text);
  --oc30-copy:var(--ocx-muted);
  --oc30-muted:var(--ocx-muted);
  --oc30-bg:var(--ocx-bg);
  --oc30-panel:var(--ocx-surface);
  --oc30-panel-2:var(--ocx-surface-soft);
  --oc30-line:var(--ocx-border);
  background:var(--ocx-bg)!important;
  color:var(--ocx-text)!important;
}

/* Command bar: larger non-selectable search icon and guaranteed action contrast. */
body[data-oc-workspace="stable-v30"] .oc-appbar{
  border-color:var(--ocx-border)!important;
  background:color-mix(in srgb,var(--ocx-surface) 94%,transparent)!important;
  box-shadow:0 12px 34px rgba(34,52,84,.10)!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar-search{
  min-height:46px!important;
  padding:0 10px 0 8px!important;
  border-color:var(--ocx-border)!important;
  background:var(--ocx-surface-soft)!important;
}
body[data-oc-workspace="stable-v30"] .oc-search-mark{
  position:absolute!important;
  z-index:2!important;
  left:8px!important;
  top:50%!important;
  display:grid!important;
  place-items:center!important;
  width:34px!important;
  height:34px!important;
  border:1px solid color-mix(in srgb,var(--ocx-border) 70%,var(--ocx-primary))!important;
  border-radius:10px!important;
  background:var(--ocx-primary-soft)!important;
  color:var(--ocx-primary)!important;
  transform:translateY(-50%)!important;
  user-select:none!important;
  pointer-events:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-search-mark svg{
  width:18px!important;
  height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar-search input{
  padding-left:44px!important;
  color:var(--ocx-text)!important;
  caret-color:var(--ocx-primary)!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar-search input::placeholder{
  color:var(--ocx-muted)!important;
  opacity:1!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action{
  min-height:42px!important;
  border:1px solid var(--ocx-border)!important;
  border-radius:10px!important;
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
  box-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action .oc-label,
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action .oc-sound-state{
  color:inherit!important;
  -webkit-text-fill-color:inherit!important;
  opacity:1!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar .oc-app-action:hover{
  border-color:color-mix(in srgb,var(--ocx-border) 55%,var(--ocx-primary))!important;
  background:var(--ocx-surface-strong)!important;
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare,
body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare:hover,
body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare:focus-visible{
  border-color:transparent!important;
  background:var(--ocx-primary)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 8px 18px rgba(37,99,235,.22)!important;
  opacity:1!important;
}
body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare:hover{background:var(--ocx-primary-hover)!important}
body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare .oc-label{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
}

/* Main calculator shell and display. */
body[data-oc-workspace="stable-v30"] .oc-calculator-app{
  border-color:var(--ocx-border)!important;
  background:var(--ocx-surface)!important;
  color:var(--ocx-text)!important;
  box-shadow:var(--ocx-shadow)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .calculator-topbar,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .calculator-main,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .history-panel,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .session-manager{
  background:var(--ocx-surface)!important;
  color:var(--ocx-text)!important;
  border-color:var(--ocx-border)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel{
  border:1px solid var(--ocx-border)!important;
  border-radius:16px!important;
  background:radial-gradient(circle at 90% 0%,rgba(37,99,235,.11),transparent 35%),var(--ocx-surface-soft)!important;
  box-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel::after{display:none!important}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel output#result,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .result{
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
  text-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel #expression,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .expression,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel #displayMessage,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .display-message,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .display-panel .memory-indicator{
  color:var(--ocx-muted)!important;
  -webkit-text-fill-color:var(--ocx-muted)!important;
}

/* Tabs match the supplied extension. */
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs{
  padding:4px!important;
  border:1px solid var(--ocx-border)!important;
  border-radius:12px!important;
  background:var(--ocx-surface-soft)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs button{
  min-height:38px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--ocx-muted)!important;
  -webkit-text-fill-color:var(--ocx-muted)!important;
  box-shadow:none!important;
  font-weight:750!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tab.active,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs button.active{
  background:var(--ocx-surface)!important;
  color:var(--ocx-primary)!important;
  -webkit-text-fill-color:var(--ocx-primary)!important;
  box-shadow:0 3px 10px rgba(24,43,79,.08)!important;
}

/* Memory controls are quiet utilities, not primary actions. */
body[data-oc-workspace="stable-v30"] .oc-calculator-app .memory-row button{
  border:0!important;
  background:transparent!important;
  color:var(--ocx-muted)!important;
  -webkit-text-fill-color:var(--ocx-muted)!important;
  box-shadow:none!important;
  font-weight:750!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .memory-row button:hover{
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-primary)!important;
  -webkit-text-fill-color:var(--ocx-primary)!important;
}

/* Exact key roles from the extension stylesheet. */
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .key{
  border:1px solid var(--ocx-border)!important;
  border-radius:12px!important;
  background:var(--ocx-key)!important;
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
  box-shadow:0 2px 4px rgba(20,37,66,.06)!important;
  font-weight:700!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .key:hover{
  border-color:color-mix(in srgb,var(--ocx-border) 55%,var(--ocx-primary))!important;
  background:var(--ocx-key-hover)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .utility:not([data-action="clear"]){
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-muted)!important;
  -webkit-text-fill-color:var(--ocx-muted)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad [data-action="clear"]{
  border-color:color-mix(in srgb,var(--ocx-danger-soft) 60%,var(--ocx-danger))!important;
  background:var(--ocx-danger-soft)!important;
  color:var(--ocx-danger)!important;
  -webkit-text-fill-color:var(--ocx-danger)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .operator,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad [data-action="percent"]{
  border-color:color-mix(in srgb,var(--ocx-border) 68%,var(--ocx-primary))!important;
  background:var(--ocx-operator)!important;
  color:var(--ocx-operator-text)!important;
  -webkit-text-fill-color:var(--ocx-operator-text)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .equals{
  border-color:transparent!important;
  background:var(--ocx-primary)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 8px 18px rgba(37,99,235,.25)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .equals:hover{
  background:var(--ocx-primary-hover)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .key:active,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad .key.oc-keyboard-pressed{
  transform:translateY(1px) scale(.98)!important;
  box-shadow:none!important;
}

/* Secondary calculator controls use neutral surfaces; only meaningful actions are primary. */
body[data-oc-workspace="stable-v30"] .oc-calculator-app .small-control,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .text-button,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .history-actions button,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .session-primary-actions button,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .workspace-actions button{
  border:1px solid var(--ocx-border)!important;
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
  box-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app #workspaceToggle,
body[data-oc-workspace="stable-v30"] .oc-calculator-app #shareCalculation,
body[data-oc-workspace="stable-v30"] .oc-calculator-app #saveSession{
  border-color:transparent!important;
  background:var(--ocx-primary)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app #clearHistory{
  background:var(--ocx-danger-soft)!important;
  color:var(--ocx-danger)!important;
  -webkit-text-fill-color:var(--ocx-danger)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app .small-control:disabled,
body[data-oc-workspace="stable-v30"] .oc-calculator-app button:disabled{
  opacity:.5!important;
  cursor:not-allowed!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app input,
body[data-oc-workspace="stable-v30"] .oc-calculator-app textarea,
body[data-oc-workspace="stable-v30"] .oc-calculator-app select{
  border-color:var(--ocx-border)!important;
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-text)!important;
}
body[data-oc-workspace="stable-v30"] .oc-calculator-app input:focus,
body[data-oc-workspace="stable-v30"] .oc-calculator-app textarea:focus,
body[data-oc-workspace="stable-v30"] .oc-calculator-app select:focus{
  border-color:var(--ocx-primary)!important;
  box-shadow:var(--ocx-focus)!important;
}

/* Calculation tape and dark mode are fully synchronized. */
body[data-oc-workspace="stable-v30"] .oc-calculator-app .history-item,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .history-list li,
body[data-oc-workspace="stable-v30"] .oc-calculator-app .session-list > *{
  border-color:var(--ocx-border)!important;
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-text)!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .calculator-topbar,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .calculator-main,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .history-panel,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .session-manager{
  background:var(--ocx-surface)!important;
  color:var(--ocx-text)!important;
  border-color:var(--ocx-border)!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keyboard-tip,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .privacy-note,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .history-heading span,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .session-heading span{
  color:var(--ocx-muted)!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app h2,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app h3{
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
}

/* Prevent blue text-selection backgrounds from visually replacing tiny toolbar icons. */
body[data-oc-workspace="stable-v30"] .oc-appbar,
body[data-oc-workspace="stable-v30"] .oc-appbar button,
body[data-oc-workspace="stable-v30"] .oc-search-mark{user-select:none!important}
body[data-oc-workspace="stable-v30"] .oc-appbar-search input{user-select:text!important}

@media(min-width:901px){
  body[data-oc-workspace="stable-v30"] .oc-appbar #ocQuickShare .oc-label{display:inline!important}
}
@media(max-width:700px){
  body[data-oc-workspace="stable-v30"] .oc-search-mark{width:32px!important;height:32px!important}
  body[data-oc-workspace="stable-v30"] .oc-appbar-search input{padding-left:42px!important}
}

/* v38 dark-mode specificity guard against older calculator rules. */
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key.number,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key[data-action="decimal"]{
  border-color:#2b374a!important;
  background:#1b2535!important;
  color:#f2f5fb!important;
  -webkit-text-fill-color:#f2f5fb!important;
  box-shadow:0 2px 4px rgba(0,0,0,.18)!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key.utility:not([data-action="clear"]){
  border-color:#2b374a!important;
  background:#1b2535!important;
  color:#9ba7ba!important;
  -webkit-text-fill-color:#9ba7ba!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key[data-action="clear"]{
  border-color:#5f343c!important;
  background:#41242b!important;
  color:#ff7777!important;
  -webkit-text-fill-color:#ff7777!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key.operator,
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key[data-action="percent"]{
  border-color:#31486e!important;
  background:#21365e!important;
  color:#a9c2ff!important;
  -webkit-text-fill-color:#a9c2ff!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .keypad button.key.equals{
  border-color:transparent!important;
  background:#5b8cff!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs button.mode-tab.active{
  border-color:#2b374a!important;
  background:#161e2c!important;
  color:#5b8cff!important;
  -webkit-text-fill-color:#5b8cff!important;
  box-shadow:0 3px 10px rgba(0,0,0,.22)!important;
}
body.oc-dark[data-oc-workspace="stable-v30"] .oc-calculator-app .mode-tabs button.mode-tab:not(.active){
  background:transparent!important;
  color:#9ba7ba!important;
  -webkit-text-fill-color:#9ba7ba!important;
}

/* v38 final high-specificity dark calculator normalization. */
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key.number,
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key[data-action="decimal"]{
  background-color:#1b2535!important;
  background-image:none!important;
  border-color:#2b374a!important;
  color:#f2f5fb!important;
  -webkit-text-fill-color:#f2f5fb!important;
}
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key.utility:not([data-action="clear"]){
  background-color:#1b2535!important;
  background-image:none!important;
  border-color:#2b374a!important;
  color:#9ba7ba!important;
  -webkit-text-fill-color:#9ba7ba!important;
}
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key[data-action="clear"]{
  background-color:#41242b!important;
  background-image:none!important;
  border-color:#5f343c!important;
  color:#ff7777!important;
  -webkit-text-fill-color:#ff7777!important;
}
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key.operator,
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key[data-action="percent"]{
  background-color:#21365e!important;
  background-image:none!important;
  border-color:#31486e!important;
  color:#a9c2ff!important;
  -webkit-text-fill-color:#a9c2ff!important;
}
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-workspace .calculator-main .keypad button.key.equals{
  background-color:#5b8cff!important;
  background-image:none!important;
  border-color:transparent!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
html body.oc-dark[data-oc-workspace="stable-v30"] section.oc-calculator-app.calculator-shell .calculator-topbar .mode-tabs button.mode-tab.active{
  background-color:#161e2c!important;
  background-image:none!important;
  border-color:#2b374a!important;
  color:#5b8cff!important;
  -webkit-text-fill-color:#5b8cff!important;
}

/* v38 universal primary/secondary actions for ordinary calculator forms. */
body[data-oc-workspace="stable-v30"] .cal-section .oc-action-primary{
  border:1px solid transparent!important;
  background:var(--ocx-primary)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  box-shadow:0 8px 18px rgba(37,99,235,.20)!important;
}
body[data-oc-workspace="stable-v30"] .cal-section .oc-action-primary:hover{
  background:var(--ocx-primary-hover)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
body[data-oc-workspace="stable-v30"] .cal-section .oc-action-secondary{
  border:1px solid var(--ocx-border)!important;
  background:var(--ocx-surface-soft)!important;
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
  box-shadow:none!important;
}
body[data-oc-workspace="stable-v30"] .cal-section .oc-action-secondary:hover{
  border-color:color-mix(in srgb,var(--ocx-border) 55%,var(--ocx-primary))!important;
  background:var(--ocx-surface-strong)!important;
  color:var(--ocx-text)!important;
  -webkit-text-fill-color:var(--ocx-text)!important;
}

/* ==========================================================
   v39 — bottom content width containment
   Keep generated sections aligned to the same responsive page
   boundary as the primary .content workspace.
   ========================================================== */
body[data-oc-workspace="stable-v30"]{
  --oc-page-max:1400px;
}
body[data-oc-workspace="stable-v30"] .content{
  width:min(100%,var(--oc-page-max))!important;
  max-width:var(--oc-page-max)!important;
}

/* Some legacy pages close .content before generated sections.
   These direct right-column children must still use the same width. */
body[data-oc-workspace="stable-v30"] .right-column > .oc-category-completion,
body[data-oc-workspace="stable-v30"] .right-column > .oc-discovery-wrap,
body[data-oc-workspace="stable-v30"] .right-column > .oc-share-panel,
body[data-oc-workspace="stable-v30"] .right-column > footer.oc-universal-footer,
body[data-oc-workspace="stable-v30"] .right-column > ins.adsbygoogle,
body[data-oc-workspace="stable-v30"] .right-column > script + ins.adsbygoogle{
  width:min(100%,var(--oc-page-max))!important;
  max-width:var(--oc-page-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box!important;
}

/* The same rule also protects sections that remain inside .content. */
body[data-oc-workspace="stable-v30"] .oc-category-completion,
body[data-oc-workspace="stable-v30"] .oc-discovery-wrap,
body[data-oc-workspace="stable-v30"] .oc-share-panel,
body[data-oc-workspace="stable-v30"] footer.oc-universal-footer{
  max-width:var(--oc-page-max)!important;
  box-sizing:border-box!important;
}

body[data-oc-workspace="stable-v30"] .oc-share-panel,
body[data-oc-workspace="stable-v30"] .oc-category-completion,
body[data-oc-workspace="stable-v30"] .oc-discovery,
body[data-oc-workspace="stable-v30"] footer.oc-universal-footer{
  overflow:hidden!important;
}

/* Footer stays visually wide within the page, never wider than it. */
body[data-oc-workspace="stable-v30"] footer.oc-universal-footer{
  width:min(100%,var(--oc-page-max))!important;
  margin:42px auto 0!important;
  border-radius:24px!important;
}
body[data-oc-workspace="stable-v30"] footer.oc-universal-footer .oc-footer-inner{
  width:100%!important;
  max-width:100%!important;
  padding-left:clamp(22px,4vw,52px)!important;
  padding-right:clamp(22px,4vw,52px)!important;
  box-sizing:border-box!important;
}

/* Share and discovery grids contract cleanly instead of forcing width. */
body[data-oc-workspace="stable-v30"] .oc-share-panel,
body[data-oc-workspace="stable-v30"] .oc-share-actions,
body[data-oc-workspace="stable-v30"] .oc-discovery-grid,
body[data-oc-workspace="stable-v30"] .oc-popular-grid,
body[data-oc-workspace="stable-v30"] .oc-category-completion-grid{
  min-width:0!important;
}
body[data-oc-workspace="stable-v30"] .oc-share-panel > *,
body[data-oc-workspace="stable-v30"] .oc-discovery-card,
body[data-oc-workspace="stable-v30"] .oc-popular-link,
body[data-oc-workspace="stable-v30"] .oc-category-link{
  min-width:0!important;
  max-width:100%!important;
}

@media(max-width:1100px){
  body[data-oc-workspace="stable-v30"] .oc-share-panel{
    grid-template-columns:1fr!important;
  }
  body[data-oc-workspace="stable-v30"] .oc-share-actions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:820px){
  body[data-oc-workspace="stable-v30"] .oc-share-actions,
  body[data-oc-workspace="stable-v30"] .oc-popular-grid,
  body[data-oc-workspace="stable-v30"] .oc-category-completion-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body[data-oc-workspace="stable-v30"] footer.oc-universal-footer{
    border-radius:20px!important;
  }
}
@media(max-width:560px){
  body[data-oc-workspace="stable-v30"] .oc-share-actions,
  body[data-oc-workspace="stable-v30"] .oc-discovery-grid,
  body[data-oc-workspace="stable-v30"] .oc-popular-grid,
  body[data-oc-workspace="stable-v30"] .oc-category-completion-grid{
    grid-template-columns:1fr!important;
  }
  body[data-oc-workspace="stable-v30"] .oc-share-panel,
  body[data-oc-workspace="stable-v30"] .oc-discovery,
  body[data-oc-workspace="stable-v30"] .oc-category-completion{
    padding:18px!important;
    border-radius:18px!important;
  }
  body[data-oc-workspace="stable-v30"] footer.oc-universal-footer{
    margin-top:28px!important;
    border-radius:18px!important;
  }
}