/* A single visual grammar for all 59 cards. */
.symbol{width:1.35em;height:1.35em;object-fit:contain;vertical-align:middle;display:inline-block;flex-shrink:0}.card{border:1px solid #896638;border-radius:5%;background:#fff4d9;padding:1px;box-shadow:0 0 0 1px #cbb174 inset,1px 2px 2px #37281855}.illustrated-card{height:100%;width:100%;display:flex;flex-direction:column;overflow:hidden;background:#fff2d4;border-radius:4%;color:#23190e}.frieze{height:19%;flex-shrink:0;background:url('art/symbols/ribbon.png') center/100% 100% no-repeat;display:flex;justify-content:center;align-items:center;text-align:center;position:relative;z-index:1;padding:4% 9% 2%;font:bold 1.9cqw/1.02 Georgia,serif}.portrait-zone{height:37%;flex-shrink:0;position:relative;overflow:hidden}.illustration{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block}.cost-rail{position:absolute;left:2%;top:2%;display:flex;flex-direction:column;gap:1px;max-width:73%;align-items:flex-start}.cost-badge{display:flex;align-items:center;gap:1px;background:#fff5dceF;color:#271d0f;border:1px solid #a78748;border-radius:14%;padding:0 1px;font:bold 2.7cqw/1 Georgia,serif;box-shadow:0 1px 1px #0005}.cost-badge .symbol{width:2.8cqw;height:2.8cqw}.card-effects{flex:1;min-height:0;display:flex;flex-direction:column;border-top:1px solid #927c51}.effect-zone{display:flex;gap:2%;align-items:flex-start;padding:2% 2%;min-height:0;flex:1}.effect-zone+.effect-zone{border-top:1px solid #b89c65}.effect-marker{width:2.1cqw;height:2.1cqw;flex-shrink:0;margin-top:1px}.effect-copy{min-width:0;font:600 1.65cqw/1.13 Georgia,serif;text-align:left;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3}.effect-copy>span{display:inline}.effect-copy>span+span:before{content:' · '}.effect-copy .symbol{width:1.9cqw;height:1.9cqw}.permanent{background:#eee5c9}.card:has(.effect-copy>span:nth-child(3)) .portrait-zone{height:32%}.card:has(.effect-copy>span:nth-child(3)) .effect-copy{-webkit-line-clamp:4}.card.unavailable{filter:none;opacity:.78}.card.drop-target{outline:3px solid #356a2f}.claim-tokens{top:31%}.worker[aria-disabled=true]{cursor:help}.worker.used{cursor:default}.zoom-card{padding:8px 0 0}.zoom-card .illustrated-card{border:2px solid #977642;border-radius:10px;height:auto;padding:4px;background:#fff2d4}.zoom-card .frieze{height:auto;min-height:66px;padding:12px 30px 10px}.zoom-card h2{padding:0;margin:0;border:0;background:none;font:bold 24px/1.12 Georgia,serif}.zoom-card .portrait-zone{height:185px}.zoom-card img.illustration{width:100%;height:100%;object-fit:cover;object-position:center 12%;border-radius:0}.zoom-card .cost-rail{left:7px;top:7px;max-width:50%;gap:5px}.zoom-card .cost-badge{font:bold 23px/1 Georgia,serif;padding:3px 6px;border-radius:6px}.zoom-card img.symbol{width:25px;height:25px;object-fit:contain;display:inline-block;border-radius:0;vertical-align:middle}.zoom-card .card-effects{flex:none}.zoom-card .effect-zone{padding:10px 8px;gap:8px;flex:none}.zoom-card .effect-marker{width:28px;height:28px;flex-shrink:0}.zoom-card .effect-copy{font:16px/1.42 Georgia,serif;display:block;overflow:visible}.zoom-card .effect-copy>span{display:block}.zoom-card .effect-copy>span+span:before{content:none}.card-family{font:12px/1.2 system-ui,sans-serif;text-align:center;padding:8px;color:#69512f;border-top:1px solid #b99f6c}.symbol-legend{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}.symbol-legend>span{display:flex;align-items:center;gap:10px}.symbol-legend .symbol{width:30px;height:30px}.turn-guidance .primary{width:100%;margin:10px 0}.turn-guidance p{font-size:16px;line-height:1.5}.decision:has([data-decision]){background:#1b5369;color:white;border-radius:4px}.decision:has([data-decision]) button{font-weight:700;border:2px solid #fff}.portrait-zone .cost-badge:has(.symbol:nth-child(3)){font-size:2cqw}.zoom-card .portrait-zone .cost-badge:has(.symbol:nth-child(3)){font-size:19px}

.card .cost-rail:has(.cost-badge:nth-child(4)){display:grid;grid-template-columns:1fr 1fr;max-width:96%}

/* Fixed PNG faces: one composition on every screen. */
.card:has(>.card-png){padding:0;border:0;background:transparent;box-shadow:none;overflow:visible;border-radius:5.45% / 3.53%;aspect-ratio:44 / 68}
.card-png{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(1px 2px 2px #37281855)}
.zoom-card>.card-png{display:block;width:100%;height:auto;max-height:none;object-fit:contain;border-radius:0}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
