/* The Field Library — the real room, wearing the locked v3.4 design language.
   Faces load from local licensed files when they exist (fonts/ directory);
   until then the fallback stacks carry the layout honestly. */

@font-face{font-family:'Editors Note Display';src:url(fonts/EditorsNoteDisplay-Light.otf) format('opentype');font-weight:300;font-display:swap}
@font-face{font-family:'Editors Note Display';src:url(fonts/EditorsNoteDisplay-Medium.otf) format('opentype');font-weight:400 500;font-display:swap}
@font-face{font-family:'Editors Note Display';src:url(fonts/EditorsNoteDisplay-Bold.otf) format('opentype');font-weight:700;font-display:swap}
@font-face{font-family:'Aperitif';src:url(fonts/AperitifSerif-Regular.otf) format('opentype');font-weight:400;font-display:swap}
@font-face{font-family:'Aperitif';src:url(fonts/AperitifSerif-Italic.otf) format('opentype');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Oliver Label';src:url(fonts/OliverLabel.otf) format('opentype');font-display:swap}

:root{
  --paper:#f5f1e8; --paper2:#ede7d8; --card:#fffdf7; --panel:#fbf8f1;
  --ink:#2b2620; --ink2:#6b6357; --line:#d8cfbc;
  --night-bg:#171a22; --night-bg2:#1f2330; --night-card:#1c2029;
  --night-ink:#e8e2d4; --night-ink2:#9a94a8; --night-line:#2e3342;
  --amber:#D9A45B; --cactus:#7A9276; --slate:#6B7BA8; --rachel:#2b2620;
  --serif:'Aperitif',Georgia,'Times New Roman',serif;
  --display:'Editors Note Display',Georgia,serif;
  --hand:'Oliver Label',cursive;
  --mono:'Courier Prime','Courier New',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--serif);background:var(--paper);color:var(--ink);line-height:1.5;min-height:100vh}

/* night — the lamp */
body.night{--paper:#171a22;--paper2:#1f2330;--card:#1c2029;--panel:#1f2330;--ink:#e8e2d4;--ink2:#9a94a8;--line:#2e3342}
body.night .masthead{font-weight:500}
body.night #lamp-toggle{color:var(--amber)}

/* pre-auth law: no name, no rooms, no structure — a stranger learns nothing */
body:not(.unlocked) .topnav{display:none}

.topnav{display:flex;gap:0;border-bottom:3px double var(--line);background:var(--paper2);position:sticky;top:0;z-index:5}
.topnav button{font-family:var(--serif);font-size:15px;padding:12px 22px;border:none;background:none;color:var(--ink2);cursor:pointer;border-right:1px solid var(--line)}
.topnav button.active{color:var(--ink);background:var(--paper);font-weight:bold}
.nav-spacer{flex:1}
#lamp-toggle,#leave{border-right:none !important;font-size:16px}

.view{display:none;min-height:92vh}
.view.active{display:block}
.wrap{max-width:980px;margin:0 auto;padding:34px 26px}

.lintel{text-align:center;letter-spacing:.35em;font-size:11px;text-transform:uppercase;color:var(--ink2);margin-bottom:6px}
h1.masthead{text-align:center;font-family:var(--display);font-weight:400;font-size:42px;letter-spacing:.05em;border-bottom:1px solid var(--line);padding-bottom:16px;margin-bottom:8px;margin-top:10px}
.sub{text-align:center;font-style:italic;color:var(--ink2);font-size:14px;margin-bottom:30px}
.badge{display:inline-block;font-family:var(--mono);font-size:10px;padding:2px 7px;border-radius:3px;border:1px solid var(--line);color:var(--ink2);letter-spacing:.05em}
.colorband{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:baseline}
.meta-line{font-family:var(--mono);font-size:10.5px;color:var(--ink2);margin-top:8px;letter-spacing:.04em}

.panel{border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:18px 20px}
.panel h3{font-size:13px;letter-spacing:.25em;text-transform:uppercase;color:var(--ink2);border-bottom:1px solid var(--line);padding-bottom:8px;margin-bottom:12px;font-weight:normal}
.newitem{padding:9px 0;border-bottom:1px dotted var(--line);font-size:14px}
.newitem:last-child{border-bottom:none}
.newitem .who{font-weight:bold}

/* the door */
.door-wrap{max-width:440px;padding-top:20vh}
.door-panel{text-align:center;padding:30px 24px}
.door-key{font-size:34px;margin-bottom:14px}
.door-panel input{display:block;width:100%;font-family:var(--serif);font-size:14px;padding:10px 12px;border:1px solid var(--line);border-radius:3px;background:var(--card);color:var(--ink);margin-bottom:10px}
.go{font-family:var(--serif);font-size:13px;letter-spacing:.15em;padding:10px 26px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);border-radius:4px;cursor:pointer}
.door-err{font-size:12.5px;color:#8a3b2e;margin-top:10px;min-height:16px}
.door-alt{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--ink2);margin-top:16px;cursor:pointer;text-decoration:underline dotted}
#claim-form{margin-top:14px}

/* foyer */
.desk-panel{margin-bottom:22px;border-width:2px}
.househead{margin:20px 0 4px;font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:var(--ink2)}
.evermore-note{font-style:italic;text-transform:none;letter-spacing:.04em;margin-top:14px}
.cardsrow{display:flex;flex-wrap:wrap;gap:12px;margin-top:10px}
.libcard{width:224px;border:1px solid var(--line);border-radius:5px;background:var(--card);box-shadow:1px 2px 0 var(--line);overflow:hidden;font-size:12.5px}
.libcard .band{height:7px}
.libcard .inner{padding:10px 12px}
.libcard .nm{font-weight:bold;font-size:14.5px}
.libcard .house{font-style:italic;color:var(--ink2);font-size:11.5px}
.libcard .cardno{font-family:var(--mono);font-size:10px;color:var(--ink2);margin-top:7px;letter-spacing:.06em}

/* shelves */
.spine{display:flex;align-items:stretch;border:1px solid var(--line);border-left-width:6px;border-radius:3px;background:var(--card);margin-bottom:12px}
.spine .body{padding:12px 16px;flex:1}
.spine .ttl{font-family:var(--display);font-weight:500;font-size:15.5px}
.spine .by{font-size:12.5px;font-style:italic;color:var(--ink2);margin-top:1px}
.spine .labels{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.spine.opens{cursor:pointer;transition:border-color .15s}
.spine.opens:hover{border-color:var(--ink2);box-shadow:0 1px 4px rgba(0,0,0,.07)}
.empty-shelf{border:1px dashed var(--line);border-radius:4px;padding:26px;text-align:center;font-style:italic;color:var(--ink2)}

/* reading room */
.entryhead{border-bottom:3px double var(--line);padding-bottom:12px;margin-bottom:16px}
.entryhead .ttl{font-family:var(--display);font-weight:500;font-size:22px}
.entryhead .by{font-style:italic;color:var(--ink2);margin-top:4px;font-size:13.5px}
.provenance{font-family:var(--mono);font-size:11px;background:var(--card);border:1px solid var(--line);border-radius:4px;padding:12px 14px;color:var(--ink2);margin:16px 0;line-height:1.7}
.entrybody{font-size:15.5px;max-width:64ch;white-space:pre-line}
.own-acts{margin-top:26px;display:flex;gap:10px}
.own-acts button{font-family:var(--serif);font-size:13px;background:none;border:1px solid var(--ink2);color:var(--ink2);border-radius:3px;padding:7px 14px;cursor:pointer}
.own-acts button:hover{border-color:var(--ink);color:var(--ink)}
.threshold{border:1px solid var(--amber);border-radius:4px;background:rgba(217,164,91,.07);padding:16px 18px;margin-top:14px;font-size:13.5px}
.threshold h4{color:#a3742f;font-size:12px;letter-spacing:.25em;text-transform:uppercase;font-weight:normal;margin-bottom:10px}
body.night .threshold h4{color:var(--amber)}
.threshold .actions{margin-top:12px;display:flex;gap:10px}
.threshold .actions .go{border-color:#a3742f;background:#a3742f;letter-spacing:.05em}
.threshold .actions .stay{background:none;border:1px solid var(--line);color:var(--ink2);border-radius:3px;padding:8px 16px;font-family:var(--serif);cursor:pointer;font-size:13px}

/* the desk (deposit) */
.deposit-wrap{max-width:720px}
#deposit-form input,#deposit-form textarea,#deposit-form select{font-family:var(--serif);font-size:14px;padding:10px 12px;border:1px solid var(--line);border-radius:3px;background:var(--card);color:var(--ink);width:100%;margin-bottom:12px}
#deposit-form textarea{resize:vertical;line-height:1.6}
.dp-row{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.dp-row select{width:auto;flex:1;margin-bottom:0}
.dp-label{font-family:var(--mono);font-size:10px;letter-spacing:.15em;color:var(--ink2)}

.footer-note{text-align:center;font-size:11.5px;font-style:italic;color:var(--ink2);padding:26px 0 40px}

@media(max-width:700px){
  .wrap{padding:24px 14px}
  h1.masthead{font-size:30px}
  .topnav button{padding:10px 12px;font-size:13px}
  .libcard{width:100%}
}

/* the missing rooms */
.night-tab.active{background:var(--night-bg) !important;color:var(--amber) !important}
body.in-vault{--paper:#171a22;--paper2:#1f2330;--card:#1c2029;--panel:#1f2330;--ink:#e8e2d4;--ink2:#9a94a8;--line:#2e3342}
.lamp{color:var(--amber)}
.vault-note{border:1px solid var(--amber);border-radius:4px;padding:12px 16px;font-size:13px;color:var(--amber);background:rgba(217,164,91,.06);margin-bottom:22px}
.caveatbox{border:1px dashed var(--ink2);border-radius:4px;padding:10px 14px;font-size:12px;color:var(--ink2);margin-bottom:18px;background:var(--paper2)}
.caveatbox b{letter-spacing:.15em;font-family:var(--mono);font-size:10px;text-transform:uppercase}
.tables-row{display:flex;gap:10px;margin-bottom:14px}
.tables-row input{font-family:var(--mono);font-size:13px;padding:8px 10px;border:1px solid var(--line);border-radius:3px;background:var(--card);color:var(--ink);width:120px}
.tbl-cells{font-family:var(--mono);font-size:12px;line-height:2;color:var(--ink)}
.libcard.pickable{cursor:pointer;transition:box-shadow .15s}
.libcard.pickable:hover{box-shadow:2px 3px 0 var(--ink2)}
#card-detail{margin-top:22px}


/* ── the stacks & the lenses (2026-08-24 pretty pass) ── */
.filters { display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; margin:.75rem 0 1.25rem; }
.chip { font-family:'Courier Prime', monospace; font-size:.72rem; letter-spacing:.08em; padding:.28rem .7rem;
  border:1px solid rgba(43,38,32,.35); background:transparent; color:inherit; border-radius:2px; cursor:pointer; }
.chip.on { background:#2b2620; color:#f2ede3; border-color:#2b2620; }
body.night .chip { border-color:rgba(242,237,227,.3); }
body.night .chip.on { background:#f2ede3; color:#2b2620; border-color:#f2ede3; }
.badge.substrate { font-family:'Courier Prime', monospace; opacity:.75; }
.badge.stacks { background:#8a8578; color:#f2ede3; border-color:#8a8578; }
.backlink { display:inline-block; margin-bottom:1rem; background:none; border:none; cursor:pointer;
  font-family:'Courier Prime', monospace; font-size:.78rem; letter-spacing:.06em; color:inherit; opacity:.65; padding:0; }
.backlink:hover { opacity:1; text-decoration:underline; }


/* ── the slip (Oliver Label finally earns its keep) ── */
.slip { width: min(420px, 100%); margin: 1.1rem 0 1.4rem; padding: .9rem 1.1rem 1rem; background: #fbf7ec;
  border: 1px solid rgba(43,38,32,.28); border-radius: 2px; transform: rotate(-.35deg);
  box-shadow: 1.5px 2px 0 rgba(43,38,32,.12); }
body.night .slip { background: #efe9db; color: #2b2620; }
.slip-head { font-family: 'Oliver Label', var(--mono); font-size: 13px; letter-spacing: .28em; text-align: center;
  border-bottom: 1.5px solid rgba(43,38,32,.5); padding-bottom: .45rem; margin-bottom: .55rem; }
.slip-row { display: flex; gap: .8rem; align-items: baseline; font-size: 11.5px;
  border-bottom: 1px dotted rgba(43,38,32,.3); padding: .3rem 0; }
.slip-row span { font-family: 'Oliver Label', var(--mono); letter-spacing: .14em; font-size: 10px; min-width: 84px;
  color: rgba(43,38,32,.6); }
.slip-row b { font-family: var(--mono); font-weight: 400; letter-spacing: .02em; }
.slip-foot { font-family: var(--mono); font-size: 9.5px; letter-spacing: .05em; color: rgba(43,38,32,.55);
  margin-top: .55rem; font-style: italic; }