:root{--sample-1-a:#1f3a4a;--sample-1-b:#e9b96b;--sample-2-a:#3b2440;--sample-2-b:#8fd1c4;--sample-3-a:#2c3b22;--sample-3-b:#f0d7a8;--sample-4-a:#4a2a22;--sample-4-b:#a9c4f2;--sample-5-a:#1e2b45;--sample-5-b:#f3a9a0;--sample-6-a:#34362a;--sample-6-b:#c7e08a;--sample-ink:#f4f1ea}[data-theme=light]{--sample-1-a:#27536a;--sample-1-b:#f1c47a;--sample-2-a:#54325c;--sample-2-b:#9fe0d2;--sample-3-a:#3d5230;--sample-3-b:#f5e0b6;--sample-4-a:#6a3a2e;--sample-4-b:#b8d0f7;--sample-5-a:#2a3c60;--sample-5-b:#f6b8b0;--sample-6-a:#484a39;--sample-6-b:#d2e89a}.th-box{aspect-ratio:1224/780;width:100%;position:relative;container-type:size}.th-box[data-box=phone]{aspect-ratio:410/776;max-width:380px;margin-inline:auto}@media (max-width:839.98px){.th-box[data-box=auto]{aspect-ratio:410/776;max-width:380px;margin-inline:auto}}.th-frame{--fw:1200;--fh:720;--fc:36;--fb:12;--ow:calc(var(--fw) + 2 * var(--fb));--oh:calc(var(--fh) + var(--fc) + 2 * var(--fb));--k:min(tan(atan2(100cqw, calc(var(--ow) * 1px))), tan(atan2(100cqh, calc(var(--oh) * 1px))));width:calc(var(--ow) * 1px);height:calc(var(--oh) * 1px);transform-origin:0 0;transform:translate(calc((100cqw - var(--ow) * 1px * var(--k)) / 2), calc((100cqh - var(--oh) * 1px * var(--k)) / 2)) scale(var(--k));padding:calc(var(--fb) * 1px);background-color:var(--color-plate);box-shadow:var(--edge-machined), 0 0 0 1px var(--color-border);-webkit-font-smoothing:antialiased;position:absolute;top:0;left:0}@media (max-width:839.98px){.th-frame[data-auto]{--fw:390;--fb:10}}.th-strip{height:calc(var(--fc) * 1px);justify-content:space-between;align-items:flex-start;gap:12px;padding-bottom:8px;display:flex}.th-address{background-color:var(--color-bg-tertiary);min-width:0;max-width:62%;height:26px;box-shadow:var(--edge-machined-pressed);color:var(--color-text-secondary);font-family:var(--font-mono);white-space:nowrap;align-items:center;padding:0 10px;font-size:12px;line-height:1;display:inline-flex;position:relative}.th-address[data-external]{color:var(--color-text);padding-left:14px}.th-address[data-external]:before{content:"";background-color:var(--color-info);width:2px;position:absolute;top:0;bottom:0;left:0}.th-screen{width:calc(var(--fw) * 1px);height:calc(var(--fh) * 1px);isolation:isolate;background-color:var(--color-bg);color:var(--color-text);box-shadow:0 0 0 1px var(--color-border);position:relative;overflow:hidden}.th-content{width:100%;height:100%;position:relative;overflow:hidden;container-type:inline-size}.th-cursor{z-index:50;pointer-events:none;opacity:0;transition:opacity .2s var(--ease-std);position:absolute;top:0;left:0}.th-cursor[data-on]{opacity:1}.th-cursor>[data-shape]{display:none;position:absolute}.th-cursor[data-mode=pointer]>[data-shape=pointer],.th-cursor[data-mode=text]>[data-shape=text],.th-cursor[data-mode=touch]>[data-shape=touch]{display:block}.th-cursor [data-shape=pointer]{transform-origin:2px 2px;transition:transform .1s var(--ease-latch);top:-2px;left:-2px}.th-cursor-fill{fill:var(--color-text);stroke:var(--color-bg)}.th-cursor [data-shape=text]{background-color:var(--color-text);width:2px;height:22px;box-shadow:0 0 0 1px var(--color-bg);top:-11px;left:-1px}.th-cursor [data-shape=touch]{border:2px solid var(--color-accent);width:28px;height:28px;transition:transform .24s var(--ease-latch), opacity .24s var(--ease-std);border-radius:50%;top:-14px;left:-14px}.th-cursor[data-down] [data-shape=pointer]{transform:scale(.88)}.th-cursor[data-down] [data-shape=touch]{transform:scale(.6)}.th-ring{border:2px solid var(--color-accent);opacity:0;border-radius:50%;width:28px;height:28px;position:absolute;top:-14px;left:-14px}.th-cursor[data-mode=touch] .th-ring[data-pulse]{animation:th-ring .24s var(--ease-latch) forwards}@keyframes th-ring{0%{opacity:1;transform:scale(.6)}to{opacity:0;transform:scale(1)}}.th-content [data-press]{transform:translateY(1px)}.th-content [data-demo]{transition-property:transform,background-color,border-color,color,box-shadow,opacity;transition-duration:var(--dur-ui);transition-timing-function:var(--ease-latch)}.th-content [data-hover].deposit-box{box-shadow:var(--shadow-card-hover), 0 0 0 1px var(--color-border-hover)}.th-content [data-hover].deposit-box [data-drawer-face]>.cover{transform:translateY(-6px)}.th-content [data-hover]:is(button,[role=button]){filter:brightness(1.06)}.th-spot{z-index:40;pointer-events:none;opacity:0;outline:2px solid var(--color-accent);box-shadow:0 0 0 100vmax var(--color-scrim);transition:opacity .25s var(--ease-std), left .3s var(--ease-latch), top .3s var(--ease-latch), width .3s var(--ease-latch), height .3s var(--ease-latch);position:absolute}.th-tip{z-index:41;pointer-events:none;opacity:0;background-color:var(--color-raised);max-width:300px;color:var(--color-text);box-shadow:var(--shadow-lg);transition:opacity .25s var(--ease-std), transform .25s var(--ease-latch);padding:10px 12px;font-size:14px;line-height:1.45;position:absolute;transform:translateY(4px)}.th-spot[data-on],.th-tip[data-on]{opacity:1;transform:none}.th-root[data-paused] .th-frame *,.th-root[data-paused] .th-frame :before,.th-root[data-paused] .th-frame :after{animation-play-state:paused!important}.th-knob{border:1px solid var(--color-border-control);background-color:var(--color-plate);width:44px;height:44px;box-shadow:var(--edge-machined);color:var(--color-text);cursor:pointer;transition:border-color var(--dur-micro) var(--ease-std);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.th-knob:active{box-shadow:var(--edge-machined-pressed);transform:translateY(1px)}@media (hover:hover) and (pointer:fine){.th-knob:hover{border-color:var(--color-text)}}.th-tabs{background-color:var(--color-plate);box-shadow:var(--edge-machined), 0 0 0 1px var(--color-border);display:flex;overflow-x:auto}.th-tab{cursor:pointer;text-align:left;flex-direction:column;flex:1 0 auto;justify-content:center;gap:8px;min-height:52px;padding:10px 16px 0;display:flex;position:relative}.th-tab+.th-tab{border-left:1px solid var(--color-border)}.th-tab:after{content:"";background-color:var(--color-accent);transform-origin:0;height:2px;transition:transform var(--dur-ui) var(--ease-latch);position:absolute;bottom:0;left:0;right:0;transform:scaleX(0)}.th-tab[data-active]:after{transform:scaleX(1)}.th-tab:focus-visible{outline-offset:-2px}.th-tab-ruler{border-bottom:1px solid var(--color-border);align-items:flex-end;gap:6px;height:8px;margin-bottom:6px;display:flex}.th-tab-ruler>span{background-color:var(--color-border-hover);width:1px;height:5px;transition:background-color var(--dur-micro) var(--ease-std)}.th-tab[data-active] .th-tab-ruler>span{height:7px}.th-tab-ruler>span[data-lit]{background-color:var(--color-accent);width:2px}.th-mini .th-frame{box-shadow:var(--edge-machined), 0 0 0 1px var(--color-border)}.th-content [data-key-plate][data-status=ready]>[data-bolt]{animation:th-bolt var(--dur-panel) var(--ease-latch) both}.th-content [data-key-plate][data-status=ready]>[data-bolt$=l]{--bolt-from:-4px}.th-content [data-key-plate][data-status=ready]>[data-bolt$=r]{--bolt-from:4px}@keyframes th-bolt{0%{transform:translateX(var(--bolt-from,0))}to{transform:none}}.th-rise{animation:plate-in var(--dur-panel) var(--ease-latch) calc(var(--i,0) * 70ms) both}.th-slide{animation:th-slide var(--dur-panel) var(--ease-latch) both}@keyframes th-slide{0%{opacity:0;transform:translate(24px)}to{opacity:1;transform:none}}.th-pop{animation:panel-in var(--dur-ui) var(--ease-latch) both}.th-caret{vertical-align:-.18em;background-color:var(--color-text);width:2px;height:1.1em;margin-left:1px;display:inline-block}@media (prefers-reduced-motion:reduce){.th-rise,.th-slide,.th-pop,.th-content [data-key-plate]>[data-bolt]{animation:none}}