:root{--felt: #1f3d2b;--wood: #5a3a1e;--cream: #f4ead6;--ink: #2b2118;--gold: #d8a94a;--red: #b3372f;--purple: #6b3fa0;--blue: #2f6fa8;--green: #3d8a4f;--teal: #2d8c86;--orange: #d2691e;--gray: #6d6d6d;--yellow: #c9a227}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:radial-gradient(ellipse at 50% 40%,#2a5236,#17301f 60%,#0c1a11) fixed;color:var(--cream);font-family:Alegreya,Georgia,serif;font-size:14px}button{font:inherit;background:#3a2a1a;color:var(--cream);border:1px solid #8a5a30;border-radius:6px;padding:6px 12px;cursor:pointer;box-shadow:0 1px #000}button:hover{background:#4a3620}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--gold);color:var(--ink);border-color:#f3d27a;font-weight:600}button.primary:hover{background:#e6b85a}button.danger{background:var(--red);border-color:#e06a5f}button.link{background:none;border:none;box-shadow:none;text-decoration:underline;opacity:.8;padding:4px 6px}button.on{outline:2px solid var(--gold)}input,select{font:inherit;padding:5px 8px;border-radius:6px;border:1px solid #8a5a30;background:#fff8ea;color:var(--ink)}label{display:flex;gap:8px;align-items:center;margin:6px 0}code{background:#0006;padding:2px 6px;border-radius:4px}.logo{font-family:Grenze Gotisch,serif;font-weight:700;font-size:52px;color:var(--gold);text-shadow:0 2px 0 #000,0 0 24px #d8a94a55;margin:0;letter-spacing:1px}.logo span{color:var(--red)}.logo.small{font-size:22px}.hint{opacity:.75;font-style:italic}.lbl{font-size:11px;text-transform:uppercase;letter-spacing:1px;opacity:.7;margin:6px 0 3px}.row{display:flex;gap:10px;align-items:center;margin-top:10px;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.join,.lobby{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center}.join form{display:flex;flex-direction:column;gap:10px;background:#0007;padding:22px 28px;border-radius:12px;border:1px solid #ffffff22;min-width:320px}.join form label{flex-direction:column;align-items:stretch;text-align:left}.join input{font-size:18px;text-align:center}.tag{font-style:italic;opacity:.85;margin:0}.roomcode{font-size:22px}.roomcode b{font-family:Grenze Gotisch,serif;font-size:36px;color:var(--gold);letter-spacing:4px}.seats{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;font-size:18px}.seats .off{opacity:.5}.table{display:grid;height:100vh;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:44px 140px minmax(0,1fr) auto;grid-template-areas:"top top" "opp opp" "center right" "me me";gap:8px;padding:8px}.topbar{grid-area:top;display:flex;align-items:center;gap:16px;padding:0 12px;background:linear-gradient(#6b4423,#4a2e15);border-radius:8px;box-shadow:inset 0 1px #8a5a30,0 2px 6px #000a}.topbar .room{opacity:.8}.topbar .turn{font-weight:600}.spacer{flex:1}.opponents{grid-area:opp;display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;height:140px;flex:none}.opp{background:#0009;border:1px solid #ffffff22;border-radius:10px;padding:5px 10px;min-width:250px;flex:1;height:132px;overflow:hidden;display:flex;flex-direction:column}.opp .gear{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px;align-content:flex-start;flex:1;overflow:hidden}.opp .oppfoot{margin-top:auto}.chip.item{background:#8a6b2a;color:#fff}.chip.carried{background:#ffffff14;opacity:.75}.chip.big:before{content:"▮ ";opacity:.7}.opphead .str{font-size:12px;opacity:.85;margin-left:4px}.opphead .str b{color:#7fd48a;font-family:Grenze Gotisch,serif;font-size:18px}.opp.turn{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold),0 0 18px #d8a94a55}.opp.dead{opacity:.5}.opphead{display:flex;align-items:center;gap:8px}.opphead .lvl{font-family:Grenze Gotisch,serif;font-size:26px;color:var(--gold);width:30px;text-align:center}.opphead .oname{font-weight:600;font-size:16px}.opphead .tags{margin-left:auto;font-size:11px;opacity:.8}.minis{display:flex;gap:4px;flex-wrap:wrap;margin-top:6px;min-height:30px}.oppfoot{font-size:12px;opacity:.8;margin-top:4px}.chips{display:flex;gap:4px;flex-wrap:wrap;margin-top:4px}.chip{font-size:11px;padding:2px 8px;border-radius:10px;background:#fff2;cursor:pointer;white-space:nowrap}.chip.char{background:var(--blue)}.chip.curse{background:var(--purple)}.chip.enh{background:var(--orange);color:#fff}.chip.muted{opacity:.6;cursor:default}.left{grid-area:left;display:grid;grid-template-columns:1fr 1fr;gap:10px 6px;align-content:start;justify-items:center;padding-top:6px;min-height:0;overflow:hidden}.left .lbl{grid-column:1 / -1;margin:0}.deck{position:relative}.deck .count{position:absolute;bottom:-6px;right:-6px;background:var(--gold);color:var(--ink);border-radius:10px;padding:1px 7px;font-size:11px;font-weight:700}.discards{display:contents}.center{grid-area:center;display:flex;flex-direction:column;gap:8px;min-height:0}.centerscroll{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px}.right{grid-area:right;display:flex;flex-direction:column;min-height:0;background:#0007;border-radius:10px;overflow:hidden}.tabs{display:flex}.tabs button{flex:1;border-radius:0;border:none;background:#0004}.tabs button.on{background:#0000;color:var(--gold)}.log{flex:1;overflow-y:auto;padding:8px 10px;font-size:12.5px;line-height:1.4}.log .turnline{color:var(--gold);margin-top:6px}.log .sys{opacity:.7;font-style:italic}.say{display:flex;gap:4px;padding:6px}.say input{flex:1}.me{grid-area:me;display:flex;flex-direction:column;gap:4px}.myarea{display:flex;gap:12px;align-items:flex-start;background:#0007;border-radius:10px;padding:6px 10px;overflow-x:auto;overflow-y:hidden;height:140px;flex:none}.mystats{min-width:190px}.lvlrow{display:flex;align-items:baseline;gap:12px}.mystats .str{font-size:13px;opacity:.85}.mystats .str b{color:#7fd48a;font-family:Grenze Gotisch,serif;font-size:26px}.biglvl{font-family:Grenze Gotisch,serif;font-size:40px;color:var(--gold);line-height:1}.mname{font-weight:600;font-size:16px}.gslot{display:flex;flex-wrap:wrap;gap:4px;align-content:flex-start;flex:none}.gslot .lbl{margin:0;width:100%}.gslot.wide{margin-left:auto;max-width:40%}.hand{display:flex;justify-content:center;align-items:flex-end;height:204px;padding-top:12px;overflow:visible}.hand .card.md{width:134px;height:190px}.hand .slot{margin:0 -24px;transition:transform .15s;position:relative}.hand .slot:hover{transform:translateY(-12px);z-index:5}.handinfo{text-align:center;font-size:12px;opacity:.7}.card{position:relative;background:var(--cream);color:var(--ink);border-radius:8px;border:2px solid #3a2a1a;box-shadow:0 2px 6px #0009;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;-webkit-user-select:none;user-select:none;flex:0 0 auto}.card.md{width:146px;height:208px}.card.lg{width:270px;height:388px}.card.sm{width:76px;height:106px}.card .head{display:flex;justify-content:space-between;align-items:center;gap:4px;padding:3px 7px;color:#fff;font-family:Grenze Gotisch,serif;font-weight:700;font-size:13.5px;line-height:1.1;min-height:30px}.card.lg .head{font-size:20px;min-height:40px}.card.sm .head{min-height:22px;padding:2px 5px}.card.sm .head .name{font-size:9.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card .lvl{background:#0006;border-radius:50%;min-width:22px;height:22px;display:grid;place-items:center;font-size:13px;flex:0 0 auto}.t-monster .head{background:var(--red)}.t-curse .head{background:var(--purple)}.t-class .head{background:var(--blue)}.t-race .head{background:var(--green)}.t-item .head{background:#8a6b2a}.t-oneShot .head{background:var(--teal)}.t-gual .head{background:var(--yellow);color:var(--ink)}.t-monsterEnhancer .head{background:var(--orange)}.t-special .head{background:var(--gray)}.card .art{flex:0 0 auto;height:40%;background:linear-gradient(135deg,#cdbb92,#8d7a55);display:grid;place-items:center;font-size:42px;overflow:hidden}.card.sm .art{height:40%;font-size:22px}.card.lg .art{font-size:72px;height:44%}.card .art img{width:100%;height:100%;object-fit:cover;display:block}.card .text{flex:1;padding:5px 7px;font-size:10.5px;line-height:1.25;overflow:hidden}.card.lg .text{font-size:13.5px;line-height:1.35}.card .text p{margin:0 0 4px}.flavor{font-style:italic;opacity:.75}.card .foot{font-size:10px;padding:3px 6px;background:#0000000f;border-top:1px solid #0002;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card.sm .foot{font-size:8px;padding:2px 4px}.card.lg .foot{font-size:12px}.card.dim{opacity:1;filter:saturate(.25) brightness(.72)}.card.selected{outline:3px solid var(--gold);box-shadow:0 0 0 5px #d8a94a55,0 0 18px #d8a94a99;transform:translateY(-6px)}.card.selected:after{content:"✓";position:absolute;top:4px;right:4px;width:26px;height:26px;border-radius:50%;background:var(--gold);color:var(--ink);font-weight:700;display:grid;place-items:center;font-family:sans-serif;box-shadow:0 1px 4px #000}.options .card{margin:8px}.card.empty{background:#0003;border:2px dashed #ffffff33;box-shadow:none;cursor:default}.card.back{background:repeating-linear-gradient(45deg,#5a2b2b 0,#5a2b2b 6px,#4a2020 6px,#4a2020 12px);border-color:#2a1010}.card.back.tre{background:repeating-linear-gradient(45deg,#2b4a5a 0,#2b4a5a 6px,#203a4a 6px,#203a4a 12px)}.backart{margin:auto;font-family:Grenze Gotisch,serif;color:var(--gold);font-size:13px;letter-spacing:2px}.badge{position:absolute;top:34px;right:6px;background:var(--gold);color:var(--ink);border-radius:6px;padding:1px 6px;font-size:10px;font-weight:700}.combat{display:flex;gap:20px;align-items:center;justify-content:center;background:#0006;border-radius:12px;padding:14px;border:1px solid #ffffff22;flex-wrap:wrap}.monsters{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.mon{display:flex;flex-direction:column;align-items:center;gap:4px}.enh{display:flex;gap:3px;flex-wrap:wrap;justify-content:center}.mstat{font-size:11px;opacity:.8}.vs{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:220px}.total{font-family:Grenze Gotisch,serif;font-size:48px;line-height:1}.total.win{color:#7fd48a}.total.lose{color:#ff8a7a}.vslabel{font-style:italic;opacity:.7}.who{font-weight:600;margin-top:4px}.mod{font-size:12px;opacity:.85}.lastcall{width:100%;margin-top:8px;background:#0006;border-radius:6px;overflow:hidden;position:relative;height:26px}.lastcall .bar{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,#b3372f,#d8a94a);transition:width .2s linear}.lastcall span{position:relative;display:block;text-align:center;line-height:26px;font-size:12px;font-weight:600;text-shadow:0 1px 2px #000}.idle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;flex:1;text-align:center;font-size:16px;padding:20px;opacity:.9}.door{font-size:64px;filter:drop-shadow(0 4px 6px #000)}.waiting,.banner{background:#0007;border:1px solid var(--gold);border-radius:8px;padding:6px 12px;text-align:center}.flow{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;flex:none;padding:2px 0}.tray{position:fixed;left:50%;bottom:250px;transform:translate(-50%);display:flex;gap:14px;background:#1a120a;border:1px solid var(--gold);border-radius:12px;padding:12px;box-shadow:0 8px 30px #000c;z-index:20;max-width:90vw}.trayactions{display:flex;flex-direction:column;gap:6px;min-width:240px;max-height:388px;overflow-y:auto}.trayactions h3{margin:0 0 4px;font-family:Grenze Gotisch,serif;color:var(--gold)}.modal{position:fixed;top:0;right:0;bottom:0;left:0;background:#000a;display:grid;place-items:center;z-index:30;padding:20px}.dialog{background:#1a120a;border:1px solid var(--gold);border-radius:12px;padding:16px 20px;max-width:900px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #000;min-width:360px}.dialog h3{margin:0 0 10px;font-family:Grenze Gotisch,serif;color:var(--gold);font-size:22px}.options{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}.toasts{position:fixed;top:54px;right:14px;display:flex;flex-direction:column;gap:6px;z-index:40}.toast{background:var(--red);color:#fff;padding:8px 12px;border-radius:8px;box-shadow:0 2px 8px #000}.offline{position:fixed;bottom:10px;left:10px;background:var(--red);padding:4px 10px;border-radius:6px;z-index:40}@media (max-width: 1100px){.table{grid-template-columns:120px 1fr 240px}.card.md{width:124px;height:178px}}.tradecols{display:flex;gap:18px;align-items:center}.tradecols .arrow{font-size:40px;color:var(--gold)}.banner.trade{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}.banner.trade button{padding:3px 10px}@media (max-height: 820px){.table{grid-template-rows:40px 118px minmax(0,1fr) auto}.opponents{height:118px}.opp{height:110px}.opp .gear{max-height:26px}.left .card.sm,.left .card.sm.empty{width:58px;height:82px}.left .card.sm .head{min-height:18px}.left .card.sm .art{display:none}.myarea{height:124px}.myarea .card.sm{width:64px;height:90px}.biglvl{font-size:32px}.hand{height:172px}.hand .card.md{width:118px;height:168px}.hand .card.md .text{font-size:9.5px}}.banner.hold{border-color:#7fd48a;display:flex;gap:10px;justify-content:center;align-items:center}.banner.hold button{padding:3px 10px}.gallery{padding:20px 28px}.gallery h2{font-family:Grenze Gotisch,serif;color:var(--gold);margin:26px 0 8px}.gallery h2 small{opacity:.6;font-weight:400}.gcard{position:relative}.gcard .qty{position:absolute;top:-8px;left:-8px;background:var(--gold);color:var(--ink);border-radius:10px;padding:1px 8px;font-weight:700;font-size:12px}.boardwrap{position:relative;flex:1;min-height:0;display:flex;align-items:center;justify-content:center}.board{width:100%;height:100%;max-height:100%;filter:drop-shadow(0 6px 14px #0009)}.standee{transition:transform .9s cubic-bezier(.2,.8,.2,1)}.standee.dead .figure{opacity:.45}.turnring{animation:ring 1.6s ease-in-out infinite}@keyframes ring{0%,to{opacity:.45}50%{opacity:1}}.zone{display:flex;flex-direction:column;align-items:center;gap:6px;padding:4px}.zone .lbl{margin:0;color:#fff;text-shadow:0 1px 2px #000}.zone .piles{display:flex;gap:10px;align-items:flex-start}.zone .disc .count{background:#f4ead6}.zone .card.sm.empty{border-style:dashed;opacity:.55}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;pointer-events:none;padding:8px 200px}.overlay>*{pointer-events:auto}.overlaytop{position:absolute;top:10px;left:260px;right:220px;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}.overlaytop>*{pointer-events:auto}.overlay .combat{background:#120c08ee;border:1px solid var(--gold);box-shadow:0 10px 40px #000c;max-width:100%}.opphead .dot{width:12px;height:12px;border-radius:50%;border:2px solid #1a1208;display:inline-block}@media (max-width: 1500px){.overlay{padding:8px 120px}}.card.back .backimg{width:100%;height:100%;object-fit:cover;display:block}.diceoverlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:12vh;pointer-events:none;z-index:35}.dicecast{display:flex;flex-direction:column;align-items:center;gap:10px;animation:dicein .25s ease-out both}.dicecast.gone{animation:diceout .35s ease-in both}@keyframes dicein{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}@keyframes diceout{0%{opacity:1}to{opacity:0;transform:translateY(14px) scale(.96)}}.diestage{--size: 96px;--half: calc(var(--size) / 2);position:relative;width:var(--size);height:var(--size);perspective:640px;margin-bottom:26px}.dieshadow{position:absolute;left:50%;bottom:-22px;width:var(--size);height:22px;transform:translate(-50%);background:radial-gradient(ellipse at center,#000c,#0000 70%);animation:shadowland var(--roll, 1.15s) cubic-bezier(.2,.8,.3,1) both}@keyframes shadowland{0%{transform:translate(-50%) scale(.35);opacity:.2}60%{transform:translate(-50%) scale(1.05);opacity:1}75%{transform:translate(-50%) scale(.9)}to{transform:translate(-50%) scale(1);opacity:1}}.dietoss{width:100%;height:100%;animation:toss var(--roll, 1.15s) cubic-bezier(.2,.8,.3,1) both;transform-style:preserve-3d}@keyframes toss{0%{transform:translateY(-190px) scale(1.35)}60%{transform:translateY(0) scale(1)}75%{transform:translateY(-28px) scale(1.02)}to{transform:translateY(0) scale(1)}}.die{position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:tumble var(--roll, 1.15s) cubic-bezier(.15,.85,.25,1) both}@keyframes tumble{0%{transform:rotateX(0) rotateY(0)}to{transform:rotateX(calc(var(--rx) + 720deg)) rotateY(calc(var(--ry) + 1080deg))}}.dicecast.loaded .dietoss,.dicecast.loaded .dieshadow{animation:none}.dicecast.loaded .die{animation:turn .65s cubic-bezier(.2,.8,.3,1) both}@keyframes turn{0%{transform:rotateX(0) rotateY(0)}to{transform:rotateX(calc(var(--rx) + 360deg)) rotateY(calc(var(--ry) + 360deg))}}.die .face{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);place-items:center;padding:13px;box-sizing:border-box;border-radius:18px;background:linear-gradient(145deg,#fffaf0,#f1e6cc 55%,#dccca6);border:2px solid #b9a273;box-shadow:inset 0 0 14px #5a3a1e33;backface-visibility:hidden}.die .face i{width:17px;height:17px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#4a3a2c,var(--ink) 70%);box-shadow:inset 0 1px 2px #000a}.dicecap{font-family:Grenze Gotisch,serif;font-size:26px;color:var(--cream);text-shadow:0 2px 0 #000,0 0 18px #000;background:#0009;border:1px solid var(--gold);border-radius:10px;padding:4px 18px}.dicecap b{color:var(--gold)}.diceout{font-family:Grenze Gotisch,serif;font-size:30px;padding:2px 20px;border-radius:10px;background:#000a;text-shadow:0 2px 0 #000;animation:dicein .2s ease-out both}.diceout.good{color:#7fd48a;border:1px solid #7fd48a}.diceout.bad{color:#ff8a7a;border:1px solid #ff8a7a}@media (prefers-reduced-motion: reduce){.dietoss,.die,.dieshadow,.dicecast{animation-duration:.01s!important}}