@font-face{font-family:"JetBrains Mono";src:url("/assets/fonts/JetBrainsMono-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url("/assets/fonts/JetBrainsMono-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
:root{color-scheme:dark;--bg:#111111;--surface:#090909;--raised:#242424;--text:#e5e5e5;--muted:#a3a3a3;--line:#303030;--accent:#e8e8e8;--selected-border:#686868;--code:#bcbcbc;--tooltip-bg:#e5e5e5;--tooltip-text:#111111;--selection:#424242;font-family:"JetBrains Mono","PingFang TC","Noto Sans TC",monospace;font-synthesis:none}
*{box-sizing:border-box}
html{scrollbar-gutter:stable both-edges}
body{margin:0;background:var(--bg);color:var(--text);font-size:16px;line-height:1.85;background-image:radial-gradient(color-mix(in srgb,var(--muted) 7%,transparent) .5px,transparent .5px);background-size:4px 4px}
main{position:relative;width:min(100% - 64px,800px);margin:80px auto 48px}
.ambient-code{position:fixed;inset:0 0 0 auto;width:270px;overflow:hidden;white-space:pre;pointer-events:none;user-select:none;color:var(--muted);opacity:.045;font-size:16px;line-height:1.3;mask-image:linear-gradient(to right,transparent,#000)}
a{color:var(--accent);text-underline-offset:5px;text-decoration-thickness:1px}a:hover{color:var(--text)}button,input{font:inherit}button{cursor:pointer}h1,h2,p{margin:0}h1{font-size:30px;line-height:1.4;letter-spacing:-.8px}h2{font-size:17px;line-height:1.5;letter-spacing:1.4px;color:var(--accent)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,[role=tabpanel]:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.icon{width:18px;height:18px;stroke-width:1.65;flex:none;vertical-align:middle}


.icon-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border:1px solid transparent;border-radius:8px;color:var(--muted);background:transparent;text-decoration:none;position:relative;padding:0}.icon-button>span{display:flex}.icon-button:hover,.icon-button:focus-visible{color:var(--accent);background:var(--raised)}.icon-button[data-copied=true]{color:var(--accent)}.icon-button::after{content:attr(data-tooltip);position:absolute;right:0;bottom:calc(100% + 8px);padding:5px 9px;background:var(--tooltip-bg);color:var(--tooltip-text);border-radius:3px;white-space:nowrap;pointer-events:none;opacity:0;font-size:14px;line-height:1.6;z-index:2}.icon-button:hover::after,.icon-button:focus-visible::after{opacity:1}
.home-intro{margin:12px 0 44px}.ascii-banner{background:transparent;padding:36px 28px;container-type:inline-size}.ascii-art{font-family:"JetBrains Mono",monospace;font-size:min(17px,calc(100cqi / (var(--ascii-columns) * .6)));line-height:1.12;letter-spacing:0;color:var(--selected-border);padding:0;white-space:pre;overflow-wrap:normal;text-shadow:none;width:max-content;max-width:100%;margin-inline:auto}.ascii-cell{color:var(--accent);-webkit-text-stroke:.25px var(--bg)}.sample,.count{color:var(--muted);font-size:14px}.sample{white-space:nowrap}.section-heading{display:flex;align-items:baseline;gap:14px;margin-bottom:15px}section[data-group]+section[data-group]{margin-top:30px}
.resource-list{padding-left:26px;margin:0;list-style:disc}.resource-list li{color:var(--muted);padding:3px 0;line-height:1.9}.resource-link{overflow-wrap:anywhere}.description::before{content:" — ";white-space:pre}.resource-list .sample{margin-left:12px}.empty{color:var(--muted);padding:20px 0}

.breadcrumb{margin:4px 0 22px;font-size:14px}.breadcrumb a{display:inline-flex;gap:9px;align-items:center;text-decoration:none;color:var(--muted)}.breadcrumb a:hover{color:var(--accent)}.resource-detail{min-width:0}.detail{margin:27px 0 38px}.detail-meta{display:flex;align-items:center;gap:16px;color:var(--muted);margin-bottom:11px;font-size:14px}.kind{color:var(--accent);display:inline-flex;align-items:center;gap:7px}.detail h1{overflow-wrap:anywhere}.detail p{color:var(--muted);margin-top:12px}.install h2{margin-bottom:18px}.install-tabs{display:flex;gap:6px;overflow-x:auto;padding:4px 3px 12px;margin:0 -3px;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.install-tabs button{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;white-space:nowrap;color:var(--muted);background:transparent;border:1px solid transparent;border-radius:8px;padding:8px 10px;line-height:1.5;font-size:14px}.install-tabs .icon{width:16px;height:16px}.install-tabs button:hover{background:var(--raised);color:var(--text)}.install-tabs button[aria-selected=true]{background:var(--raised);color:var(--accent);border-color:var(--selected-border)}
.code-block{background:var(--surface);border:1px solid var(--line);border-radius:16px;min-width:0}.code-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 12px 8px 24px;border-bottom:1px solid var(--line);min-height:55px}.code-label{display:flex;align-items:center;gap:9px;color:var(--muted);min-width:0;overflow-wrap:anywhere;line-height:1.5;font-size:14px;text-decoration:none}.code-label .icon{width:16px;height:16px}.code-actions{display:flex;align-items:center;gap:3px;flex-shrink:0}pre{font:inherit;font-size:14px;line-height:2;white-space:pre-wrap;overflow-wrap:anywhere;margin:0;padding:26px;tab-size:2;color:var(--code)}pre code{font:inherit}.md-heading{color:var(--accent);font-weight:700}.install-command pre{padding:20px 24px;line-height:1.85;color:var(--code)}.install-note{display:flex;justify-content:space-between;align-items:baseline;gap:14px;color:var(--muted);margin-top:12px;font-size:14px}.install-note a{display:inline-flex;align-items:center;white-space:nowrap;gap:3px;text-decoration:none}.install-note .icon{width:15px;height:15px}.source-section{margin-top:28px}.status{font-size:14px;color:var(--accent)}.status:not(:empty){margin-top:9px}details{margin-top:24px;color:var(--muted);font-size:14px}summary{cursor:pointer;width:fit-content}details p{margin-top:12px}
.skip{position:fixed;left:16px;top:-100px;background:var(--bg);padding:8px;z-index:5}.skip:focus{top:12px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}::selection{background:var(--selection);color:var(--text)}
@media(max-width:600px){body{font-size:14px}main{width:calc(100% - 36px);margin:48px auto 32px}.home-intro{margin-top:6px;margin-bottom:30px}.ascii-banner{padding:22px 10px}.ascii-art{display:block}.ascii-cell{-webkit-text-stroke:.15px var(--bg)}.section-heading{margin-bottom:12px}.resource-list{padding-left:20px}.resource-list li{padding:6px 0}.description{display:block;line-height:1.8;margin:3px 0}.description::before{content:none}.resource-list .sample{margin-left:0}.breadcrumb{margin-bottom:18px}.detail{margin:23px 0 29px}.detail h1{font-size:25px}.detail-meta{gap:12px}.code-toolbar{padding:7px 7px 7px 15px;gap:6px}.code-label{gap:7px}.code-label>.icon{display:none}.code-actions{gap:0}pre{padding:20px 16px}.install-command pre{padding:18px 16px}.install-note{flex-wrap:wrap;gap:5px}.source-section{margin-top:24px}.ambient-code{display:none}}
@media(prefers-reduced-motion:no-preference){a,button{transition:color .15s,background .15s,border-color .15s}.icon-button::after{transition:opacity .12s}}

.resource-date{font-size:14px;color:var(--muted);white-space:nowrap}.resource-list .resource-date{margin-left:12px}.resource-list li:has(.resource-date) .description{display:block}.resource-list li:has(.resource-date) .description::before{content:none}.detail-meta{flex-wrap:wrap;row-gap:5px}

.language-switch{position:relative;margin:0;color:var(--text);font-size:14px;z-index:5}
.language-switch summary{list-style:none;cursor:pointer;width:40px}
.language-switch summary::-webkit-details-marker{display:none}
.language-switch summary::marker{content:""}
.language-switch[open] summary{background:var(--raised);border-color:var(--line)}
.language-options{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);width:152px;padding:5px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:0 8px 24px #00000080}
.language-options button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:40px;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--muted);font-size:14px;text-align:left}
.language-options button:hover,.language-options button:focus-visible{background:var(--raised);color:var(--text)}
.language-options button[aria-pressed=true]{color:var(--text)}
.language-options button .icon{width:15px;height:15px;visibility:hidden}
.language-options button[aria-pressed=true] .icon{visibility:visible}

.page-tools{display:flex;justify-content:center;margin-top:30px}.language-switch summary::after{display:none}

.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;list-style:none;padding:0;margin:0}.breadcrumb li{display:flex;align-items:baseline;gap:12px;min-width:0}.breadcrumb li>span[aria-hidden]{color:var(--muted)}.breadcrumb [aria-current]{color:var(--text);overflow-wrap:anywhere}.breadcrumb a{color:var(--muted)}

.resource-list li{color:#555}.resource-list .description{display:block;color:#555;margin-top:3px}.resource-list .description::before{content:none}
.detail h1{display:flex;align-items:baseline;gap:12px}.detail h1>.icon{width:26px;height:26px;align-self:flex-start;margin-top:8px}.detail h1>span{min-width:0}.detail-date{margin-top:24px;text-align:right}
@media(max-width:600px){.detail h1{gap:9px}.detail h1>.icon{width:21px;height:21px;margin-top:6px}}

/* Source panel: quiet surface with actions in the upper-right corner. */
.source-section .code-block{background:#1f1f1f;border:0;border-radius:24px}
.source-section .code-toolbar{justify-content:flex-end;border-bottom:0;padding:8px 14px;min-height:56px}
.source-section pre{padding:28px 26px 30px}
@media(max-width:600px){.source-section .code-block{border-radius:20px}.source-section .code-toolbar{padding:8px 10px}.source-section pre{padding:20px 18px 24px}}

section[data-group],.resource-detail,.breadcrumb{max-width:550px;margin-inline:auto}
.section-heading h2{position:relative;padding-left:36px}
.section-prefix{position:absolute;left:0}
.resource-list{list-style:none;padding-left:36px}
.resource-list .description{line-height:1.55}

.ascii-mobile{display:none}
@media(max-width:600px){
  .ascii-banner{padding:20px 0}
  .ascii-desktop{display:none}
  .ascii-mobile{display:block}
}
