body { margin:0; background:#141327; font-family:var(--sans,'Noto Sans TC',sans-serif); color:#FFF4E6; }
a { color:#FFC94A; text-decoration:none; } a:hover { color:#FF7B3D; }
@keyframes om-sweep { 0%,100% { transform:translateX(-300px) skewX(-6deg) } 50% { transform:translateX(300px) skewX(6deg) } }
@keyframes om-caught { 0%,17% { opacity:0 } 23%,29% { opacity:1 } 36%,66% { opacity:0 } 72%,78% { opacity:1 } 85%,100% { opacity:0 } }
@keyframes om-bob { 0%,100% { transform:translateY(0) } 50% { transform:translateY(-12px) } }
@keyframes om-blink { 0%,93%,100% { transform:scaleY(1) } 96% { transform:scaleY(.12) } }
@keyframes om-rise { from { opacity:0; transform:translateY(26px) } to { opacity:1; transform:translateY(0) } }
@keyframes om-marquee { from { transform:translateX(0) } to { transform:translateX(-50%) } }
@keyframes om-glowpulse { 0%,100% { opacity:.28; transform:scale(1) } 50% { opacity:.7; transform:scale(1.08) } }
@keyframes om-ring { 0% { opacity:.55; transform:scale(.9) } 100% { opacity:0; transform:scale(1.7) } }
@keyframes om-flip { 0%,34% { transform:rotateY(0deg) } 50%,84% { transform:rotateY(180deg) } 100% { transform:rotateY(360deg) } }
@keyframes om-shimmer { 0% { transform:translateX(-120%) } 60%,100% { transform:translateX(220%) } }
@keyframes om-scan { 0% { transform:translateY(-10px); opacity:0 } 20%,80% { opacity:.85 } 100% { transform:translateY(150px); opacity:0 } }
@keyframes om-caret { 0%,49% { opacity:1 } 50%,100% { opacity:0 } }
@keyframes om-drift { 0%,100% { transform:translate(0,0) } 33% { transform:translate(26px,-18px) } 66% { transform:translate(-18px,14px) } }

/* ---- i18n additions ---------------------------------------------------- */

/* RTL (Arabic). Flex rows mirror on their own; these are the parts that don't. */
[dir="rtl"] .om-band { transform:rotate(1.4deg) scale(1.03); }
[dir="rtl"] .om-track { animation-direction:reverse; }
[dir="rtl"] .om-track > div { padding-right:0; padding-left:40px; }
/* Arabic is cursive - letter-spacing breaks the joins between letters. */
[dir="rtl"] { letter-spacing:normal !important; }
[dir="rtl"] .om-card { transform-style:preserve-3d; }
[dir="rtl"] .om-face { transform:rotateY(180deg); }

/* Language picker in the footer bar. */
.om-langpicker {
  background:#1B1A34; color:rgba(255,244,230,.8);
  border:1px solid rgba(255,244,230,.18); border-radius:8px;
  padding:6px 10px; font:inherit; font-size:13px; cursor:pointer; max-width:200px;
}
.om-langpicker:hover { border-color:rgba(255,201,74,.5); }
.om-langpicker:focus-visible { outline:2px solid #FFC94A; outline-offset:2px; }

/* "Also available in <language>" banner. */
.om-langbanner {
  position:fixed; left:50%; bottom:20px; transform:translateX(-50%);
  z-index:50; display:flex; align-items:center; gap:14px;
  background:#232244; border:1px solid rgba(255,201,74,.35); border-radius:999px;
  padding:10px 12px 10px 20px; box-shadow:0 14px 40px rgba(0,0,0,.5);
  font-size:14px; color:rgba(255,244,230,.85); max-width:calc(100vw - 32px);
  animation:om-rise .5s ease-out both;
}
.om-langbanner a { color:#FFC94A; font-weight:700; white-space:nowrap; }
.om-langbanner button {
  background:none; border:0; color:rgba(255,244,230,.5);
  font-size:20px; line-height:1; cursor:pointer; padding:0 6px;
}
.om-langbanner button:hover { color:#FFF4E6; }

/* Translated copy runs much longer than the Chinese original in most locales. */
@media (max-width:1000px) {
  .om-split, .om-claims, .om-footer { flex-direction:column; align-items:flex-start; }
  .om-split { gap:40px; }
  .om-grid3, .om-grid4 { grid-template-columns:repeat(2,1fr); gap:28px 0; }
  .om-grid3 > div { border-inline-end:0 !important; padding-inline-start:0; }
  .om-grid4 { gap:16px; }
  .om-split > div:last-child { align-self:center; }
}
@media (max-width:640px) {
  .om-nav { gap:16px; font-size:11px; }
  .om-grid3, .om-grid4 { grid-template-columns:1fr; }
  .om-footcols { flex-wrap:wrap; gap:32px; }
  .om-footbar, .om-wordshead { flex-direction:column; align-items:flex-start; gap:14px; }
  [style*="padding:28px 64px"], [style*="padding:70px 64px 84px"],
  [style*="padding:80px 64px"], [style*="padding:88px 64px"],
  [style*="padding:48px 64px"], [style*="padding:20px 64px"],
  [style*="padding:0 64px"] { padding-left:22px !important; padding-right:22px !important; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}