*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{font-size:19px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:1.0625rem;color:#eaeaf2;background:#08080f;background-image:radial-gradient(ellipse at 25% -5%, rgba(129,140,248,0.1) 0%, transparent 55%),radial-gradient(ellipse at 75% 105%, rgba(167,139,250,0.07) 0%, transparent 55%),radial-gradient(circle at 50% 50%, rgba(45,212,191,0.03) 0%, transparent 70%);background-attachment:fixed;line-height:1.65;min-height:100vh;overflow-x:hidden}.main{max-width:900px;margin:0 auto;padding:1.5rem 1rem}@media screen and (min-width: 768px){.main{padding:2.5rem 2rem}}#foot{max-width:900px;margin:3rem auto 0;text-align:center;padding:1.5rem 1rem;border-top:1px solid rgba(255,255,255,0.05)}#foot p,#foot a{color:#54546e;font-size:0.78rem}#foot a:hover{color:#818cf8}h1,h2,h3,h4,h5,h6{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:600;color:#eaeaf2;text-align:center;line-height:1.3}h1{font-size:2.2rem;margin-bottom:0.5rem}h2{font-size:1.5rem;margin-bottom:0.5rem}h3{font-size:1.2rem;margin-bottom:0.5rem}a{color:#818cf8;text-decoration:none;transition:color 0.15s ease}a:visited{color:#a78bfa}a:hover{color:#bbc1fb}a:focus{outline:2px solid #818cf8;outline-offset:2px;border-radius:2px}p{line-height:1.8;margin-bottom:1rem}code{font-family:'SF Mono', 'Fira Code', 'Cascadia Code', monospace;background:rgba(255,255,255,0.06);padding:0.15em 0.45em;border-radius:5px;font-size:0.88em;color:#2dd4bf}hr{border:none;border-top:1px solid rgba(255,255,255,0.07);margin:1.5rem 0}.search-hero{text-align:center;padding:2.5rem 0 1.5rem;position:relative}@media screen and (min-width: 768px){.search-hero{padding:4rem 0 2rem}}.hero-glow{position:absolute;top:-60px;left:50%;transform:translateX(-50%);width:400px;height:200px;background:radial-gradient(ellipse, rgba(129,140,248,0.15) 0%, transparent 70%);pointer-events:none;z-index:-1}.site-title{font-size:3rem;font-weight:800;letter-spacing:-0.03em;margin-bottom:0.5rem}@media screen and (min-width: 768px){.site-title{font-size:3.8rem}}.title-accent{background:linear-gradient(135deg, #818cf8, #a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 20px rgba(129,140,248,0.3))}.title-secondary{color:#54546e;font-weight:300}.site-subtitle{color:#8e8ea8;font-size:0.95rem;margin-bottom:1rem}.hero-stats{display:flex;justify-content:center;align-items:center;gap:0.6rem;flex-wrap:wrap}.stat{font-size:0.8rem;color:#54546e}.stat-num{color:#818cf8;font-weight:700;font-variant-numeric:tabular-nums}.stat-sep{color:rgba(255,255,255,0.1)}#search-container{max-width:640px;margin:0 auto 2rem}#search-box{margin:0;text-align:center}.search-input-wrapper{position:relative;display:flex;align-items:center;background:rgba(255,255,255,0.04);border:1.5px solid rgba(255,255,255,0.08);border-radius:24px;padding:0.3rem 0.75rem;transition:all 0.25s ease;backdrop-filter:blur(16px)}.search-input-wrapper:focus-within{border-color:rgba(129,140,248,0.6);box-shadow:0 0 30px rgba(129,140,248,0.2),inset 0 0 0 1px rgba(129,140,248,0.1);background:rgba(255,255,255,0.06)}.search-icon{flex-shrink:0;color:#54546e;margin:0 0.4rem;transition:color 0.15s ease}.search-input-wrapper:focus-within .search-icon{color:#818cf8}#search-query{flex:1;background:transparent;border:none;outline:none;color:#eaeaf2;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:1.1rem;padding:0.8rem 0.3rem;min-width:0}#search-query::placeholder{color:#54546e;font-size:0.95rem}#search-query::-webkit-search-cancel-button{display:none}#search-clear{flex-shrink:0;background:none;border:none;color:#54546e;cursor:pointer;padding:0.5rem;font-size:0.85rem;border-radius:50%;transition:all 0.15s ease;line-height:1}#search-clear:hover{color:#eaeaf2;background:rgba(255,255,255,0.08)}#search-button{display:none}.search-shortcut{flex-shrink:0;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:0.68rem;padding:0.15rem 0.5rem;background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:5px;color:#54546e;margin-left:0.25rem;pointer-events:none}.filter-bar{display:flex;justify-content:center;gap:0.5rem;margin-top:1rem;flex-wrap:wrap}.filter-chip{font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:0.88rem;padding:0.45rem 0.95rem;border-radius:999px;border:1px solid rgba(255,255,255,0.08);background:transparent;color:#8e8ea8;cursor:pointer;transition:all 0.15s ease;user-select:none;display:flex;align-items:center;gap:0.35rem}.filter-chip svg{opacity:0.5;transition:opacity 0.15s ease}.filter-chip:hover{border-color:rgba(129,140,248,0.35);color:#eaeaf2;background:rgba(129,140,248,0.06)}.filter-chip:hover svg{opacity:0.8}.filter-chip.active{background:rgba(129,140,248,0.12);border-color:rgba(129,140,248,0.5);color:#818cf8;font-weight:500}.filter-chip.active svg{opacity:1}#result-count{text-align:center;color:#8e8ea8;font-size:0.8rem;margin-top:1rem;min-height:1.2rem}#result-count .count-number{color:#818cf8;font-weight:700}#search-results{margin-top:0.75rem}.entries{display:flex;flex-direction:column;gap:0.4rem}.result-card{display:flex;align-items:center;gap:1rem;padding:0.9rem 1.2rem;background:linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);border:1px solid rgba(255,255,255,0.05);border-radius:12px;text-decoration:none;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);cursor:pointer;position:relative;overflow:hidden}.result-card::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(135deg, #818cf8, #a78bfa);opacity:0;transition:opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.result-card:visited{color:#eaeaf2}.result-card:hover,.result-card.selected{background:rgba(255,255,255,0.07);border-color:rgba(129,140,248,0.25);transform:translateX(3px);box-shadow:0 4px 20px rgba(0,0,0,0.5)}.result-card:hover::before,.result-card.selected::before{opacity:1}.result-card:hover .result-kanji,.result-card.selected .result-kanji{text-shadow:0 0 20px rgba(129,140,248,0.3)}.result-card.selected{border-color:rgba(129,140,248,0.5)}.result-kanji{font-family:"Noto Sans JP","Hiragino Kaku Gothic Pro","メイリオ",sans-serif;font-size:2.4rem;font-weight:400;color:#fff;min-width:3.5rem;text-align:center;line-height:1;flex-shrink:0;transition:text-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.result-info{flex:1;min-width:0}.result-header{display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap}.result-keyword{font-size:1.1rem;font-weight:500;color:#eaeaf2}.result-keyword mark{background:rgba(129,140,248,0.25);color:#d8dbfd;padding:0.05em 0.2em;border-radius:3px}.result-frame{font-size:0.82rem;color:#54546e;font-family:'SF Mono', 'Fira Code', monospace;background:rgba(255,255,255,0.04);padding:0.1rem 0.4rem;border-radius:4px}.match-badge{font-size:0.62rem;padding:0.1rem 0.45rem;border-radius:999px;font-weight:600;text-transform:uppercase;letter-spacing:0.04em}.badge-hanviet{background:rgba(251,191,36,0.12);color:#fbbf24}.badge-frame{background:rgba(45,212,191,0.12);color:#2dd4bf}.badge-kanji{background:rgba(251,113,133,0.12);color:#fb7185}.badge-elements{background:rgba(52,211,153,0.12);color:#34d399}.result-hanviet{font-size:0.92rem;color:#fbbf24;margin-top:0.2rem}.result-hanviet mark{background:rgba(251,191,36,0.2);color:#fcd160;padding:0.05em 0.15em;border-radius:3px}.result-readings{display:flex;gap:0.75rem;margin-top:0.25rem;flex-wrap:wrap}.reading{font-size:0.85rem;color:#8e8ea8;font-family:"Noto Sans JP","Hiragino Kaku Gothic Pro","メイリオ",sans-serif}.on-yomi{color:#2dd4bf;opacity:0.75}.kun-yomi{color:#a78bfa;opacity:0.75}.result-elements{font-size:0.85rem;color:#54546e;margin-top:0.15rem;font-style:italic}.no-results{text-align:center;padding:3rem 1rem}.no-results-icon{font-size:2.5rem;margin-bottom:0.75rem;opacity:0.4}.no-results-text{font-size:1.05rem;color:#8e8ea8;margin-bottom:0.5rem}.no-results-hint{font-size:0.8rem;color:#54546e;max-width:400px;margin:0 auto;line-height:1.5}.nav-section{display:flex;flex-direction:column;gap:0.75rem;max-width:540px;margin:2.5rem auto 0}.nav-card{display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;background:linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);border:1px solid rgba(255,255,255,0.06);border-radius:16px;text-decoration:none;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;overflow:hidden}.nav-card::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg, transparent 70%, rgba(129,140,248,0.04) 100%);opacity:0;transition:opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.nav-card:visited{color:#eaeaf2}.nav-card:hover{background:rgba(255,255,255,0.07);border-color:rgba(129,140,248,0.2);transform:translateY(-2px);box-shadow:0 4px 20px rgba(0,0,0,0.5)}.nav-card:hover::after{opacity:1}.nav-card:hover .nav-card-icon-wrap{border-color:rgba(129,140,248,0.4);box-shadow:0 0 16px rgba(129,140,248,0.15)}.nav-card:hover .nav-card-arrow{color:#818cf8;transform:translateX(3px)}.nav-card-icon-wrap{width:52px;height:52px;border-radius:12px;border:1px solid rgba(255,255,255,0.08);background:rgba(255,255,255,0.03);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1)}.nav-card-icon{font-family:"Noto Sans JP","Hiragino Kaku Gothic Pro","メイリオ",sans-serif;font-size:1.6rem;color:#fff;line-height:1}.nav-card-body{flex:1;display:flex;flex-direction:column;gap:0.15rem;position:relative;z-index:1}.nav-card-label{font-size:0.95rem;font-weight:600;color:#eaeaf2}.nav-card-count{font-size:0.78rem;color:#54546e}.nav-card-arrow{color:#54546e;flex-shrink:0;transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position:relative;z-index:1}.btn{display:inline-flex;align-items:center;justify-content:center;padding:0.5rem 1.25rem;margin-bottom:0.75rem;font-size:0.85rem;font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#eaeaf2;background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);border-radius:8px;text-decoration:none;transition:all 0.15s ease;cursor:pointer;min-height:40px}.btn:visited{color:#eaeaf2}.btn:hover{background:rgba(255,255,255,0.07);border-color:#818cf8;color:#818cf8}.btn-blue{border-color:rgba(129,140,248,0.2)}.btn-blue:visited{color:#eaeaf2}.btn-blue:hover{background:rgba(129,140,248,0.12);border-color:#818cf8;color:#818cf8}.pagination{margin:2rem auto 0;text-align:center;display:flex;justify-content:center;gap:0.5rem;flex-wrap:wrap}.kanji-detail-header{margin-bottom:1rem}#kanjiViewer{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:290px;margin:1.5rem 0;padding:1rem;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);border-radius:16px}#draw{display:flex;justify-content:center}#sample-btn{display:flex;justify-content:center;gap:0.4rem;margin-top:0.75rem}#sample-btn button{background:rgba(255,255,255,0.035);border:1px solid rgba(255,255,255,0.08);color:#8e8ea8;padding:0.45rem 0.9rem;border-radius:8px;cursor:pointer;transition:all 0.15s ease;font-size:1rem;min-width:42px}#sample-btn button:hover{background:rgba(255,255,255,0.07);color:#818cf8;border-color:#818cf8}.left-arrow{float:left}.right-arrow{float:right}li{line-height:1.8;margin-bottom:0.5rem}blockquote{padding-left:1.25rem;font-style:italic;border-left:3px solid rgba(129,140,248,0.35);color:#8e8ea8}table{margin:1rem auto;border-collapse:collapse}th,td{padding:0.5rem 1rem;border-bottom:1px solid rgba(255,255,255,0.05)}th{color:#8e8ea8;font-weight:500;text-align:left}small{font-size:75%;color:#54546e}article{list-style:none}.stroke{float:left;width:100%;overflow-x:auto;overflow-y:hidden;margin:2rem 0}.footnotes{border-top:1px solid rgba(255,255,255,0.06);font-size:0.75rem;margin-top:2rem;padding-top:1rem}@keyframes fadeInUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}.search-hero{animation:fadeInUp 0.5s ease both}#search-container{animation:fadeInUp 0.5s ease 0.1s both}.nav-section{animation:fadeInUp 0.5s ease 0.2s both}.result-card{animation:fadeInUp 0.2s ease both}.entries .result-card:nth-child(1){animation-delay:.025s}.entries .result-card:nth-child(2){animation-delay:.05s}.entries .result-card:nth-child(3){animation-delay:.075s}.entries .result-card:nth-child(4){animation-delay:.1s}.entries .result-card:nth-child(5){animation-delay:.125s}.entries .result-card:nth-child(6){animation-delay:.15s}.entries .result-card:nth-child(7){animation-delay:.175s}.entries .result-card:nth-child(8){animation-delay:.2s}.entries .result-card:nth-child(9){animation-delay:.225s}.entries .result-card:nth-child(10){animation-delay:.25s}.entries .result-card:nth-child(11){animation-delay:.275s}.entries .result-card:nth-child(12){animation-delay:.3s}.entries .result-card:nth-child(13){animation-delay:.325s}.entries .result-card:nth-child(14){animation-delay:.35s}.entries .result-card:nth-child(15){animation-delay:.375s}.entries .result-card:nth-child(16){animation-delay:.4s}.entries .result-card:nth-child(17){animation-delay:.425s}.entries .result-card:nth-child(18){animation-delay:.45s}.entries .result-card:nth-child(19){animation-delay:.475s}.entries .result-card:nth-child(20){animation-delay:.5s}.entries .result-card:nth-child(21){animation-delay:.525s}.entries .result-card:nth-child(22){animation-delay:.55s}.entries .result-card:nth-child(23){animation-delay:.575s}.entries .result-card:nth-child(24){animation-delay:.6s}.entries .result-card:nth-child(25){animation-delay:.625s}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.18)}::selection{background:rgba(129,140,248,0.3);color:#eaeaf2}@media screen and (max-width: 480px){.site-title{font-size:2.4rem}.result-kanji{font-size:2rem;min-width:2.8rem}.result-card{padding:0.75rem 0.9rem;gap:0.75rem}.nav-card{padding:1rem 1.2rem}.nav-card-icon-wrap{width:44px;height:44px}.nav-card-icon{font-size:1.3rem}}