:root {
  --brand-paper: #f3f1eb;
  --brand-ink: #121827;
  --brand-muted: #505b68;
  --brand-blue: #3552d4;
  --brand-yellow: #dce96e;
}

.brand-site { background: var(--brand-paper); color: var(--brand-ink); }
.brand-site .container { width: min(100% - 64px, 1180px); }
.brand-site a:focus-visible, .brand-site button:focus-visible { outline-color: #243fc6; outline-offset: 4px; }
.brand-site .site-header { border-color: rgba(18, 24, 39, .1); background: rgba(243, 241, 235, .93); }
.brand-site .nav-wrap { min-height: 76px; }
.brand-site .brand { font-size: 17px; letter-spacing: -.045em; }
.brand-site .site-nav { gap: clamp(17px, 2vw, 28px); font-size: 13px; }
.brand-site .site-nav a { font-weight: 710; }
.brand-site .nav-contact { padding: .48rem .95rem; border-color: var(--brand-ink); border-radius: 4px; background: var(--brand-ink); color: #fff; }
.brand-site .nav-contact:hover { background: var(--brand-blue); color: #fff; }
.brand-site .locale-switch { border-color: #d5d3cd; background: #e9e7e0; }
.brand-site [data-locale-anchor] { scroll-margin-top: 82px; }

.brand-kicker, .section-index { margin: 0; font-size: 11px; font-weight: 830; letter-spacing: .17em; line-height: 1.5; text-transform: uppercase; }
.mobile-title-break { display: none; }
.brand-kicker span { padding: 0 .38em; color: var(--brand-blue); }
.brand-hero { overflow: hidden; padding-top: clamp(50px, 6vw, 88px); background: radial-gradient(circle at 2% 3%, #fff 0, transparent 34%), var(--brand-paper); }
.brand-hero-inner { display: grid; grid-template-columns: minmax(0, 1.16fr) minmax(0, .84fr); align-items: center; gap: clamp(28px, 4vw, 60px); min-height: 600px; }
.brand-hero-copy { position: relative; z-index: 1; padding: 20px 0 38px; }
.brand-hero h1 { margin: 36px 0 28px; color: var(--brand-ink); font-size: clamp(54px, 5.45vw, 76px); font-weight: 880; letter-spacing: -.085em; line-height: 1.13; }
.brand-hero h1 > span { display: block; }
.brand-hero-lead { margin: 0; color: var(--brand-blue); font-size: clamp(23px, 2.6vw, 34px); font-weight: 790; letter-spacing: -.06em; line-height: 1.45; }
.brand-home .brand-hero-copy { padding-bottom: 20px; }
.brand-home .brand-hero h1 { margin-bottom: 0; }
.brand-site [data-locale="en"] .brand-hero h1 { letter-spacing: -.025em; word-spacing: .08em; }
.brand-site [data-locale="en"] .brand-hero-lead { letter-spacing: -.01em; word-spacing: .07em; }
.brand-hero-note { max-width: 570px; margin: 26px 0 0; color: #3b4658; font-size: 15px; font-weight: 520; line-height: 1.95; }
.brand-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 19px 25px; margin-top: 32px; }
.brand-button { display: inline-flex; align-items: center; justify-content: center; gap: 2.3em; min-height: 54px; padding: .77rem 1.2rem; border: 1px solid transparent; border-radius: 4px; font-size: 14px; font-weight: 760; line-height: 1.3; text-align: center; text-decoration: none; transition: background .22s ease, color .22s ease, transform .22s ease; }
.brand-button:hover { transform: translateY(-2px); }
.brand-button--dark { background: var(--brand-ink); color: #fff; }
.brand-button--dark:hover { background: var(--brand-blue); color: #fff; }
.brand-button--light { background: #f9faf5; color: var(--brand-ink); }
.brand-button--light:hover { background: var(--brand-yellow); color: var(--brand-ink); }
.brand-link { font-size: 14px; font-weight: 770; text-decoration-thickness: 1px; text-underline-offset: .4em; }
.brand-link span { margin-left: 6px; }
.hero-footnote { display: flex; justify-content: space-between; gap: 20px; padding: 25px 0 22px; border-top: 1px solid rgba(18, 24, 39, .18); color: #58606d; font-size: 11px; font-weight: 750; letter-spacing: .09em; }

/* A decorative board: hovering causes a tiny, harmless change of plan. */
.playfield { position: relative; width: 100%; aspect-ratio: 1; overflow: hidden; border-radius: 3px; background: radial-gradient(circle at 52% 43%, #293455 0, #141c31 55%, #0e1523 100%); box-shadow: 24px 24px 0 #dde0d8; isolation: isolate; }
.playfield::before { position: absolute; z-index: 2; inset: 0; border: 1px solid rgba(255, 255, 255, .16); content: ""; pointer-events: none; }
.playfield-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(218, 230, 255, .075) 1px, transparent 1px), linear-gradient(90deg, rgba(218, 230, 255, .075) 1px, transparent 1px); background-size: 12.5% 12.5%; mask-image: radial-gradient(circle at center, #000 35%, transparent 90%); }
.playfield-paths { position: absolute; inset: 0; width: 100%; height: 100%; }
.playfield-paths path { stroke: rgba(227, 239, 255, .54); stroke-width: 2; stroke-dasharray: 8 9; }
.playfield-paths .playfield-path--surprise { stroke: var(--brand-yellow); stroke-width: 3; stroke-dasharray: 2 10; }
.playfield-coordinate { position: absolute; top: 25px; left: 28px; color: #c6d2eb; font: 700 11px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .1em; }
.playfield-piece { position: absolute; z-index: 1; display: block; border-radius: 50%; transition: transform .55s cubic-bezier(.2, .8, .15, 1); }
.playfield-piece--blue { top: 31%; left: 42%; width: 17%; aspect-ratio: 1; border: 12px solid #7ca4ff; background: #3355d6; box-shadow: 0 0 0 8px rgba(91, 122, 222, .16), 0 16px 30px rgba(0, 0, 0, .3); }
.playfield-piece--yellow { top: 61%; left: 55%; width: 13%; aspect-ratio: 1; border: 10px solid #e8f6a1; background: #cadc54; box-shadow: 0 0 0 8px rgba(220, 233, 110, .15), 0 15px 26px rgba(0, 0, 0, .3); }
.playfield-piece--outline { top: 17%; left: 74%; width: 10%; aspect-ratio: 1; border: 2px solid #e6ecf4; background: transparent; }
.playfield-spark { position: absolute; top: 52%; left: 66%; color: var(--brand-yellow); font: 900 clamp(54px, 7vw, 100px)/1 Arial, sans-serif; transform: rotate(17deg); transition: transform .4s ease; }
.playfield-caption { position: absolute; right: 27px; bottom: 22px; display: flex; flex-direction: column; color: #e8edfb; font: 800 clamp(27px, 3.7vw, 54px)/.97 Arial, sans-serif; letter-spacing: -.06em; text-align: right; }
.playfield-caption span:last-child { color: var(--brand-yellow); }
.playfield:hover .playfield-piece--blue { transform: translate(11px, -8px); }
.playfield:hover .playfield-piece--yellow { transform: translate(-12px, 7px); }
.playfield:hover .playfield-spark { transform: rotate(-9deg) translate(-4px, 4px); }

.brand-wordline { border-top: 1px solid #d7d6d0; border-bottom: 1px solid #d7d6d0; background: #e7e9db; }
.brand-wordline .container { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 77px; color: #293141; font-size: 14px; font-weight: 760; letter-spacing: .08em; }
.brand-wordline span:not(:last-child)::after { display: inline-block; margin-left: clamp(17px, 3.8vw, 60px); color: var(--brand-blue); content: "✳"; font-size: 16px; }

.brand-philosophy { padding: clamp(98px, 11vw, 160px) 0 110px; background: #151c2c; color: #f4f2ec; }
.brand-philosophy .section-index, .brand-games .section-index, .brand-closing .section-index { color: var(--brand-yellow); }
.philosophy-intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: end; gap: 70px; padding-bottom: 71px; border-bottom: 1px solid rgba(234, 242, 255, .19); }
.philosophy-intro h2, .philosophy-intro h1, .section-title-row h2, .section-title-row h1, .brand-about h2, .brand-closing h2 { margin: 21px 0 0; font-size: clamp(39px, 5.5vw, 70px); font-weight: 830; letter-spacing: -.075em; line-height: 1.18; }
.philosophy-intro h2 em, .philosophy-intro h1 em { color: var(--brand-yellow); font-style: normal; }
.philosophy-intro-copy { max-width: 430px; margin: 0 0 7px; color: #d6dfe8; font-size: clamp(17px, 1.8vw, 21px); line-height: 1.8; }
.philosophy-body { display: grid; grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr); align-items: start; gap: clamp(60px, 10vw, 145px); padding-top: 94px; }
.philosophy-words { position: sticky; top: 125px; display: grid; grid-template-columns: repeat(2, 1fr); align-content: center; gap: 25px 9px; min-height: 500px; }
.philosophy-words span { z-index: 1; display: inline-flex; align-items: center; justify-content: center; min-height: 68px; padding: 8px 14px; border: 1px solid rgba(226, 240, 255, .23); border-radius: 999px; background: #202a40; color: #e5eaf3; font-size: clamp(15px, 1.5vw, 20px); font-weight: 730; white-space: nowrap; transition: transform .3s ease, background .3s ease; }
.philosophy-words span:nth-child(1) { transform: rotate(-7deg) translateX(-10px); }
.philosophy-words span:nth-child(2) { transform: rotate(5deg) translate(5px, 19px); }
.philosophy-words span:nth-child(3) { transform: rotate(7deg) translate(14px, -4px); }
.philosophy-words span:nth-child(4) { transform: rotate(-5deg) translate(-8px, 13px); }
.philosophy-words span:nth-child(5) { transform: rotate(-4deg) translate(13px, 5px); }
.philosophy-words span:nth-child(6) { transform: rotate(6deg) translate(2px, 15px); }
.philosophy-words span:hover { background: #2c3b61; }
.philosophy-words b { position: absolute; top: 50%; left: 50%; color: rgba(220, 233, 110, .18); font: 800 360px/1 Arial, sans-serif; transform: translate(-50%, -50%) rotate(-14deg); pointer-events: none; }
.philosophy-statement { max-width: 580px; color: #d9dfeb; font-size: clamp(15px, 1.55vw, 18px); line-height: 2.03; }
.philosophy-statement p { margin: 0 0 2em; }
.philosophy-statement .statement-lead { color: #fff; font-size: clamp(19px, 2.1vw, 25px); font-weight: 750; line-height: 1.8; }
.philosophy-statement blockquote { margin: 2.3em 0; padding-left: 27px; border-left: 3px solid var(--brand-yellow); color: #fff; font-size: clamp(20px, 2.45vw, 28px); font-weight: 760; line-height: 1.75; }
.philosophy-statement .statement-final { margin-top: 2.6em; color: var(--brand-yellow); font-weight: 760; }
.mischief-definition { display: grid; grid-template-columns: 125px 1fr; align-items: center; gap: 28px; margin-top: 72px; padding: clamp(26px, 4vw, 51px); background: var(--brand-yellow); color: var(--brand-ink); }
.definition-symbol { font: 770 130px/.9 Arial, sans-serif; letter-spacing: -.1em; }
.mischief-definition .section-index { color: #354323; }
.mischief-definition h3, .mischief-definition h2 { margin: 9px 0 10px; font-size: clamp(25px, 3vw, 38px); font-weight: 820; letter-spacing: -.055em; line-height: 1.2; }
.mischief-definition h3 span, .mischief-definition h2 span { font-size: .6em; }
.mischief-definition p:last-child { max-width: 790px; margin: 0; line-height: 1.75; }

.brand-principles { padding: clamp(95px, 10vw, 140px) 0; background: #f3f1eb; }
.section-title-row { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 49px; }
.section-title-row .section-index, .brand-about .section-index { color: var(--brand-blue); }
.section-title-row h2, .section-title-row h1 { color: var(--brand-ink); }
.section-title-row > p { max-width: 380px; margin: 0 0 5px; color: var(--brand-muted); font-size: 17px; line-height: 1.8; }
.principles-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 15px; }
.principle-card { grid-column: span 2; min-height: 315px; padding: 28px 26px 31px; border: 1px solid #dcdcd3; background: #fff; transition: transform .28s ease, box-shadow .28s ease; }
.principle-card:nth-child(n+4) { grid-column: span 3; min-height: 290px; }
.principle-card:hover { transform: translateY(-5px) rotate(-.4deg); box-shadow: 10px 12px 0 #d9ddcc; }
.principle-card:nth-child(even):hover { transform: translateY(-5px) rotate(.4deg); }
.principle-number { display: block; margin-bottom: 23px; color: var(--brand-blue); font: 790 clamp(59px, 6vw, 82px)/.88 Arial, sans-serif; letter-spacing: -.075em; }
.principle-card h3, .principle-card h2 { margin: 0 0 14px; font-size: clamp(22px, 2.25vw, 29px); font-weight: 820; letter-spacing: -.06em; line-height: 1.3; }
.principle-card p { max-width: 500px; margin: 0; color: #475263; font-size: 14px; line-height: 1.85; }

.brand-games { padding: clamp(95px, 10vw, 140px) 0; background: #e8ebf3; }
.brand-games .section-index { color: var(--brand-blue); }
.game-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.game-card--featured { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); min-height: 550px; background: #121a2b; color: #fff; }
.game-card-image { position: relative; min-height: 100%; overflow: hidden; background: #05090f; }
.game-card-image::after { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6, 11, 20, .48), transparent 38%); content: ""; pointer-events: none; }
.game-card-image img { display: block; width: 100%; height: 100%; min-height: 550px; object-fit: contain; object-position: center; transition: transform .6s ease; }
.game-card--featured:hover .game-card-image img { transform: scale(1.025); }
.game-card-image > span { position: absolute; z-index: 1; bottom: 25px; left: 27px; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.game-card-content { display: flex; flex-direction: column; align-items: flex-start; padding: clamp(32px, 4.3vw, 57px); }
.game-status { margin: 0 0 33px; color: var(--brand-yellow); font-size: 12px; font-weight: 820; letter-spacing: .16em; text-transform: uppercase; }
.game-card-content h3 { margin: 0; color: #fff; font: 850 clamp(47px, 5vw, 70px)/.93 Arial, sans-serif; letter-spacing: -.075em; }
.game-card-content h3 span { display: block; margin-top: 18px; color: #e2e7b4; font-size: 14px; font-weight: 700; letter-spacing: .24em; line-height: 1.4; }
.game-card-content > p:not(.game-status) { max-width: 400px; margin: 29px 0 0; color: #d9e0ed; font-size: 16px; line-height: 1.9; }
.game-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }
.game-tags span { padding: 5px 9px; border: 1px solid #5b6579; color: #cbd4e4; font-size: 10px; font-weight: 690; letter-spacing: .05em; }
.game-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 15px 24px; margin-top: auto; padding-top: 38px; }
.game-text-link { color: #fff; font-size: 13px; font-weight: 760; text-decoration: none; }
.game-text-link:hover { color: var(--brand-yellow); text-decoration: underline; }
.game-card--small { display: flex; align-items: center; gap: 21px; min-height: 180px; padding: 20px; border: 1px solid #d0d6e3; background: #fff; transition: transform .25s ease; }
.game-card--small:hover { transform: translateY(-3px); }
.game-card--small img { width: 86px; height: 86px; flex: 0 0 auto; border-radius: 18px; object-fit: cover; }
.game-card--small p { margin: 0 0 4px; color: #697389; font-size: 10px; font-weight: 760; letter-spacing: .1em; text-transform: uppercase; }
.game-card--small h3 { margin: 0 0 8px; color: var(--brand-ink); font-size: 21px; letter-spacing: -.04em; }
.game-card--small .game-card-teaser { margin: 0 0 12px; color: #4b5669; font-size: 13px; font-weight: 500; letter-spacing: 0; line-height: 1.55; text-transform: none; }
.game-card--small a { color: var(--brand-blue); font-size: 12px; font-weight: 760; text-decoration: none; }
.game-card--small a:hover { text-decoration: underline; }

.brand-about { padding: clamp(95px, 10vw, 140px) 0; background: #f8f7f2; }
.about-inner { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: center; gap: clamp(65px, 10vw, 145px); }
.about-mark { display: grid; place-items: center; aspect-ratio: 1; border: 1px solid #d8dbd8; border-radius: 50%; background: radial-gradient(circle at 50% 50%, #fff 0, #eeefec 70%); }
.about-mark img { width: 60%; height: auto; object-fit: contain; }
.brand-about h2 { font-size: clamp(38px, 4.5vw, 57px); }
.brand-about p:not(.section-index) { max-width: 640px; margin: 24px 0 0; color: #454e5b; font-size: 16px; line-height: 1.95; }
.brand-about .about-english { color: var(--brand-blue) !important; font-size: 13px !important; font-weight: 800; letter-spacing: .08em; }
.about-links { display: flex; flex-wrap: wrap; gap: 13px 24px; margin-top: 34px; padding-top: 22px; border-top: 1px solid #d8dbd8; }
.about-links a { color: var(--brand-ink); font-size: 13px; font-weight: 760; text-decoration: none; }
.about-links a:hover { color: var(--brand-blue); text-decoration: underline; text-underline-offset: .3em; }
.about-links a span { margin-left: 7px; color: var(--brand-blue); }

.brand-next { border-top: 1px solid #d3d7e2; background: #e8ebf3; }
.brand-next-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-top: clamp(35px, 5vw, 65px); padding-bottom: clamp(35px, 5vw, 65px); }
.brand-next .section-index { color: var(--brand-blue); }
.brand-next h2 { margin: 7px 0 0; font-size: clamp(25px, 3.1vw, 38px); font-weight: 810; letter-spacing: -.06em; line-height: 1.3; }
.brand-next a { display: inline-flex; align-items: center; gap: 35px; padding: 13px 18px; border: 1px solid var(--brand-ink); border-radius: 3px; background: var(--brand-ink); color: #fff; font-size: 13px; font-weight: 770; text-decoration: none; white-space: nowrap; transition: background .2s ease, transform .2s ease; }
.brand-next a:hover { background: var(--brand-blue); color: #fff; transform: translateX(3px); }

.brand-closing { position: relative; overflow: hidden; padding: clamp(94px, 11vw, 152px) 0 63px; background: #304bc8; color: #fff; }
.brand-closing::after { position: absolute; top: -31%; right: -15%; width: 65vw; max-width: 800px; aspect-ratio: 1; border: 1px solid rgba(255, 255, 255, .19); border-radius: 50%; box-shadow: 0 0 0 95px rgba(255,255,255,.035), 0 0 0 210px rgba(255,255,255,.025); content: ""; pointer-events: none; }
.closing-inner { position: relative; z-index: 1; }
.brand-closing .section-index { color: #dce96e; }
.brand-closing h2 { max-width: 990px; font-size: clamp(56px, 9vw, 112px); letter-spacing: -.09em; }
.brand-closing p:not(.section-index) { margin: 23px 0 0; color: #edf0ff; font-size: clamp(18px, 2vw, 24px); }
.brand-closing .brand-actions { margin-top: 37px; }
.closing-link { color: #fff; font-size: 14px; font-weight: 730; }
.closing-link:hover { color: var(--brand-yellow); }
.closing-social { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: clamp(76px, 10vw, 140px); padding-top: 20px; border-top: 1px solid rgba(255,255,255,.32); font-size: 12px; font-weight: 760; }
.closing-social > span { margin-right: auto; color: #cbd5fb; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; }
.closing-social a { color: #fff; text-decoration: none; }
.closing-social a:hover { color: var(--brand-yellow); text-decoration: underline; }

.brand-footer { border-color: #d8d9d7; background: #f3f1eb; }
.brand-footer .footer-note { color: #536077; }
.brand-footer .footer-links { grid-template-columns: repeat(2, minmax(105px, 1fr)); }
.brand-footer .footer-links a { color: #273247; text-decoration: none; }
.brand-footer .footer-links a:hover { color: var(--brand-blue); text-decoration: underline; }

@media (max-width: 980px) {
  .brand-site .menu-button { display: block; }
  .brand-site .site-nav { display: none; position: absolute; top: 76px; right: 24px; left: 24px; z-index: 10; align-items: stretch; gap: 0; padding: 12px; border: 1px solid #d8d9d7; border-radius: 8px; background: #f8f7f2; box-shadow: 0 24px 45px rgba(17, 23, 39, .17); }
  .brand-site .site-nav.is-open { display: flex; flex-direction: column; }
  .brand-site .site-nav a { padding: 12px; }
  .brand-site .nav-contact { margin: 8px 0; padding: 12px; }
  .brand-site .locale-switch { align-self: flex-start; margin: 6px 10px 5px; }
  .brand-hero-inner { grid-template-columns: 1fr; gap: 28px; }
  .brand-hero-copy { padding-bottom: 5px; }
  .brand-hero h1 { max-width: 820px; font-size: clamp(54px, 8vw, 76px); }
  .playfield { max-width: 720px; aspect-ratio: 1.35; margin: 0 auto 35px; box-shadow: 18px 18px 0 #dde0d8; }
  .playfield-caption { font-size: clamp(31px, 5.6vw, 54px); }
  .philosophy-body { gap: 65px; }
  .principle-card { grid-column: span 3; }
  .principle-card:nth-child(n+4) { grid-column: span 3; }
  .principle-card:last-child { grid-column: 1 / -1; min-height: 250px; }
  .about-inner { gap: 55px; }
}

@media (max-width: 700px) {
  .brand-site .container { width: min(100% - 32px, 1180px); }
  .brand-site .nav-wrap { min-height: 68px; }
  .brand-site .site-nav { top: 68px; right: 16px; left: 16px; }
  .brand-site .brand { font-size: 16px; }
  .brand-hero { padding-top: 59px; }
  .brand-hero-inner { min-height: 0; }
  .brand-kicker { font-size: 10px; }
  .brand-hero h1 { margin-top: 25px; margin-bottom: 24px; font-size: clamp(46px, 10.9vw, 70px); letter-spacing: -.085em; }
  .brand-hero h1 span:last-child { max-width: 9em; }
  .brand-hero-lead { font-size: clamp(22px, 6.2vw, 31px); }
  .brand-hero-note { margin-top: 19px; font-size: 14px; }
  .brand-actions { gap: 14px 21px; margin-top: 27px; }
  .brand-button { min-height: 49px; }
  .playfield { aspect-ratio: 1.1; margin: 17px auto 32px; box-shadow: 11px 11px 0 #dde0d8; }
  .playfield-piece--blue { border-width: 7px; }
  .playfield-piece--yellow { border-width: 6px; }
  .playfield-coordinate { top: 16px; left: 17px; }
  .playfield-caption { right: 17px; bottom: 16px; }
  .hero-footnote { font-size: 9px; }
  .brand-wordline .container { justify-content: space-between; gap: 4px; padding: 18px 0; font-size: 11px; }
  .brand-wordline span:not(:last-child)::after { display: none; }
  .brand-philosophy { padding: 83px 0 82px; }
  .philosophy-intro { grid-template-columns: 1fr; gap: 23px; padding-bottom: 40px; }
  .philosophy-intro h2, .philosophy-intro h1, .section-title-row h2, .section-title-row h1 { font-size: clamp(38px, 9vw, 56px); }
  .philosophy-intro-copy { font-size: 16px; }
  .philosophy-body { grid-template-columns: 1fr; gap: 42px; padding-top: 48px; }
  .philosophy-words { position: relative; top: auto; gap: 12px; min-height: 0; padding: 15px 0; }
  .philosophy-words span { min-height: 49px; font-size: 14px; }
  .philosophy-words b { font-size: 220px; }
  .philosophy-statement { font-size: 15px; }
  .philosophy-statement .statement-lead { font-size: 19px; }
  .philosophy-statement blockquote { padding-left: 17px; font-size: 20px; }
  .mischief-definition { grid-template-columns: 1fr; gap: 7px; margin-top: 43px; padding: 26px 22px; }
  .definition-symbol { font-size: 68px; }
  .mischief-definition h3, .mischief-definition h2 { font-size: 27px; }
  .brand-principles, .brand-games, .brand-about { padding: 82px 0; }
  .section-title-row { display: block; margin-bottom: 33px; }
  .section-title-row > p { margin-top: 22px; font-size: 15px; }
  .principles-grid { grid-template-columns: 1fr; gap: 10px; }
  .principle-card, .principle-card:nth-child(n+4), .principle-card:last-child { grid-column: 1; min-height: 0; padding: 23px 22px 28px; }
  .principle-number { margin-bottom: 16px; font-size: 62px; }
  .principle-card h3, .principle-card h2 { font-size: 24px; }
  .game-grid { grid-template-columns: 1fr; gap: 10px; }
  .game-card--featured { grid-column: 1; grid-template-columns: 1fr; }
  .game-card-image { min-height: 260px; }
  .game-card-image img { height: 260px; min-height: 0; }
  .game-card-content { padding: 28px 22px 31px; }
  .game-status { margin-bottom: 21px; }
  .game-card-content h3 { font-size: clamp(48px, 13vw, 70px); }
  .game-card-content > p:not(.game-status) { margin-top: 23px; font-size: 15px; }
  .game-actions { padding-top: 26px; }
  .game-card--small { min-height: 123px; padding: 14px; gap: 15px; }
  .game-card--small img { width: 69px; height: 69px; border-radius: 14px; }
  .game-card--small h3 { font-size: 19px; }
  .about-inner { grid-template-columns: 1fr; gap: 32px; }
  .about-mark { max-width: 210px; }
  .brand-about h2 { font-size: clamp(33px, 9vw, 40px); }
  .brand-about p:not(.section-index) { font-size: 15px; }
  .brand-next-inner { align-items: flex-start; flex-direction: column; }
  .brand-next a { justify-content: space-between; width: 100%; }
  .brand-closing { padding: 88px 0 42px; }
  .brand-closing h2 { font-size: clamp(52px, 13vw, 76px); }
  .brand-closing p:not(.section-index) { font-size: 17px; }
  .closing-social { margin-top: 85px; }
  .mobile-title-break { display: inline; }
}

@media (max-width: 390px) {
  .brand-hero h1 { font-size: 43px; }
  .brand-button { width: 100%; }
  .game-actions .brand-button { width: 100%; }
  .closing-social > span { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  .brand-site *, .brand-site *::before, .brand-site *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}