.token-visualizer-page{--tv-accent: #9d8bf5;--tv-accent-strong: #b3a4ff;--tv-accent-soft: rgba(157, 139, 245, .13);--tv-cat-word: rgba(125, 128, 240, .26);--tv-cat-cjk: rgba(240, 178, 108, .26);--tv-cat-number: rgba(80, 210, 178, .26);--tv-cat-punct: rgba(150, 170, 205, .22);--tv-cat-space: rgba(150, 170, 205, .13);--tv-control-h: 44px;--tv-track-h: 14px;--tv-swatch: 12px;--tv-pill-pad: 4px 8px}[data-cat=word]{--tv-cat: var(--tv-cat-word)}[data-cat=cjk]{--tv-cat: var(--tv-cat-cjk)}[data-cat=number]{--tv-cat: var(--tv-cat-number)}[data-cat=punct]{--tv-cat: var(--tv-cat-punct)}[data-cat=space]{--tv-cat: var(--tv-cat-space)}.tv-bench{display:grid;gap:var(--space-5)}.tv-compose{display:grid;gap:var(--space-4)}.tv-rail{display:flex;align-items:flex-end;gap:var(--space-3);flex-wrap:wrap}.tv-field{display:flex;flex-direction:column;gap:var(--space-2);min-width:0}.tv-field__label{font-size:var(--text-xs);text-transform:uppercase;color:var(--color-text-faint)}.tv-select,.tv-input-num{appearance:none;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);font:inherit;font-size:var(--text-sm);padding:0 var(--space-3);min-height:var(--tv-control-h);transition:border-color var(--transition-fast)}.tv-select:hover,.tv-input-num:hover{border-color:var(--color-surface-3)}.tv-select{min-width:200px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%238ca0c0' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M1 1l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center;padding-right:var(--space-6);cursor:pointer}.tv-input-num{width:160px;-moz-appearance:textfield}.tv-input-num::-webkit-outer-spin-button,.tv-input-num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.tv-select:focus-visible,.tv-input-num:focus-visible,.tv-textarea:focus-visible,.tv-clear-inline:focus-visible{outline:2px solid var(--tv-accent);outline-offset:2px}.tv-input-wrap{position:relative}.tv-textarea{display:block;width:100%;box-sizing:border-box;min-height:120px;resize:vertical;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg-deep);color:var(--color-text);font-family:var(--font-mono);font-size:var(--text-sm);line-height:var(--line-base);padding:var(--space-4);padding-right:calc(var(--space-4) + 32px);transition:border-color var(--transition-fast),background var(--transition-fast)}.tv-textarea::placeholder{color:var(--color-text-faint)}.tv-textarea:hover{border-color:var(--color-surface-3)}.tv-textarea:disabled{opacity:.5}.tv-input-wrap.is-dragover .tv-textarea{border-color:var(--tv-accent);background:var(--tv-accent-soft)}.tv-clear-inline{position:absolute;top:var(--space-3);right:var(--space-3);width:28px;height:28px;min-height:0;padding:0;border-radius:var(--radius-sm);background:var(--color-surface-2);border:1px solid var(--color-border);color:var(--color-text-muted);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:color var(--transition-fast),border-color var(--transition-fast),background var(--transition-fast)}.tv-clear-inline:hover{color:var(--color-text);border-color:var(--color-surface-3);background:var(--color-surface-3)}.tv-clear-inline[hidden]{display:none}.tv-drop-hint{position:absolute;right:var(--space-3);bottom:var(--space-3);margin:0;padding:var(--tv-pill-pad);border-radius:var(--radius-pill);background:var(--color-surface-2);border:1px solid var(--color-border);font-size:var(--text-xs);color:var(--color-text-faint);pointer-events:none;transition:opacity var(--transition-fast)}.tv-textarea:not(:placeholder-shown)~.tv-drop-hint{opacity:0}.tv-input-wrap.is-dragover .tv-drop-hint{opacity:1;color:var(--color-on-primary);background:var(--tv-accent);border-color:var(--tv-accent)}.tv-status{margin:0;min-height:1.4em;font-size:var(--text-sm);color:var(--color-text-muted)}.tv-status[data-tone=error]{color:var(--color-danger)}.tv-status[data-tone=success]{color:var(--color-success)}.tv-status[data-tone=warn]{color:var(--color-warning)}.tv-status[data-tone=loading]{color:var(--color-text-faint)}.tv-result{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5);display:grid;gap:var(--space-5)}.tv-result.tv-result--empty{background:transparent;border-color:transparent;padding:0;gap:0}.tv-result.tv-result--empty>*{display:none}.tv-result__head{display:flex;align-items:flex-start;gap:var(--space-4);flex-wrap:wrap}.tv-readout{flex:1 1 auto;min-width:0}.tv-readout__count{display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap}.tv-readout__num{font-family:var(--font-mono);font-weight:600;letter-spacing:-.02em;line-height:1;color:var(--color-text);font-variant-numeric:tabular-nums;font-size:clamp(3.5rem,2.5rem + 4vw,5rem)}.tv-readout__count[data-len=mid] .tv-readout__num{font-size:clamp(3rem,2.25rem + 3vw,4.25rem)}.tv-readout__count[data-len=long] .tv-readout__num{font-size:clamp(2.25rem,1.75rem + 2vw,3.25rem)}.tv-readout__unit-word{font-size:var(--text-sm);text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted)}.tv-meta{margin:var(--space-3) 0 0;font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-muted);font-variant-numeric:tabular-nums}.tv-meta__num{color:var(--color-text);font-weight:600}.tv-meta__sep{color:var(--color-text-faint);margin:0 var(--space-2)}.tv-copy-btn{margin-left:auto;align-self:flex-start;flex-shrink:0;min-height:var(--tv-control-h);padding:0 var(--space-4);font-size:var(--text-sm)}.tv-copy-btn:disabled{opacity:.45;cursor:default}.tv-copy-btn.is-copied{color:var(--color-success);border-color:var(--color-success)}.tv-trust{display:block;margin:0;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:var(--text-xs);line-height:1.55}.tv-trust[hidden]{display:none}.tv-trust[data-kind=exact]{background:#4fd4b51a;color:var(--color-success)}.tv-trust[data-kind=estimate]{background:#f6a85f1f;color:var(--color-warning)}.tv-trust__dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:currentColor;margin-right:var(--space-2);vertical-align:.1em}.tv-trust__label{font-weight:600;margin-right:.4em}.tv-trust__detail{color:var(--color-text-muted);font-weight:400}.tv-gauge__note{margin:0;font-size:var(--text-xs);color:var(--color-text-faint)}.tv-gauge{display:grid;gap:var(--space-2);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.tv-gauge__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap}.tv-gauge__title{margin:0;font-size:var(--text-sm);font-weight:600;color:var(--color-text)}.tv-gauge__model{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-muted)}.tv-gauge__track{position:relative;height:var(--tv-track-h);margin-top:var(--space-1);border-radius:var(--radius-pill);background:var(--color-bg-deep);border:1px solid var(--color-border);overflow:hidden}.tv-gauge__fill{position:absolute;inset:0;transform-origin:left center;transform:scaleX(0);transition:transform .5s cubic-bezier(.34,.72,.26,1),background var(--transition-base)}.tv-gauge__track[data-state=idle] .tv-gauge__fill{background:transparent}.tv-gauge__track[data-state=ok] .tv-gauge__fill{background:var(--tv-accent)}.tv-gauge__track[data-state=warn] .tv-gauge__fill{background:var(--color-warning)}.tv-gauge__track[data-state=over] .tv-gauge__fill{background:var(--color-danger)}.tv-gauge__track[data-state=over]{border-color:var(--color-danger)}.tv-gauge__tick{position:absolute;top:0;bottom:0;width:1px;background:#eaf2ff38;pointer-events:none}.tv-gauge__scale{position:relative;height:1.2em;font-family:var(--font-mono);font-size:var(--text-xs);color:var(--color-text-faint)}.tv-gauge__scale span{position:absolute;top:0}.tv-gauge__scale span:nth-child(1){left:0}.tv-gauge__scale span:nth-child(2){left:25%;transform:translate(-50%)}.tv-gauge__scale span:nth-child(3){left:50%;transform:translate(-50%)}.tv-gauge__scale span:nth-child(4){left:75%;transform:translate(-50%)}.tv-gauge__scale span:nth-child(5){left:100%;transform:translate(-100%)}.tv-gauge__readout{margin:0;font-size:var(--text-sm);line-height:var(--line-base);color:var(--color-text-muted)}.tv-gauge__track[data-state=warn]~.tv-gauge__readout{color:var(--color-warning)}.tv-gauge__track[data-state=over]~.tv-gauge__readout{color:var(--color-danger)}.tv-tape-block{display:grid;gap:var(--space-3)}.tv-block__head{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3) var(--space-4);flex-wrap:wrap}.tv-block__title{margin:0;font-family:var(--font-mono);font-size:var(--text-xs);font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}.tv-legend{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-3);margin:0;padding:0;list-style:none}.tv-legend__item{display:inline-flex;align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--color-text-muted)}.tv-legend__sw{width:var(--tv-swatch);height:var(--tv-swatch);border-radius:var(--radius-xs);background:var(--tv-cat);border:1px solid rgba(234,242,255,.34)}.tv-tape{padding:var(--space-4);background:var(--color-bg-deep);border:1px solid var(--color-border);border-radius:var(--radius-md);font-family:var(--font-mono);font-size:var(--text-md);line-height:2;word-break:break-word}.tv-token{display:inline-block;vertical-align:middle;white-space:pre-wrap;line-height:1.4;padding:2px 6px;margin:0 var(--space-1) var(--space-1) 0;border-radius:var(--radius-xs);background:var(--tv-cat);outline:1px solid transparent;transition:outline-color var(--transition-fast)}.tv-token[data-cat=space]{color:var(--color-text-faint)}.tv-token:hover{outline-color:#eaf2ff4d}.tv-tape__empty{margin:0;padding:var(--space-5) var(--space-4);text-align:center;background:var(--color-bg-deep);border:1px dashed var(--color-border);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text-faint)}.tv-tape__empty[hidden]{display:none}.tv-tape__note{margin:0;font-size:var(--text-xs);color:var(--color-text-faint)}.tv-tape__provider-note{margin:0;font-size:var(--text-xs);line-height:1.5;color:var(--color-warning);opacity:.85}.tv-tape__provider-note[hidden]{display:none}@media(prefers-reduced-motion:reduce){.tv-gauge__fill{transition:background var(--transition-base)}}@media(max-width:720px){.tv-bench{gap:var(--space-4)}.tv-result{padding:var(--space-4);gap:var(--space-4)}.tv-tape{font-size:var(--text-sm);line-height:1.9}}@media(max-width:600px){.tv-rail{gap:var(--space-3) var(--space-2)}.tv-select{min-width:0;width:100%}.tv-field,.tv-field--custom .tv-input-num{width:100%}.tv-result__head{gap:var(--space-3)}.tv-copy-btn{margin-left:auto;width:auto;align-self:flex-start;padding:0 var(--space-3);font-size:var(--text-xs);min-height:32px}}