:root{--cg-tl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='' fill='none' stroke='%23b08a5c' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23b08a5c' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cg-tr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='translate%2832 0%29 scale%28-1 1%29' fill='none' stroke='%23b08a5c' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23b08a5c' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cg-bl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='translate%280 32%29 scale%281 -1%29' fill='none' stroke='%23b08a5c' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23b08a5c' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cg-br:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='translate%2832 32%29 scale%28-1 -1%29' fill='none' stroke='%23b08a5c' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23b08a5c' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cb-tl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='' fill='none' stroke='%23876541' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23876541' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cb-tr:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='translate%2832 0%29 scale%28-1 1%29' fill='none' stroke='%23876541' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23876541' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cb-bl:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='translate%280 32%29 scale%281 -1%29' fill='none' stroke='%23876541' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23876541' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--cb-br:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cg transform='translate%2832 32%29 scale%28-1 -1%29' fill='none' stroke='%23876541' stroke-linecap='round'%3E%3Cpath d='M1.5 30V10C1.5 5 5 1.5 10 1.5H30' stroke-width='1.4'/%3E%3Cpath d='M6.5 25V12C6.5 9 9 6.5 12 6.5H25' stroke-width='.8' opacity='.7'/%3E%3Cpath d='M14 1.5q3.5 4.5 0 9M1.5 14q4.5 3.5 9 0' stroke-width='.9'/%3E%3Ccircle cx='10.5' cy='10.5' r='2.3' fill='%23876541' stroke='none'/%3E%3C/g%3E%3C/svg%3E");--div-g:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 12'%3E%3Cg fill='none' stroke='%23b08a5c' stroke-linecap='round'%3E%3Cpath d='M2 6H52M88 6H138' stroke-width='1'/%3E%3Cpath d='M52 6q6-5 12 0t12 0M52 6q6 5 12 0t12 0' stroke-width='.9'/%3E%3C/g%3E%3Cpath d='M70 1.5L74.5 6 70 10.5 65.5 6z' fill='%23b08a5c'/%3E%3C/svg%3E");--div-b:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 140 12'%3E%3Cg fill='none' stroke='%23876541' stroke-linecap='round'%3E%3Cpath d='M2 6H52M88 6H138' stroke-width='1'/%3E%3Cpath d='M52 6q6-5 12 0t12 0M52 6q6 5 12 0t12 0' stroke-width='.9'/%3E%3C/g%3E%3Cpath d='M70 1.5L74.5 6 70 10.5 65.5 6z' fill='%23876541'/%3E%3C/svg%3E");}

/* =====================================================================================================
   Vordenk — Help library, SCANDI SHELF palette. Colour mix taken from the reference photo:
   soft white walls & cabinets, warm oak (light → deep), charcoal, a touch of leaf green, oak floor.
   Loaded last: it only re-colours; layout, books, pen, bulb and keyboard behave as before.
   ===================================================================================================== */
.vkh{
  --wall:#e4e6e7; --wall2:#c6c8c8; --white:#f4f5f4; --cab:#c4c8c7; --grey:#97968e; --chair:#b9bec8;
  --oak1:#a07a50; --oak2:#876541; --oak3:#654424; --oak4:#402715; --floor:#79522a; --char:#1b1915; --char2:#2b2620;
  --leaf:#49622a; --leafd:#293712;
  --g1:#f1e6d2; --g2:#d4b78c; --g3:#a07a50;
  --ink:#1b1915; --paper:#f6f6f4; --paper2:#e2e5e5;
  --gilt:linear-gradient(135deg,#f6efe2 0%,#dcc6a0 30%,#b08a5c 55%,#eee0c6 80%,#a07a50 100%);
  --brass:linear-gradient(180deg,#b38d62,#876541 45%,#654424 55%,#9a7650);
  color:var(--char);
  background:
    linear-gradient(180deg,transparent 0 91%,rgba(0,0,0,.10) 91% 91.4%,transparent 91.4%),
    repeating-linear-gradient(90deg,rgba(64,39,21,.20) 0 1px,transparent 1px 120px) bottom/100% 9% no-repeat,
    linear-gradient(180deg,#ecedee 0%,var(--wall) 45%,#d3d6d7 90.9%,var(--floor) 91%,#5b3b1c 100%);
}
.vkh::after{ background:radial-gradient(120% 100% at 50% 40%,transparent 62%,rgba(27,25,21,.16)); }
.vkh::before{ background:radial-gradient(ellipse at 50% 38%,transparent 60%,rgba(27,25,21,.10)); }
.vkh-top{ background:rgba(244,245,244,.82); border-image:linear-gradient(90deg,transparent,rgba(135,101,65,.55),transparent) 1; box-shadow:0 8px 22px -16px rgba(27,25,21,.45); }
.vkh-title{ color:var(--char); } .vkh-title small{ color:#5f5d55; }
.vkh-btn{ color:var(--char); border-color:rgba(135,101,65,.5); background:linear-gradient(180deg,#fff,#eceeee); box-shadow:inset 0 1px 0 #fff, 0 1px 2px rgba(27,25,21,.12); }
.vkh-btn:hover:not(:disabled){ border-color:var(--oak2); background:#f3eadb; }
.vkh-btn.on{ border-color:var(--oak2); background:#e9dcc4; color:var(--oak4); }
.vkh-btn:focus-visible,.vkh-book:focus-visible,.vkh-bulb:focus-visible{ outline-color:var(--oak2); }
.vkh-sep{ background:rgba(135,101,65,.4); }
.vkh-nib{ border-color:rgba(135,101,65,.45); } .vkh-nib i{ background:var(--char); } .vkh-nib.on{ border-color:var(--oak2); background:#e9dcc4; }
.vkh-sw{ border-color:rgba(27,25,21,.3); } .vkh-sw.on{ border-color:var(--oak3); box-shadow:0 0 0 2px #fff, 0 0 8px rgba(135,101,65,.5); }

/* hanging bulb: daylight white, oak filament */
.vkh-bulb .wire{ stroke:var(--char2); } .vkh-bulb .sock{ fill:var(--oak2); stroke:var(--oak4); } .vkh-bulb .ridge{ stroke:var(--oak4); }
.vkh-bulb .glass{ fill:#d9dcdd; stroke:rgba(27,25,21,.35); } .vkh-bulb .fil{ stroke:#6a675e; }
.vkh.lit .vkh-bulb .fil{ stroke:var(--oak2); }
.vkh.lit .vkh-bulb svg{ filter:drop-shadow(0 0 8px rgba(255,255,255,.95)) drop-shadow(0 0 22px rgba(255,255,255,.7)); }
.vkh-glow{ mix-blend-mode:soft-light; background:radial-gradient(ellipse 58% 52% at 50% 0,rgba(255,255,255,.85),rgba(255,255,255,.25) 42%,transparent 74%); }
.vkh:not(.lit) .vkh-body{ filter:brightness(.55) saturate(.9); }

/* library title + sub */
.vkh-crest{ color:var(--oak2); } .vkh-crest i{ background:linear-gradient(90deg,transparent,var(--oak2)); } .vkh-crest i:last-child{ background:linear-gradient(270deg,transparent,var(--oak2)); }
.vkh-crest b{ text-shadow:none; }
.vkh-lib h2{ background:linear-gradient(180deg,var(--oak3),var(--oak4)); -webkit-background-clip:text; background-clip:text;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.8)); }
.vkh-orn{ background:var(--div-g) center/contain no-repeat; filter:none; }
.vkh-lib p.sub{ color:#4f4d46; }
.vkh-hint{ color:#5b594f; }

/* the shelving unit: white cabinet boxes with an oak frame, grey back panel, oak shelf board */
.vkh-rowwrap::before{ border-radius:6px 6px 2px 2px;
  background:linear-gradient(180deg,rgba(0,0,0,.10),transparent 30%),linear-gradient(180deg,#d4d8d8,var(--cab) 60%,#b7bcbb);
  box-shadow:inset 0 0 0 3px var(--white), inset 0 0 0 5px rgba(27,25,21,.10), inset 0 20px 30px -20px rgba(27,25,21,.45), 0 14px 22px -16px rgba(27,25,21,.55); }
.vkh-row::after{ height:20px; bottom:-18px;
  background:repeating-linear-gradient(90deg,rgba(64,39,21,.14) 0 2px,transparent 2px 9px),linear-gradient(180deg,#b58d62 0,var(--oak2) 38%,var(--oak3) 100%);
  box-shadow:0 14px 20px -8px rgba(27,25,21,.6), inset 0 1px 0 rgba(255,240,215,.5), inset 0 -2px 0 rgba(0,0,0,.3), 0 0 0 1px var(--oak4); }
.vkh-row::before{ background:linear-gradient(180deg,transparent,rgba(27,25,21,.16)); }
.vkh-end{ background:linear-gradient(180deg,#3a3630,var(--char)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.12), 0 6px 8px -2px rgba(27,25,21,.5); }
.vkh-end::after{ background:#9a9890; box-shadow:0 22px 0 #9a9890; }
.vkh-plaque{ background:var(--white); box-shadow:inset 0 0 0 1px rgba(64,39,21,.55), 0 3px 5px rgba(27,25,21,.35); }
.vkh-plaque span{ color:var(--oak4); text-shadow:none; }

/* books (spine colours come from the BOOKS list) */
.vkh-book::before,.vkh-book::after{ background:linear-gradient(180deg,#f3e7d0,#c9a678 60%,#8a6a42); }
.vkh-book .bt{ background:linear-gradient(180deg,#fafaf9,#dfe2e2); border-color:rgba(27,25,21,.45); color:var(--char); -webkit-text-fill-color:var(--char); text-shadow:none; }
.vkh-book .bt em{ color:var(--oak3); -webkit-text-fill-color:var(--oak3); border-top-color:rgba(101,68,36,.4); }
.vkh-book .bn{ color:#f1e6d2; }
.vkh-book:hover,.vkh-book:focus-visible{ box-shadow:0 22px 26px -10px rgba(27,25,21,.7), 0 0 24px -4px rgba(255,255,255,.9), inset 0 0 0 1px rgba(255,240,215,.5); }
.vkh.lit .vkh-book{ box-shadow:0 10px 18px -8px rgba(27,25,21,.6), inset 0 0 0 1px rgba(255,255,255,.1), inset 0 22px 26px -18px rgba(255,255,255,.3); }

/* 3D cover + info */
.vkh-stage::before{ background:radial-gradient(closest-side,rgba(27,25,21,.45),transparent); }
.vkh-stage::after{ background:radial-gradient(closest-side,rgba(255,255,255,.7),transparent); }
.vkh-frame::before{ border-color:rgba(241,230,210,.85); box-shadow:inset 0 0 0 6px transparent,inset 0 0 0 7px rgba(241,230,210,.4); }
.vkh-frame .co{ filter:none; }
.vkh-seal{ color:var(--oak4); background:radial-gradient(circle at 35% 30%,#fff8ea,#d4b78c 45%,var(--oak3)); }
.vkh-frame p{ color:rgba(246,240,228,.9); }
.vkh-info p{ color:#47453e; }
.vkh-open-hint{ color:var(--oak4); border-color:rgba(101,68,36,.55); background:rgba(255,255,255,.7); }
@keyframes vkh-pulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(255,255,255,0); } 50%{ box-shadow:0 0 18px 2px rgba(255,255,255,.95); } }

/* the open book: oak/charcoal/green cover, crisp white paper, oak ornaments */
.vkh-book-open::before{ border-color:rgba(241,230,210,.8); }
.vkh-spread{ background:var(--paper2); box-shadow:inset 0 0 0 1px rgba(27,25,21,.18), 0 2px 0 #f4f5f4, 0 3px 0 #c4c8c7, 0 4px 0 #f4f5f4, 0 5px 0 #c4c8c7, 0 6px 0 #f4f5f4, 0 7px 0 #a9adac, 0 9px 12px rgba(27,25,21,.45); }
.vkh-spread::before{ background:linear-gradient(90deg,transparent,rgba(27,25,21,.12) 42%,rgba(27,25,21,.26) 50%,rgba(27,25,21,.12) 58%,transparent); }
.vkh-pg{ color:var(--char);
  background:radial-gradient(120% 80% at 50% 0,rgba(255,255,255,.9),transparent 60%),repeating-linear-gradient(0deg,rgba(27,25,21,.018) 0 1px,transparent 1px 4px),var(--paper); }
.vkh-pg.l{ box-shadow:inset -34px 0 38px -26px rgba(27,25,21,.32), inset 5px 0 12px -8px rgba(27,25,21,.15); }
.vkh-pg.r{ box-shadow:inset 34px 0 38px -26px rgba(27,25,21,.32), inset -5px 0 12px -8px rgba(27,25,21,.15); }
.vkh-pg::before{ border-color:rgba(135,101,65,.5); }
.vkh-pg .num{ color:var(--oak3); } .vkh-pg .num::before,.vkh-pg .num::after{ background:linear-gradient(90deg,transparent,var(--oak2)); }
.vkh-pg h4{ color:var(--char); text-shadow:none; }
.vkh-pg .txt b{ color:var(--oak3); }
.vkh-pg .txt kbd{ background:#fff; border-color:var(--cab); box-shadow:0 1px 0 var(--grey); color:var(--char); }
.vkh-pg:not(.cover-pg):not(.has-plate):not(.founder-pg) .txt > p:first-child::first-letter{ color:var(--oak3); text-shadow:none; }
.vkh-bm{ background:linear-gradient(90deg,#1c2b0c,var(--leaf) 40%,#33481b); }
.vkh-bm::before{ background:rgba(255,255,255,.25); }
.vkh-plate .fr{ background:
    radial-gradient(circle,#fff 0 1.2px,var(--oak4) 1.8px,transparent 2.6px) top 2px left 2px/9px 9px no-repeat,
    radial-gradient(circle,#fff 0 1.2px,var(--oak4) 1.8px,transparent 2.6px) top 2px right 2px/9px 9px no-repeat,
    radial-gradient(circle,#fff 0 1.2px,var(--oak4) 1.8px,transparent 2.6px) bottom 2px left 2px/9px 9px no-repeat,
    radial-gradient(circle,#fff 0 1.2px,var(--oak4) 1.8px,transparent 2.6px) bottom 2px right 2px/9px 9px no-repeat,
    linear-gradient(135deg,var(--oak1),var(--oak2) 50%,var(--oak3)); }
.vkh-plate figcaption{ color:var(--oak3); }
.vkh-plate figcaption b{ color:#fff; }
.vkh-count{ color:#47453e; }

/* notebook */
.vkh-note{ color:var(--char); background-image:repeating-linear-gradient(transparent 0 27px,rgba(135,101,65,.25) 27px 28px); }
.vkh-note::placeholder{ color:#8b8a82; }
.vkh-ntitle{ color:var(--char); background:#fff; border-color:rgba(135,101,65,.5); } .vkh-ntitle:focus{ border-color:var(--oak2); }

/* notebook pages: single-ruled — one thin line per text row, the text sits on the lines, and the lines scroll with the text */
.vkh .vkh-note{
  font-size:15px; line-height:28px; padding:0 2px; background-attachment:local; background-size:100% 28px; background-origin:content-box;
  background-image:linear-gradient(to bottom,transparent 27px,rgba(135,101,65,.3) 27px 28px);
}

/* the pen-ink canvas lies over the page; it must not take up room, or the writing area collapses to nothing (no tap target, no keyboard) */
.vkh .vkh-pg > .vkh-ink{ position:absolute; inset:0; z-index:2; }
.vkh .vkh-pg > .vkh-note{ min-height:60%; }