/* Pullstring — flat layer (v0.57). Loaded last: turns the see-through jelly vinyl into solid toy-box colour.
   No shine, no blur, no welded seams, no glitter. Buttons are solid blocks with an ink outline.
   Colours still come from the wrapper: --v1 main, --v2 button, --v3 soft, --v-ink text/outline. */

:root { --shine: none; --seam: none; --flat-ink: var(--v-ink); }

/* the ground: one flat colour */
body { background: var(--ground); }
.doll-body > :is(p, div, .note, .source):not(.listbtns):not(.eyes):not(.spec):not(.panel):not(.panel-like), .prose:not(.panel-like) { background: transparent; }

/* header: just the print */
.top { box-shadow: none; }
.top::before, .top::after { display: none; }
.top.compact { box-shadow: 0 2px 0 var(--flat-ink); }

/* the material, flattened */
.chip, .btn, .listbtn, .eye, .spec, .filters, .search, .brand, .top-nav a, .sub-nav a, .card-img, .photo, .badge, .card-add,
.results-head select, .photo-strip button, .auth, .tabbar, .search-clear, .swatch, .shelf-doll .boxlabel, .to-top, .grailbtn {
  background: #fff; border: 2px solid var(--flat-ink); box-shadow: none; outline: none;
  backdrop-filter: none; -webkit-backdrop-filter: none; text-shadow: none;
}
.chip:focus-visible, .btn:focus-visible, .listbtn:focus-visible, .swatch:focus-visible { outline: 3px solid var(--v2); outline-offset: 2px; }

/* buttons: solid colour blocks */
.btn { background: var(--v1); color: #fff; font-weight: 700; }
.btn.ghost { background: #fff; color: var(--flat-ink); }
.btn:hover, .chip:hover, .listbtn:hover { filter: none; }
.chip { background: #fff; color: var(--flat-ink); }
.chip[aria-pressed="true"], .chip.on { background: var(--flat-ink); border-color: var(--flat-ink); color: #fff; text-shadow: none; }
.listbtn { background: var(--v3); color: var(--flat-ink); }
.listbtn.on { background: var(--v1); border-color: var(--flat-ink); color: #fff; }
.card-add { background: var(--v2); color: var(--flat-ink); }
.card-add.on { background: var(--flat-ink); color: #fff; }
.eye { background: var(--v3); }
.photo-strip button.on { background: var(--flat-ink); color: #fff; }
.top-nav a, .sub-nav a { background: #fff; color: var(--flat-ink); }
.top-nav a[aria-current="page"], .sub-nav a[aria-current="page"] { background: var(--flat-ink); color: #fff; text-shadow: none; }
.acct-btn { background: #fff; color: var(--flat-ink); border: 2px solid var(--flat-ink); box-shadow: none; }
.search { background: #fff; }
.search-clear { background: var(--v2); }
.results-head select { background: #fff; }
.swatch.on { background: var(--v3) !important; border-width: 2px; text-shadow: none; color: var(--flat-ink); }
.swatch.on b, .swatch.on span { color: var(--flat-ink); }
/* never white on lemon: anything on the soft yellow reads in ink */
.listbtn, .eye, .shelf-doll .boxlabel, .swatch.on, .btn.ghost, .grailbtn:not(.on) { color: var(--flat-ink); }
.sw-on { background: var(--flat-ink); }
.grailbtn { background: #fff; color: var(--flat-ink); }
.grailbtn.on { background: #f2c230; border-color: #7a4a00; color: #5a3a00; }
.to-top { background: var(--v1); color: #fff; }
.tabbar { border-radius: 0; border-left: 0; border-right: 0; border-bottom: 0; background: #fff; }
.tabbar a[aria-current="page"] { color: var(--flat-ink); }
.card-img, .photo { border: 2px solid var(--flat-ink); background: var(--soft); }
.card-img::after, .photo::after { display: none; }
.card-img img, .photo img { mix-blend-mode: normal; }
.card-img:not(.ld)::before { background: transparent; }
.filters, .auth, .spec { background: #fff; }
.brand { box-shadow: 4px 4px 0 var(--wm-plum); }  /* the wordmark keeps its toy-box offset */
.shelf-doll .boxlabel { background: var(--v3); border-width: 0; }

/* panels, rows, inputs: ink outlines, no inner glow */
.panel, .list-row, .plan, .notecard, .mb-opt, .rec { box-shadow: none; }
.panel { border: 2px solid var(--flat-ink); }
.panel-bar { background: #fff; border-bottom: 2px solid var(--flat-ink); }
.list-row { border: 2px solid color-mix(in srgb, var(--flat-ink) 35%, #fff); }
.auth input, #acct input, .copy input, .copy textarea, .copy select, .coll-tools input, .iso-set select, .rec-edit-row input, .rec-edit-row select, .rec-shelf-title, .cur-pick {
  background: #fff; border: 2px solid var(--flat-ink); box-shadow: none; }
.auth input:focus, #acct input:focus, .copy input:focus { outline: 3px solid var(--v2); outline-offset: 1px; }
.summary > div, .stats > div { box-shadow: none; border: 2px solid color-mix(in srgb, var(--flat-ink) 35%, #fff); }
.statusbar { background: var(--flat-ink); border-top: 0; }

