/* The original wood artwork has a clean horizontal rail between x=325
   and x=699. Keep all four leafy corners at the same scale as that rail. */
body[data-sleeves=on][data-theme=wood] .matrix-cell > .theme-sleeve124 {
  border-image-slice: 475 325 565;
  border-image-width: 2.375 1.625 2.825;
  border-image-repeat: round;
}

.v8-viewer[data-layout=wide] .neighbor-cell {
  pointer-events:auto;
  cursor:pointer;
  filter:brightness(.68);
}
.v8-viewer[data-layout=wide] .neighbor-cell > * { pointer-events:none; }
/* Keep the matrix artwork a little quieter behind the card sleeves. */
body[data-theme]:not([data-theme=bernstein]) .v8-viewer { --matrix-scene-brightness:70%; }
body[data-theme]:not([data-theme=bernstein]) .v8-viewer .stage {
  --matrix-scene-tint: color-mix(in srgb, var(--scene-shade) var(--matrix-scene-brightness), black);
  background-image:linear-gradient(var(--matrix-scene-tint),var(--matrix-scene-tint)),var(--scene);
}

/* A short inlay on the visible card rim. The stage HUD stays above this layer. */
.matrix-direction-guide {
  position:absolute; inset:0; width:100%; height:100%; overflow:hidden;
  pointer-events:none; fill:none; stroke-linejoin:round; stroke-linecap:round;
  --edge-start:var(--accent); --edge-end:var(--accent2,var(--accent));
  --edge-mid:color-mix(in srgb,var(--edge-start) 65%,var(--edge-end));
}
body[data-theme=afterglow] .matrix-direction-guide {
  --edge-start:#ee95cf; --edge-mid:#b4adce; --edge-end:#85d7e9;
}
.matrix-edge-start {stop-color:var(--edge-start)}
.matrix-edge-mid {stop-color:var(--edge-mid)}
.matrix-edge-end {stop-color:var(--edge-end)}
.matrix-edge-track {stroke:#151421; stroke-opacity:.72; stroke-width:3.6}
.matrix-edge-light {stroke:url(#matrix-edge-metal); stroke-width:1.8}
@media (max-width:600px) and (orientation:portrait) {
  .matrix-direction-guide {display:none}
}

.matrix-glide125 {position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;}
.matrix-glide125 > img,.matrix-glide125 > svg {width:100%;height:100%;object-fit:contain;}
.v8-viewer[data-layout=wide] .neighbor-cell:hover { filter:brightness(.85); }

/* A steady shade on preview content, underneath the sleeve and number.
   Repeating a jump on the same axis doesn't pulse the entire row. */
@media (min-width:601px), (orientation:landscape) {
  .v8-viewer[data-layout=wide][data-focus-lane] .neighbor-cell:hover {filter:brightness(.68)}
  .v8-viewer[data-focus-lane=row] .neighbor-cell:not([data-slot^="0:"]),
  .v8-viewer[data-focus-lane=nw-se] .neighbor-cell:not([data-slot="-1:-1"],[data-slot="1:1"]),
  .v8-viewer[data-focus-lane=ne-sw] .neighbor-cell:not([data-slot="-1:1"],[data-slot="1:-1"]) {
    --matrix-preview-tint: rgb(2 3 5 / 63.52%);
  }
  .v8-viewer[data-focus-lane=locked] .neighbor-cell {
    --matrix-preview-tint: rgb(1 2 4 / 50.72%);
  }
  .v8-viewer[data-focus-lane] .neighbor-cell::before {
    content:'';position:absolute;inset:0;z-index:2;
    pointer-events:none;background:var(--matrix-preview-tint,transparent);
  }
}

img.picture-projected { opacity:0; }
.picture-projection {
  position:absolute; inset:0; width:100%; height:100%; pointer-events:none;
}
#cardMount img.picture-projected:focus-visible + .picture-projection {
  outline:2px solid var(--accent); outline-offset:-3px;
}
dialog.picture-view124.has-picture-tools[open] {
  display:grid; grid-template-rows:auto minmax(0,1fr) auto; place-items:stretch;
  gap:8px; padding:max(8px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right))
    max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
}
.has-picture-tools .picture-view-close124 {z-index:2;}
.picture-toolbar,.picture-footer {
  display:flex; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap;
}
.picture-toolbar { min-height:44px; padding-inline:46px; }
.picture-toolbar button,.picture-footer button,.picture-toolbar select {
  border:1px solid #ffffff45; border-radius:8px; background:#222832; color:#fafafa;
  padding:7px 11px; min-height:36px; cursor:pointer; font:inherit;
}
.picture-toolbar button[aria-pressed=true],.picture-footer .primary {
  border-color:var(--accent); color:var(--accent);
}
.picture-toolbar :disabled,.picture-footer :disabled { opacity:.45; cursor:default; }
.picture-toolbar [hidden],.picture-plane [hidden] { display:none; }
.picture-tool-stage {position:relative;min-width:0;min-height:0;overflow:hidden;touch-action:none;}
.picture-plane {position:absolute;overflow:hidden;}
.picture-plane > .picture-view-image124 {
  position:absolute; top:0; left:0; max-width:none; max-height:none; object-fit:fill;
  transform-origin:0 0; pointer-events:none;
}
.picture-crop {
  position:absolute;box-sizing:border-box;border:2px solid #fff;border-radius:2px;
  box-shadow:0 0 0 100vmax #0009; cursor:move;touch-action:none;
}
.picture-crop:focus-visible,.crop-grip:focus-visible {outline:3px solid var(--accent);outline-offset:-4px;}
.crop-grip {
  position:absolute;right:-2px;bottom:-2px;width:min(32px,50%);height:min(32px,50%);padding:0;background:#1b2631;color:white;
  border:1px solid white;border-radius:7px 0 0 0;cursor:nwse-resize;touch-action:none;
}
.crop-grip.crop-start {left:-2px;top:-2px;right:auto;bottom:auto;border-radius:0 0 7px 0;}
.theme-choice[aria-busy=true] {cursor:progress;outline:1px solid var(--accent);}
.theme-choice.theme-arc i {background-image:url('banner-arc.webp');}
.theme-choice.theme-wood i {background-image:url('banner-wood.webp');}
.theme-choice.theme-crimson i {background-image:url('banner-crimson.webp');}
.theme-choice.theme-ink i {background-image:url('banner-ink.webp');}
.theme-choice.theme-moody i {background-image:url('banner-moody.webp');}
.theme-choice.theme-oasis i {background-image:url('banner-oasis.webp');}
.theme-choice.theme-afterglow i {background-image:url('banner-afterglow.webp');}
.picture-status {color:#ffd690;font-size:.9em;}
.picture-status:empty {display:none;}
@media(max-width:620px), (max-height:520px) {
  .picture-toolbar,.picture-footer { gap:4px; }
  .picture-toolbar { padding-left:0; }
  .picture-toolbar button,.picture-footer button,.picture-toolbar select { font-size:12px;padding:5px 7px; }
}
