:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fff;--fg:#111;--inverse:#080808;--soft:#f6f6f6;--muted:#666;--quiet:#999;--line:#11111124;--font-serif:"Songti SC", "STSong", "Noto Serif CJK SC", "Noto Serif CJK TC", "Noto Serif CJK JP", "Noto Serif CJK KR", "SimSun", Georgia, serif;--side:clamp(18px, 5vw, 72px);--content:920px}*{box-sizing:border-box}html{background:var(--bg);color:var(--fg);font-family:var(--font-serif);scroll-behavior:smooth}body{background:var(--bg);min-width:320px;color:var(--fg);font-family:var(--font-serif);letter-spacing:0;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.75}button,a{color:inherit;font:inherit}button{cursor:pointer;background:0 0;border:0}a{text-decoration:none}.site-head{z-index:10;height:64px;padding:0 var(--side);background:color-mix(in srgb, var(--bg) 92%, transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid #11111114;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.site-name,nav a,.label{color:var(--muted);font-size:14px;line-height:1.6}.site-name{max-width:min(44vw,280px);color:var(--fg);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.header-actions{align-items:center;gap:clamp(14px,3vw,36px);min-width:0;display:flex}nav{gap:clamp(18px,3.2vw,46px);display:flex}.language-switcher{border:1px solid var(--line);background:#fff;align-items:center;gap:2px;padding:3px;display:flex}.language-switcher a{min-width:26px;color:var(--muted);text-align:center;padding:2px 6px 3px;font-size:12px;line-height:1.5}.language-switcher a.active{color:#fff;background:var(--inverse)}.reader,.catalog{width:min(calc(100% - var(--side) * 2), var(--content));margin:0 auto;scroll-margin-top:76px}.reader{padding:clamp(44px,8vw,92px) 0 clamp(72px,11vw,128px)}.hexagram-head{border-bottom:1px solid var(--line);grid-template-columns:minmax(0,1fr) 76px auto;align-items:end;gap:18px clamp(24px,5vw,54px);margin-bottom:clamp(22px,4vw,38px);padding:0 0 clamp(28px,5vw,48px);display:grid}.hexagram-head p,.hexagram-head h1,.reading-block h3,.line-list h2,.extra-lines h2{margin:0}.hexagram-head p{color:var(--muted);font-size:14px}.hexagram-head p span{color:var(--quiet)}h1,h2,h3{font-weight:400;line-height:1.45}h1{align-items:baseline;gap:18px;font-size:clamp(32px,5.6vw,64px);display:flex}h1 em{color:var(--muted);font-size:clamp(17px,1.55vw,20px);font-style:normal}h2{font-size:clamp(21px,2.2vw,28px)}h3{color:var(--muted);font-size:15px}.hexagram-actions{color:var(--muted);white-space:nowrap;gap:28px;display:flex}.hexagram-actions a{border-bottom:1px solid var(--line);padding-bottom:5px}.hexagram-mark{gap:7px;width:76px;padding:6px 0;display:grid}.hexagram-mark span{background:var(--fg);height:8px;display:block}.hexagram-mark .yin{background:linear-gradient(to right, var(--fg) 0 42%, transparent 42% 58%, var(--fg) 58% 100%)}.hexagram-meta{color:var(--muted);flex-wrap:wrap;gap:8px 18px;margin-bottom:clamp(34px,5vw,58px);font-size:14px;display:flex}.hexagram-meta span:last-child{color:var(--fg)}.section-list,.line-list,.extra-lines{gap:clamp(20px,3.4vw,34px);display:grid}.line-list,.extra-lines{margin-top:clamp(50px,8vw,86px)}.line-list h2,.extra-lines h2{border-top:1px solid var(--line);padding-top:clamp(26px,5vw,42px)}.reading-block,.line-item{border:1px solid var(--line);background:var(--soft);min-width:0}.reading-block{grid-template-columns:92px minmax(0,1fr);display:grid}.reading-block h3{padding:18px}.reading-block p,.line-item p{min-width:0;color:var(--muted);overflow-wrap:anywhere;word-break:break-word;margin:0;font-size:clamp(15px,1.2vw,17px);line-height:1.9}.reading-block p{background:#fff;border-top:1px solid #11111117;grid-column:2;padding:15px clamp(18px,3vw,28px)}.reading-block h3+p{border-top:0}.reading-block p>span:first-child,.line-item p>span:first-child{min-width:5.5em;color:var(--quiet);font-size:13px;line-height:inherit;padding-right:1.2em;display:inline-block}.original-text{display:inline}.pinyin-char{cursor:help;min-width:0;padding:0 .015em;display:inline-block;position:relative}.pinyin-char:after{z-index:4;background:var(--inverse);color:#fff;content:attr(data-pinyin);opacity:0;pointer-events:none;white-space:nowrap;padding:2px 5px 3px;font-size:11px;line-height:1.2;transition:opacity .14s,transform .14s;position:absolute;bottom:calc(100% + 5px);right:50%;transform:translate(50%,3px)}.pinyin-char:hover:after{opacity:1;transform:translate(50%)}.reading-block .original,.line-item .original{color:var(--fg);font-size:clamp(17px,1.45vw,20px);line-height:1.85}.reading-block .modern,.line-item .modern{color:var(--fg);position:relative}.reading-block .modern:before,.line-item .modern:before{background:var(--inverse);content:"";width:3px;position:absolute;top:15px;bottom:15px;left:0}.line-item{grid-template-columns:54px minmax(0,1fr);gap:clamp(16px,3vw,30px);display:grid}.line-number{color:var(--fg);justify-content:center;align-items:flex-start;padding-top:clamp(18px,3vw,26px);font-size:13px;line-height:1.6;display:flex}.line-body{background:#fff}.line-item p{border-top:1px solid #11111117;padding:15px clamp(18px,3vw,28px)}.line-item .line-position{color:var(--fg);background:#fff;border-top:0;font-size:14px}.line-item .line-image{color:var(--muted)}.catalog{border-top:1px solid var(--line);grid-template-columns:180px minmax(0,1fr);gap:clamp(24px,5vw,64px);padding:clamp(64px,9vw,112px) 0 clamp(84px,11vw,140px);display:grid}.catalog-list{border-top:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.catalog-list a{border-bottom:1px solid var(--line);min-width:0;color:var(--muted);text-align:left;grid-template-columns:38px 34px 52px minmax(0,1fr);align-items:center;gap:clamp(10px,2vw,18px);padding:15px clamp(12px,2vw,18px);transition:background .18s,color .18s;display:grid}.catalog-list a:nth-child(odd){border-right:1px solid var(--line)}.catalog-list a.active,.catalog-list a:hover{color:var(--fg)}.catalog-list a.active .catalog-index{color:#fff;background:var(--inverse)}.catalog-index,.catalog-list em{font-size:14px;font-style:normal}.catalog-index{text-align:center}.catalog-hexagram-mark{gap:3px;width:30px;display:grid}.catalog-hexagram-mark span{background:currentColor;height:3px;display:block}.catalog-hexagram-mark .yin{background:linear-gradient(90deg,currentColor 0 42%,#0000 42% 58%,currentColor 58% 100%)}.catalog-list strong{font-size:16px;font-weight:400}.site-foot{width:min(calc(100% - var(--side) * 2), var(--content));color:var(--quiet);border-top:1px solid #1111111a;justify-content:space-between;align-items:center;gap:24px;margin:0 auto;padding:26px 0 46px;font-size:14px;line-height:1.7;display:flex}.footer-group{align-items:center;gap:10px;min-width:0;display:flex}.site-foot a{color:var(--fg);border-bottom:1px solid var(--line);padding-bottom:3px}.site-foot a:hover{border-color:var(--fg)}@media (width<=820px){.hexagram-head{grid-template-columns:minmax(0,1fr) 70px}.hexagram-actions{grid-column:1/-1;margin-top:4px}.catalog{grid-template-columns:1fr}}@media (width<=760px){.site-head{height:58px}.header-actions{gap:10px}nav{gap:14px}.site-name,nav a{font-size:13px}.language-switcher{gap:0;padding:2px}.language-switcher a{min-width:22px;padding-left:4px;padding-right:4px}.reader{padding-top:38px}.reading-block{grid-template-columns:1fr}.reading-block h3,.reading-block p{grid-column:1}.reading-block h3{border-bottom:1px solid var(--line);padding:12px 18px}.reading-block h3+p{border-top:0}.line-item{grid-template-columns:1fr;gap:0}.line-number{background:var(--soft);border-bottom:1px solid var(--line);justify-content:flex-start;padding:12px 18px}.reading-block p>span:first-child,.line-item p>span:first-child{min-width:0;margin-bottom:2px;padding-right:0;display:block}.catalog-list{grid-template-columns:1fr}.catalog-list a{grid-template-columns:38px 32px 48px minmax(0,1fr)}.catalog-list a:nth-child(odd){border-right:0}.site-foot{flex-direction:column;align-items:flex-start;gap:8px;padding:22px 0 38px}.footer-group{flex-wrap:wrap}}@media (width<=520px){.site-name{max-width:110px}nav{display:none}h1{flex-direction:column;align-items:flex-start;gap:2px}.hexagram-head{grid-template-columns:minmax(0,1fr) 58px}.hexagram-mark{gap:6px;width:58px}.hexagram-mark span{height:7px}}