.catcompat-page{max-width:var(--content-width-narrow);padding:var(--space-6) var(--space-4) var(--space-10);background:var(--color-bg-section);min-height:100vh;margin:0 auto}.cc-header{text-align:center;margin-bottom:var(--space-8)}.cc-logo{font-size:var(--text-display-sm);margin-bottom:var(--space-1)}.cc-saju-tag{font-size:var(--text-xs);color:var(--color-purple);font-weight:var(--font-weight-semibold);letter-spacing:.5px;margin:0 0 var(--space-1)}.cc-title{font-size:var(--text-2xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0}.cc-subtitle{font-size:var(--text-sm);color:var(--color-text-muted);margin:var(--space-2) 0 0}.cc-intro{margin-top:var(--space-4);background:var(--color-bg-inverse);border-radius:var(--radius-xl);padding:var(--space-4);text-align:left}.cc-intro p{font-size:var(--text-sm);color:var(--color-text-inverse);padding:var(--space-1) 0;line-height:var(--line-height-base);margin:0}.cc-intro-line:before{content:"- ";color:var(--color-text-muted)}.cc-intro-cta{margin-top:var(--space-2);font-weight:var(--font-weight-bold);color:var(--ohaeng-earth-light);text-align:center}.cc-stepper{margin-bottom:var(--space-6);padding:0 var(--space-3);justify-content:center;align-items:center;display:flex}.cc-stepper-step{align-items:center;gap:var(--space-1);cursor:default;background:0 0;border:none;flex-direction:column;min-width:56px;padding:0;display:flex}.cc-stepper-step.active:not(.current){cursor:pointer}.cc-stepper-dot{border-radius:var(--radius-full);width:28px;height:28px;font-size:var(--text-xs);font-weight:var(--font-weight-bold);background:var(--color-border-light);color:var(--color-text-muted);justify-content:center;align-items:center;transition:all .3s;display:flex}.cc-stepper-step.active .cc-stepper-dot{background:var(--ohaeng-metal-light);color:var(--color-purple-dark)}.cc-stepper-step.current .cc-stepper-dot{background:var(--color-purple-dark);color:var(--color-text-inverse);box-shadow:var(--shadow-focus)}.cc-stepper-step span{font-size:var(--text-xs);color:var(--color-text-muted);font-weight:var(--font-weight-medium);transition:color .3s}.cc-stepper-step.active span{color:var(--color-purple-dark)}.cc-stepper-step.current span{font-weight:var(--font-weight-bold)}.cc-stepper-line{background:var(--color-border-light);max-width:60px;height:2px;margin-bottom:var(--space-5);flex:1;transition:background .3s}.cc-stepper-line.active{background:var(--color-purple-light)}.cc-back-btn{font-size:var(--text-sm);color:var(--color-purple-dark);cursor:pointer;margin-bottom:var(--space-3);font-weight:var(--font-weight-medium);background:0 0;border:none;padding:0}.cc-back-btn:hover{text-decoration:underline}.cc-step{margin-bottom:var(--space-6)}.cc-step-title{font-size:var(--text-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--space-2)}.cc-step-desc{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0 0 var(--space-4);line-height:var(--line-height-tight)}.cc-daily-counter{text-align:center;font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-3)}.cc-daily-counter strong{color:var(--color-purple-dark)}.cc-limit-card{text-align:center;padding:var(--space-8) var(--space-5)}.cc-rate-limit-notice{text-align:center;padding:var(--space-5);background:var(--ohaeng-metal-light);border:1px solid var(--color-border-light);border-radius:var(--radius-xl);color:var(--color-text-secondary);font-size:var(--text-base);line-height:var(--line-height-base)}.cc-survey{gap:var(--space-6);flex-direction:column;display:flex}.cc-survey-q-title{font-size:var(--text-base);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--space-3)}.cc-survey-binary{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.cc-survey-choice{align-items:center;gap:var(--space-2);padding:var(--space-5) var(--space-3) var(--space-4);background:var(--color-bg-card);border:2px solid var(--color-border-light);border-radius:var(--radius-xl);cursor:pointer;text-align:center;flex-direction:column;transition:all .2s;display:flex}.cc-survey-choice:hover{border-color:var(--color-purple-light)}.cc-survey-choice.selected{border-color:var(--color-purple-dark);background:var(--ohaeng-metal-light);box-shadow:var(--shadow-focus)}.cc-choice-emoji{font-size:var(--text-3xl)}.cc-choice-label{font-size:var(--text-base);color:var(--color-text-secondary);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight)}.cc-choice-sub{font-size:var(--text-xs);color:var(--color-text-muted);font-weight:var(--font-weight-normal);line-height:var(--line-height-tight)}.cc-survey-choice.selected .cc-choice-label{color:var(--color-purple-dark)}.cc-survey-choice.selected .cc-choice-sub{color:var(--color-purple)}.cc-cat-form{gap:var(--space-4);flex-direction:column;display:flex}.cc-field{gap:var(--space-1);flex-direction:column;display:flex}.cc-label{font-size:var(--text-sm);font-weight:var(--font-weight-semibold);color:var(--color-text-secondary)}.cc-opt{font-weight:var(--font-weight-normal);color:var(--color-text-muted)}.cc-input{padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--text-base);background:var(--color-bg-card);color:var(--color-text)}.cc-input:focus{border-color:var(--color-purple-dark);box-shadow:var(--shadow-focus);outline:none}.cc-hint{font-size:var(--text-xs);color:var(--color-text-muted);margin:0}.cc-actions{gap:var(--space-3);margin-top:var(--space-2);flex-direction:column;display:flex}.cc-actions--survey{margin-top:var(--space-5)}.cc-btn-primary{padding:var(--space-3);background:var(--color-purple-dark);color:var(--color-text-inverse);border-radius:var(--radius-lg);font-size:var(--text-base);font-weight:var(--font-weight-bold);cursor:pointer;text-align:center;justify-content:center;align-items:center;gap:var(--space-2);border:none;display:flex}.cc-btn-primary:hover{background:var(--color-purple)}.cc-btn-primary:disabled{opacity:.6;cursor:not-allowed}.cc-btn-ghost{padding:var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--color-text-secondary);cursor:pointer;text-align:center;background:0 0}.cc-btn-ghost:hover{border-color:var(--color-purple-dark);color:var(--color-purple-dark)}.cc-btn-ghost:disabled{opacity:.6;cursor:not-allowed}.cc-btn-text{font-size:var(--text-sm);color:var(--color-text-muted);cursor:pointer;text-align:center;background:0 0;border:none}.cc-btn-compat-cta{padding:var(--space-4);background:var(--color-purple-dark);color:var(--color-text-inverse);border-radius:var(--radius-xl);font-size:var(--text-base);font-weight:var(--font-weight-bold);cursor:pointer;text-align:center;box-shadow:var(--shadow-lg);border:none;transition:all .2s}.cc-btn-compat-cta:hover{background:var(--color-purple)}.cc-loading{text-align:center;padding:var(--space-6) 0;color:var(--color-text-secondary);font-size:var(--text-sm)}.cc-spinner{border:3px solid var(--color-border-light);border-top-color:var(--color-purple-dark);border-radius:var(--radius-full);width:28px;height:28px;margin:0 auto var(--space-2);animation:.8s linear infinite cc-spin}.cc-spinner-sm{border:2px solid var(--color-border-light);border-top-color:var(--color-text-inverse);border-radius:var(--radius-full);width:16px;height:16px;animation:.8s linear infinite cc-spin;display:inline-block}@keyframes cc-spin{to{transform:rotate(360deg)}}.cc-result-header{text-align:center;margin-bottom:var(--space-5)}.cc-emoji{font-size:var(--text-display-sm);margin-bottom:var(--space-1)}.cc-result-title{font-size:var(--text-xl);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0}.cc-score-card{align-items:center;gap:var(--space-5);background:var(--color-bg-card);border-radius:var(--radius-xl);padding:var(--space-5);box-shadow:var(--shadow-lg);margin-bottom:var(--space-4);display:flex}.cc-score-ring{flex-shrink:0;width:100px;height:100px;position:relative}.cc-ring-svg{width:100%;height:100%}.cc-ring-track{fill:none;stroke:var(--color-border);stroke-width:8px}.cc-ring-fill{fill:none;stroke:var(--color-purple-dark);stroke-width:8px;stroke-linecap:round}.cc-score-num{font-size:var(--text-3xl);font-weight:var(--font-weight-bold);color:var(--color-purple-dark);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cc-score-info{flex:1}.cc-type-badge{background:var(--ohaeng-metal-light);color:var(--color-purple-dark);padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);margin-bottom:var(--space-2);display:inline-block}.cc-type-desc{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-tight);margin:0}.cc-score-comment{font-size:var(--text-sm);color:var(--color-purple-dark);font-weight:var(--font-weight-semibold);margin:var(--space-2) 0 0;line-height:var(--line-height-tight)}.cc-type-detail{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-base);margin:0}.cc-tmi-card{border:2px solid var(--color-purple-light)}.cc-tmi-text{font-size:var(--text-base);color:var(--color-text-secondary);line-height:var(--line-height-base);font-weight:var(--font-weight-medium);white-space:pre-line;margin:0}.cc-capture-area{padding:var(--space-1) 0}.cc-watermark{text-align:center;font-size:var(--text-xs);color:var(--color-purple-light);margin-top:var(--space-2);padding:var(--space-1) 0}.cc-card{background:var(--color-bg-card);border-radius:var(--radius-xl);padding:var(--space-4);box-shadow:var(--shadow-lg);margin-bottom:var(--space-3)}.cc-section-title{font-size:var(--text-base);font-weight:var(--font-weight-bold);color:var(--color-text);margin:0 0 var(--space-3)}.cc-sub-title{font-size:var(--text-sm);font-weight:var(--font-weight-bold);color:var(--color-text-secondary);margin:var(--space-4) 0 var(--space-2)}.cc-strength-list{gap:var(--space-3);flex-direction:column;display:flex}.cc-strength-item strong{font-size:var(--text-sm);color:var(--color-purple-dark);margin-bottom:var(--space-1);display:block}.cc-strength-item p{font-size:var(--text-sm);color:var(--color-text-secondary);margin:0}.cc-ideal-trait{margin-bottom:var(--space-3)}.cc-ideal-desc{font-size:var(--text-sm);color:var(--color-text-secondary);margin:var(--space-2) 0 var(--space-1);font-weight:var(--font-weight-semibold)}.cc-ideal-tip{font-size:var(--text-xs);color:var(--color-text-muted);margin:0}.cc-summary-list{gap:var(--space-2);flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.cc-summary-list li{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-base);padding-left:var(--space-4);position:relative}.cc-summary-list li:before{content:"•";color:var(--color-purple-dark);font-weight:var(--font-weight-bold);position:absolute;left:0}.cc-oh-single-bars{gap:var(--space-2);flex-direction:column;display:flex}.cc-oh-single-row{align-items:center;gap:var(--space-2);display:flex}.cc-oh-compare{gap:var(--space-2);flex-direction:column;display:flex}.cc-oh-row{align-items:center;gap:var(--space-2);display:flex}.cc-oh-label{width:20px;font-size:var(--text-base);font-weight:var(--font-weight-bold);text-align:center}.cc-oh-label small{font-size:9px;font-weight:var(--font-weight-normal);color:var(--color-text-muted);display:block}.cc-oh-bars{gap:var(--space-1);flex-direction:column;flex:1;display:flex}.cc-oh-bar-wrap{align-items:center;gap:var(--space-1);height:14px;display:flex}.cc-oh-bar-wrap--grow{flex:1}.cc-oh-bar{border-radius:var(--radius-sm);min-width:4px;height:10px;transition:width .5s}.cc-oh-bar--cat{opacity:.5}.cc-oh-val{font-size:var(--text-xs);color:var(--color-text-muted);min-width:18px}.cc-oh-legend{gap:var(--space-3);font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1);justify-content:flex-end;display:flex}.cc-oh-legend-cat{opacity:.5}.cc-oh-wood{color:var(--ohaeng-wood)}.cc-oh-fire{color:var(--ohaeng-fire)}.cc-oh-earth{color:var(--ohaeng-earth)}.cc-oh-metal{color:var(--ohaeng-metal)}.cc-oh-water{color:var(--ohaeng-water)}.cc-oh-bar.cc-oh-wood{background:var(--ohaeng-wood)}.cc-oh-bar.cc-oh-fire{background:var(--ohaeng-fire)}.cc-oh-bar.cc-oh-earth{background:var(--ohaeng-earth)}.cc-oh-bar.cc-oh-metal{background:var(--ohaeng-metal)}.cc-oh-bar.cc-oh-water{background:var(--ohaeng-water)}.cc-oh-tags{gap:var(--space-2);margin-bottom:var(--space-2);flex-wrap:wrap;display:flex}.cc-oh-tag{padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);border:1px solid}.cc-oh-tag.cc-oh-wood{color:var(--ohaeng-wood);background:var(--ohaeng-wood-light)}.cc-oh-tag.cc-oh-fire{color:var(--ohaeng-fire);background:var(--ohaeng-fire-light)}.cc-oh-tag.cc-oh-earth{color:var(--ohaeng-earth);background:var(--ohaeng-earth-light)}.cc-oh-tag.cc-oh-metal{color:var(--ohaeng-metal);background:var(--ohaeng-metal-light)}.cc-oh-tag.cc-oh-water{color:var(--ohaeng-water);background:var(--ohaeng-water-light)}.cc-oh-tag .cc-oh-tag-text{color:var(--color-text-secondary)}.cc-note{font-size:var(--text-xs);color:var(--color-text-secondary);margin:var(--space-1) 0 0}.cc-profile-summary{font-size:var(--text-base);color:var(--color-text-secondary);line-height:var(--line-height-base);margin:0 0 var(--space-4)}.cc-ideal-list{gap:var(--space-2);flex-direction:column;display:flex}.cc-ideal-item{font-size:var(--text-sm);color:var(--color-text-secondary)}.cc-detail-grid{gap:var(--space-3);flex-direction:column;display:flex}.cc-detail-item{gap:var(--space-3);align-items:flex-start;display:flex}.cc-detail-icon{font-size:var(--text-xl);flex-shrink:0}.cc-detail-item strong{font-size:var(--text-sm);color:var(--color-text)}.cc-detail-item p{font-size:var(--text-xs);color:var(--color-text-secondary);margin:var(--space-1) 0 0}.cc-section{margin-bottom:var(--space-4)}.cc-section-ref{font-size:var(--text-xs);color:var(--color-text-muted);margin:0 0 var(--space-3);line-height:var(--line-height-tight)}.cc-ref{font-size:var(--text-xs);color:var(--color-purple-dark);margin:var(--space-1) 0 0;font-weight:var(--font-weight-medium)}.cc-explain{font-size:var(--text-xs);color:var(--color-text-muted);margin:var(--space-1) 0 0;line-height:var(--line-height-tight)}.cc-explain--block{margin-top:var(--space-1)}.cc-personality{gap:var(--space-3);margin-bottom:var(--space-4);align-items:flex-start;display:flex}.cc-personality-emoji{font-size:var(--text-display-sm);flex-shrink:0}.cc-personality-type{font-size:var(--text-base);color:var(--color-purple-dark);margin-bottom:var(--space-1);display:block}.cc-personality-desc{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-base);margin:0}.cc-trait-tags{gap:var(--space-2);margin-bottom:var(--space-4);flex-wrap:wrap;display:flex}.cc-trait-chip{align-items:center;gap:var(--space-1);background:var(--ohaeng-metal-light);border:1px solid var(--color-border-light);border-radius:var(--radius-full);padding:var(--space-1) var(--space-3);cursor:default;display:flex}.cc-trait-cat{font-size:var(--text-xs);color:var(--color-text-muted);font-weight:var(--font-weight-semibold)}.cc-trait-label{font-size:var(--text-xs);color:var(--color-purple-dark);font-weight:var(--font-weight-semibold)}.cc-oh-insight{margin-bottom:var(--space-4)}.cc-oh-insight-row{gap:var(--space-2);margin-bottom:var(--space-3);align-items:flex-start;display:flex}.cc-oh-insight-emoji{font-size:var(--text-xl);flex-shrink:0}.cc-oh-insight-row strong{font-size:var(--text-sm)}.cc-oh-insight-trait{font-size:var(--text-sm);color:var(--color-text-secondary)}.cc-oh-insight-need{font-size:var(--text-xs);color:var(--color-text-muted);margin:var(--space-1) 0 0}.cc-oh-weak{background:var(--ohaeng-earth-light);border-radius:var(--radius-md);padding:var(--space-3);margin-top:var(--space-2)}.cc-oh-weak-label{font-size:var(--text-xs);color:var(--ohaeng-earth);font-weight:var(--font-weight-semibold);margin-right:var(--space-2)}.cc-oh-weak-tag{font-size:var(--text-xs);font-weight:var(--font-weight-semibold);margin-right:var(--space-2)}.cc-oh-weak-tip{font-size:var(--text-xs);color:var(--ohaeng-earth);margin:var(--space-1) 0 0}.cc-cat-oh{margin-top:var(--space-3)}.cc-influencer-card{border:2px solid var(--ohaeng-earth-light)}.cc-influencer-content{gap:var(--space-4);margin-bottom:var(--space-3);align-items:flex-start;display:flex}.cc-influencer-badge{align-items:center;gap:var(--space-1);min-width:56px;padding:var(--space-2);border-radius:var(--radius-xl);text-align:center;background:var(--ohaeng-earth-light);flex-direction:column;display:flex}.cc-influencer-emoji{font-size:var(--text-3xl)}.cc-influencer-score{font-size:var(--text-base);font-weight:var(--font-weight-bold);color:var(--ohaeng-earth)}.cc-influencer-info{flex:1}.cc-influencer-level{font-size:var(--text-base);color:var(--ohaeng-earth);margin-bottom:var(--space-1);display:block}.cc-influencer-desc{font-size:var(--text-sm);color:var(--color-text-secondary);line-height:var(--line-height-base);margin:0}.cc-influencer-details{gap:var(--space-2);background:var(--ohaeng-earth-light);border-radius:var(--radius-md);padding:var(--space-3);flex-direction:column;display:flex}.cc-influencer-tag{align-items:center;gap:var(--space-2);font-size:var(--text-xs);color:var(--ohaeng-earth);font-weight:var(--font-weight-medium);display:flex}.cc-tag-icon{font-size:var(--text-base);flex-shrink:0}.cc-bottom-actions{gap:var(--space-3);margin-top:var(--space-5);flex-direction:column;display:flex}.cc-share-row{gap:var(--space-2);grid-template-columns:1fr 1fr;display:grid}.cc-btn-share{padding:var(--space-3) var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-xs);cursor:pointer;text-align:center;background:var(--color-bg-card);color:var(--color-text-secondary);font-weight:var(--font-weight-semibold);justify-content:center;align-items:center;gap:var(--space-1);transition:all .2s;display:flex}.cc-btn-share:hover{border-color:var(--color-purple-dark);color:var(--color-purple-dark)}.cc-footer{text-align:center;margin-top:var(--space-8);font-size:var(--text-xs);color:var(--color-text-placeholder)}.cc-toast{bottom:var(--space-20);background:var(--color-bg-inverse);color:var(--color-text-inverse);padding:var(--space-3) var(--space-5);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-weight-medium);z-index:100;animation:.3s cc-toast-in;position:fixed;left:50%;transform:translate(-50%)}@keyframes cc-toast-in{0%{opacity:0;transform:translate(-50%)translateY(10px)}to{opacity:1;transform:translate(-50%)translateY(0)}}