/* C4TM30W v377 site-only corrections. Maker runtime files are not modified. */

/* Old small floating chibis are intentionally not used anymore. */
.page-chibi-decoration{display:none!important}

/* Readability rule: Scratchmeow is for real structural headers/project names/navigation,
   NOT program names, creator names, recommendations, video/VOD/stream titles or buttons. */
html body :is(button,.button,input,select,textarea,label,p,small,.tool-card-copy,.recommendation-card,.creator-card,.media-card,.playlist-card,.schedule-item){font-family:Inter,"Segoe UI",Arial,sans-serif}
html body :is(.tool-card-copy h1,.tool-card-copy h2,.tool-card-copy h3,.tool-card-copy h4,
.recommendation-card h1,.recommendation-card h2,.recommendation-card h3,.recommendation-card h4,
.creator-card h1,.creator-card h2,.creator-card h3,.creator-card h4,.creator-name,
.media-card h1,.media-card h2,.media-card h3,.media-card h4,.media-card-copy h1,.media-card-copy h2,.media-card-copy h3,
.playlist-card h1,.playlist-card h2,.playlist-card h3,.playlist-card h4,
.schedule-item h1,.schedule-item h2,.schedule-item h3,.schedule-item h4,
.cs2-service-card h1,.cs2-service-card h2,.cs2-service-card h3,.cs2-service-card h4,
.game-card h1,.game-card h2,.game-card h3,.game-card h4,
.steam-profile h3,.steam-large h2,[data-live-page-title],[data-live-title],[data-stream-title],[data-video-title],[data-vod-title],.video-title,.stream-title,.program-name,.tool-name,.service-name){
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;font-weight:700!important;text-transform:none!important;letter-spacing:normal!important;font-synthesis:auto!important
}
/* Navigation stays branded as previously agreed. */
.sidebar-nav a span,.sidebar-brand-text,.mobile-brand,.scratchmeow-menu-glyph{font-family:"Scratchmeow5",Inter,"Segoe UI",Arial,sans-serif!important}

/* Footer occupies exactly the same usable width as the rest of the site and looks like part of it. */
body[data-page] .page-footer{width:calc(100% - var(--c4-page-edge) - var(--c4-page-edge))!important;max-width:none!important;margin:clamp(12px,1vw,18px) auto clamp(18px,2vw,30px)!important;padding:18px clamp(16px,1.6vw,26px)!important;border:1px solid var(--line)!important;border-radius:14px!important;background:linear-gradient(145deg,rgba(24,14,38,.88),rgba(8,6,14,.96))!important;box-sizing:border-box!important}
body[data-page] .page-footer .footer-meta-row{width:100%!important;max-width:none!important;margin:0!important;justify-content:space-between!important}
body[data-page] .follow-platform-strip{box-sizing:border-box!important;width:calc(100% - var(--c4-page-edge) - var(--c4-page-edge))!important;max-width:none!important;margin:clamp(10px,1vw,16px) auto 0!important}

/* Every personal Steam profile panel uses the same supplied full-card background. */
article.steam-panel,article.steam-profile-panel{position:relative!important;overflow:hidden!important;isolation:isolate!important;background:#0b0712!important}
article.steam-panel::before,article.steam-profile-panel::before{content:""!important;position:absolute!important;inset:0!important;z-index:0!important;pointer-events:none!important;opacity:.68!important;background-image:linear-gradient(90deg,rgba(8,5,14,.78),rgba(8,5,14,.48) 58%,rgba(19,8,31,.56)),url('../images/brand/steam-profile-background.png')!important;background-position:center 30%!important;background-size:cover!important;background-repeat:no-repeat!important}
article.steam-panel>*,article.steam-profile-panel>*{position:relative!important;z-index:1!important;background-color:transparent!important}
article.steam-profile-panel .panel-body{background:transparent!important}
article.steam-profile-panel .info-pairs>div,article.steam-profile-panel .button{background-color:rgba(9,6,15,.76)!important;backdrop-filter:blur(2px)}

/* Tools: maximum THREE cards per row on desktop. Filler art only uses the user-approved image set. */
body[data-page="tools"] main.page-content>.tools-categories .tools-category-grid{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:clamp(14px,1.25vw,20px)!important;align-items:stretch!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-card-pro{min-height:138px!important;height:100%!important;display:grid!important;grid-template-columns:66px minmax(0,1fr)!important;align-items:center!important;gap:20px!important;padding:17px 18px!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-logo-box{align-self:start!important;margin-top:2px!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy{min-width:0!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto 1fr!important;column-gap:16px!important;row-gap:7px!important;align-items:start!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy>h2,
body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy>h3{grid-column:1!important;grid-row:1!important;margin:0!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy>p{grid-column:1!important;grid-row:2!important;margin:0!important;align-self:start!important;line-height:1.5!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-actions{grid-column:2!important;grid-row:1 / span 2!important;align-self:center!important;justify-self:end!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:7px!important;margin:0!important;min-width:108px!important}
body[data-page="tools"] main.page-content>.tools-categories .tool-actions .button{width:auto!important;min-width:108px!important;margin:0!important;text-align:center!important;justify-content:center!important;white-space:nowrap!important;padding-inline:12px!important}
body[data-page="tools"] .tools-image-card{position:relative;display:block;min-height:138px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#0b0712;box-shadow:inset 0 1px 0 rgba(255,255,255,.025)}
body[data-page="tools"] .tools-image-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.82;filter:saturate(.9) contrast(1.03)}
body[data-page="tools"] .tools-image-card::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,5,14,.10),rgba(10,5,17,.44))}
@media(max-width:1280px) and (min-width:761px){body[data-page="tools"] main.page-content>.tools-categories .tools-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:760px){
  body[data-page="tools"] main.page-content>.tools-categories .tools-category-grid{grid-template-columns:minmax(0,1fr)!important}
  body[data-page="tools"] .tools-image-card{display:none!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-card-pro{grid-template-columns:54px minmax(0,1fr)!important;padding:13px!important;gap:14px!important;min-height:0!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-logo-box{width:54px!important;height:54px!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy{grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto auto auto!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy>h2,body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy>h3{grid-column:1!important;grid-row:1!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-card-copy>p{grid-column:1!important;grid-row:2!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-actions{grid-column:1!important;grid-row:3!important;justify-self:end!important;flex-direction:row!important;flex-wrap:wrap!important;margin-top:8px!important;min-width:0!important}
  body[data-page="tools"] main.page-content>.tools-categories .tool-actions .button{min-width:0!important}
}


/* Retired plural /chibis decoration set: never show the old Goal Maker/tool filler chibis. */


/* v377: remove legacy decorative chibi filler. Approved filler art only is used elsewhere. */
body[data-page="dashboard"] .analytics-panel::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

/* Keep embedded maker crop inside its wrapper so hidden duplicate maker headers cannot spill. */
.maker-project-body {
  overflow: hidden !important;
}

/* Fill the one genuinely empty CS2 checker grid cell with approved CS2 art on desktop only. */
@media(min-width:901px){
  body[data-page="counter-strike-checker"] .cs2-approved-filler{position:relative;display:block;min-height:86px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0b0712}
  body[data-page="counter-strike-checker"] .cs2-approved-filler img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.78;filter:saturate(.92) contrast(1.03)}
  body[data-page="counter-strike-checker"] .cs2-approved-filler::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,5,12,.08),rgba(8,5,14,.38))}
}
@media(max-width:900px){body[data-page="counter-strike-checker"] .cs2-approved-filler{display:none!important}}


/* v379 — ENGLISH MASTER structural corrections. Site/wrapper presentation only. */

/* 1) Never turn an odd Tools card into a giant full-row card. Desktop is max 3 cards;
      approved images occupy genuine empty grid cells as cards. */
@media(min-width:821px){
  body[data-page="tools"] .tools-category-grid>.tool-card-pro:last-child:nth-child(odd){
    grid-column:auto!important;
    min-height:138px!important;
    padding-right:18px!important;
  }
  body[data-page="tools"] .tools-category-grid>.tool-card-pro:last-child:nth-child(odd)::after{
    display:none!important;content:none!important;background:none!important;
  }
}
body[data-page="tools"] main.page-content>.tools-categories .tool-card-pro{gap:22px!important}

/* 2) Approved filler art is a real layout cell/card, never a sticker in a page-title corner. */
body[data-page] .page-title-row::after{content:none!important;display:none!important;background:none!important}
body[data-page="tools"] .tools-image-card,
body[data-page="projects"] .project-layout-filler,
body[data-page="counter-strike-checker"] .cs2-approved-filler{
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#0b0712!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
body[data-page="projects"] .project-layout-filler{
  position:relative;display:block;min-height:430px;
}
body[data-page="projects"] .project-layout-filler img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.82;
}
body[data-page="projects"] .project-layout-filler::after,
body[data-page="tools"] .tools-image-card::after,
body[data-page="counter-strike-checker"] .cs2-approved-filler::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(135deg,rgba(8,5,14,.08),rgba(9,5,15,.38));
}
@media(max-width:900px){
  body[data-page="projects"] .project-layout-filler,
  body[data-page="tools"] .tools-image-card,
  body[data-page="counter-strike-checker"] .cs2-approved-filler{display:none!important}
}

/* 3) About page: one approved chibi-art box that slowly cycles through the full approved set. */
body[data-page="about"] .about-filler-rotator{
  position:relative!important;min-height:300px!important;overflow:hidden!important;
  border-right:1px solid var(--line)!important;background:#08050e!important;
}
body[data-page="about"] .about-filler-rotator img{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;object-fit:cover!important;object-position:center!important;
  opacity:.86!important;transition:opacity .55s ease!important;
}
body[data-page="about"] .about-filler-rotator img.is-changing{opacity:.18!important}
@media(max-width:900px){
  body[data-page="about"] .about-filler-rotator{display:none!important}
}

/* 4) Goal Maker: the maker ends where its real content ends. No fake filler and no huge dead area. */
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap::after{display:none!important;content:none!important;background:none!important}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel{margin-bottom:var(--section-gap)!important}
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap{height:auto!important;min-height:0!important;padding:0!important;margin:0!important}
body[data-page="goal-maker-shell"] .goal-maker-embed{min-height:0!important;margin-bottom:0!important}

/* 5) Exact font scope: Scratchmeow only for real structural headers, navigation, project names,
      and intentional C4TM30W filler branding. Content names/titles remain readable. */
html body :is(.eyebrow,.maker-byline,.project-card-author,.button,.text-link,.top-link,.live-chip,
  .tool-card-copy,.tool-card-copy h1,.tool-card-copy h2,.tool-card-copy h3,.tool-card-copy h4,
  .recommendation-card,.recommendation-card h1,.recommendation-card h2,.recommendation-card h3,.recommendation-card h4,
  .creator-name,.media-card,.media-card h1,.media-card h2,.media-card h3,.media-card h4,
  .playlist-card,.playlist-card h1,.playlist-card h2,.playlist-card h3,.playlist-card h4,
  .schedule-item,.schedule-item h1,.schedule-item h2,.schedule-item h3,.schedule-item h4,
  .steam-profile h3,.steam-large h2,.game-card h2,.game-card h3,.cs2-service-card strong,
  [data-live-page-title],[data-live-title],[data-stream-title],[data-video-title],[data-vod-title],
  .video-title,.stream-title,.program-name,.tool-name,.service-name){
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  text-transform:none!important;
  letter-spacing:normal!important;
  font-synthesis:auto!important;
}
html body .c4tm30w-filler{
  font-family:"Scratchmeow5","Rajdhani","Arial Narrow",Arial,sans-serif!important;
  font-weight:400!important;text-transform:uppercase!important;letter-spacing:.04em!important;
}

/* 6) Keep normal outer rhythm; old title-art rules must never force 145px headers. */
body[data-page]:not([data-page="dashboard"]) .page-title-row{min-height:0!important;padding-right:0!important}

/* 7) Footer/follow block use the same content width; no disconnected narrow footer. */
body[data-page] .page-footer,
body[data-page] .follow-platform-strip{
  width:calc(100% - var(--c4-page-edge) - var(--c4-page-edge))!important;
  max-width:none!important;
  box-sizing:border-box!important;
}
@media(max-width:900px){
  body[data-page="about"] .cat-family-feature{grid-template-columns:1fr!important;min-height:0!important}
  body[data-page="about"] .cat-family-feature .panel-body{grid-column:1!important;width:100%!important}
}

/* v380 — visual cleanup after screenshot audit. Wrapper/site presentation only. */

/* Never show two image filler cards side-by-side. When a row has two spare cells,
   the second spare cell is C4TM30W branding, not another image. */
body[data-page="tools"] .tools-brand-filler,
body[data-page="projects"] .project-brand-filler{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:138px!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 30%,rgba(154,72,245,.15),transparent 42%),
    linear-gradient(135deg,#0b0712,#10091a)!important;
  color:#efe7ff!important;
  font-size:clamp(2rem,3.5vw,4.2rem)!important;
  line-height:1!important;
  text-align:center!important;
  opacity:.86!important;
}
body[data-page="projects"] .project-brand-filler{min-height:430px!important}
@media(max-width:900px){
  body[data-page="tools"] .tools-brand-filler,
  body[data-page="projects"] .project-brand-filler{display:none!important}
}

/* Project detail pages: page title is the one project name. The content card starts
   with status/type/description, never a second copy of the project name. */
body[data-page^="project-"] .real-project-header .real-project-lead{margin-top:8px!important}

/* Goal Maker wrapper: kill the old 5300px fallback completely. The integration script
   measures the untouched maker at runtime; this is only a safe pre-load height. */
body[data-page="goal-maker-shell"] main.page-content{min-height:0!important;padding-bottom:18px!important}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel,
body[data-page="goal-maker-shell"] .goal-maker-shell-panel .panel-body,
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap{
  min-height:0!important;
  height:auto!important;
  margin-bottom:0!important;
  padding-bottom:0!important;
}
body[data-page="goal-maker-shell"] .goal-maker-embed{
  display:block!important;
  width:100%!important;
  height:1100px!important;
  min-height:0!important;
  border:0!important;
  margin-bottom:0!important;
  background:#090712!important;
}

/* Frame & Media / Scene Maker: outer website title is the only page title. The iframe
   viewport crops the untouched maker's own promotional header, then auto-fits content. */
.maker-project-body{overflow:hidden!important;padding-top:0!important;padding-bottom:0!important}
.maker-project-page .maker-frame{
  display:block!important;
  width:100%!important;
  height:980px!important;
  min-height:0!important;
  margin-bottom:0!important;
  border-radius:12px!important;
}
.maker-project-page.is-scene-maker .maker-frame{height:1120px!important}
@media(max-width:900px){
  .maker-project-page .maker-frame,
  .maker-project-page.is-frame-studio .maker-frame,
  .maker-project-page.is-scene-maker .maker-frame{height:1450px!important;min-height:0!important}
}

/* v381 — English visual correction after live screenshot review. Site/wrapper only. */

/* Tools: incomplete desktop rows get exactly ONE image. If two cells are free, that one
   image spans the complete remaining width. Never pair an image with C4TM30W beside it. */
body[data-page="tools"] .tools-brand-filler{display:none!important}
@media(min-width:1281px){
  body[data-page="tools"] .tools-category-grid>.tools-image-card.tools-image-wide{grid-column:span 2!important}
}
@media(max-width:1280px) and (min-width:761px){
  body[data-page="tools"] .tools-category-grid>.tools-image-card.tools-image-wide{grid-column:span 1!important}
}

/* Project detail pages: exactly one project identity block. No generic duplicate page
   heading above the real project card. */
body[data-page^="project-"] .page-title-row.project-page-heading{display:none!important}
body[data-page^="project-"] .project-identity{margin:0 0 14px!important;padding:0!important}
body[data-page^="project-"] .project-identity .maker-byline{margin:0 0 5px!important}
body[data-page^="project-"] .project-identity h1{margin:0!important;font-size:clamp(2rem,3.4vw,4rem)!important;line-height:1.03!important}
body[data-page^="project-"] .project-detail-back{margin:0 0 18px!important}

/* Makers: the website header is the only maker identity/info block. Embedded old headers
   are hidden by wrapper JS; wrapper itself stays compact and content-sized. */
.maker-project-page>.real-project-header{margin-bottom:0!important}
.maker-project-page>.maker-project-body{margin-top:0!important}
.maker-project-page .maker-frame{margin-top:0!important}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel{margin-top:10px!important;margin-bottom:14px!important}
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap{overflow:hidden!important}
body[data-page="goal-maker-shell"] .goal-maker-embed{height:760px!important;min-height:0!important;margin:0!important}


/* v382 — ENGLISH MASTER HARD RULES. WEBSITE PRESENTATION ONLY. */
/* One tool/project = ONE visible identity/name/info block. Embedded maker promo headers are
   hidden by wrapper JS; never reproduce their name in the outer page a second time. */
.maker-project-page>.real-project-header{padding-bottom:18px!important}
.maker-project-page>.maker-project-body{border-top:1px solid var(--line)!important;padding-top:0!important}
.maker-project-page .maker-frame{height:900px!important;min-height:0!important;margin:0!important;border:0!important}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel{margin:12px 0 14px!important;padding:0!important;min-height:0!important;height:auto!important}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel>.panel-body{padding:0!important;min-height:0!important;height:auto!important}
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap{padding:0!important;margin:0!important;min-height:0!important;height:auto!important;overflow:hidden!important}
body[data-page="goal-maker-shell"] .goal-maker-embed{display:block!important;width:100%!important;height:1000px!important;min-height:0!important;margin:0!important;border:0!important;background:#090712!important}
body[data-page="goal-maker-shell"] main.page-content{min-height:0!important;padding-bottom:0!important}
/* No giant dead space between page content and footer. */
body[data-page="goal-maker-shell"] .page-footer{margin-top:14px!important}
/* Counter-Strike has two real views; on each sub-page show ONLY the link to the other view. */
.counter-subnav{display:flex!important;gap:10px!important;align-items:center!important;flex-wrap:wrap!important}
.counter-subnav>a{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:42px!important;padding:9px 16px!important;border:1px solid var(--line)!important;border-radius:10px!important;background:rgba(20,12,31,.78)!important;text-decoration:none!important}
/* Retired old site chibis are not used as page/sidebar decoration. */
.sidebar-chibi{display:none!important}
.support-hero .support-brand-filler{display:flex!important;align-items:center!important;justify-content:center!important;align-self:stretch!important;min-width:260px!important;padding:20px!important;font-size:clamp(2.4rem,4vw,5rem)!important;opacity:.9!important}
@media(max-width:900px){.support-hero .support-brand-filler{display:none!important}}


/* v383 — HARD NO-DOUBLE-HEADER FALLBACK. WEBSITE WRAPPER ONLY. */
/* The iframe itself is moved upward inside an overflow-hidden website wrapper. This hides
   the maker's own identity/promo header WITHOUT editing the maker files. External wrapper JS
   then measures the exact crop/height when same-origin access is available. */
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap{overflow:hidden!important;min-height:0!important;height:auto!important;padding:0!important;margin:0!important}
body[data-page="goal-maker-shell"] .goal-maker-embed{display:block!important;width:100%!important;margin-top:-132px!important;height:1250px!important;min-height:0!important;border:0!important;background:#090712!important}
.maker-project-body{overflow:hidden!important;min-height:0!important;height:auto!important;padding:0!important;margin:0!important}
.maker-project-page.is-frame-studio .maker-frame{display:block!important;width:100%!important;margin-top:-180px!important;height:1350px!important;min-height:0!important;border:0!important}
.maker-project-page.is-scene-maker .maker-frame{display:block!important;width:100%!important;margin-top:-175px!important;height:1350px!important;min-height:0!important;border:0!important}
/* The website owns the single visible maker identity block. */
.maker-project-page>.real-project-header{margin-bottom:0!important}
body[data-page="goal-maker-shell"] .page-title-row{margin-bottom:8px!important}
@media(max-width:900px){
  body[data-page="goal-maker-shell"] .goal-maker-embed{margin-top:-150px!important;height:1900px!important}
  .maker-project-page.is-frame-studio .maker-frame{margin-top:-210px!important;height:2100px!important}
  .maker-project-page.is-scene-maker .maker-frame{margin-top:-190px!important;height:1900px!important}
}


/* ========================================================================== 
   v384 — ENGLISH VISUAL HARD RULES
   Site/wrapper presentation only. Feature/maker runtime files are untouched.
   ========================================================================== */

/* FONT CONTRACT
   Scratchmeow = MAIN PAGE HEADER + NAVIGATION + intentional slim C4TM30W filler ONLY.
   Everything else stays readable. */
html body :is(h2,h3,h4,h5,h6,.eyebrow,.panel-title,.panel-head h1,.panel-head h2,.panel-head h3,
  .tools-category-title,.section-title,.sectionTitle,.subsectionTitle,.real-project-lead,
  .support-action h2,.recommendation-card h2,.recommendation-card h3,.project-card-v4 h2,
  .project-card-v4 h3,.category-head h2,.cs2-checker-head h2,.counter-subnav a,
  .real-project-badges,.maker-byline,.projectEyebrow,.projectBadges,.projectModeBadge) {
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  font-weight:700!important;
  letter-spacing:normal!important;
  text-transform:none!important;
  font-synthesis:auto!important;
}
html body :is(.page-content p,.page-content li,.page-content a.button,.page-content button,
  .page-content input,.page-content select,.page-content textarea,.page-content label,
  .page-content .tool-card-copy,.page-content .tool-card-copy h2,.page-content .tool-card-copy h3,
  .page-content .service-name,.page-content .program-name,.page-content .creator-name,
  .page-content .video-title,.page-content .stream-title,.page-content .playlist-card h3,
  .page-content .recommendation-card h3,.page-content .settings-list strong) {
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
}
/* Only true SITE page titles use the display font. */
html body main.page-content>.page-title-row h1,
html body main.page-content>.support-hero h1,
html body main.page-content>.maker-project-page>.real-project-header h1,
html body[data-page^="project-"] .project-identity h1 {
  font-family:"Scratchmeow5",Inter,"Segoe UI",Arial,sans-serif!important;
  font-weight:400!important;
  letter-spacing:.01em!important;
  text-transform:uppercase!important;
  font-synthesis:none!important;
}
html body .sidebar-nav a span,
html body .mobile-brand,
html body .scratchmeow-menu-glyph,
html body .c4tm30w-filler {
  font-family:"Scratchmeow5",Inter,"Segoe UI",Arial,sans-serif!important;
}

/* SPACING CONTRACT — no unexplained dead zones between header and first content. */
body[data-page]:not([data-page="dashboard"]) main.page-content{
  padding-top:clamp(16px,1.2vw,22px)!important;
  padding-bottom:clamp(18px,1.5vw,26px)!important;
  min-height:0!important;
}
body[data-page]:not([data-page="dashboard"]) main.page-content>*+*{
  margin-top:clamp(12px,1vw,18px)!important;
}
body[data-page]:not([data-page="dashboard"]) .page-title-row{
  margin-bottom:0!important;
  min-height:0!important;
}
body[data-page]:not([data-page="dashboard"]) .content-section{
  margin-top:clamp(12px,1vw,18px)!important;
}
body[data-page] .loading,
body[data-page] .empty,
body[data-page] .error{
  min-height:0!important;
  padding:clamp(12px,1vw,16px)!important;
}
body[data-page] .error[hidden],
body[data-page] .loading[hidden],
body[data-page] .empty[hidden]{display:none!important}
body[data-page="games"] .page-title-row+.panel,
body[data-page="recommendations"] .page-title-row+*,
body[data-page="schedule"] .page-title-row+*{
  margin-top:clamp(12px,1vw,18px)!important;
}
body[data-page] .follow-platform-strip{margin-top:clamp(12px,1vw,18px)!important}
body[data-page] .page-footer{margin-top:clamp(12px,1vw,18px)!important}

/* Counter-Strike sibling page switch MUST read as a real action, not random text. */
.counter-subnav{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:8px!important;
  border:1px solid rgba(188,108,255,.32)!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,rgba(38,19,58,.82),rgba(15,9,25,.90))!important;
  width:fit-content!important;
  max-width:100%!important;
}
.counter-subnav>a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:44px!important;
  padding:10px 18px!important;
  border:1px solid rgba(190,105,255,.58)!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,rgba(145,48,255,.38),rgba(83,28,160,.22))!important;
  color:#f5edff!important;
  font-family:Inter,"Segoe UI",Arial,sans-serif!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:0 0 18px rgba(157,70,255,.10)!important;
}
.counter-subnav>a:hover{border-color:#ca77ff!important;background:linear-gradient(135deg,rgba(158,58,255,.52),rgba(99,35,183,.32))!important}

/* Approved filler rule: if the space is tall enough for art, use ONE image spanning it.
   C4TM30W text filler is only for narrow/slim decorative gaps. */
body[data-page="tools"] .tools-brand-filler,
body[data-page="projects"] .project-brand-filler{display:none!important}
body[data-page="projects"] .project-layout-filler.project-layout-wide{grid-column:span 2!important}
body[data-page="tools"] .tools-image-card.tools-image-wide{grid-column:span 2!important}
.support-hero .support-brand-filler{display:none!important}
.support-hero .support-image-filler{
  display:block!important;
  position:relative!important;
  align-self:stretch!important;
  min-width:min(34vw,420px)!important;
  min-height:190px!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#090712!important;
}
.support-hero .support-image-filler img{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;opacity:.86!important}
.support-hero .support-image-filler::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,5,14,.08),rgba(8,5,14,.34))}
@media(max-width:900px){
  .support-hero .support-image-filler,
  body[data-page="projects"] .project-layout-filler,
  body[data-page="tools"] .tools-image-card{display:none!important}
}

/* MAKER WRAPPERS: the website owns the ONE visible maker name/info header.
   Iframe runtime headers are hidden by wrapper JS, so do not use negative-margin cropping. */
body[data-page="goal-maker-shell"] .goal-maker-embed,
.maker-project-page.is-frame-studio .maker-frame,
.maker-project-page.is-scene-maker .maker-frame{
  margin-top:0!important;
  min-height:0!important;
  border:0!important;
}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel,
body[data-page="goal-maker-shell"] .goal-maker-shell-panel>.panel-body,
body[data-page="goal-maker-shell"] .goal-maker-embed-wrap,
.maker-project-page>.maker-project-body{
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  margin-bottom:0!important;
  overflow:hidden!important;
}
body[data-page="goal-maker-shell"] .goal-maker-shell-panel{margin-top:clamp(10px,.8vw,14px)!important;margin-bottom:clamp(10px,.8vw,14px)!important}
.maker-project-page>.real-project-header{padding-bottom:clamp(14px,1.2vw,20px)!important;margin-bottom:0!important}
.maker-project-page>.maker-project-body{border-top:1px solid var(--line)!important;margin-top:0!important}
/* Safe pre-load heights; wrapper JS replaces these with actual content height. */
body[data-page="goal-maker-shell"] .goal-maker-embed{height:1050px!important;width:100%!important;display:block!important;background:#090712!important}
.maker-project-page.is-frame-studio .maker-frame{height:1250px!important;width:100%!important;display:block!important;background:#090712!important}
.maker-project-page.is-scene-maker .maker-frame{height:1250px!important;width:100%!important;display:block!important;background:#090712!important}

/* v387 — final hard-rule visual fixes */

/* 1) Embedded feature tools must stay fully visible.
   Only the duplicated internal header/title is removed by JS inside the iframe. */
.maker-project-body,
.goal-maker-embed-wrap{
  overflow:visible !important;
}
.maker-project-body iframe,
.goal-maker-embed-wrap iframe{
  display:block !important;
  width:100% !important;
  border:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  clip:auto !important;
  clip-path:none !important;
  mask:none !important;
  -webkit-mask:none !important;
  background:transparent !important;
}

/* 2) When an inserted image acts like ambient page art instead of a boxed card,
   it must blend into the background with no hard frame/border. */
.support-hero .support-image-filler,
body[data-page="projects"] .project-layout-filler,
body[data-page="tools"] .tools-image-card,
body[data-page="counter-strike-checker"] .cs2-approved-filler{
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
}
.support-hero .support-image-filler img,
body[data-page="projects"] .project-layout-filler img,
body[data-page="tools"] .tools-image-card img,
body[data-page="counter-strike-checker"] .cs2-approved-filler img{
  -webkit-mask-image:radial-gradient(ellipse at center, #000 58%, rgba(0,0,0,.96) 72%, rgba(0,0,0,.62) 84%, transparent 100%);
  mask-image:radial-gradient(ellipse at center, #000 58%, rgba(0,0,0,.96) 72%, rgba(0,0,0,.62) 84%, transparent 100%);
}
.support-hero .support-image-filler::after,
body[data-page="projects"] .project-layout-filler::after,
body[data-page="tools"] .tools-image-card::after,
body[data-page="counter-strike-checker"] .cs2-approved-filler::after{
  background:
    radial-gradient(circle at center, rgba(8,5,14,0) 34%, rgba(8,5,14,.28) 72%, rgba(8,5,14,.82) 100%) !important;
}

/* 3) Support page right-side image is ambient art, not a boxed sticker. */
.support-hero .support-image-filler{
  min-width:min(34vw,420px) !important;
  min-height:190px !important;
  border-radius:0 !important;
  overflow:visible !important;
}
.support-hero .support-image-filler img{
  object-position:center 36% !important;
}

/* 4) Counter-Strike filler must show the face/character, not only guns. */
body[data-page="counter-strike-checker"] .cs2-approved-filler img{
  object-position:center 40% !important;
}

/* About-page rotating filler is ambient art too: no hard divider/rectangle. */
body[data-page="about"] .about-filler-rotator{
  border:none !important;
  background:transparent !important;
  overflow:visible !important;
}
body[data-page="about"] .about-filler-rotator img{
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 70%,rgba(0,0,0,.72) 84%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 0%,#000 70%,rgba(0,0,0,.72) 84%,transparent 100%);
}
\n\n/* v404 — GLOBAL PAGE HEADER LINE + PUNCTUATION RULE
   True page headers should read as one clean line whenever desktop width actually allows it.
   Mobile/narrow layouts may wrap naturally. Header punctuation is cleaned in the public HTML. */
@media (min-width:901px){
  html body main.page-content>.page-title-row>div:first-child{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:none!important;
  }
  html body main.page-content>.page-title-row h1,
  html body main.page-content>.maker-project-page>.real-project-header h1,
  html body[data-page^="project-"] .project-identity h1{
    max-width:none!important;
    white-space:nowrap!important;
    text-wrap:nowrap!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    font-size:clamp(1.8rem,2.35vw,2.85rem)!important;
    line-height:1!important;
  }
  /* Support art is ambient background art, so it must not steal hundreds of pixels
     from the actual page heading. */
  html body main.page-content>.support-hero{
    grid-template-columns:1fr!important;
  }
  html body main.page-content>.support-hero>div:first-child{
    position:relative!important;
    z-index:2!important;
    max-width:none!important;
  }
  html body main.page-content>.support-hero h1{
    max-width:none!important;
    white-space:nowrap!important;
    text-wrap:nowrap!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    font-size:clamp(1.85rem,2.5vw,3rem)!important;
    line-height:1!important;
  }
  html body main.page-content>.support-hero .support-image-filler{
    position:absolute!important;
    z-index:1!important;
    right:clamp(10px,2vw,32px)!important;
    top:18px!important;
    bottom:18px!important;
    width:min(30%,360px)!important;
    min-width:0!important;
    min-height:0!important;
    opacity:.72!important;
    pointer-events:none!important;
  }
}

/* v423 - One primary heading only. Keep the Scratchmeow H1 and remove the
   small eyebrow attached to the page title in every language. This is scoped
   to the first-level page heroes so useful labels inside cards stay visible. */
html body main.page-content > .page-title-row > div:first-child > p.eyebrow,
html body main.page-content > .support-hero > div:first-child > p.eyebrow {
  display:none!important;
}

/* v420: phone controls must remain touch-sized and readable. Decorative filler
   cells are desktop-only and must not leave empty grid tracks on mobile. */
@media (max-width:620px){
  html body .app-topbar{
    grid-template-columns:52px minmax(0,1fr) auto!important;
    gap:8px!important;
    min-height:68px!important;
    padding:8px 10px!important;
  }
  html body .app-topbar .search-button{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:52px!important;
    justify-content:flex-start!important;
    gap:9px!important;
    padding:0 13px!important;
    font-size:16px!important;
  }
  html body .app-topbar .search-button span:first-child{display:inline!important;flex:0 0 auto!important;font-size:22px!important}
  html body .app-topbar .search-button span:last-child{display:block!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  html body main.page-content{width:100%!important;padding:14px 12px 28px!important}
  html body main.page-content>.content-section,
  html body main.page-content>.panel,
  html body main.page-content>section{margin-top:12px!important;margin-bottom:0!important}
  html body [data-approved-filler="true"],
  html body .tools-image-card,
  html body .project-layout-filler,
  html body .project-brand-filler,
  html body .about-filler-rotator,
  html body .cs2-approved-filler,
  html body .support-image-filler,
  html body .support-brand-filler,
  html body .c4tm30w-filler,
  html body .goal-maker-site-filler{display:none!important;margin:0!important;padding:0!important;min-height:0!important}
  html body main.page-content img:not(.sidebar-image-icon):not(.project-stat-icon){max-width:100%;height:auto}
  html body button,
  html body .button,
  html body input,
  html body select{max-width:100%}
}
@media (max-width:900px){
  html body main.page-content>.page-title-row h1,
  html body main.page-content>.support-hero h1,
  html body main.page-content>.maker-project-page>.real-project-header h1,
  html body[data-page^="project-"] .project-identity h1{
    white-space:normal!important;
    text-wrap:wrap!important;
    overflow-wrap:break-word!important;
  }
}


/* v405 — HEADER CONSISTENCY: every language uses punctuation-free headings.
   True top/page identity headers stay on one line on normal desktop widths; narrow layouts may wrap only when space is genuinely unavailable. */
@media (min-width:901px){
  html body main.page-content>.page-title-row h1,
  html body main.page-content>.support-hero h1,
  html body main.page-content>.maker-project-page>.real-project-header h1,
  html body[data-page^="project-"] .project-identity h1{
    white-space:nowrap!important;
    text-wrap:nowrap!important;
    max-width:none!important;
  }
}


/* v406 — ONE UNIFIED PUBLIC H1 SIZE + FINAL FONT/LAYOUT CONTRACT
   Every public page identity H1 uses the exact same responsive size.
   Desktop stays on one line when the available width can hold it; narrow screens wrap naturally.
   Language font contract: Scratchmeow5 everywhere except explicit Polish/Japanese overrides. */
:root{--c4-public-h1-size:clamp(2.15rem,3vw,3rem);}
html body main.page-content h1{
  font-size:var(--c4-public-h1-size)!important;
  line-height:1!important;
  max-width:none!important;
}
@media (min-width:901px){
  html body main.page-content h1{
    white-space:nowrap!important;
    text-wrap:nowrap!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
}
@media (max-width:900px){
  html body main.page-content h1{
    white-space:normal!important;
    text-wrap:wrap!important;
    overflow-wrap:break-word!important;
  }
}


/* v408 — EMPTY-SPACE IMAGE RULE: boxed fillers only; no hard-cut support hero art. */
.support-hero .support-image-filler{display:none!important}

body[data-page="tools"] .tools-image-card,
body[data-page="projects"] .project-layout-filler,
body[data-page="counter-strike-checker"] .cs2-approved-filler,
body[data-page="about"] .about-filler-rotator{
  position:relative!important;
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#0b0712!important;
  box-shadow:none!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
body[data-page="tools"] .tools-image-card img,
body[data-page="projects"] .project-layout-filler img,
body[data-page="counter-strike-checker"] .cs2-approved-filler img,
body[data-page="about"] .about-filler-rotator img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  -webkit-mask-image:none!important;
  mask-image:none!important;
}
body[data-page="tools"] .tools-image-card::after,
body[data-page="projects"] .project-layout-filler::after,
body[data-page="counter-strike-checker"] .cs2-approved-filler::after,
body[data-page="about"] .about-filler-rotator::after{display:none!important;content:none!important}

@media(max-width:900px){
  body[data-page="tools"] .tools-image-card,
  body[data-page="projects"] .project-layout-filler,
  body[data-page="counter-strike-checker"] .cs2-approved-filler,
  body[data-page="about"] .about-filler-rotator,
  .goal-maker-site-filler{display:none!important}
}


/* v409 — FILLERS FOLDER CONTRACT
   All empty-space decoration comes from assets/images/fillers only.
   Filler cells scale with the real grid/card gap; they are boxed content, never ambient page backgrounds.
   Mobile intentionally hides filler art. */
body[data-page="tools"] .tools-image-card,
body[data-page="projects"] .project-layout-filler,
body[data-page="counter-strike-checker"] .cs2-approved-filler,
body[data-page="about"] .about-filler-rotator{
  min-width:0!important;
  align-self:stretch!important;
}
body[data-page="tools"] .tools-image-card{min-height:120px!important;height:auto!important}
body[data-page="projects"] .project-layout-filler{min-height:clamp(220px,28vw,430px)!important;height:auto!important}
body[data-page="counter-strike-checker"] .cs2-approved-filler{min-height:clamp(90px,12vw,180px)!important;height:auto!important}
body[data-page="about"] .about-filler-rotator{min-height:clamp(220px,30vw,430px)!important;height:auto!important}
body[data-page="tools"] .tools-image-card img,
body[data-page="projects"] .project-layout-filler img,
body[data-page="counter-strike-checker"] .cs2-approved-filler img,
body[data-page="about"] .about-filler-rotator img{
  width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;
}
@media(max-width:900px){
  body[data-page="tools"] .tools-image-card,
  body[data-page="projects"] .project-layout-filler,
  body[data-page="counter-strike-checker"] .cs2-approved-filler,
  body[data-page="about"] .about-filler-rotator{display:none!important}
}

/* v410 — USER LAYOUT CONTRACT: relevant images in their own boxes; maker gaps filled; compact LIVE spacing. */

/* ABOUT: cat story is text first. Relevant cat artwork sits in its own separate box BELOW the copy.
   It must never be used as a side image that squeezes the story text. */
body[data-page="about"] .cat-family-feature{
  display:flex!important;
  flex-direction:column!important;
  min-height:0!important;
  align-items:stretch!important;
}
body[data-page="about"] .cat-family-feature>.panel-body{
  order:1!important;
  width:100%!important;
  padding:clamp(20px,2vw,30px)!important;
  justify-content:flex-start!important;
}
body[data-page="about"] .cat-family-feature>.cat-family-content-image{
  order:2!important;
  position:relative!important;
  display:block!important;
  width:auto!important;
  height:clamp(180px,15vw,260px)!important;
  min-height:180px!important;
  margin:0 clamp(16px,1.6vw,24px) clamp(16px,1.6vw,24px)!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  overflow:hidden!important;
  background:#0b0712!important;
}
body[data-page="about"] .cat-family-feature>.cat-family-content-image img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center 72%!important;
}
@media(max-width:900px){
  body[data-page="about"] .cat-family-feature>.cat-family-content-image{display:none!important}
}

/* HOME / LIVE DASHBOARD: use the natural three-column stacks instead of stretching every card
   to the tallest card in a row. This removes giant dead zones and keeps the live block compact. */
body[data-page="dashboard"] .dashboard-top{
  gap:12px!important;
  align-items:start!important;
  margin-bottom:12px!important;
}
body[data-page="dashboard"] .profile-panel,
body[data-page="dashboard"] .live-panel{
  min-height:0!important;
  height:auto!important;
  align-self:start!important;
}
body[data-page="dashboard"] .live-panel .live-content{
  min-height:230px!important;
  height:auto!important;
  padding:16px 18px!important;
  justify-content:flex-start!important;
  gap:clamp(26px,3vw,46px)!important;
}
body[data-page="dashboard"] .live-panel .live-copy{margin-top:0!important}
body[data-page="dashboard"] .dashboard-columns{
  display:grid!important;
  grid-template-columns:minmax(320px,1fr) minmax(480px,1.28fr) minmax(300px,.9fr)!important;
  gap:12px!important;
  align-items:start!important;
  margin-top:12px!important;
  margin-bottom:12px!important;
}
body[data-page="dashboard"] .dashboard-columns>.dashboard-column{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:12px!important;
  align-content:start!important;
  min-width:0!important;
}
body[data-page="dashboard"] .dashboard-columns .panel{
  grid-column:auto!important;
  grid-row:auto!important;
  height:auto!important;
  min-height:0!important;
  align-self:start!important;
}
body[data-page="dashboard"] .dashboard-columns .panel>.panel-body{
  height:auto!important;
  min-height:0!important;
}
body[data-page="dashboard"] .steam-panel,
body[data-page="dashboard"] .games-panel,
body[data-page="dashboard"] .youtube-panel,
body[data-page="dashboard"] .clips-panel,
body[data-page="dashboard"] .analytics-panel,
body[data-page="dashboard"] .community-panel{min-height:0!important;height:auto!important}
body[data-page="dashboard"] .clips-panel .mini-list,
body[data-page="dashboard"] .community-panel .community-list,
body[data-page="dashboard"] .games-panel .game-mix,
body[data-page="dashboard"] .youtube-panel .youtube-grid{min-height:120px!important}
body[data-page="dashboard"] .analytics-panel .chart-wrap,
body[data-page="dashboard"] .analytics-panel .chart-wrap svg,
body[data-page="dashboard"] [data-performance-chart]{
  height:140px!important;
  min-height:140px!important;
  max-height:140px!important;
}
body[data-page="dashboard"] .steam-card{height:auto!important;min-height:0!important}
@media(max-width:1180px){
  body[data-page="dashboard"] .dashboard-columns{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)!important}
  body[data-page="dashboard"] .dashboard-columns>.dashboard-column:last-child{
    grid-column:1/-1!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:900px){
  body[data-page="dashboard"] .dashboard-top,
  body[data-page="dashboard"] .dashboard-columns{grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
  body[data-page="dashboard"] .dashboard-columns>.dashboard-column:last-child{
    grid-column:auto!important;
    grid-template-columns:minmax(0,1fr)!important;
  }
  body[data-page="dashboard"] .live-panel .live-content{min-height:0!important;gap:18px!important}
}

/* LIVE page: no oversized hero or giant vertical gaps while status/content is short. */
body[data-page="live"] .page-title-row{margin-bottom:12px!important}
body[data-page="live"] .page-grid{gap:12px!important;margin-top:0!important}
body[data-page="live"] .hero-page{min-height:0!important;height:auto!important}
body[data-page="live"] .hero-page .live-content{
  min-height:220px!important;
  height:auto!important;
  padding:16px 18px!important;
  justify-content:flex-start!important;
  gap:clamp(24px,3vw,42px)!important;
}
body[data-page="live"] #vods .panel-body,
body[data-page="live"] #clips .panel-body{min-height:120px!important}
body[data-page="live"] [data-live-error]:empty{display:none!important;margin:0!important;padding:0!important;min-height:0!important}
@media(max-width:900px){body[data-page="live"] .hero-page .live-content{min-height:0!important;gap:18px!important}}


/* v411 layout corrections: image boxes live in their own cards and vertical spacing stays consistent. */
body[data-page] .page-content > * + .content-section,
body[data-page] .page-content > .split-columns + .content-section,
body[data-page] .page-content > .page-title-row + .content-section,
body[data-page] .page-content > .page-title-row + .split-columns,
body[data-page] .page-content > nav + .content-section,
body[data-page] .page-content > nav + .split-columns{margin-top:16px!important}
body[data-page] .page-footer{margin-top:16px!important}

/* ABOUT: approved cat image must be UNDER the text in its own dedicated box. */
body[data-page="about"] .about-feature-grid{display:grid!important;grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr)!important;gap:16px!important;align-items:start!important}
body[data-page="about"] .about-main-stack{display:grid!important;gap:16px!important;min-width:0!important}
body[data-page="about"] .cat-family-copy-card .panel-body{padding:clamp(20px,2vw,30px)!important}
body[data-page="about"] .cat-family-image-panel{padding:0!important;overflow:hidden!important}
body[data-page="about"] .cat-family-image-panel .cat-family-content-image{display:block!important;height:clamp(220px,20vw,300px)!important;min-height:220px!important;margin:0!important;border:0!important;background:#0b0712!important;overflow:hidden!important}
body[data-page="about"] .cat-family-image-panel .cat-family-content-image img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 72%!important}
body[data-page="about"] .about-feature-grid>.column-stack{display:grid!important;gap:16px!important;align-content:start!important}
@media(max-width:900px){body[data-page="about"] .about-feature-grid{grid-template-columns:1fr!important}body[data-page="about"] .cat-family-image-panel{display:none!important}}

/* COUNTER-STRIKE PROFILE: use the real empty space under the profile for a same-gap C4TM30W filler card. */
body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack{display:grid!important;gap:16px!important;align-content:start!important}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill{padding:0!important;overflow:hidden!important}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill .cs2-profile-gap-fill-media{height:clamp(170px,16vw,250px)!important;min-height:170px!important;background:#0b0712!important;overflow:hidden!important}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 36%!important}
@media(max-width:900px){body[data-page="counter-strike-personal"] .cs2-profile-gap-fill{display:none!important}}


/* v412 — remove bad fillers, restore boxed layouts, keep spacing consistent. */

/* ABOUT: cat story uses one proper panel with a left image frame and text on the right. */
body[data-page="about"] .about-feature-grid{
  display:grid!important;
  grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr)!important;
  gap:16px!important;
  align-items:start!important;
}
body[data-page="about"] .about-main-stack{display:grid!important;gap:16px!important;min-width:0!important}
body[data-page="about"] .cat-family-story-panel{overflow:hidden!important}
body[data-page="about"] .cat-family-story-panel>.panel-body{
  padding:clamp(18px,1.7vw,24px)!important;
}
body[data-page="about"] .cat-family-story-layout{
  display:grid!important;
  grid-template-columns:minmax(240px,320px) minmax(0,1fr)!important;
  gap:18px!important;
  align-items:stretch!important;
}
body[data-page="about"] .cat-family-story-media{
  border:1px solid var(--line)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#0b0712!important;
  min-height:220px!important;
  align-self:stretch!important;
}
body[data-page="about"] .cat-family-story-media img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:64% center!important;
}
body[data-page="about"] .cat-family-story-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-width:0!important;
}
body[data-page="about"] .cat-family-story-copy .eyebrow{margin-bottom:10px!important}
body[data-page="about"] .cat-family-story-copy h2{margin:0 0 12px!important}
body[data-page="about"] .cat-family-story-copy p{margin:0!important}
body[data-page="about"] .cat-family-image-panel,
body[data-page="about"] .cat-family-copy-card{display:none!important}
@media(max-width:900px){
  body[data-page="about"] .about-feature-grid{grid-template-columns:1fr!important}
  body[data-page="about"] .cat-family-story-layout{grid-template-columns:1fr!important}
  body[data-page="about"] .cat-family-story-media{display:none!important}
}

/* COUNTER-STRIKE PROFILE: the space under Steam becomes a clean branded text card, not another random image. */
body[data-page="counter-strike-personal"] .cs2-identity-row{align-items:stretch!important}
body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack{
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
  min-width:0!important;
  height:100%!important;
}
body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack>.panel:first-child{flex:0 0 auto!important}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill{
  display:flex!important;
  flex:1 1 auto!important;
  align-items:stretch!important;
  justify-content:center!important;
  width:100%!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  min-height:0!important;
}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill-brand{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:1 1 auto!important;
  width:100%!important;
  min-height:190px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#f0e8ff!important;
  font-size:clamp(2.8rem,6.4vw,5.2rem)!important;
  line-height:1!important;
  text-align:center!important;
}
@media(max-width:900px){
  body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack{display:grid!important;height:auto!important}
  body[data-page="counter-strike-personal"] .cs2-profile-gap-fill{display:none!important}
}

/* HOME / DASHBOARD: no giant dead branded area under live status. Keep the card compact. */
body[data-page="dashboard"] .dashboard-top{
  align-items:start!important;
  gap:12px!important;
  margin-bottom:12px!important;
}
body[data-page="dashboard"] .dashboard-top>.panel{
  height:auto!important;
  align-self:start!important;
}
body[data-page="dashboard"] .live-panel{
  min-height:0!important;
  height:auto!important;
  overflow:hidden!important;
}
body[data-page="dashboard"] .live-panel .live-content{
  min-height:220px!important;
  height:auto!important;
  padding:18px!important;
  justify-content:flex-start!important;
  gap:18px!important;
}
body[data-page="dashboard"] .live-panel .live-copy{
  margin-top:0!important;
  width:100%!important;
  max-width:none!important;
}
body[data-page="dashboard"] .live-panel [data-live-title]{
  width:100%!important;
  max-width:none!important;
  margin-right:0!important;
  font-size:clamp(1.65rem,1.7vw,2.25rem)!important;
  line-height:1.06!important;
  text-wrap:balance!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
body[data-page="dashboard"] .live-panel .live-visual{
  opacity:.34!important;
}
body[data-page="dashboard"] .dashboard-columns{
  margin-top:12px!important;
  gap:12px!important;
}
@media(max-width:900px){
  body[data-page="dashboard"] .live-panel .live-content{min-height:0!important}
  body[data-page="dashboard"] .live-panel [data-live-title]{font-size:clamp(1.45rem,6vw,1.85rem)!important}
}

/* GOAL MAKER: never show decorative or accidental images inside the functional Text / Visibility or Extra Elements cards. */
body.goal-maker-runtime .dashboard-grid-v116>.panel-4.visibility-editor-card,
body.goal-maker-runtime .dashboard-grid-v116>.panel-6.extra-editor-card,
.dashboard-grid-v116>.panel-4.visibility-editor-card,
.dashboard-grid-v116>.panel-6.extra-editor-card{
  background-image:none!important;
}
body.goal-maker-runtime .dashboard-grid-v116>.panel-4.visibility-editor-card::before,
body.goal-maker-runtime .dashboard-grid-v116>.panel-4.visibility-editor-card::after,
body.goal-maker-runtime .dashboard-grid-v116>.panel-6.extra-editor-card::before,
body.goal-maker-runtime .dashboard-grid-v116>.panel-6.extra-editor-card::after,
.dashboard-grid-v116>.panel-4.visibility-editor-card::before,
.dashboard-grid-v116>.panel-4.visibility-editor-card::after,
.dashboard-grid-v116>.panel-6.extra-editor-card::before,
.dashboard-grid-v116>.panel-6.extra-editor-card::after{display:none!important;content:none!important}
body.goal-maker-runtime .dashboard-grid-v116>.panel-4.visibility-editor-card img,
body.goal-maker-runtime .dashboard-grid-v116>.panel-6.extra-editor-card img,
.dashboard-grid-v116>.panel-4.visibility-editor-card img,
.dashboard-grid-v116>.panel-6.extra-editor-card img,
body.goal-maker-runtime .dashboard-grid-v116>.panel-4.visibility-editor-card [class*="filler"],
body.goal-maker-runtime .dashboard-grid-v116>.panel-6.extra-editor-card [class*="filler"],
.dashboard-grid-v116>.panel-4.visibility-editor-card [class*="filler"],
.dashboard-grid-v116>.panel-6.extra-editor-card [class*="filler"],
body.goal-maker-runtime .dashboard-grid-v116>.panel-4.visibility-editor-card [class*="preview-image"],
body.goal-maker-runtime .dashboard-grid-v116>.panel-6.extra-editor-card [class*="preview-image"],
.dashboard-grid-v116>.panel-4.visibility-editor-card [class*="preview-image"],
.dashboard-grid-v116>.panel-6.extra-editor-card [class*="preview-image"]{display:none!important}


/* v413 — final requested cleanup: HOME naming and no home live background image. */
body[data-page="dashboard"] .live-panel .live-visual{display:none!important;background:none!important;background-image:none!important}


/* v416 — remove the unwanted CS2 profile filler and restore the clean two-column layout. */
body[data-page="counter-strike-personal"] .cs2-identity-row{
  align-items:start!important;
}
body[data-page="counter-strike-personal"] .cs2-identity-row>.column-stack{
  display:grid!important;
  gap:16px!important;
  align-content:start!important;
  min-width:0!important;
  height:auto!important;
}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill{
  display:none!important;
}
body[data-page="counter-strike-personal"] .cs2-profile-gap-fill-brand,
body[data-page="counter-strike-personal"] .c4tm30w-filler{
  display:none!important;
}
body[data-page="counter-strike-personal"] .cs2-top-columns,
body[data-page="counter-strike-personal"] .cs2-identity-row{
  margin-bottom:16px!important;
}


/* v418 - Frame & Media Studio visual layout alignment for Goal Maker and Scene Maker.
   Visual CSS only: no editor logic/data/functions changed. */

body[data-page="goal-maker"] .page-content,
body[data-page="scene-maker"] .page-content {
    width: 100%;
}

body[data-page="goal-maker"] .maker-shell,
body[data-page="scene-maker"] .maker-shell,
body[data-page="goal-maker"] .tool-shell,
body[data-page="scene-maker"] .tool-shell {
    width: 100%;
    max-width: none;
}

body[data-page="goal-maker"] .tool-layout,
body[data-page="scene-maker"] .tool-layout,
body[data-page="goal-maker"] .editor-layout,
body[data-page="scene-maker"] .editor-layout {
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
}

body[data-page="goal-maker"] .editor-grid,
body[data-page="scene-maker"] .editor-grid {
    width: 100%;
    max-width: none;
    gap: 16px;
}

body[data-page="goal-maker"] .page-content > *,
body[data-page="scene-maker"] .page-content > * {
    box-sizing: border-box;
}

body[data-page="goal-maker"] .tool-layout,
body[data-page="scene-maker"] .tool-layout {
    height: auto;
    min-height: 0;
    overflow: visible;
}

@media (min-width: 1200px) {
    body[data-page="goal-maker"] .editor-grid,
    body[data-page="scene-maker"] .editor-grid {
        grid-template-columns: minmax(260px, 0.8fr) minmax(520px, 1.8fr) minmax(260px, 0.8fr);
        align-items: start;
    }
}

@media (max-width: 1199px) {
    body[data-page="goal-maker"] .editor-grid,
    body[data-page="scene-maker"] .editor-grid {
        grid-template-columns: 1fr;
    }
}


/* v419 - Make editor tools follow Frame & Media Studio layout.
   CSS ONLY. No HTML/JS/data changes. */

body[data-page="goal-maker"] .page-content,
body[data-page="scene-maker"] .page-content,
body[data-page="obs-scene-pack-maker"] .page-content {
    width: 100%;
    max-width: none;
}

body[data-page="goal-maker"] .tool-layout,
body[data-page="scene-maker"] .tool-layout,
body[data-page="obs-scene-pack-maker"] .tool-layout,
body[data-page="goal-maker"] .editor-layout,
body[data-page="scene-maker"] .editor-layout,
body[data-page="obs-scene-pack-maker"] .editor-layout {
    width: 100%;
    max-width: none;
    margin: 0;
    height: auto;
    overflow: visible;
}

body[data-page="goal-maker"] .editor-grid,
body[data-page="scene-maker"] .editor-grid,
body[data-page="obs-scene-pack-maker"] .editor-grid {
    display: grid;
    width: 100%;
    max-width: none;
    grid-template-columns: minmax(260px, 0.85fr) minmax(520px, 2fr) minmax(260px, 0.85fr);
    gap: 16px;
    align-items: start;
}

body[data-page="goal-maker"] .editor-grid > *,
body[data-page="scene-maker"] .editor-grid > *,
body[data-page="obs-scene-pack-maker"] .editor-grid > * {
    min-width: 0;
}

body[data-page="goal-maker"] .preview,
body[data-page="scene-maker"] .preview,
body[data-page="obs-scene-pack-maker"] .preview {
    width: 100%;
    max-width: none;
}

@media (max-width: 1200px) {
    body[data-page="goal-maker"] .editor-grid,
    body[data-page="scene-maker"] .editor-grid,
    body[data-page="obs-scene-pack-maker"] .editor-grid {
        grid-template-columns: 1fr;
    }
}
/* v419: one invariant navigation size on every desktop page and language.
   Older responsive rules turned 901-1280px into an 84px icon rail after a
   navigation click, making the site visibly jump between pages. */
@media (min-width:901px){
  html body{--sidebar:300px!important;--sidebar-responsive-width:300px!important}
  html body .app-sidebar{width:300px!important;transform:none!important}
  html body .app-shell{width:calc(100% - 300px)!important;max-width:calc(100% - 300px)!important;margin-left:300px!important}
  html body .app-sidebar .brand{min-height:62px!important;padding:6px 14px!important}
  html body .app-sidebar .sidebar-nav{gap:3px!important;padding:8px 11px!important}
  html body .app-sidebar .sidebar-nav a{min-height:43px!important;height:43px!important;padding:5px 11px!important}
  html body .app-sidebar .sidebar-nav a>span{position:static!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;overflow:visible!important;clip:auto!important;clip-path:none!important;white-space:nowrap!important;font-size:20px!important;line-height:1!important}
  html body .app-sidebar .sidebar-nav a .sidebar-image-icon{width:26px!important;height:26px!important;flex:0 0 26px!important}
  html body .sidebar-collapse-toggle{display:none!important}
}

/* v430 - Keep social icons anchored at the bottom. On large/tall desktop
   windows the navigation itself grows proportionally to use the available
   height; ordinary desktop and mobile dimensions stay unchanged. */
@media (min-width:901px){
  html body .app-sidebar .sidebar-nav{
    flex:1 1 auto!important;
    gap:clamp(3px,.35vh,5px)!important;
  }
  html body .app-sidebar .sidebar-nav a{
    min-height:clamp(43px,5vh,52px)!important;
    height:clamp(43px,5vh,52px)!important;
    padding-block:clamp(5px,.65vh,7px)!important;
  }
  html body .app-sidebar .sidebar-nav a>span{
    font-size:clamp(20px,1.08vw,22px)!important;
  }
  html body .app-sidebar .sidebar-nav a .sidebar-image-icon{
    width:clamp(26px,2.75vh,30px)!important;
    height:clamp(26px,2.75vh,30px)!important;
    flex-basis:clamp(26px,2.75vh,30px)!important;
  }
  html body .app-sidebar .sidebar-footer{margin-top:0!important}
}