:root {
  --paper:#f8f8f3; --ink:#1c2923; --muted:#546358; --line:#d8ded2;
  --surface:#eff2e9; --blue:#286546; --dark-blue:#174e34; --pale-blue:#e4eddf;
}
.wrap { width:min(1060px,calc(100% - 80px)); }
.bar { background:#fbfcf8; }
.nav { height:70px; }
.brand { font-size:28px; letter-spacing:-.066em; gap:9px; }
.brand img { height:30px; width:30px; }
.nav nav { gap:5px; }
.nav nav a { color:var(--ink); border-radius:7px; padding:0 12px; font-weight:620; }
.nav nav a[aria-current=page] { background:transparent; color:var(--dark-blue); }
.nav .count { background:#e5eadf; color:#38523d; }
.langs { display:flex; gap:1px; align-items:center; border-left:1px solid var(--line); margin-left:8px; padding-left:10px; }
.langs button { min-height:44px; min-width:42px; font-size:12px; color:var(--muted); }
.langs button[aria-pressed=true] { color:var(--ink); text-decoration:underline; text-decoration-color:#45855e; text-underline-offset:5px; font-weight:750; }
main { padding:0 0 34px; }
.lookup { padding:clamp(45px,6vw,86px) 0 42px; text-align:center; }
.lookup-inner { max-width:730px; margin:0 auto; }
.lookup h1 { color:var(--ink); font-size:clamp(45px,6.4vw,84px); font-weight:720; line-height:1.05; letter-spacing:-.083em; }
.lookup h1 em { font:italic 1.08em/.95 Georgia,"Times New Roman",serif; letter-spacing:-.075em; color:#376248; }
html[lang=ko] .lookup h1 em { font-family:inherit; font-size:1em; font-weight:530; font-style:normal; }
.lookup p { margin:15px auto 27px; color:var(--muted); line-height:1.55; font-size:16px; }
html[lang=ko] .lookup p {word-break:keep-all;}
.lookup-tabs { display:flex; justify-content:center; gap:4px; margin:0 auto 10px; }
.lookup-tabs button { padding:0 16px; min-height:42px; font-size:13px; font-weight:650; color:var(--muted); border-radius:24px; }
.lookup-tabs button[aria-pressed=true] { background:#dfebdb; color:#204b32; }
.primary-search { margin:0 auto; padding:6px 7px 6px 20px; background:#fff; width:100%; max-width:650px; min-height:66px; border-radius:15px; border-color:#b2c1b2; box-shadow:0 5px 0 -2px #dfe5d8; text-align:left; }
.primary-search button { background:#1e4834; padding:0 21px; height:49px; border-radius:10px; font-size:15px; }
.search:focus-within { outline-color:#83a58c; }
.primary-search input::placeholder { color:#667369; font-size:15px; }
.section-line { padding:19px 0 0; border-top:1px solid var(--line); margin:0 0 15px; }
.section-line h2,.home-guide h2 { font-weight:650; letter-spacing:-.045em; font-size:22px; }
.sample-sub { font-size:13px; color:var(--muted); }
.examples { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.spot { position:relative; min-width:0; }
.spot-link { aspect-ratio:1.83; display:block; position:relative; isolation:isolate; border-radius:14px; overflow:hidden; background:#334038; color:white; }
.spot-link::after { position:absolute; content:""; inset:0; background:linear-gradient(0deg,rgba(10,19,14,.78),transparent 73%); }
.spot-link img { width:100%; height:100%; object-fit:cover; transition:transform .25s ease-out; }
.spot-info { position:absolute; z-index:1; bottom:17px; left:17px; right:38px; display:grid; gap:4px; }
.spot-info span { font-size:11px; letter-spacing:.045em; font-weight:600; }
.spot-info strong {font-size:clamp(18px,2vw,24px); line-height:1.1; font-weight:650; letter-spacing:-.05em; overflow-wrap:anywhere;}
.spot-open {position:absolute; z-index:1; right:14px; bottom:17px;}
.spot .mark { position:absolute; top:7px; right:7px; background:rgba(18,34,24,.7); color:#fff; border:1px solid #ffffff80; border-radius:50%; width:38px; height:38px; }
.spot .mark[aria-pressed=true] { color:#1b4330; background:#e9f3df; }
@media(hover:hover){.spot-link:hover img {transform:scale(1.04)}.lookup-tabs button:hover {background:var(--surface)}}
.home-guide { max-width:none; margin:36px 0 0; padding:26px 0 0; border-top:1px solid var(--line); display:grid; grid-template-columns:minmax(190px,1fr) minmax(0,2fr); column-gap:28px;}
.home-guide h2 {grid-column:1; grid-row:1 / span 3; margin:0;}
.home-guide details {grid-column:2; border-color:var(--line);}
.home-guide details:first-of-type {border-top:0;}
.home-guide summary {cursor:pointer; font-weight:580;}
.profile {background:#eff3ea; border:1px solid var(--line); border-radius:16px; margin-top:8px;}
.profile-info .minor {color:#426b4e;}
.tabs button[aria-pressed=true] {color:var(--dark-blue);border-color:var(--blue);}
.back {margin-top:12px;}
.avatar {background:#e2ebde;}
footer { padding:17px 0 22px; font-size:12px; }
@media(max-width:690px){
  .wrap{width:calc(100% - max(18px,env(safe-area-inset-left)) - max(18px,env(safe-area-inset-right)));}
  .nav {height:58px;}.brand {font-size:23px;gap:6px;}.brand img {width:25px;height:25px;}
  .nav nav {gap:0;}.nav nav a {padding:0 6px;font-size:12px;}.nav nav a .ico {width:15px;height:15px;}
  .langs {margin-left:4px;padding-left:3px;}.langs button {font-size:11px;min-width:33px;}
  #discover-nav{display:none;}
  .lookup {padding:47px 0 33px;}.lookup h1 {font-size:clamp(44px,11.7vw,65px);}
  .lookup p {font-size:14px;line-height:1.55;max-width:320px;margin:13px auto 21px;text-wrap:balance;}
  .lookup-tabs {gap:0;margin-bottom:8px;}.lookup-tabs button{padding:0 12px;font-size:12px;min-height:44px;}
  .primary-search {min-height:56px;padding:4px 5px 4px 12px;border-radius:13px;gap:8px;}
  .primary-search input::placeholder{font-size:13px;}.primary-search button {height:44px;padding:0 13px;font-size:13px;}
  .section-line{padding-top:18px;margin-bottom:12px;}.section-line h2,.home-guide h2{font-size:20px;}.sample-sub{font-size:11px;}
  .examples{grid-template-columns:1fr;gap:9px;}
  .spot-link{aspect-ratio:auto;height:90px;display:flex;align-items:center;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:12px;}
  .spot-link img{width:90px;height:100%;flex-shrink:0;}
  .spot-link::after,.spot-open {display:none;}
  .spot-info{position:static;padding:0 45px 0 14px;gap:6px;}.spot-info span{color:var(--muted);letter-spacing:.02em;}.spot-info strong{font-size:19px;}
  .spot .mark {top:calc(50% - 22px);right:4px;background:transparent;color:#475e4a;border:0;width:44px;height:44px;}
  .home-guide{display:block;margin:25px 0 0;padding:20px 0 0;}.home-guide h2{margin-bottom:7px;}
  .back{margin-top:6px;}.profile {margin:4px 0 12px;}
}
@media(max-width:365px){.wrap{width:calc(100% - 24px);}.lookup-tabs button{padding:0 9px;}.spot-info strong{font-size:17px;}}
@media(prefers-reduced-motion:reduce){.spot-link img{transition:none;}}
