:root { --background: #fafafa; --text: #252525; --muted: #666; --line: #d6d6d6; --accent: #27704b; --radius: 4px; --space: 8px; --size: 14px; }
* { box-sizing: border-box; }
body { margin: 0; color: var(--text); background: var(--background); font: var(--size)/1.5 system-ui, sans-serif; height: 100dvh; display: flex; flex-direction: column; }
header { padding: calc(var(--space)*2); border-bottom: 1px solid var(--line); }
h1 { margin: 0 0 var(--space); font-size: 18px; font-weight: 600; }
small { font-size: var(--size); color: var(--muted); font-weight: 400; margin-left: var(--space); }
label { display: block; margin-bottom: 4px; }
.address-row { display: flex; gap: var(--space); }
input, button { font: inherit; border: 1px solid var(--line); border-radius: var(--radius); padding: var(--space) calc(var(--space)*2); background: white; color: var(--text); }
input { width: 100%; min-width: 0; }
button { cursor: pointer; white-space: nowrap; }
button:disabled { opacity: .5; cursor: default; }
#open { background: var(--accent); color: white; border-color: var(--accent); }
nav { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space); margin-top: var(--space); }
nav a { color: var(--accent); }
#status { color: var(--muted); overflow-wrap: anywhere; }
main { flex: 1; min-height: 0; position: relative; background: white; }
#empty { padding: calc(var(--space)*2); color: var(--muted); }
iframe { width: 100%; height: 100%; border: 0; display: block; }
@media(max-width: 480px) { header { padding: var(--space); } nav button { padding: 4px var(--space); } #status { flex-basis: 100%; } }