:root{--ink: #251715;--cyan: #0bbce6;--page: #eef1f3;--card: #ffffff;--line: #d8dde1;--muted: #5d6a72;--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}*{box-sizing:border-box}html,body{background:var(--ink)}.content{background:var(--page)}body{margin:0;color:var(--ink);font-family:Hiragino Sans,Noto Sans JP,system-ui,sans-serif;line-height:1.7;-webkit-text-size-adjust:100%}.bar{background:var(--ink);padding:calc(var(--safe-top) + 14px) 16px 14px;text-align:center}.bar h1{margin:0;color:#fff;font-size:19px;letter-spacing:.04em}.bar h1 span{color:var(--cyan);font-size:14px;letter-spacing:0}main{max-width:680px;margin:0 auto;padding:16px 16px 8px}.stage{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;opacity:0;transition:opacity .2s}.stage.ready{opacity:1}.stage svg{display:block;width:100%;height:auto}.fields{display:grid;gap:10px;margin:18px 0 14px}.fields label{display:grid;grid-template-columns:1fr;gap:4px}.fields span{font-size:13px;color:var(--muted)}.fields input{font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);width:100%}.fields input:focus{outline:2px solid var(--cyan);outline-offset:-1px;border-color:var(--cyan)}.presets{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}.presets button{font:inherit;font-size:14px;padding:6px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--muted);cursor:pointer}.actions{display:flex;flex-wrap:wrap;gap:10px}.actions button{font:inherit;font-size:15px;font-weight:700;flex:1 1 auto;min-height:46px;padding:0 18px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer}.actions .primary{background:var(--cyan);border-color:var(--cyan);color:#fff}.actions button:active{transform:translateY(1px)}.note{min-height:1.7em;margin:10px 0 0;font-size:13px;color:var(--muted)}footer{background:var(--ink);color:#a3b0b6;font-size:13px;padding:20px 16px calc(var(--safe-bottom) + 28px);margin-top:24px}footer>*{max-width:680px;margin-inline:auto}footer p{margin:0 auto 8px}footer a{color:#cfd8dc}footer b{color:var(--cyan)}@media(min-width:620px){.fields{grid-template-columns:1fr 1fr}.bar h1{font-size:21px}}