/* Literature Constellations: layout and components on top of mafflab-theme.css */
:root{--c0:#FF2A85;--c1:#00F0FF;--c2:#B57BFF;--c3:#F4FF5A;--c4:#FB923C;--c5:#34D399;--c6:#38BDF8;--c7:#F472B6;--c8:#A3E635;--c9:#2DD4BF;--c10:#C4B5FD;--c11:#FCA5A5}
body{overflow-x:hidden}
.skip{position:absolute;left:-999px;top:8px;z-index:50;background:var(--bg-2);color:var(--white);padding:8px 12px;border:1px solid var(--cyan);border-radius:6px}
.skip:focus{left:8px}
.app-head{flex-wrap:wrap;gap:10px 14px;padding-top:12px;padding-bottom:12px}
.app-name.home{text-decoration:none}
.lc-logo{width:30px;height:30px;color:var(--cyan);filter:drop-shadow(0 0 6px rgba(0,240,255,.6))}
.lc-logo svg{width:30px;height:30px}
.lc-main{max-width:1320px;margin:0 auto;padding:clamp(18px,3vw,34px) var(--pad) 50px;display:grid;gap:20px}
.card:hover{box-shadow:none}
.h2s{margin:0}
.bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:space-between;margin-bottom:12px}
.hint-r{font-size:.76rem;color:var(--slate)}
.small{margin-top:10px;font-size:.78rem;color:var(--slate)}
.linkbtn{background:none;border:0;padding:0;color:var(--cyan);font:inherit;text-decoration:underline;cursor:pointer}

/* search */
.find{display:grid;gap:16px;padding:clamp(10px,4vw,40px) 0 10px}
.find-copy{max-width:780px}
.find h1{font-size:clamp(1.8rem,5vw,3.2rem);margin-bottom:12px;text-shadow:-2px 0 rgba(255,42,133,.5),2px 0 rgba(0,240,255,.4)}
.find-copy p{font-size:1.05rem}
.search{display:grid;grid-template-columns:1fr auto;gap:10px;max-width:780px}
.search .input{font-size:1rem;padding:14px 16px}
.opts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;max-width:780px}
.opts .seg button{font-size:.72rem}
.yr{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:.72rem;font-weight:400;color:var(--slate)}
.yr .input{width:92px;padding:7px 9px;font-family:var(--f-mono);font-size:.78rem}
.chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:.8rem;color:var(--slate)}
.chips button{font-family:var(--f-mono);font-size:.76rem;padding:7px 11px;border-radius:999px;border:1px solid var(--line-c);background:rgba(13,13,18,.6);color:var(--silver);cursor:pointer}
.chips button:hover{color:var(--white);border-color:var(--cyan)}
.chips button.demo{border-color:var(--line-m);color:var(--mag)}
.msg{padding:14px 16px;border:1px solid var(--line-m);border-radius:var(--r);background:rgba(255,42,133,.07);color:var(--white);font-size:.9rem;max-width:780px}
.msg button{margin-top:10px}

/* head */
.head{display:grid;gap:12px}
.head-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px}
.eyebrow{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan)}
#m-title{font-size:clamp(1.3rem,3.2vw,2rem);margin:4px 0 6px;overflow-wrap:anywhere}
.sub{font-size:.86rem;color:var(--silver)}
.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start}
.kv{display:flex;flex-wrap:wrap;gap:8px}
.kv span{font-family:var(--f-mono);font-size:.74rem;padding:5px 9px;border:1px solid var(--line);border-radius:4px;background:rgba(13,13,18,.5)}
.kv b{color:var(--white);font-weight:600}
.note{padding:10px 12px;border:1px dashed var(--warn);border-radius:var(--r);color:var(--warn);font-size:.84rem}

/* sky */
.stage-row{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px;align-items:start}
.stage{padding:0;overflow:hidden}
.sky{position:relative;height:min(72vh,720px);min-height:420px;background:radial-gradient(ellipse at 50% 40%,rgba(122,0,255,.16),transparent 70%),#08080d;border-radius:var(--r) var(--r) 0 0}
.sky canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
.sky canvas.drag{cursor:grabbing}
.status{position:absolute;left:16px;top:14px;right:16px;max-width:420px;display:grid;gap:6px;padding:10px 12px;border:1px solid var(--line-c);border-radius:6px;background:rgba(8,8,13,.82);font-family:var(--f-mono);font-size:.74rem;color:var(--cyan)}
.status[hidden]{display:none}
.pbar{height:3px;border-radius:2px;background:rgba(0,240,255,.12);overflow:hidden}
.pbar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--purple),var(--mag),var(--cyan));box-shadow:0 0 10px var(--mag)}
.status .linkbtn{justify-self:start;font-size:.72rem}
.zoom{position:absolute;right:12px;top:12px;display:grid;gap:6px}
.zoom button{width:36px;height:34px;border:1px solid var(--line-c);border-radius:6px;background:rgba(8,8,13,.8);color:var(--white);font-family:var(--f-mono);font-size:.8rem;cursor:pointer}
.zoom button:hover{border-color:var(--cyan)}
.tip{position:absolute;pointer-events:none;max-width:300px;padding:8px 10px;border:1px solid var(--line-c);border-radius:6px;background:rgba(8,8,13,.94);color:var(--white);font-size:.8rem;line-height:1.4;z-index:5}
.tip small{display:block;margin-top:4px;font-family:var(--f-mono);font-size:.68rem;color:var(--slate)}
.legend-sky{position:absolute;left:14px;bottom:12px;display:flex;flex-wrap:wrap;gap:4px 14px;font-family:var(--f-mono);font-size:.66rem;color:var(--silver);pointer-events:none;text-shadow:0 0 4px #000}
.legend-sky span{display:inline-flex;align-items:center;gap:6px}
.legend-sky i{display:inline-block;border-radius:50%;background:#fff;box-shadow:0 0 6px #fff}
.legend-sky .s1{width:10px;height:10px}.legend-sky .s2{width:7px;height:7px}.legend-sky .s3{width:4px;height:4px;opacity:.7}
.years{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 16px;border-top:1px solid var(--line)}
.years[hidden]{display:none}
.now{font-family:var(--f-mono);font-size:.8rem;color:var(--white);white-space:nowrap}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:none;margin:0;cursor:pointer}
input[type=range]::-webkit-slider-runnable-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--purple),var(--mag))}
input[type=range]::-moz-range-track{height:4px;border-radius:2px;background:linear-gradient(90deg,var(--purple),var(--mag))}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;margin-top:-7px;border-radius:50%;background:var(--white);border:2px solid var(--mag);box-shadow:0 0 12px rgba(255,42,133,.75)}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:var(--white);border:2px solid var(--mag)}

/* detail */
.detail{position:sticky;top:76px;display:grid;gap:12px;max-height:calc(100vh - 96px);overflow:auto;overscroll-behavior:contain}
.detail h3{font-family:var(--f-display);font-size:1.05rem;line-height:1.3;color:var(--white)}
.detail .meta{font-family:var(--f-mono);font-size:.72rem;color:var(--silver);display:grid;gap:3px}
.detail .abs{font-size:.86rem;line-height:1.6;color:var(--silver);white-space:pre-line}
.detail .abs.clip{display:-webkit-box;-webkit-line-clamp:9;-webkit-box-orient:vertical;overflow:hidden}
.detail .why{font-size:.8rem;color:var(--slate)}
.detail .why b{color:var(--white);font-weight:500}
.detail .links{display:flex;flex-wrap:wrap;gap:8px}
.quiet{font-size:.86rem;color:var(--slate)}
.dbadge{display:inline-flex;align-items:center;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.06em;text-transform:uppercase;padding:3px 7px;border-radius:3px;border:1px solid currentColor;white-space:nowrap}
.d-syn{color:var(--warn)}.d-rct{color:var(--cyan)}.d-ct{color:#7FDBFF}.d-obs{color:var(--silver)}.d-case{color:#FCA5A5}.d-pre{color:var(--ok)}.d-rev{color:#C4B5FD}.d-oth{color:var(--slate)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;box-shadow:0 0 8px currentColor;background:currentColor}
.k0{color:var(--c0)}.k1{color:var(--c1)}.k2{color:var(--c2)}.k3{color:var(--c3)}.k4{color:var(--c4)}.k5{color:var(--c5)}.k6{color:var(--c6)}.k7{color:var(--c7)}.k8{color:var(--c8)}.k9{color:var(--c9)}.k10{color:var(--c10)}.k11{color:var(--c11)}

/* constellations */
.clist{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.cc{display:grid;gap:8px;text-align:left;width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r);background:rgba(13,13,18,.55);color:var(--silver);font:inherit;cursor:pointer}
.cc:hover,.cc[aria-pressed="true"]{border-color:currentColor}
.cc .top{display:flex;align-items:center;gap:10px}
.cc .nm{font-family:var(--f-display);font-weight:600;color:var(--white);font-size:.95rem;line-height:1.25}
.cc .n{margin-left:auto;font-family:var(--f-mono);font-size:.74rem;color:var(--silver)}
.cc .flags{display:flex;flex-wrap:wrap;gap:6px}
.flag{font-family:var(--f-mono);font-size:.62rem;padding:2px 6px;border-radius:3px;border:1px solid var(--line);color:var(--silver)}
.flag.gap{border-color:rgba(255,42,133,.5);color:#ff9ac4}.flag.good{border-color:rgba(244,255,90,.5);color:var(--warn)}.flag.up{border-color:rgba(59,255,158,.5);color:var(--ok)}
.dbar{display:flex;height:6px;border-radius:3px;overflow:hidden;background:rgba(255,255,255,.04)}
.dbar i{display:block;height:100%}
.b-syn{background:var(--warn)}.b-rct{background:var(--cyan)}.b-ct{background:#7FDBFF}.b-obs{background:#94A3B8}.b-case{background:#FCA5A5}.b-pre{background:var(--ok)}.b-rev{background:#8B7FD6}.b-oth{background:#334155}
.spark{display:block;width:100%;height:22px}

/* matrix */
.tbl-wrap{overflow-x:auto}
.matrix{width:100%;border-collapse:collapse;font-size:.8rem}
.matrix th,.matrix td{padding:7px 9px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}
.matrix th{font-family:var(--f-mono);font-size:.64rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--slate)}
.matrix th:first-child,.matrix td:first-child{text-align:left;white-space:normal;min-width:180px}
.matrix td:first-child{color:var(--white)}
.matrix td.v{font-family:var(--f-mono)}
.matrix td.h0{color:var(--slate)}.matrix td.h1{background:rgba(0,240,255,.06)}.matrix td.h2{background:rgba(0,240,255,.13)}.matrix td.h3{background:rgba(0,240,255,.22);color:var(--white)}.matrix td.h4{background:rgba(0,240,255,.34);color:var(--white)}
.matrix td.gapc{color:#ff9ac4;background:rgba(255,42,133,.07)}
.matrix tr.foc td{outline:1px solid rgba(255,42,133,.35)}
.matrix tr{cursor:pointer}

/* papers */
.plist{list-style:none;margin:0;padding:0;display:grid}
.plist li button{display:grid;grid-template-columns:52px 86px 1fr;gap:12px;align-items:start;width:100%;padding:9px 6px;border:0;border-bottom:1px solid var(--line);background:none;color:var(--white);font:inherit;font-size:.86rem;text-align:left;cursor:pointer}
.plist li button:hover,.plist li.sel button{background:rgba(0,240,255,.05)}
.plist .y{font-family:var(--f-mono);font-size:.74rem;color:var(--slate)}
.plist .j{display:block;font-size:.74rem;color:var(--slate);margin-top:2px}
.seg.small button{font-size:.68rem;padding:6px 9px}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:60;padding:10px 16px;border:1px solid var(--line-c);border-radius:6px;background:rgba(13,13,18,.95);color:var(--white);font-family:var(--f-mono);font-size:.8rem;transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translate(-50%,0)}
.app-foot{display:flex;flex-wrap:wrap;gap:6px 24px;justify-content:space-between;max-width:1320px}
.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}

@media (max-width:1100px){.stage-row{grid-template-columns:1fr}.detail{position:static;max-height:none}}
@media (max-width:640px){
  .app-tag{display:none}
  .search{grid-template-columns:1fr}
  .sky{height:58vh;min-height:360px}
  .years{grid-template-columns:1fr auto}.years .btn{grid-column:1 / -1;justify-self:start}
  .plist li button{grid-template-columns:44px 1fr}.plist li button .dbadge{grid-column:2;justify-self:start}.plist li button span:last-child{grid-column:1 / -1}
}
@media (pointer:coarse){.card,.app-head{backdrop-filter:none;-webkit-backdrop-filter:none}.search .input{font-size:16px}}
.dbar-svg{display:block;width:100%;height:6px;border-radius:3px;background:rgba(255,255,255,.04)}
.dbar-svg .b-syn{fill:#F4FF5A}.dbar-svg .b-rct{fill:#00F0FF}.dbar-svg .b-ct{fill:#7FDBFF}.dbar-svg .b-obs{fill:#94A3B8}.dbar-svg .b-case{fill:#FCA5A5}.dbar-svg .b-pre{fill:#3BFF9E}.dbar-svg .b-rev{fill:#8B7FD6}.dbar-svg .b-oth{fill:#334155}
.gbars{display:grid;gap:6px}
.lc-main>*,.map>*,.stage-row>*{min-width:0}
.map{display:grid;gap:20px}
.map[hidden]{display:none}
.cc.k0{color:var(--c0)}.cc.k1{color:var(--c1)}.cc.k2{color:var(--c2)}.cc.k3{color:var(--c3)}.cc.k4{color:var(--c4)}.cc.k5{color:var(--c5)}.cc.k6{color:var(--c6)}.cc.k7{color:var(--c7)}.cc.k8{color:var(--c8)}.cc.k9{color:var(--c9)}.cc.k10{color:var(--c10)}.cc.k11{color:var(--c11)}
