/* midicn core v0.9.0 */
:root{ color-scheme:light dark; --ink:#0B0B0C; --ink:light-dark(#F7F4EE,#0B0B0C); --ink-2:#111113; --ink-2:light-dark(#FFFFFF,#111113); --ink-3:#17171A; --ink-3:light-dark(#F1EDE5,#17171A); --ink-4:#0E0E10; --ink-4:light-dark(#FAF8F4,#0E0E10); --rule:#242427; --rule:light-dark(#D9D3C7,#242427); --rule-2:#343439; --rule-2:light-dark(#BDB5A5,#343439); --paper:#F2EEE6; --paper:light-dark(#16161A,#F2EEE6); --paper-2:#A9A49B; --paper-2:light-dark(#5A564E,#A9A49B); --paper-3:#6E6A64; --paper-3:light-dark(#6E6A64,#807B72); --vermilion:#CE4A32; --vermilion:light-dark(#A93A24,#CE4A32); --gold:#C9A227; --gold:light-dark(#8A6F10,#C9A227); --jade:#5E9E7E; --jade:light-dark(#2F6B50,#5E9E7E); --slate:#7A8AA3; --slate:light-dark(#4C5A70,#7A8AA3); --ok:light-dark(#1B7A4C,#58D48A); --study:light-dark(#1F5FA8,#5A9BD8); --doubt:light-dark(#9A6213,#E8A33D); --warn:light-dark(#C0452A,#FF7A5C); --stop:light-dark(#B32E2E,#E45A5A); --vermilion-soft:rgba(206,74,50,.14); --vermilion-soft:light-dark(rgba(169,58,36,.10),rgba(206,74,50,.14)); --vermilion-line:rgba(206,74,50,.45); --vermilion-line:light-dark(rgba(169,58,36,.40),rgba(206,74,50,.45)); --gold-soft:rgba(201,162,39,.14); --gold-soft:light-dark(rgba(138,111,16,.10),rgba(201,162,39,.14)); --jade-soft:rgba(94,158,126,.14); --jade-soft:light-dark(rgba(47,107,80,.10),rgba(94,158,126,.14)); --accent-h:18; --accent-c:.16; --accent:oklch(.58 var(--accent-c) var(--accent-h)); --accent:light-dark(oklch(.58 var(--accent-c,.16) var(--accent-h)),oklch(.80 var(--accent-c,.15) var(--accent-h))); --accent-soft:oklch(.58 var(--accent-c,.16) var(--accent-h) / .14); --accent-soft:light-dark(oklch(.58 var(--accent-c,.16) var(--accent-h) / .12),oklch(.80 var(--accent-c,.15) var(--accent-h) / .16)); --on-accent:light-dark(#FFF8F4,#1A0A06); --n0:light-dark(#FBF8F1,#08080B); --n1:light-dark(#FFFFFF,#12121A); --n2:light-dark(#F4F0E6,#1A1A25); --n3:light-dark(#E4DECF,#242432); --n4:light-dark(#CFC7B2,#32323F); --n5:light-dark(#B3AA93,#4A4A5A); --n6:light-dark(#8F8875,#6C6C80); --n7:light-dark(#6E6857,#8E8EA3); --n8:light-dark(#524D3F,#B4B4C6); --n9:light-dark(#38342A,#D6D6E2); --n10:light-dark(#211E17,#EFEFE8); --n11:light-dark(#12100B,#F7F6F1); --serif:"Songti SC","Source Han Serif SC","Noto Serif SC",Georgia,"Times New Roman",serif; --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Roboto,sans-serif; --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace; --fs-10:clamp(10px,.62rem,11px); --fs-11:clamp(10.5px,.66rem,11.5px); --fs-12:clamp(11.5px,.72rem,12.5px); --fs-13:clamp(12.5px,.79rem,13.5px); --fs-14:clamp(13.5px,.85rem,14.5px); --fs-16:clamp(15px,.95rem,16.5px); --fs-20:clamp(17px,1.1rem,20px); --fs-26:clamp(20px,1.6vw,26px); --fs-34:clamp(24px,2.6vw,34px); --fs-38:clamp(28px,3.2vw,38px); --fs-46:clamp(28px,4vw,46px); --lh-tight:1.2; --lh-body:1.68; --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px; --s8:64px; --r-1:8px; --r-2:16px; --r-3:26px; --r-full:999px; --r:var(--r-1); --r-lg:var(--r-2); --shadow-1:0 1px 0 light-dark(rgba(90,70,30,.10),rgba(0,0,0,.35)),0 10px 24px -16px oklch(.60 .10 var(--accent-h) / .45); --shadow-2:0 2px 0 light-dark(rgba(90,70,30,.08),rgba(0,0,0,.30)),0 20px 44px -22px oklch(.60 .12 var(--accent-h) / .55); --wrap:min(92vw,1560px); --wrap-wide:var(--wrap); --wrap-read:var(--wrap); --gutter:clamp(var(--s4),2.5vw,var(--s6)); --z-hdr:20; --z-play:30; --z-pop:40; --hdr:56px; --play:68px; --tap:44px; --sa-t:env(safe-area-inset-top,0px); --sa-b:env(safe-area-inset-bottom,0px); --sa-l:env(safe-area-inset-left,0px); --sa-r:env(safe-area-inset-right,0px); --t:.15s linear; } :root[data-theme=light]{color-scheme:light} :root[data-theme=dark]{color-scheme:dark} @media(prefers-reduced-motion:reduce){ :root{--t:.01s} } .jf-t1{stroke:var(--jf-1)} .jf-t2{stroke:var(--jf-2)} .jf-t3{stroke:var(--jf-3)} .jf-t4{stroke:var(--jf-4)} .jf-w1{stroke:var(--jf-1)} .jf-w4{stroke:var(--jf-4)} .jf-dome{fill:var(--jf-dome)} .jf-dome-n{fill:color-mix(in oklab,var(--jf-dome) 22%,var(--n6))} .jf-dome-d{fill:color-mix(in oklab,var(--jf-dome) 12%,var(--n4))} .jf-mute{stroke:color-mix(in oklab,var(--jf-dome) 45%,var(--n6))} .jf-n{stroke:var(--n6)} .jf-n4{stroke:var(--n4)} .jf-doubt{stroke:var(--doubt)} .jf-dim{stroke:var(--jf-dome);stroke-opacity:.55} .jf-stack{display:inline-flex;position:relative;line-height:0;flex:none} .jf-stack .jf{display:none} .jf-stack .jf-idle{display:block} .jf-stack .jf-playing,.jf-stack .jf-loading,.jf-stack .jf-done,.jf-stack .jf-hint {position:absolute;top:0;left:0} :root[data-jf=playing] .jf-stack .jf-idle{visibility:hidden} :root[data-jf=playing] .jf-stack .jf-playing{display:block} :root[data-jf=loading] .jf-stack .jf-idle{visibility:hidden} :root[data-jf=loading] .jf-stack .jf-loading{display:block} :root[data-jf=hint] .jf-stack .jf-idle{visibility:hidden} :root[data-jf=hint] .jf-stack .jf-hint{display:block} :root[data-jf=done] .jf-stack .jf-idle{visibility:hidden} :root[data-jf=done] .jf-stack .jf-done{display:block} @media (prefers-reduced-motion:no-preference){ :root[data-jf=playing] .jf-stack .jf-playing path:nth-of-type(odd) {animation:jf-swim 1.6s ease-in-out infinite alternate} @keyframes jf-swim{from{transform:translateY(-.6px)}to{transform:translateY(.6px)}} } *{box-sizing:border-box;margin:0;padding:0} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth} body{background:var(--ink);color:var(--paper);font-family:var(--sans); font-size:var(--fs-14);line-height:var(--lh-body);-webkit-font-smoothing:antialiased; overflow-x:hidden} a{color:inherit;text-decoration:none;border-bottom:1px solid var(--rule-2); transition:border-color var(--t),color var(--t)} a:hover{border-bottom-color:var(--vermilion);color:var(--vermilion)} button,input,select{font:inherit;color:inherit} button{background:none;border:0;cursor:pointer} :focus-visible{outline:2px solid var(--vermilion);outline-offset:2px} img,svg{display:block;max-width:100%} ::selection{background:var(--vermilion);color:#fff} code,kbd{font-family:var(--mono);font-size:.9em;background:var(--ink-4);border:1px solid var(--rule);padding:.05em .3em} pre{background:var(--ink-4);border:1px solid var(--rule);padding:var(--s4);overflow-x:auto; font-family:var(--mono);font-size:var(--fs-12);line-height:1.8;margin:var(--s3) 0 var(--s5)} pre code{background:none;border:0;padding:0} h1,h2,h3{font-family:var(--serif);font-weight:600;letter-spacing:.01em;line-height:var(--lh-tight)} h1{font-size:var(--fs-34)} h2{font-size:var(--fs-26)} h3{font-size:var(--fs-16);font-family:var(--sans);font-weight:650;letter-spacing:0} p{color:var(--paper-2);margin-bottom:var(--s3)} strong,b{color:var(--paper);font-weight:650} .lede{font-family:var(--serif);font-size:var(--fs-16);line-height:1.78;color:var(--paper); max-width:100%} .lede em{font-style:normal;color:var(--vermilion)} .meta{font-family:var(--mono);font-size:var(--fs-11);color:var(--paper-3);letter-spacing:.04em} .num{font-family:var(--mono);font-variant-numeric:tabular-nums} .stitle{display:flex;align-items:baseline;gap:var(--s3);flex-wrap:wrap; padding-top:var(--s2);border-top:2px solid var(--vermilion);margin:var(--s5) 0 var(--s3)} .stitle h2{margin:0} .stitle .spacer{margin-left:auto} h1,h2,h3{text-wrap:balance} p,.lede{text-wrap:pretty} .lede{max-width:100%} .nav a,.btn,.axis,.langbtn,.dlchip,.dlmore,.fgrid a,.fgrid h4,.stitle h2,.stitle .meta, .tag,.lic,.pkg .pn,.pkg .pm,.sideitem .si-n,.hero-meta,.hero .kick,.crumbs span,.crumbs a{ white-space:nowrap} .nav{flex-wrap:wrap;row-gap:var(--s2)} @media(max-width:1023px){ .hbar{flex-wrap:wrap;height:auto;min-height:52px;padding-top:var(--s2);padding-bottom:var(--s2);row-gap:var(--s2)} .nav{margin-left:0;width:100%;order:9;gap:var(--s4)} } .wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)} .wrap-read{max-width:var(--wrap-read)} body > header{position:sticky;top:0;z-index:var(--z-hdr);background:var(--ink); border-bottom:1px solid var(--rule)} .hbar{max-width:var(--wrap);margin:0 auto;height:var(--hdr); padding:0 var(--gutter);display:flex;align-items:center;gap:var(--s5)} .brand{display:flex;align-items:center;gap:var(--s2);border:0;flex:none} .brand svg{width:22px;height:22px;flex:none} .brand .jf-404 svg{width:32px;height:32px} .brand b{font-family:var(--serif);font-size:var(--fs-16);font-weight:600} .brand i{font-family:var(--mono);font-size:var(--fs-11);font-style:normal;color:var(--paper-3);margin-left:2px} .nav{display:flex;gap:var(--s5);font-size:var(--fs-13);margin-left:auto;flex-wrap:wrap} .nav a{border-bottom:1px solid transparent;padding-bottom:2px;color:var(--paper-2)} .nav a:hover{color:var(--paper);border-bottom-color:var(--rule-2)} .nav a.on{color:var(--paper);border-bottom-color:var(--vermilion)} .iconbtn{width:34px;height:34px;border:1px solid var(--rule);color:var(--paper-2); display:grid;place-items:center;transition:var(--t);flex:none} .iconbtn:hover{border-color:var(--vermilion);color:var(--vermilion)} .iconbtn svg{width:15px;height:15px;fill:currentColor} .langbtn{width:auto;padding:0 var(--s3);font-family:var(--mono);font-size:var(--fs-11)} #theme svg{fill:none;stroke:currentColor} #theme .i-sun{display:none} #theme .i-moon{display:block} @media (prefers-color-scheme:dark){ :root:not([data-theme=light]) #theme .i-sun{display:block} :root:not([data-theme=light]) #theme .i-moon{display:none} } :root[data-theme=dark] #theme .i-sun{display:block} :root[data-theme=dark] #theme .i-moon{display:none} :root[data-theme=light] #theme .i-sun{display:none} :root[data-theme=light] #theme .i-moon{display:block} .kb-tabicons{position:absolute;width:0;height:0;overflow:hidden} .panel{border:1px solid var(--rule);background:var(--ink-2)} .panel-hd{display:flex;align-items:center;gap:var(--s3);padding:var(--s3) var(--s4); border-bottom:1px solid var(--rule);font-family:var(--serif);font-size:var(--fs-14)} .panel-bd{padding:var(--s3) var(--s4)} .tile{border:1px solid var(--rule);background:var(--ink-2);padding:var(--s3); transition:border-color var(--t),background var(--t);display:block} .tile:hover{border-color:var(--rule-2);background:var(--ink-3);border-bottom-color:var(--rule-2)} .tile.is-on{border-color:var(--vermilion);background:var(--vermilion-soft)} .dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s2) var(--s4);font-size:var(--fs-13)} .dl dt{color:var(--paper-3);white-space:nowrap;font-family:var(--mono);font-size:var(--fs-11);padding-top:2px} .dl dd{margin:0;color:var(--paper);word-break:break-word} table{width:100%;border-collapse:collapse;font-size:var(--fs-13)} th,td{text-align:left;padding:var(--s3);border-bottom:1px solid var(--rule);vertical-align:top} th{font-family:var(--mono);font-size:var(--fs-11);color:var(--paper-3); letter-spacing:.06em;font-weight:500;border-bottom-color:var(--rule-2);white-space:nowrap} td b{font-weight:600} .tw{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch} .lic{display:inline-flex;align-items:center;gap:var(--s2);font-family:var(--mono); font-size:var(--fs-11);white-space:nowrap;border:1px solid currentColor; padding:1px var(--s2);color:var(--paper-3)} .lic::before{content:'';width:6px;height:6px;background:currentColor;flex:none} .lic.c1{color:var(--jade)} .lic.c2{color:var(--gold)} .lic.c3{color:var(--slate)} .lic.no{color:var(--vermilion)} .lic.plain{border-color:var(--rule);color:var(--paper-3)} .btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2); min-height:44px;padding:0 var(--s4);border:1px solid var(--rule-2);background:none; color:var(--paper);font-size:var(--fs-13);transition:var(--t)} .btn:hover{border-color:var(--vermilion);color:var(--vermilion)} .btn.primary{background:var(--vermilion);border-color:var(--vermilion);color:#fff} .btn.primary:hover{filter:brightness(1.08);color:#fff} .btn.ghost{border-color:transparent;color:var(--paper-2);padding:0 var(--s3)} .btn.ghost:hover{border-color:var(--rule);color:var(--paper)} .btn svg{width:14px;height:14px;fill:currentColor} .sig{display:flex;align-items:flex-end;gap:1px;height:24px} .sig i{flex:1;background:var(--rule-2);transition:background var(--t)} .tile:hover .sig i{background:var(--vermilion)} footer{margin-top:var(--s6);border-top:1px solid var(--rule); padding:var(--s4) 0 calc(var(--s4) + var(--sa-b))} .fnote{margin-top:var(--s6);padding-top:var(--s4);border-top:1px solid var(--rule); font-size:var(--fs-11);color:var(--paper-3);line-height:1.9} .fbar{display:flex;align-items:center;gap:var(--s2) var(--s4);flex-wrap:wrap; font-size:var(--fs-12);color:var(--paper-3)} .fbar b{font-family:var(--serif);font-size:var(--fs-13);color:var(--paper);font-weight:600} .fnav{display:flex;gap:var(--s3) var(--s4);flex-wrap:wrap} .fnav a{font-size:var(--fs-12);color:var(--paper-2);border-bottom:0} .fnav a:hover{color:var(--vermilion)} .flic{margin-left:auto;font-family:var(--mono);font-size:var(--fs-11);color:var(--paper-3)} .fnote{margin-top:var(--s3);padding-top:var(--s3);border-top:1px solid var(--rule); display:flex;gap:var(--s2) var(--s5);flex-wrap:wrap;justify-content:space-between; font-family:var(--mono);font-size:var(--fs-11);color:var(--paper-3)} .fnote a{color:var(--paper-3);border-bottom:0} .fnote a:hover{color:var(--vermilion)} .pkgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(268px,1fr));gap:var(--s3)} .pkg{border:1px solid var(--rule);background:var(--ink-2);padding:var(--s4); display:flex;flex-direction:column;gap:var(--s2)} .pkg:hover{border-color:var(--rule-2)} .pkg .pn{font-family:var(--serif);font-size:var(--fs-16)} .pkg .pm{font-family:var(--mono);font-size:var(--fs-11);color:var(--paper-3)} .pkg .pd{font-size:var(--fs-12);color:var(--paper-2);line-height:1.7;flex:1} .pkg .dlbtn{align-self:flex-start;min-height:34px;padding:0 var(--s3);background:var(--vermilion); color:#fff;display:inline-flex;align-items:center;gap:var(--s2);font-size:var(--fs-12);border:0} .pkg .dlbtn:hover{filter:brightness(1.08);color:#fff} .pkg .dlbtn svg{width:13px;height:13px;fill:currentColor} .steps{counter-reset:s;list-style:none} .steps li{counter-increment:s;position:relative;padding-left:var(--s6);margin-bottom:var(--s3); font-size:var(--fs-13);color:var(--paper-2)} .steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:.1em; font-family:var(--mono);font-size:var(--fs-11);color:var(--vermilion)} .note{font-size:var(--fs-12);color:var(--paper-3);border-left:2px solid var(--vermilion); padding-left:var(--s3);margin:var(--s3) 0} main.doc.wide{max-width:var(--wrap)} main.doc{width:100%;max-width:var(--wrap);margin:0 auto;padding:var(--s5) var(--gutter) var(--s6)} main.doc h2{margin-top:var(--s4)} main.doc h3{margin-top:var(--s3)} main.doc ul,main.doc ol{margin:var(--s2) 0 var(--s3) var(--s5);color:var(--paper-2)} main.doc li{margin-bottom:var(--s2)} @media(max-width:640px){ .hbar{height:52px;gap:var(--s3)} .nav{gap:var(--s3);font-size:var(--fs-12)} .hbar > .brand{min-height:44px} .hbar .kb-lang,.hbar .iconbtn{min-width:44px;min-height:44px} .hbar .kb-lang{display:inline-flex;align-items:center;justify-content:center} h1{font-size:var(--fs-26)} .pkgs{grid-template-columns:1fr} table{font-size:var(--fs-12)} th,td{padding:var(--s2)} } .morebtn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2); min-height:44px;padding:var(--s2) var(--s5);border:1px solid var(--rule-2); background:none;color:var(--paper);font-size:var(--fs-13);transition:var(--t); max-width:100%;white-space:normal;text-align:center;line-height:1.4} .morebtn:hover{border-color:var(--vermilion);color:var(--vermilion)} @media(max-width:640px){.morebtn{width:100%}} .morewrap{display:flex;justify-content:center;margin:var(--s5) 0}
.kb-switch{ display:flex; flex-wrap:wrap; gap:2px 4px; align-items:center; margin:0; padding:0; list-style:none; min-width:0; } .kb-switch a{ display:inline-block; padding:.28em .52em; font-size:var(--fs-12); line-height:1.35; border-radius:2px; text-decoration:none; white-space:nowrap; opacity:.62; transition:opacity .15s, background-color .15s; } .kb-switch a:hover{ opacity:1; background:color-mix(in srgb, currentColor 12%, transparent) } .kb-switch a[aria-current="page"]{ opacity:1; font-weight:500; box-shadow:inset 0 -2px 0 var(--accent, currentColor); } .kb-switch .kb-switch-sep{ opacity:.22; padding:0 .15em; user-select:none } @media (max-width:1023px){ .kb-switch{ flex:1 1 100%; order:9; padding-top:var(--s1) } .kb-lang{ margin-left:auto } } @media (max-width:640px){ .kb-switch{ gap:1px 2px } .kb-switch a{ font-size:var(--fs-11); padding:.24em .38em; letter-spacing:0 } .kb-switch .kb-switch-sep{ padding:0 .05em } } .kb-suffix{ opacity:.6; font-weight:400 } .kb-suffix::before{ content:"·"; margin:0 .38em; opacity:.5 } :root{ --jf-1:#FF7C9E; --jf-2:#FF8B6E; --jf-3:#FFAE55; --jf-4:#FFD24E; --jf-dome:#FF8B6E } :root[data-site="home"]{ --jf-1:light-dark(#F34875,#FF7C9E); --jf-2:light-dark(#F1522B,#FF8B6E); --jf-3:light-dark(#CD710D,#FFAE55); --jf-4:light-dark(#AB830B,#FFD24E); --jf-dome:light-dark(#F1522B,#FF8B6E) } :root[data-site="hist"]{ --jf-1:light-dark(#B87D0C,#FFC24E); --jf-2:light-dark(#A2861C,#EBCB4E); --jf-3:light-dark(#7C912B,#BBD754); --jf-4:light-dark(#58982D,#8FD95E); --jf-dome:light-dark(#A2861C,#EBCB4E) } :root[data-site="theo"]{ --jf-1:light-dark(#494AF3,#8B8CFF); --jf-2:light-dark(#2B8CE3,#6FB6F5); --jf-3:light-dark(#2B8CE3,#6FB6F5); --jf-4:light-dark(#494AF3,#8B8CFF); --jf-dome:light-dark(#496FF3,#7E9BFF) } :root[data-site="inst"]{ --jf-1:light-dark(#69962B,#A6DB5E); --jf-2:light-dark(#319C4F,#6BD98A); --jf-3:light-dark(#29997D,#46D9B4); --jf-4:light-dark(#2996A0,#4CD0DC); --jf-dome:light-dark(#319C4F,#6BD98A) } :root[data-site="prod"]{ --jf-1:light-dark(#2A9A73,#4ED9A8); --jf-2:light-dark(#2796A6,#4CCDE0); --jf-3:light-dark(#338CE0,#5AA8F0); --jf-4:light-dark(#4960F3,#7A8CFF); --jf-dome:light-dark(#2796A6,#4CCDE0) } :root[data-site="gloss"]{ --jf-1:light-dark(#7E55E7,#9D7BF5); --jf-2:light-dark(#A05CE0,#B579EE); --jf-3:light-dark(#B762DB,#C778E8); --jf-4:light-dark(#D05AC8,#E074D8); --jf-dome:light-dark(#B762DB,#C778E8) } :root[data-site="ai"]{ --jf-1:light-dark(#DF51B5,#EE6FC8); --jf-2:light-dark(#F34489,#FF6FA8); --jf-3:light-dark(#F34949,#FF7C7C); --jf-4:light-dark(#DB680E,#FFA45C); --jf-dome:light-dark(#F34489,#FF6FA8) } :root[data-site="lib"], :root[data-site="mid"], :root[data-site="zip"], :root[data-site="sf"]{ --jf-1:light-dark(#748AAE,#7C93B8); --jf-2:light-dark(#748AAE,#7C93B8); --jf-3:light-dark(#748AAE,#7C93B8); --jf-4:light-dark(#748AAE,#7C93B8); --jf-dome:light-dark(#748AAE,#7C93B8) } :root[data-site]{ --accent:var(--jf-dome) } .kb-crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:.3em; font-size:var(--fs-12); opacity:.7; margin:0 0 1.1rem; } .kb-crumbs a{ text-decoration:none; opacity:.85 } .kb-crumbs a:hover{ opacity:1; text-decoration:underline } .kb-crumbs .sep{ opacity:.35 } @media (min-width:1920px){ :root{ --wrap:min(92vw,1840px) } } @media (min-width:2560px){ :root{ --wrap:min(88vw,2120px) } } @supports (padding: max(0px)){ .hbar{ padding-top:var(--sa-t); padding-left:max(var(--gutter), var(--sa-l)); padding-right:max(var(--gutter), var(--sa-r)); } main.doc{ padding-left:max(var(--gutter), var(--sa-l)); padding-right:max(var(--gutter), var(--sa-r)); } .footwrap{ padding-left:max(var(--gutter), var(--sa-l)); padding-right:max(var(--gutter), var(--sa-r)); padding-bottom:calc(var(--s4) + var(--sa-b) + env(safe-area-inset-bottom, 0px)); } } header{ transition:transform .22s ease } header.is-hidden{ transform:translateY(-100%) } @media (min-width:1024px){ header.is-hidden{ transform:none } } @media (prefers-reduced-motion:reduce){ header{ transition:none } } a,button,summary,[role="button"]{ -webkit-tap-highlight-color:transparent; touch-action:manipulation; } .kb-switch a:active{ opacity:1; background:color-mix(in srgb, currentColor 18%, transparent) } .kb-lang:active{ border-color:var(--accent); opacity:1 } summary:active{ opacity:.75 } footer.foot{ padding:0 } .footwrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:var(--s4) var(--gutter) calc(var(--s4) + var(--sa-b)); } .footline{ display:flex; flex-wrap:wrap; align-items:center; padding-bottom:var(--s3); margin-bottom:var(--s3); border-bottom:1px solid var(--rule); } .footnote{ margin:0; font-size:var(--fs-12); line-height:1.9; color:var(--paper-3); max-width:96ch; } .footnote a{ color:var(--paper-2); border-bottom:1px solid var(--rule-2) } .footnote a:hover{ color:var(--accent) } .footmeta{ margin:var(--s3) 0 0; display:flex; flex-wrap:wrap; align-items:baseline; gap:.2em var(--s3); font-size:var(--fs-11); color:var(--paper-3); } .footlinks{ display:inline-flex; flex-wrap:wrap; gap:.2em var(--s3) } .footlinks a{ color:var(--paper-3); border-bottom:0 } .footlinks a:hover{ color:var(--accent) } .footcore{ font-family:var(--mono); opacity:.72; } .footcore::before{ content:"·"; margin-right:.45em; opacity:.6 } .kb-toc{ font-size:var(--fs-13); border-left:1px solid var(--rule); padding-left:.85rem; } .kb-toc a{ display:block; padding:.18em 0; text-decoration:none; opacity:.7 } .kb-toc a:hover{ opacity:1 } :root[data-theme=light] .kb-toc{ border-left-color:var(--rule) } .kb-tabs{ display:none } @media (max-width:640px){ :root{ --tabs-h:calc(56px + var(--sa-b)) } .kb-switch{ display:none } .kb-tabs{ display:grid; grid-template-columns:repeat(8,1fr); gap:1px; position:fixed; left:0; right:0; bottom:0; z-index:var(--z-hdr); padding:6px 2px calc(6px + var(--sa-b)); background:var(--ink-2); border-top:1px solid var(--rule); } .kb-tabs > a, .kb-tabs summary{ display:grid; place-items:center; gap:1px; min-height:var(--tap); border-radius:var(--r-1); font-size:9.5px; line-height:1.1; text-decoration:none; color:var(--paper-2); background:none; border:0; cursor:pointer; font-family:inherit; letter-spacing:0; padding:3px 0; } .kb-tabs > a svg{width:16px;height:16px;display:block;flex:none} .kb-tabs > a:hover, .kb-tabs summary:hover{ color:var(--paper) } .kb-tabs > a[aria-current="page"]{ color:var(--accent); font-weight:650 } .kb-tabs-more{ position:relative } .kb-tabs-more[open] > summary{ background:color-mix(in srgb,currentColor 12%,transparent); color:var(--paper) } .kb-tabs-sheet{ position:absolute; bottom:calc(100% + var(--s2)); left:0; right:0; background:var(--ink-2); border:1px solid var(--rule); border-radius:var(--r-2); padding:var(--s2); display:grid; grid-template-columns:1fr 1fr; gap:2px; max-height:min(56vh,420px); overflow:auto; box-shadow:0 -12px 32px -18px rgba(0,0,0,.6); } .kb-tabs-sheet a{ display:grid; place-items:center; min-height:var(--tap); border-radius:var(--r-1); font-size:var(--fs-12); color:var(--paper-2); text-decoration:none; } .kb-tabs-sheet a:hover{ background:color-mix(in srgb,currentColor 12%,transparent); color:var(--paper) } .kb-tabs-sheet a[aria-current="page"]{ color:var(--accent); font-weight:650 } main{ padding-bottom:calc(var(--s6) + var(--tabs-h)) } } @media (prefers-reduced-motion:reduce){ .kb-tabs, .kb-tabs-sheet{ transition:none } }
html[data-design=v6]{ --ink:light-dark(#FFF5E4,#1B1317); --ink-2:light-dark(#FFFCF4,#261A1F); --ink-3:light-dark(#FFE9C9,#33222A); --ink-4:light-dark(#FFF9EE,#2B1D23); --paper:light-dark(#241B17,#FFF3E6); --paper-2:light-dark(#5C4B3F,#C6B3A6); --paper-3:light-dark(#6F5B4A,#A9958A); --rule:light-dark(#D8C7AE,#4A383F); --rule-2:light-dark(#C3AE90,#5C454D); --v6-line:light-dark(#241B17,#FFF3E6); --v6-accent:var(--jf-1,var(--vermilion)); --v6-accent-2:var(--jf-3,var(--gold)); --v6-display:"Smiley Sans","Songti SC",serif; --v6-r:20px; --v6-shadow:0 5px 0 light-dark(rgba(36,27,23,.88),rgba(0,0,0,.62)); --v6-shadow-sm:0 3px 0 light-dark(rgba(36,27,23,.88),rgba(0,0,0,.62)); color-scheme:light dark; } html[data-design=v6] body{ background-color:var(--ink); background-image: radial-gradient(color-mix(in srgb,var(--v6-line) 7%,transparent) 1px,transparent 1.2px), radial-gradient(50% 36% at 86% 4%,color-mix(in srgb,var(--v6-accent) 10%,transparent),transparent 70%), radial-gradient(42% 34% at 4% 96%,color-mix(in srgb,var(--v6-accent-2) 9%,transparent),transparent 70%); background-size:24px 24px,auto,auto; } html[data-design=v6] body > header{border-bottom:2px solid var(--v6-line);background:color-mix(in srgb,var(--ink) 92%,transparent)} html[data-design=v6] .brand b{font-family:var(--v6-display);font-size:22px;letter-spacing:.01em} html[data-design=v6] .brand i{font-size:10.5px} html[data-design=v6] .kb-switch a{border-radius:999px;padding:.32em .55em;opacity:.72} html[data-design=v6] .kb-switch a:hover{background:color-mix(in srgb,var(--v6-line) 10%,transparent);opacity:1} html[data-design=v6] .kb-switch a[aria-current=page]{opacity:1;box-shadow:inset 0 -3px 0 var(--v6-accent)} html[data-design=v6] .kb-lang{border:2px solid var(--v6-line);border-radius:999px;padding:5px 10px;font-weight:700;line-height:1.2} html[data-design=v6] .kb-lang:hover{border-bottom-color:var(--v6-line);background:var(--ink-3);color:var(--paper)} html[data-design=v6] .doc-index{padding-top:clamp(28px,4vw,56px)} html[data-design=v6] .v6-hero{ display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,48px); align-items:center;position:relative;margin-bottom:clamp(28px,4vw,52px); } html[data-design=v6] .v6-eyebrow{ display:inline-flex;align-items:center;gap:6px;background:var(--ink-3);color:var(--paper); border:2px solid var(--v6-line);border-radius:999px;padding:4px 10px; font-family:var(--mono);font-size:10.5px;letter-spacing:.1em; } html[data-design=v6] .doc-index h1{ font-family:var(--v6-display);font-size:clamp(48px,7vw,82px);line-height:.98; letter-spacing:-.03em;margin:14px 0 14px;font-weight:400; } html[data-design=v6] .v6-actions{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap} html[data-design=v6] .v6-btn{ display:inline-flex;align-items:center;gap:7px;padding:11px 18px;border-radius:999px; border:2px solid var(--v6-line);background:var(--ink-2);color:var(--paper); font-size:13px;font-weight:700;box-shadow:var(--v6-shadow-sm); transition:transform .14s,box-shadow .14s,background .14s; } html[data-design=v6] .v6-btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 light-dark(rgba(36,27,23,.88),rgba(0,0,0,.62));color:var(--paper)} html[data-design=v6] .v6-btn.primary{background:var(--v6-accent);color:#1B1317;border-color:var(--v6-line)} html[data-design=v6] .v6-hero-art{position:relative;display:grid;place-items:center;min-height:250px} html[data-design=v6] .v6-jf{ width:clamp(160px,17vw,230px);height:auto; filter:drop-shadow(0 18px 24px color-mix(in srgb,var(--v6-accent) 30%,transparent)); } html[data-design=v6] .v6-bubble{ position:absolute;right:0;top:4%;background:var(--ink-2);border:2px solid var(--v6-line); border-radius:18px;border-bottom-left-radius:5px;padding:8px 12px;font-size:12px; font-weight:700;box-shadow:var(--v6-shadow-sm);transform:rotate(2deg); } html[data-design=v6] .v6-hero-art::before, html[data-design=v6] .v6-hero-art::after{ content:"";position:absolute;border-radius:50%;pointer-events:none; background:color-mix(in srgb,var(--v6-accent) 18%,transparent);filter:blur(1px); } html[data-design=v6] .v6-hero-art::before{width:90px;height:90px;left:4%;top:10%} html[data-design=v6] .v6-hero-art::after{width:54px;height:54px;right:10%;bottom:8%;background:color-mix(in srgb,var(--v6-accent-2) 22%,transparent)} @media (prefers-reduced-motion:no-preference){ html[data-design=v6] .v6-jf{animation:v6-float 6s ease-in-out infinite} @keyframes v6-float{0%,100%{transform:translateY(-4px)}50%{transform:translateY(6px)}} } html[data-design=v6] .kb-ph{font-family:var(--v6-display);font-size:clamp(22px,3vw,30px);letter-spacing:-.01em;margin-top:var(--s5)} html[data-design=v6] .kb-ph::after{content:"";display:block;width:84px;height:7px;margin-top:6px;border-radius:99px;background:var(--v6-accent-2)} html[data-design=v6] .kb-cats{grid-template-columns:repeat(4,1fr);gap:12px} html[data-design=v6] .kb-pcard{ position:relative;display:block;overflow:hidden;background:var(--ink-2); border:2px solid var(--v6-line);border-radius:var(--v6-r);padding:13px 13px 11px; box-shadow:var(--v6-shadow);transition:transform .15s,box-shadow .15s; } html[data-design=v6] .kb-pcard::after{ content:"";position:absolute;right:-20px;bottom:-26px;width:70px;height:70px;border-radius:50%; background:color-mix(in srgb,var(--pc,var(--v6-accent)) 20%,transparent);pointer-events:none; } html[data-design=v6] .kb-pcard:hover{transform:translateY(-3px);box-shadow:0 8px 0 light-dark(rgba(36,27,23,.88),rgba(0,0,0,.62))} html[data-design=v6] .kb-pico{ display:grid;place-items:center;width:30px;height:30px;border-radius:50%; background:var(--pc,var(--v6-accent));color:#1B1317;border:2px solid var(--v6-line); font-weight:800;font-size:13px;margin-bottom:8px;line-height:1; } html[data-design=v6] .kb-pname{font-family:var(--v6-display);font-size:16px;display:flex;align-items:center;gap:8px} html[data-design=v6] .kb-pname i{display:none} html[data-design=v6] .kb-pdesc{display:block;margin-top:6px;font-size:12px;line-height:1.65;color:var(--paper-2)} html[data-design=v6] .kb-cat{ margin-top:var(--s6);background:var(--ink-2);border:2px solid var(--v6-line); border-radius:var(--v6-r);padding:var(--s4);box-shadow:var(--v6-shadow); } html[data-design=v6] .kb-cat h2{font-family:var(--v6-display);font-size:22px} html[data-design=v6] .kb-list li{border-bottom:1px dashed var(--rule)} html[data-design=v6] .kb-t{font-weight:700} html[data-design=v6] .doc-article h1{ font-family:var(--v6-display);font-size:clamp(38px,5vw,58px);line-height:1.02; letter-spacing:-.02em;font-weight:400; } html[data-design=v6] .kb-lead{font-size:15px} html[data-design=v6] .kb-chip{ border:2px solid var(--v6-line);border-radius:999px;background:var(--ink-2); padding:4px 10px;box-shadow:var(--v6-shadow-sm);font-size:12px; } html[data-design=v6] .kb-tablewrap{ border:2px solid var(--v6-line);border-radius:var(--v6-r);overflow:hidden; background:var(--ink-2);box-shadow:var(--v6-shadow); } html[data-design=v6] .kb-tablewrap thead th{background:var(--ink-3);font-family:var(--mono);font-size:11px;letter-spacing:.04em} html[data-design=v6] .kb-tablewrap td{border-bottom:1px dashed var(--rule)} html[data-design=v6] .kb-tablewrap tbody tr:hover{background:var(--ink-3)} html[data-design=v6] .kb-item{ border:2px solid var(--v6-line);border-radius:14px;background:var(--ink-2); box-shadow:var(--v6-shadow-sm);padding:10px 12px; } html[data-design=v6] .kb-play{ background:var(--v6-accent);color:#1B1317;border:2px solid var(--v6-line); box-shadow:var(--v6-shadow-sm); } html[data-design=v6] .kb-play:hover{filter:brightness(1.04)} html[data-design=v6] .kb-why{ border-left:5px solid var(--v6-accent);background:var(--ink-3); border-radius:0 12px 12px 0;padding:10px 12px; } html[data-design=v6] .kb-note{border-left-color:var(--v6-accent)} html[data-design=v6] .kb-title{font-weight:700} html[data-design=v6] .pbar{ border-top:2px solid var(--v6-line);background:var(--ink-2); box-shadow:0 -14px 34px -26px color-mix(in srgb,var(--v6-accent) 55%,transparent); } html[data-design=v6] .kb-tabs{background:var(--ink-2);border-top:2px solid var(--v6-line)} html[data-design=v6] .kb-tabs > a[aria-current=page]{color:var(--paper);font-weight:700;box-shadow:inset 0 3px 0 var(--v6-accent)} html[data-design=v6] .kb-tabs-sheet{background:var(--ink-2);border:2px solid var(--v6-line);border-radius:16px} @media (max-width:900px){ html[data-design=v6] .kb-cats{grid-template-columns:repeat(2,1fr)} } @media (max-width:640px){ html[data-design=v6] .v6-hero{grid-template-columns:1fr;gap:10px} html[data-design=v6] .v6-hero-art{min-height:180px;order:-1} html[data-design=v6] .v6-jf{width:150px} html[data-design=v6] .v6-bubble{right:6%;top:0} html[data-design=v6] .doc-index h1{font-size:clamp(42px,13vw,58px)} html[data-design=v6] .kb-cats{grid-template-columns:1fr} html[data-design=v6] .kb-cat{padding:var(--s3)} html[data-design=v6] .doc-article h1{font-size:clamp(36px,10vw,46px)} html[data-design=v6] .kb-chip{font-size:11.5px} } html[data-design=v6] .doc-index .v3-hero h1{ font-family:var(--serif); font-size:clamp(26px, 3.4vw, 36px); line-height:1.18; letter-spacing:0; margin:.5rem 0 .7rem } html[data-design=v6]{ --ink:light-dark(#FCFBF7,#111319); --ink-2:light-dark(#FFFFFF,#171A22); --ink-3:light-dark(#F1F3F8,#1D212B); --ink-4:light-dark(#E7EAF2,#242935); --paper:light-dark(#12141A,#F2F3F7); --paper-2:light-dark(#4A505F,#B9BECE); --paper-3:light-dark(#6B7286,#8A90A0); --rule:light-dark(#E4E6EC,#262B37); --rule-2:light-dark(#EFF1F6,#1B1F29); --accent:light-dark(#1F4BFF,#6E8BFF); --accent-h:light-dark(#173BD6,#8AA1FF); --accent-soft:light-dark(#EAF0FF,#1C2540); --jade:light-dark(#0E8C7E,#6FF2D6); --gold:light-dark(#97C93D,#C8F169); --r-1:10px; --r-2:14px; --r-3:18px; --nc:var(--accent); } html[data-design=v6] body > header{ background:color-mix(in srgb, var(--ink) 86%, transparent); backdrop-filter:saturate(1.3) blur(12px); border-bottom:1px solid var(--rule) } html[data-design=v6] .hbar{ height:60px } html[data-design=v6] .brand b{ font-family:var(--v6-display); font-size:21px; font-weight:400; letter-spacing:-.01em } html[data-design=v6] .brand i{ color:var(--paper-3); font-size:10.5px; letter-spacing:.08em } html[data-design=v6] .brand svg{ width:24px; height:24px } html[data-design=v6] .kb-switch{ display:flex; align-items:center; gap:2px; margin-left:auto; padding:4px; border-radius:999px; background:var(--ink-3) } html[data-design=v6] .kb-switch a{ padding:6px 10px; border-radius:999px; font-size:12.5px; line-height:1; color:var(--paper-2); font-weight:500 } html[data-design=v6] .kb-switch a:hover{ background:var(--ink-2); color:var(--paper) } html[data-design=v6] .kb-switch a[aria-current="page"]{ background:var(--accent); color:#fff; font-weight:650 } html[data-design=v6] .kb-switch-sep{ display:none } html[data-design=v6] .iconbtn{ width:36px; height:36px; border-radius:10px; border:1px solid var(--rule); background:var(--ink-2); color:var(--paper-2) } html[data-design=v6] .iconbtn:hover{ border-color:var(--accent); color:var(--accent) } html[data-design=v6] .v6-btn{ min-height:42px; padding:0 18px; border-radius:12px; font-size:14px; font-weight:550; border:1px solid var(--rule); background:var(--ink-2); color:var(--paper); box-shadow:none; transform:none } html[data-design=v6] .v6-btn:hover{ border-color:var(--accent); color:var(--accent); background:var(--ink-2) } html[data-design=v6] .v6-btn.primary{ background:var(--accent); border-color:var(--accent); color:#fff; font-weight:650 } html[data-design=v6] .v6-btn.primary:hover{ background:var(--accent-h); border-color:var(--accent-h); color:#fff } html[data-design=v6] .v3-hero h1, html[data-design=v6] .doc-index .v3-hero h1{ font-family:var(--v6-display); font-weight:400; letter-spacing:-.012em; font-size:clamp(34px, 4.4vw, 48px); line-height:1.08; max-width:20ch } html[data-design=v6] .v3-eyebrow{ color:var(--accent); letter-spacing:.14em } html[data-design=v6] .v3-hero .v3-lead{ color:var(--paper-2); font-size:16px } html[data-design=v6] .v3-card, html[data-design=v6] .v3-libcard{ background:var(--ink-2); border:1px solid var(--rule); border-radius:14px; box-shadow:none; transform:none } html[data-design=v6] .v3-card:hover, html[data-design=v6] .v3-libcard:hover{ border-color:var(--accent); transform:translateY(-2px); box-shadow:0 10px 28px color-mix(in srgb, var(--accent) 10%, transparent) } html[data-design=v6] .v3-card .v3-ico{ width:36px; height:36px; border:0; border-radius:10px; background:var(--accent-soft); color:var(--accent); font-family:var(--sans); font-weight:700 } html[data-design=v6] .v3-card:nth-child(3n+2) .v3-ico{ background:color-mix(in srgb, var(--gold) 22%, var(--ink-2)); color:var(--jade) } html[data-design=v6] .v3-card:nth-child(3n) .v3-ico{ background:color-mix(in srgb, #E4572E 12%, var(--ink-2)); color:#C4432B } html[data-design=v6] .v3-card em, html[data-design=v6] .v3-step span, html[data-design=v6] .v3-libcard span{ color:var(--paper-2) } html[data-design=v6] .v3-card .v3-go{ color:var(--accent); font-weight:600 } html[data-design=v6] .v3-step{ background:var(--ink-2); border:1px solid var(--rule); border-radius:12px; box-shadow:none } html[data-design=v6] .v3-step .v3-num{ color:var(--accent); font-family:var(--v6-display) } html[data-design=v6] .v3-chip{ border:1px solid var(--rule); border-radius:999px; background:var(--ink-3); color:var(--paper-2); padding:.55rem .9rem } html[data-design=v6] .v3-chip:hover{ border-color:var(--accent); color:var(--accent); background:var(--ink-2) } html[data-design=v6] .v3-quiz-cta a{ border:1px solid var(--rule); border-radius:14px; background:var(--accent-soft) } html[data-design=v6] .v3-quiz-cta a:hover{ border-color:var(--accent) } html[data-design=v6] .v3-libcard .v3-num{ font-family:var(--v6-display); color:var(--paper) } html[data-design=v6] .kb-head h1, html[data-design=v6] .doc-article h1{ font-family:var(--v6-display); font-weight:400; letter-spacing:-.01em; line-height:1.1 } html[data-design=v6] .kb-lead{ color:var(--paper-2) } html[data-design=v6] .kb-dossier{ background:var(--ink-3); border:1px solid var(--rule); border-radius:12px; padding:14px 16px } html[data-design=v6] .kb-dossier h2{ color:var(--paper-3); letter-spacing:.12em } html[data-design=v6] .kb-dossier dt{ color:var(--paper-3) } html[data-design=v6] .kb-dossier dd{ color:var(--paper) } html[data-design=v6] .kb-chip{ border:1px solid var(--rule); border-radius:999px; background:var(--ink-3); color:var(--paper-2) } html[data-design=v6] .kb-chip:hover{ border-color:var(--accent); color:var(--accent) } html[data-design=v6] .kb-play, html[data-design=v6] .player .play{ background:var(--paper); color:var(--ink) } html[data-design=v6] .kb-sources{ border-top:1px solid var(--rule) } html[data-design=v6] .kb-pcard{ background:var(--ink-2); border:1px solid var(--rule); border-radius:14px; box-shadow:none } html[data-design=v6] .kb-pcard:hover{ border-color:var(--accent); background:var(--ink-2) } html[data-design=v6] .kb-pico{ background:var(--accent-soft); color:var(--accent) } html[data-design=v6] body > footer.foot{ margin-top:var(--s7); background:var(--ink-3); border-top:1px solid var(--rule); padding:22px 0 calc(22px + var(--sa-b)); color:var(--paper-2) } html[data-design=v6] .foot .footline a{ color:var(--paper-2); font-size:12.5px } html[data-design=v6] .foot .footline a:hover{ color:var(--accent) } html[data-design=v6] .foot .fnote, html[data-design=v6] .fnote{ color:var(--paper-3); font-size:11.5px; line-height:1.85 } html[data-design=v6] .fbar b{ font-family:var(--v6-display); font-weight:400 } @media (prefers-reduced-motion:reduce){ html[data-design=v6] .v3-card:hover, html[data-design=v6] .v3-libcard:hover{ transform:none } } html[data-design=v6] .kb-lang{ height:36px; padding:0 10px; border:1px solid var(--rule); border-radius:10px; background:var(--ink-2); color:var(--paper-2); display:inline-flex; align-items:center } @media (max-width:1180px){ html[data-design=v6] .hbar .kb-switch{ display:none } } html[data-design=v6] .hbar{ gap:10px } html[data-design=v6] .hbar .kb-switch{ display:flex; align-items:center; gap:6px; margin-left:auto; padding:0; background:none } html[data-design=v6] .hbar .kb-navbtn{ display:inline-flex; align-items:center; gap:6px; height:36px; padding:0 12px; border:1px solid var(--rule); border-radius:10px; background:var(--ink-2); color:var(--paper-2); font-size:12.5px; font-weight:550; text-decoration:none; transition:transform .15s ease, border-color .15s ease, background .15s ease } html[data-design=v6] .hbar .kb-navbtn svg{ width:15px; height:15px; fill:currentColor; color:var(--nc) } html[data-design=v6] .hbar .kb-navbtn:hover{ transform:translateY(-1px); border-color:var(--nc); color:var(--paper); background:color-mix(in srgb, var(--nc) 9%, var(--ink-2)) } html[data-design=v6] .hbar .kb-navbtn[aria-current="page"]{ background:var(--nc); border-color:var(--nc); color:#fff } html[data-design=v6] .hbar .kb-navbtn[aria-current="page"] svg{ color:#fff } html[data-design=v6] .navmenu-btn{ display:none; align-items:center; gap:6px; height:36px; padding:0 12px; border:1px solid var(--rule); border-radius:10px; background:var(--ink-2); color:var(--paper-2); font:inherit; font-size:12.5px; cursor:pointer } html[data-design=v6] .navmenu-btn svg{ width:16px; height:16px; fill:currentColor } html[data-design=v6] .navmenu-panel{ position:absolute; left:var(--gutter); right:var(--gutter); top:calc(100% - 4px); z-index:calc(var(--z-hdr) + 1); padding:10px; border:1px solid var(--rule); border-radius:14px; background:var(--ink-2); box-shadow:0 18px 44px rgba(10,15,30,.18); display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:6px } html[data-design=v6] .navmenu-panel[hidden]{ display:none } html[data-design=v6] .navmenu-panel a{ display:flex; align-items:center; gap:8px; min-height:42px; padding:0 10px; border-radius:10px; color:var(--paper-2); text-decoration:none; font-size:13px } html[data-design=v6] .navmenu-panel a svg{ width:16px; height:16px; fill:currentColor; color:var(--nc) } html[data-design=v6] .navmenu-panel a:hover{ background:var(--ink-3); color:var(--paper) } html[data-design=v6] .navmenu-panel a[aria-current="page"]{ background:color-mix(in srgb, var(--nc) 14%, var(--ink-2)); color:var(--paper); font-weight:650 } @media (min-width:1181px){ html[data-design=v6] .navmenu-btn, html[data-design=v6] .navmenu-panel{ display:none } } @media (max-width:640px){ html[data-design=v6] .kb-tabs{ grid-template-columns:repeat(8, 1fr); gap:1px; padding:6px 4px calc(6px + var(--sa-b)); background:color-mix(in srgb, var(--ink-2) 92%, transparent); backdrop-filter:saturate(1.2) blur(12px); border-top:1px solid var(--rule) } html[data-design=v6] .kb-tabs > a, html[data-design=v6] .kb-tabs > details > summary{ display:grid; place-items:center; gap:2px; font-size:9.5px; font-weight:550; color:var(--paper-3); border-radius:12px; padding:4px 0 } html[data-design=v6] .kb-tabs > a svg, html[data-design=v6] .kb-tabs > details > summary svg{ width:18px; height:18px; fill:currentColor; color:var(--nc) } html[data-design=v6] .kb-tabs > a[aria-current="page"]{ color:var(--nc); background:color-mix(in srgb, var(--nc) 14%, transparent) } html[data-design=v6] .kb-tabs > details > summary{ cursor:pointer; list-style:none } html[data-design=v6] .kb-tabs > details > summary::-webkit-details-marker{ display:none } html[data-design=v6] .kb-tabs-sheet{ grid-template-columns:1fr 1fr; gap:4px; padding:8px; border-radius:14px } html[data-design=v6] .kb-sheet-a{ display:flex; align-items:center; gap:8px; justify-content:flex-start; padding:0 10px; border-radius:10px; font-size:13px; color:var(--paper-2) } html[data-design=v6] .kb-sheet-a svg{ width:17px; height:17px; fill:currentColor; color:var(--nc) } html[data-design=v6] .kb-sheet-a[aria-current="page"]{ background:color-mix(in srgb, var(--nc) 14%, transparent); color:var(--paper); font-weight:650 } } html[data-design=v6] .kb-tabs svg, html[data-design=v6] .kb-tabs svg use, html[data-design=v6] .kb-tabicons { fill:currentColor } html[data-design=v6] footer .kb-navbtn{ display:inline; padding:0; border:0; background:none; box-shadow:none; color:var(--paper-2); font-size:12.5px; border-radius:0 } html[data-design=v6] footer .kb-navbtn svg{ display:none } html[data-design=v6] footer .kb-navbtn:hover{ color:var(--accent); background:none; transform:none } html[data-design=v6] footer .kb-navbtn[aria-current="page"]{ color:var(--paper); font-weight:650; background:none } html[data-design=v6] .hbar .kb-lang{ display:inline-flex } html[data-design=v6] .kb-lang{ height:34px; min-width:46px; padding:0 12px; border-radius:999px; border:1px solid var(--rule); background:var(--ink-2); color:var(--paper-2); font-family:var(--mono); font-size:12px; font-weight:600; letter-spacing:.06em; display:inline-flex; align-items:center; justify-content:center; text-decoration:none } html[data-design=v6] .kb-lang:hover{ border-color:var(--accent); color:var(--accent); background:color-mix(in srgb, var(--accent) 8%, var(--ink-2)) } html[data-design=v6] .navmenu-btn{ width:36px; padding:0; justify-content:center } html[data-design=v6] .navmenu-btn svg{ width:18px; height:18px } html[data-design=v6] .doc{ padding-top:var(--s4) } html[data-design=v6] .doc-article .kb-crumbs{ margin:0 0 4px; font-size:11.5px; color:var(--paper-3) } html[data-design=v6] .doc-article .kb-head{ margin:0 0 var(--s4) } html[data-design=v6] .doc-article .kb-head h1{ font-size:clamp(25px, 3vw, 33px); line-height:1.2; margin:0 0 6px; letter-spacing:-.012em } html[data-design=v6] .doc-article .kb-lead{ font-size:var(--fs-16); line-height:1.65; margin:0; color:var(--paper-2) } @media (max-width:640px){ html[data-design=v6] .hbar{ height:56px; gap:8px } html[data-design=v6] .brand b{ font-size:19px } html[data-design=v6] .kb-lang{ display:inline-flex; height:34px; min-width:42px; padding:0 9px } html[data-design=v6] .iconbtn{ width:34px; height:34px } html[data-design=v6] .navmenu-btn{ width:34px; height:34px } html[data-design=v6] .doc-article .kb-head h1{ font-size:clamp(24px, 6vw, 30px) } } @media (min-width:1181px){ html[data-design=v6] .navmenu-btn, html[data-design=v6] .navmenu-panel{ display:none } } @media (max-width:1180px){ html[data-design=v6] .hbar .kb-switch{ display:none } html[data-design=v6] .navmenu-btn{ display:inline-flex; align-items:center; justify-content:center } html[data-design=v6] .navmenu-panel{ grid-template-columns:1fr 1fr } } @media (max-width:640px){ html[data-design=v6] .hbar .kb-lang{ display:inline-flex } html[data-design=v6] .hbar{ height:56px; gap:8px } html[data-design=v6] .navmenu-panel{ grid-template-columns:1fr 1fr } }
