*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--c-primary: #16a34a;--c-primary-dark: #15803d;--c-primary-darker: #166534;--c-primary-light: #dcfce7;--c-primary-50: #f0fdf4;--c-accent: #f59e0b;--c-accent-dark: #d97706;--c-danger: #dc2626;--c-bg: #ffffff;--c-bg-alt: #f8fafc;--c-bg-warm: #fffbeb;--c-surface: #ffffff;--c-text: #0f172a;--c-text-secondary: #334155;--c-text-muted: #64748b;--c-border: #e2e8f0;--c-border-light: #f1f5f9;--font-sans: "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .8125rem;--font-size-base: .9375rem;--font-size-lg: 1.0625rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.625rem;--font-size-3xl: 2rem;--font-size-4xl: 2.5rem;--lh: 1.65;--max-width: 620px;--radius: 16px;--radius-sm: 10px;--radius-xs: 6px;--shadow-sm: 0 1px 2px rgba(0,0,0,.04);--shadow-md: 0 4px 16px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.04);--shadow-lg: 0 8px 32px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);--shadow-xl: 0 16px 48px rgba(0,0,0,.1), 0 4px 12px rgba(0,0,0,.05)}html{font-family:var(--font-sans);font-size:16px;line-height:var(--lh);color:var(--c-text);background:var(--c-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}body{min-height:100dvh}img{max-width:100%;height:auto;display:block}a{color:var(--c-primary-dark);text-decoration:none}a:hover{color:var(--c-primary-darker)}strong{color:var(--c-text);font-weight:650}.container{max-width:var(--max-width);margin:0 auto;padding:0 20px}.section{padding:48px 0}.section-title{font-size:var(--font-size-2xl);font-weight:800;line-height:1.25;letter-spacing:-.025em;margin-bottom:8px;word-break:keep-all;color:var(--c-text)}.section-subtitle{font-size:var(--font-size-base);color:var(--c-text-muted);margin-bottom:28px;word-break:keep-all;line-height:1.6}.ad-disclosure{background:var(--c-bg-alt);color:var(--c-text-muted);text-align:center;padding:8px 16px;font-size:var(--font-size-xs);font-weight:500;position:sticky;top:0;z-index:100;border-bottom:1px solid var(--c-border-light);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:650;letter-spacing:.01em;line-height:1.4}.badge--primary{background:var(--c-primary);color:#fff}.badge--accent{background:#fef3c7;color:#92400e}.hero{padding:56px 0 40px;text-align:center;background:linear-gradient(180deg,var(--c-primary-50) 0%,var(--c-bg) 100%);position:relative}.hero:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:320px;height:320px;background:radial-gradient(circle,rgba(22,163,74,.08) 0%,transparent 70%);pointer-events:none}.hero__label{display:inline-flex;align-items:center;gap:6px;background:var(--c-primary-light);color:var(--c-primary-dark);padding:6px 14px;border-radius:999px;font-size:var(--font-size-xs);font-weight:650;margin-bottom:20px}.hero__title{font-size:var(--font-size-2xl);font-weight:800;line-height:1.3;letter-spacing:-.03em;margin-bottom:14px;word-break:keep-all;color:var(--c-text)}.hero__title em{font-style:normal;background:linear-gradient(135deg,var(--c-primary) 0%,#059669 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero__subtitle{font-size:var(--font-size-base);color:var(--c-text-muted);margin-bottom:28px;word-break:keep-all;line-height:1.65}.hero .cta-btn{display:inline-flex;width:auto;padding:14px 32px}.cta-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:14px 24px;background:linear-gradient(135deg,var(--c-primary) 0%,#059669 100%);color:#fff;font-size:var(--font-size-base);font-weight:700;text-align:center;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:all .2s ease;text-decoration:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 8px #16a34a40,0 1px 2px #0000000f;position:relative;overflow:hidden}.cta-btn:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(255,255,255,.1) 100%);pointer-events:none}.cta-btn:hover{text-decoration:none;color:#fff;transform:translateY(-1px);box-shadow:0 4px 16px #16a34a4d,0 2px 4px #0000000f}.cta-btn:active{transform:translateY(0);box-shadow:0 1px 4px #16a34a33}.cta-btn--secondary{background:linear-gradient(135deg,#475569,#334155);box-shadow:0 2px 8px #33415533,0 1px 2px #0000000f;font-size:var(--font-size-sm);padding:12px 20px}.cta-btn--secondary:hover{color:#fff;box-shadow:0 4px 16px #33415540,0 2px 4px #0000000f}.problem-section{background:linear-gradient(135deg,#fff7ed,#fef3c7);border-radius:var(--radius);padding:24px;margin-bottom:16px;border:1px solid #fed7aa}.problem-section__title{font-size:var(--font-size-lg);font-weight:750;margin-bottom:14px;color:#9a3412;letter-spacing:-.01em}.problem-section__list{list-style:none}.problem-section__list li{font-size:var(--font-size-sm);color:#78350f;padding:6px 0 6px 24px;position:relative;line-height:1.5}.problem-section__list li:before{content:"⚠";position:absolute;left:0;font-size:12px}.category-nav{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.category-nav__item{display:inline-flex;align-items:center;gap:4px;padding:8px 14px;border:1px solid var(--c-border);border-radius:999px;font-size:var(--font-size-xs);font-weight:600;color:var(--c-text-secondary);background:var(--c-surface);transition:all .15s ease;text-decoration:none}.category-nav__item:hover{border-color:var(--c-primary);color:var(--c-primary-dark);background:var(--c-primary-50)}.category-section{padding:48px 0;border-top:1px solid var(--c-border-light)}.cat-bg-1{background:linear-gradient(180deg,#faf5ff,#fff)}.cat-bg-2{background:linear-gradient(180deg,#ecfdf5,#fff)}.cat-bg-3{background:linear-gradient(180deg,#fef2f2,#fff)}.cat-bg-4{background:linear-gradient(180deg,#fffbeb,#fff)}.cat-bg-5{background:linear-gradient(180deg,#f0f9ff,#fff)}.category-section__header{display:flex;align-items:center;gap:10px;margin-bottom:12px}.category-section__emoji{font-size:28px;line-height:1}.category-section__title{font-size:var(--font-size-2xl);font-weight:800;letter-spacing:-.025em;color:var(--c-text)}.category-section__why{font-size:var(--font-size-sm);color:var(--c-text-secondary);line-height:1.7;margin-bottom:24px;word-break:keep-all}.category-section__hero-image{width:100%;max-width:320px;height:auto;border-radius:var(--radius);margin:0 auto 24px;display:block;box-shadow:var(--shadow-lg)}.rank-badge{display:inline-flex;align-items:center;padding:4px 12px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.02em}.rank-badge--1{background:linear-gradient(135deg,var(--c-primary) 0%,#059669 100%);color:#fff;box-shadow:0 2px 6px #16a34a4d}.rank-badge--2{background:#e2e8f0;color:#475569}.rank-badge--3{background:#f1f5f9;color:#64748b}.rank-card{background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius);padding:24px;margin-bottom:16px;transition:all .2s ease;position:relative}.rank-card--best{border-color:var(--c-primary);border-width:2px;box-shadow:var(--shadow-md),0 0 0 3px var(--c-primary-50)}.rank-card--compact{padding:20px}.rank-card:hover{box-shadow:var(--shadow-lg)}.rank-card__emoji-placeholder{width:100%;height:160px;display:flex;align-items:center;justify-content:center;font-size:64px;background:linear-gradient(135deg,var(--c-primary-50) 0%,var(--c-primary-light) 100%);border-radius:var(--radius-sm);margin-bottom:16px}.rank-card__emoji-placeholder--compact{width:64px;height:64px;font-size:28px;border-radius:var(--radius-xs);flex-shrink:0}.rank-card__image{width:100%;height:200px;object-fit:contain;border-radius:var(--radius-sm);background:var(--c-bg-alt);margin-bottom:16px}.rank-card__image--compact{width:64px;height:64px;object-fit:contain;border-radius:var(--radius-xs);background:var(--c-bg-alt);flex-shrink:0}.rank-card__compact-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:8px}.rank-card__compact-info{flex:1;min-width:0}.rank-card__badge-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}.rank-card__name{font-size:var(--font-size-xl);font-weight:800;line-height:1.3;margin-bottom:8px;color:var(--c-text);letter-spacing:-.02em;word-break:keep-all}.rank-card__name--compact{font-size:var(--font-size-lg);font-weight:750}.rank-card__short-desc{font-size:var(--font-size-sm);color:var(--c-primary-dark);font-weight:600;margin-bottom:12px;line-height:1.5;word-break:keep-all}.rank-card__ingredient{font-size:var(--font-size-xs);color:var(--c-text-secondary);background:var(--c-bg-alt);padding:8px 12px;border-radius:var(--radius-xs);margin-bottom:12px;border:1px solid var(--c-border-light);line-height:1.5}.rank-card__price-row{display:flex;align-items:baseline;gap:12px;margin-bottom:16px;flex-wrap:wrap}.rank-card__price{font-size:var(--font-size-lg);font-weight:800;color:var(--c-text);letter-spacing:-.02em}.rank-card__rating{font-size:var(--font-size-xs);color:var(--c-accent-dark);font-weight:600}.rank-card__meta-row{margin-bottom:12px}.rank-card__body{font-size:var(--font-size-sm);color:var(--c-text-muted);line-height:1.65;margin-bottom:16px;word-break:keep-all}.rank-card__pros-cons{display:grid;gap:12px;margin-bottom:16px}.rank-card__pros strong,.rank-card__cons strong{font-size:var(--font-size-xs);display:block;margin-bottom:6px;letter-spacing:.02em}.rank-card__pros strong{color:var(--c-primary-dark)}.rank-card__cons strong{color:var(--c-text-muted)}.rank-card__pros ul,.rank-card__cons ul{list-style:none}.rank-card__pros li,.rank-card__cons li{font-size:var(--font-size-xs);line-height:1.5;padding:3px 0 3px 18px;position:relative;color:var(--c-text-secondary)}.rank-card__pros li:before{content:"+";position:absolute;left:0;color:var(--c-primary);font-weight:800;font-size:13px}.rank-card__cons li:before{content:"-";position:absolute;left:2px;color:var(--c-text-muted);font-weight:800;font-size:13px}.rank-card__benefits-compact{list-style:none;margin-bottom:12px}.rank-card__benefits-compact li{font-size:var(--font-size-xs);color:var(--c-text-secondary);padding:3px 0 3px 20px;position:relative;line-height:1.5}.rank-card__benefits-compact li:before{content:"✓";position:absolute;left:0;top:3px;font-size:11px;color:var(--c-primary);font-weight:800}.rank-card__details{margin-bottom:14px}.rank-card__details summary{font-size:var(--font-size-xs);color:var(--c-text-muted);cursor:pointer;padding:6px 0;font-weight:600;user-select:none}.rank-card__details summary:hover{color:var(--c-primary-dark)}.rank-card__details[open] summary{margin-bottom:8px}.selection-guide{background:var(--c-bg-alt);border:1px solid var(--c-border);border-radius:var(--radius);padding:20px;margin-top:8px}.selection-guide__title{font-size:var(--font-size-base);font-weight:750;margin-bottom:12px;color:var(--c-text)}.selection-guide__list{list-style:none}.selection-guide__list li{font-size:var(--font-size-sm);color:var(--c-text-secondary);padding:6px 0 6px 22px;position:relative;line-height:1.5;word-break:keep-all}.selection-guide__list li:before{content:"➔";position:absolute;left:0;font-size:12px;color:var(--c-primary)}.comparison-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--font-size-sm);margin-bottom:24px;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--c-border)}.comparison-table th{background:var(--c-bg-alt);padding:10px 14px;text-align:left;font-weight:700;font-size:var(--font-size-xs);color:var(--c-text-muted);text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--c-border);white-space:nowrap}.comparison-table td{padding:10px 14px;border-bottom:1px solid var(--c-border-light);vertical-align:top;color:var(--c-text-secondary)}.comparison-table tr:last-child td{border-bottom:none}.comparison-table tr:hover td{background:var(--c-primary-50)}.faq-item{border-bottom:1px solid var(--c-border-light);padding:20px 0}.faq-item:last-child{border-bottom:none}.faq-item__q{font-weight:700;font-size:var(--font-size-base);margin-bottom:8px;color:var(--c-text);line-height:1.4}.faq-item__q:before{content:"Q";display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;background:var(--c-primary);color:#fff;font-size:11px;font-weight:800;margin-right:8px;vertical-align:middle}.faq-item__a{font-size:var(--font-size-sm);color:var(--c-text-muted);line-height:1.7;padding-left:30px}.sticky-bar{position:fixed;bottom:0;left:0;right:0;background:#ffffffeb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--c-border-light);padding:12px 16px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:50;transform:translateY(100%);transition:transform .3s cubic-bezier(.16,1,.3,1)}.sticky-bar--visible{transform:translateY(0)}.sticky-bar .cta-btn{max-width:var(--max-width);margin:0 auto;border-radius:999px;padding:12px 24px;font-size:var(--font-size-sm)}.footer{padding:32px 0;font-size:var(--font-size-xs);color:var(--c-text-muted);line-height:1.8;border-top:1px solid var(--c-border-light)}.footer a{color:var(--c-text-muted)}.disclaimer{background:var(--c-bg-alt);border:1px solid var(--c-border-light);border-radius:var(--radius-sm);padding:16px;font-size:var(--font-size-xs);color:var(--c-text-muted);line-height:1.7;margin:32px 0}.references{font-size:var(--font-size-xs);color:var(--c-text-muted);margin-top:16px}.references ol{padding-left:20px}.references li{margin-bottom:2px}@media(min-width:768px){.hero__title,.section-title,.category-section__title{font-size:var(--font-size-3xl)}.sticky-bar{display:none}.container{padding:0 32px}.rank-card{padding:28px}.rank-card__pros-cons{grid-template-columns:1fr 1fr}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;scroll-behavior:auto!important}}