@font-face { font-family: Tiny5; src: url('/assets/city-home-v03/Tiny5-Regular.ttf') format('truetype'); font-display: swap; }
:root { color-scheme: light dark; background: light-dark(#ede3f6, #292c30); color: light-dark(#30243c, #e8e9e7); font: 16px/1.55 system-ui, sans-serif; }
body { margin: 0; }
main { max-width: 660px; margin: auto; padding: 24px max(18px, env(safe-area-inset-left), env(safe-area-inset-right)) 48px; }
h1, h2, button { font-family: Tiny5, monospace; font-weight: normal; text-transform: uppercase; }
h1 { font-size: 36px; line-height: 1; }
h2 { font-size: 26px; line-height: 1.15; margin-top: 0; }
section { background: light-dark(#e0d3ec, #1b1d1f); border-radius: 16px; padding: 18px; margin-top: 20px; }
a { color: inherit; }
details { padding: 12px 0; border-top: 1px solid light-dark(#baa4cc, #42474d); }
summary { cursor: pointer; font-weight: 600; }
label { display: grid; gap: 5px; margin-bottom: 14px; }
input, textarea, button { box-sizing: border-box; font: inherit; border: 1px solid light-dark(#927ba6, #777e86); border-radius: 8px; padding: 8px 12px; min-width: 0; }
textarea { resize: vertical; }
button { border: 0; background: #8dd6fa; color: #1b1d1f; font: 21px/1.2 Tiny5, monospace; min-height: 44px; cursor: pointer; }
