/* Tokyo Shiki / PAPER ARTS: load after the current theme styles. */
.ts-fixed-actions {
  --ts-shop-green: #315c4b;
  position: fixed;
  z-index: 9998;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  width: 70px;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  box-sizing: border-box;
}
.ts-fixed-actions .ts-action {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 70px;
  height: 166px;
  padding: 12px 0;
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  border: 0;
  border-bottom: 1px solid rgb(255 255 255 / 20%);
  transition: filter .15s ease;
}
.ts-fixed-actions .ts-contact { background: #000; }
.ts-fixed-actions .ts-shop { background: var(--ts-shop-green); }
.ts-fixed-actions .ts-instagram { background: #000; height: 70px; padding: 0; border: 0; }
.ts-fixed-actions .ts-label {
  display: block;
  writing-mode: vertical-rl;
  text-orientation: upright;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
  letter-spacing: .06em;
  flex-shrink: 0;
}
.ts-fixed-actions .ts-desktop-label { white-space: nowrap; overflow-wrap: normal; word-break: keep-all; }
.ts-fixed-actions .ts-mobile-label { display: none; }
.ts-fixed-actions .ts-action svg {
  display: block;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.ts-fixed-actions .ts-icon-dot { fill: currentColor; stroke: none; }
@media (hover: hover) { .ts-fixed-actions .ts-action:hover { filter: brightness(.9); } }
.ts-fixed-actions .ts-action:focus-visible { outline: 3px solid #2878c7; outline-offset: -4px; }
/* Matches the existing theme's mobile/tablet breakpoint; exactly 1284px uses this layout. */
@media (max-width: 1284px) {
  body { padding-bottom: calc(60px + env(safe-area-inset-bottom, 0px)); }
  .ts-fixed-actions {
    top: auto;
    bottom: 0;
    right: 0;
    left: 0;
    transform: none;
    width: 100%;
    flex-direction: row;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background: #000;
  }
  .ts-fixed-actions .ts-action {
    flex: 1 1 0;
    min-width: 0;
    width: auto;
    height: 60px;
    padding: 7px 2px;
    gap: 6px;
    border-bottom: 0;
    border-right: 1px solid rgb(255 255 255 / 20%);
    font-size: 11px;
  }
  .ts-fixed-actions .ts-instagram { flex: 0 0 48px; border: 0; }
  .ts-fixed-actions .ts-label { writing-mode: horizontal-tb; text-orientation: mixed; letter-spacing: 0; }
  .ts-fixed-actions .ts-desktop-label { display: none; }
  .ts-fixed-actions .ts-mobile-label { display: inline; white-space: nowrap; overflow-wrap: normal; word-break: keep-all; }
  .btn-totop { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
  html { scroll-padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }
}
/* Prevent the tall desktop stack from covering the header on low-height displays. */
@media (min-width: 1285px) and (max-height: 700px) {
  .ts-fixed-actions .ts-action { height: 140px; gap: 7px; }
  .ts-fixed-actions .ts-instagram { height: 52px; }
}
@media (prefers-reduced-motion: reduce) { .ts-fixed-actions .ts-action { transition: none; } }