@font-face{font-family:"Noto Serif Tangut Web";src:url("fonts/NotoSerifTangut.woff2") format("woff2");unicode-range:U+17000-187FF,U+18800-18AFF,U+18D00-18D7F}body{font-family:Arial,"Tangut Yinchuan","Noto Serif Tangut","Tangut GlyphWiki","Noto Serif Tangut Web",sans-serif;color:#222;margin:0}input,textarea,button{font-family:inherit}#app{display:flex;height:100vh}#search-mode{width:25%;overflow-y:auto;padding:2px;box-sizing:border-box}#search-input{flex:1 1 0;min-width:0;box-sizing:border-box;padding:8px;border:1px solid #ccc;border-radius:4px;background-color:white;font-size:16px}#search-row{display:flex;gap:3px}#search-row button{flex:none;width:30px;padding:0;border:1px solid #ccc;border-radius:4px;background-color:#fff;color:#555;font-size:17px;cursor:pointer}#search-row button:hover,#search-row button.pressed{background-color:#dbe8f8}.popup{position:fixed;z-index:1000;box-sizing:border-box;padding:2px;border:1px solid #ccc;border-radius:4px;background:white;box-shadow:0 2px 6px rgba(0,0,0,0.2);overflow-y:auto;scrollbar-width:thin}#help-popup{min-width:min(440px,100vw - 8px);padding:4px 8px;font-size:14px;line-height:1.4}#help-popup ul{margin:0;padding-left:18px}#search-input::placeholder{font-size:13px}#search-input:focus,.shape-input:focus:not(.invalid),.results li:focus,button:focus-visible{outline:2px solid #1a5fb4;outline-offset:-2px}.result-count{margin:4px 5px;color:#555}.results{display:flex;flex-wrap:wrap;gap:2px;margin:0;padding:0 2px;list-style:none}.results li{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid transparent;border-radius:4px;font-size:34px;line-height:1;cursor:pointer;content-visibility:auto;contain-intrinsic-size:44px 44px}.results li:hover{background-color:#f0f0f0}.results li.selected{border-color:#1a5fb4;background-color:#dbe8f8}.results li.lookalike::after{content:"≈";position:absolute;top:0;right:2px;font-size:11px;color:#1a5fb4}.results li.unsure::before{content:"";position:absolute;top:3px;left:3px;width:6px;height:6px;border-radius:50%;background-color:#e0a000}#content-area{flex:1 1 0;min-width:0;display:flex;flex-direction:column;padding:2px;overflow-y:auto;box-sizing:border-box}.button{padding:1px 6px;border:1px solid #ccc;border-radius:4px;background-color:#fff;font-size:12px;cursor:pointer}.button:hover:not(:disabled){background-color:#f0f0f0}#display-mode{position:relative;padding:2px 8px 8px;border:1px solid #e4e4e4;border-radius:6px;background-color:#fff}#item-header{display:flex;flex-wrap:wrap;align-items:flex-start;gap:12px 20px;margin:6px 0 14px}#item-title{display:flex;align-items:center;height:200px;margin:0;font-size:180px;font-weight:normal;line-height:1}.close-button{position:absolute;top:2px;right:2px;font-size:1.2em;cursor:pointer;color:#777;border:none;background:none}.close-button:hover{color:#222}.details{display:grid;grid-template-columns:max-content 1fr;gap:2px 10px;margin:8px 0}.details>div:not([hidden]){display:contents}.details dt{color:#777;font-size:13px}.details dd{margin:0}#shape-display{width:200px;height:200px}#shape-display .shape-template{width:100%;height:100%;box-sizing:border-box;border:0 solid #222;border-width:1px 0 0 1px}#shape-display .shape-cell{container-type:size;box-sizing:border-box;border-width:0 1px 1px 0}#shape-display .shape-input{font-size:min(100cqw,100cqh,120px);line-height:1}.shape-template{display:grid}.shape-cell{display:flex;width:100%;height:100%;border:1px solid #222}.shape-input{box-sizing:border-box;width:100%;min-width:0;height:100%;padding:0;border:none;font:inherit;background-color:#fff;text-align:center}.invalid{background-color:#fde2e2;outline:2px solid #c62828}.shape-palette{display:flex;flex-wrap:wrap;gap:8px 18px}.shape-group{display:flex;gap:3px}.shape-group-label{align-self:center;min-width:0.8em;font-size:18px;font-weight:bold;color:#555}.shape-button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 4px 2px;border:1px solid #ccc;border-radius:4px;background-color:#fff;color:#222;font-size:13px;cursor:pointer}.shape-button:hover{background-color:#f0f0f0}.shape-button[aria-pressed="true"]{border-color:#1a5fb4;background-color:#dbe8f8;color:#1a5fb4;font-weight:bold}.shape-icon{display:grid;flex-shrink:0;width:32px;height:32px;box-sizing:border-box;border:0 solid;border-width:1px 0 0 1px}.shape-icon .shape-cell{box-sizing:border-box;border-width:0 1px 1px 0;border-color:currentColor}.shape-icon.dashed,.shape-icon.dashed .shape-cell{border-style:dashed}#readings{display:flex;flex-direction:column;align-items:flex-start;gap:3px}.reading{display:inline-flex}.reading-button{display:inline-flex;align-items:center;gap:4px;padding:1px 5px;border:1px solid #ccc;border-radius:4px;background-color:#fff;color:#222;font-size:13px;white-space:nowrap;cursor:pointer}.reading-button .shape-icon{width:18px;height:18px}.reading-button:hover{background-color:#f0f0f0}.reading-button[aria-pressed="true"]{border-color:#1a5fb4;background-color:#dbe8f8;color:#1a5fb4}.reading-parts{font-size:18px}.reading.rejected .reading-parts{text-decoration:line-through;color:#777}#start-tips{max-width:720px;padding:4px 12px 24px;line-height:1.4}#start-tips h3{margin:4px 0;font-size:1em}#start-tips ul{margin:4px 0;padding-left:20px}.search-option{display:flex;align-items:baseline;gap:3px;margin:3px 2px;font-size:13px;color:#555;cursor:pointer}dialog{max-width:520px;border:1px solid #ccc;border-radius:4px;box-shadow:0 2px 8px rgba(0,0,0,0.2);line-height:1.4}dialog h2{margin-top:0;font-size:1.2em}dialog form{text-align:right}#about-dialog{max-width:680px;font-size:14px}#about-dialog h3{margin:12px 0 4px;font-size:1em}#about-dialog p,#about-dialog ul{margin:4px 0}#about-dialog ul{padding-left:20px}#about-button,#search-help-link{padding:0;border:none;background:none;color:#1a5fb4;text-decoration:underline;cursor:pointer}
