:root { color-scheme: dark; --bg: #1D1F21; --card: #26292B; --line: #33373A; --text: #F2F4F1; --dim: #9AA39E; --accent: #8FD9A8; }
* { box-sizing: border-box; margin: 0; }
html { background: var(--bg); }
body {
  min-height: 100vh; color: var(--text);
  font: 17px/1.5 -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  padding: max(56px, env(safe-area-inset-top)) 20px max(40px, env(safe-area-inset-bottom));
}
main { max-width: 440px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 16px; }
.trinco { width: 112px; height: 112px; border-radius: 26px; box-shadow: 0 18px 40px rgba(0,0,0,.35); }
h1 { font: 700 34px/1.1 ui-rounded, "SF Pro Rounded", -apple-system, system-ui, sans-serif; letter-spacing: -.02em; margin-top: 8px; }
.lead { color: var(--dim); text-align: center; margin-bottom: 12px; }
.card { width: 100%; background: var(--card); border: 1px solid var(--line); border-radius: 22px; padding: 18px 20px; display: flex; flex-direction: column; gap: 8px; }
.label { font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--dim); }
.mono { font: 13px/1.45 ui-monospace, "SF Mono", Menlo, monospace; color: var(--dim); word-break: break-all; }
.hint { font-size: 13px; color: var(--dim); }
.button {
  display: block; text-align: center; text-decoration: none; margin: 6px 0 2px;
  background: var(--accent); color: #0E1A12; font-weight: 600; border-radius: 999px; padding: 13px 18px;
}
.button:active { opacity: .8; }
@media (prefers-reduced-motion: no-preference) {
  .trinco { animation: float 6s ease-in-out infinite; }
  @keyframes float { 50% { transform: translateY(-5px) rotate(-1deg); } }
}