.tools-pill{letter-spacing:normal;text-transform:none;white-space:nowrap;cursor:pointer;align-items:center;gap:.45rem;min-height:2.125rem;padding:0 .9rem;font-size:13px;font-weight:500;line-height:1;text-decoration:none;display:inline-flex}.tools-pill:hover{text-decoration:none}.tools-links>a,.tools-links>div>button[aria-haspopup]{border:1px solid var(--hairline-strong);border-radius:var(--radius-control);min-height:2.125rem;color:var(--ink-2);letter-spacing:normal;text-transform:none;background:0 0;align-items:center;gap:.45rem;padding:0 .85rem;font-size:13px;font-weight:500;text-decoration:none;transition:background-color .2s,color .2s;display:inline-flex}.tools-links>a:hover,.tools-links>div>button[aria-haspopup]:hover{background:color-mix(in oklab, var(--foreground) 8%, transparent);color:var(--foreground)}.tools-rail{z-index:35;border-radius:var(--radius-control);margin:0 0 .875rem;padding:.3rem;position:sticky;top:4.75rem;overflow:hidden}.tools-rail-scroll{overscroll-behavior-x:contain;scrollbar-width:none;border-radius:inherit;--tools-fade-a:0px;--tools-fade-b:0px;-webkit-mask-image:linear-gradient(to right, transparent 0, #000 var(--tools-fade-a), #000 calc(100% - var(--tools-fade-b)), transparent 100%);-webkit-mask-image:linear-gradient(to right, transparent 0, #000 var(--tools-fade-a), #000 calc(100% - var(--tools-fade-b)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, #000 var(--tools-fade-a), #000 calc(100% - var(--tools-fade-b)), transparent 100%);flex-direction:row;align-items:center;gap:.25rem;display:flex;position:relative;overflow:auto hidden}.tools-rail-scroll::-webkit-scrollbar{display:none}.tools-rail-scroll[data-fade-start]{--tools-fade-a:28px}.tools-rail-scroll[data-fade-end]{--tools-fade-b:28px}.tools-rail-sentinel{pointer-events:none;flex:0 0 1px;width:1px;height:1px}.tools-tab{border-radius:var(--radius-control);min-height:2.5rem;color:var(--ink-2);text-align:left;white-space:nowrap;cursor:pointer;border:1px solid #0000;flex:none;align-items:center;gap:.5rem;padding:0 .95rem;font-size:14px;font-weight:500;line-height:1;transition:background-color .2s,color .2s,border-color .2s;display:inline-flex;position:relative}.tools-tab:hover{color:var(--foreground);background:color-mix(in oklab, var(--foreground) 5%, transparent)}.tools-tab[aria-pressed=true]{color:var(--foreground);border-color:var(--hairline-strong);background:color-mix(in oklab, var(--foreground) 8%, transparent)}.tools-tab-icon{width:16px;height:16px;color:var(--ink-3);flex:none;transition:color .2s}.tools-tab:hover .tools-tab-icon,.tools-tab[aria-pressed=true] .tools-tab-icon{color:var(--foreground)}.tools-tab-label{text-overflow:ellipsis;min-width:0;overflow:hidden}.tools-tab-bar{display:none}@media (pointer:coarse){.tools-tab{min-height:2.75rem}}@media (min-width:768px){.tools-rail{z-index:10;border-radius:var(--radius-panel);flex-direction:column;align-self:start;max-height:calc(100dvh - 7.5rem);margin:0;padding:0;display:flex;top:6rem}.tools-rail-scroll{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--hairline-strong) transparent;min-height:0;-webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 var(--tools-fade-a), #000 calc(100% - var(--tools-fade-b)), transparent 100%);-webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 var(--tools-fade-a), #000 calc(100% - var(--tools-fade-b)), transparent 100%);mask-image:linear-gradient(to bottom, transparent 0, #000 var(--tools-fade-a), #000 calc(100% - var(--tools-fade-b)), transparent 100%);flex-direction:column;align-items:stretch;gap:2px;padding:.5rem;overflow:hidden auto}.tools-rail-scroll::-webkit-scrollbar{width:6px;display:block}.tools-rail-scroll::-webkit-scrollbar-track{background:0 0}.tools-rail-scroll::-webkit-scrollbar-thumb{background:var(--hairline-strong);border-radius:9999px}.tools-rail-scroll[data-fade-start]{--tools-fade-a:36px}.tools-rail-scroll[data-fade-end]{--tools-fade-b:36px}.tools-tab{border-radius:var(--radius-field);border:0;gap:.75rem;width:100%;min-height:2.75rem;padding:0 .75rem 0 .875rem;font-size:14.5px;display:flex}.tools-tab[aria-pressed=true]{background:color-mix(in oklab, var(--foreground) 7%, transparent)}.tools-tab-icon{width:18px;height:18px;color:var(--ink-2)}.tools-tab-bar{background:var(--energy);border-radius:2px;width:2px;display:block;position:absolute;top:.7rem;bottom:.7rem;left:0}}.tools-workspace{scroll-margin-top:9.75rem}@media (min-width:768px){.tools-workspace{scroll-margin-top:6rem}}.tools-stage{background:var(--glass-bg-strong);border:1px solid var(--hairline);border-radius:var(--radius-panel);min-height:500px;box-shadow:inset 0 1px 0 var(--glass-highlight);margin-inline:-1rem;padding:.875rem;position:relative}@media (min-width:640px){.tools-stage{margin-inline:0;padding:1.5rem}}@media (min-width:768px){.tools-stage{min-height:max(500px,min(72dvh,46rem))}}.tools-doc{background:var(--glass-bg-strong);border:1px solid var(--hairline);border-radius:var(--radius-panel);box-shadow:inset 0 1px 0 var(--glass-highlight);margin-inline:-1rem;position:relative;overflow:hidden}@media (min-width:640px){.tools-doc{margin-inline:0}}.tools-file{border-radius:var(--radius-field);color:var(--ink-2);border:1px solid #0000;transition:background-color .2s,border-color .2s,color .2s}.tools-file:hover{color:var(--foreground);border-color:var(--hairline);background:color-mix(in oklab, var(--foreground) 6%, transparent)}.tools-chip{border:1px solid var(--hairline);border-radius:var(--radius-control);min-height:2.25rem;color:var(--ink-2);cursor:pointer;align-items:center;gap:.4rem;padding:0 .9rem;font-size:13.5px;font-weight:500;transition:background-color .2s,color .2s,border-color .2s;display:inline-flex}.tools-chip:hover{color:var(--foreground);background:color-mix(in oklab, var(--foreground) 5%, transparent)}.tools-chip[aria-pressed=true]{color:var(--foreground);border-color:var(--hairline-strong);background:color-mix(in oklab, var(--foreground) 8%, transparent)}@media (pointer:coarse){.tools-chip{min-height:2.75rem}}.tools-game{text-align:left;cursor:pointer;flex-direction:column;align-items:flex-start;gap:.4rem;width:100%;padding:1.15rem 1.15rem 1rem;display:flex}.tools-game:hover{border-color:var(--hairline-strong)}.tools-game-icon{border:1px solid var(--hairline);background:color-mix(in oklab, var(--foreground) 5%, transparent);width:2.5rem;height:2.5rem;color:var(--ink-2);border-radius:9999px;place-items:center;transition:color .2s,border-color .2s;display:grid}.tools-game:hover .tools-game-icon{color:var(--energy);border-color:var(--hairline-strong)}.tools-game-go{color:var(--ink-2);align-items:center;gap:.35rem;margin-top:auto;padding-top:.6rem;font-size:13px;font-weight:500;transition:color .2s;display:inline-flex}.tools-game-go svg{transition:transform .25s var(--ease-out-soft)}.tools-game:hover .tools-game-go{color:var(--foreground)}.tools-game:hover .tools-game-go svg{transform:translate(4px)}.tools-grid .tools-badge{border:1px solid var(--hairline-strong);min-height:1.625rem;color:var(--ink-2);letter-spacing:normal;text-transform:none;padding:0 .6rem;font-size:12px;font-weight:500}.tools-grid .tools-badge:hover{color:var(--foreground)}@media (prefers-reduced-motion:reduce){.tools-tab,.tools-tab-icon,.tools-chip,.tools-file,.tools-links>a,.tools-game-icon,.tools-game-go,.tools-game-go svg{transition:none}.tools-game:hover .tools-game-go svg{transform:none}}.dx-lite .tools-game:hover .tools-game-go svg{transform:none}:root:not([data-rich=off]) .tools-tab-icon{color:color-mix(in oklab, var(--hue,var(--energy)) 60%, var(--ink-2))}:root:not([data-rich=off]) .tools-tab:hover .tools-tab-icon,:root:not([data-rich=off]) .tools-tab[aria-pressed=true] .tools-tab-icon{color:color-mix(in oklab, var(--hue,var(--energy)) 86%, var(--foreground))}:root:not([data-rich=off]) .tools-tab[aria-pressed=true]{border-color:color-mix(in oklab, var(--hue,var(--energy)) 45%, transparent);background:color-mix(in oklab, var(--hue,var(--energy)) 13%, transparent)}:root:not([data-rich=off]) .tools-tab-bar{background:var(--hue,var(--energy))}:root:not([data-rich=off]) .tools-links>a:hover,:root:not([data-rich=off]) .tools-links>div>button[aria-haspopup]:hover{border-color:color-mix(in oklab, var(--energy) 55%, transparent)}:root:not([data-rich=off]) .tools-chip:hover{border-color:color-mix(in oklab, var(--energy) 38%, transparent)}:root:not([data-rich=off]) .tools-chip[aria-pressed=true]{border-color:color-mix(in oklab, var(--energy) 58%, transparent);background:color-mix(in oklab, var(--energy) 16%, transparent)}:root:not([data-rich=off]) .tools-chip[aria-pressed=true]>span{color:var(--accent-ink)}:root:not([data-rich=off]) .tools-game:hover .tools-game-icon{color:color-mix(in oklab, var(--hue,var(--energy)) 86%, var(--foreground));border-color:color-mix(in oklab, var(--hue,var(--energy)) 60%, transparent)}:root:not([data-rich=off]) .tools-game-tags{color:color-mix(in oklab, var(--hue,var(--energy)) 62%, var(--ink-2))}:root:not([data-rich=off]) .tools-game-new{color:color-mix(in oklab, var(--energy-3) 86%, var(--foreground))}:root:not([data-rich=off]) .tools-game:hover .tools-game-go{color:color-mix(in oklab, var(--hue,var(--energy)) 86%, var(--foreground))}:root:not([data-rich=off]) .tools-grid .tools-badge:hover{border-color:color-mix(in oklab, var(--hue,var(--energy)) 55%, transparent)}
