@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Noto+Sans+KR:wght@400;500;600;700&family=Noto+Serif+KR:wght@400;500&display=swap');

:root { --ink:#191817; --muted:#766f66; --paper:#f4f1eb; --line:#d8d1c7; --lime:#c9ff5d; --lime-dark:#789a3a; --blue:#e6e3da; --red:#a84f38; }
* { box-sizing:border-box; }
html { word-break:keep-all; overflow-wrap:break-word; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Manrope,"Noto Sans KR",sans-serif; }
h1, h2, h3, p, button, a, label { word-break:keep-all; overflow-wrap:break-word; }
.site-header { height:76px; padding:0 clamp(24px,6vw,88px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { color:var(--ink); text-decoration:none; font-size:1.25rem; letter-spacing:-.08em; font-weight:800; }.brand .brand-label { color:var(--ink); }.brand > span:last-child { color:var(--lime-dark); }.header-actions { display:flex; align-items:center; gap:19px; }.header-link { color:var(--muted); font-size:.76rem; text-decoration:none; }.site-header p, .eyebrow { margin:0; font:500 .64rem/1.2 "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.login-button { cursor:pointer; border:0; background:transparent; color:var(--ink); padding:7px 0; font:600 .75rem "Noto Sans KR",sans-serif; }
.login-button:hover { background:var(--ink); color:white; }
main { max-width:1180px; margin:auto; padding:clamp(45px,7vw,84px) clamp(20px,5vw,56px) 110px; }.editorial-hero { display:grid; grid-template-columns:minmax(0, .94fr) minmax(330px, .8fr); gap:clamp(35px,7vw,105px); align-items:end; }.hero-copy-wrap { padding-bottom:8px; }.editorial-hero h1 { margin:17px 0 22px; font-size:clamp(3rem,6.4vw,6rem); line-height:.98; letter-spacing:-.09em; font-weight:700; }.editorial-hero h1 em { font-family:"Noto Serif KR",Georgia,serif; font-weight:400; letter-spacing:-.1em; }
.hero-copy { margin:0; color:var(--muted); font-size:clamp(1rem,1.6vw,1.18rem); line-height:1.75; }
.hero-image { position:relative; margin:0; min-height:530px; overflow:hidden; background:var(--blue); }.hero-image img { width:100%; height:100%; min-height:530px; display:block; object-fit:cover; object-position:center; filter:saturate(.78) contrast(.96); }.hero-image figcaption { position:absolute; left:0; bottom:0; margin:0; padding:10px 13px; background:var(--paper); color:var(--ink); font:500 .61rem "DM Mono",monospace; letter-spacing:.04em; }.hero-cta { display:inline-flex; align-items:center; gap:31px; margin-top:31px; border-bottom:1px solid var(--ink); padding-bottom:9px; color:var(--ink); font-weight:700; font-size:.84rem; text-decoration:none; }.hero-note { margin:37px 0 0; color:var(--muted); font-size:.68rem; line-height:1.65; }.moment-index { display:grid; grid-template-columns:.75fr 1.25fr; gap:45px; margin:115px 0 0; padding-top:19px; border-top:1px solid var(--ink); }.moment-index h2 { margin:10px 0 0; font-size:1.6rem; letter-spacing:-.065em; }.moment-list { border-top:1px solid var(--line); }.moment-list button { width:100%; display:grid; grid-template-columns:46px 1fr 20px; gap:10px; align-items:center; padding:19px 0; cursor:pointer; border:0; border-bottom:1px solid var(--line); background:transparent; text-align:left; color:var(--ink); font:600 .93rem "Noto Sans KR",sans-serif; letter-spacing:-.04em; }.moment-list button span { color:var(--muted); font:400 .63rem "DM Mono",monospace; }.moment-list button b { font-size:1rem; font-weight:400; }.moment-list button:hover { padding-left:8px; }.search-panel { margin-top:105px; padding:0 0 23px; background:transparent; border:0; border-bottom:1px solid var(--ink); box-shadow:none; }
.home-search { max-width:920px; margin:0 auto; padding:clamp(30px,5.4vw,58px); background:#e8e1d7; border:0; border-radius:52px 52px 52px 12px; box-shadow:none; }.home-search form > label { display:block; margin:0 0 25px; font-size:clamp(1.85rem,4vw,3rem); line-height:1.12; letter-spacing:-.065em; font-weight:700; }.home-search textarea { min-height:164px; padding-right:56px; font-size:clamp(1.08rem,1.8vw,1.38rem); }
textarea { width:100%; min-height:105px; padding:0; border:0; resize:vertical; outline:none; background:transparent; color:var(--ink); font:500 clamp(1.2rem,2vw,1.55rem)/1.55 "Noto Sans KR",sans-serif; letter-spacing:-.055em; } textarea::placeholder { color:#afa79c; }
.query-input-wrap { position:relative; }
.voice-input { position:absolute; right:0; bottom:8px; display:grid; place-items:center; width:43px; height:43px; padding:0; cursor:pointer; border:1px solid rgba(25,24,23,.2); border-radius:50%; background:rgba(244,241,235,.56); color:var(--ink); transition:background .15s,border-color .15s,transform .15s; }
.voice-input svg { width:20px; height:20px; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.voice-input:hover { border-color:var(--ink); background:var(--paper); }
.voice-input:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.voice-input.is-listening { border-color:var(--ink); background:var(--ink); color:white; animation:voice-pulse 1.6s ease-in-out infinite; }
.voice-input[hidden] { display:none; }
.voice-status { min-height:18px; margin:5px 0 -4px; color:var(--muted); font-size:.68rem; }
@keyframes voice-pulse { 0%,100% { box-shadow:0 0 0 0 rgba(25,24,23,.18); } 50% { box-shadow:0 0 0 7px rgba(25,24,23,0); } }
@media (prefers-reduced-motion:reduce) { .voice-input.is-listening { animation:none; } }
.context-prompts { min-height:104px; margin:22px 0 22px; }.context-prompts p { margin:0 0 9px; color:var(--muted); font-size:.75rem; letter-spacing:-.03em; transition:opacity .15s, transform .15s; }.context-chips, .selected-contexts { display:flex; gap:7px; flex-wrap:wrap; transition:opacity .15s, transform .15s; }.context-chips button, .selected-contexts button, .text-button { cursor:pointer; border:0; background:transparent; color:var(--muted); font:500 .73rem "Noto Sans KR",sans-serif; padding:6px 0; }.context-chips button { margin:0; padding:7px 10px; border:1px solid #d5cec3; border-radius:999px; background:rgba(255,255,255,.34); }.context-chips button:hover, .text-button:hover { color:var(--ink); border-color:var(--ink); }.selected-contexts { margin-top:12px; }.selected-contexts button { padding:5px 8px; border-radius:999px; background:var(--ink); color:white; font-size:.66rem; }.selected-contexts button span { margin-left:3px; color:var(--lime); }.selected-contexts .clear-contexts { background:transparent; color:var(--muted); padding-left:4px; padding-right:4px; text-decoration:underline; text-underline-offset:3px; }.context-prompts .is-changing { opacity:0; transform:translateY(-4px); }
.form-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:0; border:0; gap:16px; }
.passport-consent { display:flex; align-items:center; gap:7px; color:var(--muted); font-size:.68rem; cursor:pointer; }.passport-consent input { accent-color:var(--ink); }
.submit { position:relative; cursor:pointer; display:grid; place-items:center; width:58px; height:58px; border:0; border-radius:50%; background:var(--ink); color:white; padding:0; font:700 1.25rem Manrope,sans-serif; transition:transform .15s, background .15s; }.submit span:first-child { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }.submit:hover { background:var(--lime); color:var(--ink); transform:translate(2px,-2px); }
.submit:disabled { opacity:.5; cursor:wait; transform:none; }
.empty-state { margin-top:45px; color:var(--muted); font-size:.84rem; }
.test-catalog { margin-top:68px; padding:0; border:0; }.catalog-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:24px; }.catalog-heading h2 { margin:0; font-size:1.55rem; letter-spacing:-.065em; }.catalog-status, .catalog-notice { margin:0; color:var(--muted); font-size:.68rem; line-height:1.55; }.catalog-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }.catalog-item { min-width:0; padding:0; cursor:pointer; border:0; background:transparent; color:var(--ink); text-align:left; }.catalog-item img { width:100%; aspect-ratio:3/4; object-fit:cover; display:block; background:#dfd9cf; filter:saturate(.78); }.catalog-item.crop-two img { object-position:75% 45%; }.catalog-item.crop-three img { object-position:48% 67%; }.catalog-item.crop-four img { object-position:20% 40%; }.catalog-item:hover img { filter:saturate(1); transform:translateY(-3px); }.catalog-meta { display:flex; align-items:baseline; justify-content:space-between; gap:8px; padding:10px 0 2px; font-size:.78rem; font-weight:700; letter-spacing:-.04em; }.catalog-meta small { flex:0 0 auto; color:var(--muted); font-size:.59rem; font-weight:500; }.catalog-notice { max-width:610px; margin-top:19px; }
.small-wish-note { max-width:650px; margin:102px 0 0; padding:30px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }.small-wish-note > p:not(.eyebrow) { margin:18px 0 20px; font-size:1.2rem; line-height:1.72; letter-spacing:-.055em; }.small-wish-note a { color:var(--muted); font-size:.75rem; text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:4px; }.partner-link { display:inline-flex; align-items:center; gap:18px; margin-top:20px; padding:12px 14px; background:var(--ink); color:white; text-decoration:none; font-size:.8rem; font-weight:700; }
.partner-link:hover { background:var(--lime-dark); color:var(--ink); }
.partner-disclosure { margin:16px 0 0; color:#42505c; font-size:.68rem; line-height:1.6; }
.results { margin-top:85px; }
.result-heading { display:flex; justify-content:space-between; gap:20px; align-items:end; padding-bottom:24px; border-bottom:2px solid var(--ink); }
.result-heading h2 { margin:10px 0 0; font-size:clamp(1.8rem,3vw,2.75rem); letter-spacing:-.065em; }
.assistant-message { white-space:pre-line; max-width:690px; color:var(--muted); line-height:1.75; margin:25px 0 29px; font-size:.94rem; }
.active-query { margin:19px 0 0; padding:10px 12px; border-left:2px solid var(--ink); background:#ebe6dd; color:var(--ink); font-size:.78rem; line-height:1.6; }.refining-status { margin:18px 0 -8px; color:var(--muted); font-size:.76rem; }.cards.is-refining { opacity:.45; pointer-events:none; transition:opacity .15s; }
.catalog-mode-badge { display:inline-block; margin:15px 0 0; padding:7px 9px; background:var(--red); color:white; font:600 .64rem/1.45 "DM Mono",monospace; letter-spacing:.02em; }.catalog-mode-badge[hidden] { display:none; }.catalog-mode-badge[data-mode="unknown"] { background:var(--ink); }
.cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px; }
.card { min-height:255px; padding:23px; background:white; border:1px solid var(--line); display:flex; flex-direction:column; }
.product-image { width:calc(100% + 46px); height:190px; margin:-23px -23px 20px; object-fit:cover; background:#edf0eb; border-bottom:1px solid var(--line); }
.card:first-child { background:var(--blue); border-color:var(--ink); }
.rank { margin:0 0 20px; font:500 .7rem "DM Mono",monospace; color:var(--muted); }
.data-badges { min-height:22px; display:flex; flex-wrap:wrap; gap:6px; margin:0 0 9px; }.data-badge { display:inline-block; padding:4px 6px; background:var(--ink); color:white; font:600 .58rem/1.2 "DM Mono",monospace; letter-spacing:.03em; }.data-badge.demo { background:var(--red); }.data-badge.unknown { background:#d9d2c8; color:var(--ink); }
.card h3 { margin:0; font-size:1.23rem; letter-spacing:-.05em; line-height:1.3; }
.price { margin:11px 0 18px; font:700 .98rem "DM Mono",monospace; }
.reasons { margin:0; padding:0; list-style:none; color:#42505c; font-size:.77rem; line-height:1.58; }
.reasons li { margin:4px 0; }
.reasons li::before { content:"✓"; padding-right:7px; color:var(--lime-dark); font-weight:800; }
.buy { margin-top:auto; padding-top:22px; color:var(--ink); font-size:.78rem; font-weight:700; text-decoration:none; }
.buy:hover { text-decoration:underline; }
.card-actions { display:flex; flex-wrap:wrap; gap:7px; margin:17px 0 0; }.card-actions button { cursor:pointer; border:0; border-bottom:1px solid var(--line); padding:4px 0; background:transparent; color:var(--muted); font:500 .65rem "Noto Sans KR",sans-serif; }.card-actions button:hover { color:var(--ink); border-color:var(--ink); }.card-actions button:disabled { cursor:default; color:var(--lime-dark); border-color:transparent; }
.caveat { color:var(--red); margin:13px 0 0; font-size:.7rem; line-height:1.5; }
.evidence { margin:13px 0 0; color:#42505c; font-size:.7rem; line-height:1.5; }
.evidence a { color:inherit; text-decoration:underline; }
.quick-actions { display:flex; flex-wrap:wrap; gap:8px; margin:25px 0; }
.quick-actions button { cursor:pointer; border:1px solid var(--ink); background:transparent; color:var(--ink); padding:9px 11px; font:600 .73rem "Noto Sans KR",sans-serif; }.quick-actions button:disabled { cursor:wait; opacity:.45; }
.quick-actions button:hover { background:var(--lime); }
.disclosure, .demo-note { color:var(--muted); font-size:.69rem; line-height:1.6; }
.disclosure { margin:25px 0 8px; }.demo-note { margin:0; }
footer { padding:28px clamp(24px,6vw,88px); border-top:1px solid var(--line); color:var(--muted); font:400 .65rem "DM Mono",monospace; display:flex; align-items:center; justify-content:space-between; gap:16px; }
footer nav { display:flex; gap:14px; } footer a { color:inherit; text-decoration:none; } footer a:hover { color:var(--ink); text-decoration:underline; }
.info-page { max-width:760px; padding-top:clamp(72px,11vw,140px); } .info-page h1 { margin:15px 0 25px; font-size:clamp(2.7rem,7vw,5.4rem); line-height:1.03; letter-spacing:-.075em; } .info-page .lead { max-width:620px; margin:0 0 55px; color:var(--muted); font-size:1.03rem; line-height:1.85; } .info-page section { padding:25px 0; border-top:1px solid var(--line); } .info-page h2 { margin:0 0 12px; font-size:1.2rem; letter-spacing:-.05em; } .info-page section p { max-width:620px; margin:0; color:var(--muted); font-size:.9rem; line-height:1.8; }
.business-details { margin:0 0 25px; border-top:1px solid var(--ink); } .business-details div { display:grid; grid-template-columns:140px 1fr; gap:18px; padding:18px 0; border-bottom:1px solid var(--line); } .business-details dt { color:var(--muted); font-size:.78rem; } .business-details dd { margin:0; font-size:.9rem; line-height:1.65; } .business-details address { font-style:normal; } .business-details a { color:var(--ink); } .business-note { color:var(--muted); font-size:.74rem; line-height:1.6; }
@media (max-width:760px) { .editorial-hero, .moment-index { grid-template-columns:1fr; }.hero-image, .hero-image img { min-height:390px; }.hero-image { margin-top:4px; }.moment-index { gap:26px; margin-top:80px; }.search-panel { margin-top:75px; }.catalog-grid { grid-template-columns:repeat(2,1fr); gap:18px 12px; } }
@media (max-width:580px) { .site-header { height:68px; }.header-actions { gap:15px; }.header-link { font-size:.7rem; }.login-button { padding:8px 0; font-size:.7rem; } main { padding-top:57px; }.editorial-hero h1 { font-size:3.1rem; }.hero-image, .hero-image img { min-height:350px; }.hero-note { margin-top:29px; }.moment-index { margin-top:66px; }.moment-list button { grid-template-columns:33px 1fr 18px; font-size:.84rem; }.search-panel { margin-top:62px; }.home-search { padding:31px 24px; border-radius:34px 34px 34px 8px; }.home-search textarea { min-height:175px; padding-right:50px; }.voice-input { width:41px; height:41px; }.form-bottom { align-items:flex-end; }.submit { width:54px; height:54px; }.results { margin-top:62px; } footer { align-items:flex-start; flex-direction:column; }.info-page { padding-top:65px; }.info-page h1 { font-size:2.65rem; }.business-details div { grid-template-columns:1fr; gap:6px; } }