/* How a card looks. Loaded by both the editor and the print page, so this file must only describe the card itself:
   anything interactive (selection, hover, drop targets, badges) belongs in editor.css. */
.card{position:relative;flex:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.slot{position:absolute;overflow:hidden;background:#DADDE1;--flt:none}
.slot.filled{background:#8F97A2}
.slot img{filter:var(--flt)}
.ph{position:absolute}
.ph img{position:absolute;left:50%;top:50%;max-width:none;pointer-events:none;user-select:none;-webkit-user-select:none}
.shade{position:absolute;inset:0;pointer-events:none}
.card-text{position:absolute;box-sizing:border-box;transform:translate(-50%,-50%);white-space:pre;line-height:1.15;padding:.04em .18em;margin:0}
.card-text.wrap{white-space:pre-wrap;text-align:center;text-wrap:balance;overflow-wrap:break-word}
/* an output (a print size, or the frame's 1600 × 1000): the design centred, its background carried out to the edges */
.card-out{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;flex:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}