@font-face { font-family: "Bricolage Grotesque"; src: url("../fonts/bricolage-latin.woff2") format("woff2"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Figtree"; src: url("../fonts/figtree-latin.woff2") format("woff2"); font-weight: 300 900; font-display: swap; }

.look-lq {
  --bg: #070405;
  --bg-2: rgba(24, 10, 12, 0.55);
  --bg-3: rgba(255, 255, 255, 0.08);
  --text: #f6eeee;
  --text-2: rgba(246, 238, 238, 0.72);
  --line: rgba(255, 255, 255, 0.14);
  --red: #d61f2c;
  --red-deep: #6e0a12;
  --accent: #ff4d57;
  --accent-text: #160304;
  --glass: rgba(20, 8, 10, 0.86);
  --rim: rgba(255, 255, 255, 0.24);
  --font: "Figtree", "Segoe UI", system-ui, sans-serif;
  --font-head: "Bricolage Grotesque", "Avenir Next", "Segoe UI", sans-serif;
  --radius: 28px;
  --tint: 214, 31, 44;
  --tint2: 255, 77, 87;
  color-scheme: dark;
}
.look-lq body { background: var(--bg); position: relative; }
.look-lq main, .look-lq .foot { position: relative; z-index: 1; }
.look-lq h1, .look-lq h2, .look-lq h3 { font-family: var(--font-head); text-transform: none; letter-spacing: -0.02em; text-wrap: balance; }
.look-lq a { color: var(--accent); }


.lq-glass, .look-lq .top,
.look-lq .hero-plain > .wrap, .look-lq .section > .wrap, .look-lq .card {
  position: relative;
  background: var(--glass);
  border: 1px solid var(--rim);
  border-radius: var(--radius);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), inset 0 -1px 0 rgba(255, 255, 255, 0.06), inset 0 0 30px rgba(var(--tint2), 0.06), 0 24px 60px rgba(0, 0, 0, 0.45);
}
.lq-glass::before, .look-lq .card::before,
.look-lq .hero-plain > .wrap::before, .look-lq .section > .wrap::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(380px circle at var(--mx, 25%) var(--my, 0%), rgba(255, 255, 255, 0.16), transparent 50%),
              linear-gradient(160deg, rgba(255, 255, 255, 0.16) 0%, rgba(255, 255, 255, 0) 30%);
}
.lq-glass > *, .look-lq .card > * { position: relative; }

.look-lq .top { position: sticky; top: calc(12px + env(safe-area-inset-top, 0px)); z-index: 20; width: min(1080px, calc(100% - 24px)); margin: 12px auto 0; border-radius: 999px; }
.look-lq .top .wrap { min-height: 54px; padding: 0 10px 0 22px; }
.look-lq .brand { font-family: var(--font-head); font-weight: 800; letter-spacing: -0.01em; }
.look-lq .nav { gap: 4px; }
.look-lq .nav a { padding: 8px 12px; border-radius: 999px; color: var(--text-2); }
.look-lq .nav a:hover, .look-lq .nav a[aria-current="page"] { background: rgba(255, 255, 255, 0.1); color: var(--text); }
.look-lq .lang { border-color: var(--rim); }

.lq-hero { padding: clamp(70px, 12vw, 150px) 0 40px; }
.lq-hero .wrap { display: grid; gap: 22px; }
.lq-eyebrow { font: 600 0.8rem/1 var(--font); letter-spacing: 0.22em; text-transform: uppercase; color: var(--accent); }
.lq-title { margin: 0; font-size: clamp(3.2rem, 10vw, 8.6rem); font-weight: 800; line-height: 0.88; letter-spacing: -0.04em;
  color: #fff; }
.lq-title .gt { display: inline-block; background: linear-gradient(180deg, #fff 0%, #ffe3e4 50%, #ff6a72 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 0.06em; }
.lq-title .gt2 { background-image: linear-gradient(180deg, #ffd0d3 0%, #ff4d57 60%, #d61f2c 100%); }
.lq-tag { font-size: clamp(1.1rem, 2.2vw, 1.4rem); line-height: 1.5; max-width: 38ch; color: var(--text-2); margin: 0; }
.lq-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.lq-btn { display: inline-flex; align-items: center; gap: 8px; padding: 14px 22px; border-radius: 999px; font-weight: 600; text-decoration: none; color: var(--text);
  background: rgba(var(--tint), 0.35); border: 1px solid rgba(var(--tint2), 0.55);  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 10px 30px rgba(var(--tint), 0.25); transition: transform 0.3s cubic-bezier(.2,.8,.2,1), background 0.3s; }
.look-lq a.lq-btn { color: var(--text); }
.lq-btn:hover { transform: translateY(-2px); background: rgba(var(--tint), 0.55); }
.lq-btn.ghost { background: rgba(255, 255, 255, 0.06); border-color: var(--rim); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3); }

.lq-sec { padding: 28px 0; }
.lq-sec h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); margin: 0 0 18px; }
.lq-games { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.look-lq a.lq-game { color: var(--text); }
.lq-game { padding: 12px; display: grid; gap: 14px; text-decoration: none; color: var(--text); transition: transform 0.4s cubic-bezier(.2,.8,.2,1); }
.lq-game:hover { transform: translateY(-8px); }
.lq-game img { aspect-ratio: 16 / 10; object-fit: cover; width: 100%; border-radius: 18px; }
.lq-game .t { padding: 0 8px 10px; display: grid; gap: 8px; }
.lq-game h3 { margin: 0; font-size: 1.45rem; }
.lq-game p { margin: 0; font-size: 0.98rem; line-height: 1.5; color: var(--text-2); }
.lq-pill { justify-self: start; display: inline-flex; align-items: center; gap: 7px; font-size: 0.76rem; font-weight: 600; padding: 6px 11px; border-radius: 999px; background: rgba(255, 255, 255, 0.09); border: 1px solid var(--line); color: var(--text); }
.lq-pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px var(--accent); }
.lq-two { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; }
.lq-two .lq-glass { padding: clamp(24px, 4vw, 38px); display: grid; gap: 12px; align-content: start; }
.lq-two h2 { margin: 0; }
.lq-two p { margin: 0; font-size: 1.08rem; line-height: 1.6; color: var(--text-2); }
.lq-mail { font-weight: 600; color: var(--text); text-decoration: none; border-bottom: 1px solid rgba(var(--tint2), 0.6); justify-self: start; }

.look-lq a.lq-feature, .look-lq a.lq-app { color: var(--text); text-decoration: none; }
.lq-feature, .lq-app, .lq-principles .lq-glass, .lq-contact { transform-style: preserve-3d; will-change: transform; }
.lq-feature { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 0; overflow: hidden; padding: 0; transition: transform 0.4s cubic-bezier(.2,.8,.2,1); }
.lq-feature:hover, .lq-app:hover { transform: translateY(-6px); }
.lq-feature-pic { position: relative; min-height: 340px; margin: 12px 0 12px 12px; border-radius: 20px; overflow: hidden; }
.lq-feature-pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(0.8) contrast(1.1); }
.lq-feature-pic::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(110, 10, 18, 0.35), rgba(110, 10, 18, 0.05)); }
.lq-feature-txt { padding: clamp(24px, 4vw, 44px); display: grid; gap: 14px; align-content: center; }
.lq-feature-txt h2 { margin: 0; font-size: clamp(2.2rem, 4.6vw, 3.6rem); line-height: 0.95; }
.lq-feature-txt p { margin: 0; font-size: 1.08rem; line-height: 1.6; color: var(--text-2); max-width: 40ch; }
.lq-more { font-weight: 600; color: var(--accent); }
.lq-mobile { margin-top: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.lq-app { padding: 12px 12px 18px; display: grid; gap: 14px; transition: transform 0.4s cubic-bezier(.2,.8,.2,1); }
.lq-shot { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 18px; }
.lq-app-row { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 14px; align-items: center; padding: 0 6px; }
.lq-icon { width: 56px; height: 56px; border-radius: 14px; box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4); }
.lq-app h3 { margin: 0 0 4px; font-size: 1.35rem; }
.lq-app p { margin: 0; color: var(--text-2); font-size: 0.98rem; line-height: 1.45; }
.lq-app .lq-pill { margin-left: 6px; }
.lq-principles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lq-principles .lq-glass { padding: 26px; display: grid; gap: 10px; align-content: start; }
.lq-principles b { font: 800 1.1rem/1 var(--font-head); width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: #fff;
  background: radial-gradient(circle at 35% 30%, #ff6b73, var(--red) 55%, var(--red-deep)); box-shadow: 0 6px 18px rgba(var(--tint), 0.45), inset 0 1px 0 rgba(255,255,255,.5); }
.lq-principles h3 { margin: 4px 0 0; font-size: 1.3rem; }
.lq-principles p { margin: 0; color: var(--text-2); line-height: 1.55; }
.lq-timeline { list-style: none; margin: 0; padding: clamp(18px, 3vw, 30px); display: grid; gap: 0; }
.lq-timeline li { display: grid; grid-template-columns: minmax(130px, 220px) minmax(0, 1fr); gap: 18px; padding: 14px 0 14px 22px; border-bottom: 1px solid var(--line); position: relative; }
.lq-timeline li:last-child { border-bottom: 0; }
.lq-timeline li::before { content: ""; position: absolute; left: 0; top: 21px; width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.3); }
.lq-timeline li.next::before { background: var(--accent); box-shadow: 0 0 12px var(--accent); }
.lq-timeline b { font-family: var(--font-head); font-size: 1.1rem; }
.lq-timeline span { color: var(--text-2); }
.lq-contact { padding: clamp(24px, 4vw, 40px); display: grid; gap: 18px; }
.lq-contact h2 { margin: 0; }
.lq-mails { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.lq-mails div { display: grid; gap: 6px; }
.lq-mails span { font-size: 0.8rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-2); }
.lq-mail { overflow-wrap: anywhere; }
@media (max-width: 820px) {
  .lq-feature, .lq-mobile, .lq-principles, .lq-mails { grid-template-columns: 1fr; }
  .lq-feature-pic { min-height: 220px; margin: 12px 12px 0; }
  .lq-timeline li { grid-template-columns: 1fr; gap: 2px; }
}

.look-lq .hero-plain { padding: 56px 0 14px; }
.look-lq .section { border-top: 0; padding: 14px 0; }
.look-lq .hero-plain > .wrap, .look-lq .section > .wrap { width: min(1080px, calc(100% - 24px)); padding: clamp(22px, 4vw, 40px); }
.look-lq .section:last-of-type { padding-bottom: 40px; }
.look-lq .card { padding: 22px; }
.look-lq .facts th, .look-lq .facts td { border-bottom-color: var(--line); }
.look-lq .note { background: rgba(255, 255, 255, 0.06); border-left-color: var(--accent); }
.look-lq .foot { border-top: 0; }
.look-lq .foot .wrap { border-top: 1px solid var(--line); padding-top: 24px; }


@media (max-width: 820px) {
  .lq-games, .lq-two { grid-template-columns: 1fr; }
  .look-lq .top { border-radius: 26px; }
}
@media (prefers-reduced-motion: reduce) {
  .lq-game, .lq-btn { transition: none; }
}

.lq-title .ln { display: inline-block; animation: lq-rise 1.1s cubic-bezier(.16,1,.3,1) both; }
.lq-title .ln + br + .ln { animation-delay: 0.14s; }
.lq-eyebrow, .lq-tag, .lq-actions { animation: lq-fade 1s 0.35s cubic-bezier(.16,1,.3,1) both; }
@keyframes lq-rise { from { transform: translateY(0.5em); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes lq-fade { from { transform: translateY(14px); opacity: 0; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .lq-title .ln, .lq-eyebrow, .lq-tag, .lq-actions { animation: none; } }

.look-lq[data-site="studio"] {
  --bg: #0b0b0e; --accent: #f5b82e; --accent-text: #171104; --red: #f5b82e; --red-deep: #7a5a12;
  --glass: rgba(18, 18, 24, 0.88); --tint: 245, 184, 46; --tint2: 255, 205, 110;
}
.look-lq[data-site="studio"] body::before {
  background:
    radial-gradient(45% 40% at 12% 8%, rgba(232, 105, 46, 0.22), transparent 70%),
    radial-gradient(40% 35% at 88% 22%, rgba(255, 207, 63, 0.16), transparent 70%),
    radial-gradient(50% 40% at 50% 100%, rgba(124, 194, 74, 0.14), transparent 70%),
    var(--bg);
content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
}
.look-lq[data-site="studio"] .lq-title .gt { background-image: linear-gradient(180deg, #fff 0%, #fff4dc 55%, #ffd27a 100%); }
.look-lq[data-site="studio"] .lq-title .gt2 { background-image: linear-gradient(180deg, #ffe8b8 0%, #f5b82e 60%, #d98e12 100%); }
.look-lq[data-site="studio"] .lq-principles b { color: #1a1205; }

@font-face { font-family: "Anton"; src: url("../fonts/anton-latin.woff2") format("woff2"); font-weight: 400; font-display: swap; }
.look-blood .lq-title { font-family: "Anton", Impact, sans-serif; font-weight: 400; letter-spacing: 0.005em; text-transform: uppercase; font-size: clamp(4rem, 13vw, 11rem); line-height: 0.88; }
.look-blood h2, .look-blood .lq-feature-txt h2 { font-family: "Anton", Impact, sans-serif; font-weight: 400; text-transform: uppercase; letter-spacing: 0.01em; }
.lq-acts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.lq-act { padding: 12px 12px 22px; display: grid; gap: 14px; transition: transform 0.4s cubic-bezier(.2,.8,.2,1); }
.lq-act img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; border-radius: 18px; filter: saturate(0.75) contrast(1.1); }
.lq-act h3 { margin: 0 8px; font-family: "Anton", Impact, sans-serif; font-weight: 400; text-transform: uppercase; font-size: 1.9rem; color: var(--accent); letter-spacing: 0.02em; }
.lq-act p { margin: 0 8px; color: var(--text-2); line-height: 1.55; }
.lq-shots { display: grid; grid-template-columns: 2fr 1fr; gap: 12px; padding: 12px; }
.lq-shots img { width: 100%; height: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; filter: saturate(0.75) contrast(1.1); }
.lq-shots img:first-child { grid-row: span 2; }
.lq-note { margin: 10px 4px 0; color: var(--text-2); font-size: 0.85rem; }
@media (max-width: 820px) { .lq-acts, .lq-shots { grid-template-columns: 1fr; } .lq-shots img:first-child { grid-row: auto; } }

.fx-bg { position: fixed; inset: 0; width: 100vw; height: 100vh; z-index: 0; pointer-events: none; }
.look-lq[data-site="studio"] main, .look-lq[data-site="studio"] .foot { position: relative; z-index: 1; }
.look-lq[data-site="studio"] { transition: --tint 0.6s; }
.look-lq[data-site="studio"][data-world="iow"] { --tint: 214, 31, 44; --tint2: 255, 77, 87; --accent: #ff4d57; }
.look-lq[data-site="studio"][data-world="shady"] { --tint: 255, 64, 160; --tint2: 255, 207, 63; --accent: #ffcf3f; }
.look-lq[data-site="studio"][data-world="memefarm"] { --tint: 124, 194, 74; --tint2: 190, 240, 120; --accent: #9be25e; }
.look-lq[data-site="studio"] .lq-title .gt, .look-lq[data-site="studio"] .lq-eyebrow { transition: filter 0.6s; }
.look-lq[data-site="studio"][data-world="iow"] .lq-title .gt2 { filter: hue-rotate(-40deg) saturate(1.4); }
.look-lq[data-site="studio"][data-world="shady"] .lq-title .gt2 { filter: hue-rotate(-75deg) saturate(1.6); }
.look-lq[data-site="studio"][data-world="memefarm"] .lq-title .gt2 { filter: hue-rotate(55deg) saturate(1.2); }

.app-hero-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: 40px; align-items: center; }
.app-copy { display: grid; gap: 18px; justify-items: start; }
.app-icon { width: 88px; height: 88px; border-radius: 22px; box-shadow: 0 12px 30px rgba(0, 0, 0, 0.35); }
.look-lq .lq-btn[aria-disabled="true"] { cursor: default; }
.app-visual { position: relative; }
.app-visual.phone { justify-self: center; width: min(300px, 80vw); padding: 10px; border-radius: 44px; background: rgba(20, 30, 20, 0.85); box-shadow: 0 30px 70px rgba(0, 0, 0, 0.3), inset 0 0 0 2px rgba(255, 255, 255, 0.25); }
.app-visual.phone img { border-radius: 34px; width: 100%; }
.app-about { padding: clamp(24px, 4vw, 40px); display: grid; gap: 12px; }
.app-about p { margin: 0; font-size: 1.12rem; line-height: 1.65; max-width: 64ch; }
.app-feats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.app-feats .lq-app { padding: 22px 24px; gap: 8px; align-content: start; }
.app-feats h3 { margin: 0; font-size: 1.25rem; }
.app-feats p { margin: 0; color: var(--text-2); line-height: 1.55; }
.app-shots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 12px; }
.app-shots img { width: 100%; border-radius: 16px; }
.app-shots.portrait { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 860px) {
  .app-hero-in, .app-feats { grid-template-columns: 1fr; }
  .app-shots.portrait { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.look-neon {
  --bg: #0c0812; --glass: rgba(26, 14, 30, 0.88); --rim: rgba(255, 255, 255, 0.2);
  --accent: #ffcf3f; --accent-text: #1a1206; --tint: 255, 64, 160; --tint2: 255, 207, 63;
  --text: #fbf3ff; --text-2: rgba(251, 243, 255, 0.72);
}
.look-neon body::before {
  background:
    radial-gradient(40% 35% at 10% 0%, rgba(255, 64, 160, 0.22), transparent 70%),
    radial-gradient(40% 35% at 95% 15%, rgba(255, 207, 63, 0.16), transparent 70%),
    linear-gradient(rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 46px 46px,
    linear-gradient(90deg, rgba(255, 255, 255, 0.025) 1px, transparent 1px) 0 0 / 46px 46px,
    var(--bg);
content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
}
.look-neon .lq-title .gt { background: none; color: #fff7d6; text-shadow: 0 0 6px #fff, 0 0 18px #ffcf3f, 0 0 42px #ff9d1f; }
.look-neon .lq-title .gt2 { color: #ffd0ec; text-shadow: 0 0 6px #fff, 0 0 18px #ff40a0, 0 0 46px #ff1f8f; animation: neon-flicker 7s infinite; }
@keyframes neon-flicker { 0%, 91%, 93%, 97%, 100% { opacity: 1; } 92%, 96% { opacity: 0.35; } }
.look-neon .lq-eyebrow { color: #ff7ac6; text-shadow: 0 0 10px rgba(255, 64, 160, 0.8); }
.look-neon .brand { color: #ffcf3f; text-shadow: 0 0 10px rgba(255, 207, 63, 0.6); }
.kebab-stage { height: min(560px, 70vh); border-radius: 30px; overflow: hidden; touch-action: none; user-select: none;
  background: radial-gradient(60% 60% at 50% 45%, rgba(255, 120, 40, 0.18), transparent 70%), rgba(20, 10, 18, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.16); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 0 60px rgba(255, 64, 160, 0.18); }
.kebab-stage.is-knife { cursor: none; }
.kebab-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.kebab-hint { position: absolute; left: 0; right: 0; top: 14px; text-align: center; font-size: 0.82rem; letter-spacing: 0.08em; color: rgba(255, 255, 255, 0.6); pointer-events: none; }
.kebab-count { position: absolute; left: 0; right: 0; bottom: 14px; text-align: center; font-weight: 700; color: #ffcf3f; text-shadow: 0 0 10px rgba(255, 207, 63, 0.6); pointer-events: none; }
.kebab-stamp { position: absolute; left: 50%; top: 42%; padding: 10px 16px; border: 4px solid #e8352b; color: #e8352b; font: 800 1.15rem/1 var(--font); letter-spacing: 0.12em;
  border-radius: 8px; transform: translate(-50%, -50%) rotate(-12deg) scale(2.2); opacity: 0; pointer-events: none; background: rgba(255, 240, 230, 0.06); }
.kebab-stamp.is-on { animation: stamp 3.4s cubic-bezier(.2,1.4,.4,1) forwards; }
@keyframes stamp { 0% { opacity: 0; transform: translate(-50%, -50%) rotate(-12deg) scale(2.2); } 10% { opacity: 0.95; transform: translate(-50%, -50%) rotate(-12deg) scale(1); } 75% { opacity: 0.9; } 100% { opacity: 0; transform: translate(-50%, -50%) rotate(-12deg) scale(1); } }

.look-farm {
  --bg: #dff3ff; --glass: rgba(255, 255, 255, 0.85); --rim: rgba(255, 255, 255, 0.9);
  --text: #15240d; --text-2: rgba(21, 36, 13, 0.72); --line: rgba(21, 36, 13, 0.12);
  --accent: #2f8f2a; --accent-text: #ffffff; --tint: 124, 194, 74; --tint2: 255, 190, 40;
  color-scheme: light;
}
.look-farm body { background: linear-gradient(180deg, #bfe7ff 0%, #e8f8ff 40%, #d9f2b8 75%, #a9dc7c 100%) fixed; }
.look-farm main, .look-farm .foot, .look-farm .ticker { position: relative; z-index: 1; }
.look-farm .lq-glass { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 18px 40px rgba(40, 80, 30, 0.14); }
.look-farm .lq-title .gt { background-image: linear-gradient(180deg, #2b5f1c 0%, #3f8f2f 100%); }
.look-farm .lq-title .gt2 { background-image: linear-gradient(180deg, #ffb52e 0%, #f08a1c 100%); }
.look-farm .lq-btn { color: var(--text); }
.look-farm .nav a:hover, .look-farm .nav a[aria-current="page"] { background: rgba(21, 36, 13, 0.08); }
.look-farm .lq-pill, .look-farm .lang { border-color: var(--line); }
.look-farm .foot .wrap { border-top-color: var(--line); }
html.farm-cursor, html.farm-cursor body { cursor: none; }
html.farm-cursor a, html.farm-cursor button { cursor: pointer; }
.ticker { overflow: hidden; white-space: nowrap; padding: 10px 0; background: rgba(21, 36, 13, 0.88); color: #eaf7da; font: 600 0.9rem/1 var(--font); }
.ticker span { display: inline-block; padding-left: 100%; animation: tick 40s linear infinite; }
.ticker b { margin-left: 26px; }
.ticker i { font-style: normal; margin-left: 6px; }
.ticker .up { color: #8dff6a; } .ticker .down { color: #ff7a6a; }
@keyframes tick { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .ticker span, .look-neon .lq-title .gt2 { animation: none; } .ticker span { padding-left: 0; } }
.farm-can { position: fixed; left: 0; top: 0; z-index: 100; pointer-events: none; transition: opacity 0.2s; filter: drop-shadow(0 4px 6px rgba(20,60,30,.3)); }
.app-hero .lq-title { font-size: clamp(2.8rem, 6.2vw, 5.6rem); overflow-wrap: normal; word-break: keep-all; hyphens: none; }
.kebab-fx { position: absolute; inset: 0; width: 100%; height: 100%; }
.look-neon .kebab-stage { height: min(680px, 78vh); background: radial-gradient(45% 55% at 50% 48%, rgba(255, 110, 30, 0.28), transparent 70%); border: 0; box-shadow: none; border-radius: 0; overflow: visible; }
.look-neon .app-hero-in { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); }

.farm-side { align-self: start; justify-self: end; width: min(320px, 100%); }
.farm-hud { padding: 16px 18px; display: grid; gap: 8px; }
.farm-hud-row { display: flex; align-items: center; gap: 10px; }
.farm-coin { width: 26px; height: 26px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff6c4, #ffcf3f 45%, #c8941a); box-shadow: inset 0 -2px 0 rgba(0,0,0,.15); }
.farm-coins { font: 800 1.6rem/1 var(--font-head); font-variant-numeric: tabular-nums; display: inline-block; }
.farm-coins.bump { animation: bump 0.35s cubic-bezier(.2,1.6,.4,1); }
@keyframes bump { 50% { transform: scale(1.18); color: #2f9e2a; } }
.farm-hud-label { font-size: 0.78rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-2); }
.farm-hud canvas { width: 100%; height: 70px; display: block; }
.farm-hud-hint { font-size: 0.85rem; color: var(--text-2); }
.look-farm .app-hero { min-height: auto; }
@media (max-width: 860px) { .farm-side { justify-self: stretch; width: 100%; } .look-farm .app-hero { min-height: auto; } }

.portals { display: flex; gap: 14px; height: clamp(420px, 68vh, 640px); }
.portal { position: relative; flex: 1 1 0; min-width: 0; border-radius: 30px; overflow: hidden; text-decoration: none; color: #fff; isolation: isolate;
  border: 1px solid rgba(255, 255, 255, 0.22); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 24px 60px rgba(0, 0, 0, 0.45);
  transition: flex-grow 0.7s cubic-bezier(.2,.8,.2,1), transform 0.7s cubic-bezier(.2,.8,.2,1); }
.portals:hover .portal { flex-grow: 0.7; }
.portals .portal:hover, .portals .portal:focus-visible { flex-grow: 2.6; }
.portal-fx { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; }
.portal::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,0.72) 100%); }
.portal-txt { position: absolute; left: 0; right: 0; bottom: 0; padding: clamp(18px, 2.6vw, 30px); display: grid; gap: 10px; justify-items: start; }
.portal-txt h2 { margin: 0; color: #fff; font-size: clamp(1.5rem, 2.5vw, 2.6rem); line-height: 0.98; }
.portal-txt p { margin: 0; max-width: 34ch; color: rgba(255, 255, 255, 0.82); font-size: 1rem; line-height: 1.5; opacity: 0; transform: translateY(8px); transition: opacity 0.4s 0.15s, transform 0.4s 0.15s; }
.portal:hover .portal-txt p, .portal:focus-visible .portal-txt p { opacity: 1; transform: none; }
.portal .lq-more { color: #fff; font-weight: 700; }
.portal .lq-pill { background: rgba(0, 0, 0, 0.35); border-color: rgba(255, 255, 255, 0.25); color: #fff; }
.portal[data-world="iow"] h2 { font-family: "Anton", Impact, sans-serif; font-weight: 400; text-transform: uppercase; letter-spacing: 0.01em; }
.portal[data-world="shady"] h2 { text-shadow: 0 0 8px #fff, 0 0 22px #ff40a0; }
.portal[data-world="memefarm"]::after { background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(20,50,10,0.75) 100%); }
@media (max-width: 860px) {
  .portals { flex-direction: column; height: auto; }
  .portal { flex: none; height: 300px; }
  .portals:hover .portal, .portals .portal:hover { flex-grow: 0; }
  .portal-txt p { opacity: 1; transform: none; }
}

.press-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.press-facts .lq-glass { padding: 20px 22px; display: grid; gap: 6px; }
.press-facts span { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-2); }
.press-facts b { font: 700 1.25rem/1.2 var(--font-head); }
.press-list { margin: 0; padding-left: 1.1em; display: grid; gap: 8px; color: var(--text-2); line-height: 1.5; }
.press-games { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.press-game { padding: 12px 12px 18px; display: grid; gap: 12px; }
.look-lq a.press-game { color: var(--text); text-decoration: none; }
.press-game img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 16px; }
.press-game .t { display: grid; gap: 8px; padding: 0 6px; }
.press-game h3 { margin: 0; font-size: 1.35rem; }
.press-game p { margin: 0; color: var(--text-2); line-height: 1.5; }
.press-hero .lq-btn { text-transform: none; }
@media (max-width: 860px) { .press-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .press-games { grid-template-columns: 1fr; } }

.sigma-hero { margin-top: 14px; justify-self: center; align-self: center; display: grid; justify-items: center; gap: 2px; padding: 0; border: 0; background: none; cursor: pointer; color: var(--text); }
.sigma-hero img { width: 280px; height: 280px; filter: drop-shadow(0 14px 18px rgba(40, 80, 30, 0.25)); transition: transform 0.3s cubic-bezier(.2,1.4,.4,1); }
.sigma-hero.is-sigma img { transform: scale(1.06) rotate(-2deg); }
.sigma-name { font: 800 0.95rem/1 var(--font-head); padding: 7px 12px; border-radius: 999px; background: rgba(255, 255, 255, 0.6); border: 1px solid rgba(255, 255, 255, 0.9); }
.sigma-hero:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 20px; }
@media (max-width: 860px) { .sigma-hero { justify-self: center; } .sigma-hero img { width: 170px; height: 170px; } }

.look-neon .app-hero-in { grid-template-columns: 1fr; gap: 30px; }
.look-neon .app-copy { grid-template-columns: auto 1fr; column-gap: 22px; align-items: end; }
.look-neon .app-copy .app-icon { grid-row: span 2; align-self: start; }
.look-neon .app-copy > :not(.app-icon) { grid-column: 2; }
.shop-wrap { display: grid; gap: 12px; }
.shop-stage { position: relative; width: 100%; aspect-ratio: 900 / 420; border-radius: 26px; overflow: hidden; user-select: none; touch-action: manipulation;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18), 0 0 80px rgba(255, 64, 160, 0.25), 0 30px 70px rgba(0, 0, 0, 0.55); background: #2a1a1a; }
.shop-stage::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0) 30%), radial-gradient(120% 80% at 50% 120%, rgba(12, 8, 18, 0.35), transparent 60%); }
.shop-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.shop-banner { position: absolute; left: 50%; top: 38%; transform: translate(-50%, -50%) scale(2); opacity: 0; pointer-events: none;
  font: 800 clamp(2rem, 6vw, 4.5rem)/1 var(--font-head); letter-spacing: 0.06em; color: #fff; padding: 8px 22px; border-radius: 14px;
  background: rgba(232, 53, 43, 0.85); box-shadow: 0 0 40px rgba(232, 53, 43, 0.7); }
.shop-banner.is-on { animation: raid 4.2s cubic-bezier(.2,1.4,.4,1) forwards; }
@keyframes raid { 0% { opacity: 0; transform: translate(-50%, -50%) scale(2) rotate(-6deg); } 8% { opacity: 1; transform: translate(-50%, -50%) scale(1) rotate(-6deg); } 85% { opacity: 1; } 100% { opacity: 0; transform: translate(-50%, -50%) scale(1) rotate(-6deg); } }
.shop-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 14px 20px; border-radius: 20px; }
.shop-label { font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-2); }
.shop-till { font: 800 1.6rem/1 var(--font-head); color: #ffcf3f; text-shadow: 0 0 12px rgba(255, 207, 63, 0.6); font-variant-numeric: tabular-nums; display: inline-block; }
.shop-till.bump { animation: bump 0.35s cubic-bezier(.2,1.6,.4,1); }
.shop-hint { color: var(--text-2); font-size: 0.92rem; margin-left: auto; }
@media (max-width: 860px) { .look-neon .app-copy { grid-template-columns: 1fr; } .look-neon .app-copy > :not(.app-icon) { grid-column: auto; } .shop-hint { margin-left: 0; } }

.look-farm .top { background: linear-gradient(180deg, #a86a33 0 48%, #7d4a1f 48% 52%, #9a5f2c 52% 100%);
  border: 3px solid #5c3412; border-radius: 14px;  box-shadow: inset 0 2px 0 rgba(255, 220, 160, 0.35), 0 6px 0 #4a2a0e, 0 16px 28px rgba(60, 35, 10, 0.3); }
.look-farm .top::before, .look-farm .top::after { content: ""; position: absolute; top: 50%; width: 9px; height: 9px; margin-top: -4px; border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #e8e0d0, #8a8070 70%); box-shadow: 0 1px 0 rgba(0,0,0,.4); }
.look-farm .top::before { left: 10px; } .look-farm .top::after { right: 10px; }
.look-farm .top .wrap { padding: 0 32px 0 28px; }
.look-farm .brand { color: #fff4d6; text-shadow: 0 2px 0 #4a2a0e; font-size: 1.15rem; }
.look-farm .nav a { color: #ffe9b8; font-weight: 700; text-shadow: 0 1px 0 #4a2a0e; }
.look-farm .nav a:hover, .look-farm .nav a[aria-current="page"] { background: rgba(255, 240, 200, 0.16); color: #fff; }
.look-farm .lang { border-color: rgba(255, 233, 184, 0.55); }

@media (max-width: 820px) {
  .look-lq .top .wrap { padding: 12px 16px 10px; row-gap: 8px; }
  .look-lq .brand { padding-top: 2px; }
  .look-lq .nav { margin-left: -10px; width: calc(100% + 10px); flex-wrap: wrap; gap: 2px; }
  .look-lq .nav a { white-space: nowrap; padding: 6px 10px; font-size: 0.88rem; }
  .look-farm .top .wrap { padding: 12px 26px 10px; }
}

.look-neon {
  --bg: #1a0a2e; --glass: rgba(48, 16, 72, 0.88); --rim: rgba(255, 140, 220, 0.38);
  --text-2: rgba(255, 240, 255, 0.8);
}
.look-neon body::before {
  background:
    radial-gradient(45% 40% at 0% 0%, rgba(255, 40, 160, 0.55), transparent 70%),
    radial-gradient(40% 35% at 100% 10%, rgba(255, 190, 30, 0.42), transparent 70%),
    radial-gradient(45% 40% at 100% 70%, rgba(0, 220, 255, 0.32), transparent 70%),
    radial-gradient(45% 40% at 0% 85%, rgba(140, 60, 255, 0.45), transparent 70%),
    radial-gradient(35% 30% at 50% 50%, rgba(255, 90, 40, 0.22), transparent 70%),
    linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 46px 46px,
    linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 46px 46px,
    var(--bg);
content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
}
.look-neon h2 { background: linear-gradient(90deg, #ffcf3f, #ff40a0 45%, #36e0ff); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 14px rgba(255, 64, 160, 0.45)); }
.look-neon .lq-app { border-top: 3px solid var(--c, #ff40a0); box-shadow: 0 0 28px color-mix(in srgb, var(--c, #ff40a0) 35%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.3); }
.look-neon .lq-app h3 { color: var(--c, #ff40a0); text-shadow: 0 0 12px color-mix(in srgb, var(--c, #ff40a0) 60%, transparent); }
.look-neon .lq-app:nth-child(6n+1) { --c: #ff40a0; }
.look-neon .lq-app:nth-child(6n+2) { --c: #ffcf3f; }
.look-neon .lq-app:nth-child(6n+3) { --c: #36e0ff; }
.look-neon .lq-app:nth-child(6n+4) { --c: #7dff5a; }
.look-neon .lq-app:nth-child(6n+5) { --c: #ff8a2a; }
.look-neon .lq-app:nth-child(6n+6) { --c: #b77bff; }
.look-neon .lq-btn.ghost { border-color: rgba(54, 224, 255, 0.6); box-shadow: 0 0 18px rgba(54, 224, 255, 0.25); }
.look-neon .lq-eyebrow { color: #36e0ff; text-shadow: 0 0 10px rgba(54, 224, 255, 0.8); }

.consent { --c-bg: #17131f; --c-line: rgba(255, 255, 255, 0.14); --c-text: #f7f3fb; --c-muted: rgba(247, 243, 251, 0.72); --c-acc: var(--accent, #f5b82e); --c-acc-text: #14100a;
  position: fixed; z-index: 200; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
  width: min(620px, calc(100% - 24px)); padding: 22px 22px 16px; border-radius: 22px; color: var(--c-text); background: var(--c-bg);
  border: 1px solid var(--c-line); box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55); font: 400 0.95rem/1.5 "Figtree", system-ui, sans-serif;
  animation: consent-in 0.35s cubic-bezier(.16,1,.3,1) both; }
.consent strong { display: block; font: 800 1.2rem/1.2 var(--font-head, sans-serif); margin-bottom: 6px; }
.consent p { margin: 0 0 16px; color: var(--c-muted); }
.consent-set { display: grid; gap: 8px; margin: 0 0 16px; }
.consent-set[hidden] { display: none; }
.consent-row { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border-radius: 14px; background: rgba(255, 255, 255, 0.05); border: 1px solid var(--c-line); cursor: pointer; }
.consent-row span { flex: 1; display: grid; gap: 2px; }
.consent-row small { color: var(--c-muted); font-size: 0.84rem; line-height: 1.4; }
.consent-switch { appearance: none; -webkit-appearance: none; flex: none; width: 46px; height: 26px; margin: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.2); position: relative; cursor: pointer; transition: background 0.15s; }
.consent-switch::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform 0.15s; }
.consent-switch:checked { background: var(--c-acc); }
.consent-switch:checked::after { transform: translateX(20px); }
.consent-switch:disabled { opacity: 0.55; cursor: not-allowed; }
.consent-switch:focus-visible { outline: 2px solid var(--c-acc); outline-offset: 2px; }
.consent-btns { display: grid; grid-template-columns: auto 1fr 1fr; gap: 8px; }
.consent button { font: 700 0.95rem/1 "Figtree", system-ui, sans-serif; padding: 13px 16px; border-radius: 12px; cursor: pointer; border: 0; transition: filter 0.1s; }
.consent [data-a="none"], .consent [data-a="all"] { background: var(--c-acc); color: var(--c-acc-text); }
.consent .consent-ghost { background: transparent; color: var(--c-text); border: 1px solid var(--c-line); }
.consent button:hover { filter: brightness(1.1); }
.consent button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.consent-more { display: inline-block; margin-top: 12px; font-size: 0.82rem; color: var(--c-muted); }
@keyframes consent-in { from { opacity: 0; transform: translate(-50%, 18px); } to { opacity: 1; transform: translate(-50%, 0); } }
@media (max-width: 560px) { .consent-btns { grid-template-columns: 1fr 1fr; } .consent .consent-ghost { grid-column: 1 / -1; order: 3; } }
@media (prefers-reduced-motion: reduce) { .consent { animation: none; } }
.look-blood .consent { --c-bg: #160608; --c-acc: #d61f2c; --c-acc-text: #fff; }
.look-farm .consent { --c-bg: #fff8e6; --c-line: rgba(60, 40, 10, 0.18); --c-text: #2b2208; --c-muted: #5d5136; --c-acc: #2f8f2a; --c-acc-text: #fff; }
.look-farm .consent-row { background: rgba(60, 40, 10, 0.05); }
.look-farm .consent-switch { background: rgba(60, 40, 10, 0.2); }
.look-farm .consent button:focus-visible { outline-color: #2b2208; }

.worlds { position: relative; padding: 28px 0 10px; }
.worlds-head { width: min(1280px, calc(100% - 24px)); margin: 0 auto 18px; }
.worlds-title { font: 900 clamp(2.2rem, 6vw, 4.6rem)/0.98 var(--font-head); letter-spacing: -0.03em; margin: 8px 0 0; color: #fff; }
.worlds-title em { font-style: normal; background: linear-gradient(90deg, #ff3b47, #ffcf3f 50%, #7dff5a); -webkit-background-clip: text; background-clip: text; color: transparent; }
.worlds-row { display: flex; gap: 12px; width: min(1280px, calc(100% - 24px)); height: min(78vh, 720px); margin: 0 auto; }
.world { position: relative; flex: 1 1 0; min-width: 0; border-radius: 28px; color: #fff; text-decoration: none; isolation: isolate;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.45); }
.world-art { position: absolute; inset: 0; z-index: -2; border-radius: inherit; background-size: cover; background-position: center; }
.world::before { content: ""; position: absolute; inset: 0; z-index: -3; border-radius: inherit; opacity: 0; transition: opacity 0.12s ease-out; will-change: opacity; }
.world:hover::before, .world:focus-visible::before { opacity: 1; transition-duration: 0.08s; }
.world:focus-visible { outline: none; }

.world::after { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; }
.world-txt { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: clamp(18px, 3vw, 34px); display: grid; gap: 6px; }
.world-status { font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; }
.world-name { font: 900 clamp(1.8rem, 3.4vw, 3.2rem)/0.95 var(--font-head); letter-spacing: -0.02em; }
.world-tag { max-width: 34ch; font-size: 1rem; line-height: 1.4; }
.world-go { justify-self: start; margin-top: 8px; padding: 10px 18px; border-radius: 999px; font-weight: 800; font-size: 0.92rem; }

.world-iow .world-art { filter: saturate(0.7) contrast(1.15) brightness(0.8); }
.world-iow::after { background: radial-gradient(120% 70% at 50% 0%, rgba(160, 0, 10, 0.55), transparent 60%), linear-gradient(180deg, rgba(40, 0, 4, 0.1) 30%, rgba(30, 0, 2, 0.92)); }
.world-iow .world-name { font-family: "Anton", var(--font-head); font-weight: 400; text-transform: uppercase; color: #ff2a36; text-shadow: 0 0 24px rgba(255, 0, 20, 0.6), 0 2px 0 #000; letter-spacing: 0.01em; }
.world-iow .world-status { color: #ff8a8f; }
.world-iow .world-go { background: #d1101d; color: #fff; box-shadow: 0 0 24px rgba(255, 0, 20, 0.5); }
.world-iow::before { box-shadow: 0 0 0 2px #ff2a36, 0 0 60px rgba(255, 20, 30, 0.45); }

.world-shady .world-art { background-position: 45% center; filter: saturate(1.25); }
.world-shady::after { background: linear-gradient(180deg, rgba(26, 10, 46, 0.05) 30%, rgba(26, 10, 46, 0.94)), radial-gradient(80% 60% at 0% 100%, rgba(255, 40, 160, 0.45), transparent 70%), radial-gradient(70% 50% at 100% 90%, rgba(54, 224, 255, 0.3), transparent 70%); }
.world-shady .world-name { color: #fff7d6; text-shadow: 0 0 6px #fff, 0 0 18px #ffcf3f, 0 0 40px #ff40a0; }
.world-shady .world-status { color: #36e0ff; text-shadow: 0 0 10px rgba(54, 224, 255, 0.8); }
.world-shady .world-go { background: linear-gradient(90deg, #ff40a0, #ffcf3f); color: #1a0a2e; box-shadow: 0 0 24px rgba(255, 64, 160, 0.5); }
.world-shady::before { box-shadow: 0 0 0 2px #ff40a0, 0 0 60px rgba(255, 64, 160, 0.5), 0 0 120px rgba(54, 224, 255, 0.25); }

.world-memefarm .world-art { background-position: center 30%; filter: saturate(1.15); }
.world-memefarm::after { background: linear-gradient(180deg, rgba(190, 235, 255, 0) 35%, rgba(30, 70, 20, 0.9)); }
.world-memefarm .world-name { color: #ffd23f; text-shadow: 0 3px 0 #2b5f1c, 0 0 20px rgba(0, 0, 0, 0.35); }
.world-memefarm .world-status { color: #d9ffb0; }
.world-memefarm .world-go { background: #ffb52e; color: #2b2208; box-shadow: 0 4px 0 #b8741a; }
.world-memefarm::before { box-shadow: 0 0 0 2px #7dff5a, 0 0 60px rgba(125, 255, 90, 0.35); }

@media (hover: none), (max-width: 820px) {
  .worlds-row { flex-direction: column; height: auto; }
  .world { flex: none; height: 62vh; min-height: 380px; }
}
.ticker span { will-change: transform; }
@keyframes pig-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -12px; } }
.sigma-hero img { animation: pig-bob 2.8s ease-in-out infinite; will-change: translate; }
.zoomable { cursor: zoom-in; }
.zoomable:focus-visible { outline: 2px solid var(--accent, #fff); outline-offset: 3px; }
.zoom-open, .zoom-open body { overflow: hidden; }
.zoom { position: fixed; inset: 0; z-index: 300; display: grid; place-items: center; padding: 56px 12px 24px; background: rgba(5, 5, 10, 0.92); cursor: zoom-out; animation: zoom-in 0.25s ease-out both; touch-action: pan-y; }
.zoom-pic { max-width: min(100%, 1600px); max-height: 100%; width: auto; height: auto; object-fit: contain; border-radius: 12px; box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6); }
.zoom-btn { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; border: 0; border-radius: 999px; background: rgba(255, 255, 255, 0.14); color: #fff; font-size: 2rem; line-height: 1; cursor: pointer; }
.zoom-btn:hover, .zoom-btn:focus-visible { background: rgba(255, 255, 255, 0.28); }
.zoom-x { top: 10px; right: 12px; }
.zoom-prev { left: 12px; top: 50%; translate: 0 -50%; }
.zoom-next { right: 12px; top: 50%; translate: 0 -50%; }
.zoom.is-single .zoom-prev, .zoom.is-single .zoom-next { display: none; }
@keyframes zoom-in { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .zoom { animation: none; } }

[data-site="studio"] .lq-glass, [data-site="studio"].look-lq .top { background: rgba(20, 16, 24, 0.92); }
[data-site="studio"] .lq-glass::before { display: none; }
@media (prefers-reduced-motion: reduce) { .world::before { transition: none; } }
.iow-bg { position: absolute; top: 0; left: 0; right: 0; height: 100vh; min-height: 640px; z-index: 0; pointer-events: none; background-size: cover; background-position: center top; }

.look-lq.has-side .top .wrap { padding: 0 8px; }
.nav-studio { margin-left: 0; flex: 1; align-items: center; }
.look-lq .nav-studio { gap: 6px; }
.look-lq .nav-studio a { padding: 9px 16px; font-weight: 600; color: var(--text); background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.1); }
.look-lq .nav-studio a:hover { background: rgba(255, 255, 255, 0.14); }
.look-lq .nav-studio a[aria-current="page"] { background: #f5b82e; border-color: #f5b82e; color: #1a1208; }
.look-lq .nav-studio .lang { margin-left: auto; background: none; border-color: transparent; color: var(--text-2); }
@media (max-width: 820px) { .look-lq.has-side .top .wrap { padding: 8px; } .look-lq .nav-studio { margin-left: 0; width: 100%; } .look-lq .nav-studio a { padding: 7px 12px; } }

.contact-cta { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.contact-cta p { margin: 6px 0 0; color: var(--text-2); }
@media (max-width: 820px) { .contact-cta { grid-template-columns: 1fr; } .contact-cta .lq-btn { justify-self: start; } }

.page-head { padding-top: 48px; }
.page-head h1 { font: 900 clamp(2.4rem, 6vw, 4.2rem)/1 var(--font-head); margin: 8px 0 12px; color: #fff; }

.game-rows { display: grid; gap: 18px; }
.game-row { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); overflow: hidden; }
.game-row-pic { min-height: 320px; background-size: cover; background-position: center; border-radius: var(--radius) 0 0 var(--radius); }
.game-row-txt { padding: clamp(22px, 3vw, 36px); display: grid; gap: 10px; align-content: center; }
.game-row-txt h2 { margin: 0; }
.game-row-txt p { margin: 0; color: var(--text-2); line-height: 1.55; }
.game-row-txt .game-row-tag { color: var(--text); font-size: 1.15rem; font-weight: 600; }
.game-row-txt .lq-btn { justify-self: start; margin-top: 6px; }
@media (max-width: 820px) { .game-row { grid-template-columns: 1fr; } .game-row-pic { min-height: 220px; border-radius: var(--radius) var(--radius) 0 0; } }

.roadmap-list { display: grid; gap: 18px; }
.roadmap-game { padding: clamp(18px, 3vw, 30px) clamp(18px, 3vw, 30px) 6px; }
.roadmap-game h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.roadmap-game h2 a { color: #fff; text-decoration: none; }
.roadmap-game .lq-timeline { padding: 10px 0 0; }
.lq-timeline li.done::before { background: #7dff5a; }

.contact-form { padding: clamp(22px, 4vw, 40px); display: grid; gap: 16px; max-width: 720px; }
.contact-form label { display: grid; gap: 6px; font-weight: 600; font-size: 0.95rem; }
.contact-form input, .contact-form select, .contact-form textarea { font: inherit; font-weight: 400; color: var(--text); background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 12px; padding: 12px 14px; }
.contact-form select option { color: #111; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { outline: 2px solid #f5b82e; outline-offset: 1px; }
.contact-form textarea { resize: vertical; }
.contact-form .lq-btn { justify-self: start; cursor: pointer; font: inherit; font-weight: 600; }
.contact-note { margin: 0; font-size: 0.88rem; color: var(--text-2); }
.contact-direct { margin-top: 24px; max-width: 720px; }

.side-brand { display: none; }
@media (min-width: 821px) {
  .has-side body { padding-left: 236px; }
  .look-lq.has-side .top { position: fixed; left: 16px; top: 16px; bottom: 16px; width: 204px; margin: 0; border-radius: 26px; }
  .look-lq.has-side .top .wrap { width: 100%; height: 100%; padding: 22px 12px; flex-direction: column; align-items: stretch; flex-wrap: nowrap; }
  .side-brand { display: block; padding: 0 8px 14px; font: 800 1.05rem/1.2 var(--font-head); color: #fff; text-decoration: none; }
  .look-lq.has-side .side-brand { color: #fff; }
  .look-lq .nav-studio { flex-direction: column; align-items: stretch; gap: 8px; }
  .look-lq .nav-studio a { padding: 12px 16px; border-radius: 14px; }
  .look-lq .nav-studio .lang { margin-left: 0; margin-top: auto; }
}

/* Plugin documentation (www/plugins/<slug>/docs) */
.doc-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 40px; align-items: start; }
.doc-toc { position: sticky; top: 24px; display: grid; gap: 4px; font-size: 0.9rem; }
.doc-toc strong { margin-bottom: 6px; }
.doc-toc a { color: var(--text-2); text-decoration: none; padding: 3px 0; }
.doc-toc a:hover { color: var(--text); }
.doc { max-width: 900px; line-height: 1.65; }
.doc h2 { margin: 2.2em 0 0.6em; scroll-margin-top: 20px; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.doc h2:first-child { margin-top: 0; }
.doc h3 { margin: 1.6em 0 0.5em; scroll-margin-top: 20px; }
.doc code { font-family: ui-monospace, Consolas, monospace; font-size: 0.9em; background: rgba(255, 255, 255, 0.08); padding: 1px 5px; border-radius: 5px; overflow-wrap: anywhere; }
.doc pre { background: rgba(0, 0, 0, 0.35); border: 1px solid rgba(255, 255, 255, 0.12); border-radius: 12px; padding: 14px 16px; overflow-x: auto; }
.doc pre code { background: none; padding: 0; overflow-wrap: normal; }
.doc blockquote { margin: 1.2em 0; padding: 12px 16px; border-left: 4px solid #f5b82e; background: rgba(245, 184, 46, 0.08); border-radius: 0 10px 10px 0; }
.doc blockquote p { margin: 0; }
.doc hr { border: 0; border-top: 1px solid rgba(255, 255, 255, 0.14); margin: 2em 0; }
.doc-table { overflow-x: auto; margin: 1em 0; }
.doc table { border-collapse: collapse; width: 100%; font-size: 0.92rem; }
.doc th, .doc td { text-align: left; vertical-align: top; padding: 8px 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
.doc th { white-space: nowrap; }
.doc-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.doc-card { display: grid; gap: 8px; padding: 22px; text-decoration: none; color: var(--text); }
.doc-card span { color: var(--text-2); }
@media (max-width: 900px) { .doc-layout { grid-template-columns: 1fr; } .doc-toc { position: static; } }
