:root {
  color-scheme: dark;
  --abyss: #0d1230;
  --night: #10162e;
  --royal: #1a2347;
  --violet: #2a1a4a;
  --ocean: #0e3a52;
  --teal: #1f6f6b;
  --teal-deep: #13524f;
  --cyan: #2fd1d8;
  --gold: #d9b65a;
  --gold-hot: #f2b441;
  --gold-deep: #8c6519;
  --paper: #faf5e8;
  --paper-dim: #e9dfc9;
  --ink: #111936;
  --mist: #c9d9e8;
  --line: rgba(217, 182, 90, .34);
  --glass: rgba(16, 22, 46, .78);
  --glass-strong: rgba(13, 18, 48, .94);
  --shadow: 0 24px 70px rgba(0, 0, 0, .34);
  --glow: 0 0 34px rgba(47, 209, 216, .16);
}

* { box-sizing: border-box; }

html {
  min-width: 320px;
  scroll-behavior: smooth;
  background: var(--abyss);
}

body {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 12% 8%, rgba(47, 209, 216, .15), transparent 28rem),
    radial-gradient(circle at 88% 22%, rgba(242, 180, 65, .13), transparent 24rem),
    radial-gradient(circle at 72% 78%, rgba(90, 47, 133, .24), transparent 34rem),
    linear-gradient(155deg, var(--abyss), var(--night) 42%, #0a2037 76%, var(--violet));
  color: var(--paper);
  font: 17px/1.58 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body::before,
body::after {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
}

body::before {
  opacity: .3;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.72) 0 1px, transparent 1.4px),
    radial-gradient(circle, rgba(47,209,216,.7) 0 1px, transparent 1.5px);
  background-position: 0 0, 37px 51px;
  background-size: 86px 86px, 143px 143px;
  mask-image: linear-gradient(to bottom, black, transparent 62%);
}

body::after {
  top: auto;
  height: 24rem;
  opacity: .4;
  background:
    repeating-radial-gradient(ellipse at 50% 120%, transparent 0 34px, rgba(47,209,216,.16) 35px 36px, transparent 37px 56px);
}

button,
input { font: inherit; }

button { cursor: pointer; }

button:focus-visible,
input:focus-visible,
a:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--cyan);
  outline-offset: 4px;
}

[hidden] { display: none !important; }

.gulisi-shell {
  width: min(100%, 1120px);
  margin: auto;
  padding: max(16px, env(safe-area-inset-top)) 16px max(64px, env(safe-area-inset-bottom));
}

.gulisi-shell > * { min-width: 0; }

.gulisi-header {
  position: relative;
  z-index: 2;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0 17px;
  border-bottom: 1px solid var(--line);
}

.brand {
  display: flex;
  gap: 11px;
  align-items: center;
  color: var(--paper);
  text-decoration: none;
  letter-spacing: .16em;
}

.brand span {
  position: relative;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid var(--gold);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, var(--cyan), var(--teal-deep) 48%, var(--abyss) 76%);
  color: var(--paper);
  box-shadow: 0 0 0 5px rgba(217,182,90,.08), 0 0 28px rgba(47,209,216,.25);
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 900;
}

.brand span::after {
  position: absolute;
  inset: -7px;
  border: 1px dashed rgba(217,182,90,.45);
  border-radius: 50%;
  content: "";
}

.tag,
.overline,
.garifuna-label {
  color: var(--cyan);
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.tag {
  max-width: 46%;
  color: var(--mist);
  text-align: right;
}

.hero {
  position: relative;
  min-height: 30rem;
  overflow: hidden;
  padding: 64px 0 35px;
}

.hero::after {
  position: absolute;
  right: 5%;
  bottom: 2.5rem;
  left: 46%;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cyan), var(--gold), transparent);
  box-shadow: 0 -32px rgba(47,209,216,.12), 0 32px rgba(217,182,90,.1);
  content: "";
}

.hero h1 {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: .3rem 0 1.2rem;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.7rem, 17vw, 8rem);
  letter-spacing: -.055em;
  line-height: .82;
  text-wrap: balance;
  text-shadow: 0 2px 34px rgba(47,209,216,.14);
}

.hero h1 em {
  display: inline-block;
  color: var(--gold);
  font-size: .48em;
  font-weight: 500;
  letter-spacing: -.025em;
}

.hero > p:not(.overline) {
  position: relative;
  z-index: 2;
  max-width: 700px;
  color: var(--mist);
  font-size: 1.05rem;
}

.language-constellation {
  position: absolute;
  top: 35px;
  right: -92px;
  width: 310px;
  height: 310px;
  opacity: .68;
  pointer-events: none;
}

.language-constellation .orbit,
.language-constellation .star,
.future-g { position: absolute; }

.language-constellation .orbit {
  inset: 14%;
  border: 1px solid rgba(47,209,216,.48);
  border-radius: 50%;
  box-shadow: inset 0 0 44px rgba(47,209,216,.08), 0 0 36px rgba(47,209,216,.08);
  transform: rotate(-18deg) scaleY(.58);
}

.language-constellation .orbit-two {
  inset: 25% 5%;
  border-color: rgba(217,182,90,.55);
  transform: rotate(54deg) scaleY(.42);
}

.language-constellation .star {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 17px var(--cyan);
}

.language-constellation .star-one { top: 21%; left: 26%; }
.language-constellation .star-two { top: 55%; left: 5%; background: var(--gold); box-shadow: 0 0 17px var(--gold); }
.language-constellation .star-three { right: 18%; bottom: 17%; }

.future-g {
  inset: 0;
  display: grid;
  place-items: center;
  color: rgba(250,245,232,.13);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 10rem;
  font-weight: 900;
}

.language-toggle,
.lookup-language,
.result-filters {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 20px;
}

.language-toggle button,
.lookup-language button,
.result-filters button,
.text-button,
.more-results {
  min-height: 42px;
  padding: 8px 15px;
  border: 1px solid rgba(217,182,90,.55);
  border-radius: 999px;
  background: rgba(13,18,48,.7);
  color: var(--paper);
  font-weight: 800;
}

.language-toggle button[aria-pressed="true"],
.lookup-language button[aria-pressed="true"],
.result-filters button[aria-pressed="true"],
.text-button[aria-pressed="true"],
.language-toggle button:hover,
.lookup-language button:hover,
.result-filters button:hover,
.text-button:hover,
.more-results:hover {
  border-color: var(--cyan);
  background: linear-gradient(135deg, var(--teal-deep), var(--ocean));
  box-shadow: 0 0 22px rgba(47,209,216,.15);
  color: white;
}

.panel {
  position: relative;
  margin-top: 22px;
  overflow: hidden;
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(26,35,71,.9), rgba(13,18,48,.88));
  box-shadow: var(--shadow), var(--glow);
  backdrop-filter: blur(16px);
}

.panel::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 9rem;
  height: 3px;
  background: linear-gradient(90deg, var(--gold-hot), var(--cyan), transparent);
  content: "";
}

.panel h2,
.creator h2 {
  margin: 0 0 8px;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2rem, 8vw, 3.2rem);
  line-height: 1.02;
}

.section-heading > p:last-child,
.panel > p:not(.overline, .privacy-chip, .status) { color: var(--mist); }

.steps {
  display: grid;
  gap: 12px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}

.steps li {
  display: grid;
  min-width: 0;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 15px;
  border: 1px solid rgba(201,217,232,.16);
  border-radius: 16px;
  background: rgba(8,13,38,.58);
}

.steps li > span {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid var(--gold);
  border-radius: 50%;
  color: var(--gold);
  font-weight: 900;
}

.steps li.done {
  border-color: rgba(47,209,216,.62);
  background: rgba(31,111,107,.18);
}

.steps li.done > span {
  border-color: var(--cyan);
  background: var(--teal-deep);
  color: white;
  box-shadow: 0 0 20px rgba(47,209,216,.2);
}

.steps strong { display: block; color: var(--paper); }

.steps p {
  margin: 4px 0 0;
  overflow-wrap: anywhere;
  color: var(--mist);
  font-size: .89rem;
}

.privacy-chip {
  display: inline-block;
  margin: 0 0 13px;
  padding: 6px 11px;
  border: 1px solid rgba(217,182,90,.46);
  border-radius: 999px;
  background: rgba(217,182,90,.1);
  color: var(--gold);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.domain-selector {
  min-width: 0;
  margin: 24px 0 0;
  padding: 0;
  border: 0;
}

.domain-selector legend {
  margin-bottom: 10px;
  color: var(--gold);
  font-weight: 900;
}

.domain-selector > div {
  display: grid;
  gap: 10px;
}

.domain-selector button {
  display: grid;
  min-width: 0;
  gap: 4px;
  padding: 15px;
  border: 1px solid rgba(201,217,232,.28);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(14,58,82,.62), rgba(42,26,74,.5));
  color: var(--paper);
  text-align: left;
  box-shadow: inset 0 0 0 1px rgba(47,209,216,.04);
}

.domain-selector button[aria-pressed="true"] {
  border-color: var(--gold);
  background: linear-gradient(135deg, rgba(31,111,107,.55), rgba(42,26,74,.72));
  box-shadow: 0 0 0 2px rgba(217,182,90,.15), 0 0 28px rgba(47,209,216,.12);
}

.domain-selector button strong { overflow-wrap: anywhere; color: var(--paper); }
.domain-selector button small,
#domain-hint { color: var(--mist); font-size: .79rem; }
#domain-hint { display: block; margin-top: 9px; }

.controls {
  display: grid;
  gap: 14px;
  align-items: end;
  margin-top: 20px;
}

.controls label,
.search-label,
.voice-file {
  display: grid;
  gap: 7px;
  color: var(--paper);
  font-weight: 800;
}

.controls input,
.search-label input,
.voice-file input {
  width: 100%;
  min-height: 50px;
  padding: 11px 13px;
  border: 1px solid rgba(201,217,232,.35);
  border-radius: 11px;
  background: rgba(250,245,232,.96);
  color: var(--ink);
}

.controls input[type="file"],
.voice-file input[type="file"] {
  padding: 8px;
  border-color: rgba(47,209,216,.5);
  border-style: dashed;
}

.controls small,
.voice-file small { color: var(--mist); font-size: .79rem; font-weight: 500; }

.primary {
  min-height: 52px;
  padding: 12px 19px;
  border: 1px solid var(--gold);
  border-radius: 11px;
  background: linear-gradient(135deg, var(--gold-hot), var(--gold-deep));
  color: #11152b;
  box-shadow: 0 9px 26px rgba(242,180,65,.16);
  font-weight: 900;
}

.primary:hover { filter: brightness(1.08); transform: translateY(-1px); }
.primary:disabled { cursor: wait; filter: grayscale(.28); opacity: .72; transform: none; }

.remember-device {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 14px;
  color: var(--paper);
  font-weight: 850;
}

.remember-device input {
  width: 22px;
  height: 22px;
  accent-color: var(--cyan);
}

.remember-copy {
  display: block;
  margin-top: 5px;
  color: var(--mist);
  font-size: .79rem;
}

.device-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 12px;
}

.device-actions button {
  min-height: 42px;
  padding: 8px 13px;
  border: 1px solid rgba(201,217,232,.32);
  border-radius: 10px;
  background: rgba(13,18,48,.72);
  color: var(--paper);
  font-weight: 800;
}

.device-actions button:last-child { border-color: rgba(242,180,65,.58); color: var(--gold); }
.device-actions button:hover { border-color: var(--cyan); }

.recovery {
  margin-top: 20px;
  padding: 14px;
  border: 1px solid rgba(201,217,232,.2);
  border-radius: 13px;
  background: rgba(13,18,48,.42);
}

.recovery summary { color: var(--mist); cursor: pointer; font-weight: 800; }
.recovery > p { color: var(--mist); font-size: .85rem; }
.recovery > label { display: grid; gap: 7px; margin-top: 14px; font-weight: 800; }
.recovery input[type="file"] { width: 100%; padding: 8px; border: 1px dashed rgba(47,209,216,.5); border-radius: 11px; background: rgba(250,245,232,.96); color: var(--ink); }
.recovery label small { color: var(--mist); font-size: .79rem; font-weight: 500; }
.recovery .voice-setup { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--line); }

.status,
.offline-status {
  margin: 18px 0 0;
  padding: 12px 14px;
  border-left: 4px solid var(--cyan);
  border-radius: 0 10px 10px 0;
  background: rgba(47,209,216,.08);
  color: var(--paper);
  font-weight: 700;
}

.status.compact { font-size: .88rem; }

.voice-setup code {
  color: var(--gold);
  font-weight: 800;
}

.lookup { scroll-margin-top: 14px; }

.lookup-language,
.result-filters {
  color: var(--mist);
  font-size: .9rem;
  font-weight: 750;
}

.discovery {
  display: grid;
  gap: 16px;
  margin: 24px 0;
  padding: 19px;
  border: 1px solid rgba(47,209,216,.25);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(14,58,82,.62), rgba(42,26,74,.52));
}

.discovery h3,
.alphabet-browser h3 {
  margin: 2px 0 5px;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.45rem, 6vw, 2.25rem);
  line-height: 1.05;
}

.discovery p:last-child { margin: 0; color: var(--mist); font-size: .88rem; }

.quick-prompts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.quick-prompts button {
  display: grid;
  min-width: 0;
  gap: 3px;
  padding: 12px;
  border: 1px solid rgba(217,182,90,.45);
  border-radius: 12px;
  background: rgba(13,18,48,.72);
  color: var(--paper);
  text-align: left;
}

.quick-prompts button:hover {
  border-color: var(--cyan);
  background: rgba(31,111,107,.27);
}

.quick-prompts strong {
  overflow-wrap: anywhere;
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.15rem;
}

.quick-prompts small { overflow: hidden; color: var(--mist); text-overflow: ellipsis; white-space: nowrap; }

.search-label { margin-top: 18px; }

.search-label input {
  min-height: 62px;
  border: 2px solid var(--gold);
  font-size: 1.08rem;
  box-shadow: 0 0 0 5px rgba(217,182,90,.06);
}

.alphabet-browser {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 1px solid var(--line);
}

.alphabet-heading {
  display: flex;
  gap: 14px;
  align-items: end;
  justify-content: space-between;
}

.alphabet {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 7px;
  margin-top: 14px;
}

.alphabet button {
  display: grid;
  min-width: 0;
  min-height: 53px;
  place-content: center;
  padding: 5px;
  border: 1px solid rgba(201,217,232,.22);
  border-radius: 10px;
  background: rgba(8,13,38,.58);
  color: var(--paper);
}

.alphabet button[aria-pressed="true"] {
  border-color: var(--gold);
  background: linear-gradient(145deg, var(--gold-deep), #493510);
  color: white;
}

.alphabet button:disabled { opacity: .27; cursor: not-allowed; }
.alphabet button strong { font-size: 1rem; }
.alphabet button small { color: var(--mist); font-size: .66rem; }

.results {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 17px;
  margin-top: 20px;
}

.result-summary,
.empty,
.oral-estate-status {
  grid-column: 1 / -1;
  margin: 0;
  padding: 14px;
  border: 1px solid rgba(47,209,216,.22);
  border-radius: 11px;
  background: rgba(14,58,82,.42);
  color: var(--mist);
}

.oral-estate-status { margin: 15px 0 0; font-size: .85rem; }

.empty.compact { font-size: .86rem; }

.results article {
  position: relative;
  min-width: 0;
  overflow: hidden;
  padding: 19px;
  border: 1px solid rgba(217,182,90,.38);
  border-radius: 18px;
  background: linear-gradient(155deg, rgba(26,35,71,.98), rgba(13,18,48,.98));
  box-shadow: 0 16px 36px rgba(0,0,0,.22);
}

.results article::after {
  position: absolute;
  top: 0;
  right: 0;
  width: 74px;
  height: 74px;
  border-bottom: 1px solid rgba(47,209,216,.22);
  border-left: 1px solid rgba(47,209,216,.22);
  border-radius: 0 0 0 100%;
  content: "";
}

.results h3 {
  position: relative;
  z-index: 1;
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--gold);
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.05rem, 15vw, 5.5rem);
  letter-spacing: -.045em;
  line-height: .92;
  text-shadow: 0 4px 25px rgba(242,180,65,.13);
}

.garifuna-label { margin: 0 0 9px; }

.ipa { margin: 10px 0 0; color: var(--mist); font-size: 1rem; }
.pos { margin: 4px 0 0; color: var(--cyan); font-size: .83rem; }

.meaning,
.example-list,
.example.missing {
  margin-top: 18px;
  padding: 15px;
  border: 1px solid rgba(201,217,232,.18);
  border-radius: 13px;
  background: rgba(8,13,38,.46);
}

.meaning > b,
.example-item > b,
.example.missing > b {
  color: var(--cyan);
  font-size: .7rem;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.meaning p { margin: 7px 0 0; color: var(--paper); }
.missing-copy,
.example.missing p { color: var(--mist) !important; font-style: italic; }

.example-item + .example-item {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid rgba(217,182,90,.25);
}

.example-item p,
.example.missing p {
  margin: 7px 0;
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.36rem;
  line-height: 1.34;
}

.example-item small,
.example-source { display: block; margin-top: 5px; color: var(--mist); }
.example-source { opacity: .76; font-size: .73rem; }

.oral-evidence {
  margin-top: 18px;
  padding: 15px;
  border: 1px solid rgba(178,128,255,.34);
  border-radius: 13px;
  background: linear-gradient(145deg, rgba(69,35,102,.32), rgba(8,13,38,.55));
}

.oral-evidence-label {
  margin: 0 0 7px;
  color: #d7b9ff;
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.oral-evidence > p:not(.oral-evidence-label) { margin: 8px 0; color: var(--mist); font-size: .79rem; }
.oral-evidence ul { margin: 10px 0 0; padding-left: 18px; }
.oral-evidence li + li { margin-top: 8px; }
.oral-evidence li span,
.oral-evidence li small { display: block; overflow-wrap: anywhere; }
.oral-evidence li small { color: var(--mist); font-size: .69rem; }

details {
  margin-top: 16px;
  color: var(--mist);
  font-size: .84rem;
}

summary { cursor: pointer; color: var(--cyan); font-weight: 800; }
details ul { padding-left: 20px; }

.audio-player,
.audio-unavailable {
  margin: 16px 0 0;
  padding: 12px;
  border: 1px solid rgba(47,209,216,.24);
  border-radius: 12px;
  background: rgba(14,58,82,.3);
}

.audio-player button {
  min-height: 43px;
  padding: 9px 14px;
  border: 1px solid var(--cyan);
  border-radius: 999px;
  background: var(--teal-deep);
  color: white;
  font-weight: 850;
}

.audio-player audio { width: 100%; margin-top: 10px; }
.audio-player small { display: block; margin-top: 7px; color: var(--mist); }
.audio-lane { display: block; margin-top: 8px; color: var(--cyan); font-size: .72rem; font-weight: 800; }
.generated-audio { border-color: rgba(217,182,90,.4); background: rgba(83,59,19,.25); }
.generated-audio .audio-lane { color: var(--gold); }
.audio-unavailable { color: var(--mist); font-size: .82rem; }
.audio-unavailable.available { border-color: rgba(217,182,90,.3); color: var(--gold); }

.more-results { display: block; margin: 20px auto 0; }

.offline-status {
  width: fit-content;
  max-width: 100%;
  margin: 20px 0;
  font-size: .82rem;
}

.notice { padding: 24px 4px; color: var(--mist); font-size: .88rem; }
.notice strong { color: var(--gold); }

.creator {
  position: relative;
  display: grid;
  gap: 20px;
  overflow: hidden;
  margin: 15px 0 28px;
  padding: 25px;
  border: 1px solid rgba(217,182,90,.5);
  border-radius: 22px;
  background:
    radial-gradient(circle at 10% 10%, rgba(47,209,216,.17), transparent 18rem),
    linear-gradient(145deg, var(--violet), var(--abyss) 60%, var(--ocean));
  box-shadow: var(--shadow);
}

.creator::after {
  position: absolute;
  right: -90px;
  bottom: -90px;
  width: 240px;
  height: 240px;
  border: 1px solid rgba(47,209,216,.25);
  border-radius: 50%;
  box-shadow: 0 0 0 28px rgba(217,182,90,.04), 0 0 0 56px rgba(47,209,216,.03);
  content: "";
}

.creator .overline { color: var(--cyan); }

.creator-mark {
  position: relative;
  z-index: 1;
  display: grid;
  width: 78px;
  height: 78px;
  place-items: center;
  border: 2px solid var(--gold);
  border-radius: 50%;
  background: rgba(13,18,48,.75);
  color: var(--gold);
  box-shadow: 0 0 30px rgba(217,182,90,.15);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.55rem;
  font-weight: 900;
}

.creator-role { color: var(--gold); font-weight: 850; }

.creator blockquote {
  margin: 18px 0;
  padding-left: 16px;
  border-left: 3px solid var(--cyan);
  color: var(--paper);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.12rem;
}

.creator-education { margin-bottom: 0; color: var(--mist); font-size: .84rem; }

footer {
  padding-top: 19px;
  border-top: 1px solid var(--line);
  color: var(--mist);
  font-size: .78rem;
}

@media (min-width: 600px) {
  .domain-selector > div { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .quick-prompts { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .alphabet { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}

@media (min-width: 760px) {
  .gulisi-shell { padding: 24px 28px 80px; }
  .hero { min-height: 35rem; padding: 92px 0 44px; }
  .language-constellation { top: 28px; right: 0; width: 440px; height: 440px; opacity: .88; }
  .panel { padding: 30px; }
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .steps li { grid-template-columns: 44px minmax(0, 1fr); }
  .controls { grid-template-columns: minmax(0, 1fr) auto; }
  .discovery { grid-template-columns: minmax(190px, .55fr) minmax(0, 1.45fr); align-items: center; }
  .alphabet { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .results { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .creator { grid-template-columns: 92px minmax(0, 1fr); padding: 36px; }
}

@media (max-width: 430px) {
  .tag { max-width: 140px; font-size: .63rem; }
  .hero { min-height: 29rem; }
  .hero h1 { font-size: 3.65rem; }
  .panel { padding: 18px; border-radius: 18px; }
  .primary { width: 100%; }
  .results h3 { font-size: 3.15rem; }
  .alphabet { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}