:root{color-scheme:dark;--text:#f2f4f7;--muted:#a7afbd;--border:#303640;--accent:#9dc5ff}
*{box-sizing:border-box}body{margin:0;min-height:100vh;padding:32px 24px;background:radial-gradient(ellipse at top,#232633,#101216 65%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}.shell{max-width:1000px;margin:auto}header{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:0 0 24px}.brand{font-size:.73rem;letter-spacing:.14em;font-weight:700;margin:0 0 10px}.brand span{color:var(--muted);font-weight:400;letter-spacing:.08em}h1{margin:0;font-size:clamp(1.65rem,4vw,2.4rem);font-weight:600;letter-spacing:-.04em}button,.back{font:inherit;min-height:44px;border-radius:999px;padding:10px 18px;border:1px solid var(--border);color:var(--text);background:#20242c;cursor:pointer;text-decoration:none}button:hover{background:#303744}.back{display:inline-flex;align-items:center;justify-content:center;background:var(--accent);border-color:var(--accent);color:#101b2c;font-weight:700;white-space:nowrap}.back:hover{background:#c0dbff}button:focus-visible,a:focus-visible,.stage:focus-visible{outline:3px solid var(--accent);outline-offset:4px}.card{border:1px solid var(--border);border-radius:20px;padding:16px;background:#16191ee6;box-shadow:0 20px 60px #0004}.toolbar,.footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.toolbar{margin-bottom:14px}.modes{display:flex;gap:6px}button[aria-pressed=true]{border-color:#80b5ff;background:#294264;color:#fff}.stage{position:relative;aspect-ratio:1;max-height:72svh;min-height:240px;margin:auto;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#101216;touch-action:pan-y pinch-zoom;user-select:none;cursor:grab}.stage.dragging{cursor:grabbing}.stage img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.stage img:not([src]){visibility:hidden}.view-label{position:absolute;left:14px;bottom:14px;font-size:.8rem;padding:6px 10px;border-radius:20px;background:#101216c9;color:#cbd3de;pointer-events:none}.footer{margin-top:12px}.footer p{font-size:.82rem;color:var(--muted);margin:0}.arrows{display:flex;gap:6px}.arrows button{padding:8px 16px}.feedback{color:var(--muted);font-size:.85rem;display:flex;align-items:center;gap:12px}.feedback:has(#status:empty){display:none}[hidden]{display:none!important}@media(max-width:600px){body{padding:20px 12px}header{align-items:stretch;flex-direction:column;gap:18px;margin-bottom:18px}.back{width:100%}.card{padding:10px;border-radius:16px}.toolbar{gap:6px}.toolbar button{padding:10px 13px;font-size:.85rem}.stage{max-height:none;min-height:0;width:100%}.footer p span{display:none}.brand{font-size:.68rem}}

/* ABC Favorit is used when installed. Add a licensed web font here to
   make the exact typeface available to every visitor. */
@font-face {
  font-family: 'Lair Favorit';
  src: local('ABC Favorit'), local('ABCFavorit-Regular'), local('Favorit');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
body { font-family: 'Lair Favorit', 'Helvetica Neue', Arial, sans-serif; }
.shop-heading { display: flex; align-items: center; gap: 14px; min-width: 0; }
.shop-logo { display: block; width: 56px; height: 56px; flex: 0 0 56px; border-radius: 10px; object-fit: contain; }
.brand { font-size: .95rem; letter-spacing: 0; font-weight: 400; margin-bottom: 7px; }
.brand span { font-size: .7rem; letter-spacing: .03em; white-space: nowrap; }
h1 { font-weight: 400; letter-spacing: -.025em; }
@media (max-width: 600px) {
  .shop-heading { gap: 12px; }
  .shop-logo { width: 48px; height: 48px; flex-basis: 48px; }
  .brand { font-size: .9rem; }
  .brand span { display: block; margin-top: 4px; font-size: .65rem; }
}