:root{--paper:#efe4d0;--paper-2:#fbf6ec;--ink:#221c16;--ink-soft:#6d6256;--cinnabar:#a33b2b;--line:#ddcfb8;--line-strong:#c9b89a;color:var(--ink);background:radial-gradient(900px 420px at 50% -80px, #fffcf5e6, transparent 70%), var(--paper);font-synthesis:none;text-rendering:optimizelegibility;font-family:Songti SC,STSong,Songti TC,Noto Serif CJK SC,Source Han Serif SC,PMingLiU,serif}*{box-sizing:border-box}body{min-height:100vh;margin:0}button,input,select{font:inherit;color:inherit}button{cursor:pointer}a{color:var(--cinnabar)}.shell{width:min(1120px,100% - 32px);padding-bottom:calc(40px + env(safe-area-inset-bottom));margin:0 auto}.site-header{z-index:40;border-bottom:1px solid var(--ink);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#efe4d0f5;justify-content:space-between;align-items:center;gap:16px;height:64px;margin-bottom:16px;padding:0;display:flex;position:sticky;top:0}.brand{color:inherit;align-items:center;gap:12px;text-decoration:none;display:flex}.seal{background:var(--cinnabar);color:#f8f1e6;place-items:center;width:40px;height:40px;font-size:24px;line-height:1;display:grid}.brand-text{flex-direction:column;line-height:1.15;display:flex}.brand-text strong{letter-spacing:.08em;font-size:22px;font-weight:600}.brand-text em{color:var(--ink-soft);letter-spacing:.42em;font-size:13px;font-style:normal}nav{gap:18px;display:flex}nav a{color:var(--ink);letter-spacing:.18em;border-bottom:1px solid #0000;padding-bottom:4px;text-decoration:none}nav a.active{color:var(--cinnabar);border-bottom-color:var(--cinnabar)}.page-head h1,.column-head h2,.detail h2,.detail h3{margin:0;font-weight:600}.page-head h1{letter-spacing:.12em;font-size:32px}.page-head p{color:var(--ink-soft);margin:8px 0 0}.filters{border:1px solid var(--line);background:#fffbf4b8;grid-template-columns:repeat(auto-fit,minmax(148px,1fr));align-items:end;gap:12px;margin-top:22px;padding:14px;display:grid}.filters.compact{grid-template-columns:1fr 1fr;margin-top:0}.filters label{flex-direction:column;gap:6px;min-width:0;display:flex}.filters label span,.search-label,.kicker{letter-spacing:.16em;color:var(--ink-soft);font-size:13px}input,select{background:var(--paper-2);border:1px solid var(--line-strong);border-radius:0;width:100%;padding:8px 10px}.text-btn{color:var(--cinnabar);letter-spacing:.12em;background:0 0;border:0;padding:8px 0}.count{color:var(--ink-soft);margin:12px 0}.dict-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:18px;display:grid}.list-scroll,.grid-scroll{background:var(--paper-2);border:1px solid var(--line);overscroll-behavior:contain;height:min(680px,100vh - 280px);min-height:360px;overflow:auto}.list-inner,.grid-inner{width:100%;position:relative}.row{text-align:left;border:0;border-bottom:1px solid var(--line);background:0 0;grid-template-columns:132px minmax(0,1fr);align-items:center;gap:8px;width:100%;height:104px;padding:8px 12px;display:grid;position:absolute;top:0;left:0}.row.on{box-shadow:inset 3px 0 0 var(--cinnabar);background:#f6e6e1}.row-char{flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:0;font-size:28px;line-height:1.1;display:flex}.row-py{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--ink-soft);font-size:13px;line-height:1.2;overflow:hidden}.row.on .row-py{color:var(--cinnabar)}.row-body{flex-direction:column;gap:4px;min-width:0;display:flex}.row-meta{color:var(--ink-soft);gap:12px;font-size:14px;display:flex}.excerpt{color:var(--ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:15px;line-height:1.45;display:-webkit-box;overflow:hidden}.detail{background:var(--paper-2);border:1px solid var(--line);max-height:min(680px,100vh - 280px);padding:18px 18px 22px;position:sticky;top:76px;overflow:auto}.detail h2{font-size:42px;line-height:1.2}.detail h3{letter-spacing:.14em;margin:16px 0 8px;font-size:16px}.detail dl{grid-template-columns:1fr 1fr;gap:10px 14px;margin:16px 0 0;display:grid}.detail dt{color:var(--ink-soft);letter-spacing:.12em;font-size:13px}.detail dd{margin:2px 0 0}.definition{text-align:justify;margin:0;line-height:1.9}.quiet{color:var(--ink-soft)}.pane-empty{padding:24px 16px}.char-label{flex-wrap:wrap;align-items:baseline;gap:.05em;display:inline-flex}.simp{color:var(--ink-soft);letter-spacing:0;font-size:.46em}.codepoint{letter-spacing:.02em;color:var(--cinnabar);font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:.42em}.name-stage{z-index:30;text-align:center;border:1px solid var(--line);background:#f7f1e4;padding:16px 16px 12px;position:sticky;top:64px;box-shadow:0 10px 18px #50371e0f}.kicker{margin:0}.name-main{justify-content:center;align-items:flex-start;gap:.28em;margin:8px 0 0;font-size:56px;line-height:1.15;display:flex}.name-char{flex-direction:column;align-items:center;display:inline-flex}.name-element{letter-spacing:.24em;margin-top:2px;font-size:14px;font-weight:600;line-height:1.2}.name-element.element-金{color:#8d6a2f}.name-element.element-木{color:#3f6b45}.name-element.element-水{color:#2c5f73}.name-element.element-火{color:var(--cinnabar)}.name-element.element-土{color:#8d6234}.name-main .char-label,.name-main .blank,.name-sub .char-label,.name-sub .blank{margin:0 .08em}.blank{color:#c4b49a}.name-sub{color:var(--ink);margin:10px 0 0;font-size:22px}.name-sub>span{color:var(--ink-soft);letter-spacing:.16em;margin-right:10px;font-size:13px}.name-controls{border:1px solid var(--line);background:#fffbf48c;flex-wrap:wrap;align-items:end;gap:18px 22px;margin:18px 0;padding:14px;display:flex}.control,.search{flex-direction:column;gap:6px;min-width:180px;display:flex;position:relative}.picked{align-items:center;gap:10px;font-size:28px;line-height:1;display:flex}.segment{border:1px solid var(--line-strong);background:var(--paper-2);display:inline-flex}.segment button{letter-spacing:.08em;background:0 0;border:0;padding:8px 14px}.segment button.on{background:var(--cinnabar);color:#fffaf3}.search-list{z-index:5;background:var(--paper-2);border:1px solid var(--line-strong);max-height:280px;margin:0;padding:4px 0;list-style:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow:auto;box-shadow:0 10px 24px #3c281414}.search-list button{text-align:left;background:0 0;border:0;justify-content:space-between;align-items:baseline;gap:8px;width:100%;padding:8px 10px;display:flex}.search-list button span:last-child{color:var(--ink-soft);font-size:13px}.search-list li.quiet{padding:8px 10px}.name-columns{gap:16px;display:grid}.column{border:1px solid var(--line);background:#fffbf473;min-width:0;padding:14px}.column-head{justify-content:space-between;align-items:baseline;margin-bottom:12px;display:flex}.column-head h2{letter-spacing:.12em;font-size:20px}.column-head p{color:var(--ink-soft);margin:0}.column .grid-scroll{height:420px;min-height:280px;margin-top:12px}.preset-tray{border:1px dashed var(--line-strong);background:#fffbf4b3;margin-top:12px;padding:10px 12px 12px}.preset-tray>header{justify-content:space-between;align-items:baseline;margin-bottom:8px;display:flex}.preset-tray h3{letter-spacing:.18em;margin:0;font-size:16px;font-weight:600}.preset-tray header p,.preset-tray .quiet{margin:0;font-size:13px}.preset-tray .quiet+.preset-list{margin-top:8px}.preset-list{flex-wrap:wrap;gap:6px;max-height:168px;display:flex;overflow:auto}.preset-chip{background:#f6efe2;border:1px solid #c4a574;flex-direction:column;justify-content:center;align-items:center;gap:2px;width:76px;min-height:64px;padding:4px;display:flex}.preset-chip .char-label{justify-content:center;font-size:22px}.preset-chip.on{border-color:var(--cinnabar);color:var(--cinnabar);background:#f6e6e1}.preset-chip.on .cell-py{color:var(--cinnabar)}.element-board{flex-direction:column;gap:12px;margin-top:12px;display:flex}.element-zone{border:1px solid var(--line);background:#fffbf4b8}.element-zone>header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:baseline;padding:8px 12px;display:flex}.element-zone h3{letter-spacing:.28em;margin:0;font-size:18px;font-weight:600}.element-zone header p{color:var(--ink-soft);margin:0;font-size:13px}.element-金 h3{color:#8d6a2f}.element-木 h3{color:#3f6b45}.element-水 h3{color:#2c5f73}.element-火 h3{color:var(--cinnabar)}.element-土 h3{color:#8d6234}.column .element-zone .grid-scroll{border:0;height:220px;min-height:160px;margin-top:0}.element-zone .list-scroll{border:0;height:280px;min-height:180px}.element-zone .pane-empty{margin:0}.column .detail{max-height:none;margin-top:12px;position:static}.grid-row{gap:6px;width:100%;height:96px;padding:4px;display:grid;position:absolute;top:0;left:0}.cell{border:1px solid var(--line);background:var(--paper-2);flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:0;padding:4px;display:flex}.cell-py{text-overflow:ellipsis;white-space:nowrap;max-width:100%;color:var(--ink-soft);font-size:12px;line-height:1.2;overflow:hidden}.cell .char-label{white-space:nowrap;justify-content:center;font-size:22px}.cell .simp{font-size:12px}.cell.preset{background:#f6efe2;border-color:#c4a574}.cell.on{border-color:var(--cinnabar);color:var(--cinnabar);background:#f6e6e1}.cell.on .cell-py,.cell.preset.on .cell-py{color:var(--cinnabar)}.cell.preset.on{box-shadow:inset 0 3px #8d6a2f}.cell,.preset-chip{-webkit-user-select:none;user-select:none}button,.cell,.preset-chip,.segment button{touch-action:manipulation}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--cinnabar);outline-offset:2px}.site-footer{border-top:1px solid var(--line);color:var(--ink-soft);margin-top:36px;padding-top:14px;font-size:13px;line-height:1.7}@media (width<=860px){.shell{width:min(1120px,100% - 16px)}.site-header{height:52px;margin-bottom:8px}.seal{width:32px;height:32px;font-size:18px}.brand{gap:8px}.brand-text{flex-direction:row;align-items:baseline;gap:6px}.brand-text strong{letter-spacing:.04em;font-size:17px}.brand-text em{display:none}nav{gap:12px}nav a{letter-spacing:.08em;padding:8px 2px}.page-head h1{font-size:26px}.page-head p{font-size:14px;line-height:1.6}.filters{grid-template-columns:1fr 1fr;gap:10px;padding:10px}input,select{min-height:44px;font-size:16px}.dict-layout{grid-template-columns:1fr}.detail{max-height:none;position:static}.detail h2{font-size:34px}.list-scroll{height:min(520px,62dvh);min-height:280px}.row{grid-template-columns:96px minmax(0,1fr);height:96px;padding:6px 8px}.row-char{font-size:24px}.excerpt{-webkit-line-clamp:1;font-size:14px}.name-stage{margin-bottom:10px;padding:8px;top:52px}.name-main{gap:.16em;font-size:34px}.name-element{letter-spacing:.12em;font-size:12px}.name-sub{margin-top:4px;font-size:16px}.name-controls{grid-template-columns:1fr 1fr;gap:12px;margin:0 0 12px;padding:10px;display:grid}.search,.control{min-width:0}.search{grid-column:1/-1}.segment{width:100%}.segment button{flex:1;min-height:44px;padding:8px 6px}.name-columns{grid-template-columns:1fr!important}.column{padding:10px}.column .grid-scroll{height:min(420px,46dvh);min-height:220px}.column .element-zone .grid-scroll{height:min(240px,36dvh)}.preset-chip{width:84px;min-height:72px}.cell{min-height:84px}.search-list{max-height:42dvh}.site-footer{margin-top:24px;font-size:12px}}
