@font-face{font-family:Book;src:url(assets/serif.woff2)}@font-face{font-family:Sans;src:url(assets/sans.woff2)}@font-face{font-family:Sans;src:url(assets/sans-bold.woff2);font-weight:700}
:root{--ink:#20392e;--muted:#6d756d;--paper:#f6f3eb;--line:#dcded1;--gold:#be9d61;--green:#214d3a;--dark:#14271f;font-family:Sans,system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;min-height:44px;border:0;border-radius:12px;padding:10px 16px;background:#e9ecdf;color:var(--ink);font-weight:700;transition:background .15s,transform .15s}button:hover{background:#dde4d2}button:active{transform:scale(.98)}button:disabled{opacity:.35;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid #b28b3e;outline-offset:3px}input,select{border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff;color:var(--ink);min-height:44px}input:focus{outline:2px solid #718963}h1,h2,h3{font-family:Book,Georgia,serif;font-weight:400;line-height:1.3}h1{font-size:clamp(27px,3vw,40px);margin:8px 0 12px}h2{font-size:23px}h3{font-size:17px;margin:6px 0}p{line-height:1.6}small,.muted{color:var(--muted)}.primary{background:var(--green);color:#fff}.primary:hover{background:#31684e}.quiet{background:transparent}.danger{color:#9c3333;background:#f7e9e3}.eyebrow{font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:#81977f}.row{display:flex;align-items:center;gap:10px}.between{justify-content:space-between}.wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.stack{display:grid;gap:14px}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.brand{display:flex;gap:12px;align-items:center;font-family:Book,serif;font-size:20px;color:#ece5cd}.brand .sigil{width:38px;height:42px;border:1px solid #bfa36c;border-radius:7px;display:grid;place-items:center;color:#d5b978;font-family:Book;font-size:24px}.sidebar{width:228px;background:var(--dark);position:fixed;inset:0 auto 0 0;padding:30px 22px;display:flex;flex-direction:column;z-index:20}.sidebar nav{margin-top:58px;display:grid;gap:8px}.nav{display:flex;align-items:center;gap:14px;background:transparent;color:#a9b9aa;text-align:left;font-weight:400}.nav.active{background:#ffffff0e;color:#ebddba}.nav:hover{background:#ffffff12}.sidebar footer{margin-top:auto;color:#91a38f;font-size:12px;line-height:1.8}.main{margin-left:228px;padding:35px clamp(22px,4vw,64px) 50px;max-width:1640px}.topline{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:var(--muted);margin-bottom:38px}.badge{border:1px solid #c9cebe;border-radius:30px;padding:5px 10px;font-size:11px;letter-spacing:.06em}.mobile-nav{display:none}.hero{background:linear-gradient(115deg,#173d2d,#325c43);color:#faf4e5;border-radius:22px;padding:30px 36px;display:flex;align-items:center;justify-content:space-between;gap:20px;overflow:hidden;min-height:235px;margin:26px 0 30px}.hero p{color:#c3d1bd;max-width:430px}.hero .primary{background:#e9dab5;color:#243b2d}.hero-art{display:flex;align-items:center;width:220px;padding:10px;flex-shrink:0}.hero-art .card-face{width:90px;transform:rotate(-13deg);margin-right:-22px;box-shadow:0 12px 18px #0004}.hero-art .card-face:nth-child(2){transform:rotate(0);margin-top:-25px}.hero-art .card-face:nth-child(3){transform:rotate(14deg)}.section-head{display:flex;align-items:center;justify-content:space-between;margin:22px 0 12px}.section-head h2{margin:0}.deck-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:16px}.deck-tile{border:1px solid var(--line);border-radius:18px;background:#fffdf7;padding:20px}.deck-art{display:flex;justify-content:center;padding:14px 20px 20px;min-height:150px}.deck-art .card-face{width:74px;transform:rotate(-7deg);margin:0 -15px;box-shadow:0 5px 10px #0002}.deck-art .card-face:nth-child(2){transform:rotate(8deg)}.card-face{position:relative;display:block;aspect-ratio:323/466;overflow:hidden;border-radius:7px;background:#fff;box-shadow:0 1px 4px #0002;flex-shrink:0}.card-face img{position:absolute;max-width:none;display:block;width:158.514%;height:109.871%;left:-29.102%;top:-4.936%;pointer-events:none;user-select:none}.card-face.full img{width:100%;height:100%;left:0;top:0;object-fit:contain;background:#fff}.builder-heading{display:flex;align-items:center;gap:12px;margin-bottom:24px}.deck-name{font-family:Book;font-size:26px;width:min(100%,450px);background:transparent;border:1px solid transparent;padding:8px 0}.deck-name:focus{background:#fff;padding-left:10px}.builder{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:28px}.library-toolbar{display:flex;gap:10px;margin-bottom:14px}.library-toolbar input{width:100%;min-width:0}.filters{display:flex;gap:6px;margin-bottom:20px;overflow:auto;padding-bottom:4px}.filter{white-space:nowrap;font-size:12px;border-radius:30px;min-height:36px;padding:7px 12px;background:transparent;border:1px solid var(--line)}.filter.active{background:var(--green);color:#fff;border-color:var(--green)}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:18px 15px}.card-tile{position:relative;min-width:0}.card-add{display:block;width:100%;background:transparent;padding:0;border-radius:8px}.card-add .card-face{width:100%;transition:transform .15s}.card-add:hover{background:transparent}.card-add:hover .card-face{transform:translateY(-3px)}.card-label{font-size:12px;display:flex;align-items:center;justify-content:space-between;gap:3px;margin-top:7px}.card-label span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.info-btn{font-size:14px;padding:0;width:30px;min-height:32px;flex-shrink:0;background:transparent;color:var(--muted)}.qty{position:absolute;right:-6px;top:-7px;background:var(--green);border:2px solid var(--paper);color:white;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;font-size:12px;font-weight:700;pointer-events:none}.review-panel{background:#eeeee4;border:1px solid var(--line);border-radius:18px;padding:20px;align-self:start;position:sticky;top:20px;max-height:calc(100vh - 50px);overflow:auto}.review-panel h2{margin:0;font-size:21px}.review-list{margin:16px 0;display:grid;gap:9px}.review-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #d9dece}.review-row .card-face{width:38px}.review-row .name{font-size:13px;font-weight:700}.stepper{display:flex;align-items:center;gap:8px}.stepper button{width:35px;min-height:38px;padding:0;background:#fffdf7;border:1px solid var(--line);font-size:20px}.stepper span{font-size:13px;min-width:12px;text-align:center}.review-panel .primary{width:100%;margin-top:12px}.empty{padding:40px 10px;text-align:center;color:var(--muted);line-height:1.7}.empty .icon{width:36px;height:36px}.mobile-switch{display:none}.session-row{display:flex;gap:18px;align-items:center;background:#fffdf7;border:1px solid var(--line);border-radius:14px;padding:18px;margin-bottom:12px}.session-row .icon{color:#718762}.loading{padding:50px;text-align:center}.notice{font-size:12px;color:var(--muted);margin-top:20px;line-height:1.6}
dialog{border:0;border-radius:22px;padding:25px;background:var(--paper);color:var(--ink);width:min(480px,calc(100% - 24px));max-height:85dvh;box-shadow:0 30px 100px #0006}dialog::backdrop{background:#071710a8;backdrop-filter:blur(4px)}dialog h2{margin:0}.dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.dialog-body{display:grid;gap:13px}.dialog-body>button{width:100%;text-align:left}.dialog-body input{width:100%}.dialog-body label{font-size:13px;display:grid;gap:7px}.preview-card{width:150px;margin:0 auto 12px}.sheet-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.file-label{padding:18px;border:1px dashed #98a992;border-radius:12px;background:#e9eee2;cursor:pointer}.file-label input{padding:0;border:0;background:none;font-size:13px;max-width:100%}#toast{position:fixed;bottom:100px;left:50%;transform:translate(-50%,20px);opacity:0;pointer-events:none;max-width:calc(100% - 32px);background:#14291f;color:#fff;padding:12px 20px;border-radius:12px;z-index:1000;box-shadow:0 4px 20px #0003;transition:.2s;font-size:14px}#toast.show{opacity:1;transform:translate(-50%,0)}
.table-screen{height:100dvh;min-height:420px;background:radial-gradient(ellipse at 48% 35%,#387a59 0,#256147 48%,#184633 100%);color:#f7edce;display:flex;flex-direction:column;overflow:hidden;position:relative}.table-screen:before{content:'';position:absolute;inset:0;opacity:.11;pointer-events:none;background-image:url('assets/felt-noise.png')}.table-top{position:relative;display:flex;align-items:center;gap:12px;padding:15px 22px;z-index:5}.table-top button{background:#11291fcc;color:#eadebd;border:1px solid #d0bb6c35}.table-title{flex:1;text-align:center}.table-title strong{font-family:Book;font-weight:400;font-size:21px}.table-title small{display:block;color:#b2c8b0;font-size:10px;margin-top:3px}.score{display:flex;gap:8px}.score button{min-width:50px;padding:7px 10px;font-size:18px}.score small{font-size:9px;display:block;color:#b7c5af;letter-spacing:.08em}.board{position:relative;flex:1;min-height:150px;overflow:hidden;touch-action:none}.table-pile{position:absolute;right:12%;top:10%;width:clamp(60px,9vw,105px);padding:0;background:transparent;box-shadow:3px -3px #dedfcd,6px -6px #c9cdb8;border-radius:7px}.table-pile .card-face{width:100%}.pile-count{position:absolute;bottom:6px;right:6px;min-width:24px;border-radius:20px;background:#d7bd82;color:#2b311f;padding:3px 6px;font-size:12px}.pile-label{position:absolute;bottom:-27px;left:0;right:0;text-align:center;white-space:nowrap;font-size:12px;color:#eee1bb}.piece{position:absolute;width:clamp(57px,8vw,95px);padding:0;background:transparent;touch-action:none;transform:translate(-50%,-50%) rotate(var(--turn));transition:box-shadow .15s;filter:drop-shadow(0 4px 4px #0003)}.piece .card-face{width:100%}.piece:hover{background:transparent}.piece.dragging{z-index:50;filter:drop-shadow(0 12px 8px #0005);cursor:grabbing}.board-hint{position:absolute;left:50%;top:65%;transform:translate(-50%,-50%);text-align:center;color:#bad1b9;font-size:13px;pointer-events:none;max-width:260px;line-height:1.8}.drawer-tab{position:absolute;width:24px;min-height:66px;padding:5px 0;border-radius:0 8px 8px 0;background:linear-gradient(90deg,#352419,#69462a);border:1px solid #af87434d;color:#e3c582;font-size:10px;z-index:10;box-shadow:2px 2px 4px #0003}.drawer-tab:before{content:'';display:block;margin:3px auto 8px;width:3px;height:19px;background:#c4a664;border-radius:3px}.drawer-tab.right{right:0;border-radius:8px 0 0 8px}.drawer-tab.left{left:0}.hand-area{position:relative;margin:0 auto 9px;background:#0f3025cc;border:1px solid #b0be9233;border-radius:16px;padding:10px 14px;max-width:calc(100% - 65px);z-index:4}.hand-strip{display:flex;gap:8px;overflow-x:auto;max-width:650px;padding-bottom:4px}.hand-strip button{width:64px;padding:0;background:none;flex-shrink:0}.hand-strip .card-face{width:100%}.hand-title{font-size:10px;color:#c8d4b9;letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}.table-dock{position:relative;display:flex;justify-content:center;gap:4px;margin:0 auto max(12px,env(safe-area-inset-bottom));padding:6px 10px;background:#10281fea;border:1px solid #ae955751;border-radius:20px;z-index:20;max-width:calc(100% - 24px)}.table-dock button{display:flex;flex-direction:column;align-items:center;gap:3px;min-width:67px;background:none;color:#e5d7b3;font-size:11px;font-weight:400;padding:8px}.table-dock button:hover{background:#ffffff12}.table-dock .count{font-size:10px;color:#d3b576}.drawer-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.drawer-cards button{padding:0;background:none}.drawer-cards .card-face{width:100%}
@media(min-width:1500px){.card-grid{grid-template-columns:repeat(auto-fill,minmax(125px,1fr))}}
@media(max-width:1100px){.sidebar{width:88px;padding:24px 13px}.brand .brand-word,.sidebar footer,.nav span{display:none}.brand{justify-content:center}.sidebar nav{margin-top:40px}.nav{justify-content:center;padding:12px}.main{margin-left:88px;padding:26px}.builder{grid-template-columns:minmax(0,1fr) 280px;gap:18px}.review-panel{padding:15px}.card-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:16px 10px}}
@media(max-width:700px){.sidebar{display:none}.main{margin-left:0;padding:22px 18px 104px}.topline{margin-bottom:24px;font-size:11px}.hero{padding:24px;min-height:220px;position:relative;margin-top:22px}.hero h2{font-size:23px;max-width:200px}.hero p{max-width:210px;font-size:13px}.hero-art{width:95px;position:absolute;right:-14px;top:52px;opacity:.55}.hero-art .card-face{width:64px}.hero>div:first-child{position:relative;z-index:1}.deck-grid{grid-template-columns:1fr 1fr;gap:12px}.deck-tile{padding:14px}.deck-tile .row{flex-wrap:wrap}.deck-tile h3{font-size:16px}.deck-art{padding:12px 0 20px;min-height:125px}.deck-art .card-face{width:60px}.deck-tile button{padding:9px 12px;font-size:12px}.mobile-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;padding:8px 8px max(8px,env(safe-area-inset-bottom));background:#f6f3ebf5;backdrop-filter:blur(15px);border-top:1px solid var(--line);z-index:30}.mobile-nav .nav{flex-direction:column;gap:3px;min-width:60px;font-size:10px;padding:5px 8px;color:#788373}.mobile-nav .nav span{display:block}.mobile-nav .nav.active{background:#e5eadb;color:#264c38}.mobile-nav .icon{width:22px;height:22px}.builder-heading{margin-bottom:14px;gap:8px}.builder-heading .primary{font-size:12px;padding:10px 13px;white-space:nowrap}.deck-name{font-size:21px}.mobile-switch{display:flex;gap:4px;background:#e6eadd;padding:4px;border-radius:13px;margin:0 0 20px}.mobile-switch button{flex:1;background:none;font-size:13px;min-height:40px;padding:8px}.mobile-switch button.active{background:#fffdf7;box-shadow:0 1px 5px #15291812}.builder{display:block}.review-panel{display:none;position:static;max-height:none;padding:16px;border:0;background:none}.builder.reviewing .choose-panel{display:none}.builder.reviewing .review-panel{display:block}.card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 12px}.card-label{font-size:10px;margin-top:4px}.filters{margin-bottom:15px}.filter{font-size:11px;min-height:34px}.review-row .card-face{width:47px}.review-row .name{font-size:14px}.stepper button{width:42px;min-height:44px}.review-list{gap:8px}.table-top{padding:12px 12px;gap:7px}.table-title strong{font-size:17px}.table-top .quiet{width:42px;padding:9px}.score{gap:5px}.score button{min-width:37px;padding:5px;font-size:16px}.table-top>.save-button{padding:9px;font-size:12px}.table-dock{width:calc(100% - 20px);padding:5px 3px;gap:0}.table-dock button{min-width:0;flex:1;padding:8px 4px;font-size:10px}.table-dock .icon{width:23px;height:23px}.hand-strip button{width:52px}.hand-area{padding:8px 10px}.piece{width:clamp(56px,16vw,85px)}.table-pile{width:clamp(57px,17vw,90px)}.session-row{padding:14px;gap:10px}.session-row h3{font-size:15px}dialog{padding:21px}#toast{font-size:12px;bottom:90px}.notice{font-size:11px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}


.piece:active{transform:translate(-50%,-50%) rotate(var(--turn))}.table-pile:active{transform:none}
.sliding-drawer{position:absolute;top:8%;width:min(82%,440px);height:76%;z-index:60;padding:10px;background:repeating-linear-gradient(92deg,#614024 0,#56351f 8px,#684529 13px);border:3px solid #956936;border-radius:9px;box-shadow:0 12px 28px #0006;transition:transform .32s cubic-bezier(.2,.75,.2,1);display:flex;flex-direction:column}.sliding-drawer.left{left:0;transform:translateX(-105%)}.sliding-drawer.right{right:0;transform:translateX(105%)}.sliding-drawer.is-open{transform:translateX(0)}.sliding-drawer header{display:flex;align-items:center;justify-content:space-between;gap:6px;color:#e7cf98;font-size:12px;padding:0 0 8px 8px}.sliding-drawer header button{background:#302014;color:#e7cf98;font-size:22px;min-width:44px}.drawer-surface{position:relative;flex:1;border-radius:5px;background:radial-gradient(ellipse,#513833,#2e201e);box-shadow:inset 0 3px 16px #0009;overflow:hidden;touch-action:none}.drawer-surface>p{text-align:center;color:#c5b298;font-size:12px;position:absolute;top:40%;width:100%;pointer-events:none}.drawer-surface .piece{width:clamp(50px,16vw,85px)}.table-world{position:absolute;inset:0;transform-origin:center;pointer-events:none}.table-world>button{pointer-events:auto}.view-tools{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);display:flex;gap:3px;z-index:9}.view-tools button{background:#10281fab;color:#e6d9b9;font-size:11px;padding:5px 10px;min-height:36px}.view-tools [aria-pressed=true]{background:#bfa464;color:#18372a}.drag-ghost{position:fixed!important;z-index:9999!important;pointer-events:none!important;opacity:.95;filter:drop-shadow(0 12px 8px #0008)}.piece.token{width:44px!important;min-height:44px}.token-disc{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 30% 20%,#ffffff77,transparent 60%),var(--token);border:3px double #ead5a5;color:#fff;text-shadow:0 1px 3px #000;font-size:18px;box-shadow:0 3px 2px #0007,inset 0 0 4px #0007}.piece.pile{box-shadow:3px -3px #ddd4ba,6px -6px #c1bba8;border-radius:8px}.empty-pile{display:grid;place-items:center;border:1px dashed #e5d6ac;aspect-ratio:323/466;font-size:10px}.dice-stage{height:280px;background:radial-gradient(ellipse,#294f3d,#0b1b15);border-radius:14px;overflow:hidden}.dice-stage canvas{display:block;max-width:100%}#dice-result{text-align:center;min-height:30px;font-size:20px;font-weight:700}#dice-type,#dice-count{width:100%}
.folder-list{max-height:42vh;overflow:auto}.folder-option{display:flex!important;align-items:center;gap:12px;padding:8px;border-bottom:1px solid #d5d8cb}.folder-option input{width:22px!important;height:22px;min-height:22px}.folder-option span{flex:1}
.sliding-drawer{height:48%;min-height:220px}
.piece.selected{outline:3px solid #efcd70;outline-offset:4px;border-radius:8px}.mask-art{display:block;aspect-ratio:1}.mask-art img{width:100%;height:100%;object-fit:contain;pointer-events:none}.piece.mask{width:58px}.card-counter{position:absolute;right:-6px;bottom:0;border:1px solid #725b39;border-radius:20px;background:#e8d9b5;color:#352c1e;padding:3px 7px;font-size:12px}.card-counter.red{bottom:26px;background:#ad473f;color:white}.view-tools{max-width:calc(100% - 55px)}.view-tools button{padding:5px 8px;white-space:nowrap}
.piece,.piece:active{transform:translate(-50%,-50%) rotate(var(--turn)) scale(var(--piece-scale,1))}

/* Table gestures manipulate pieces and camera, never browser text/image selections. */
.table-screen,.table-screen *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.table-screen img,.drag-ghost img{-webkit-user-drag:none;user-select:none}
/* A mask's visible art may be large, but only its central handle intercepts input. */
.piece.token-target,.piece.token-target.token,.piece.token-target.pile{width:28px!important;height:28px;min-height:28px;border:0;box-shadow:none;background:transparent;overflow:visible;padding:0}
.token-target .mask-art{position:absolute;width:58px;height:58px;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}
.token-target .mask-art img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.token-target .token-disc{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none}
.token-count{position:absolute;left:17px;top:17px;border-radius:12px;padding:2px 5px;background:#d7bd82;color:#263628;font-size:10px;pointer-events:none}
.drag-status{position:absolute;top:-30px;left:50%;transform:translateX(-50%);background:#14271fee;color:#f6e9c1;border-radius:10px;padding:4px 8px;white-space:nowrap;font:12px Sans;pointer-events:none}.drag-status:empty{display:none}
.table-dock .deal-mode-button{flex:0 0 24px;min-width:24px;padding:4px 2px;font-size:20px;border-left:1px solid #ac956633}.deal-symbol{font-size:22px;line-height:24px}
.deck-browser{position:absolute;bottom:90px;left:12px;right:12px;z-index:75;padding:12px;background:#182c22f5;color:#eee3c5;border:1px solid #aa8f52;border-radius:16px;box-shadow:0 -10px 40px #0005;max-width:1000px;margin:auto}.deck-browser header{display:flex;align-items:center;justify-content:space-between}.deck-browser header button{background:none;color:inherit;font-size:24px}.deck-browser input{width:100%;min-height:36px;padding:7px 10px}.deck-browser p{font-size:11px;margin:7px 0;color:#c8cdb9}.ribbon-track{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;touch-action:none;overscroll-behavior:contain;padding:8px 4px 10px;scrollbar-width:thin}.ribbon-card{flex:0 0 100px;padding:0;background:none;color:#eee3c5;touch-action:none;user-select:none}.ribbon-card .card-face{width:100%}.ribbon-card small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100px;color:inherit;font-size:10px;margin-top:7px}.ribbon-card.chosen{outline:2px solid #dcbb76;outline-offset:2px}.ribbon-card:hover{background:none}.ribbon-card:active{transform:none}.hand-strip button{touch-action:none}
@media(max-height:620px){.deck-browser{bottom:75px;padding:8px}.ribbon-card{flex-basis:65px}.ribbon-card small{width:65px}.deck-browser p{margin:3px 0}}
/* The asset has white side margins; crop them in the background positioning. */
.drawer-tab{width:30px;min-height:0;height:29%;padding:0;border:0;border-radius:0 5px 5px 0;background-image:url('assets/drawer-walnut-gold-v1.png');background-repeat:no-repeat;background-size:250% 100%;background-position:50% 50%;box-shadow:2px 2px 7px #0007;touch-action:none}
.drawer-tab.right{border-radius:5px 0 0 5px}.drawer-tab:before{display:none}.drawer-tab:hover{background-color:transparent;background-image:url('assets/drawer-walnut-gold-v1.png');filter:brightness(1.1)}
.drawer-tab .drawer-count{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);width:20px;height:20px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#f8e5a7,#b7944c);border:1px solid #8d6c37;box-shadow:0 1px 3px #0008;display:grid;place-items:center;color:#302419;font:700 11px Sans;pointer-events:none}
@media(min-width:701px){.drawer-tab{width:36px}.drawer-tab .drawer-count{width:24px;height:24px;font-size:12px}}
.hand-drop-target{position:absolute;bottom:94px;left:42px;right:42px;height:72px;border:2px dashed #d5bc79;border-radius:15px;background:#142e23dd;z-index:72;display:none;align-items:center;justify-content:center;font:13px Sans;color:#e9d5a5;pointer-events:none}.hand-drop-target.visible{display:flex}
.drawer-surface .piece:not(.token-target){width:72px}@media(max-width:700px){.drawer-surface .piece:not(.token-target){width:52px}}
.zoom-piece{width:min(100%,310px);margin:auto}.zoom-piece .card-face{width:100%}
/* Stable hover target; slide only the wooden front to reveal an 8px shadowed gap.
   The artwork sits on a pseudo-element so button:hover cannot reset its crop. */
.drawer-tab,.drawer-tab:hover{--edge-width:30px;width:var(--edge-width);background:#291b12;filter:none;overflow:visible;transition:width .18s ease}
.drawer-tab::before{content:'';display:block;position:absolute;top:0;bottom:0;margin:0;width:var(--edge-width);height:auto;border-radius:inherit;background:#51321e url('assets/drawer-walnut-gold-v1.png') 50% 50% / 250% 100% no-repeat;pointer-events:none}
.drawer-tab.left::before{left:auto;right:0}.drawer-tab.right::before{right:auto;left:0}
.drawer-tab.left .drawer-count{left:auto;right:5px;transform:none}.drawer-tab.right .drawer-count{left:5px;right:auto;transform:none}
.drawer-tab:active{transform:none}
@media(min-width:701px){.drawer-tab,.drawer-tab:hover{--edge-width:36px}.drawer-tab.left .drawer-count{right:6px}.drawer-tab.right .drawer-count{left:6px}}
@media(hover:hover){.drawer-tab[aria-expanded="false"]:hover,.drawer-tab[aria-expanded="false"]:focus-visible{width:calc(var(--edge-width) + 8px)}}

.zoom-stage{position:relative;width:100%;margin:12px auto;overflow:hidden}.zoom-stage .zoom-piece{position:absolute;left:50%;top:50%;margin:0;max-width:none;transform-origin:center}.zoom-stage .card-face{width:100%;height:100%;object-fit:contain}.zoom-controls{display:flex;justify-content:center;gap:12px}

.picker-quantity{display:flex;align-items:center;gap:5px;margin-top:6px;font-size:11px;white-space:nowrap}.picker-quantity button{min-width:44px;min-height:44px;padding:0;font-size:22px}.picker-quantity span{flex:1;text-align:center}.tag-suggestions{display:flex;flex-wrap:wrap;gap:8px}#card-tags{display:block;width:100%;margin-top:8px}

.board{overflow:visible}.table-screen{isolation:isolate}.dice-stage{border:3px solid #8c6c3e;border-radius:16px;overflow:hidden;box-shadow:inset 0 2px 10px #0006,0 3px 10px #0002}#dice-pool{margin:12px 0}

.table-screen:before{display:none}

.dice-stage{position:relative}.dice-totals{position:absolute;inset:auto 10px 10px;display:flex;justify-content:space-between;z-index:1;pointer-events:none}.dice-totals>div{min-width:64px;padding:6px 9px;background:#10271ee6;border:1px solid #d7bd8266;border-radius:8px;color:#fff3d2;text-align:center}.dice-totals span{display:block;font-size:10px;line-height:1.3}.dice-totals output{display:block;font-size:23px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1.15}

.hand-card{position:relative;flex-shrink:0}.hand-strip .hand-attachment{position:absolute;width:28px;z-index:2}.hand-strip{padding:10px}.hand-attachment .mask-art,.hand-attachment .token-disc{max-width:38px;max-height:38px}
.card-tile.in-deck .card-add{outline:3px solid #b4934e;outline-offset:2px;border-radius:7px;box-shadow:0 0 0 5px #be9d6126}.card-tile.in-deck .picker-quantity{background:#e3eadb;border-radius:10px}.card-tile.in-deck .picker-quantity span{color:#214d3a;font-weight:700}

.tag-manager{display:grid;gap:14px}.tag-manager section{padding:12px;border:1px solid var(--line);border-radius:12px}.tag-manager strong{overflow-wrap:anywhere}.tag-manager small{display:block;margin-top:4px}.tag-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.tag-actions button{padding:8px 12px}#tag-name{display:block;width:100%;margin-top:8px}

.box-card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-height:40vh;overflow:auto;padding:5px}.box-card{padding:4px;min-width:0;font-size:11px}.box-card .card-face{width:100%;margin-bottom:5px}.box-card[aria-pressed=true]{outline:3px solid #b4934e;background:#e3eadb}.box-card:disabled{opacity:1}.box-card span{overflow-wrap:anywhere}

.box-card-grid{grid-auto-rows:max-content;align-content:start;align-items:start}.box-card{display:flex;flex-direction:column;align-items:stretch;height:auto;overflow:hidden}.box-card .card-face{flex:none;aspect-ratio:323/466}.box-card>span:last-child{display:block;line-height:1.35;min-height:2.7em}

#reset-dice-total{pointer-events:auto;min-height:28px;padding:3px 8px;margin-top:4px;font-size:10px;background:#263a50;color:#f2dfb5;border:1px solid #b49a6555}
/* Stable deck actions and a hand overlay that does not resize the board. */
.deck-tile>.row{display:grid;grid-template-columns:minmax(0,1fr) 46px;gap:8px;align-items:center}.deck-tile>.row button{height:44px;min-height:44px;padding:8px 6px;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:5px}.deck-tile>.row .icon{width:18px;height:18px}.hand-area{position:absolute;left:50%;transform:translateX(-50%);bottom:var(--hand-bottom,100px);margin:0;max-width:calc(100% - 65px)}.table-screen:has(.hand-area) .view-tools{bottom:var(--hand-clearance,150px)}
.sliding-drawer{padding:12px;border:1px solid #c59a5c;border-radius:9px;background:linear-gradient(120deg,#ffffff16,transparent 35%,#0005),url('assets/drawer-walnut-grain-v1.png') center/360px 360px;box-shadow:inset 0 0 0 3px #281407,inset 0 0 0 5px #bb83484d,inset 0 7px 5px #f2c47f30,0 14px 24px #0008,0 2px 3px #000b}.sliding-drawer header{padding:0 2px 8px 4px;min-height:40px;color:#f0d7a0;text-shadow:0 1px 2px #000;font-size:11px;letter-spacing:.1em}.sliding-drawer header span{padding:6px 10px;background:linear-gradient(#c1a16e,#8d6d43);color:#25190e;border:1px solid #edc98c;border-radius:4px;box-shadow:0 2px 3px #0007,inset 0 1px #ffedbe80;text-shadow:0 1px #fff3;font-weight:700}.sliding-drawer header button{background:#23160ab3;border:1px solid #c9a26688;border-radius:8px;color:#efd7a4;min-height:36px;min-width:36px;padding:2px 8px}.drawer-surface{border:2px solid #231408;border-radius:5px;box-shadow:inset 0 8px 12px #0007,inset 0 0 3px 2px #0008,0 1px 0 #e3b66c88}.drawer-surface>p{color:#f1e6cb;text-shadow:0 1px 3px #000;font-size:12px;padding:0 12px}

.piece.pile{box-shadow:none}.pile-art{display:block;width:100%;border-radius:7px}.pile-art>.card-face{box-shadow:var(--pile-shadow);transition:box-shadow .18s ease}.empty-pile{border-radius:7px;background:#10271f30}

/* Disable browser double-tap zoom while retaining native pan and pinch zoom. */
html,body{touch-action:manipulation}

/* Full viewport card inspection; table rotation and zoom remain unchanged. */
dialog:has(.zoom-stage){width:calc(100vw - 16px);max-width:none;height:calc(100dvh - 16px);max-height:none;padding:12px;margin:auto;overflow:hidden}
dialog:has(.zoom-stage)[open]{display:flex;flex-direction:column}
dialog:has(.zoom-stage) .dialog-head{flex:0 0 auto;gap:8px;margin:0 0 8px;min-height:44px}
dialog:has(.zoom-stage) .dialog-head h2{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
dialog:has(.zoom-stage) .dialog-head button{flex-shrink:0;min-width:44px}
dialog:has(.zoom-stage) .dialog-body{display:flex;flex-direction:column;flex:1;min-height:0;gap:8px}
dialog:has(.zoom-stage) .zoom-stage{flex:1;min-height:0;margin:0;width:100%}
dialog:has(.zoom-stage) .zoom-controls{flex:0 0 auto;padding-bottom:env(safe-area-inset-bottom,0px)}

@media(max-width:700px){
 dialog:has(#dice-stage){width:calc(100vw - 16px);height:calc(100dvh - 16px);max-height:none;padding:12px;margin:auto;overflow:hidden}
 dialog:has(#dice-stage)[open]{display:flex;flex-direction:column}
 dialog:has(#dice-stage) .dialog-head{flex:none;min-height:44px;margin-bottom:8px}
 dialog:has(#dice-stage) .dialog-head h2{font-size:23px}
 dialog:has(#dice-stage) .dialog-body{display:flex;flex-direction:column;flex:1;min-height:0;gap:8px;overflow:auto}
 dialog:has(#dice-stage) .dice-stage{flex:1 0 180px;min-height:180px;height:auto}
 dialog:has(#dice-stage) .dialog-body>.row,dialog:has(#dice-stage) .dialog-body>button{flex-shrink:0}
 dialog:has(#dice-stage) select{min-height:40px;padding:8px}
 dialog:has(#dice-stage) #dice-pool{flex-shrink:0;max-height:48px;overflow:auto;margin:0;gap:6px}
 dialog:has(#dice-stage) #dice-pool:empty{display:none}
 dialog:has(#dice-stage) #dice-result{font-size:14px;min-height:20px;flex-shrink:0}
 dialog:has(#dice-stage) details{flex-shrink:0;max-height:90px;overflow:auto}
 dialog:has(#dice-stage) #roll-dice{position:sticky;bottom:0;z-index:2;min-height:44px}
}

/* Keep phone form controls readable without Safari focus magnification. */
@media(max-width:700px){dialog input,dialog select,dialog textarea{font-size:16px}}

@media(max-width:700px),(pointer:coarse){input:not(.deck-name),select,textarea{font-size:16px}}
/* Shaped pieces have a visible-size hit target, never a card-sized box. */
.piece.shaped-piece,.piece.shaped-piece.token-target,.hand-strip button.shaped-piece{width:calc(clamp(57px,8vw,95px) * var(--shape-size,.6))!important;height:auto!important;min-height:0!important;aspect-ratio:var(--shape-ratio,1);padding:0;border-radius:0;background:transparent;overflow:hidden}
.shaped-piece .mask-art,.hand-attachment.shaped-piece .mask-art{position:static;width:100%;height:100%;max-width:none;max-height:none;aspect-ratio:inherit;transform:none}
.shaped-piece .card-face,.shaped-piece .card-face img{background:transparent;aspect-ratio:inherit;border-radius:0;box-shadow:none}
.shaped-piece .card-face{height:100%}
@media(max-width:700px){.piece.shaped-piece,.piece.shaped-piece.token-target,.hand-strip button.shaped-piece{width:calc(clamp(56px,16vw,85px) * var(--shape-size,.6))!important}}

/* Saved percentages refer to one fixed tabletop, never to viewport proportions. */
.table-world{inset:auto;left:50%;top:50%;width:390px;height:600px;transform-origin:center}
.table-world>.piece:not(.token-target){width:62.4px}
.world-piece.shaped-piece.token-target{width:calc(62.4px * var(--shape-size,.6))!important}

/* Five compact, evenly spaced table actions. */
.table-dock{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));width:min(408px,calc(100% - 24px));gap:0;padding:4px;box-sizing:border-box}
.table-dock button{min-width:0;min-height:52px;padding:6px 2px;gap:2px;font-size:10px}
.table-dock .icon{width:22px;height:22px}

.sliding-drawer header .drawer-name{min-width:0;min-height:44px;max-width:calc(100% - 44px);padding:0;background:none;border:0;font:inherit;letter-spacing:inherit;text-align:left}
.sliding-drawer .drawer-name span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.menu-group-title{grid-column:1/-1;margin:8px 0 0;padding-top:8px;border-top:1px solid var(--line);font:600 12px Sans;letter-spacing:.04em;color:var(--muted)}.menu-group-title:first-child{margin-top:0;padding-top:0;border-top:0}

/* Three independent rows; opposing handles stay exposed for switching sides. */
.sliding-drawer{width:calc(100% - 60px);height:29%;min-height:0;padding:7px 10px;box-sizing:border-box}
.sliding-drawer header{min-height:36px;padding:0 0 3px;flex-shrink:0}
.sliding-drawer header .drawer-name{min-height:36px}
.sliding-drawer .drawer-surface{min-height:0}
.sliding-drawer .drawer-surface>p{top:25%;margin:0}
.drawer-tab{z-index:65}
.sliding-drawer.left{left:30px}.sliding-drawer.right{right:30px}
@media(min-width:701px){.sliding-drawer{width:calc(100% - 80px)}.sliding-drawer.left{left:36px}.sliding-drawer.right{right:36px}}

.dialog-head .card-name-edit{font:inherit;color:inherit;text-align:left;background:transparent;padding:0;min-height:44px;white-space:normal;overflow-wrap:anywhere}.dialog-head .card-name-edit:hover{text-decoration:underline;text-underline-offset:4px}.dialog-head h2{min-width:0}

/* Float controls over the felt instead of reserving a wooden header band. */
.sliding-drawer{padding-top:7px}
.sliding-drawer header{position:absolute;top:11px;left:14px;right:14px;z-index:10;min-height:36px;padding:0;pointer-events:none}
.sliding-drawer header button{pointer-events:auto}
.sliding-drawer .drawer-surface{flex:1}

/* Pointer focus is not selection; keep explicit selection and keyboard cues. */
[data-object].pointer-focus:not(.selected){outline:none}

/* Drawer labels sit quietly beneath pieces; editing stays beside Close. */
.sliding-drawer header{left:auto;justify-content:flex-end;gap:5px}
.sliding-drawer header button{display:grid;place-items:center;min-width:36px;min-height:36px}
.drawer-watermark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:75%;text-align:center;color:#fff;opacity:.18;font-family:Book,Georgia,serif;font-size:clamp(22px,4vw,48px);line-height:1.1;overflow-wrap:anywhere;pointer-events:none;user-select:none;max-height:90%;overflow:hidden}
.drawer-surface>p{display:none}

.card-add{-webkit-touch-callout:none;user-select:none;touch-action:pan-y}.card-add img{-webkit-user-drag:none;user-select:none}

/* iOS must not turn a card hold into text selection or an image callout. */
.card-add,.card-add *,.zoom-stage,.zoom-stage *,.card-name-edit{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.zoom-stage img{-webkit-user-drag:none}

.backup-reminder{margin:18px 0;padding:14px 16px;border:1px solid var(--line);border-radius:12px}.backup-reminder p{margin:0 0 6px;font-size:13px}.backup-reminder .row{margin-top:8px}#troubleshooting-details{width:100%;min-height:180px;font-size:16px}
/* The handbook has its own readable paper palette in every theme. */
dialog.player-guide{position:fixed;inset:0;width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#faf8f1!important;color:#283930;color-scheme:light;overflow:auto;display:block}
.player-guide .dialog-head{position:sticky;top:0;z-index:5;display:flex;gap:16px;align-items:center;margin:0;padding:10px 22px;background:#faf8f1f5;border-bottom:1px solid #d7d0bd}
.player-guide .dialog-head h2{font-size:19px;color:#283930!important;flex:1;margin:0}.player-guide .dialog-head button{order:3;color:#283930;background:transparent}.player-guide .dialog-body{display:block;padding:0;overflow:visible;max-height:none}.player-guide a{color:#285c68;text-underline-offset:3px}.player-guide .guide-contents-link{font-size:14px}
.guide-cover{text-align:center;padding:45px 20px 65px;background:linear-gradient(to bottom,#08142920 10%,#faf8f1 100%),url('assets/cardwarden-natural-sky-v1.png') center 30%/cover;color:#20352e}.guide-cover img{width:min(80%,420px);height:auto;filter:drop-shadow(0 3px 8px #000)}.guide-cover p{font-family:Book,Georgia,serif;font-size:30px;margin:25px 0 8px}.guide-cover span{font-size:15px}
.guide-layout{display:grid;grid-template-columns:240px minmax(0,760px);gap:48px;max-width:1120px;margin:auto;padding:12px 28px 70px}.player-guide #guide-contents{position:sticky;top:85px;align-self:start;max-height:calc(100dvh - 105px);overflow:auto;scroll-margin-top:80px}.player-guide #guide-contents h2{color:#283930!important;font-size:22px}.player-guide #guide-contents a{display:block;padding:9px 0;font-size:14px;text-decoration:none;border-bottom:1px solid #e4dfd2}.guide-reading{min-width:0;font-size:17px;line-height:1.7}.guide-reading section{scroll-margin-top:85px;margin-bottom:60px}.player-guide .guide-reading h2,.player-guide .guide-reading h3{color:#283930!important}.guide-reading h3{margin-top:25px;font-size:23px}.guide-reading li{padding-left:5px;margin:8px 0}.guide-section-title{position:relative;isolation:isolate;padding:22px 20px;border-radius:10px;overflow:hidden;background:#eee9db}.guide-section-title:before{content:'';position:absolute;inset:0;z-index:-1;background:var(--guide-art) center/cover;opacity:.12}.guide-section-title h2{margin:4px 0;font-size:30px}.player-guide .guide-section-title small{color:#526350}.warden-tip{border-left:3px solid #b69b60;background:#eee9dc;padding:16px 20px;margin:24px 0}.warden-tip strong{font-family:Book,Georgia,serif;font-size:19px}.warden-tip p{margin:6px 0}.guide-diagram{margin:24px 0;padding:15px;background:#eeeadd;border-radius:10px}.guide-diagram svg{width:100%;height:auto}.guide-diagram figcaption{font-size:14px;color:#566053}.guide-back{font-size:14px}
@media(max-width:700px){.guide-layout{display:block;padding:0 22px 45px}.player-guide #guide-contents{position:static;max-height:none;margin-bottom:40px}.guide-reading{font-size:16px}.guide-section-title h2{font-size:26px}.player-guide .dialog-head{gap:9px;padding:8px 12px}.player-guide .dialog-head h2{font-size:16px}.guide-cover{padding-top:30px}.guide-cover p{font-size:26px}.guide-reading section{scroll-margin-top:75px}}

.table-dot-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,#ffffff35 1px,transparent 1px),linear-gradient(to bottom,#ffffff35 1px,transparent 1px)}.table-dot-grid[hidden]{display:none}

.piece.deck-held,.piece.drag-ghost.deck-held{opacity:.72}

@media(min-width:701px){.sliding-drawer{width:calc((100% - 80px)/2)}.drawer-watermark{font-size:clamp(20px,2.3vw,38px)}}

.deck-delete-area{margin-top:22px;padding-top:16px;border-top:1px solid var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:8px}.deck-delete-area button{font-size:12px}.deck-delete-area small{font-size:11px}

.builder-deck-actions{display:flex;gap:8px;flex-shrink:0}.builder-deck-actions button{font-size:12px;white-space:nowrap}.builder-heading{flex-wrap:wrap}.builder-heading>.grow{min-width:180px}@media(max-width:700px){.builder-heading>.grow{flex-basis:100%}.builder-deck-actions{flex:1}.builder-deck-actions button{padding:10px 12px}}

/* Shade the lining only; cards and controls retain their brightness. */
.drawer-surface::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.14);pointer-events:none;border-radius:inherit}

.table-dock .hand-dock-label{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}

/* Compact framing controls, with scroll gestures contained inside the editor. */
dialog:has(#crop-preview){max-height:calc(100dvh - 20px);padding:16px;overflow-y:auto;overscroll-behavior:contain}
dialog:has(#crop-preview) .dialog-head{margin-bottom:10px}
dialog:has(#crop-preview) .dialog-head h2{font-size:23px;margin:0}
dialog:has(#crop-preview) .dialog-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
dialog #crop-preview{grid-column:1/-1;width:auto!important;height:min(27dvh,220px);max-width:100%;aspect-ratio:646/932}
dialog:has(#crop-preview) label{margin:0;font-size:12px;min-width:0}
dialog:has(#crop-preview) select{padding:8px;min-height:42px;margin-top:4px}
dialog:has(#crop-preview) input[type=range]{margin:4px 0;min-height:32px;padding:0;width:100%}
dialog:has(#crop-preview) .dialog-body>.row,dialog:has(#crop-preview) .notice{grid-column:1/-1}
dialog:has(#crop-preview) .notice{margin:2px 0;font-size:11px;line-height:1.4}

.hand-area{box-sizing:border-box;min-width:0;width:max-content;max-width:calc(100% - 40px)}
.hand-strip{min-width:0;max-width:min(650px,calc(100vw - 72px));box-sizing:border-box;overflow-x:auto;overflow-y:hidden;touch-action:pan-x;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.hand-strip button,.hand-strip .hand-card{touch-action:pan-x;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}

/* Join each tray directly to its 18px visible opener rail. */
.sliding-drawer.left{left:17px}
.sliding-drawer.right{right:17px}
.sliding-drawer{width:calc(100% - 34px)}
@media(min-width:701px){.sliding-drawer{width:calc((100% - 42px)/2)}}

/* On phones leave a clear gap before the opposite drawer opener. */
@media(max-width:700px){.sliding-drawer{width:calc(100% - 60px)}}

.sliding-drawer{transition:transform .42s cubic-bezier(.2,.75,.2,1)}

dialog:has(.mike-message){width:min(680px,calc(100vw - 24px));overscroll-behavior:contain}
.mike-message{font-size:16px;line-height:1.7;overflow-wrap:break-word}
.mike-message p{margin:0 0 1.1em}
.mike-message a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.mike-message .mike-signature{margin-top:1.5em;margin-bottom:0}

.support-cardwarden{line-height:1.6}
.support-cardwarden h3{font-family:Book,serif;font-size:25px;margin:0 0 12px}
.support-cardwarden .support-link{display:block;text-align:center;padding:13px 18px;border-radius:12px;text-decoration:none;margin:18px 0 7px;font-weight:700}
.support-cardwarden>small{display:block;text-align:center;font-size:12px}
.support-cardwarden .notice{margin-top:20px}

.support-cardwarden .support-thanks{text-align:center}

dialog.support-screen{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border:0;border-radius:0;padding:0;background:#090f20;color:#ece9df}dialog.support-screen .dialog-head{position:sticky;top:0;z-index:2;background:#101c31;padding:12px 20px}dialog.support-screen .dialog-body{padding:0}

.current-box{padding:20px;margin:24px 0;border:1px solid #7285a055;border-radius:18px;background:#ffffff06}.current-box-header{display:flex;align-items:center;gap:18px}.box-contents{min-width:0;margin-top:24px;padding-top:8px;border-top:1px solid #7285a055}.box-contents>.notice:last-child{margin-bottom:0}.box-image-button{width:80px;height:80px;flex-shrink:0;padding:8px}.box-image-button img,.box-thumb{width:100%;height:100%;object-fit:contain;border-radius:8px}.box-thumb{width:40px;height:40px;vertical-align:middle;margin-right:12px}.box-identity{flex:1;min-width:0}.box-identity h2{margin:5px 0;overflow-wrap:anywhere}.box-identity p{font-size:13px;margin:0;opacity:.75}.box-controls{display:flex;gap:8px;flex-wrap:wrap}@media(max-width:700px){.current-box{padding:16px}.current-box-header{flex-wrap:wrap;gap:12px}.box-contents{margin-top:20px}.box-contents .section-head{flex-wrap:wrap;gap:12px}.box-controls{width:100%}.box-image-button{width:64px;height:64px}}

.import-destination{display:grid;gap:8px;padding:16px;border:1px solid #be9d6180;border-radius:12px;background:#be9d6112;margin-bottom:18px}.import-destination>span{font-size:17px;font-weight:700}.import-destination select{width:100%;min-width:0;font-size:21px;font-weight:700}.import-destination small{font-size:12px;line-height:1.5}

.copyright{text-align:center;font-size:12px;color:var(--muted);margin:24px 0 8px;line-height:1.5}

.box-name-edit{font:inherit;color:inherit;text-align:left;background:transparent;padding:0;min-height:44px;max-width:100%;overflow-wrap:anywhere}.box-name-edit:hover{background:transparent;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}

.legacy-site-link{display:block;padding:12px 16px;border-radius:12px;font-weight:700;color:inherit;text-decoration:none;background:#7285a022}.legacy-site-link:hover{background:#7285a038}

/* Outline follows the token silhouette; keep the outer wrapper unclipped for its shadow. */
.shaped-piece{clip-path:none;filter:drop-shadow(.65px 0 0 #000b) drop-shadow(-.65px 0 0 #000b) drop-shadow(0 .65px 0 #000b) drop-shadow(0 -.65px 0 #000b)}
.piece.shaped-piece,.piece.shaped-piece.token-target,.hand-strip button.shaped-piece{overflow:visible}
.shaped-piece>.mask-art,.shaped-piece>.card-face{clip-path:var(--shape-clip)}

/* Legacy masked images have no explicit shape metadata. Outline their alpha silhouette too. */
.token-target:not(.shaped-piece) .mask-art{filter:drop-shadow(.65px 0 0 #000b) drop-shadow(-.65px 0 0 #000b) drop-shadow(0 .65px 0 #000b) drop-shadow(0 -.65px 0 #000b)}

.box-controls{flex-wrap:nowrap;flex-shrink:0}.box-controls button{padding:10px 12px;white-space:nowrap}@media(max-width:700px){.box-controls{gap:6px}.box-controls button{flex:1;padding:10px 6px;font-size:13px}}

.compact-box-header{display:flex;align-items:center;gap:14px}.compact-box-header>.box-image-button{display:grid;place-items:center}.compact-box-open,.box-collapse{display:block;margin:14px auto 0}.compact-box .box-identity h2{color:var(--theme-accent,var(--gold));font-weight:700}.compact-box-header>.danger{margin-left:auto;flex-shrink:0}

.dice-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.2fr);gap:10px}.dice-controls label{min-width:0}.dice-controls select{width:100%;min-width:0;min-height:44px;padding-left:8px;padding-right:6px}
.dice-reaction{border-radius:5px;padding:2px 4px}.dice-reaction.good{background:#d5b676;color:#172218}.dice-reaction.bad{background:#55333a;color:#fff0ed}

.dice-stage #dice-result{position:absolute;left:50%;top:12px;transform:translateX(-50%);z-index:2;width:max-content;max-width:calc(100% - 28px);box-sizing:border-box;padding:10px 14px;border-radius:10px;background:#0b1825df;color:#fff3d2;text-align:center;pointer-events:none;line-height:1.5;overflow-wrap:anywhere}#roll-dice{display:flex;align-items:center;justify-content:center;text-align:center}
.dice-roll-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex-shrink:0}.dice-roll-actions button{display:flex;justify-content:center;align-items:center;text-align:center;min-height:44px}.dice-roll-actions #roll-dice{position:static}
.dice-stage #dice-result:empty{display:none}

.dialog-head .card-title-rename{font:inherit;color:inherit;background:transparent;border:0;padding:0;text-align:left;white-space:normal;overflow-wrap:anywhere;cursor:pointer}.dialog-head .card-title-rename:hover{text-decoration:underline;text-underline-offset:5px}.dialog-head .card-title-rename:focus-visible{outline:2px solid #dfbf78;outline-offset:4px}

.about-statement{border:1px solid #8294ae55;border-radius:10px;padding:12px 14px}.about-statement summary{cursor:pointer;font-weight:700;min-height:24px}.about-statement p{line-height:1.65;overflow-wrap:anywhere}.about-statement a{color:inherit;text-decoration:underline}

.library-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:16px;margin:16px 0}.library-card-preview{display:flex;flex-direction:column;align-items:center;gap:8px;background:transparent;padding:8px;min-width:0;max-width:170px}.library-card-preview .card-face{display:block;width:100%;max-width:120px}.library-card-preview>span:last-child{font-size:13px;overflow-wrap:anywhere;text-align:center}

.library-new-box{display:flex;justify-content:center;margin:24px 0}.library-new-box button{text-align:center;min-height:44px}

#card-tag-choices button[aria-pressed="true"]{background:#dbc080;color:#142034;border:1px solid #f6dda2;box-shadow:0 0 0 1px #f6dda255}

/* Token hover starts neutral; the precise hit test opts into the hand cursor. */
.piece.token-target,.piece.token-target:hover,.hand-strip button.shaped-piece,.hand-strip button.shaped-piece:hover{cursor:default}

.current-box{margin-bottom:30px}.current-box.selected-box{border:2px solid #c8a969;background:linear-gradient(135deg,#8caee51c,#d8bd7810),#152239;box-shadow:inset 0 1px 0 #fff2}.standard-deck-import{display:flex;align-items:center;gap:14px;text-align:left;border:1px solid #c8a969;background:linear-gradient(120deg,#30496a,#20314b);padding:12px 16px}.standard-deck-import img{flex:0 0 100px;object-fit:contain}.standard-deck-import span{min-width:0}.standard-deck-import small{display:block;margin-top:6px;font-size:12px;font-weight:400;line-height:1.4;color:#d7e1ef}@media(max-width:400px){.standard-deck-import{gap:8px;padding:10px}.standard-deck-import img{width:76px;height:57px;flex-basis:76px}}

.card-with-back{position:relative;display:block;width:100%;padding:0 10px 12px 0;box-sizing:border-box}
.card-back-peek{position:absolute;right:0;bottom:0;width:40%;display:block;z-index:1;filter:drop-shadow(0 2px 3px #0008)}
.card-back-peek .card-face{width:100%;outline:none}
.library-card-preview .card-with-back{max-width:130px}
.library-card-preview .card-with-back>.card-face{width:100%}
.preview-card:has(.card-with-back){width:170px}

.deck-tile[data-action="select-library-deck"]{cursor:pointer}.deck-tile.selected-deck{border-color:#d8bd78;background:linear-gradient(135deg,#d8bd781c,#8caee516),#1b2b43;box-shadow:inset 0 0 0 1px #d8bd78}.deck-tile[data-action="select-library-deck"]:focus-visible{outline:2px solid #f1d99d;outline-offset:3px}

.library-card-preview{-webkit-touch-callout:none;user-select:none;touch-action:pan-y}

.back-choice-list{border:0;padding:0;margin:0;max-height:250px;overflow:auto;min-width:0}.back-choice-list legend{font-size:13px;padding:0 0 8px}.dialog-body .back-choice{display:flex;align-items:center;gap:12px;padding:9px 12px;margin:5px 2px;border:1px solid #53647a;border-radius:10px;cursor:pointer;background:#17263b}.back-choice:has(input:checked){border-color:#d8bd78;background:#354258}.dialog-body .back-choice input{width:18px;flex-shrink:0;accent-color:#d8bd78}.back-choice .card-face{width:38px}.back-choice>span:last-child{overflow-wrap:anywhere;min-width:0}

/* Keep box controls in place while reducing space before the decks. */
.current-box:not(.compact-box){padding-top:16px}.current-box>.box-collapse{margin-top:6px}.current-box>.box-contents{margin-top:12px;padding-top:0}.box-contents>.section-head:first-child{margin-top:12px}

/* Clip the blue outer edge independently of the inset gold artwork. */
.card-face.card-back{border-radius:6% / 4.16%;overflow:hidden;clip-path:inset(0 round 6% / 4.16%);isolation:isolate}

.library-back-preview small{display:block;font-size:11px;color:var(--muted);margin-top:4px}

.table-motion{position:fixed;z-index:9999;pointer-events:none;transform-origin:top left;perspective:850px}.motion-rotor{width:100%;height:100%;position:relative;transform-style:preserve-3d}.motion-side{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:7px}.motion-side.motion-reverse{transform:rotateY(180deg)}.motion-side>.card-face,.motion-side>.mask-art,.motion-side>.token-disc{width:100%;height:100%;margin:0}

body>.drag-status{position:fixed;z-index:10001;top:0;left:0;box-shadow:0 2px 6px #0005}

/* Keep stack edges outside the clipped face/back artwork. */
.pile-art{box-shadow:var(--pile-shadow);transition:box-shadow .18s ease}.pile-art>.card-face{box-shadow:none}

/* Transparent backing prevents pale seams at fractional table scales.
   Keep image sizing/crops identical in menus, hands and on the table. */
.card-face,.card-face.full img{background:transparent}

/* Cards can extend behind the header: only actual controls intercept touches. */
.table-top{pointer-events:none}
.table-top button,.table-top input,.table-top .table-zoom-slider{pointer-events:auto}

.magnifier-zoom-choice{grid-template-columns:repeat(3,minmax(0,1fr))}