:root{
  --radius-xs:8px;
  --radius-s:12px;     /* icon tiles, small tiles */
  --radius-m:20px;     /* cards, list groups */
  --radius-l:26px;     /* hero cards, route + journal cards, sheets */
  --radius-xl:36px;    /* device-edge sheets */
  --radius-pill:999px; /* buttons, chips, segmented */

  --border-hairline:1px solid var(--line-hairline);
  --border-subtle:1px solid var(--line-subtle);

  /* Game-like "lip": a crisp darker bottom edge instead of a blurry drop shadow.
     Cards sit on a 3px lip; buttons on a 4px lip that collapses when pressed. */
  --lip-card:0 3px 0;/* @kind other */
  --lip-button:0 4px 0;/* @kind other */
  --shadow-card:0 0 0 1.5px var(--line-hairline),0 3px 0 var(--line-subtle);
  --shadow-float:0 0 0 1.5px var(--line-hairline),0 3px 0 var(--line-subtle),0 10px 24px rgba(40,34,26,.10);
  --shadow-sheet:0 -1px 0 var(--line-hairline),0 -10px 32px rgba(40,34,26,.10);
  --shadow-accent:0 4px 0 var(--lip-accent);
  --blur-chrome:saturate(140%) blur(20px);/* @kind other */
}
[data-theme="dark"]{
  --shadow-card:0 0 0 1.5px rgba(255,240,220,.05),0 3px 0 rgba(0,0,0,.45);
  --shadow-float:0 0 0 1.5px rgba(255,240,220,.06),0 3px 0 rgba(0,0,0,.5),0 12px 28px rgba(0,0,0,.40);
  --shadow-sheet:0 -8px 40px rgba(0,0,0,.45);
}
