/* Approved UI refinements: the light desktop shell and floating dock geometry stay intact. */
body.ofp-approved-ui .approved-hero h1 em[data-hero-rotate]{display:inline-block;white-space:nowrap;transition:opacity .24s ease,transform .24s ease}
body.ofp-approved-ui .approved-hero h1 em[data-hero-rotate].is-exiting{opacity:0;transform:translateY(-7px)}
@media(min-width:1101px){
  body.ofp-approved-ui .hero-action-list a:nth-child(2){transform:translateX(-24px)}
  body.ofp-approved-ui .hero-action-list a:nth-child(3){transform:translateX(-48px)}
  body.ofp-approved-ui .hero-action-list a:nth-child(4){transform:translateX(-31px)}
  body.ofp-approved-ui .hero-action-list a:nth-child(5){transform:translateX(-8px)}
}

/* The supplied 1200×300 partner art is displayed as an actual full-width banner. */
body.ofp-approved-ui .partner-slot{grid-template-columns:minmax(0,1fr);justify-items:center;gap:15px;margin:20px 4px}
body.ofp-approved-ui .partner-slot a{width:min(100%,1200px);aspect-ratio:4/1}
body.ofp-approved-ui .partner-slot img{width:100%;height:100%;aspect-ratio:auto;object-fit:contain}

/* Keep Charmon attached to its speech bubble while it glides between viewport edges. */
body.ofp-approved-ui .charmon-float{animation:none;transition:transform 4.2s cubic-bezier(.45,0,.2,1);will-change:transform}
body.ofp-approved-ui .charmon-float.is-high{transform:translate3d(0,calc(-100dvh + 365px),0)}
body.ofp-approved-ui .charmon-mascot{animation:charmon-float 7s ease-in-out infinite}
body.ofp-approved-ui .charmon-float.is-peeking{animation:none}
body.ofp-approved-ui .charmon-float.is-peeking .charmon-mascot{animation:charmon-peek 3.3s ease-in-out 1}
body.ofp-approved-ui .charmon-bubble{top:2px;right:86px}

/* Dark uses its own readable surfaces; light colors above are untouched. */
html[data-theme="dark"] body.ofp-approved-ui{
  --paper:#101827;--navy:#f1f5ff;--blue:#d8e5ff;--ink:#f1f5ff;--muted:#b8c8e0;
  --surface:#17243b;--canvas:#101827;--card:#1e2d47;--soft:#23334d;--border:#465671;
  background:#101827;color:#edf2ff
}
html[data-theme="dark"] body.ofp-approved-ui .approved-hero,
html[data-theme="dark"] body.ofp-approved-ui .approved-tool-hero{
  background-color:#17243b;
  background-image:linear-gradient(115deg,#0d172beb,#1a2a45cc),url(approved-magnifier.webp);
  background-position:center;
  background-size:cover;
  box-shadow:inset 0 0 1px #ad8c52
}
html[data-theme="dark"] body.ofp-approved-ui :is(.approved-hero h1,.approved-tool-hero h1,.approved-section-heading h2,.approved-more h2,.approved-support h2,.related-head h2,.charmon-panel-head h2){color:#fffaf2}
html[data-theme="dark"] body.ofp-approved-ui :is(.approved-hero-copy>p,.approved-tool-hero p,.hero-action-list a,.hero-action-list small,.hero-charmon-card small,.approved-world-desc){color:#dbe6fa}
html[data-theme="dark"] body.ofp-approved-ui :is(.header-search,.approved-hero-search,.hero-action-list svg,.hero-charmon-card,.approved-more,.approved-support,.charmon-panel){background:#1d2d48;color:#f1f5ff;border-color:#52627f}
html[data-theme="dark"] body.ofp-approved-ui .header-search kbd{background:#34435b;color:#eef4ff}
html[data-theme="dark"] body.ofp-approved-ui .approved-hero-search input{color:#f6f9ff}
html[data-theme="dark"] body.ofp-approved-ui .approved-hero-search input::placeholder{color:#b8c8df}
html[data-theme="dark"] body.ofp-approved-ui .approved-hero-search svg{color:#d8e5ff}
html[data-theme="dark"] body.ofp-approved-ui .approved-hero-search button{color:#19273e}
html[data-theme="dark"] body.ofp-approved-ui .hero-action-list svg{color:#ffc558;box-shadow:0 4px 18px #0007}
html[data-theme="dark"] body.ofp-approved-ui .hero-charmon-card strong{color:#f8f6ef}
html[data-theme="dark"] body.ofp-approved-ui .hero-charmon-arrow{color:#17243b}
html[data-theme="dark"] body.ofp-approved-ui .approved-world{border-color:#40536f;box-shadow:0 5px 18px #0005}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-general{color:#1b2335;border-color:#e9b845}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-general .approved-world-desc{color:#1b2335}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-games{background:linear-gradient(145deg,#181c25,#273044);color:#fff}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-utilities{background:#273344;color:#f1f5ff}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-developer{background:#173c3e;color:#edfff9}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-academic{background:#423526;color:#fff3d6}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-business{background:#20395f;color:#f1f6ff}
html[data-theme="dark"] body.ofp-approved-ui .approved-world-ai{background:#392750;color:#fbf2ff}
html[data-theme="dark"] body.ofp-approved-ui :is(.approved-world-utilities,.approved-world-developer,.approved-world-academic,.approved-world-business,.approved-world-ai) .approved-world-desc{color:inherit}
html[data-theme="dark"] body.ofp-approved-ui :is(.approved-world-utilities,.approved-world-developer,.approved-world-academic,.approved-world-business,.approved-world-ai) .approved-world-top{color:inherit}
html[data-theme="dark"] body.ofp-approved-ui .approved-tool-hero .save-tool{background:#21324f;color:#f0f5ff;border-color:#60718f}
html[data-theme="dark"] body.ofp-approved-ui :is(.approved-related,.approved-categories,.related-item,.approved-categories>a){background:#1c2b44;border-color:#435572;color:#f1f5ff}
html[data-theme="dark"] body.ofp-approved-ui :is(.related-item small,.approved-categories small){color:#bbcae4}
html[data-theme="dark"] body.ofp-approved-ui .charmon-panel-head{background:#253958;border-color:#4b5f7d}
html[data-theme="dark"] body.ofp-approved-ui :is(.charmon-panel-head small,.charmon-disclosure,.charmon-match small){color:#c4d2e8}
html[data-theme="dark"] body.ofp-approved-ui .charmon-messages p{background:#293954;color:#f0f4ff}
html[data-theme="dark"] body.ofp-approved-ui .charmon-messages p.charmon-user{background:#574525;color:#fff4d4}
html[data-theme="dark"] body.ofp-approved-ui .charmon-match>a{background:#253754;border-color:#60718d;color:#edf3ff}
html[data-theme="dark"] body.ofp-approved-ui .charmon-match>a:first-of-type{background:#4c3d20;border-color:#daa634;color:#fff1cf}
html[data-theme="dark"] body.ofp-approved-ui .charmon-panel form{border-color:#526581}
html[data-theme="dark"] body.ofp-approved-ui .charmon-panel form input{background:#14223a;border-color:#5b6c87;color:#f7f9ff}
html[data-theme="dark"] body.ofp-approved-ui .charmon-bubble{background:#21324f;border-color:#60718e;color:#f6f9ff}
html[data-theme="dark"] body.ofp-approved-ui .charmon-bubble:after{background:#21324f;border-color:#60718e}
html[data-theme="dark"] body.ofp-approved-ui .approved-dock{background:#172640ec;border-color:#65748e;color:#f2f6ff}
html[data-theme="dark"] body.ofp-approved-ui .orb-menu{background:conic-gradient(from 40deg,#1e2d49,#273c5c,#1a2943,#273c5c,#1e2d49);border-color:#536582;box-shadow:0 4px 40px #000a,0 0 24px #ffbd5c77,inset 0 0 23px #466081}
html[data-theme="dark"] body.ofp-approved-ui .orb-menu:before{border-color:#687894}
html[data-theme="dark"] body.ofp-approved-ui .orb-close{background:#30425f;color:#f1f6ff}
html[data-theme="dark"] body.ofp-approved-ui .orb-action:hover{background:#3a4d69}
html[data-theme="dark"] body.ofp-approved-ui .orb-search{color:#1a253b}
html[data-theme="dark"] body.ofp-approved-ui .orb-events{color:#ffd16f}
html[data-theme="dark"] body.ofp-approved-ui .site-footer{border-color:#41516b;color:#d4e0f3}
html[data-theme="dark"] body.ofp-approved-ui .site-footer strong{color:#f6f7ff}

@media(max-width:780px){
  body.ofp-approved-ui .approved-hero{display:flex;flex-direction:column;min-height:0;padding:30px 25px 23px}
  body.ofp-approved-ui .approved-hero-copy{align-self:stretch;grid-row:auto}
  body.ofp-approved-ui .approved-hero h1{max-width:100%;margin-bottom:13px;font-size:clamp(42px,7.4vw,58px);line-height:.98}
  body.ofp-approved-ui .approved-hero-copy>p{margin-bottom:15px;font-size:14px;line-height:1.32}
  body.ofp-approved-ui .approved-hero-search{height:55px}
  body.ofp-approved-ui .approved-worlds{padding-top:11px}
  body.ofp-approved-ui.home .charmon-float,
  body.ofp-approved-ui.home .charmon-float.is-scrolled{top:146px;bottom:auto;right:8px}
  body.ofp-approved-ui.home .charmon-float.is-high{transform:translate3d(0,72px,0)}
}
@media(max-width:560px){
  body.ofp-approved-ui .approved-hero{min-height:0;padding:26px 18px 18px;background-size:cover;background-position:58% center}
  body.ofp-approved-ui .approved-hero h1{max-width:calc(100% - 118px);margin-bottom:10px;font-size:clamp(36px,9.6vw,43px);line-height:.98}
  body.ofp-approved-ui .approved-hero-copy>p{margin-bottom:12px;font-size:13px;line-height:1.28}
  body.ofp-approved-ui .approved-hero-search{height:52px}
  body.ofp-approved-ui .approved-worlds{padding:10px 3px 15px}
  body.ofp-approved-ui .approved-section-heading h2{font-size:clamp(28px,7.3vw,34px)}
  body.ofp-approved-ui .approved-world-grid{margin-top:10px}
  body.ofp-approved-ui .approved-world{min-height:157px}
  body.ofp-approved-ui .approved-world strong{font-size:21px}
  body.ofp-approved-ui .approved-world-desc{font-size:11px}
  body.ofp-approved-ui .approved-world-icon{width:42px;height:42px;margin:6px 0 4px}
  body.ofp-approved-ui.home .charmon-float,
  body.ofp-approved-ui.home .charmon-float.is-scrolled{top:157px;bottom:auto;right:5px;width:128px;height:120px}
  body.ofp-approved-ui.home .charmon-float.is-high{transform:translate3d(0,76px,0)}
  body.ofp-approved-ui .charmon-bubble{top:-29px;right:0;width:143px;padding:8px 10px;border-radius:17px;font-size:10px;line-height:1.18}
  body.ofp-approved-ui .charmon-bubble:after{right:32px;bottom:-7px;border-top:0;border-bottom:1px solid #f5e4d0}
  body.ofp-approved-ui .charmon-float:not(.is-high){transform:translate3d(0,0,0)}
  body.ofp-approved-ui .charmon-float.is-high{transform:translate3d(0,calc(-100dvh + 360px),0)}
  body.ofp-approved-ui.home .charmon-float.is-high{transform:translate3d(0,76px,0)}
  body.ofp-approved-ui .partner-slot{gap:12px;margin:16px 3px}
  body.ofp-approved-ui .partner-slot a{width:100%}
}
@media(prefers-reduced-motion:reduce){
  body.ofp-approved-ui .charmon-float,body.ofp-approved-ui .charmon-mascot,body.ofp-approved-ui .approved-hero h1 em[data-hero-rotate]{animation:none!important;transition:none!important}
}