.kanji-archive-main{--k-primary:var(--color-primary,       #CB4B40);--k-primary-dark:var(--color-primary-dark,  #B22E28);--k-surface:var(--color-surface,        #ffffff);--k-glass:var(--color-surface-glass,  rgba(255,255,255,0.65));--k-border:var(--glass-border,         rgba(0,0,0,0.06));--k-blur:var(--glass-blur,           blur(20px) saturate(180%));--k-shadow:var(--shadow-card,          0 4px 24px rgba(0,0,0,0.06));--k-text:var(--color-on-surface,     #1a1a2e);--k-muted:var(--color-on-surface-variant, #555566);--k-neutral:var(--color-neutral,        #f5f4f2);--k-radius-sm:var(--rounded-sm,  6px);--k-radius-md:var(--rounded-md,  12px);--k-radius-lg:var(--rounded-lg,  20px);--k-radius-full:var(--rounded-full, 9999px);--k-ease:var(--ease-out,    cubic-bezier(0.16,1,0.3,1));font-family:var(--font-body,system-ui,-apple-system,sans-serif)}.kanji-archive-wrapper{max-width:1200px;margin-inline:auto;padding:clamp(1rem, 4vw, 2.5rem) clamp(1rem, 3vw, 2rem);display:flex;flex-direction:column;gap:2rem}.kanji-archive-header{text-align:center}.kanji-archive-title{font-size:clamp(1.8rem, 4vw, 2.8rem);font-weight:900;color:var(--k-text);margin:0 0 8px;letter-spacing:-.02em}.kanji-archive-desc{color:var(--k-muted);font-size:.9rem;margin:0}.kanji-filters{display:flex;flex-direction:column;gap:1.5rem;align-items:center;background:var(--k-glass);-webkit-backdrop-filter:var(--k-blur);backdrop-filter:var(--k-blur);border:1px solid var(--k-border);border-radius:var(--k-radius-lg);padding:24px;box-shadow:var(--k-shadow);margin-bottom:1rem}.kanji-filter-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}.kanji-filter-group{display:flex;align-items:center;position:relative}.kanji-filter-group--search{width:100%;max-width:600px}.kanji-search-container{position:relative;width:100%}.kanji-filter-input{width:100%;padding:12px 20px;border:1.5px solid var(--k-border);border-radius:var(--k-radius-full);font-family:inherit;font-size:1rem;color:var(--k-text);background:var(--k-surface);transition:border-color 200ms var(--k-ease),box-shadow 200ms var(--k-ease)}.kanji-filter-input:focus{outline:none;border-color:var(--k-primary);box-shadow:0 0 0 4px rgb(203 75 64 / .1)}.kanji-search-suggestions{position:absolute;top:calc(100% + 8px);left:0;right:0;background:var(--k-surface);border:1px solid var(--k-border);border-radius:var(--k-radius-md);box-shadow:0 10px 30px rgb(0 0 0 / .1);z-index:100;max-height:400px;overflow-y:auto;display:none;-webkit-backdrop-filter:var(--k-blur);backdrop-filter:var(--k-blur)}.kanji-suggestion-item{display:flex;align-items:center;gap:12px;padding:10px 16px;text-decoration:none;color:var(--k-text);border-bottom:1px solid var(--k-border);transition:background 200ms}.kanji-suggestion-item:last-child{border-bottom:none}.kanji-suggestion-item:hover{background:rgb(203 75 64 / .05)}.kanji-suggestion-char{font-size:1.4rem;font-weight:700;color:var(--k-primary);min-width:32px}.kanji-suggestion-info{display:flex;flex-direction:column;overflow:hidden}.kanji-suggestion-sig{font-size:.85rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.kanji-suggestion-romaji{font-size:.7rem;color:var(--k-muted)}.kanji-filter-select{padding:10px 16px;border:1.5px solid var(--k-border);border-radius:var(--k-radius-full);font-family:inherit;font-size:.88rem;color:var(--k-text);background:var(--k-surface);cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%23555566'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;transition:border-color 200ms var(--k-ease)}.kanji-filter-select:focus{outline:none;border-color:var(--k-primary)}.kanji-filter-btn{padding:10px 24px;background:var(--k-primary);color:#fff;border:none;border-radius:var(--k-radius-full);font-family:inherit;font-size:.88rem;font-weight:700;cursor:pointer;transition:background 200ms var(--k-ease),transform 200ms var(--k-ease)}.kanji-filter-btn:hover{background:var(--k-primary-dark);transform:translateY(-1px)}.kanji-filter-clear{padding:10px 16px;color:var(--k-muted);font-size:.82rem;font-weight:600;text-decoration:none;border-radius:var(--k-radius-full);transition:color 200ms,background 200ms}.kanji-filter-clear:hover{color:var(--k-primary);background:rgb(203 75 64 / .08)}.kanji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}@media (max-width:480px){.kanji-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:8px}}.kanji-grid-item{aspect-ratio:1}.kanji-grid-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;height:100%;padding:12px 8px;background:var(--k-glass);-webkit-backdrop-filter:var(--k-blur);backdrop-filter:var(--k-blur);border:1px solid var(--k-border);border-radius:var(--k-radius-md);text-decoration:none;color:var(--k-text);box-shadow:var(--k-shadow);transition:transform 200ms var(--k-ease),box-shadow 200ms var(--k-ease),background 200ms var(--k-ease),border-color 200ms var(--k-ease);position:relative;overflow:hidden}.kanji-grid-link::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#fff0 0%,rgb(203 75 64 / .04) 100%);opacity:0;transition:opacity 200ms var(--k-ease)}.kanji-grid-link:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 12px 32px rgb(203 75 64 / .15);border-color:rgb(203 75 64 / .2)}.kanji-grid-link:hover::before{opacity:1}.kanji-grid-link:focus-visible{outline:3px solid var(--k-primary);outline-offset:2px}.kanji-grid-char{font-size:clamp(2rem, 5vw, 2.8rem);font-weight:900;color:var(--k-text);line-height:1;transition:color 200ms var(--k-ease)}.kanji-grid-link:hover .kanji-grid-char{color:var(--k-primary)}.kanji-grid-romaji{font-size:.65rem;font-weight:600;color:var(--k-primary);letter-spacing:.04em;text-align:center;line-height:1.2}.kanji-grid-sig{display:none;font-size:.6rem;color:var(--k-muted);text-align:center;line-height:1.3;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (min-width:900px){.kanji-grid-link:hover .kanji-grid-sig{display:block}}.kanji-grid-badge{position:absolute;top:6px;right:6px;font-size:.58rem;font-weight:700;padding:2px 6px;border-radius:var(--k-radius-full);background:rgb(203 75 64 / .1);color:var(--k-primary);border:1px solid rgb(203 75 64 / .15)}.kanji-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.kanji-page-link{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:var(--k-radius-full);background:var(--k-glass);-webkit-backdrop-filter:var(--k-blur);backdrop-filter:var(--k-blur);border:1px solid var(--k-border);color:var(--k-text);font-weight:700;font-size:.88rem;text-decoration:none;transition:background 200ms var(--k-ease),transform 200ms var(--k-ease)}.kanji-page-link:hover{background:var(--k-primary);color:#fff;border-color:var(--k-primary);transform:translateY(-2px)}.kanji-page-link--active{background:var(--k-primary);color:#fff;border-color:var(--k-primary);box-shadow:0 4px 12px rgb(203 75 64 / .3)}.kanji-empty{text-align:center;padding:4rem 2rem;color:var(--k-muted)}body:has(#dark-toggle:checked) .kanji-archive-main{--k-surface:#1e1e2e;--k-glass:rgba(30,30,46,0.8);--k-border:rgba(255,255,255,0.08);--k-text:#e8e8f0;--k-muted:#9090aa;--k-neutral:#2a2a3e}@media (prefers-reduced-motion:no-preference){.kanji-grid-item{animation:kanjiGridIn 0.4s var(--k-ease) both}.kanji-grid-item:nth-child(1){animation-delay:0.02s}.kanji-grid-item:nth-child(2){animation-delay:0.04s}.kanji-grid-item:nth-child(3){animation-delay:0.06s}.kanji-grid-item:nth-child(4){animation-delay:0.08s}.kanji-grid-item:nth-child(5){animation-delay:0.10s}.kanji-grid-item:nth-child(6){animation-delay:0.12s}.kanji-grid-item:nth-child(7){animation-delay:0.06s}.kanji-grid-item:nth-child(8){animation-delay:0.08s}.kanji-grid-item:nth-child(n+9){animation-delay:0s}@keyframes kanjiGridIn{from{opacity:0;transform:scale(.9) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}}