/* YAPP SHOP: colour, depth and short, purposeful feedback. */
:root {
  --ink: #192641;
  --muted: #56657d;
  --blue: #2e50cf;
  --green: #2e50cf;
  --accent: #2e50cf;
  --paper: #f6f8fd;
  --bg: #f6f8fd;
  --line: #dce4f0;
  --tint: #eef2ff;
  --mint: #eef2ff;
  --section-accent: #2e50cf;
  --section-soft: #eef2ff;
  --section-border: #d1dcf7;
  --motion-fast: 150ms;
  --motion-normal: 240ms;
  --motion-ease: cubic-bezier(.2,.75,.25,1);
}
body { background: linear-gradient(145deg,#f1f5ff 0,transparent 580px),var(--paper); }
body[data-browse=travel] { --section-accent:#086789; --section-soft:#eaf6fa; --section-border:#bcdde8; }
body[data-browse=golf] { --section-accent:#17664e; --section-soft:#edf7f1; --section-border:#c2dfcf; }
body[data-browse=books] { --section-accent:#805319; --section-soft:#fcf4e6; --section-border:#e9d6b6; }
body[data-browse=kobo] { --section-accent:#6b458f; --section-soft:#f4effb; --section-border:#dbcdec; }
.header,.site-header { background:linear-gradient(180deg,#fff,#fbfcff); border-bottom:1px solid #edf0f7; }
.brand img { filter:drop-shadow(0 3px 5px #294a9024); }
.header .save-nav,.global-text-size { box-shadow:0 2px 5px #24446c06,inset 0 1px #fff; }
.browse-nav a { --nav-accent:#2e50cf; --nav-soft:#edf2ff; border-radius:10px 10px 0 0; }
.browse-nav a[href*="mode=travel"] { --nav-accent:#086789; --nav-soft:#eaf6fa; }
.browse-nav a[href*="mode=golf"] { --nav-accent:#17664e; --nav-soft:#edf7f1; }
.browse-nav a[href*="mode=books"] { --nav-accent:#805319; --nav-soft:#fcf4e6; }
.browse-nav a[href*="mode=kobo"] { --nav-accent:#6b458f; --nav-soft:#f4effb; }
.browse-nav a[aria-current] { background:var(--nav-soft); color:var(--nav-accent); }
.browse-nav a::after { background:var(--nav-accent); opacity:0; transform:scaleX(.65); transform-origin:center; }
.browse-nav a[aria-current]::after { background:var(--nav-accent); opacity:1; transform:scaleX(1); }
.hero-intro h1 em { color:#2e50cf; }
.hero-search-panel { border-color:#d7e1f4; background:linear-gradient(145deg,#fff,#f8faff); box-shadow:0 12px 32px #1d3e7810,inset 0 1px #fff; }
.hero-search-panel:focus-within { border-color:#a5b8eb; box-shadow:0 10px 30px #244dc015,0 0 0 3px #2e50cf0d; }
.visual-tile,.category-shortcuts a { box-shadow:0 6px 16px #1c365014; }
.visual-tile::after { background:linear-gradient(transparent,#101e39e6); }
.collage-stamp { color:#2e50cf; border-color:#edf2ff; box-shadow:0 8px 22px #153c6b24; }
.category-shortcuts a { --tile-accent:#2e50cf; --tile-soft:#edf2ff; }
.category-shortcuts a[href*="mode=travel"] { --tile-accent:#086789; --tile-soft:#eaf6fa; }
.category-shortcuts a[href*="mode=golf"] { --tile-accent:#17664e; --tile-soft:#edf7f1; }
.category-shortcuts a[href*="mode=books"] { --tile-accent:#805319; --tile-soft:#fcf4e6; }
.category-shortcuts a[href*="mode=kobo"] { --tile-accent:#6b458f; --tile-soft:#f4effb; }
.category-shortcuts .category-number { color:var(--tile-accent); background:var(--tile-soft); border-radius:5px; padding:2px 7px; }
.category-shortcuts .category-copy { background:linear-gradient(110deg,#fff,var(--tile-soft)); }
.category-shortcuts .category-copy>b { color:var(--tile-accent); }
.finder { border-color:var(--section-border); box-shadow:0 8px 26px #203e6810; }
.finder h2 { color:var(--section-accent); }
.finder .category-banner { background:var(--section-soft); }
.finder input:not([type=checkbox]),.finder select,.easy-search input,.catalog-toolbar select,.result-tools input,.result-tools select {
  background:#fff; border-color:#8797b0; box-shadow:inset 0 1px 3px #15315606;
}
input::placeholder { color:#67768b; opacity:1; }
input:not([type=checkbox]):focus,select:focus { border-color:var(--section-accent); box-shadow:0 0 0 3px #2e50cf10; }
.button.primary,.primary,.easy-search button,.purchase-cta,.search-button {
  color:#fff; border-color:#2847bd;
  background:linear-gradient(160deg,#395fdc,#2d4ccc);
  box-shadow:0 4px 10px #284abc26,inset 0 1px 0 #ffffff35;
  text-shadow:0 1px 1px #18347622;
}
.finder [type=submit],body[data-browse] .purchase-cta {
  background:var(--section-accent); border-color:var(--section-accent); box-shadow:0 4px 9px #203e6820,inset 0 1px #ffffff26;
}
.compact-actions .select-product,.secondary,.button.secondary,.result-choice button {
  background:#f0f4fc; border-color:#bfcee6; color:#24467e; box-shadow:inset 0 1px #fff;
}
.compact-actions .select-product[aria-pressed=true],.result-choice button[aria-pressed=true] {
  color:#17664e; background:#eaf6ef; border-color:#8fbfa5; box-shadow:inset 0 0 0 1px #a9d2ba;
}
.choice-guide { background:linear-gradient(120deg,#eef3ff,#f5f7ff); border-color:#d9e2f6; }
.choice-buttons button[aria-pressed=true] { background:#2e50cf; border-color:#2e50cf; color:#fff; box-shadow:0 3px 7px #294abc20; }
.catalog-toolbar { background:linear-gradient(100deg,#fff,#f4f7ff); box-shadow:0 3px 9px #223f6d06; }
.ranking-help summary { color:#476080; }
.compact-product,.result-card { background:linear-gradient(140deg,#fff 65%,#fafcff); border-color:#dce4ef; box-shadow:0 4px 14px #24385308; }
.compact-product .card-image { background:radial-gradient(ellipse at 50% 35%,#fff,#edf2fa); border:1px solid #e8edf5; overflow:hidden; }
.compact-product .compact-kicker .card-brand,.compact-product .card-model { color:#56667e; }
.compact-product .launch-date { color:#56667e; }
.compact-product .launch-date strong { color:#253653; }
.compact-review .source-link { color:#2c50bf; }
.compact-specs span { color:#435879; background:#edf2fa; border-color:#dde6f2; }
.compact-facts dt { color:#56657d; }
.rank-badge { background:#edf2ff; color:#294ead; border:1px solid #d6e0f8; }
.compact-product:nth-child(1) .rank-badge { background:linear-gradient(130deg,#fff6df,#f7e5ba); border-color:#e6cea0; color:#755017; box-shadow:0 2px 4px #8154110c; }
.compact-product:nth-child(2) .rank-badge { background:#eef2f7; border-color:#d4deea; color:#465b76; }
.compact-product:nth-child(3) .rank-badge { background:#f8eee5; border-color:#e8d4c2; color:#7b5437; }
.result-card.is-selected { border-width:1px; border-color:var(--section-accent); box-shadow:0 0 0 1px var(--section-accent),0 6px 20px #203e6812; }
.result-photo { overflow:hidden; }
.result-price { color:var(--section-accent); }
.result-rating>strong { color:var(--section-accent); }
.rating-breakdown { color:#3d526c; background:var(--section-soft); }
.rating-breakdown b { color:var(--section-accent); }
#comparison-summary { background:linear-gradient(115deg,#edf3ff,#f9fbff 70%); border:1px solid #c4d4ef; border-left:4px solid #3d63d2; box-shadow:0 7px 24px #234a8510; }
.winner-price { color:#284abf; }
.winner-label { color:#223967; }
.winner-qualifier,.winner-note,.winner-hint { color:#4c607d; }
.selection-tray,.compare-bar { background:linear-gradient(115deg,#17284d,#244169); border:1px solid #354d71; box-shadow:0 12px 35px #14274435; }
.selection-tray .primary,.compare-bar .primary { color:#24467e; background:#fff; border-color:#fff; text-shadow:none; box-shadow:0 3px 8px #06172c1a; }
.selection-warning,.review-caution { color:#82581f; }
.selection-warning { background:#fff8e8; border-color:#ead3a8; }
.search-message.error { color:#8b3a23; background:#fff4ec; border-color:#e6b9a6; }
.search-message[aria-busy=true],#search-status:not(:empty) { color:#365880; }
.selection-dialog,#drawer { border:1px solid #d8e2f1; box-shadow:0 24px 75px #1025483b; }
.selection-dialog::backdrop,#drawer::backdrop { background:#14254472; backdrop-filter:blur(3px); }
.selection-dialog-head,#drawer .drawer-head { background:#f8faff; border-color:#dce5f4; }
.compact-detail>summary,.ranking-help>summary,.guide-filter-details>summary,.result-description>summary { border-radius:6px; }
.compact-detail[open]>summary,.ranking-help[open]>summary { color:#264ba8; }
.compact-detail[open] { border-color:#ccdaf1; }
button.is-busy { display:inline-flex; align-items:center; justify-content:center; gap:9px; opacity:.88; cursor:progress; }
button.is-busy::before { content:""; flex:none; width:16px; height:16px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; }
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,[tabindex]:focus-visible {
  outline:3px solid #9d510a; outline-offset:4px;
}
@media(hover:hover) and (pointer:fine) {
  .browse-nav a:hover { color:var(--nav-accent); background:var(--nav-soft); }
  .browse-nav a:hover svg { transform:translateY(-2px); }
  .browse-nav a:hover::after { opacity:.4; transform:scaleX(.9); }
  .browse-nav a[aria-current]:hover::after { opacity:1; transform:scaleX(1); }
  .button.primary:hover,.primary:hover,.easy-search button:hover,.purchase-cta:hover,.search-button:hover { background:#2445ba; border-color:#2445ba; color:#fff; box-shadow:0 7px 16px #284abc30,inset 0 1px #ffffff25; }
  .finder [type=submit]:hover,body[data-browse] .purchase-cta:hover { background:var(--section-accent); border-color:var(--section-accent); filter:brightness(.94); }
  .selection-tray .primary:hover,.compare-bar .primary:hover { background:#eef3ff; color:#24467e; border-color:#eef3ff; }
  .compact-actions .select-product:hover,.secondary:hover,.button.secondary:hover,.result-choice button:hover { background:#e6edfb; border-color:#91a9d5; color:#234780; }
  .compact-actions .select-product[aria-pressed=true]:hover,.result-choice button[aria-pressed=true]:hover { background:#dff0e6; color:#17664e; border-color:#77aa90; }
  .compact-product:hover,.result-card:hover { border-color:#b6c9e5; box-shadow:0 9px 25px #24385313; }
  .result-card.is-selected:hover { border-color:var(--section-accent); box-shadow:0 0 0 1px var(--section-accent),0 9px 25px #24385313; }
  .compact-visual .card-image:hover img,.result-photo a:hover img { transform:scale(1.035); }
  .category-shortcuts a:hover { transform:translateY(-3px); border-color:#aebfda; box-shadow:0 12px 25px #223f6d20; }
  .visual-tile:hover>img { transform:scale(1.035); }
  .visual-tile:hover .tile-arrow,.category-shortcuts a:hover .category-copy>b { transform:translateX(3px); }
  .compact-detail>summary:hover,.ranking-help>summary:hover,.guide-filter-details>summary:hover,.result-description>summary:hover { background:#eaf0fb; color:#264ba8; }
}
@media(prefers-reduced-motion:no-preference) {
  button,a,input,select,summary,.hero-search-panel,.compact-product,.result-card {
    transition:color var(--motion-fast),background-color var(--motion-fast),border-color var(--motion-fast),box-shadow var(--motion-normal) var(--motion-ease),transform var(--motion-fast) var(--motion-ease);
  }
  .browse-nav svg,.browse-nav a::after,.tile-arrow,.category-copy>b { transition:transform var(--motion-normal) var(--motion-ease),opacity var(--motion-fast); }
  .visual-tile>img,.card-image img,.result-photo img { transition:transform 360ms var(--motion-ease); }
  button:active:not(:disabled),.button:active,.purchase-cta:active { transform:translateY(1px) scale(.99); }
  .hero-intro { animation:shop-arrive 360ms var(--motion-ease) both; }
  .visual-collage { animation:shop-arrive 420ms 60ms var(--motion-ease) both; }
  .finder:not([hidden]) { animation:shop-arrive 250ms var(--motion-ease) both; }
  button.is-busy::before { animation:shop-spin 900ms linear infinite; }
  .selection-dialog[open],#drawer[open] { animation:shop-arrive 220ms var(--motion-ease) both; }
  .selection-dialog[open]::backdrop,#drawer[open]::backdrop { animation:shop-fade 180ms ease-out both; }
  .selection-tray:not([hidden]),.compare-bar:not([hidden]) { animation:shop-fade 180ms ease-out both; }
  .compact-detail[open]>:not(summary),.ranking-help[open]>:not(summary),.result-description[open]>:not(summary) { animation:shop-arrive 180ms var(--motion-ease) both; }
}
@keyframes shop-arrive { from { opacity:.65; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
@keyframes shop-fade { from { opacity:.45; } to { opacity:1; } }
@keyframes shop-spin { to { transform:rotate(360deg); } }
@media(max-width:600px) {
  .hotel-note h1 .title-part { white-space:normal; overflow-wrap:anywhere; }
  .browse-nav a,.large-text .browse-nav a { border-radius:9px; }
  .browse-nav a[aria-current] { background:var(--nav-soft); color:var(--nav-accent); box-shadow:inset 0 0 0 1px var(--nav-accent); }
  .compact-product { box-shadow:0 3px 10px #24385308; }
  .selection-dialog::backdrop,#drawer::backdrop { backdrop-filter:none; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .visual-tile:hover>img,.compact-visual .card-image:hover img,.result-photo a:hover img,.category-shortcuts a:hover,.browse-nav a:hover svg,.visual-tile:hover .tile-arrow,.category-shortcuts a:hover .category-copy>b { transform:none; }
}