.market-page { --market-ink:#243e48; --market-accent:#286354; --market-line:#dce5df; color:var(--market-ink); }
.market-page a { text-underline-offset:4px; }
.market-page .button,.market-page button,.market-dialog button[type="submit"] { background:var(--market-accent,#286354); box-shadow:none; color:white; }
.market-page a:focus-visible,.market-page summary:focus-visible,.market-dialog button:focus-visible { outline:3px solid #458b77; outline-offset:4px; }
.market-hero { position:relative; display:grid; grid-template-columns:1.25fr 1fr; align-items:center; min-height:295px; overflow:hidden; padding:42px 48px; border:1px solid #e0e7df; border-radius:26px; background:#edf1e8; }
.market-page .eyebrow { color:#526c5f; }
.market-page .eyebrow::before { background:#7b9680; }
.market-hero h1 { max-width:630px; margin:16px 0; font-size:clamp(32px,3.5vw,48px); letter-spacing:-.055em; line-height:1.25; }
.market-hero p { max-width:540px; margin-bottom:22px; color:#5f7067; line-height:1.8; font-size:15px; }
.market-text-link { display:inline-flex; align-items:center; gap:14px; color:var(--market-accent); text-decoration:none; font-weight:700; font-size:13px; }
.market-art { position:relative; width:100%; height:230px; }
.market-orbit { position:absolute; width:320px; height:320px; top:-42px; left:15%; border:1px solid #cbd7c7; border-radius:50%; }
.market-orbit::after { position:absolute; inset:35px; border:1px solid #d4ddcb; border-radius:50%; content:""; }
.market-art-sun { position:absolute; top:8px; right:8%; width:76px; height:76px; border-radius:50%; background:#e8c995; }
.market-art-ticket { position:absolute; inset:20px 7% 0 16%; display:flex; flex-direction:column; justify-content:space-between; padding:24px; border:1px solid #d4ddd1; border-radius:13px; background:#fffef4; box-shadow:8px 15px 0 #d8e1d5; transform:rotate(-8deg); }
.market-art-ticket > span { font-size:9px; letter-spacing:.2em; color:#68806a; }
.market-art-ticket strong { margin-top:13px; font-size:25px; font-weight:650; }
.market-art-ticket svg { width:100%; height:65px; color:#6c8a74; }
.market-art-ticket small { padding-top:10px; border-top:1px dashed #ccd5c7; font-size:10px; letter-spacing:.1em; color:#6b7a6e; }
.market-search { margin:24px 0 0; padding:20px 24px 0; gap:0; border:1px solid var(--market-line); border-radius:18px; background:#fff; }
.market-search-row { display:grid; grid-template-columns:minmax(0,1fr) 180px auto; align-items:end; gap:20px; padding-bottom:18px; }
.market-search-row button { min-height:45px; min-width:140px; }
.market-page label { color:#52655d; font-weight:600; }
.market-page input,.market-page select { border-color:#d9e2dc; background:#fafcf9; border-radius:10px; }
.market-filters { border-top:1px solid #edf0eb; }
.market-filters summary { display:flex; align-items:center; gap:8px; padding:14px 0; font-size:12px; font-weight:650; cursor:pointer; list-style:none; color:#627469; }
.market-filters summary::-webkit-details-marker { display:none; }
.market-filters summary::after { content:"+"; margin-left:auto; font-size:20px; line-height:1; }
.market-filters[open] summary::after { content:"−"; }
.market-filter-fields { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; padding:4px 0 18px; }
.market-filter-actions { display:flex; align-items:center; gap:20px; padding-bottom:20px; font-size:13px; }
.market-filter-actions a { color:#64736a; }
.market-active-filters { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.market-active-filters a { display:inline-flex; align-items:center; gap:12px; max-width:100%; padding:7px 12px; border-radius:8px; background:#e8efe9; color:#385647; font-size:12px; text-decoration:none; overflow-wrap:anywhere; }
.market-active-filters .market-clear { background:transparent; text-decoration:underline; }
.market-results { scroll-margin-top:25px; }
.market-results-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:34px 0 20px; }
.market-results-heading h2 { display:flex; align-items:center; gap:10px; margin:6px 0 0; font-size:24px; }
.market-count { display:inline-grid; place-items:center; min-width:26px; height:24px; padding:0 7px; border-radius:7px; background:#e7ede7; color:#55735c; font-size:12px; font-weight:650; }
.market-sort { display:flex; flex-shrink:0; gap:4px; padding:4px; border:1px solid var(--market-line); border-radius:10px; background:#edf1ed; }
.market-sort a { padding:8px 16px; border-radius:7px; color:#6a786e; font-size:13px; text-decoration:none; }
.market-sort a[aria-current] { color:#284c3c; background:#fff; box-shadow:0 2px 5px #263c3210; }
.market-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.market-card { min-width:0; overflow:hidden; border:1px solid var(--market-line); border-radius:18px; background:#fff; transition:box-shadow .18s,border-color .18s,transform .18s; }
.market-card:hover { transform:translateY(-3px); border-color:#9bb5a1; box-shadow:0 12px 28px #24482d0d; }
.market-tone-0 { --cover-bg:#dbe6dd; --cover-land:#8cac93; --cover-ink:#305440; }
.market-tone-1 { --cover-bg:#dce9eb; --cover-land:#90b4bd; --cover-ink:#30505c; }
.market-tone-2 { --cover-bg:#eee4d3; --cover-land:#c2aa83; --cover-ink:#6a5032; }
.market-tone-3 { --cover-bg:#e4e2ed; --cover-land:#aca4c6; --cover-ink:#514469; }
.market-cover { position:relative; display:flex; flex-direction:column; justify-content:space-between; height:186px; isolation:isolate; overflow:hidden; padding:22px; color:var(--cover-ink); background:var(--cover-bg); text-decoration:none; }
.market-cover::before,.market-cover::after { position:absolute; z-index:-1; content:""; pointer-events:none; }
.market-cover::before { width:210px; height:140px; right:-35px; bottom:-67px; border-radius:50% 50% 0 0; background:var(--cover-land); box-shadow:-115px 32px 0 18px var(--cover-land); transform:rotate(-20deg); opacity:.5; }
.market-cover::after { top:25px; right:30px; width:52px; height:52px; border:1px solid #ffffffa0; border-radius:50%; background:#ffffff45; }
.market-cover-label { font-size:9px; letter-spacing:.18em; }
.market-cover strong { max-width:85%; display:-webkit-box; overflow:hidden; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:28px; line-height:1.3; letter-spacing:-.04em; overflow-wrap:anywhere; }
.market-cover-bottom { display:flex; align-items:center; justify-content:space-between; font-size:11px; }
.market-cover-bottom > span { display:grid; place-items:center; width:27px; height:27px; border:1px solid #ffffffb0; border-radius:50%; background:#ffffff80; font-size:18px; }
.market-card-body { display:flex; flex-direction:column; padding:21px; }
.market-tags { display:flex; flex-wrap:wrap; gap:6px; }
.market-tags span { padding:4px 8px; border-radius:5px; background:#f1f4ee; color:#5a6c5c; font-size:10px; overflow-wrap:anywhere; }
.market-card h3 { margin:12px 0 8px; font-size:19px; line-height:1.45; }
.market-card h3 a { display:-webkit-box; overflow:hidden; min-height:55px; -webkit-line-clamp:2; -webkit-box-orient:vertical; color:var(--market-ink); text-decoration:none; overflow-wrap:anywhere; }
.market-card-description { display:-webkit-box; overflow:hidden; height:44px; margin:0 0 18px; -webkit-line-clamp:2; -webkit-box-orient:vertical; color:#748078; font-size:12px; line-height:22px; overflow-wrap:anywhere; }
.market-card-meta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; color:#748078; font-size:10px; }
.market-card footer { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid #edf0eb; }
.market-card footer .button { min-height:36px; padding:8px 12px; border-radius:8px; font-size:12px; }
.market-pagination { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; margin:26px 0; font-size:12px; color:#718074; }
.market-pagination p { margin:0; }
.market-pagination > div { display:flex; flex-wrap:wrap; gap:5px; }
.market-pagination a { display:grid; place-items:center; min-width:38px; min-height:38px; padding:8px; border:1px solid var(--market-line); border-radius:8px; color:#536558; text-decoration:none; }
.market-pagination a[aria-current] { background:#286354; color:#fff; border-color:#286354; }
.market-empty { padding:50px 24px; border:1px dashed #ccd9cc; border-radius:18px; background:#f9fbf7; text-align:center; }
.market-empty-icon { display:grid; place-items:center; width:56px; height:56px; margin:0 auto 20px; border-radius:50%; background:#e5ede1; font-size:32px; }
.market-empty p { max-width:450px; margin:0 auto 24px; color:#72806f; line-height:1.8; }
.market-how { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:20px; margin-top:32px; padding:23px 26px; border:1px solid var(--market-line); border-radius:14px; font-size:12px; color:#6f7e71; }
.market-how strong { color:#3e5745; font-size:14px; }
.market-how b { margin-right:8px; font-size:11px; color:#8b9a8b; }
.market-dialog { width:min(460px,calc(100% - 32px)); max-height:calc(100dvh - 48px); padding:32px; border:1px solid #dce5df; border-radius:22px; color:#243e48; background:#fcfdf9; box-shadow:0 24px 90px #102a3430; }
.market-dialog::backdrop { background:#192a3566; backdrop-filter:blur(5px); }
.market-dialog h2 { margin:16px 24px 12px 0; font-size:24px; overflow-wrap:anywhere; }
.market-dialog p { color:#6a786e; font-size:14px; line-height:1.8; }
.market-dialog .market-dialog-close { position:absolute; top:12px; right:12px; width:42px; height:42px; padding:0; background:transparent; color:#52695b; box-shadow:none; font-size:26px; }
body:has(.market-dialog[open]) { overflow:hidden; }
.market-back { display:inline-block; margin-bottom:22px; color:#5d7163; font-size:13px; text-decoration:none; }
.market-detail-hero { padding:40px; border-radius:22px; background:var(--cover-bg); }
.market-detail-hero h1 { max-width:950px; margin:18px 0 24px; line-height:1.25; color:var(--cover-ink); overflow-wrap:anywhere; }
.market-detail-tags { display:flex; flex-wrap:wrap; gap:8px; }
.market-detail-tags span { padding:6px 12px; border:1px solid #ffffff70; border-radius:8px; background:#ffffff60; font-size:12px; }
.market-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:start; gap:28px; margin-top:28px; }
.market-about { padding:10px 0 24px; }
.market-about p { white-space:pre-line; overflow-wrap:anywhere; color:#68766e; line-height:1.9; }
.market-use-panel { position:sticky; top:24px; padding:26px; border:1px solid var(--market-line); border-radius:18px; background:#fff; scroll-margin-top:20px; }
.market-use-panel h2 { margin:14px 0 12px; font-size:23px; }
.market-use-panel p { color:#6a786e; font-size:13px; line-height:1.8; }
.market-budget { padding:12px 0 18px; margin-bottom:18px; border-bottom:1px solid var(--market-line); font-size:14px; font-weight:650; }
.market-like { margin-top:10px; }
.market-like .ghost { border:1px solid var(--market-line); background:white; color:#647b6b; }
.market-use-panel > .button { width:100%; }
.market-use-panel small { display:block; margin-top:18px; color:#778377; font-size:11px; line-height:1.8; }
@media (max-width:1000px) { .market-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }.market-hero { padding:30px; }.market-art-ticket { inset:20px 7% 0 8%; }.market-detail-layout { grid-template-columns:minmax(0,1fr) 280px; gap:20px; }.market-use-panel { padding:20px; } }
@media (max-width:640px) { .market-hero { display:block; min-height:0; padding:28px 24px; }.market-hero h1 { font-size:32px; }.market-art { display:none; }.market-hero p { font-size:13px; }.market-search { padding:16px 16px 0; margin-top:16px; }.market-search-row { grid-template-columns:minmax(0,1fr) 100px; gap:14px; }.market-search-row button { grid-column:1/-1; }.market-filter-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.market-results-heading { align-items:end; margin-top:26px; }.market-results-heading h2 { font-size:21px; }.market-sort a { padding:8px 12px; }.market-grid { grid-template-columns:1fr; gap:20px; }.market-cover { height:190px; }.market-card h3 a { min-height:0; }.market-card-body { padding:20px; }.market-card footer .button { min-height:42px; }.market-how { display:grid; grid-template-columns:1fr; gap:14px; padding:22px; }.market-pagination { justify-content:center; text-align:center; }.market-detail-hero { padding:28px 24px; }.market-detail-layout { grid-template-columns:1fr; }.market-use-panel { position:static; grid-row:1; }.market-detail .trip-overview { padding:18px; }.market-dialog { padding:28px 22px; } }
@media (prefers-reduced-motion:reduce) { .market-card { transition:none; }.market-card:hover { transform:none; } }