.myth-lib{position:relative;width:100%;margin:0 0 2rem;background:#070912;border-radius:12px;overflow:hidden;color:#e8ecf8}
.myth-lib__c{display:block;width:100%;height:var(--myth-lib-h,70vh);touch-action:none;cursor:grab;outline:none}
.myth-lib__c:active{cursor:grabbing}
.myth-lib__c.is-over{cursor:pointer}

/* the unmapped-field line — the one honest label, shown until an entry is focused */
.myth-lib__note{position:absolute;top:.9rem;left:1rem;margin:0;max-width:60%;font-size:.72rem;line-height:1.5;color:rgba(200,214,245,.4);pointer-events:none}
.myth-lib__note[hidden]{display:none}

/* focused-entry card */
.myth-lib__card{position:absolute;top:.9rem;left:1rem;width:min(280px,44%);background:rgba(10,13,24,.7);border:1px solid rgba(160,190,255,.16);border-radius:10px;padding:.7rem .85rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.myth-lib__card[hidden]{display:none}
.myth-lib__eyebrow{display:block;color:rgba(240,170,95,.9);font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;margin-bottom:.28rem}
.myth-lib__eyebrow:empty{display:none}
.myth-lib__title{display:block;color:#fff;font-size:.96rem;line-height:1.32;text-decoration:none}
.myth-lib__title:hover{color:#f0aa5f}
.myth-lib__ex{display:block;color:rgba(200,214,245,.58);font-size:.74rem;line-height:1.5;margin-top:.38rem}
.myth-lib__ex:empty{display:none}

/* bottom transport + filmstrip — the Map's UI language, the constellation's feel */
.myth-lib__bar{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:10px;padding:10px 12px 12px;background:linear-gradient(to top,rgba(6,8,15,.92),rgba(6,8,15,0))}
.myth-lib__btn{appearance:none;border:none;cursor:pointer;color:#d7e0f5;background:rgba(160,190,255,.08);width:34px;height:34px;border-radius:50%;font-size:13px;line-height:1;display:grid;place-items:center;flex:0 0 auto;padding:0;transition:background .15s,color .15s}
.myth-lib__btn:hover{background:rgba(240,170,95,.16);color:#ffd9a8}
.myth-lib__strip{display:flex;gap:7px;overflow-x:auto;scroll-behavior:smooth;padding:4px 2px;flex:1 1 auto;scrollbar-width:none}
.myth-lib__strip::-webkit-scrollbar{display:none}
.myth-lib__cell{position:relative;flex:0 0 auto;width:46px;height:46px;border-radius:7px;overflow:hidden;cursor:pointer;padding:0;border:1px solid rgba(160,190,255,.18);background:rgba(160,190,255,.05);opacity:.5;transition:opacity .18s,transform .18s,border-color .18s,box-shadow .18s}
.myth-lib__cell:hover{opacity:.85}
.myth-lib__cell img{width:100%;height:100%;object-fit:cover;display:block}
.myth-lib__cell.is-blank::after{content:'';position:absolute;inset:42%;border-radius:50%;background:rgba(190,215,255,.5)}
.myth-lib__cell.is-on{opacity:1;border-color:rgba(255,210,150,.9);transform:translateY(-3px);box-shadow:0 0 0 1px rgba(255,210,150,.5),0 4px 14px rgba(240,170,95,.25)}
.myth-lib__count{flex:0 0 auto;font-size:11px;color:rgba(200,214,245,.5);min-width:56px;text-align:center;font-variant-numeric:tabular-nums}

@media(max-width:600px){
.myth-lib__card{width:58%}
.myth-lib__title{font-size:.85rem}
.myth-lib__count{display:none}
.myth-lib__cell{width:40px;height:40px}
}