html[data-shop] #island-map-knop,
html[data-shop] #kaart-island-map-knop { display: none; }
.shop-attribution { color: inherit; text-decoration: none; font-family: Jost,sans-serif; font-size: 16px; }
.shop-attribution small { display:block; margin-top:6px; font-size:12px; }
.shop-continue { display:flex; }
.shop-continue .verken-knop { flex:1; }
.shop-continue .verken-knop + .verken-knop { border-left:1px solid rgba(255,254,250,.34); }
html[data-shop] .koop-link { background:#443a30; color:#fffefa; }
html[data-shop] .koop-link:hover { background:#5b4c3f; }
.world-boundary-rectangle {
  position:absolute;
  z-index:2;
  box-sizing:border-box;
  border-style:solid;
  border-color:rgba(162,157,150,.18);
}

/* Your Path is the same translucent card, given a quiet place beside the shop.
   Only the available viewport changes; every product keeps its world address. */
.shop-trail[hidden], .shop-trail-expand[hidden] { display: none; }
.shop-trail, .shop-trail-expand { display: none; }
@media (min-width: 1200px) {
  html[data-shop] { --shop-trail-width: clamp(320px, 25vw, 380px); --shop-trail-space: calc(var(--shop-trail-width) + 40px); }
  .has-shop-trail #veld { right: var(--shop-trail-space); overflow: hidden; }
  .has-shop-trail .kaart-modal::before { right: var(--shop-trail-space); }
  .has-shop-trail .flip-kaart { max-width: calc(100vw - var(--shop-trail-space) - 32px); }
  .shop-trail:not([hidden]) {
    position: fixed;
    inset: 22px 22px 22px auto;
    z-index: 80;
    width: var(--shop-trail-width);
    height: auto;
    padding: 12px 12px 0;
    display: flex;
    border-radius: 26px;
    background: rgba(252, 250, 244, .72);
    box-shadow: 0 2px 4px rgba(35, 31, 28, .04), 0 14px 38px rgba(35, 31, 28, .08);
    transform: none;
    animation: shop-trail-arrive 650ms cubic-bezier(.16, 1, .3, 1) both;
  }
  .shop-trail .ghost-frame { padding: 25px 18px 12px; border-radius: 17px; }
  .shop-trail-heading { position: relative; padding: 0 6px; }
  .shop-trail .context-label { margin: 0 30px 0 0; font-size: 7px; letter-spacing: .1em; }
  .shop-trail .ghost-title {
    margin-top: 18px;
    font-family: Jost, sans-serif;
    font-size: 37px;
    font-weight: 500;
    letter-spacing: -.035em;
    line-height: 1.05;
  }
  .shop-trail .ghost-title::after { width: 36px; height: 1px; margin-top: 16px; background: var(--ghost-dash); }
  .shop-trail-fold {
    position: absolute;
    top: -8px;
    right: -4px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(68, 58, 48, .22);
    border-radius: 50%;
    background: transparent;
    color: var(--ghost-ink);
    cursor: pointer;
    transition: background 180ms, transform 180ms;
  }
  .shop-trail-fold svg { width: 16px; height: 16px; }
  .shop-trail-fold:hover { background: rgba(255, 255, 255, .7); transform: translateX(2px); }
  .shop-trail-lead { margin: 16px 0 0; font: 13px/1.6 Jost, sans-serif; color: var(--ghost-soft); }
  .shop-trail-rule {
    margin: 23px 5px 15px;
    padding-bottom: 11px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px dashed var(--ghost-dash);
    color: var(--ghost-soft);
    font-size: 7px;
    letter-spacing: .12em;
  }
  .shop-trail .pad-tijdlijn { padding: 0 4px 12px 0; scrollbar-width: thin; }
  .shop-trail .pad-hoofdstuk + .pad-hoofdstuk { margin-top: 23px; }
  .shop-trail .pad-hoofdstuk-kop { padding: 12px 12px 13px; border-color: rgba(68, 58, 48, .23); background: rgba(255, 255, 255, .2); }
  .shop-trail .pad-hoofdstuk-kop strong { font: 500 17px/1.22 Jost, sans-serif; white-space: normal; }
  .shop-trail .pad-hoofdstuk-kop em { font-size: 8px; line-height: 1.5; }
  .shop-trail .pad-hoofdstuk-kop small { font-size: 7px; letter-spacing: .09em; }
  .shop-trail .pad-hoofdstuk-momenten { margin: 6px 0 0 6px; }
  .shop-trail .pad-hoofdstuk-momenten::before { left: 35px; background: linear-gradient(var(--ghost-dash), rgba(68, 58, 48, .12)); }
  .shop-trail .pad-moment { min-height: 104px; grid-template-columns: 72px minmax(0, 1fr); gap: 13px; padding: 11px 6px 11px 0; }
  .shop-trail .pad-mini { width: 70px; height: 82px; border-radius: 12px; border-color: rgba(68, 58, 48, .22); background: rgba(255, 254, 250, .85); box-shadow: 0 3px 5px rgba(35,31,28,.04), 0 7px 16px rgba(35,31,28,.07); }
  .shop-trail .pad-mini img { padding: 5px; }
  .shop-trail .pad-moment-tekst small { font-size: 7px; letter-spacing: .09em; }
  .shop-trail .pad-moment-tekst strong { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; white-space: normal; font: 500 16px/1.22 Jost, sans-serif; }
  .shop-trail .pad-moment-tekst em { font-size: 8px; line-height: 1.55; }
  .shop-trail .pad-moment.is-departure .pad-mini { border-color: rgba(117, 87, 57, .5); background: rgba(231, 217, 194, .42); box-shadow: 0 6px 14px rgba(87, 65, 42, .1); }
  .shop-trail .pad-moment.is-departure .pad-moment-tekst small { color: #785738; }
  .shop-trail .pad-moment.is-new-moment { animation: shop-trail-step 550ms cubic-bezier(.16, 1, .3, 1) both; }
  .shop-trail .pad-vergeet { margin-top: 14px; font-size: 7px; min-height: 28px; }
  .shop-trail .ghost-foot { flex-basis: 44px; gap: 7px; padding: 0 4px; font-size: 6px; letter-spacing: .09em; }
  .shop-trail-private { font-size: 15px; }
  .shop-trail-expand:not([hidden]) {
    position: fixed;
    top: 26px;
    right: 26px;
    z-index: 80;
    padding: 12px 15px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px dashed rgba(68, 58, 48, .38);
    border-radius: 16px;
    background: rgba(252, 250, 244, .82);
    backdrop-filter: blur(7px);
    color: #443a30;
    box-shadow: 0 5px 18px rgba(35,31,28,.07);
    font: 14px Jost, sans-serif;
    cursor: pointer;
  }
  .shop-trail-expand svg { width: 19px; height: 19px; }
  .shop-trail-expand span { font: 9px 'JetBrains Mono', monospace; opacity: .55; }
  .shop-trail-expand:hover { background: #fffefa; }
  .shop-trail-fold:focus-visible, .shop-trail-expand:focus-visible { outline: 2px solid #443a30; outline-offset: 4px; }
}
@keyframes shop-trail-arrive { from { opacity: 0; translate: 20px 0; } to { opacity: 1; translate: 0 0; } }
@keyframes shop-trail-step { from { opacity: 0; translate: 0 10px; } to { opacity: 1; translate: 0 0; } }
@media (prefers-reduced-motion: reduce) {
  .shop-trail:not([hidden]), .shop-trail .pad-moment.is-new-moment { animation: none; }
  .shop-trail * { transition: none !important; }
}

/* Didriksons: card-owned exploration pad, adapted from the approved Hout2 demo. */

html[data-tracking] .verken-richtingen[hidden] { display: none; }
html[data-tracking] .detail-beeldvak { flex-basis: 25%; }
html[data-tracking] .detail-info { padding: 12px 30px 20px; overflow-y: auto; }
html[data-tracking] .has-detail-image #detail-beeld { padding: 90px 30px 50px; }
html[data-tracking] .verken-overlay { position: static; width: 100%; max-width: none; transform: none; margin-top: auto; flex-shrink: 0; background: transparent; border: 1px solid rgba(68,58,48,.4); box-shadow: none; }
html[data-tracking] .verken-knop--secondary { color: #443a30; text-shadow: none; }
html[data-tracking] .tracking-product-meta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); align-items: center; gap: 16px; margin-bottom: 12px; flex-shrink: 0; }
html[data-tracking] .tracking-product-meta .detail-merchant { margin: 0 0 3px; }
html[data-tracking] .tracking-product-meta .detail-prijs { margin: 0; }
html[data-tracking] .tracking-product-meta .koop-link { min-width: 0; min-height: 60px; padding: 0 20px; background: #443a30; border-color: #443a30; color: #fffefa; font-size: 19px; box-shadow: 0 5px 14px rgba(68,58,48,.18); }
html[data-tracking] .tracking-product-meta .koop-link:hover { background: #5b4c3e; border-color: #5b4c3e; }
html[data-tracking] .tracking-product-meta .koop-link:focus-visible { outline: 3px solid #443a30; outline-offset: 3px; }
html[data-tracking] .detail-beschrijving { flex-shrink: 0; -webkit-line-clamp: 2; font-size: 14px; line-height: 1.35; margin: 0 0 8px; }
html[data-tracking] .tracking-panel { display: flex; flex-direction: column; align-items: center; color: #443a30; cursor: default; }
html[data-tracking] .tracking-heading { display: none; }
html[data-tracking] .tracking-layout { display: grid; grid-template-columns: 90px 210px 90px; grid-template-rows: auto 210px auto; align-items: center; }
html[data-tracking] .tracking-label { font-size: 17px; line-height: 1.25; text-align: center; }
html[data-tracking] .tracking-label--top { grid-area: 1 / 2; padding-bottom: 8px; }
html[data-tracking] .tracking-label--left { grid-area: 2 / 1; padding-right: 12px; }
html[data-tracking] .tracking-label--right { grid-area: 2 / 3; padding-left: 12px; }
html[data-tracking] .tracking-label--bottom { grid-area: 3 / 2; padding-top: 8px; }
html[data-tracking] .tracking-pad { grid-area: 2 / 2; width: 100%; height: 100%; position: relative; border: 1px solid rgba(68,58,48,.42); background: rgba(238,232,220,.28); touch-action: none; user-select: none; cursor: crosshair; }
html[data-tracking] .tracking-axis { position: absolute; pointer-events: none; background: rgba(68,58,48,.18); }
html[data-tracking] .tracking-axis--horizontal { top: 50%; left: 0; height: 1px; width: 100%; }
html[data-tracking] .tracking-axis--vertical { left: 50%; top: 0; width: 1px; height: 100%; }
html[data-tracking] .flip-achter .tracking-ball { position: absolute; width: 58px; height: 58px; border: 0; background: transparent; padding: 0; transform: translate(-50%, -50%); touch-action: none; cursor: grab; }
html[data-tracking] .tracking-ball::before { content: ''; display: block; width: 28px; height: 28px; margin: auto; background: #443a30; border-radius: 50%; box-shadow: 0 0 0 5px #fffefa, 0 3px 8px rgba(68,58,48,.18); }
html[data-tracking] .tracking-pad.is-dragging .tracking-ball { cursor: grabbing; }
html[data-tracking] .tracking-summary { text-align: center; min-height: 36px; max-width: 470px; font-size: 16px; line-height: 1.3; margin: 10px 0 3px; }
html[data-tracking] .tracking-price-context { text-align: center; font-size: 12px; line-height: 1.3; margin: 0 0 12px; color: #756f64; }
html[data-tracking] .tracking-explore { width: 100%; min-height: 48px; margin-bottom: 8px; padding: 0 24px; border: 1px solid rgba(68,58,48,.5); border-radius: 9px; background: transparent; color: #443a30; font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
html[data-tracking] .tracking-explore:hover { background: rgba(238,232,220,.4); }
html[data-tracking] .tracking-explore:disabled { opacity: .5; cursor: wait; }

@media (max-width: 700px) {
  html[data-tracking] .detail-beeldvak { flex-basis: 22%; }
  html[data-tracking] .has-detail-image #detail-beeld { padding: 58px 16px 10px; }
  html[data-tracking] .detail-info { padding: 8px 12px 9px; overflow-y: auto; }
  html[data-tracking] .tracking-product-meta { gap: 12px; margin-bottom: 8px; }
  html[data-tracking] .tracking-product-meta .koop-link { min-height: 48px; padding: 0 12px; font-size: 14px; }
  html[data-tracking] .tracking-heading { margin: 8px 0 5px; font-size: 9px; letter-spacing: .03em; }
  html[data-tracking] .tracking-layout { grid-template-columns: 62px 140px 62px; grid-template-rows: auto 140px auto; }
  html[data-tracking] .tracking-label { font-size: 12px; }
  html[data-tracking] .tracking-label--left { padding-right: 5px; }
  html[data-tracking] .tracking-label--right { padding-left: 5px; }
  html[data-tracking] .tracking-label--top { padding-bottom: 2px; }
  html[data-tracking] .tracking-label--bottom { padding-top: 2px; }
  html[data-tracking] .flip-achter .tracking-ball { width: 50px; height: 50px; }
  html[data-tracking] .tracking-ball::before { width: 22px; height: 22px; box-shadow: 0 0 0 4px #fffefa; }
  html[data-tracking] .tracking-summary { font-size: 11px; min-height: 28px; max-width: 275px; margin: 4px 0; }
  html[data-tracking] .tracking-price-context { font-size: 9px; line-height: 1.2; margin-bottom: 4px; }
  html[data-tracking] .tracking-explore { min-height: 40px; font-size: 12px; margin-bottom: 4px; }
}
@media (max-width: 700px) and (max-height: 730px) {
  html[data-tracking] .detail-beeldvak { flex-basis: 17%; }
  html[data-tracking] .tracking-layout { grid-template-columns: 60px 120px 60px; grid-template-rows: auto 120px auto; }
  html[data-tracking] .tracking-heading { display: none; }
  html[data-tracking] .tracking-price-context { display: none; }
}

html[data-tracking] .shop-continue .verken-knop + .verken-knop { border-color: rgba(68,58,48,.25); }
html[data-tracking] .tracking-product-meta .detail-acties { margin: 0; }
html[data-tracking] .tracking-product-meta .koop-link { width: 100%; }
@media (max-width: 700px) { html[data-tracking] .detail-beschrijving { font-size: 11px; -webkit-line-clamp: 2; margin-bottom: 4px; } }
/* The pad needs more estate on a narrow screen; leave the field cards intact. */
@media (max-width: 700px) {
  html[data-tracking] .flip-kaart { height: min(94dvh, 680px); aspect-ratio: auto; }
}

/* Quiet maker identity; the purchase action keeps its own emphasis. */
.card-maker-signature { color:inherit; text-decoration:none; }
.card-maker-signature:hover, .card-maker-signature:focus-visible { text-decoration:underline; text-underline-offset:3px; }
.card-maker-signature:focus-visible { outline:2px solid #443a30; outline-offset:4px; }