:root{--bg: #f2f4f6;--card: #ffffff;--ink: #191f28;--ink-sub: #4e5968;--ink-mute: #8b95a1;--line: #e5e8eb;--line-strong: #d1d6db;--blue: #3182f6;--blue-press: #1b64da;--blue-weak: #a9c9fb;--red: #f04452;--panel: #f9fafb;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Apple SD Gothic Neo,Malgun Gothic,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}.page{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px calc(24px + env(safe-area-inset-bottom))}.card{width:100%;max-width:420px;background:var(--card);border-radius:20px;padding:28px 24px;box-shadow:0 1px 3px #0000000a,0 8px 24px #0000000a}.head{margin-bottom:22px}.title{margin:0;font-size:21px;font-weight:700;letter-spacing:-.01em;color:var(--ink)}.subtitle{margin:6px 0 0;font-size:14px;color:var(--ink-mute)}.field{margin-bottom:20px}.label{display:block;margin-bottom:8px;font-size:13px;font-weight:600;color:var(--ink-sub)}.input{width:100%;height:50px;padding:0 14px;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.input::placeholder{color:#c2c8ce}.input:focus{border-color:var(--blue);box-shadow:0 0 0 3px #3182f626}.field-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:8px}.hint{font-size:12px;color:var(--ink-mute)}.counter{flex:none;font-size:12px;color:var(--ink-mute);font-variant-numeric:tabular-nums}.preview-wrap{display:flex;justify-content:center;margin-bottom:20px}.preview-frame{position:relative;width:100%;max-width:320px;aspect-ratio:320 / 480;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:#efece4;box-shadow:0 4px 16px #0000000f}.preview-canvas{display:block;width:100%;height:100%}.preview-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--ink-mute);background:#efece4}.preview-error{color:var(--red);padding:0 16px;text-align:center}.save-btn{width:100%;height:52px;border:none;border-radius:14px;background:var(--blue);color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:background-color .15s ease,transform .05s ease;-webkit-tap-highlight-color:transparent}.save-btn:hover:not(:disabled){background:var(--blue-press)}.save-btn:active:not(:disabled){transform:translateY(1px)}.save-btn:disabled{background:var(--blue-weak);cursor:not-allowed}.warn{margin:12px 0 0;font-size:13px;color:var(--ink-mute);text-align:center}.warn.error{color:var(--red);font-weight:500}.result{margin-top:22px;padding:16px 18px;background:var(--panel);border-radius:12px}.result-title{margin:0 0 10px;font-size:13px;font-weight:700;color:var(--ink-sub)}.result-grid{margin:0}.result-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:6px 0;border-top:1px solid #eef1f3}.result-row:first-child{border-top:none}.result-row dt{font-size:13px;color:var(--ink-mute)}.result-row dd{margin:0;font-size:14px;font-weight:600;color:var(--ink);text-align:right}.muted{color:var(--ink-mute);font-weight:400}.privacy{margin:18px 0 0;font-size:12px;line-height:1.6;color:var(--ink-mute);text-align:center}@media(max-width:400px){.card{padding:22px 18px}.title{font-size:19px}}