/* Forest village: carved honey wood, cream parchment and jade buttons.
   This last skin keeps the existing screen layout, avatar art and answer states.
   User-supplied interface references are catalogued in assets/interface-library/. */
:root {
  --village-ink: #4b5139;
  --village-muted: #788069;
  --village-wood: #866039;
  --village-wood-dark: #57402a;
  --village-gold: #c39a55;
  --village-paper: #fff7de;
  --village-cream: #ffedba;
  --village-jade: #4f9c76;
}
body:not(.qp-woodland) {
  color: var(--village-ink);
  background-color: #78936b;
  background-image: linear-gradient(#1b483733, #28412b66), url('./assets/woodland-home-painted.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
body #deco { display: none; }
body ::-webkit-scrollbar-thumb { background: #9fa873; border-color: #fbf2d9; }
body ::-webkit-scrollbar-track { background: #efe7c9; }
body button:focus-visible, body [tabindex]:focus-visible { outline-color: #c47723; }

/* The village's carved beam carries every screen title and resource pouch. */
body:not(.qp-woodland) .top {
  color: #fff4d3;
  background: repeating-linear-gradient(2deg, #fff2bf07 0 7px, #2e1e180b 8px 10px), linear-gradient(#987044, #78502d);
  border-bottom-color: #dfbd78;
  box-shadow: inset 0 2px 0 #f3dba267, inset 0 -3px 0 #583b254a, 0 3px 0 #392f2280;
}
body:not(.qp-woodland) .top :is(#tbSnd, #tbHome, #tbRank),
body:not(.qp-woodland) .top :is(#tbSnd, #tbHome, #tbRank):is(:hover, :active, .qp-pressed) {
  color: #4e7967;
  background: linear-gradient(#fffde8, #dfedc4 51%, #bfce93);
  border-color: #fff2cf;
  box-shadow: inset 0 0 0 1px #98a36a, inset 0 2px 0 #fff, inset 0 -3px 0 #6d81402e, 0 3px 0 #697a43, 0 5px 0 #f8e5b790;
}
body:not(.qp-woodland) .top #tbShop,
body:not(.qp-woodland) .top #tbShop:is(:hover, :active, .qp-pressed) {
  background: linear-gradient(#fff8d8, #f4d99a 50%, #dfbb6a);
  border-color: #fff2cf;
}
body:not(.qp-woodland) .top .tabs { background: transparent; border-bottom-color: transparent; }

/* Jade and honey replace the aqua surfaces. Correct/wrong and team colours
   retain their dedicated selectors in the answer and game skins. */
body :is(.btn, .icb, .tab, .lgGoBtn, .lgWide, .lgPad button, .qp-demo-toolbar button) {
  --candy-top: #bedcac;
  --candy-mid: #88b58a;
  --candy-bottom: #5e9275;
  --candy-edge: #4a7759;
  --candy-base: #416344;
  border-color: #fff2d0;
}
body :is(.btn.gray, .lgWide.ex, .lgPad button, .tab) {
  --candy-top: #f8ecc6;
  --candy-mid: #e3cc98;
  --candy-bottom: #c4ab71;
  --candy-edge: #987845;
  --candy-base: #846438;
  --candy-label: #fffdf1;
}
body :is(.btn.g, .lgGoBtn, .lgWide, .tab.on, .qp-demo-toolbar button.on) {
  --candy-top: #d2e89f;
  --candy-mid: #a6cb74;
  --candy-bottom: #76a452;
  --candy-edge: #5d803e;
  --candy-base: #4e6b36;
}
body :is(.btn.y, .icb.y) {
  --candy-top: #ffefac;
  --candy-mid: #edca74;
  --candy-bottom: #d6a94c;
  --candy-edge: #b28535;
  --candy-base: #926d2d;
}
body .btn.p {
  --candy-top: #e7cedf;
  --candy-mid: #c8a9c5;
  --candy-bottom: #ae84aa;
  --candy-edge: #93668b;
  --candy-base: #7d5c74;
}
body :is(.btn.red, .btn.danger, .qp-demo-toolbar [data-exit]) {
  --candy-top: #ffd4ad;
  --candy-mid: #eaa381;
  --candy-bottom: #ce7b63;
  --candy-edge: #b46150;
  --candy-base: #945345;
}

body .pnl {
  color: var(--village-ink);
  background: radial-gradient(ellipse at top, #fffefa, #fff7e0 70%, #f6e7c7);
  border-color: #d9b777;
  box-shadow: inset 0 0 0 1px #fffbdf, inset 0 3px 0 #fff, inset 0 -3px 0 #e4ce98, 0 5px 0 #75532f, 0 10px 20px #173a322b;
}
body .pnl-h {
  color: #fff8dd;
  background: repeating-linear-gradient(2deg, #fbe5a916 0 6px, #6143230d 7px 9px), linear-gradient(#b79558, #947341);
  border-bottom-color: #806035;
  box-shadow: inset 0 2px 0 #fbeab89c;
  text-shadow: 0 2px 0 #70522d;
}
body .pnl-h::before { background: linear-gradient(135deg, #f5f5b6, #a5c968); border-color: #7c984b; box-shadow: inset 0 1px 0 #fff, 0 2px 0 #758949; }
body :is(.inp, .tarea) {
  color: #4b583e;
  border-color: #c4bb91;
  background: #fffefa;
  box-shadow: inset 0 3px 0 #eee9da;
}
body :is(.inp, .tarea):focus { color: #374c35; border-color: #7da57c; box-shadow: inset 0 3px 0 #f0f5e9, 0 0 0 3px #efd18a70; }
body .hint { color: #747b65; }

/* A tailor's stall: the forest frames the room while fabric is displayed on
   light parchment shelves. Pictures never sit behind item names or prices. */
body .shopwrap {
  background: linear-gradient(#f7f7ce10, #264b3926);
}
body .shopwrap > .pnl {
  position: relative;
  border: 4px solid #c4a15f;
  border-radius: 23px;
  box-shadow: inset 0 0 0 2px #fff3cf, inset 0 2px 0 #fff, 0 5px 0 #6d4b2d, 0 10px 19px #203e343b;
}
body .shopwrap > .pnl::after,
body .lgPanel::after {
  content: '';
  position: absolute;
  inset: -1px;
  z-index: 3;
  border: 38px solid transparent;
  border-image-source: url('./assets/forest-village-frame.png');
  border-image-slice: 240 385 240 385;
  border-image-width: 38px;
  border-image-repeat: stretch;
  pointer-events: none;
}
/* Compact headings sit immediately inside the side panels. A thinner frame
   keeps the carved rail above their lettering without shrinking the portrait. */
body .shopwrap > .pnl:first-child::after,
body .shopwrap > .pnl:last-child::after { border-width: 24px; border-image-width: 24px; }
body .shopwrap > .pnl:first-child .pnl-h {
  color: #fffbe2;
  background: repeating-linear-gradient(2deg, #ffffff0a 0 6px, #1b4a330a 7px 9px), linear-gradient(#84ad7a, #5a8665);
  border-bottom-color: #44684b;
  text-shadow: 0 2px 0 #395f41;
}
body .shopwrap > .pnl:last-child .pnl-h {
  color: #fff9dd;
  background: repeating-linear-gradient(2deg, #ffffff0a 0 6px, #5b362c0a 7px 9px), linear-gradient(#d1ae65, #b08b47);
  border-bottom-color: #917039;
  text-shadow: 0 2px 0 #876431;
}
body .shopwrap .pnl-h {
  --shop-letter-edge: #5b7445;
  -webkit-text-stroke-color: var(--shop-letter-edge);
  text-shadow: 0 1px 0 var(--shop-letter-edge), 0 2px 0 var(--shop-letter-edge), 0 3px 0 #465d35, 0 4px 1px #2d44242b;
}
body .shopwrap > .pnl:last-child .pnl-h {
  --shop-letter-edge: #8d6b36;
  -webkit-text-stroke-color: var(--shop-letter-edge);
  text-shadow: 0 1px 0 #8d6b36, 0 2px 0 #8d6b36, 0 3px 0 #71512b, 0 4px 1px #71512b30;
}
body .shopwrap > .pnl:first-child > :last-child {
  background: linear-gradient(#fff6d9, #edd9ad) !important;
  border-top-color: #b99c60 !important;
}
body .shopwrap .mestage {
  background-image: linear-gradient(#fffbdb25, #eff4ce38), url('./assets/woodland-home-painted-mobile.png');
  background-position: center 52%;
  background-size: cover;
}
body .shopwrap .mestage::before {
  border-color: #fff3c080;
  background: radial-gradient(ellipse, #fffbe052, #fff8db14 70%);
  box-shadow: inset 0 0 22px #fffbe045;
}
body .shopwrap .mestage::after { background: #264f3438; }
body .qp-shop-switch {
  background: repeating-linear-gradient(3deg, #fff1c00c 0 6px, #56372309 7px 10px), linear-gradient(#a5804c, #876137);
  padding-bottom: 12px;
  box-shadow: inset 0 3px 0 #e2c68b, 0 2px 0 #715432;
}
body .qp-shop-switch .tab { border-color: #fff0c3; }
body #shTabs {
  background: linear-gradient(#faf4d9, #f0e6c5);
  border-bottom-color: #d6c599;
}
body #shTabs .tab { border-color: #fff5d5; }
body .shopwrap > .pnl:nth-child(2) > :nth-child(3) {
  background: #fffae9 !important;
  border-bottom-color: #d9cba6 !important;
}
body #shPal { color: #837650; }
body #shPal button { border-color: #ddcda7 !important; box-shadow: inset 0 1px 0 #fff8, 0 2px 0 #b7a47d; }
body #shPal button:focus-visible { outline-color: #65986e; outline-offset: 3px; }
body #shGrid {
  background: radial-gradient(ellipse at top, #fffbed, #f2e7c9);
  align-content: start;
}
body #shGrid .itm {
  color: #566644;
  border-color: #c4b38a;
  border-radius: 17px;
  background: linear-gradient(#fffef8, #fff6de);
  box-shadow: inset 0 2px 0 #fff, 0 3px 0 #baa477;
}
body #shGrid .itm .thumb {
  border-color: #e4d6b1;
  background: radial-gradient(ellipse at 50% 35%, #fffefa, #f2edd7);
  border-radius: 11px;
  box-shadow: inset 0 -2px 0 #e9dcc0;
}
body #shGrid .itm .nm2 { color: #52623f; }
body #shGrid .itm .pr { color: #a77928; }
body #shGrid .itm .pr.free { color: #578c57; }
body #shGrid .itm.own { border-color: #83ad79; box-shadow: inset 0 2px 0 #fff, 0 3px 0 #819863; }
body #shGrid .itm.r2 { border-color: #b9a0bc; background: linear-gradient(#fffefa, #f2e8ed); }
body #shGrid .itm.r3 { border-color: #d5b867; background: linear-gradient(#fffefa, #fff0c5); }
body #shGrid .itm.on { border-color: #c9973d; background: linear-gradient(#fffceb, #f4dc9e); box-shadow: inset 0 2px 0 #fff, 0 3px 0 #a57b32, 0 0 0 2px #fff9dc; }
body #shGrid .itm.on .nm2 { color: #855f26; }
body #shGrid .itm .badge { background: #6c9f71; border-color: #fff5d7; box-shadow: 0 2px 0 #52794d; }
body #shGrid .itm .badge.eq { background: #eed38d; color: #805e2a; box-shadow: 0 2px 0 #bd9449; }
body #shInfo { color: #677459; background: linear-gradient(#fffbed, #f8efd5); }
body #shInfo .hint { color: #758068; }
body #shInfo .avframe {
  border: 1px solid #decea3;
  background: radial-gradient(ellipse at 50% 30%, #fffef6, #eee8cd);
  box-shadow: inset 0 -3px 0 #dbcca2;
}
body #shInfo > .center {
  background: radial-gradient(ellipse at 50% 30%, #fffef6, #eee8cd) !important;
  border: 1px solid #decea3;
  box-shadow: inset 0 -2px 0 #e3d4af;
}
body #shInfo [style*="color:#12467e"] { color: #586f42 !important; }
body #shInfo [style*="color:#4a6b8a"] { color: #7b8168 !important; }
body #shInfo [style*="border-top:2px dashed"] { border-top-color: #dacda9 !important; }

/* The login invitation uses the same forest clearing and a parchment form. */
body .lgSky .bub { display: none; }
body .lgPanel {
  color: #586346;
  background: radial-gradient(ellipse at top, #fffefa, #fff5dc);
  border-color: #eccb84;
  box-shadow: inset 0 0 0 2px #fff8dc, inset 0 -5px 0 #e8d39a, 0 7px 0 #72502d, 0 13px 26px #183c343b;
}
body .lgPanel::after { inset: -5px; border-width: 31px; border-image-width: 31px; }
body .lgTitle { color: #688254; text-shadow: 0 2px 0 #fff7d3; }
body :is(.lgSup, .lgBar) { color: #6d7149; background: #fff7ddee; border-color: #eed499; box-shadow: 0 3px 0 #94754160; }
body .lgForm label, body .lgSex label { color: #73785b; }
body .lgDots { border-color: #c4bb91; background: #fffefa; box-shadow: inset 0 3px 0 #eee9da; }
body .lgDots i { background: #e5e7d1; border-color: #c9cdb0; }
body .lgDots i.f { background: #79a566; border-color: #648452; box-shadow: inset 0 1px 0 #cfebb2; }
body .lgMsg { color: #747b65; }
body .lgMsg b { color: #65874f; }
body .lgWho > svg { filter: drop-shadow(0 6px 0 #21453530); }

/* School desks and dialogs stay light; question text and answer feedback keep
   clear backgrounds and their distinct correct/wrong colours. */
body .classroom-body, body .classroom-student-body { background: radial-gradient(ellipse at top, #fff9e0, #e7eed9 70%); }
body :is(.class-mode-preview, .class-bank-list, .qpc-panel, .qpb-builder, .class-round-question) {
  border-color: #dcc08b;
  color: #536145;
  background: linear-gradient(#fffef5, #fff5dc);
  box-shadow: inset 0 2px 0 #fff, 0 5px 0 #ad8f56, 0 10px 20px #3d563525;
}
body :is(.class-flow-heading h2, .class-hub h2, .qpc-heading h2, .qpc-dash-heading h2, .qpc-roster h3) { color: #577949; }
body .class-mode-list { border-color: #e9e5b9; background: linear-gradient(#d4e1ba, #b4ca97); box-shadow: inset 0 2px 0 #f9ffdc, 0 5px 0 #7c975f; }
body .class-mode.selected { background: linear-gradient(#aacc92, #6f9f70); border-color: #fff6d7; box-shadow: inset 0 2px 0 #dfeec3, 0 5px 0 #4f774d; text-shadow: 0 2px 0 #497144; }
body .class-student-hud { color: #fff8df; background: repeating-linear-gradient(2deg, #fff5cb0a 0 7px, #4b361c0b 8px 10px), linear-gradient(#9ca974, #77874f); border-bottom-color: #586439; box-shadow: inset 0 3px 0 #dce4ab; text-shadow: 0 2px 0 #586b3d; }
body .class-student-hud small { color: #fff7d9; }
body .class-student-hud > .class-player-progress { background: linear-gradient(#537246, #3b5936); border-color: #f6e6bc; box-shadow: inset 0 2px 4px #25442f, 0 3px 0 #536139; }
body .class-student-footer { color: #6e7854; background: #f5efcf; }
body .class-round-no { color: #fff8dc; border-color: #ffedbf; background: linear-gradient(#c2a16c, #9e7b42); box-shadow: inset 0 2px 0 #ebd4a1, 0 4px 0 #785e37; text-shadow: 0 2px 0 #785e37; }
body .qpc-heading p, body .qpc-dash-heading p, body .qpc-field, body .qpc-field small { color: #748166; }
body :is(.qpc-form input:not([type=radio]), .qpc-form select, .qpb-builder .inp) { background: #fffefa; border-color: #c8bf97; color: #536145; }
body .qpc-button:not([data-action=end]) { background: linear-gradient(#b8ce95, #89a86c 51%, #72975a); border-color: #fff0c9; box-shadow: inset 0 2px 0 #e2efc0, 0 5px 0 #536e3e; text-shadow: 0 2px 0 #526b3d; }
body .qpc-button[data-action=back], body .qpc-button[data-action=reveal] { background: linear-gradient(#f2dfae, #d5b56f); box-shadow: inset 0 2px 0 #fff2cf, 0 5px 0 #a18349; text-shadow: 0 2px 0 #93753d; }
body .qpb-toolbar, body .qpb-editor { background: #fffdf3; }
body .qpb-stepbar { background: #f1e8c9; border-bottom-color: #d9cca5; }
body .qpb-sidebar, body .qpb-add-types { background: #e7ecd7; border-color: #ccd5b3; }
/* The question studio shares the village materials, including its embedded
   answer preview. These selectors also cover the earlier studio skin. */
body .qpb-builder {
  --qpb-control-top: #bedcac; --qpb-control-mid: #88b58a;
  --qpb-control-bottom: #5e9275; --qpb-control-edge: #4a7759; --qpb-control-base: #416344;
}
body .qpb-stepbar > span { color: #7b7657; background: linear-gradient(#fff8e1, #e9ddba); border-color: #fff5d5; box-shadow: inset 0 2px 0 #fff, 0 2px 0 #b7a77a; }
body .qpb-stepbar .qpb-step-done { color: #557644; background: linear-gradient(#e6efcd, #c6d7a4); box-shadow: inset 0 2px 0 #faffdf, 0 2px 0 #92a675; }
body .qpb-stepbar .qpb-step-current { color: #805e28; background: linear-gradient(#fff0bd, #e8c878); box-shadow: inset 0 2px 0 #fff9df, 0 3px 0 #b2914e; }
body .qpb-sidebar-title, body .qpb-add-types h3 { color: #647a4e; }
body .qpb-title-label { color: #647a4e; }
body .qpb-sidebar-title > span { color: #fff9dd; background: linear-gradient(#a6b87d, #789155); border-color: #fff5d5; box-shadow: inset 0 2px 0 #e3ecc1, 0 2px 0 #5f743f; }
body .qpb-builder .qpb-question-card { color: #5a6846; border-color: #fff9e4; background: linear-gradient(#fffef4, #f5efd8); box-shadow: inset 0 0 0 1px #c6c59a, inset 0 -4px 0 #cbbd8320, 0 3px 0 #b3ad7b, 0 5px 7px #4b62321a; }
body .qpb-builder .qpb-question-card.is-selected { color: #fff9e0; border-color: #fff0b7; background: linear-gradient(#98b477, #77995e 45%, #688852); box-shadow: inset 0 2px 0 #dce9b8, inset 0 -4px 0 #4c693532, 0 4px 0 #4f6d3d, 0 6px 9px #3753332b; }
body .qpb-question-number { color: #fff8dc; background: linear-gradient(#b5c38c, #839c60); border-color: #fff5d5; box-shadow: inset 0 2px 0 #e2edc3, 0 2px 0 #6a8149; text-shadow: 0 1px 0 #64783e; }
body .qpb-builder .is-selected .qpb-question-number { color: #8b622a; background: linear-gradient(#fff0bd, #e9c578); box-shadow: inset 0 2px 0 #fff9df, 0 2px 0 #b2914e; text-shadow: 0 1px 0 #fff5cd; }
body .qpb-question-summary small { color: #7b8265; }
body .is-selected .qpb-question-summary small { color: #edf0d5; }
body .qpb-empty-list, body .qpb-empty-editor p { color: #7c8568; }
body .qpb-empty-editor h2 { color: #647d4d; }
body .qpb-builder .qpb-type-add[data-add=short] { --qpb-control-top: #d2e89f; --qpb-control-mid: #a6cb74; --qpb-control-bottom: #76a452; --qpb-control-edge: #5d803e; --qpb-control-base: #4e6b36; }
body .qpb-builder .qpb-type-add[data-add=match] { --qpb-control-top: #ffefac; --qpb-control-mid: #edca74; --qpb-control-bottom: #d6a94c; --qpb-control-edge: #b28535; --qpb-control-base: #926d2d; }
body .qpb-builder :is(.qpb-type-add[data-add=order], .qpb-add-row) { --qpb-control-top: #e7cedf; --qpb-control-mid: #c8a9c5; --qpb-control-bottom: #ae84aa; --qpb-control-edge: #93668b; --qpb-control-base: #7d5c74; }
body .qpb-builder .qpb-mini.is-danger { --qpb-control-top: #ffd4ad; --qpb-control-mid: #eaa381; --qpb-control-bottom: #ce7b63; --qpb-control-edge: #b46150; --qpb-control-base: #945345; }
body .qpb-editor-heading { background: repeating-linear-gradient(2deg, #fff0b712 0 6px, #4b361c09 7px 9px), linear-gradient(#a5b27e, #7e915e); border-color: #fff4cd; box-shadow: inset 0 0 0 1px #6f8250, inset 0 3px 0 #e3ebc3, 0 4px 0 #566e3e, 0 6px 9px #37533317; }
body .qpb-editor-heading h2 { color: #fff9df; text-shadow: 0 2px 0 #59733e; }
body .qpb-editor-heading .qpb-step-label { color: #f6f5d9; }
body .qpb-field { color: #5e704b; }
body .qpb-field > span small, body .qpb-field > small, body .qpb-note { color: #79816a; }
body .qpb-builder .inp { box-shadow: inset 0 3px 0 #ede9da50, 0 2px 0 #ded8b8; }
body .qpb-builder .inp:focus { border-color: #7da57c; box-shadow: 0 0 0 3px #efd18a70, inset 0 2px 0 #f0f5e9; }
body .qpb-builder .inp::placeholder { color: #899079; }
body .qpb-answer-fields { border-top-color: #d7cfa7; }
body .qpb-option-badge { color: #89723f; border-color: #fff7db; background: linear-gradient(#f6e8bf, #dfc995); box-shadow: inset 0 2px 0 #fff7dc, 0 2px 0 #bba16c; }
body .qpb-option-row.is-correct .qpb-option-badge { color: #507e3e; background: linear-gradient(#e4f1c5, #c3dca2); box-shadow: inset 0 2px 0 #f6ffdc, 0 2px 0 #95b579; }
body .qpb-option-row.is-correct .inp { border-color: #97b680; background: linear-gradient(#fffefa, #f4f8e9); }
body .qpb-pair-head, body .qpb-row-number, body .qpb-pair-arrow { color: #789157; }
body .qpb-preview-panel { background: linear-gradient(145deg, #e9edcf, #d9e2bc); border-left-color: #fff4cd; }
body .qpb-preview-heading { color: #fff8dd; background: repeating-linear-gradient(2deg, #fff0b712 0 6px, #4b361c09 7px 9px), linear-gradient(#b99a60, #9b7a43); border-color: #fff4cd; box-shadow: inset 0 2px 0 #efdbab, 0 3px 0 #806338; text-shadow: 0 1px 0 #806338; }
body .qpb-preview-content { border-color: #fff8df; box-shadow: inset 0 0 0 1px #cabb8c, 0 4px 0 #b7a478, 0 7px 10px #4f68391a; }
body .qpb-preview-question { color: #536145; }
body .qpb-preview-empty { color: #7e866a; }
body .qpb-footer { color: #fff8df; background: repeating-linear-gradient(2deg, #fff0b70b 0 7px, #3b281409 8px 10px), linear-gradient(#9c7a4b, #805c34); border-top-color: #ecd4a0; }
body .qpb-footer > span { color: #f5edd2; }
body .qpb-empty-icon { border-color: #fff7d8; background: linear-gradient(#c3d699, #869f63); box-shadow: inset 0 3px 0 #e4edc2, 0 5px 0 #627a47; }

body .qpq-help { color: #788167; }
body .qpq-answer .qpq-choice { color: #526441; border-color: #fff6d8; background: linear-gradient(#fffef5, #eff2dc); box-shadow: inset 0 0 0 2px #aabb86, inset 0 3px 0 #fff, 0 4px 0 #859660, 0 6px 8px #45633214; }
body .qpq-answer .qpq-choice .qpq-choice-number { color: #fff9dd; border-color: #fff4ce; background: linear-gradient(#b6cc91, #7d9c60); box-shadow: inset 0 2px 0 #e3efc2, 0 2px 0 #637e48; }
body .qpq-answer .qpq-choice.is-selected { color: #7c571f; border-color: #fff5ce; background: linear-gradient(#fff1bc, #eacc83); box-shadow: inset 0 0 0 2px #c9a15b, inset 0 3px 0 #fff8, 0 4px 0 #ad8544; }
body .qpq-answer .qpq-choice.is-selected .qpq-choice-number { background: linear-gradient(#f4dda0, #dcb661); box-shadow: inset 0 2px 0 #fff3cf, 0 2px 0 #ab853f; }
body .qpq-answer .qpq-short-input.inp { color: #536145; border-color: #c4bb91; background: linear-gradient(#fffefa, #fff8e3); box-shadow: inset 0 3px 0 #ede9da50, 0 3px 0 #d3cba7; }
body .qpq-answer .qpq-short-input.inp:focus { border-color: #7da57c; box-shadow: 0 0 0 3px #efd18a70, inset 0 3px 0 #ede9da50; }
body .qpq-match-item { color: #5b6b45; border-color: #fff6db; background: linear-gradient(#fffdf6, #edf0d9); box-shadow: inset 0 0 0 2px #b1be8d, inset 0 3px 0 #fff, 0 3px 0 #8e9f6c; }
body .qpq-match-item.is-connected { color: #477656; background: linear-gradient(#daebc9, #b5d3ad); box-shadow: inset 0 0 0 2px #8db38b, inset 0 3px 0 #f3ffe2, 0 3px 0 #759777; }
body .qpq-match-item.is-selected { color: #8b601c; border-color: #fff8cc; background: linear-gradient(#fff1b6, #ebca78); box-shadow: inset 0 0 0 2px #cfad64, inset 0 3px 0 #fff8, 0 3px 0 #b19352; }
body .qpq-match-line { stroke: #669468; }
body .qpq-match-status, body .qpq-order-status { color: #6c8054; }
body .qpq-order-item { background: linear-gradient(#fffdf4, #f1efd8); border-color: #fff6dc; box-shadow: inset 0 0 0 1px #c5c394, inset 0 2px 0 #fff, 0 3px 0 #a5ad7d; }
body .qpq-order-grip { color: #8b9770; }
body .qpq-order-text { color: #536145; }
body .qpq-actions .qpq-clear { --candy-top: #f8ecc6; --candy-mid: #e3cc98; --candy-bottom: #c4ab71; --candy-edge: #987845; --candy-base: #846438; }
body .qpq-answer .qpq-order-controls button.btn { border-color: #fff3d0; background: linear-gradient(#bdd8a7, #8cb18a 47%, #638e6b); box-shadow: inset 0 0 0 1px #567f57, inset 0 2px 0 #e0efc8, 0 3px 0 #466d47; }

body .qp-quiz-map .qp-map-step { background: linear-gradient(#cadcaf, #98ba89 48%, #78a574 49%, #668b58); border-color: #fff0cb; box-shadow: inset 0 3px 0 #eff8d0, 0 4px 0 #4b6b42, 0 7px 8px #28523635; text-shadow: 0 2px 0 #628451; }
body .qp-quiz-map .qp-map-step:is(:active, .is-held) { background: linear-gradient(#bad595, #6b995d); box-shadow: inset 0 2px 0 #e8f1c9, 0 1px 0 #496a40; }
body .qp-results { background: radial-gradient(ellipse at 50% 0, #eff1c853, #183c3570), url('./assets/woodland-home-painted.png') center / cover; }
body .qp-result-table { background: #fff5d9; border-color: #c4aa6d; box-shadow: 0 4px 0 #84633b; }
body .rank { border-color: #d8caa2; background: #fffbed; box-shadow: 0 2px 0 #d6c498; }
body .rank .rn { color: #66794c; }
body .rank .rs { color: #6f8d50; }
body .setrow, body .qrow { color: #637448; border-color: #d3d3ab; background: #fffdf2; }
body .setrow .sn { color: #5f7f47; }
body #modal { background: #173c31a6; }
body .mbody { color: #65714f; background: #fff8e3; }
body .mbox { border-color: #e5c585; }
body #avatarSexChoices > .f1 { background: #f3f1d9 !important; border-color: #bfcc9e !important; }
body .tt { color: #536d45; background: #f4f5da; border-color: #b3c393; box-shadow: 0 3px 0 #7e915c; }
body .qp-demo-toolbar { color: #7c724f; background: #fff7e2f5; border-color: #e4c991; box-shadow: inset 0 0 0 1px #fffbe9, 0 3px 0 #92734185; }
body .qp-demo-toolbar small { color: #8c8061; }

@media (max-width: 660px) {
  body:not(.qp-woodland) { background-image: linear-gradient(#1b483726, #28412b59), url('./assets/woodland-home-painted-mobile.png'); }
  body .shopwrap > .pnl { border-radius: 21px; }
  body .shopwrap > .pnl::after { border-width: 28px; border-image-width: 28px; }
  body .shopwrap > .pnl:first-child::after,
  body .shopwrap > .pnl:last-child::after { border-width: 22px; border-image-width: 22px; }
  body .lgPanel::after { border-width: 24px; border-image-width: 24px; }
  body .shopwrap .mestage { background-position: 48% 56%; }
  body .qp-shop-switch { padding-bottom: 11px; }
  body #shTabs { scrollbar-color: #aaaf7c #f2e7c7; }
  body #shGrid { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  /* Decoration is static; existing input and avatar reduced-motion rules apply. */
  body .shopwrap .mestage::before { animation: none; }
}