/* ════════════════════════════════════
   biblioteca/style.css
   Biblioteca interattiva fantasy
   Estratto da library-gallery.js (_injectLibCSS)
   JS: scripts/js/pages/biblioteca/script.js
════════════════════════════════════ */

.hb-library-container{width:100%;max-width:100%;box-sizing:border-box;display:block;}
.lib-wrap{display:flex;flex-direction:column;width:100%;max-width:100%;box-sizing:border-box;border:1px solid rgba(200,155,60,.15);background:#06080e;}
.lib-filters{display:flex;flex-wrap:wrap;gap:6px;padding:14px 20px;border-bottom:1px solid rgba(200,155,60,.12);background:rgba(4,6,12,.8);flex-shrink:0;}
.lib-filter{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.12em;text-transform:uppercase;padding:5px 12px;border:1px solid rgba(200,155,60,.2);background:transparent;color:rgba(200,155,60,.5);cursor:pointer;transition:.15s;border-radius:2px;}
.lib-filter:hover{background:rgba(200,155,60,.08);color:rgba(200,155,60,.9);}
.lib-filter.active{background:rgba(200,155,60,.12);border-color:var(--fc,rgba(200,155,60,.6));color:var(--fc,rgba(200,155,60,.9));}
.lib-body{display:grid;grid-template-columns:minmax(0,1fr) 340px;flex:1;}
.lib-shelves{display:flex;flex-direction:column;justify-content:flex-end;padding:24px 24px 0;background:radial-gradient(ellipse 80% 30% at 50% 100%,rgba(60,40,10,.3) 0%,transparent 70%),linear-gradient(180deg,#06080e 0%,#0a0c12 100%);overflow:hidden;}
.lib-shelf-row{display:flex;flex-direction:column;}
.lib-shelf-books{display:flex;align-items:flex-end;gap:4px;padding:0 8px;padding-top:28px;}
.lib-shelf-base{height:14px;background:linear-gradient(180deg,#3a2a10 0%,#2a1c08 60%,#1a1006 100%);border-top:2px solid rgba(200,155,60,.4);box-shadow:0 4px 16px rgba(0,0,0,.7),inset 0 1px 0 rgba(200,155,60,.15);margin:0 -24px;flex-shrink:0;position:relative;z-index:1;}
.lib-book{position:relative;width:var(--bw,32px);height:var(--bh,160px);flex-shrink:0;cursor:pointer;transform:rotate(var(--btilt,0deg));transform-origin:bottom center;transition:transform .25s cubic-bezier(.34,1.56,.64,1),opacity .2s;filter:drop-shadow(2px 0 4px rgba(0,0,0,.5));z-index:2;}
.lib-book.selected{filter:drop-shadow(0 0 12px rgba(200,155,60,.4)) drop-shadow(2px 0 4px rgba(0,0,0,.5));z-index:3;}
.lib-spine{position:absolute;inset:0;background:linear-gradient(105deg,color-mix(in srgb,var(--sc-bg) 60%,#fff 5%) 0%,var(--sc-bg) 30%,color-mix(in srgb,var(--sc-bg) 80%,#000 20%) 70%,color-mix(in srgb,var(--sc-bg) 50%,#000 50%) 100%);border-left:2px solid var(--sc-acc);border-right:1px solid rgba(0,0,0,.4);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;padding:8px 3px;}
.lib-spine-title{font-family:'Cinzel',serif;font-size:7px;letter-spacing:.06em;color:var(--sc-txt);writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);text-align:center;line-height:1.3;max-height:80%;overflow:hidden;opacity:.9;}
.lib-spine-deco{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:60%;height:1px;background:var(--sc-acc);opacity:.4;}
.lib-spine-deco::after{content:'';position:absolute;bottom:-8px;left:0;right:0;height:1px;background:var(--sc-acc);opacity:.4;top:auto;}
.lib-book-top{position:absolute;top:-5px;left:2px;right:-4px;height:5px;background:linear-gradient(90deg,color-mix(in srgb,var(--sc-bg) 90%,#fff 10%) 0%,color-mix(in srgb,var(--sc-bg) 70%,#fff 30%) 50%,color-mix(in srgb,var(--sc-bg) 80%,#fff 20%) 100%);transform:skewX(-45deg);transform-origin:left bottom;}
.lib-book-side{position:absolute;top:-4px;right:-4px;bottom:0;width:4px;background:linear-gradient(180deg,color-mix(in srgb,var(--sc-bg) 60%,#fff 10%) 0%,color-mix(in srgb,var(--sc-bg) 40%,#000 30%) 100%);transform:skewY(-45deg);transform-origin:left top;}
.lib-info{border-left:1px solid rgba(200,155,60,.12);background:rgba(4,6,12,.95);overflow-y:auto;display:flex;align-items:center;justify-content:center;min-height:300px;}
.lib-info.open{align-items:flex-start;}
.lib-info-placeholder{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.1em;color:rgba(200,155,60,.2);text-align:center;padding:40px 20px;}
.lib-info-loading{display:flex;justify-content:center;padding:60px;}
.lib-info-err{color:rgba(200,60,60,.5);font-family:'Cinzel',serif;font-size:11px;padding:40px;text-align:center;}
.lib-info-inner{width:100%;}
.lib-info-header{padding:20px 20px 14px;border-bottom:1px solid rgba(200,155,60,.1);background:linear-gradient(135deg,var(--sc-bg,#0c0e14) 0%,rgba(4,6,12,.9) 100%);display:flex;gap:12px;align-items:flex-start;}
.lib-info-icon{font-size:28px;flex-shrink:0;margin-top:2px;}
.lib-info-title{font-family:'Cinzel',serif;font-size:14px;font-weight:700;color:rgba(240,220,180,.95);letter-spacing:.04em;line-height:1.4;margin-bottom:8px;}
.lib-info-tags{display:flex;flex-wrap:wrap;gap:4px;}
.lib-tag{font-family:'Cinzel',serif;font-size:8px;letter-spacing:.1em;padding:2px 7px;border:1px solid;border-radius:2px;text-transform:uppercase;}
.lib-info-body{padding:16px 20px;font-size:13px;max-height:400px;overflow-y:auto;}
.lib-info-footer{padding:12px 20px 20px;border-top:1px solid rgba(200,155,60,.1);}
.lib-open-btn{font-family:'Cinzel',serif;font-size:9px;letter-spacing:.14em;text-transform:uppercase;padding:8px 16px;border:1px solid rgba(200,155,60,.4);background:rgba(200,155,60,.06);color:rgba(200,155,60,.8);cursor:pointer;transition:.15s;width:100%;}
.lib-open-btn:hover{background:rgba(200,155,60,.15);color:rgba(200,155,60,1);border-color:rgba(200,155,60,.7);}
.lib-loader{display:flex;justify-content:center;align-items:center;padding:80px;}
@media(max-width:640px){
  .lib-body{grid-template-columns:1fr;}
  .lib-info{border-left:none;border-top:1px solid rgba(200,155,60,.12);min-height:200px;}
  .lib-shelves{padding:20px 12px 0;}
}
