/* First Light: the rounded card look from the home page, shared by every other page.
   Loaded after theme.css. Selectors start with "html body" so they win over the Tailwind utilities
   the pages already use, without editing each page's markup. */
:root, [data-theme="dark"] { --card: 240 238 232; --tint: 17 23 31; --panel: 24 28 35; }
[data-theme="light"] { --card: 255 255 255; --tint: 231 237 243; --panel: 255 255 255; }

/* A soft cool tint down the page, like the destinations section on the home page */
html body main.plate { background: linear-gradient(180deg, rgb(var(--ink)) 0, rgb(var(--tint)) 38%, rgb(var(--ink)) 100%); }

/* Panels and boxes with a hairline: rounded, on the ash panel colour */
html body :is(main,.plate) [class*="border-white/5"]:not(li):not(tr):not(td):not(hr):not(dl):not(ol):not(ul):not(header):not(footer):not(section):not([class~="border-b"]):not([class~="border-t"]),
html body :is(main,.plate) [class*="border-bone/30"]:not(a):not(button):not(input):not(select):not(textarea):not(li) {
  border-radius: 20px;
}
html body :is(main,.plate) [class*="border-white/5"][class~="border"]:is([class*=" p-"],[class^="p-"],[class*=" px-"],[class*="md:p-"]):not(li):not(a):not(button) { background-color: rgb(var(--panel)); }
html body :is(main,.plate) [class*="bg-ink"][class~="border"] { background-color: rgb(var(--panel)); }

/* Lists of rows (facts, day plan, arrival): one rounded card, rows divided inside */
html body :is(main,.plate) :is(dl,ol,ul)[class~="border-t"][class*="border-white/5"] {
  background: rgb(var(--panel)); border-top: 0; border-radius: 18px; padding: 2px 20px; }
html body :is(main,.plate) :is(dl,ol,ul)[class~="border-t"][class*="border-white/5"] > :last-child { border-bottom: 0; }
html body :is(main,.plate) [class*="gap-px"][class*="border"] { border-radius: 16px; overflow: hidden; }
html body :is(main,.plate) [class*="divide-y"][class*="border"] { border-radius: 16px; overflow: hidden; }

/* Buttons and button-like links */
html body :is(main,.plate) a[class*="uppercase"][class*="border"],
html body :is(main,.plate) button[class*="uppercase"][class*="border"],
html body :is(main,.plate) a[class*="uppercase"][class*="bg-bone"],
html body :is(main,.plate) button[class*="uppercase"][class*="bg-bone"],
html body :is(main,.plate) a[class*="border-bone/20"] { border-radius: 12px; }

/* Form fields */
html body :is(main,.plate) :is(input,select,textarea):not([type="checkbox"]):not([type="radio"]):not([class~="border-b"]) { border-radius: 12px; }

/* Trip and stay photos: rounded tiles */
html body #tPhotos figure { border-radius: 18px; border-color: transparent; }
html body #tPhotos .strip { gap: 10px; }

/* Ski maps: the same light card as the home page's place and trip cards */
html body .trip-map { background: rgb(var(--card)); color: #111; border: 0; border-radius: 18px; padding: 7px 7px 0; overflow: hidden;
  box-shadow: 0 24px 50px -28px rgba(0,0,0,.8); transition: transform .3s ease; }
html body .trip-map:hover { transform: translateY(-3px); }
html body .trip-map > span:first-child { border-radius: 12px; }
html body .trip-map span[class*="text-bone"] { color: rgba(17,17,17,.82); }
html body .trip-map span[class*="text-[10px]"] { color: rgba(17,17,17,.45); }

/* Chips stay pills */
html body :is(main,.plate) [class*="rounded-full"] { border-radius: 9999px; }

/* Grids of small facts: tinted cells inside one rounded card */
html body :is(main,.plate) [class*="gap-px"][class*="border"] > * { background-color: rgb(var(--panel)); }