:root{color-scheme:light}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#f6f7f9;color:#0b0f1a;overflow:hidden}.page{width:390px;height:844px;max-height:100vh;margin:0 auto;padding:16px;box-sizing:border-box;overflow:auto;-webkit-overflow-scrolling:touch}.header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;padding:10px;border:1px solid #e6e9f2;border-radius:16px;background:#ffffffe6;box-shadow:0 10px 28px #1018280f;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.title{font-weight:700;letter-spacing:-.2px;display:inline-flex;align-items:center;padding:6px 10px;border:1px solid #e6e9f2;border-radius:12px;background:#fff;box-shadow:0 6px 18px #1018280f}.tabs{display:flex;gap:6px;padding:4px;border-radius:14px;border:1px solid #e6e9f2;background:#f8fafc}.tab{border:1px solid transparent;background:transparent;border-radius:10px;padding:8px 10px;font-size:14px;transition:border-color .18s ease,background .18s ease}.tab.active{background:#fff;border-color:#11182724;box-shadow:0 6px 18px #1018280f}.card{background:#fff;border:1px solid #e6e9f2;border-radius:14px;padding:14px;box-shadow:0 8px 24px #1018280f;transition:box-shadow .18s ease,transform .18s ease}.intro{font-size:13px;line-height:1.45;color:#475569;margin-bottom:12px}.row{margin-bottom:12px}.label{display:block;font-size:13px;color:#334155}.input{width:100%;margin-top:6px;border:1px solid #d7dbe6;border-radius:12px;padding:12px;font-size:16px;background:#fff;box-sizing:border-box;transition:border-color .18s ease,box-shadow .18s ease}.input:focus{outline:none;border-color:#111827;box-shadow:0 0 0 4px #11182714}.textarea{min-height:90px;resize:vertical}.output{margin-top:6px;border:1px solid #d7dbe6;border-radius:12px;padding:12px;font-size:18px;font-weight:700;background:#f8fafc}.divider{height:1px;background:#eef2f7;margin:14px 0}.primary{width:100%;border:0;border-radius:12px;padding:12px;font-size:16px;font-weight:700;background:#111827;color:#fff;transition:transform .12s ease,opacity .12s ease,filter .12s ease}.primary:disabled{opacity:.6}.primary:active{transform:translateY(1px)}.hint{margin-top:10px;font-size:13px;line-height:1.35;display:block;padding:10px 12px;border-radius:12px;border:1px solid transparent}.hint.error{color:#7a271a;background:#fef3f2;border-color:#fecdcae6}.hint.success{color:#05603a;background:#ecfdf3;border-color:#abefc6e6}.instructions{white-space:pre-wrap;line-height:1.5;font-size:14px;color:#0b0f1a}