.top{flex-direction:column;gap:10px;padding-block:32px 24px;display:flex}.crumb{color:var(--muted);font-size:14px}.crumb a{text-decoration:none}.top h1{letter-spacing:-.03em;font-size:clamp(40px,3.8vw,64px)}.lead{color:var(--muted);max-width:36em;font-size:19px}.tool{grid-template-columns:320px minmax(0,1fr) 300px;align-items:start;gap:28px;padding-block-end:64px;display:grid}.form{background:var(--panel);flex-direction:column;gap:16px;padding:24px;display:flex}.form .btn{justify-content:center;gap:10px}.hint{color:var(--muted);margin-top:6px;font-size:14px;line-height:1.4}.error{color:var(--alert);font-size:16px}.error:empty{display:none}.result{flex-direction:column;gap:10px;min-width:0;display:flex}.you{letter-spacing:-.03em;margin-bottom:14px;font-size:clamp(30px,2.8vw,48px)}.scroll{overflow-x:auto}.swipe{color:var(--gold);margin:0 0 8px;font-size:14px;display:none}.board{grid-template-rows:repeat(4,minmax(172px,auto));grid-template-columns:repeat(4,minmax(150px,1fr));gap:6px;display:grid}.palace{background:var(--panel);min-width:0;transition:background .35s var(--ease);flex-direction:column;gap:4px;padding:10px 12px;display:flex;position:relative}.palace:hover,.palace.life{background:var(--raise)}.palace.sides{box-shadow:inset 0 0 0 1px #e2c58f73}.pl{margin-top:28px}.pl h3{margin-bottom:6px;font-size:22px}.pl-tag{border-radius:var(--pill);color:var(--gold);vertical-align:middle;background:#e2c58f24;margin-left:8px;padding:1px 8px;font-size:12px;font-weight:400}.pl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px;display:grid}.pl-item{background:var(--panel);padding:14px 16px}.pl-wide{grid-column:1/-1}.pl-item h4{color:var(--gold);margin:0 0 4px;font-size:16px}.pl-item p{margin:0;font-size:15px;line-height:1.65}.pl-item small{color:var(--muted);margin-top:6px;font-size:13px;line-height:1.5;display:block}.panel-plain{font-size:15px;line-height:1.6}@media (width<=760px){.pl-grid{grid-template-columns:minmax(0,1fr)}}.flow{margin-top:28px}.flow h3{margin-bottom:6px;font-size:22px}.flow dl{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:12px 0 0;display:grid}.flow dl div{background:var(--panel);padding:12px 14px}.flow dt{color:var(--muted);font-size:14px}.flow dd{color:var(--gold);margin:2px 0 0;font-size:18px}.palace-head{color:var(--gold);font:16px var(--font-body);cursor:pointer;background:0 0;border:0;justify-content:space-between;gap:6px;padding:0;display:flex}.palace.life .palace-head{color:var(--brand)}.branch{color:var(--muted);font-size:15px}.stars{flex-direction:column;flex:1;align-items:flex-start;gap:1px;display:flex}.star{color:var(--muted);font:15px var(--font-body);cursor:pointer;text-align:left;background:0 0;border:0;align-items:baseline;gap:6px;padding:1px 0;transition:color .15s;display:flex}.star .cjk{font-size:15px}.star.main{color:var(--text)}.star.main .cjk{font-size:19px}.star:hover{color:var(--gold)}.py{color:var(--muted);font-size:13px}.grade{color:var(--gold);font-size:12px}.grade.low{color:var(--muted)}.hua{background:var(--brand);color:var(--on-brand);padding:0 4px;font-size:13px;line-height:1.5}.legend{color:var(--muted);flex-wrap:wrap;gap:4px 16px;margin-top:10px;font-size:14px;display:flex}.legend-title{color:var(--text)}.palace-foot{color:var(--muted);flex-wrap:wrap;gap:2px 8px;font-size:13px;display:flex}.now{color:var(--brand)}.body-palace{color:var(--gold)}.centre{text-align:center;flex-direction:column;grid-area:2/2/4/4;justify-content:center;align-items:center;gap:6px;padding:20px;font-size:16px;display:flex}.ju{color:var(--gold);font-size:clamp(34px,3vw,50px);line-height:1.2}.panel{background:var(--panel);flex-direction:column;gap:10px;padding:24px;display:flex;position:sticky;top:84px}.panel-zh{color:var(--gold);font-size:40px;line-height:1.2}.panel h2{font-size:24px}.panel p{font-size:16px;line-height:1.5}.panel p.panel-sub{color:var(--muted);font-size:16px}.panel p.panel-grade{padding-top:4px;font-size:16px}.panel-grade strong{color:var(--gold);font-weight:500}.panel p.hint{font-size:14px}@media (width<=1500px){.tool{grid-template-columns:300px minmax(0,1fr)}.panel{grid-column:2;position:static}}@media (width<=960px){.tool{grid-template-columns:minmax(0,1fr)}.panel{grid-column:auto}}@media (width<=720px){.swipe{display:block}.board{grid-template-columns:repeat(4,150px);width:max-content}}