@layer base,components,variants;@layer components{[data-theme=light] .tl-display{--tl-ghost-color: color-mix(in srgb, var(--tk-accent, #ff2222) 10%, #ccc);--tl-lamp-rim: color-mix(in srgb, var(--tk-accent, #ff2222) 55%, #333)}.tl-display{--tl-lamp-glow: .85;--tl-lamp-core: color-mix(in srgb, var(--tk-accent, #ff2222) calc(55% - var(--tl-lamp-glow) * 25%), white);--tl-lamp-hot: color-mix(in srgb, var(--tk-accent, #ff2222) calc(80% - var(--tl-lamp-glow) * 10%), white);--tl-lamp-body: var(--tk-accent, #ff2222);--tl-lamp-rim: color-mix(in srgb, var(--tk-accent, #ff2222) 72%, black);--tl-ghost-color: color-mix(in srgb, var(--tk-accent, #ff2222) 8%, #1c1c1c);container-type:inline-size;display:flex;align-items:center;justify-content:center;width:100%;background:var(--tk-face-bg, #0a0a0a);border-radius:var(--tk-radius-lg);box-shadow:inset 0 2px 12px #0009,inset 0 0 0 1px #ffffff0a;padding:2rem 2.5rem;position:relative;overflow:hidden;opacity:var(--tk-face-opacity, 1);color:var(--tk-face-text, var(--tk-text))}.tl-display:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.03) 0%,transparent 30%);pointer-events:none;border-radius:inherit}.tl-display svg{width:100%;max-width:clamp(280px,70cqi,700px);height:auto}.tl-display__content{width:100%;display:flex;align-items:center;justify-content:center}.tl-dot-lit{fill:url(#tl-lamp)}.tl-seg-lit{mix-blend-mode:screen}.tl-dot-ghost{fill:var(--tl-ghost-color, #1c1c1c)}.tl-colon--hidden circle{opacity:0}.tl-display--no-glow .tl-seg-lit{filter:none!important;mix-blend-mode:normal}.tl-display--no-glow .tl-dot-lit{fill:var(--tl-lamp-body, var(--tk-accent, #ff2222))}.tl-display--flash{animation:tl-flash .5s step-end 6}@keyframes tl-flash{50%{opacity:.2}}[data-fullscreen] .tl-display{width:100%;height:100%;display:flex;align-items:center;justify-content:center;border-radius:0;padding:clamp(1rem,3vh,2.5rem) clamp(1.25rem,4vh,3rem)}[data-fullscreen] .tl-display svg{max-width:clamp(400px,80vw,1000px)}@container (max-width: 460px){.tl-display{padding:1.15rem 1.25rem}}@container (max-width: 340px){.tl-display{border-radius:10px;padding:.8rem .9rem}}}
