/* Cart and account controls inherit the current appearance palette. */
#myAccountButton{width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;flex:none;border-radius:50%;color:var(--ink)}
#myAccountButton svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
#myAccountButton:hover{background:var(--paper-2)}#myAccountButton:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}
#drawer{width:min(760px,96vw);max-width:100vw}.d-head .cart-title{margin:0;font-size:30px;letter-spacing:-.04em;flex:1}
.cart-title span{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:50%;min-width:34px;height:34px;font-size:16px;vertical-align:middle;margin-left:10px}
#drawer .d-body{padding:24px 30px}.cart-font{padding:0;margin:0 0 18px;overflow:hidden;border-radius:16px}.cart-font-select{padding:22px;text-align:left;min-height:110px}.cart-font-heading{display:flex;align-items:center;gap:12px}.cart-font-heading>.cart-font-name{flex:1;font-size:22px}.cart-font-heading>svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;flex:none}.cart-font-select[aria-expanded=true] .cart-font-heading>svg{transform:rotate(180deg)}
.cart-card-price{font-size:13px;white-space:nowrap}.cart-license-summary{display:block;color:var(--muted);font-size:12px;line-height:1.6;margin-top:8px}.cart-font-body{border-top:1px solid var(--line);padding:0 22px 22px}.cart-font-body[hidden]{display:none!important}.cart-font-proof{height:100px}.cart-font-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}.cart-font-actions .btn{display:inline-flex;gap:7px;align-items:center;justify-content:flex-start;flex:0 1 auto;padding:10px 12px;font-size:12px}.cart-font-actions svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex:none}.cart-style-options .f-group{margin-bottom:24px}.cart-style-options #tryPanel{display:none}.cart-style-options #variableAxisOpts{grid-template-columns:1fr 1fr}.cart-checkout{width:100%;margin-top:12px}.cart-card-status{font-size:13px;color:var(--muted)}.cart-saved-link{display:inline-block;color:var(--ink);font-size:14px;padding:12px 0}.cart-remove-dialog{max-width:min(520px,92vw);border:1px solid var(--line);border-radius:20px;padding:28px;background:var(--paper);color:var(--ink);margin:auto}.cart-remove-dialog::backdrop{background:#0008}.cart-remove-dialog h2{font-size:24px;line-height:1.2}.cart-remove-dialog p{font-size:14px;line-height:1.6;margin:18px 0}.cart-remove-dialog a{display:inline-block;color:var(--ink);margin-top:18px}.cart-remove-dialog .btnrow{flex-wrap:wrap;gap:10px}
#variableAxisOpts .variable-axis-choice{border:0;padding:10px 0;gap:10px;align-items:center}.variable-axis-choice input[type=checkbox]{appearance:none;-webkit-appearance:none;width:42px;height:25px;flex:none;border:1px solid var(--muted);border-radius:20px;background:var(--paper-2);position:relative;cursor:pointer;margin:0}.variable-axis-choice input:before{content:'';position:absolute;width:17px;height:17px;border-radius:50%;left:3px;top:3px;background:var(--muted);transition:transform .15s}.variable-axis-choice input:checked{background:var(--ink);border-color:var(--ink)}.variable-axis-choice input:checked:before{transform:translateX(17px);background:var(--paper)}.variable-axis-choice input:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}
#fixedPreview{appearance:none;-webkit-appearance:none;width:22px;height:22px;flex:none;margin:0;border:1.5px solid var(--accent,var(--cobalt));border-radius:50%;background:color-mix(in srgb,var(--ink) 22%,var(--paper));display:grid;place-items:center;cursor:pointer}#fixedPreview:checked{background:var(--ink)}#fixedPreview:checked:after{content:'';width:9px;height:5px;border:solid var(--paper);border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg)}#fixedPreview:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}
@media(max-width:650px){#drawer{width:100vw}#drawer .d-body{padding:16px}.cart-font-select{padding:18px}.cart-font-heading{flex-wrap:wrap}.cart-font-heading>.cart-font-name{font-size:19px;flex-basis:70%}.cart-card-price{order:3;flex-basis:100%;white-space:normal}.cart-font-body{padding:0 16px 18px}.cart-style-options #variableAxisOpts{grid-template-columns:1fr}.cart-font-actions .btn{flex:1 1 42%}#myAccountButton{width:34px;height:34px}}

/* Closed cards keep a true specimen beside their name and licence. */
#drawer .cart-font-select{display:flex;align-items:center;gap:20px}
.cart-font-details{display:block;flex:1;min-width:0}
.cart-font-thumb{display:flex;align-items:center;justify-content:center;width:88px;height:64px;flex:none}
.cart-font-thumb svg{display:block;width:100%;height:auto;max-height:64px;overflow:visible}
.cart-font-thumb .g{fill:currentColor}
.cart-font-select[aria-expanded=true] .cart-font-thumb{display:none}
#drawer .cart-title span{background:var(--ink);color:var(--paper);border-color:var(--ink);padding:0 8px}
/* Minimal shares the builder's pill controls and accent/on-accent palette. */
html[data-ui-layout=minimal] #drawer .opt,
html[data-ui-layout=minimal] #drawer .btn,
html[data-ui-layout=minimal] .cart-remove-dialog .btn,
html[data-ui-layout=minimal] #nameModal .btn{border-radius:999px}
html[data-ui-layout=minimal] #drawer .opt{padding:10px 18px;background:var(--m-track);border-color:transparent;color:var(--m-accent)}
html[data-ui-layout=minimal] #drawer .opt.on,
html[data-ui-layout=minimal] #drawer .btn.primary,
html[data-ui-layout=minimal] #drawer .cart-title span{background:var(--m-accent);color:var(--m-on-accent);border-color:var(--m-accent)}
html[data-ui-layout=minimal] #drawer .stepper{border-radius:999px;background:var(--m-track);border-color:transparent}
html[data-ui-layout=minimal] #drawer .cart-checkout{padding:14px 22px}
@media(max-width:650px){#drawer .cart-font-select{gap:12px}.cart-font-thumb{width:54px;height:48px}.cart-font-thumb svg{max-height:48px}.cart-font-name{overflow-wrap:anywhere}}
