.tf-wrap{flex-direction:column;gap:9px;display:flex}.tf-label{font-family:var(--font-ui,"Inter", ui-sans-serif, system-ui, sans-serif);color:var(--ink-soft,#5d5449);font-size:12.5px;font-weight:600}.tf{border:1px solid var(--rule-ghost,#dcd2c0);cursor:text;background:#fcf8f0;border-radius:14px;align-items:center;gap:6px;height:52px;padding:0 6px 0 12px;transition:border-color .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.tf:focus-within{border-color:var(--marmalade,#d97e6a);box-shadow:0 0 0 3px #d97e6a33}.tf:before,.tf:after{content:"";background:radial-gradient(circle, var(--paper-aged,#ece5d6) 1.8px, transparent 2.1px) 0 0 / 12px 5px repeat-x;pointer-events:none;z-index:0;height:5px;position:absolute;left:12px;right:12px}.tf:before{top:4px}.tf:after{bottom:4px}.tf-reel{width:24px;height:24px;transform:rotate(var(--tf-spin,0deg));flex:none;transition:transform .25s cubic-bezier(.2,.7,.2,1)}.tf-reel svg{width:100%;height:100%;display:block}.tf-mode-sent .tf-reel{animation:7s linear infinite tf-reel-spin}.tf-mode-in .tf-reel{animation:.8s linear infinite tf-reel-spin}@keyframes tf-reel-spin{to{transform:rotate(360deg)}}.tf-paper{flex:1;align-items:center;min-width:0;height:100%;padding:0 6px;display:flex;position:relative;overflow:hidden}.tf-input{cursor:text;z-index:1;width:100%;height:100%;font-family:var(--font-mono,"IBM Plex Mono", ui-monospace, monospace);letter-spacing:.14em;text-transform:uppercase;color:var(--ink,#2a2622);caret-color:var(--marmalade,#d97e6a);background:0 0;border:0;outline:none;margin:0;padding:0;font-size:16px;font-weight:600;position:absolute;inset:0}.tf-input::placeholder{color:#787065;letter-spacing:.12em;font-weight:500}.tf.is-live .tf-input{color:#0000;caret-color:#0000}.tf.is-live .tf-input::placeholder{color:#0000}.tf-print{display:none}.tf-print,.tf-run{font-family:var(--font-mono,"IBM Plex Mono", ui-monospace, monospace);color:var(--ink,#2a2622);font-weight:600}.tf.is-live .tf-print{text-align:left;white-space:nowrap;pointer-events:none;letter-spacing:.14em;direction:rtl;width:100%;font-size:14px;display:block;overflow:hidden}.tf-ltr{align-items:center;display:inline-flex}.tf-print .tf-new{animation:.28s cubic-bezier(.2,.7,.2,1) tf-pop;display:inline-block}@keyframes tf-pop{0%{color:var(--marmalade-deep,#c66a55);transform:scale(1.6)translateY(-2px)}to{color:var(--ink,#2a2622);transform:none}}.tf-ph{color:#787065;letter-spacing:.12em;font-weight:500}.tf-caret{background:var(--marmalade,#d97e6a);flex:none;width:8px;height:16px;margin-left:3px;animation:1s steps(2,end) infinite tf-blink}.tf:not(:focus-within) .tf-caret{opacity:.3;animation:none}@keyframes tf-blink{50%{opacity:0}}.tf-run{white-space:nowrap;letter-spacing:.16em;text-transform:uppercase;pointer-events:none;width:max-content;font-size:12.5px;animation:22s linear infinite tf-marquee;display:flex}.tf-run span{padding-right:48px}.tf-run.is-in{color:var(--accent-matcha,#3e6b4e);animation-duration:3.5s}@keyframes tf-marquee{to{transform:translate(-50%)}}.tf-key{z-index:2;border:1px solid var(--rule-ghost,#dcd2c0);background:var(--paper-aged,#ece5d6);width:40px;height:40px;color:var(--ink-soft,#5d5449);font:inherit;cursor:pointer;border-radius:999px;flex:none;justify-content:center;align-items:center;transition:background .2s,color .2s,border-color .2s,transform .15s;display:flex;position:relative}.tf-key:before{content:"";border-radius:999px;position:absolute;inset:-3px}.tf-key:disabled{cursor:not-allowed}.tf:has(.tf-input:valid) .tf-key{background:var(--marmalade,#d97e6a);border-color:var(--marmalade,#d97e6a);color:var(--ink,#2a2622)}.tf:has(.tf-input:valid) .tf-key:hover{background:var(--marmalade-deep,#c66a55);border-color:var(--marmalade-deep,#c66a55);transform:translate(1px)}.tf-key:focus-visible{outline:2px solid var(--marmalade-deep,#c66a55);outline-offset:2px}.tf-hint{color:var(--ink-soft,#5d5449);min-height:1.5em;margin:2px 0 0;font-size:12.5px;line-height:1.5}.tf-wrap-sent .tf-hint,.tf-wrap-in .tf-hint{min-height:0;margin:0}@media (max-width:480px){.tf{height:48px}.tf.is-live .tf-print{font-size:13px}.tf-key{width:38px;height:38px}.tf-key:before{inset:-4px}}@media (prefers-reduced-motion:reduce){.tf-print .tf-new,.tf-caret,.tf-mode-sent .tf-reel,.tf-mode-in .tf-reel,.tf-run{animation:none}.tf,.tf-key,.tf-reel{transition:none}}