:root{--page-bg: #09090b;--panel: #18181b;--border: rgba(255, 255, 255, .05);--primary: #3b82f6;--body-text: #fafafa;--muted: #7fa8c9;--ocean-bg: #1b2a3b;--ocean-border: #2a5c8a;--ocean-text: #a8c8e8;--ocean-hover: #5b9bd5;--success: #4ade80;--error: #fb7185}*,*:before,*:after{box-sizing:border-box}@keyframes fade-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}html{color-scheme:dark}body{margin:0;min-height:auto;background:var(--page-bg);color:var(--body-text);font-family:Inter,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;padding:32px 16px;max-width:400px;margin-inline:auto}@media(max-width:480px){body{max-width:none;padding:0;margin-inline:0}}#root{min-height:auto}.app-shell{background:var(--panel);border:1px solid var(--border);border-radius:12px;border-top:3px solid var(--primary);overflow:hidden;animation:fade-in .5s ease-out forwards}@media(max-width:480px){.app-shell{border-radius:0;border-left:none;border-right:none;border-bottom:none}}.app-header{padding:20px 20px 16px;background:linear-gradient(135deg,#09090b,#111115);border-bottom:1px solid var(--border)}.app-header h1{margin:0;font-size:1.35rem;font-weight:800;letter-spacing:-.03em;color:#e8f4ff}.app-header .sub{margin-top:6px;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}.app-body{padding:20px;display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:8px;opacity:0;animation:slide-up .6s ease-out forwards}.field:nth-of-type(1){animation-delay:.1s}.field:nth-of-type(2){animation-delay:.15s}.field:nth-of-type(3){animation-delay:.2s}.field-label{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}.field input,.ocean-btn{font-size:16px;-webkit-appearance:none;appearance:none}.field input{width:100%;padding:13px 14px;border-radius:8px;border:1px solid var(--ocean-border);background:var(--ocean-bg);color:var(--ocean-text);font-family:inherit;color-scheme:dark}.field input.input-title{font-family:JetBrains Mono,ui-monospace,monospace;text-transform:uppercase}.field input::placeholder{color:#a8c8e873}.field input:focus{outline:none;border-color:var(--ocean-hover);background:#2a5c8a59;box-shadow:0 0 0 3px #5b9bd52e}.ocean-btn{margin-top:4px;padding:14px 18px;border-radius:8px;border:1px solid var(--ocean-border);background:var(--ocean-bg);color:var(--ocean-text);font-family:inherit;font-weight:700;letter-spacing:.06em;cursor:pointer;opacity:0;animation:slide-up .6s ease-out .25s forwards;color-scheme:dark}.ocean-btn:hover:not(:disabled){background:#2a5c8a;border-color:var(--ocean-hover);color:#fff;transform:translateY(-1px);box-shadow:0 2px 8px #0000004d}.ocean-btn:active:not(:disabled){transform:translateY(0);box-shadow:none}.ocean-btn:disabled{opacity:.45;cursor:not-allowed}.status{min-height:1.5em;font-size:14px;padding:2px 0}.status.loading{color:var(--muted)}.status.success{color:var(--success)}.status.error{color:var(--error)}.status.idle{color:transparent}.hint{font-size:12px;color:var(--muted);opacity:.85;line-height:1.4}