/* v1. Served max-age=604800: never edit in place, ship a new name.
 * The #interface dashboard without the tablet (patches/hero_board_0927, the
 * operator 2026-09-27: "I don't like the thick black rounding around it").
 *
 * The device was .ss-card: 0.75rem of #222 bezel, a 1px metal gradient ring,
 * 30px corners and a six-layer drop shadow (scraper-scroll.v3.css), plus a
 * diagonal sheen (::before). Now the dashboard lies on the page as a panel,
 * the way the app draws its own cards: no bezel, a hairline edge, 14px
 * corners, a soft shadow. The scroll tilt (rotateX from the bundle) stays.
 *
 * Loaded after every other stylesheet; #interface outranks their selectors.
 * Phones do not show .ss-card at all (landing-mobile.v6.css draws phone
 * mock-ups there), so nothing here is scoped by width except the swipe fade.
 */
#interface .ss-card {
  padding: 0;
  border: 1px solid hsl(var(--line-strong) / .75);
  border-radius: 14px;
  background: hsl(var(--bg));
  box-shadow:
    0 1px 2px hsl(var(--deep) / .05),
    0 14px 34px -10px hsl(var(--deep) / .16),
    0 44px 90px -30px hsl(var(--deep) / .16);
}
#interface .ss-card::before { display: none; }
#interface .ss-screen { border-radius: 13px; }
/* the callout layer was inset by the bezel; there is no bezel now */
#interface .sc-layer { inset: 0; }
/* the swipe fade at the right edge (narrow screens) faded into the black
   bezel; it fades into the page now */
#interface .ss-card::after {
  top: 0; right: 0; bottom: 0;
  border-radius: 0 13px 13px 0;
  background: linear-gradient(to left, hsl(var(--bg)) 8%, hsl(var(--bg) / 0) 100%);
}