:root{
  --ink:#0e0a08; --mahog:#2a1611; --brass:#c9a15a; --parch:#efe6d2; --sepia:#6b4b2e;
  --accent:#c9a15a;
}
body.w-P{--accent:#efe3c0}
body.w-R{--accent:#c08a52}
body.w-U{--accent:#8fd1c8}
body.w-I{--accent:#b78cff}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:radial-gradient(ellipse at 50% 0%,#3a2018 0%,var(--ink) 70%);color:var(--parch);font-family:'Cormorant Garamond',serif;display:flex;flex-direction:column;min-height:100vh}
.mono{font-family:'Special Elite',monospace}
header{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid #c9a15a33}
.title-block{flex:1;min-width:240px}
h1{margin:0;font-weight:300;font-size:clamp(22px,3.4vw,40px);letter-spacing:.02em;color:var(--accent);transition:color .6s}
.sub{margin:2px 0 0;font-size:14px;opacity:.75}
#wings{display:flex;gap:6px;flex-wrap:wrap}
.plaque{background:linear-gradient(#d8b56c,#8a6528);color:#1f140b;border:1px solid #5a3f18;border-radius:3px;padding:5px 12px;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:15px;cursor:pointer;box-shadow:inset 0 1px #fff6,0 2px 4px #0008;display:flex;flex-direction:column;line-height:1}
.plaque small{font-weight:300;font-style:italic;font-size:11px}
.plaque.active{outline:2px solid var(--accent);outline-offset:2px}
.plaque[data-w="I"]{background:linear-gradient(120deg,#b78cff,#7ee0ff,#ff9ad5);background-size:200%;animation:iri 4s linear infinite}
@keyframes iri{to{background-position:200% 0}}
#auth-status{font-size:13px}
#auth-status button{background:none;border:1px solid #c9a15a66;color:var(--parch);padding:3px 8px;cursor:pointer;font-family:inherit}
main{flex:1;display:flex;min-height:0}
#viewport{position:relative;flex:1;min-height:52vh}
#scene-container{position:absolute;inset:0}
#scene-container canvas{display:block}
.vignette{position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 160px #000}
#search-desk{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:min(480px,90%)}
#search{width:100%;padding:9px 14px;background:#140d0acc;border:1px solid #c9a15a66;color:var(--parch);font-family:'Special Elite',monospace;font-size:14px;border-radius:2px}
#search-msg{font-style:italic;font-size:14px;text-align:center;margin-top:4px;text-shadow:0 1px 3px #000}
#librarian{position:absolute;bottom:14px;left:14px;background:none;border:none;cursor:pointer;animation:float 3s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-6px)}}
#quip{position:absolute;bottom:70px;left:20px;max-width:280px;background:var(--parch);color:#2a1611;padding:10px 12px;font-style:italic;font-size:15px;border-radius:2px;box-shadow:0 4px 12px #000a}
.hidden{display:none!important}
#card{width:360px;padding:16px;overflow:auto}
.card-inner{background:var(--parch);color:#2a1611;padding:16px 18px;border-radius:2px;box-shadow:0 8px 30px #000c;
  background-image:repeating-linear-gradient(transparent 0 27px,#9bb3d633 27px 28px),radial-gradient(circle at 30% 20%,#fff8 0,transparent 60%);position:relative}
.card-inner::before{content:'';position:absolute;left:0;right:0;top:44px;height:1px;background:#c0392b66}
.card-top{display:flex;justify-content:space-between;font-family:'Special Elite',monospace;font-size:12px;letter-spacing:.2em;margin-bottom:16px}
.badge{padding:2px 8px;border:1px solid currentColor;border-radius:10px;letter-spacing:.05em}
.lbl{font-size:12px;text-transform:uppercase;letter-spacing:.2em;opacity:.6}
.code-input{width:100%;font-size:20px;background:transparent;border:none;border-bottom:1px dashed #6b4b2e;color:#2a1611;padding:2px 0;outline:none}
#obj-name{font-size:26px;margin:10px 0 4px;line-height:1.05;font-weight:700}
.desc{font-style:italic;font-size:16px;line-height:1.35;min-height:60px}
#props{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;font-size:15px;margin:10px 0}
#props dt{font-family:'Special Elite',monospace;font-size:12px;opacity:.65;padding-top:2px}
#props dd{margin:0}
.btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.btns button{flex:1;min-width:90px;background:#2a1611;color:var(--parch);border:none;padding:7px 6px;font-family:'Cormorant Garamond',serif;font-weight:700;font-size:15px;cursor:pointer;border-radius:2px}
.btns button:hover{background:#4a2a1e}
.btns button.ghost{background:transparent;color:#2a1611;border:1px solid #2a161166}
#borrow.on{background:#8a6528}
#drawer{margin-top:10px;max-height:220px;overflow:auto;border-top:1px solid #2a161133;padding-top:6px}
#drawer .row{display:flex;justify-content:space-between;gap:8px;padding:4px 0;border-bottom:1px dotted #2a161133;cursor:pointer;font-size:15px}
#drawer .row span:last-child{font-family:'Special Elite',monospace;font-size:12px;opacity:.7}
#shelf{display:flex;align-items:center;gap:8px;padding:8px 14px;border-top:1px solid #c9a15a33;background:#0c0806}
#thumbs{flex:1;display:flex;gap:6px;overflow-x:auto;justify-content:center}
.thumb{flex:0 0 auto;width:76px;cursor:pointer;text-align:center;font-family:'Special Elite',monospace;font-size:9px;opacity:.75;transition:.2s}
.thumb img{width:76px;height:76px;border:1px solid #c9a15a44;background:#140d0a;display:block}
.thumb.cur{opacity:1}.thumb.cur img{border-color:var(--accent);box-shadow:0 0 12px var(--accent)}
.thumb:hover{opacity:1;transform:translateY(-3px)}
.arrow{background:none;border:1px solid #c9a15a55;color:var(--brass);font-size:26px;width:36px;height:76px;cursor:pointer}
.jump input{width:130px;padding:6px;background:#140d0a;border:1px solid #c9a15a55;color:var(--parch)}
footer{text-align:center;font-size:14px;padding:8px;opacity:.7}
footer a{color:var(--brass)}
#toast{position:fixed;bottom:120px;left:50%;transform:translateX(-50%);background:var(--parch);color:#2a1611;padding:8px 16px;font-style:italic;opacity:0;transition:.3s;pointer-events:none;z-index:9}
#toast.show{opacity:1}
body.w-I h1{animation:glitch 3s infinite}
@keyframes glitch{0%,92%,100%{text-shadow:none;transform:none}93%{text-shadow:2px 0 #7ee0ff,-2px 0 #ff9ad5;transform:skewX(4deg)}96%{text-shadow:-2px 0 #7ee0ff,2px 0 #ff9ad5}}
@media(max-width:820px){
  main{flex-direction:column}
  #card{width:100%;padding:10px}
  .jump{display:none}
  .thumb{width:56px}.thumb img{width:56px;height:56px}
  .arrow{height:56px}
}