:root { color-scheme: light; font-family: Inter, system-ui, sans-serif; background: #f3faf8; color: #17332d; }
* { box-sizing: border-box; }
body { margin: 0; }
main { width: min(100%, 520px); margin: 0 auto; padding: 18px 16px 40px; }
header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
header h1 { margin: 0; font-size: 23px; }
.brand { background: #118f7f; color: white; border-radius: 11px; padding: 9px 11px; font-weight: 800; }
.privacy,.notice { background: white; border: 1px solid #d9e7e3; border-radius: 15px; padding: 14px; line-height: 1.45; }
.phone-shell { margin: 14px auto; width: min(100%, 360px); border: 9px solid #13231f; border-radius: 25px; overflow: hidden; background: #111; box-shadow: 0 14px 36px rgba(20,50,43,.18); }
#screen { display: block; width: 100%; aspect-ratio: 720 / 1280; object-fit: contain; background: #111; touch-action: manipulation; }
.controls { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; }
button,.notice a { border: 1px solid #bfd4cf; border-radius: 12px; background: white; color: #17332d; padding: 12px 10px; font: inherit; font-weight: 700; text-align: center; text-decoration: none; }
.controls button:nth-last-child(-n+2) { grid-column: span 1; }
.finish { width: 100%; margin-top: 14px; background: #118f7f; border-color: #118f7f; color: white; padding: 14px; }
#feedback { min-height: 20px; color: #6b4f0a; font-size: 14px; }
.notice h2 { margin-top: 0; }
.notice a { display: inline-block; background: #118f7f; color: white; }