/* Dana's Arcane Tome — illustrated parchment UI */
:root{--paper:#d9b77d;--paper2:#e8ca94;--paper3:#c99e61;--ink:#25170a;--soft:#614629;--leather:#050a0f;--leather2:#09131c;--blue:#177dff;--blue2:#75c1ff;--gold:#b98a3d;--line:#876034;--panel:var(--paper);--muted:#614629;color:var(--ink);background:#03070a}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:Georgia,"Times New Roman",serif;background:radial-gradient(circle at 70% 0,rgba(25,119,255,.12),transparent 32rem),linear-gradient(135deg,#020507,#08111a 55%,#020406);min-height:100vh}.tomeShell{display:grid;grid-template-columns:285px minmax(0,1fr);gap:22px;max-width:1600px;margin:14px auto;padding:0 14px;min-height:calc(100vh - 70px)}
.topbar{position:sticky;top:14px;height:calc(100vh - 28px);z-index:10;display:flex;flex-direction:column;justify-content:flex-start;padding:28px 18px;background:radial-gradient(circle at 50px 40px,rgba(23,125,255,.16),transparent 11rem),linear-gradient(145deg,#08121b,#03070b);border:1px solid #745326;box-shadow:inset 0 0 0 3px #111820,inset 0 0 0 4px #8b6630,0 14px 40px #000;border-radius:2px;color:#e6c78c;overflow:hidden}.topbar:before,.topbar:after{content:"✦";position:absolute;left:50%;transform:translateX(-50%);color:#5bb4ff;text-shadow:0 0 12px #167cff;font-size:24px}.topbar:before{top:5px}.topbar:after{bottom:5px}.tomeBrand{text-align:center;border-bottom:1px solid #624822;padding:10px 4px 25px;margin-bottom:18px;position:relative}.brandSigil{font-size:54px;line-height:1;color:#6fc0ff;text-shadow:0 0 8px #177dff,0 0 25px #177dff;margin-bottom:8px}.eyebrow{font-size:29px;color:#ead09d;letter-spacing:.12em;font-weight:400}.topbar h1{font-size:27px;margin:3px 0 10px;color:#6cb9ff;letter-spacing:.06em;text-shadow:0 0 11px rgba(23,125,255,.65)}.brandTagline{font-style:italic;color:#d3b373;font-size:16px}.topbar nav{display:flex;flex-direction:column;gap:5px;width:100%}.nav{width:100%;display:grid;grid-template-columns:35px 1fr;gap:9px;align-items:center;text-align:left;border:1px solid transparent;background:transparent;color:#cda85f;padding:10px;border-radius:2px;cursor:pointer;font-family:Georgia,"Times New Roman",serif}.navIcon{font-size:22px;color:#c59440;text-align:center}.nav b,.nav small{display:block}.nav b{font-size:14px;letter-spacing:.04em}.nav small{font-size:11px;color:#a99572;margin-top:2px;font-weight:400}.nav:hover{background:#0d1924;border-color:#66502e}.nav.active{background:linear-gradient(90deg,#0c1b2b,#0a1723);border-color:#2988f5;color:#f0d297;box-shadow:0 0 12px rgba(23,125,255,.6),inset 0 0 13px rgba(23,125,255,.12)}.nav.active .navIcon{color:#71c3ff;text-shadow:0 0 8px #177dff}.nav.active small{color:#c6d8e8}.sidebarRune{margin-top:auto;text-align:center;color:#4aa7ff;text-shadow:0 0 12px #177dff;font-size:26px}
main{max-width:none;margin:0;padding:34px 38px 65px;min-width:0;background:linear-gradient(rgba(231,201,147,.96),rgba(211,172,108,.97)),repeating-linear-gradient(4deg,rgba(80,45,15,.035) 0 1px,transparent 1px 5px);border:2px solid #765126;box-shadow:inset 0 0 65px rgba(83,47,14,.3),inset 18px 0 32px rgba(80,43,11,.11),0 0 0 5px #26180c,0 0 0 7px #89632f,0 20px 55px #000;position:relative;min-height:calc(100vh - 28px);border-radius:5px 14px 8px 10px}main:before,main:after{content:"✦";position:absolute;left:50%;color:#187cf4;text-shadow:0 0 10px #1788ff;font-size:28px;z-index:2}main:before{top:-18px}main:after{bottom:-19px}.view{display:none}.view.active{display:block}.hero,.sectionHead{display:flex;justify-content:space-between;gap:30px;align-items:end;margin:0 0 18px;padding:0 0 28px;border-bottom:1px solid rgba(69,43,18,.65);position:relative}.hero:after,.sectionHead:after{content:"◌";position:absolute;right:2%;top:-25px;font-size:145px;line-height:1;color:rgba(17,83,150,.28);pointer-events:none}.arcaneDiagram{font-size:85px;color:rgba(21,94,172,.32);padding-right:55px}.kicker{font-size:13px;letter-spacing:.07em;color:#13589f;font-weight:900}.kicker:before{content:"✧ ";color:#177dff}.hero h2,.sectionHead h2,.importBox h2,.deckDetail h2,.builderHead h2{font-family:Georgia,"Times New Roman",serif;color:#211307}.hero h2,.sectionHead h2{font-size:clamp(42px,4.7vw,66px);line-height:1;margin:8px 0 12px}.hero p,.sectionHead p,.importBox p,.builderHead p,.meta{color:var(--soft)}.updatedBlock{position:relative;z-index:2;text-align:right}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:16px}.stat,.card,.deck,.buildWorkspace,.buildListItem,.importBox,.emptyState,.modalCard{background:linear-gradient(145deg,rgba(237,210,160,.92),rgba(207,166,99,.91));border:1px solid #8b6638;color:var(--ink);box-shadow:inset 0 0 18px rgba(94,52,15,.12),0 3px 8px rgba(55,30,9,.15);border-radius:3px}.stat{padding:16px;border-top:2px solid #a87c40}.stat strong{font-size:27px;display:block;color:#155ca8}.stat span{color:#654c31;font-size:12px}.toolbar{display:grid;grid-template-columns:minmax(250px,2fr) repeat(4,1fr);gap:8px;margin:15px 0;padding:10px;background:rgba(113,74,32,.07);border:1px solid rgba(107,70,32,.35)}.toolbar input,.toolbar select,.scrySearchWrap input,.deckImportText{width:100%;font-family:Georgia,"Times New Roman",serif;background:rgba(244,221,178,.74);border:1px solid #8d6738;color:#25170a;border-radius:2px;padding:12px}.toolbar input:focus,.toolbar select:focus,.scrySearchWrap input:focus,.deckImportText:focus{outline:none;border-color:#177dff;box-shadow:0 0 0 2px rgba(23,125,255,.18)}
.primary{font-family:Georgia,"Times New Roman",serif;background:linear-gradient(#102a43,#071522);color:#e7c783;border:1px solid #2586f5;border-radius:2px;padding:13px 18px;font-weight:800;cursor:pointer;box-shadow:0 0 10px rgba(23,125,255,.35);text-transform:uppercase}.primary:hover{color:#fff;box-shadow:0 0 17px rgba(23,125,255,.72)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:12px}.grid.empty{display:block}.card{overflow:hidden;cursor:pointer}.card:hover{border-color:#177dff;box-shadow:0 0 13px rgba(23,125,255,.38),0 8px 18px rgba(55,30,9,.2)}.cardImage{background:#3e2a17}.cardBody{padding:12px;background:rgba(232,203,151,.73)}.cardName{font-weight:800}.badge{background:#cba96d;border:1px solid #927044;color:#382512}.emptyState,.importBox{padding:45px;text-align:center;color:#614629}
.deckGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.deck{background:linear-gradient(145deg,#dec08a,#cfa66a)}.deckTile:hover{border-color:#177dff}.deckRecord,.deckAction,.deckLink,.qtyControls button{font-family:Georgia,"Times New Roman",serif;background:#e4c68f;border:1px solid #8b6638;color:#382511;border-radius:2px}.deckAction:hover,.deckLink:hover,.qtyControls button:hover{border-color:#177dff;color:#13599f;background:#efd6a6}.deckActionPrimary{background:#0d2437;border-color:#177dff;color:#e6c681}.deckActions{border-color:#8b6638}.openHint,.deckLink,.shopPrice{color:#13599f!important}
.builderLayout{display:grid;grid-template-columns:245px minmax(0,1fr);gap:10px;align-items:stretch;border:1px solid #876238;background:rgba(117,76,34,.05);padding:0}.buildList{display:flex;flex-direction:column;gap:9px;position:relative;top:auto;background:rgba(178,132,75,.12);border-right:1px solid #876238;padding:20px 14px;min-height:560px}.buildList:before{content:"✧  YOUR BUILDS  ✧";display:block;color:#145aa7;font-weight:900;letter-spacing:.06em;text-align:center;margin:0 0 8px}.buildList .primary{width:100%}.buildListItem{background:linear-gradient(145deg,#0c1924,#071018);border:1px solid #745a31;color:#ead09b;padding:13px;text-align:left;cursor:pointer}.buildListItem:hover{border-color:#177dff;box-shadow:0 0 12px rgba(23,125,255,.55)}.buildListItem b,.buildListItem span{display:block}.buildListItem span{font-size:11px;color:#c0a77e;margin-top:4px}.buildWorkspace{border:0;border-left:1px solid rgba(255,255,255,.18);background:linear-gradient(145deg,rgba(237,210,160,.75),rgba(221,182,117,.72));box-shadow:inset 0 0 24px rgba(91,51,15,.1);padding:24px 28px;min-height:560px;position:relative}.buildWorkspace:after{content:"✧";position:absolute;bottom:7px;left:50%;color:#177dff;text-shadow:0 0 8px #177dff;font-size:31px;opacity:.65}.builderHead{display:flex;justify-content:space-between;align-items:end;gap:18px;margin-bottom:22px}.builderHead h2{font-size:38px;margin:5px 0;color:#201206}.builderHead p{margin:0}.builderActions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.cardAdder{display:flex;align-items:start;gap:12px;margin-bottom:22px;padding:9px 0;border-top:1px solid #9a7441;border-bottom:1px solid #9a7441}.scrySearchWrap{position:relative;flex:1}.scryResults{position:absolute;z-index:8;top:100%;left:0;right:0;background:#e5c791;border:1px solid #8b6638;max-height:320px;overflow:auto}.scryResults:empty{display:none}.scryResults button{display:block;width:100%;font-family:Georgia,"Times New Roman",serif;background:transparent;border:0;border-bottom:1px solid #b48b54;color:#291a0d;padding:10px 12px;text-align:left}.scryResults button:hover{background:#efd6a6;color:#145aa7}.commanderCheck{display:flex;gap:7px;align-items:center;color:#49321b;font-size:13px;padding:12px}.buildCards{border-top:1px solid #9a7441}.buildTypeHead{border-color:#9a7441}.buildTypeHead h3,.pullSection h3{color:#145aa7}.buildTypeHead span{background:#caa76d;border-color:#8b6638;color:#174f8f}.buildCardRow,.deckRow,.copy,.pullRow{border-color:rgba(104,71,35,.4)}.buildCardName:hover{color:#145aa7;text-decoration-color:#177dff}.pullCounter,.valueGrid div,.deckStats div{background:rgba(239,214,169,.55);border-color:#8b6638}
.modal{background:rgba(2,5,8,.84);backdrop-filter:blur(5px)}.modalCard{background:linear-gradient(145deg,#e3c58e,#cfa567);border:2px solid #765126;box-shadow:0 0 0 4px #26180c,0 24px 80px #000;color:#24170d}.close{color:#321d0c}.legalityIssue{background:#d7ae79;color:#6b271e}.legalityGood{background:#c6bc81;color:#294524}.importBox{max-width:850px;margin:35px auto;border:4px double #876238}.importBox:before{content:"✦  ✧  ✦";display:block;color:#177dff;text-shadow:0 0 8px #177dff;letter-spacing:1.2em;margin:0 0 22px 1.2em}footer{text-align:center;border-top:1px solid #3e2e19;padding:18px;color:#9e865f;font-size:11px;font-family:Georgia,"Times New Roman",serif;background:#04080c}
::selection{background:#177dff;color:#fff}
@media(max-width:900px){.tomeShell{grid-template-columns:210px minmax(0,1fr);gap:12px}.topbar{padding:22px 10px}.eyebrow{font-size:21px}.topbar h1{font-size:20px}.nav{grid-template-columns:28px 1fr;padding:9px 5px}.builderLayout{grid-template-columns:200px minmax(0,1fr)}main{padding:28px 22px 55px}}
@media(max-width:750px){.tomeShell{display:block;margin:0;padding:0}.topbar{height:auto;min-height:0;position:sticky;top:0;border-width:0 0 1px;border-radius:0;padding:10px 12px;display:block}.tomeBrand{display:flex;align-items:center;gap:8px;text-align:left;border:0;padding:0;margin:0}.brandSigil{font-size:25px;margin:0}.eyebrow{font-size:12px}.topbar h1{font-size:17px;margin:0}.brandTagline{display:none}.sidebarRune{display:none}.topbar nav{flex-direction:row;position:fixed;left:0;right:0;bottom:0;z-index:100;background:#06101a;border-top:1px solid #765126;padding:6px env(safe-area-inset-right) calc(6px + env(safe-area-inset-bottom)) env(safe-area-inset-left);gap:3px}.nav{display:flex;flex:1;flex-direction:column;gap:1px;text-align:center;padding:6px 3px;justify-content:center}.navIcon{font-size:17px}.nav b{font-size:9px}.nav small{display:none}.nav.active{box-shadow:inset 0 2px #177dff,0 0 10px rgba(23,125,255,.25)}main{margin:7px 7px 78px;padding:22px 13px 42px;min-height:calc(100vh - 100px);box-shadow:0 0 0 3px #26180c,0 10px 30px #000}.hero,.sectionHead{align-items:flex-start;flex-direction:column}.hero:after,.sectionHead:after{font-size:70px}.hero h2,.sectionHead h2{font-size:36px}.updatedBlock{text-align:left}.stats{grid-template-columns:1fr 1fr}.toolbar{grid-template-columns:1fr 1fr}.toolbar input{grid-column:1/-1}.builderLayout{grid-template-columns:1fr;border:0}.buildList{min-height:0;border:1px solid #876238;overflow-x:auto;flex-direction:row}.buildList:before{display:none}.buildList .primary,.buildListItem{min-width:155px}.buildWorkspace{min-height:360px;border:1px solid #876238}.builderHead{align-items:flex-start;flex-direction:column}.arcaneDiagram{display:none}}
