:root{--cz-primary:#dc2626;--cz-primary-light:#dc262614;--cz-text:#1e293b;--cz-text-muted:#64748b;--cz-text-secondary:#475569;--cz-bg:#fff;--cz-bg-muted:#f1f5f9;--cz-border:#e2e8f0;--cz-radius:12px;--cz-radius-sm:8px;--cz-shadow:0 1px 3px #00000014, 0 1px 2px #0000000a;--cz-compat-excellent:#10b981;--cz-compat-great:#3b82f6;--cz-compat-good:#8b5cf6;--cz-compat-neutral:#f59e0b;--cz-compat-challenging:#ef4444}._cz-container{flex-direction:column;gap:1.25rem;max-width:640px;margin:0 auto;display:flex}._cz-section-divider{background:var(--cz-border);height:1px;margin:.5rem 0}._cz-section{flex-direction:column;gap:1rem;display:flex}._cz-section-heading{color:var(--cz-text);text-align:center;margin:0;font-size:1.125rem;font-weight:700}._cz-section-desc{color:var(--cz-text-muted);text-align:center;margin:-.5rem 0 0;font-size:.8125rem;line-height:1.5}._cz-disclaimer{text-align:center;font-size:var(--main-text-xs);color:var(--cz-text-muted);opacity:.7;margin:0;font-style:italic}@media (max-width:768px){._cz-container{gap:1rem;padding-left:.75rem;padding-right:.75rem}._cz-section{gap:.875rem}._cz-section-heading{font-size:1rem}._cz-section-desc{font-size:.75rem}}@media (max-width:480px){._cz-container{padding-left:.625rem;padding-right:.625rem}}._cz-input-card{background:var(--cz-bg);border-radius:var(--cz-radius);box-shadow:var(--cz-shadow);border-style:solid;border-width:1px;border-color:var(--cz-border);padding:1.5rem}._cz-input-label{color:var(--cz-text);margin-bottom:.75rem;font-size:.875rem;font-weight:600;display:block}._cz-input-row{gap:.5rem;display:flex}._cz-input{border-style:solid;border-width:1.5px;border-color:var(--cz-border);border-radius:var(--cz-radius-sm);color:var(--cz-text);background:var(--cz-bg);outline:none;flex:1;padding:.625rem 1rem;font-size:1rem;transition:border-color .2s,box-shadow .2s}._cz-input:focus{border-color:var(--cz-primary);box-shadow:0 0 0 3px var(--cz-primary-light)}._cz-input._cz-input-error{border-color:var(--cz-compat-challenging);box-shadow:0 0 0 3px #ef44441a}._cz-input::placeholder{color:var(--cz-text-muted)}._cz-btn-primary{background:var(--cz-primary);color:#fff;border-radius:var(--cz-radius-sm);cursor:pointer;white-space:nowrap;border:none;padding:.625rem 1.5rem;font-size:.875rem;font-weight:600;transition:opacity .2s}._cz-btn-primary:hover{opacity:.9}._cz-btn-full{width:100%;margin-top:.75rem}._cz-result-card{background:var(--cz-bg);border-radius:var(--cz-radius);box-shadow:var(--cz-shadow);border-style:solid;border-width:1px;border-color:var(--cz-border);padding:1.5rem}._cz-result-header{flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.25rem;display:flex}._cz-result-icon{object-fit:contain;flex-shrink:0;width:56px;height:56px}._cz-result-name{color:var(--cz-text);margin:0;font-size:1.5rem;font-weight:700}._cz-result-year{color:var(--cz-text-muted);font-size:.875rem;font-weight:500}._cz-result-badges{flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;display:flex}._cz-badge{border-radius:99px;align-items:center;gap:.25rem;padding:.3rem .75rem;font-size:.75rem;font-weight:600;display:inline-flex}._cz-badge-icon{align-items:center;display:inline-flex}._cz-badge-icon svg{fill:currentColor;width:14px;height:14px}._cz-badge-polarity{color:#7c3aed;background:#8b5cf61a}._cz-badge-element{background:var(--cz-bg-muted);color:var(--cz-text-secondary)}._cz-result-section{margin-bottom:1rem}._cz-section-title{color:var(--cz-text-secondary);text-transform:uppercase;letter-spacing:.03em;margin:0 0 .5rem;font-size:.8125rem;font-weight:600}._cz-tags{flex-wrap:wrap;gap:.375rem;display:flex}._cz-tag{border-radius:99px;padding:.25rem .625rem;font-size:.75rem;font-weight:500}._cz-tag-good{color:#059669;background:#10b9811a}._cz-tag-weak{color:#dc2626;background:#ef444414}._cz-lucky-grid{grid-template-columns:repeat(3,1fr);gap:.75rem;display:grid}._cz-lucky-item{background:var(--cz-bg-muted);border-radius:var(--cz-radius-sm);text-align:center;padding:.75rem}._cz-lucky-label{color:var(--cz-text-muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:.25rem;font-size:.6875rem;font-weight:600;display:block}._cz-lucky-value{color:var(--cz-text);font-size:.8125rem;font-weight:600;display:block}._cz-match-animals{flex-wrap:wrap;gap:.5rem;display:flex}._cz-match-item{border-radius:var(--cz-radius-sm);align-items:center;gap:.375rem;padding:.375rem .75rem;font-size:.8125rem;font-weight:500;display:inline-flex}._cz-match-icon{object-fit:contain;width:20px;height:20px}._cz-match-best{color:#059669;background:#10b9811a}._cz-match-good{color:#2563eb;background:#3b82f61a}._cz-match-conflict{color:#dc2626;background:#ef444414}._cz-result-footer{border-top-style:dashed;border-top-width:1px;border-top-color:var(--cz-border);align-items:center;gap:.5rem;margin-top:1rem;padding-top:1rem;display:flex}._cz-footer-label{color:var(--cz-text-muted);font-size:.75rem;font-weight:600}._cz-footer-value{color:var(--cz-text-secondary);font-size:.8125rem}@media (max-width:768px){._cz-input-card,._cz-result-card{padding:1rem}._cz-result-header{gap:.75rem;margin-bottom:1rem}._cz-result-icon{width:48px;height:48px}._cz-result-name{font-size:1.25rem}._cz-result-badges{margin-bottom:1rem}._cz-result-section{margin-bottom:.875rem}._cz-input{padding:.75rem .875rem;font-size:16px}._cz-btn-primary{padding:.75rem 1.25rem}}@media (max-width:480px){._cz-input-card,._cz-result-card{padding:.875rem}._cz-result-name{font-size:1.125rem}._cz-lucky-grid{grid-template-columns:repeat(2,1fr);gap:.5rem}._cz-lucky-item{padding:.625rem .5rem}._cz-result-footer{flex-direction:column;align-items:flex-start;gap:.25rem}}@media (max-width:360px){._cz-input-row{flex-direction:column}._cz-btn-primary{width:100%}}._cz-compat-selects{align-items:center;gap:.75rem;display:flex}._cz-select{border-style:solid;border-width:1.5px;border-color:var(--cz-border);border-radius:var(--cz-radius-sm);color:var(--cz-text);background:var(--cz-bg);cursor:pointer;outline:none;flex:1;padding:.625rem 1rem;font-size:.875rem;transition:border-color .2s,box-shadow .2s}._cz-select:focus{border-color:var(--cz-primary);box-shadow:0 0 0 3px var(--cz-primary-light)}._cz-select._cz-input-error{border-color:var(--cz-compat-challenging);box-shadow:0 0 0 3px #ef44441a}._cz-compat-vs{color:var(--cz-text-muted);flex-shrink:0;font-size:1.25rem;font-weight:700}._cz-compat-result-card{background:var(--cz-bg);border-radius:var(--cz-radius);box-shadow:var(--cz-shadow);border-style:solid;border-width:1px;border-color:var(--cz-border);padding:1.5rem}._cz-compat-header{margin-bottom:1.25rem}._cz-compat-pair{flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem;display:flex}._cz-compat-animal{color:var(--cz-text);text-align:center;flex-direction:column;align-items:center;gap:.5rem;min-width:70px;font-size:.9375rem;font-weight:600;display:flex}._cz-compat-icon{object-fit:contain;width:56px;height:56px}._cz-compat-pair ._cz-compat-vs{color:var(--cz-text-muted);font-size:1.5rem;font-weight:700}._cz-compat-score{margin-bottom:1rem}._cz-score-bar{background:var(--cz-bg-muted);border-radius:99px;height:8px;margin-bottom:.5rem;overflow:hidden}._cz-score-fill{border-radius:99px;height:100%;transition:width .6s ease-out}._cz-score-info{justify-content:space-between;align-items:center;display:flex}._cz-score-value{font-size:1.5rem;font-weight:700}._cz-score-label{font-size:.875rem;font-weight:600}._cz-compat-desc{color:var(--cz-text-secondary);background:var(--cz-bg-muted);border-radius:var(--cz-radius-sm);margin:0 0 1.25rem;padding:.75rem 1rem;font-size:.875rem;line-height:1.6}._cz-compat-details{flex-direction:column;gap:.75rem;display:flex}._cz-compat-detail-row{align-items:center;gap:.75rem;display:flex}._cz-detail-label{color:var(--cz-text-secondary);min-width:5rem;font-size:.8125rem;font-weight:600}._cz-detail-bar{background:var(--cz-bg-muted);border-radius:99px;flex:1;height:6px;overflow:hidden}._cz-detail-fill{border-radius:99px;height:100%;transition:width .6s ease-out}._cz-detail-value{color:var(--cz-text-secondary);text-align:right;min-width:2.5rem;font-size:.8125rem;font-weight:600}@media (max-width:768px){._cz-compat-result-card{padding:1rem}._cz-compat-header{margin-bottom:1rem}._cz-score-value{font-size:1.25rem}._cz-compat-desc{margin-bottom:1rem;padding:.625rem .75rem;font-size:.8125rem}._cz-select{padding:.75rem .875rem;font-size:16px}}@media (max-width:480px){._cz-compat-result-card{padding:.875rem}._cz-compat-selects{flex-direction:column;gap:.5rem}._cz-compat-selects ._cz-compat-vs{display:none}._cz-compat-pair{gap:1rem}._cz-compat-icon{width:44px;height:44px}._cz-compat-animal{font-size:.875rem}._cz-detail-label{min-width:4rem;font-size:.75rem}._cz-detail-value{min-width:2.25rem;font-size:.75rem}._cz-compat-detail-row{gap:.5rem}}._cz-animal-card[data-element=water]{--el-color:#3b82f6;--el-bg:#3b82f614;--el-glow:#3b82f640;--el-ring:#3b82f61f}._cz-animal-card[data-element=wood]{--el-color:#22c55e;--el-bg:#22c55e14;--el-glow:#22c55e40;--el-ring:#22c55e1f}._cz-animal-card[data-element=fire]{--el-color:#ef4444;--el-bg:#ef444414;--el-glow:#ef444440;--el-ring:#ef44441f}._cz-animal-card[data-element=earth]{--el-color:#d97706;--el-bg:#d9770614;--el-glow:#d9770640;--el-ring:#d977061f}._cz-animal-card[data-element=metal]{--el-color:#6366f1;--el-bg:#6366f114;--el-glow:#6366f140;--el-ring:#6366f11f}._cz-all-grid{grid-template-columns:repeat(4,1fr);gap:.875rem;display:grid}._cz-animal-card{background:var(--cz-bg);border-style:solid;border-width:1.5px;border-color:var(--cz-border);cursor:pointer;border-radius:16px;flex-direction:column;align-items:center;gap:.5rem;padding:1.25rem .5rem 1rem;transition:border-color .25s,box-shadow .25s,background .25s;display:flex;position:relative}._cz-animal-card:hover{border-color:var(--el-color);box-shadow:0 4px 16px var(--el-glow), 0 0 0 1px var(--el-ring);background:var(--el-bg)}._cz-animal-card.active{border-color:var(--el-color);box-shadow:0 4px 20px var(--el-glow), 0 0 0 2px var(--el-ring);background:var(--el-bg)}._cz-animal-ring{background:var(--el-bg);border-style:solid;border-width:2px;border-color:var(--el-ring);border-radius:50%;justify-content:center;align-items:center;width:68px;height:68px;transition:border-color .25s,box-shadow .25s;display:flex}._cz-animal-card:hover ._cz-animal-ring{border-color:var(--el-color);box-shadow:0 0 12px var(--el-glow)}._cz-animal-card.active ._cz-animal-ring{border-color:var(--el-color);box-shadow:0 0 16px var(--el-glow)}._cz-animal-icon{object-fit:contain;width:52px;height:52px}._cz-animal-name{color:var(--cz-text);letter-spacing:.01em;font-size:.8125rem;font-weight:700}._cz-animal-year{color:var(--el-color);background:var(--el-bg);border-radius:99px;padding:.125rem .5rem;font-size:.6875rem;font-weight:600}._cz-animal-card._cz-current-year{border-color:var(--el-color);background:var(--el-bg);box-shadow:0 2px 12px var(--el-glow)}._cz-animal-card._cz-current-year ._cz-animal-ring{border-color:var(--el-color);box-shadow:0 0 0 3px var(--el-ring), 0 0 14px var(--el-glow)}._cz-animal-card._cz-current-year ._cz-animal-name{color:var(--el-color)}._cz-current-badge{color:#fff;background:var(--el-color);box-shadow:0 2px 6px var(--el-glow);letter-spacing:.02em;border-radius:99px;padding:.125rem .5rem;font-size:.625rem;font-weight:700;line-height:1.4;position:absolute;top:-.5rem;right:-.25rem}._cz-all-detail{background:var(--cz-bg);border-radius:var(--cz-radius);box-shadow:var(--cz-shadow);border-style:solid;border-width:1px;border-color:var(--cz-border);padding:1.5rem}._cz-detail-header{flex-wrap:wrap;align-items:center;gap:1rem;margin-bottom:1.25rem;display:flex}._cz-detail-icon{object-fit:contain;flex-shrink:0;width:48px;height:48px}._cz-detail-name{color:var(--cz-text);margin:0;font-size:1.25rem;font-weight:700}._cz-detail-meta{color:var(--cz-text-muted);font-size:.8125rem;font-weight:500}._cz-detail-section{margin-bottom:1rem}._cz-detail-section:last-child{margin-bottom:0}._cz-detail-subtitle{color:var(--cz-text-muted);text-transform:uppercase;letter-spacing:.03em;margin:0 0 .5rem;font-size:.75rem;font-weight:600}._cz-detail-text{color:var(--cz-text-secondary);margin:0;font-size:.8125rem;line-height:1.5}@media (max-width:768px){._cz-all-detail{padding:1rem}._cz-detail-header{gap:.75rem;margin-bottom:1rem}._cz-detail-icon{width:40px;height:40px}._cz-detail-name{font-size:1.125rem}}@media (max-width:640px){._cz-all-grid{grid-template-columns:repeat(3,1fr);gap:.625rem}._cz-animal-card{padding:1rem .375rem .75rem}._cz-animal-ring{width:60px;height:60px}._cz-animal-icon{width:44px;height:44px}._cz-current-badge{padding:.1rem .4rem;font-size:.5625rem;top:-.4rem;right:-.15rem}}@media (max-width:480px){._cz-all-detail{padding:.875rem}}@media (max-width:400px){._cz-all-grid{grid-template-columns:repeat(3,1fr);gap:.5rem}._cz-animal-card{gap:.375rem;padding:.875rem .25rem .625rem}._cz-animal-ring{width:52px;height:52px}._cz-animal-icon{width:38px;height:38px}._cz-animal-name{font-size:.75rem}._cz-animal-year{padding:.1rem .4rem;font-size:.625rem}}