/* Reset + globals */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: 'Manrope', system-ui, sans-serif;
  background: #E5DFCF;
  color: #0F2A1B;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; padding: 0; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }

/* Shared accent — overwritten by tweak */
:root {
  --accent: #6E8E3A;
  --accent-soft: #DAEACD;
  --accent-soft-ink: #355C1E;
  --accent-strong-ink: #2D4A1A;
}

/* Light / dark token sets — scoped to each variant root via [data-theme] */
[data-theme="light"] {
  --paper: #F2EDE3;
  --paper-2: #E8E2D3;
  --ink: #0F2A1B;
  --ink-2: #1F3A2A;
  --ink-muted: #4D5E51;
  --ink-faint: #7A8A7C;
  --line: rgba(15, 42, 27, 0.12);
  --line-strong: rgba(15, 42, 27, 0.22);
  --card: #FFFFFF;
  --card-2: #FBF7EE;

  /* Status — error */
  --danger:      #B5371D;
  --danger-soft: #F7DCD2;
  --danger-ink:  #6F2010;
}
[data-theme="dark"] {
  --paper: #0E1C14;
  --paper-2: #152922;
  --ink: #EFE9DA;
  --ink-2: #DED7C5;
  --ink-muted: #9DAFA1;
  --ink-faint: #6A7A6F;
  --line: rgba(239, 233, 218, 0.13);
  --line-strong: rgba(239, 233, 218, 0.24);
  --card: #182B22;
  --card-2: #1F3A2C;

  /* Status — error */
  --danger:      #E08770;
  --danger-soft: #3A1A12;
  --danger-ink:  #F7C7B7;
}

/* Tiny utility for screen-reader hiding */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* image-slot overlay covers (project cards, case-study covers) — hide the
   default empty UI and dashed ring so the underlying stylized cover shows
   through cleanly. Drops still work; uploads happen via the Console. */
.pj-cover-wrap { position: relative; width: 100%; height: 100%; }
.pj-cover-wrap image-slot {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}
.pj-cover-wrap image-slot::part(empty),
.pj-cover-wrap image-slot::part(ring) {
  display: none !important;
}