html { width:100%; min-width:0; overflow-x:clip; background:#171717; }
:root { color-scheme:dark; font-family:Inter,ui-sans-serif,system-ui,sans-serif; color:#f5f5f5; }
*,*::before,*::after { box-sizing:border-box; animation:none !important; transition:none !important; }
body { display:grid; width:100%; min-width:0; min-height:100svh; margin:0; padding:clamp(32px,10svh,96px) 16px 32px; overflow-x:clip; background:#171717; }
main { width:100%; max-width:460px; min-width:0; margin:0 auto; align-self:start; }
form,section { display:grid; grid-template-columns:minmax(0,1fr); min-width:0; gap:12px; }
.toolbar { display:flex; min-width:0; justify-content:flex-end; }
.field { position:relative; min-width:0; }
input,button { width:100%; min-width:0; min-height:48px; border-radius:9px; font:inherit; }
input { padding:0 14px; overflow:hidden; color:#f5f5f5; background:#181818; border:1px solid #454545; outline:none; text-overflow:ellipsis; }
input::placeholder { color:#858585; }
input:focus { border-color:#b3b3b3; box-shadow:0 0 0 3px #ffffff16; }
button { border:1px solid #e5e5e5; padding:0 18px; color:#171717; background:#e5e5e5; font-weight:650; cursor:pointer; }
button:disabled { opacity:.45; cursor:not-allowed; }
button:focus-visible { outline:3px solid #fff8; outline-offset:3px; }
.clear { width:auto; min-height:30px; padding:0 10px; color:#bdbdbd; background:#242424; border-color:#454545; border-radius:7px; font-size:.76rem; font-weight:600; }
#short { padding-right:14px; }
#error { margin:8px 0 0; color:#fca5a5; font-size:.82rem; }
#error:empty { display:none; }
section { margin-top:16px; }
#short { font-size:.94rem; }
#copy { color:#f5f5f5; background:#292929; border-color:#4a4a4a; }
@media (max-width:520px) { body { padding-top:clamp(24px,8svh,56px); } }