@font-face{font-family:"WCS Display";src:url("game/fonts/IMFellEnglish-Regular.ttf?v=92c8eb2b6e01") format("truetype");font-style:normal;font-weight:400;font-display:block}
@font-face{font-family:"WCS Body";src:url("game/fonts/Vollkorn.ttf?v=92c8eb2b6e01") format("truetype");font-style:normal;font-weight:400 900;font-display:block}

:root{
  color-scheme:dark;
  --ink:#080604;
  --deep:#130b07;
  --moss:#24130c;
  --moss-2:#3b2113;
  --bone:#e8c38b;
  --parchment:#f3f2e1;
  --ember:#c65e22;
  --ember-bright:#f59a43;
  --danger:#b35d55;
  --line:rgba(235,224,186,.24);
  --card-ratio:1.4;
  --card-w:clamp(3.35rem,12.2vw,7rem);
  --card-h:calc(var(--card-w) * var(--card-ratio));
  --board-card-w:3rem;
  --lair-row-extra:7px;
  --deck-control-w:clamp(1.9rem,6vw,2.55rem);
  --deck-rail-w:max(var(--board-card-w),var(--deck-control-w));
  --action-control-width:8rem;
  --radius:.55rem;
  font-family:"WCS Body",Georgia,serif;
  font-variant-numeric:lining-nums tabular-nums;
  font-feature-settings:"lnum" 1,"tnum" 1;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{width:100%;height:100%;min-height:100%;margin:0;overflow:hidden;background-color:#080503;color:var(--bone)}
body{min-height:100dvh;touch-action:manipulation;background-image:
  radial-gradient(ellipse at 50% 48%,rgba(164,48,11,.2),transparent 64%),
  linear-gradient(rgba(7,3,2,.14),rgba(7,3,2,.3)),
  url("game/tabletop-wood.webp?v=92c8eb2b6e01");background-position:center;background-repeat:no-repeat;background-size:cover}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:50;box-shadow:inset 0 0 9rem #000,inset 0 0 2rem rgba(0,0,0,.9);opacity:.86}
body::after{content:"";position:fixed;inset:-3%;z-index:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.72'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,transparent 0 2px,rgba(0,0,0,.48) 3px,rgba(255,125,52,.12) 4px);background-size:180px 180px,100% 4px;background-blend-mode:soft-light,normal;mix-blend-mode:screen;opacity:.2;animation:crt-fuzz .28s steps(2,end) infinite}
@keyframes crt-fuzz{0%{transform:translate(0,0)}25%{transform:translate(.7px,-.4px)}50%{transform:translate(-.5px,.6px)}75%{transform:translate(.35px,.5px)}100%{transform:translate(-.4px,-.3px)}}
button,input{font:inherit}
button{border:1px solid rgba(210,103,43,.56);border-radius:.1rem;background:linear-gradient(96deg,rgba(132,51,18,.26),transparent 28% 66%,rgba(0,0,0,.26)),repeating-linear-gradient(2deg,rgba(255,180,99,.05) 0 1px,transparent 1px 4px),rgba(35,15,8,.97);color:#d9b188;padding:.65rem .9rem;cursor:pointer;box-shadow:.12rem .2rem 0 rgba(5,2,1,.76),0 .32rem .75rem rgba(0,0,0,.5),inset 0 .08rem rgba(255,178,100,.11),inset 0 -.16rem .45rem rgba(0,0,0,.34)}
button:hover,button:focus-visible{border-color:rgba(242,189,117,.7);color:#fff;outline:none;box-shadow:0 0 0 2px rgba(201,138,73,.18),0 .25rem .8rem #0008}
button:disabled{opacity:.45;cursor:not-allowed}
button.primary{font-family:"WCS Display",Georgia,serif;text-transform:uppercase;letter-spacing:.08em;background:linear-gradient(#71300f,#321308);border-color:#c65e22;color:#ffd29a;text-shadow:0 0 .35rem #e56c28;padding:.8rem 1.2rem}
button.primary:hover{background:linear-gradient(#8b3a12,#411808)}

.mist{position:fixed;inset:auto -15vw;z-index:0;height:30vh;pointer-events:none;filter:blur(3rem);opacity:.1;background:radial-gradient(ellipse,rgba(193,66,20,.8),transparent 66%);animation:drift 22s ease-in-out infinite alternate}
.mist-a{top:12vh}.mist-b{bottom:4vh;animation-delay:-11s;animation-direction:alternate-reverse}
@keyframes drift{from{transform:translateX(-4vw) scaleX(.95)}to{transform:translateX(5vw) scaleX(1.08)}}
@media(prefers-reduced-motion:reduce){.mist,body::after{animation:none}.draggable,.card{transition:none!important}.card.is-flipping .card-surface,.card.is-flipping::before,.card.zone-arriving .card-surface,.card.zone-placing .card-surface,.setup-card-cloud i{animation:none!important;transition:none!important}.zone-card-ghost{display:none!important}}

.app-shell{position:relative;z-index:1;width:100%;height:100dvh;min-height:0;overflow:hidden}
.panel{border:1px solid rgba(206,85,27,.38);background:linear-gradient(145deg,rgba(42,18,9,.97),rgba(12,7,4,.98));box-shadow:0 1.5rem 5rem #000d,inset 0 0 2rem rgba(125,38,8,.1)}
.entry-card{position:absolute;left:50%;top:50%;width:min(91vw,31rem);padding:clamp(1.4rem,5vw,3rem);transform:translate(-50%,-50%);text-align:center;border-radius:.1rem}
.entry-card::before{content:"";position:absolute;inset:.6rem;border:1px solid rgba(224,92,24,.2);pointer-events:none}
.eyebrow{margin:0 0 .25rem;color:#b66d3d;font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.entry-card>.eyebrow{font-size:clamp(.4rem,1.45vw,.58rem);line-height:1.1;letter-spacing:.12em;transform:translateY(-.6rem)}
h1,h2{font-family:"WCS Display",Georgia,serif;font-weight:400;margin:.1em 0;text-shadow:0 .15rem .3rem #000}
.entry-card h1{font-family:"WCS Display",Georgia,serif;font-size:clamp(2.4rem,11vw,4.6rem);line-height:.88;color:#df7d37;text-shadow:0 0 .8rem #7c280a}
.entry-card>p:not(.eyebrow){color:#b99b78}
.entry-card form{display:grid;gap:.65rem;margin-top:1.7rem;text-align:left}
.entry-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:.55rem}.entry-actions button{width:100%;white-space:nowrap}.entry-actions .primary{padding-inline:.6rem;font-size:clamp(.72rem,3.5vw,1rem);letter-spacing:.06em}.entry-actions button:not(.primary){padding-inline:1.1rem}
label{font-size:.82rem;color:#c9c0a6}
input{width:100%;border:1px solid rgba(198,94,34,.35);border-radius:.08rem;background:#0b0604;color:#f2c18e;padding:.8rem;outline:none}
input:focus{border-color:var(--ember);box-shadow:0 0 0 2px #c98a4933}
.error{min-height:1.3rem;color:#ef9d94!important;font-size:.88rem}

.game{display:grid;grid-template-rows:auto minmax(3.6rem,auto) minmax(0,1fr) minmax(8rem,auto) auto;width:100%;height:100dvh;min-height:0;overflow:hidden;padding:env(safe-area-inset-top) max(.7rem,env(safe-area-inset-right)) max(.35rem,env(safe-area-inset-bottom)) max(.7rem,env(safe-area-inset-left));gap:.25rem}
.game,.game *,.peek-dialog,.peek-dialog *,.shared-reveal-dialog,.shared-reveal-dialog *,.setup-animation,.setup-animation *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.topbar{display:flex;align-items:center;justify-content:space-between;gap:.5rem;width:min(100%,80rem);margin:0 auto;padding:.35rem 0;border-bottom:1px solid rgba(198,94,34,.32);box-shadow:0 .3rem 1rem rgba(0,0,0,.5)}
.topbar h1{font-family:"WCS Display",Georgia,serif;font-size:clamp(1.2rem,4vw,2rem);line-height:1;color:#e7964e;letter-spacing:.04em}.topbar nav{display:flex;gap:.25rem}
.icon-button{display:inline-block;min-width:2.7rem;padding:.45rem .5rem;border:1px solid rgba(210,103,43,.5);border-radius:.12rem;background:linear-gradient(96deg,rgba(132,51,18,.24),transparent 32% 68%,rgba(0,0,0,.24)),repeating-linear-gradient(2deg,rgba(255,180,99,.045) 0 1px,transparent 1px 4px),rgba(27,12,7,.96);color:#d9b188;font-family:system-ui,sans-serif;font-size:1.05rem;line-height:normal;text-align:center;text-decoration:none;cursor:pointer;box-shadow:.1rem .16rem 0 rgba(5,2,1,.7),0 .28rem .7rem rgba(0,0,0,.4),inset 0 .07rem rgba(255,178,100,.1),inset 0 -.14rem .4rem rgba(0,0,0,.3)}
.icon-button:hover,.icon-button:focus-visible{border-color:rgba(242,189,117,.7);color:#fff;outline:none;box-shadow:0 0 0 2px rgba(201,138,73,.18),0 .25rem .8rem #0008}
.icon-button svg{display:block;width:1.05rem;height:1.05rem;margin:0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.icon-button span{display:block;font-family:"WCS Body",serif;font-size:.58rem;letter-spacing:.05em;text-transform:uppercase}

.player-area{position:relative;width:min(100%,80rem);margin:0 auto;border:1px solid transparent;border-radius:.45rem}
.opponent-area{display:grid;grid-template-columns:auto 1fr;align-items:center;min-height:3.6rem;padding:.12rem 0;background:linear-gradient(180deg,rgba(0,0,0,.5),transparent)}
.own-area{display:flex;flex-direction:column;justify-content:end;padding:.25rem 0;background:linear-gradient(0deg,rgba(0,0,0,.56),transparent)}
.hand{display:flex;align-items:end;justify-content:center;min-width:0;padding:.25rem;isolation:isolate}
.hand .card{margin-left:calc(var(--card-w) * -.14)}.hand .card:first-child{margin-left:0}
.opponent-hand{position:relative;align-items:center;min-height:3.25rem}.opponent-hand .card{width:calc(var(--card-w) * .48);height:calc(var(--card-h) * .48);margin-left:calc(var(--card-w) * -.08);transform:rotate(180deg);box-shadow:0 .12rem .3rem #000}
.opponent-hand .card:first-child{margin-left:0}
.player-plate{min-width:7rem;color:#b69472;font-size:.8rem;line-height:1.15}
.player-plate strong{display:block;color:#e4b57e;font-family:"WCS Display",Georgia,serif;font-size:1.05rem;font-weight:400;letter-spacing:.03em}
.player-plate .status-dot{display:inline-block;width:.45rem;height:.45rem;margin-right:.3rem;border-radius:50%;background:#68726b}.player-plate .status-dot.online{background:#86a67e;box-shadow:0 0 .45rem #8fc684}
.claim-pips{display:inline-flex;gap:.16rem;margin-left:.3rem}.claim-pips i{width:.52rem;height:.52rem;border:1px solid #dca05f;border-radius:50%;background:#b86f38;box-shadow:0 0 .35rem #c47c42}.claim-pips i.empty{background:transparent;box-shadow:none}
.bottom-strip{display:flex;align-items:center;justify-content:space-between;gap:.6rem}.turn-button{min-width:8rem;height:2.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.table-wrap{position:relative;display:grid;grid-template-columns:minmax(0,1fr) var(--deck-rail-w);align-items:center;gap:clamp(.2rem,.7vw,.55rem);width:min(100%,80rem);height:100%;min-height:0;margin:0 auto;padding:.15rem 0}
.turn-banner{position:absolute;z-index:7;left:50%;top:.1rem;transform:translateX(-50%);max-width:80%;padding:.25rem .8rem;border:1px solid rgba(198,94,34,.36);border-radius:.08rem;background:#120905ee;color:#e6a05e;font-family:"WCS Display",Georgia,serif;font-size:.72rem;letter-spacing:.05em;text-align:center;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 0 1rem #000,inset 0 0 .7rem rgba(198,94,34,.1)}
.board{grid-column:1;grid-row:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(.25rem,1.1vw,.75rem);width:100%;height:100%;max-height:100%;min-height:0;padding:.55rem .45rem;border:1px solid rgba(232,104,38,.55);border-radius:.12rem;background:
  linear-gradient(180deg,transparent 49.45%,rgba(238,105,31,.33) 49.7% 50.3%,transparent 50.55%),
  radial-gradient(ellipse at center,rgba(170,52,10,.25),transparent 67%),
  repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,.25) 4px,rgba(241,111,42,.035) 5px),
  rgba(13,5,3,.58);box-shadow:inset 0 0 3rem #000c,inset 0 0 0 3px rgba(236,105,40,.075),0 .8rem 2rem #0009,0 0 1.2rem rgba(156,47,10,.2);transition:filter .18s,opacity .18s}
.board.peek-dimmed{filter:brightness(.34) saturate(.55);opacity:.34;pointer-events:none}
.trail{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);align-items:center;justify-items:center;min-width:0;border:1px solid rgba(226,97,31,.4);border-radius:.06rem;background:linear-gradient(91deg,rgba(0,0,0,.22),rgba(168,53,12,.075) 48%,rgba(0,0,0,.2));box-shadow:inset 0 0 1.5rem rgba(0,0,0,.5),inset .12rem 0 rgba(240,111,42,.055);transition:border-color .15s,background .15s}
.trail::before{content:"";position:absolute;inset:3px 4px 4px 2px;border:1px solid rgba(242,119,49,.18);pointer-events:none;clip-path:polygon(0 1px,99.5% 0,100% 99%,1px 100%);box-shadow:inset .12rem 0 rgba(0,0,0,.22),inset -.08rem 0 rgba(233,94,31,.09)}
.trail.crossroads{border-color:rgba(237,104,31,.55);background:linear-gradient(91deg,rgba(0,0,0,.2),rgba(179,55,10,.13) 48%,rgba(0,0,0,.2))}
.trail[data-trail="west"]{order:1}.trail[data-trail="crossroads"]{order:2}.trail[data-trail="east"]{order:3}
.board.mirrored .trail[data-trail="west"]{order:3}.board.mirrored .trail[data-trail="east"]{order:1}
.creature-stack{position:relative;width:100%;height:100%;min-height:0;overflow:visible}
.creature-stack .card{position:absolute;flex:0 0 auto;margin:0;transform:translate(-50%,-50%)}
.opponent-stack .card{transform:translate(-50%,-50%) rotate(180deg)}
.empty-creature-slot{position:absolute;display:grid;place-items:center;border:1px dashed rgba(222,99,36,.32);border-radius:.05rem;color:rgba(231,124,62,.46);font:700 .58rem/1 system-ui,sans-serif;letter-spacing:.08em;opacity:.46;transform:translate(-50%,-50%);pointer-events:none;box-shadow:inset 0 0 1rem rgba(138,39,7,.07);transition:width .15s,height .15s,top .15s,left .15s,opacity .15s,border-color .15s,color .15s,box-shadow .15s}
.empty-creature-slot::before{content:"+";font-size:clamp(.7rem,2vw,1.1rem);font-weight:400}
.creature-stack.drop-active .empty-creature-slot{opacity:.78;border-color:rgba(235,112,48,.62);color:rgba(255,166,101,.82);box-shadow:inset 0 0 1rem rgba(178,58,15,.18),0 0 .55rem rgba(221,83,29,.12)}
.creature-stack.drop-hover .empty-creature-slot{opacity:1;border-color:rgba(255,160,82,.92);color:#ffd0a0;box-shadow:inset 0 0 1rem rgba(214,75,19,.28),0 0 .75rem rgba(237,104,38,.3)}
.lair-slot{position:relative;z-index:3;width:min(calc(var(--board-card-w) * var(--card-ratio) + .35rem),100%);height:calc(var(--board-card-w) + var(--lair-row-extra));border:1px dashed rgba(225,99,35,.28);border-radius:.05rem;display:grid;place-items:center;background:rgba(0,0,0,.12)}
.lair-card{position:relative;width:min(calc(var(--board-card-w) * var(--card-ratio)),100%);height:var(--board-card-w)}
.lair-card .card{position:absolute;left:50%;top:50%;width:var(--board-card-w);height:calc(var(--board-card-w) * var(--card-ratio));transform:translate(-50%,-50%) rotate(-90deg)}

.card{position:relative;z-index:1;display:block;flex:none;width:var(--card-w);height:var(--card-h);padding:0;border:0;border-radius:calc(var(--card-w) * .045);background:#101511;box-shadow:0 .25rem .55rem #000c;transform-origin:center;transition:transform .12s ease,filter .12s ease,box-shadow .12s;user-select:none;-webkit-user-drag:none;touch-action:none;cursor:grab}
.card-surface{position:absolute;inset:0;display:block;border-radius:inherit;transform-style:preserve-3d}
.card-surface img{display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;image-rendering:auto;pointer-events:none}
.card:focus-visible{outline:2px solid var(--ember-bright);outline-offset:3px;z-index:9}
.card.hidden-card::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #eadfb936}
.card.dragging{opacity:.28}
.card.zone-moving{z-index:520!important;background:transparent;box-shadow:none}.card.zone-moving .card-surface{pointer-events:none;box-shadow:0 .35rem .75rem #000c;will-change:translate,scale,opacity,filter,box-shadow;transition:translate var(--zone-motion-duration) cubic-bezier(.2,.72,.24,1),scale var(--zone-motion-duration) cubic-bezier(.2,.72,.24,1),opacity .22s ease-out}.card.zone-arriving .card-surface{animation:card-zone-arrive .24s cubic-bezier(.2,.72,.24,1)}.card.zone-moving.zone-placing .card-surface{transition:none;animation:card-table-settle .3s cubic-bezier(.16,.72,.24,1)}.zone-card-ghost{position:fixed;z-index:1050;overflow:hidden;border-radius:.2rem;pointer-events:none;box-shadow:0 .45rem 1rem #000b;will-change:transform,opacity}.zone-card-ghost img{display:block;width:100%;height:100%;object-fit:cover}@keyframes card-zone-arrive{from{opacity:0;translate:0 .55rem;scale:.96}to{opacity:1;translate:0 0;scale:1}}@keyframes card-table-settle{0%{opacity:.62;scale:1.14;filter:brightness(1.18);box-shadow:0 1.8rem 2.4rem #000e}65%{opacity:1;scale:.985;filter:brightness(1.03);box-shadow:0 .15rem .35rem #000b}100%{opacity:1;scale:1;filter:brightness(1);box-shadow:0 .35rem .75rem #000c}}
.card.is-flipping{z-index:520!important;pointer-events:none}.card.is-flipping .card-surface{animation:card-flip .34s cubic-bezier(.42,0,.25,1)}.card.is-flipping::before{content:"";position:absolute;z-index:4;inset:-18%;border-radius:45%;pointer-events:none;animation:stir-flare .34s ease-out}.card.flip-to-faded::before{background:radial-gradient(ellipse,rgba(112,138,102,.48),rgba(27,46,34,.2) 42%,transparent 70%);filter:blur(.35rem)}.card.flip-to-manifest::before{background:radial-gradient(ellipse,rgba(247,171,86,.62),rgba(158,63,20,.2) 44%,transparent 72%);filter:blur(.25rem)}
@keyframes card-flip{0%{transform:perspective(36rem) rotateY(0) scale(1)}48%{transform:perspective(36rem) rotateY(90deg) scale(1.08)}52%{transform:perspective(36rem) rotateY(-90deg) scale(1.08)}100%{transform:perspective(36rem) rotateY(0) scale(1)}}
@keyframes stir-flare{0%{opacity:0;transform:scale(.72)}42%{opacity:1;transform:scale(1.08)}100%{opacity:0;transform:scale(1.22)}}
.decks{container-name:deck-rail;container-type:inline-size;grid-column:2;grid-row:1;position:relative;display:grid;grid-template-rows:repeat(2,minmax(0,1fr));align-self:stretch;gap:0;width:var(--deck-rail-w);height:100%}
.deck{position:relative;flex:none;width:var(--board-card-w);height:calc(var(--board-card-w) * var(--card-ratio));border:1px solid rgba(205,86,31,.32);border-radius:.06rem;background:#180c07 center/cover no-repeat;box-shadow:.15rem .2rem 0 #080402,.3rem .35rem 0 #261108,0 .45rem .9rem #000;cursor:grab;touch-action:none}
.deck-label{position:absolute;left:50%;bottom:-1.2rem;display:flex;align-items:baseline;justify-content:center;transform:translateX(-50%);color:#c17b4e;font-family:"WCS Display",Georgia,serif;font-size:.7rem;letter-spacing:.035em;white-space:nowrap;pointer-events:none}.ui-number{position:relative;top:-.045em;font-family:"WCS Body",Georgia,serif;font-size:.92em;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1,"tnum" 1;letter-spacing:0}
.deck.empty{overflow:hidden;opacity:.78;background-color:#100704;cursor:default;box-shadow:inset 0 0 1rem #000b,0 .24rem .45rem #0008}
.deck.empty::before{content:"";position:absolute;inset:8%;border:1px dashed rgba(199,91,40,.42);background:radial-gradient(ellipse,rgba(173,63,20,.09),transparent 68%);box-shadow:inset 0 0 .8rem rgba(0,0,0,.72)}
.deck.empty::after{content:"EMPTY";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-4deg);color:rgba(200,105,62,.55);font:400 clamp(.34rem,1.2vw,.48rem)/1 "WCS Display",Georgia,serif;letter-spacing:.09em;text-shadow:0 .08rem .14rem #000;white-space:nowrap}
.deck.revealed{background-size:cover}
@container deck-rail (max-width:4.25rem){.deck-label{bottom:-1.7rem;width:100%;flex-direction:column;align-items:center;gap:0;line-height:.9}.deck-separator{display:none}}

.drop-zone.drop-active{border-color:#d76528!important;background-color:rgba(183,68,20,.14)!important;box-shadow:inset 0 0 1.1rem rgba(222,83,28,.22)}
.drop-zone.drop-hover{border-color:#ff9c4c!important;background-color:rgba(216,81,25,.24)!important;box-shadow:0 0 1rem rgba(224,76,22,.34),inset 0 0 1.4rem rgba(224,81,26,.24)}
.gesture-hint{margin:0 auto;color:#8e5838;font-size:.66rem;text-align:center;text-shadow:0 .08rem .18rem #000;opacity:.66;transition:color .25s,opacity .35s,text-shadow .25s}
.gesture-hint.onboarding-active{color:#d79962;opacity:1;text-shadow:0 .08rem .18rem #000,0 0 .55rem rgba(197,80,29,.24)}

.drag-ghost{position:fixed;z-index:1000;display:none;width:var(--card-w);height:var(--card-h);pointer-events:none;transform:translate(-50%,-50%) rotate(2deg);opacity:.88;filter:drop-shadow(0 1rem 1rem #000)}
.drag-ghost.active{display:block}.drag-ghost img{width:100%;height:100%;border-radius:.28rem;object-fit:cover}
.toast{position:fixed;z-index:1200;left:50%;bottom:max(1rem,env(safe-area-inset-bottom));max-width:min(92vw,28rem);padding:.65rem 1rem;border:1px solid rgba(216,88,28,.5);border-radius:.08rem;background:#160a05f2;color:#e7a364;font-family:"WCS Display",Georgia,serif;letter-spacing:.03em;text-align:center;box-shadow:0 .7rem 2rem #000,inset 0 0 1rem rgba(143,39,7,.14);opacity:0;pointer-events:none;transform:translate(-50%,1rem);transition:.2s}
.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{border-color:#cb6f68aa;color:#ffc4bd}
dialog{max-width:calc(100vw - 1rem);max-height:calc(100dvh - 1rem);padding:0;border:1px solid rgba(213,88,28,.45);border-radius:.1rem;background:linear-gradient(145deg,#2b130a,#0d0704);color:var(--bone);box-shadow:0 1.5rem 6rem #000}
dialog::backdrop{background:rgba(0,0,0,.77);backdrop-filter:blur(5px)}
dialog header{position:sticky;z-index:2;top:0;display:flex;align-items:center;justify-content:space-between;padding:.8rem 1rem;border-bottom:1px solid rgba(206,84,26,.35);background:#1a0c07f4}
.dialog-close{min-width:2.5rem;padding:.35rem .7rem;border:0;background:transparent;font:2rem/1 system-ui,sans-serif;box-shadow:none}
.rules-dialog{width:min(95vw,54rem)}.rules-dialog h2{font-size:2rem}.rulebook-content{padding:clamp(1rem,4vw,2.5rem);background:#ede8d5;color:#161710;line-height:1.55}.rulebook-content h1,.rulebook-content h2{color:#17231b;text-shadow:none}.rulebook-content h1{font-size:2.6rem}.rulebook-content h2{margin-top:1.5em;border-bottom:1px solid #2d372d44}.rulebook-content strong{color:#4d261d}.rulebook-content hr{border:0;border-top:1px solid #1e2b2244}.rulebook-content li{margin:.4rem 0}.rulebook-content img{max-width:100%;height:auto}.rulebook-content>p>img{display:block;width:100%;margin:1.25rem auto;border:1px solid #5e3927;box-shadow:0 .45rem 1.1rem #13090555}.rulebook-content table{width:100%;margin:1rem 0;border-collapse:collapse;font-size:clamp(.74rem,2.2vw,.95rem)}.rulebook-content th,.rulebook-content td{padding:.42rem .5rem;border:1px solid #2d372d44;text-align:left;vertical-align:middle}.rulebook-content th{background:#27332916;color:#3e2119}.rulebook-content tr:nth-child(even) td{background:#27332909}.rulebook-content .rulebook-symbol{display:block;width:2.15rem;height:2.15rem;margin:auto;object-fit:contain}.rulebook-content .rulebook-presence{display:block;width:4.5rem;height:4.5rem;margin:auto;object-fit:contain}.rulebook-content .rulebook-swatch{display:block;width:2rem;aspect-ratio:1;margin:auto;border:1px solid #1b1711;box-shadow:inset 0 0 0 1px #f5efd566,0 .12rem .25rem #13090544}
.controls-dialog{width:min(94vw,35rem);overflow:auto}.controls-content{padding:clamp(1rem,4vw,2rem);color:#d2b58e;line-height:1.4}.controls-content>p:first-child{margin-top:0;color:#efc38b}.controls-content dl{display:grid;grid-template-columns:minmax(8rem,.7fr) minmax(0,1.6fr);gap:.7rem 1rem;margin:1.2rem 0}.controls-content dt{color:#e69b58;font-family:"WCS Display",Georgia,serif}.controls-content dd{margin:0}.controls-content>p:last-child{margin-bottom:0;color:#9f7a5d;font-size:.84rem}

.automation-toggle{display:grid;grid-template-rows:1fr auto;place-items:center;min-width:2.7rem;padding:.34rem .45rem;border:1px solid rgba(198,94,34,.35);border-radius:.12rem;background:#100905e8;color:var(--bone);cursor:pointer;box-shadow:0 .2rem .7rem rgba(0,0,0,.35)}
.automation-toggle input{position:absolute;width:1px;height:1px;opacity:0}.automation-mark{font:1.05rem/1 system-ui,sans-serif;transition:.18s}.automation-label{font-size:.58rem;letter-spacing:.05em;text-transform:uppercase}.automation-toggle:has(input:checked){border-color:var(--ember-bright);color:#ffd29a;box-shadow:0 0 .65rem rgba(229,108,40,.32)}.automation-toggle:has(input:checked) .automation-mark{transform:rotate(45deg);color:var(--ember-bright)}

.own-hand-row{position:relative;display:flex;align-items:end;justify-content:center;min-height:calc(var(--card-h) + .5rem)}.own-hand-row .hand{flex:1;padding-right:calc(var(--action-control-width) * .45)}.hand-tools{position:absolute;z-index:15;right:0;bottom:.25rem;display:grid;grid-template-columns:1fr 1fr;gap:.25rem;width:var(--action-control-width)}.hand-tool{min-width:0;padding:.38rem .25rem;color:#c28a5e;font-size:.9rem}.hand-tool span{display:block;font-size:.52rem;text-transform:uppercase}.hand-tool.active{border-color:var(--ember-bright);color:#ffd09b;box-shadow:0 0 .8rem rgba(229,108,40,.35)}.own-hand.hand-revealed .card{outline:2px solid #f2a45d;outline-offset:2px;box-shadow:0 0 .8rem rgba(238,127,55,.65)}
.claim-control{position:relative;padding:.08rem .2rem;border:0;background:transparent;color:inherit;font-size:inherit;box-shadow:none}.claim-control:hover,.claim-control:focus-visible{border:0;color:#ffd09b;box-shadow:none}.claim-control.holding{color:#ffd09b}.turn-controls{display:flex;align-items:center;gap:.35rem}.turn-button{width:var(--action-control-width);font-size:.82rem}.hold-control.holding{border-color:#e7a465;color:#ffe0b2}.retreat-button{min-height:2.55rem;border-color:rgba(160,70,55,.5);color:#cb8d78;font-family:"WCS Display",Georgia,serif;text-transform:uppercase}.retreat-button.holding{border-color:#e46e4e;color:#ffd2c6}
.hold-indicator{position:fixed;z-index:2100;left:0;top:0;width:2.35rem;height:2.35rem;padding:.18rem;border-radius:50%;background:rgba(15,7,4,.9);box-shadow:0 .35rem 1rem #000,0 0 .8rem rgba(231,122,56,.3);opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.72);transition:opacity .1s ease,transform .1s ease}.hold-indicator.active{opacity:1;transform:translate(-50%,-50%) scale(1)}.hold-indicator svg{display:block;width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}.hold-indicator circle{fill:none;stroke-width:3}.hold-track{stroke:rgba(231,190,137,.22)}.hold-progress{stroke:#f0a45e;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;filter:drop-shadow(0 0 .16rem #e46c2b)}.hold-indicator.active .hold-progress{animation:hold-ring var(--hold-duration,650ms) linear forwards}@keyframes hold-ring{to{stroke-dashoffset:0}}

.deck-station{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.28rem;width:100%;min-height:0}.peek-button{width:100%;min-width:0;height:clamp(1.75rem,calc(var(--board-card-w) * .58),2rem);padding:.08rem;color:#c48a61;font-size:.62rem;line-height:.8}.peek-button span{display:block;font-size:.38rem;line-height:1;text-transform:uppercase}.peek-button.active{border-color:var(--ember-bright);color:#ffd09b;box-shadow:0 0 .65rem rgba(229,108,40,.3)}

.card.preview-active{opacity:.55;filter:brightness(.82) saturate(.8);box-shadow:inset 0 0 0 1px rgba(229,169,112,.28),0 .18rem .38rem #0009;transition:opacity .14s ease-out,filter .14s ease-out,box-shadow .14s ease-out}.card-preview-visual{position:fixed;z-index:1100;display:block;overflow:hidden;border-radius:.3rem;filter:brightness(1.12);box-shadow:0 1.2rem 2.8rem #000;pointer-events:none;animation:card-preview-in .16s ease-out}.card-preview-visual img{position:absolute;left:50%;top:50%;display:block;width:100%;height:100%;border-radius:inherit;object-fit:cover;image-rendering:auto;transform:translate(-50%,-50%);pointer-events:none}.card-preview-visual.lair-orientation img{width:var(--preview-card-width);height:var(--preview-card-height);transform:translate(-50%,-50%) rotate(-90deg)}@keyframes card-preview-in{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.card-preview-visual{animation:none!important}}

.peek-dialog{position:fixed;z-index:900;inset:auto;max-width:none;max-height:none;margin:0;padding:0;overflow:hidden;transform:none}.peek-dialog[open]{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto}.peek-dialog header{min-height:0;padding:.32rem .48rem}.peek-dialog header h2{font-size:clamp(1rem,3.2vw,1.2rem);line-height:1}.peek-dialog header .dialog-close{width:2rem;height:2rem;min-width:2rem;padding:0;font-size:1.35rem;line-height:1}.peek-dialog>p{margin:.2rem .5rem;color:#b99674;font-size:.72rem;line-height:1.2;text-align:center}.peek-dialog footer{padding:.35rem .5rem}.peek-cards{display:grid;grid-template-columns:repeat(var(--peek-count,1),minmax(0,1fr));align-items:center;gap:.35rem;min-height:0;padding:.2rem .45rem;overflow:auto}.peek-choice{display:grid;min-width:0;justify-items:center;padding:.25rem;border:1px solid rgba(207,88,29,.2);background:#100704}.peek-choice.revealed{border-color:#e48b4c;box-shadow:0 0 .8rem rgba(224,95,29,.2)}.peek-card{width:min(100%,11rem);height:auto;aspect-ratio:1/1.4;box-shadow:0 .55rem 1rem #000}.peek-dialog:has(.peek-card.preview-active),.peek-cards:has(.peek-card.preview-active){overflow:visible}.peek-group-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:.4rem;margin:0 auto;width:min(100%,25rem)}.peek-group-actions button{padding:.45rem .45rem;font-family:"WCS Display",Georgia,serif;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.shared-reveal-dialog{width:min(90vw,22rem)}.shared-reveal-dialog img{display:block;width:min(80vw,18rem);max-height:75dvh;margin:1rem auto;object-fit:contain;border-radius:.3rem;box-shadow:0 .8rem 2rem #000}

.setup-animation{position:fixed;z-index:1600;inset:0;display:grid;grid-template-rows:1fr auto auto 1fr;place-items:center;background:radial-gradient(ellipse,rgba(89,28,8,.86),rgba(5,3,2,.97));color:#e7a364;pointer-events:auto}.setup-card-cloud{position:relative;align-self:end;width:min(90vw,30rem);height:12rem}.setup-card-cloud i{position:absolute;z-index:2;left:50%;top:50%;width:3rem;height:4.2rem;border:1px solid #b56b3f;border-radius:.15rem;background:#1b100b url("game/cards/card_back.webp?v=92c8eb2b6e01") center/cover;box-shadow:0 .2rem .45rem #000,.18rem .24rem 0 rgba(31,12,6,.82);transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(var(--rot));transition:transform 1.3s cubic-bezier(.2,.8,.2,1);animation:setup-shuffle .64s var(--delay,0s) ease-in-out infinite alternate}.setup-pile-guides{position:absolute;z-index:1;inset:0;pointer-events:none}.setup-pile-guides span{position:absolute;left:50%;top:50%;width:3.35rem;height:4.55rem;border:1px dashed rgba(218,106,51,.2);transform:translate(-50%,-50%) translateX(var(--target-x));opacity:.22;box-shadow:inset 0 0 1rem #0008;transition:opacity .3s,border-color .3s,box-shadow .3s}.setup-animation.sorting .setup-card-cloud i{animation:none}.setup-animation.sorting .setup-card-cloud i.boxed{transform:translate(calc(-50% - 7rem + var(--x)),calc(-50% + var(--y))) rotate(var(--rot))}.setup-animation.sorting .setup-card-cloud i.round{transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) rotate(var(--rot))}.setup-animation.dealing .setup-card-cloud i.wild{transform:translate(calc(-50% + 7rem + var(--x)),calc(-50% + var(--y))) rotate(var(--rot))}.setup-animation.sorting .setup-pile-guides .boxed,.setup-animation.sorting .setup-pile-guides .round,.setup-animation.dealing .setup-pile-guides .wild{opacity:.76;border-color:rgba(239,131,69,.6);box-shadow:inset 0 0 1rem #0008,0 0 .8rem rgba(221,79,24,.25)}.setup-animation-copy{margin:.4rem;font-family:"WCS Display",Georgia,serif;font-size:clamp(1.2rem,5vw,2rem);text-align:center}.setup-piles{display:flex;gap:clamp(1rem,8vw,4rem);font-size:.72rem;text-transform:uppercase}.setup-piles span{min-width:5rem;color:#9c623d;text-align:center;transition:color .3s,text-shadow .3s,opacity .3s}.setup-piles span:empty{visibility:hidden}.setup-animation.sorting .setup-piles span[data-pile="boxed"],.setup-animation.sorting .setup-piles span[data-pile="round"],.setup-animation.dealing .setup-piles span[data-pile="wild"]{color:#f0b06f;text-shadow:0 0 .55rem rgba(231,101,39,.45)}@keyframes setup-shuffle{to{transform:translate(calc(-50% - var(--x)),calc(-50% - var(--y))) rotate(var(--rot-back))}}

@media(min-width:900px){
  .game{grid-template-rows:auto minmax(3.6rem,auto) minmax(0,1fr) minmax(9rem,auto) auto}
  .board{max-height:100%}
}

@media(max-width:680px){
  :root{--card-w:clamp(2.8rem,15vw,4.4rem);--action-control-width:6.2rem}
  body::before{opacity:.42;box-shadow:inset 0 0 3rem #000,inset 0 0 1rem rgba(0,0,0,.65)}
  .game{grid-template-rows:auto minmax(3.1rem,auto) minmax(0,1fr) minmax(7rem,auto) auto}
  .topbar{padding:.28rem 0}.topbar .eyebrow{font-size:.55rem}.topbar h1{font-size:1rem}.icon-button,.automation-toggle{min-width:2.35rem;padding:.38rem}.icon-button span,.automation-label{display:none}
  .opponent-area{grid-template-columns:5.5rem 1fr;min-height:3.1rem;padding:0}.opponent-hand{min-height:2.8rem}.player-plate{min-width:5rem;font-size:.65rem}.player-plate strong{font-size:.85rem}
  .table-wrap{min-height:0;padding:.1rem 0}.board{min-height:0;padding:.22rem .12rem;gap:.14rem}
  .peek-button span{font-size:.38rem}.deck-label{font-size:.66rem}
  .lair-slot{width:100%}.hand .card{margin-left:calc(var(--card-w) * -.22)}
  .own-area{padding:.15rem 0}.own-hand-row .hand{padding-right:calc(var(--action-control-width) * .58)}.bottom-strip{padding:0}.turn-controls{gap:.2rem}.retreat-button{min-height:2.3rem;padding:.4rem;font-size:.62rem}.turn-button{min-width:var(--action-control-width);height:2.5rem;padding:.55rem .3rem;font-size:.58rem;letter-spacing:.04em}.hand-tools{right:0;gap:.15rem}.hand-tool{padding:.2rem .1rem;font-size:.68rem}.hand-tool span{font-size:.4rem}
  .gesture-hint{font-size:.58rem}
}

@media(max-width:480px){.controls-content dl{grid-template-columns:1fr;gap:.18rem}.controls-content dd{margin:0 0 .55rem}.own-hand-row .hand{padding-right:calc(var(--action-control-width) + .4rem)}}

@media(max-width:360px){.topbar h1{display:none}.icon-button{min-width:2rem;padding:.32rem}.turn-banner{max-width:94%;padding:.2rem .35rem;font-size:.58rem}}

@media(max-height:640px) and (orientation:landscape){
  :root{--card-w:2.75rem}.game{grid-template-rows:auto 2.8rem minmax(0,1fr) 4.5rem auto}.topbar{padding:0}.topbar h1{font-size:1rem}.topbar .eyebrow{display:none}.player-area{min-height:0}.opponent-area{min-height:2.8rem}.own-area{min-height:4.5rem}.table-wrap{min-height:0}.board{min-height:0;max-height:100%}
}
