body { margin: 0; font-family: system-ui, sans-serif; display: flex; flex-direction: column; min-height: 100vh; }
header { padding: 0.75rem 1rem; background: #232f3e; color: #fff; }
header h1 { margin: 0; font-size: 1.6rem; }
header p { margin: 0.25rem 0 0; font-size: 0.9rem; }
header .sub { color: #ff9900; }
main { flex: 1; display: flex; flex-direction: column; padding: 0.5rem 1rem; }
h2 { font-size: 1.1rem; margin: 0.75rem 0 0.4rem; }
iframe { flex: 1; min-height: 480px; width: 100%; box-sizing: border-box; border: 4px dashed #ff9900; background: #fffaf0; }
.hint { font-size: 0.85rem; color: #333; }
button { padding: 0.4rem 0.8rem; margin-left: 0.5rem; }
section[hidden] { display: none; }