/* Pewter corner scale, for the pages people work in: the partner pages, the owner portal (intake/) and the Deal Desk
   (team/, which adds its own rules in team/round.css). Linked after a page's own styles so it wins. The marketing pages
   load partners/style.css without this file and keep their square corners. deal-room/deal-room.css repeats the same five
   sizes for the buyer Deal Room, which has its own stylesheet; tests/site.test.mjs checks the two agree.
     --r-xs   slivers: ticks, skeleton lines
     --r-sm   things you press or type in: buttons, inputs, small tiles
     --r-md   things you read: cards, notes, lists
     --r-lg   things that hold other things: panels, columns, menus, dialogs, drawers
     --r-pill filters, status chips, counts, progress bars
   An inner corner is about its holder's corner minus the gap between them.
   A coloured edge is a straight bar that stops where the corners turn (a background layer; a thick border would taper).
   --edge is its colour and --r the corner of the thing it sits on. */
:root {
  --r-xs: 4px; --r-sm: 10px; --r-md: 12px; --r-lg: 18px; --r-pill: 999px;
  --lift: 0 1px 2px rgba(20, 28, 45, .06), 0 6px 16px rgba(20, 28, 45, .07);
  --float: 0 2px 6px rgba(20, 28, 45, .08), 0 18px 44px rgba(20, 28, 45, .16);
}

/* Things you press or type in */
.btn { border-radius: var(--r-sm); }
input:not([type=checkbox]):not([type=radio]):not([type=range]), select, textarea { border-radius: var(--r-sm); }
input[type=checkbox], input[type=radio] { accent-color: var(--navy); }
input[type=range]::-webkit-slider-thumb { border-radius: 50%; transform: none; }
input[type=range]::-moz-range-thumb { border-radius: 50%; transform: none; }
.kit-skip, .menu summary { border-radius: var(--r-sm); }
.kit-yn label { border-radius: var(--r-pill); }

/* Panels and cards: the coloured top edge is --edge, navy unless a card says otherwise */
.panel, form.card, .card, .kit-seller { --edge: var(--navy); border-radius: var(--r-lg); border-top: 1px solid var(--rule);
  background-image: linear-gradient(var(--edge), var(--edge)); background-repeat: no-repeat; background-position: top center; background-size: calc(100% - 2 * var(--r-lg)) 3px; }
.kit-mandate.is-locked, .kit-mandate.is-open { border-top: 1px solid var(--rule); }
.kit-hero, .kit-seller, .kit-mandate.is-open { --edge: var(--brass); }
.kit-labs, .kit-bounty-teaser, .kit-gate, .kit-w9 { --edge: var(--oxblood); }
.kit-mandate.is-locked { --edge: var(--rule-strong); }

/* Notes and callouts: the coloured edge runs down the left */
.kit-notice, .kit-callout, .kit-lock, .kit-buyer-line { border-radius: var(--r);
  background-image: linear-gradient(var(--edge), var(--edge)); background-repeat: no-repeat; background-position: left center; background-size: 3px calc(100% - 2 * var(--r)); }
.kit-notice, .kit-callout { --r: var(--r-md); border-left: 1px solid var(--rule); }
.kit-notice { --edge: var(--ok); }
.kit-callout { --edge: var(--oxblood); }
.kit-lock, .kit-buyer-line { --r: var(--r-sm); --edge: var(--brass); border-left: 0; padding-left: 17px; }
.note, .kit-pre, .kit-lock-note, .kit-checklist > li, .kit-iframe { border-radius: var(--r-md); }
.kit-chip, .wire { border-radius: var(--r-sm); }

/* Labels, counts and progress */
.kit-badge, .kit-decision, .kit-offline, .kit-tab-count { border-radius: var(--r-pill); }
.kit-badge, .kit-decision { padding-inline: 10px; }
.kit-offline { padding-inline: 12px; }
.kit-progress li::before { border-radius: var(--r-pill); }

/* Photos of people (the logo mark stays as drawn) */
.bio-row img, .person img { border-radius: var(--r-md); }

/* The phone menu */
.menu-panel { border-radius: var(--r-md); overflow: hidden; box-shadow: var(--float); }