/* v07 r5: inset navigation, larger number badges and typed author phrases.
   Artwork drawer styling is the unchanged v05 legacy.css cascade. */
:root {
  --label-font:var(--mono);
  --blue-deep:var(--blue);
  --hub-gutter: clamp(32px,4.3vw,86px);
  --hub-inset: clamp(22px,1.8vw,34px);
  --hub-photo: calc(clamp(210px,19.5vw,295px) * .78732);
  --hub-title-offset: calc(var(--hub-photo) * .694 + 23.8px - var(--hub-inset) * .3);
  --hub-nav-gap: clamp(28px,3vw,52px);
  --hub-matrix: min(clamp(300px,25vw,378px),calc(50vw - var(--hub-inset) - var(--hub-title-offset) - var(--hub-gutter) - var(--hub-nav-gap)));
  --gallery-work-width: calc(var(--hub-inset) * 2 + var(--hub-title-offset) * 2 + var(--hub-nav-gap) * 2 + var(--hub-matrix) * 1.56);
  --work-circle-size: 107.1225px;
  /* Approved nine-circle desktop composition; authored photo/line base is482px. */
  --gallery-work-width-limit: 964.1025px;
  --tile-size: 55.066667px;
  --matrix-columns: 9;
  --header-gap: 33px;
  --header-stroke-width: 1px;
  --header-side-inset: calc(var(--tile-size) * .15);
  --brand-disc-size: calc(var(--tile-size) - 2 * var(--header-stroke-width) - 8px);
  --ease: cubic-bezier(.22,.61,.36,1);
}
.visually-hidden {
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.matrix-shell {
  width:100%; min-height:100svh;
  padding:var(--home-shell-top,clamp(25px,4vh,58px)) 0 42px;
}
.matrix-frame {
  position:relative;
  width:max(var(--gallery-work-width),var(--header-min-frame-width,0px));max-width:min(calc(100% - 48px),var(--gallery-work-width-limit));
  margin:var(--matrix-top-offset,190px) auto 0;
  border:0;border-radius:0;
  background:transparent;
}
.matrix-pack {
  position:relative;
  width:calc(var(--matrix-columns) * var(--work-circle-size));
  margin-inline:auto;
}
.matrix-header {
  position:absolute;left:var(--header-side-inset);right:var(--header-side-inset);bottom:calc(100% + var(--header-gap));
  height:var(--tile-size);
  display:flex;align-items:center;gap:var(--header-part-gap,8px);
}
.brand-pill {
  display:flex;align-items:center;flex:1 1 0;
  min-width:min(calc(var(--tile-size) * 4),calc(100% - var(--tile-size) - var(--header-part-gap,8px)));height:var(--tile-size);
  padding:4px 12px 4px 4px;gap:16px;
  border:var(--header-stroke-width) solid var(--ink);
  border-radius:999px;background:transparent;
}
.brand-disc {
  display:grid;place-items:center;flex:none;
  width:var(--brand-disc-size);height:var(--brand-disc-size);
  border-radius:50%;background:#000;
}
.brand-pill-logo { display:block;width:var(--logo-scale,42%);height:var(--logo-scale,42%); }
.brand-pill:focus-visible { outline:2px solid var(--blue-deep);outline-offset:5px; }
.brand-quote {
  position:relative;display:flex;align-items:center;flex:1;min-width:0;height:100%;
  overflow:hidden;color:var(--ink);font:400 11px/1.25 var(--label-font);letter-spacing:0;
}
.quote-measure { position:absolute;left:0;top:0;width:100%;visibility:hidden; }
.quote-typed { display:block;width:100%; }
.quote-measure,.quote-typed { white-space:normal;overflow-wrap:normal;word-break:normal; }
.quote-word { white-space:nowrap; }
.brand-quote[data-quote-fit="overflow"] { overflow:auto;scrollbar-width:thin; }
.brand-quote[data-quote-overflow-y="true"] .quote-typed { align-self:flex-start; }
.section-tabs {
  position:relative;z-index:1;flex:0 1 auto;min-width:var(--tile-size);margin-left:0;
  height:var(--tile-size);width:max-content;max-width:100%;
}
.tab-strip { display:grid;grid-template-columns:repeat(7,var(--tile-size));gap:var(--header-tab-gap,4px); }
.section-tab {
  position:relative;display:block;
  width:var(--tile-size);height:var(--tile-size);min-height:0;
  margin:0;padding:0;border:0;background:transparent;
  color:var(--ink);touch-action:manipulation;
  transition:scale 85ms ease-out,translate 85ms ease-out,filter 85ms ease-out;
}
.section-tab:disabled { opacity:1;cursor:default; }
.tab-outline { position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none; }
.tab-outline path { fill:var(--tile-fill,var(--almost));stroke:var(--tile-stroke,var(--ink));stroke-width:var(--header-stroke-width);stroke-linejoin:round;vector-effect:non-scaling-stroke; }
.section-tab[aria-pressed="true"] .tab-outline path { fill:var(--tile-active-fill,var(--paper)); }
.tab-number {
  position:absolute;left:0;top:0;
  display:grid;place-items:center;
  width:var(--badge-size,21.84px);height:var(--badge-size,21.84px);border-radius:50%;
  background:var(--badge-fill,var(--ink));color:var(--badge-ink,#e4e6e8);
  font:400 9.1px/1 var(--label-font);letter-spacing:-.09em;
}
.section-tab[aria-pressed="true"] .tab-number { background:var(--badge-active-fill,var(--accent));color:var(--badge-active-ink,var(--ink)); }
.tab-name {
  color:var(--tile-ink,var(--ink));
  position:absolute;left:2.1px;right:2.1px;bottom:9.1px;
  display:block;text-align:center;
  font:500 7px/1.05 var(--label-font);letter-spacing:-.03em;
  text-transform:uppercase;
}
.section-tab:enabled:active { scale:.97;translate:0 2px;filter:brightness(.97); }
.section-tab:focus-visible { outline:2px solid var(--blue-deep);outline-offset:5px; }
.work-matrix {
  display:grid;grid-template-columns:repeat(var(--matrix-columns),var(--work-circle-size));
  grid-auto-rows:var(--work-circle-size);gap:0;
  justify-content:start;align-content:start;
  padding:0;margin:0;min-height:var(--work-circle-size);
}
.work-orb {
  position:relative;z-index:0;display:block;
  width:var(--work-circle-size);height:var(--work-circle-size);
  min-width:0;margin:0;padding:0;
  border:var(--header-stroke-width) solid var(--ink);border-radius:50%;overflow:hidden;
  background:var(--almost);cursor:pointer;
  transition:transform .18s var(--ease);
}
.work-orb-viewport { position:relative;display:block;width:100%;height:100%;overflow:hidden;border-radius:inherit; }
.work-orb img { position:absolute;display:block;max-width:none;width:100%;height:100%;left:50%;top:50%;transform:translate(-50%,-50%);object-fit:cover;pointer-events:none; }
@media(hover:hover) and (pointer:fine) {
  .work-orb:hover { transform:scale(1.08);z-index:2; }
}
.work-orb:focus-visible { outline:2px solid var(--blue-deep);outline-offset:2px;transform:scale(1.08);z-index:3; }
.work-orb:active { transform:scale(1.035);z-index:3; }
.matrix-error { grid-column:1/-1;margin:0;padding:28px;font:14px/1.4 var(--label-font);color:var(--body); }
@media(max-width:1100px) {
  .matrix-frame { width:calc(100% - 48px); }
}
@media(max-width:700px) {
  .section-tabs { overflow-x:auto;overflow-y:hidden;scrollbar-width:none; }
  .section-tabs::-webkit-scrollbar { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  .work-orb,.section-tab { transition:none; }
}

/* Inner pages enter at the Home header level, then ascend with document scroll. */
:root {
  --home-shell-top:clamp(25px,4vh,58px);
  --section-menu-top:20px;
  --section-content-top:calc(var(--section-menu-top) + var(--tile-size) + var(--header-gap));
  --section-home-content-top:calc(var(--home-shell-top) + var(--matrix-top-offset,190px));
  --section-menu-current-top:calc(var(--section-home-content-top) - var(--tile-size) - var(--header-gap));
  --section-current-content-top:var(--section-home-content-top);
}
.is-section-page .matrix-shell { padding-top:var(--section-home-content-top); }
.is-section-page .matrix-frame { margin-top:0; }
.is-section-page .matrix-header {
  position:fixed;top:var(--section-menu-current-top);bottom:auto;
  left:50%;right:auto;width:var(--section-menu-width,calc(100% - 48px));
  transform:translateX(-50%);z-index:100;
}
.is-section-page .matrix-header::before {
  content:"";position:absolute;left:0;right:0;
  top:calc(-1 * var(--section-menu-current-top));bottom:calc(-1 * var(--header-gap));
  background:var(--section-canvas,var(--paper));z-index:-1;pointer-events:none;
}
.tab-number { box-sizing:border-box;border:var(--header-stroke-width) solid var(--tile-stroke,var(--line)); }

.is-section-page .section-tabs { overflow-x:auto;overflow-y:hidden;scrollbar-width:none; }
.is-section-page .section-tabs::-webkit-scrollbar { display:none; }

/* Source-native editable rules in the full-work drawer. Keep its old spacing. */
.drawer-meta-wrap { position:relative;font-family:var(--mono);font-size:10px;letter-spacing:.03em;line-height:1.5;margin:1em 0 26px; }
.drawer-meta-wrap > .drawer-meta { margin:0;border-top-color:transparent;border-bottom-color:transparent; }
.work-facts-rule { position:absolute;display:block;left:0;top:0;width:100%;height:1px;padding:0;margin:0;border:0;background:var(--soft); }
.work-facts-rule--bottom { top:calc(100% - 1px);bottom:auto; }
.drawer-head { position:relative;border-bottom-color:transparent; }
.work-head-rule { position:absolute;display:block;left:0;top:100%;bottom:auto;width:100%;height:1px;padding:0;margin:0;border:0;background:var(--soft); }

/* The bundled variable fonts contain genuine weights 400–800. */
@font-face { font-family:"JetBrains Mono";src:url("assets/JetBrainsMono-cyrillic-400-500.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap;unicode-range:U+0400-052F,U+20BD; }
@font-face { font-family:"JetBrains Mono";src:url("assets/JetBrainsMono-latin-400-500.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap; }

/* Navigation halves share the page axis: Home's first tile begins at center. */
.matrix-header { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0; }
.matrix-header > .brand-pill { width:calc(100% - var(--header-part-gap,8px));min-width:0;max-width:none;justify-self:start; }
.matrix-header > .section-tabs { width:100%;min-width:0;max-width:none;overflow-x:auto;overflow-y:hidden;scrollbar-width:none; }
.matrix-header > .section-tabs::-webkit-scrollbar { display:none; }
.matrix-header .tab-strip { width:max-content;gap:var(--computed-tab-gap,var(--header-tab-gap,4px)); }

/* Two fixed rows reserve the complete composition before the first glyph appears. */
.quote-measure,.quote-typed { display:block;white-space:pre;overflow-wrap:normal;word-break:normal; }
.quote-line { display:block;white-space:pre;height:var(--quote-row-height,1.25em);line-height:var(--quote-row-height,1.25em); }
.brand-quote[data-quote-fit="overflow"] { overflow-x:auto;overflow-y:auto;scrollbar-width:thin; }
.brand-quote[data-quote-overflow-y="true"] .quote-typed { align-self:flex-start; }

/* Native overflow navigation uses the photo-control circle geometry. */
.gallery-nav-controls{position:absolute;right:0;top:calc(100% + 2px);height:28px;display:flex;gap:5px;align-items:center;z-index:2}
.gallery-nav-controls[hidden]{display:none}
.gallery-nav-scroll{display:grid;place-items:center;flex:none;width:28px;height:28px;min-height:0;padding:0;border:1px solid var(--ink);border-radius:50%;background:var(--paper);color:var(--ink);font:400 12px/1 var(--mono);letter-spacing:0;pointer-events:auto;transition:background-color 150ms,transform 85ms}
.gallery-nav-scroll svg{display:block;width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.gallery-nav-scroll:disabled{opacity:.3;cursor:default}
.gallery-nav-scroll:focus-visible{outline:2px solid var(--blue-deep);outline-offset:2px}
@media(hover:hover){.gallery-nav-scroll:enabled:hover{background:var(--almost)}}
.gallery-nav-scroll:enabled:active{transform:scale(.97)}
.brand-quote[data-quote-fit="overflow"]:focus-visible{outline:1px solid var(--blue-deep);outline-offset:1px}

:root { --content-button-height:43.2px; }
.drawer-next { min-height:var(--content-button-height);padding-block:6px; }

/* Approved shared header entrance and Home-only artwork wave. */
/* Prototype-only motion layer; authored geometry and assets are unchanged. */
.gallery-enter-pending .brand-pill {border-color:transparent!important;background:transparent!important}
.gallery-enter-pending .brand-disc,.gallery-enter-pending .section-tab,.gallery-enter-pending .brand-quote {opacity:0}
.gallery-enter-pending #work-matrix > .work-orb {opacity:0}
.gallery-brand-entrance {position:relative;isolation:isolate;border-color:transparent!important;background:transparent!important}
.gallery-brand-shell {position:absolute;left:-1px;top:-1px;height:calc(100% + 2px);width:calc(100% + 2px);box-sizing:border-box;border-style:solid;border-radius:inherit;pointer-events:none;z-index:-1}
.brand-disc {transform-origin:center center}
.section-tab {transform-origin:50% 0%;backface-visibility:hidden;transition:scale 90ms ease-out,translate 90ms ease-out}
.section-tab .tab-outline path {transition:fill 120ms ease-out}
.section-tab .tab-number {transition:background-color 120ms ease-out}
@media(hover:hover) and (pointer:fine) {
  .section-tab:not([aria-pressed="true"]):hover .tab-outline path {fill:#424448}
  .section-tab:not([aria-pressed="true"]):hover .tab-number {background-color:#424448}
}
.section-tab[aria-pressed="true"]:enabled:active {scale:1;translate:0 0;filter:none}
.section-tab:not([aria-pressed="true"]):enabled:active {scale:.97;translate:0 1px;filter:none}

/* GARDARI_MOBILE_1_1_0: accepted phone-only styles. */
/* Phone-menu trial 04: original logo + seven original tiles, 4 x 2.
   The actual artwork-circle pack determines the width. */
@media (max-width: 600px) {
  :root {
    --phone-menu-gap: 7.8px;
    --phone-menu-tile: 74.4918px;
    --phone-menu-height: calc(2 * var(--phone-menu-tile) + var(--phone-menu-gap));
    --home-shell-top: 20px !important;
    --matrix-top-offset: calc(var(--phone-menu-height) + 24px) !important;
    --header-gap: 24px !important;
  }

  .matrix-header {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, var(--phone-menu-tile)) !important;
    gap: var(--phone-menu-gap) !important;
    width: 100% !important;
    max-width: none !important;
    height: var(--phone-menu-height) !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    align-items: stretch !important;
  }

  .is-section-page .matrix-header {
    width: var(--section-menu-width) !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
  }

  .matrix-header > .brand-pill {
    display: grid !important;
    place-items: center !important;
    width: var(--phone-menu-tile) !important;
    height: var(--phone-menu-tile) !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    gap: 0 !important;
    background: transparent !important;
    border-radius: 50% !important;
  }

  .matrix-header .brand-disc {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
  }

  .matrix-header .brand-quote,
  .matrix-header .gallery-brand-shell,
  .matrix-header > .gallery-nav-controls {
    display: none !important;
  }

  .matrix-header > .section-tabs,
  .matrix-header .tab-strip {
    display: contents !important;
  }

  .matrix-header .section-tab {
    width: 100% !important;
    height: var(--phone-menu-tile) !important;
    min-width: 0 !important;
  }

  .matrix-header .tab-number {
    width: calc(var(--phone-menu-tile) * .36056) !important;
    height: calc(var(--phone-menu-tile) * .36056) !important;
    font-size: clamp(9px, 2.8vw, 11px) !important;
    letter-spacing: -.07em !important;
  }

  .matrix-header .tab-name {
    left: 2px !important;
    right: 2px !important;
    bottom: calc(var(--phone-menu-tile) * .13) !important;
    font-size: clamp(9px, 2.8vw, 11px) !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;
    letter-spacing: -.045em !important;
    white-space: nowrap !important;
  }
}

/* Phone Gallery trial05: yellow cap-height fills after each title row.
   All rules are restricted to this page and to phone widths. */
.phone-photo-rail { display: none; }
@media (max-width: 600px) {
  .phone-gallery-flow [data-gallery-frame="glass-1"] { border-top-width: 0 !important; }
  .phone-gallery-flow [data-gallery-frame="artist-2"] .gallery-photo {
    width: 100% !important; height: 100% !important;
    left: 0 !important; top: 0 !important;
    transform: none !important; object-fit: contain !important;
  }
  .phone-gallery-flow.contacts-page .gallery-block-actions {
    gap: var(--phone-contact-gap, 14.67px) !important;
  }
  .phone-gallery-flow .matrix-header::before {
    left: calc((100% - 100vw) / 2) !important;
    right: auto !important;
    width: 100vw !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case-header::before {
    display: none !important;
  }

  body.phone-gallery-flow #gallery-layout {
    display: block !important;
    min-width: 0 !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-text {
    width: 100% !important;
    padding-right: 0 !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case {
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding-bottom: 0;
  }

  .phone-gallery-flow #gallery-layout .gallery-case-header {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    z-index: 20 !important;
    border-top-width: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 21px !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case-header > .gallery-rule {
    display: none !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case h2 {
    overflow: visible !important;
    box-sizing: border-box !important;
    padding-left: 0 !important;
    -webkit-text-stroke: var(--phone-title-stroke, 0px) currentColor;
  }

  .phone-gallery-flow #gallery-layout .gallery-heading-line {
    position: relative;
    white-space: normal !important;
    overflow-wrap: normal !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-heading-line::after {
    content: '';
    position: absolute;
    left: var(--phone-fill-left, 100%);
    right: 0;
    top: var(--phone-fill-top, 0px);
    height: var(--phone-fill-height, 0px);
    background: #D8C62A;
    pointer-events: none;
  }

  .phone-gallery-flow #gallery-layout .gallery-media-panel {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 21px !important;
    z-index: auto !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-media-panel::after,
  .phone-gallery-flow #gallery-layout .gallery-row-spacer,
  .phone-gallery-flow #gallery-layout .gallery-media-row-spacer,
  .phone-gallery-flow #gallery-layout .gallery-stack::after,
  .phone-gallery-flow #gallery-layout::after,
  .phone-gallery-flow #gallery-visual {
    display: none !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-media-block {
    left: 0 !important;
    width: 100% !important;
    transform: none !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-photo-stack {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: var(--phone-photo-ratio, 1) !important;
    margin-inline: 0 !important;
    clip-path: none !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case-body {
    width: 100% !important;
    padding-top: 0 !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-rule {
    max-width: 100% !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case-header > .gallery-rule::after {
    display: none !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-block-actions {
    width: 100% !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-action-button {
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 48px !important;
    justify-content: center !important;
  }

  .phone-gallery-flow #gallery-layout > .gallery-rule--bottom {
    display: none !important;
  }

  .phone-gallery-flow #gallery-photo-matrix,
  .phone-gallery-flow #artist-work-matrix {
    width: min(100%, calc(3 * var(--work-circle-size))) !important;
    margin-inline: auto !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    aspect-ratio: 1 !important;
    gap: 0 !important;
  }

  .phone-gallery-flow #gallery-photo-matrix > .work-orb:nth-child(n + 10),
  .phone-gallery-flow #artist-work-matrix > .work-orb:nth-child(n + 10) {
    display: none !important;
  }

  .phone-gallery-flow #gallery-layout .gallery-case + .gallery-case {
    margin-top: calc(2 * var(--gallery-paragraph-gap, 16.8px)) !important;
  }

  .phone-gallery-flow .gallery-photo-matrix-block {
    margin-top: 32.3789px !important;
  }

  .phone-gallery-flow .artist-work-gallery { margin-top: 33.6px !important; padding-top: 0 !important; }

  .phone-photo-rail { display: none; }
  .phone-gallery-flow .has-phone-rail .gallery-photo-stack { display: none !important; }
  .phone-gallery-flow .phone-photo-rail {
    position: relative;
    display: flex;
    width: 100vw;
    left: calc((100% - 100vw) / 2);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
  }
  .phone-gallery-flow .phone-photo-rail::-webkit-scrollbar { display: none; }
  .phone-gallery-flow .phone-photo-card {
    display: block;
    position: relative;
    flex: 0 0 calc(100vw - 56px);
    width: calc(100vw - 56px);
    height: calc(100vw - 56px);
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    scroll-snap-align: start;
    background: transparent;
  }
  .phone-gallery-flow .phone-rail-image {
    display: block;
    width: 100%; height: 100%;
    object-fit: cover;
  }
  .phone-gallery-flow .phone-photo-card:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
}

/* iPhone Safari safe-area and pointer focus corrections · 1.1.2. */
@media (max-width: 600px) {
  html, body { background-color: #fff; }
  :root { --home-shell-top: calc(20px + env(safe-area-inset-top, 0px)) !important; }
  body::before {
    content: ''; position: fixed; top: 0; left: 0; right: 0;
    height: env(safe-area-inset-top, 0px); background: #fff;
    z-index: 99; pointer-events: none;
  }
  .is-section-page .matrix-header {
    top: max(var(--section-menu-current-top), calc(20px + env(safe-area-inset-top, 0px))) !important;
  }
  .phone-gallery-flow .matrix-header::before {
    top: -100vh !important;
    background: #fff !important;
  }
  .work-dialog { padding-top: env(safe-area-inset-top, 0px); }
  .work-dialog .drawer-scroll {
    height: calc(100dvh - 64px - env(safe-area-inset-top, 0px));
  }
  .drawer-close, .purchase-close {
    -webkit-appearance: none; appearance: none;
    color: var(--ink) !important; background: var(--accent) !important;
    -webkit-tap-highlight-color: transparent;
  }
  html:not([data-phone-input="keyboard"]) :is(.drawer-close, .purchase-close):focus {
    outline: none !important; box-shadow: none !important;
    transform: none !important;
  }
}

/* GARDARI_TABLET_1_2_0: accepted portrait study only. */
@media (min-width: 601px) and (max-width: 1100px) and (orientation: portrait) {

:root.gallery-tablet-portrait {
    --phone-menu-gap: 7.8px;
    --phone-menu-tile: 74.4918px;
    --phone-menu-height: calc(2 * var(--phone-menu-tile) + var(--phone-menu-gap));
    --home-shell-top: 20px !important;
    --matrix-top-offset: calc(var(--phone-menu-height) + 24px) !important;
    --header-gap: 24px !important;
  }

html.gallery-tablet-portrait .matrix-header {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, var(--phone-menu-tile)) !important;
    gap: var(--phone-menu-gap) !important;
    width: 100% !important;
    max-width: none !important;
    height: var(--phone-menu-height) !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    align-items: stretch !important;
  }

html.gallery-tablet-portrait .is-section-page .matrix-header {
    width: var(--section-menu-width) !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
  }

html.gallery-tablet-portrait .matrix-header > .brand-pill {
    display: grid !important;
    place-items: center !important;
    width: var(--phone-menu-tile) !important;
    height: var(--phone-menu-tile) !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    gap: 0 !important;
    background: transparent !important;
    border-radius: 50% !important;
  }

html.gallery-tablet-portrait .matrix-header .brand-disc {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
  }

html.gallery-tablet-portrait .matrix-header .brand-quote,
html.gallery-tablet-portrait .matrix-header .gallery-brand-shell,
html.gallery-tablet-portrait .matrix-header > .gallery-nav-controls {
    display: none !important;
  }

html.gallery-tablet-portrait .matrix-header > .section-tabs,
html.gallery-tablet-portrait .matrix-header .tab-strip {
    display: contents !important;
  }

html.gallery-tablet-portrait .matrix-header .section-tab {
    width: 100% !important;
    height: var(--phone-menu-tile) !important;
    min-width: 0 !important;
  }

html.gallery-tablet-portrait .matrix-header .tab-number {
    width: calc(var(--phone-menu-tile) * .36056) !important;
    height: calc(var(--phone-menu-tile) * .36056) !important;
    font-size: clamp(9px, 2.8vw, 11px) !important;
    letter-spacing: -.07em !important;
  }

html.gallery-tablet-portrait .matrix-header .tab-name {
    left: 2px !important;
    right: 2px !important;
    bottom: calc(var(--phone-menu-tile) * .13) !important;
    font-size: clamp(9px, 2.8vw, 11px) !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;
    letter-spacing: -.045em !important;
    white-space: nowrap !important;
  }


html.gallery-tablet-portrait .phone-gallery-flow [data-gallery-frame="glass-1"] { border-top-width: 0 !important; }

html.gallery-tablet-portrait .phone-gallery-flow [data-gallery-frame="artist-2"] .gallery-photo {
    width: 100% !important; height: 100% !important;
    left: 0 !important; top: 0 !important;
    transform: none !important; object-fit: contain !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow.contacts-page .gallery-block-actions {
    gap: var(--phone-contact-gap, 14.67px) !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow .matrix-header::before {
    left: calc((100% - 100vw) / 2) !important;
    right: auto !important;
    width: 100vw !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-header::before {
    display: none !important;
  }

html.gallery-tablet-portrait body.phone-gallery-flow #gallery-layout {
    display: block !important;
    min-width: 0 !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-text {
    width: 100% !important;
    padding-right: 0 !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case {
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding-bottom: 0;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-header {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    z-index: 20 !important;
    border-top-width: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 21px !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-header > .gallery-rule {
    display: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case h2 {
    overflow: visible !important;
    box-sizing: border-box !important;
    padding-left: 0 !important;
    -webkit-text-stroke: var(--phone-title-stroke, 0px) currentColor;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-heading-line {
    position: relative;
    white-space: normal !important;
    overflow-wrap: normal !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-heading-line::after {
    content: '';
    position: absolute;
    left: var(--phone-fill-left, 100%);
    right: 0;
    top: var(--phone-fill-top, 0px);
    height: var(--phone-fill-height, 0px);
    background: #D8C62A;
    pointer-events: none;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-media-panel {
    position: relative !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 21px !important;
    z-index: auto !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-media-panel::after,
html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-row-spacer,
html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-media-row-spacer,
html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-stack::after,
html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout::after,
html.gallery-tablet-portrait .phone-gallery-flow #gallery-visual {
    display: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-media-block {
    left: 0 !important;
    width: 100% !important;
    transform: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-photo-stack {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    aspect-ratio: var(--phone-photo-ratio, 1) !important;
    margin-inline: 0 !important;
    clip-path: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-body {
    width: 100% !important;
    padding-top: 0 !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-rule {
    max-width: 100% !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-header > .gallery-rule::after {
    display: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-block-actions {
    width: 100% !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-action-button {
    box-sizing: border-box !important;
    width: 100% !important;
    min-height: 48px !important;
    justify-content: center !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout > .gallery-rule--bottom {
    display: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-photo-matrix,
html.gallery-tablet-portrait .phone-gallery-flow #artist-work-matrix {
    width: min(100%, calc(3 * var(--work-circle-size))) !important;
    margin-inline: auto !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    aspect-ratio: 1 !important;
    gap: 0 !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-photo-matrix > .work-orb:nth-child(n + 10),
html.gallery-tablet-portrait .phone-gallery-flow #artist-work-matrix > .work-orb:nth-child(n + 10) {
    display: none !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case + .gallery-case {
    margin-top: calc(2 * var(--gallery-paragraph-gap, 16.8px)) !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow .gallery-photo-matrix-block {
    margin-top: 32.3789px !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow .artist-work-gallery { margin-top: 33.6px !important; padding-top: 0 !important; }

html.gallery-tablet-portrait .phone-photo-rail { display: none; }

html.gallery-tablet-portrait .phone-gallery-flow .has-phone-rail .gallery-photo-stack { display: none !important; }

html.gallery-tablet-portrait .phone-gallery-flow .phone-photo-rail {
    position: relative;
    display: flex;
    width: 100vw;
    left: calc((100% - 100vw) / 2);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x pan-y;
  }

html.gallery-tablet-portrait .phone-gallery-flow .phone-photo-rail::-webkit-scrollbar { display: none; }

html.gallery-tablet-portrait .phone-gallery-flow .phone-photo-card {
    display: block;
    position: relative;
    flex: 0 0 calc(100vw - 56px);
    width: calc(100vw - 56px);
    height: calc(100vw - 56px);
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    overflow: hidden;
    scroll-snap-align: start;
    background: transparent;
  }

html.gallery-tablet-portrait .phone-gallery-flow .phone-rail-image {
    display: block;
    width: 100%; height: 100%;
    object-fit: cover;
  }

html.gallery-tablet-portrait .phone-gallery-flow .phone-photo-card:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }


html.gallery-tablet-portrait,
html.gallery-tablet-portrait body { background-color: #fff; }

:root.gallery-tablet-portrait { --home-shell-top: calc(20px + env(safe-area-inset-top, 0px)) !important; }

html.gallery-tablet-portrait body::before {
    content: ''; position: fixed; top: 0; left: 0; right: 0;
    height: env(safe-area-inset-top, 0px); background: #fff;
    z-index: 99; pointer-events: none;
  }

html.gallery-tablet-portrait .is-section-page .matrix-header {
    top: max(var(--section-menu-current-top), calc(20px + env(safe-area-inset-top, 0px))) !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow .matrix-header::before {
    top: -100vh !important;
    background: #fff !important;
  }

html.gallery-tablet-portrait .work-dialog { padding-top: env(safe-area-inset-top, 0px); }

html.gallery-tablet-portrait .work-dialog .drawer-scroll {
    height: calc(100dvh - 64px - env(safe-area-inset-top, 0px));
  }

html.gallery-tablet-portrait .drawer-close,
html.gallery-tablet-portrait .purchase-close {
    -webkit-appearance: none; appearance: none;
    color: var(--ink) !important; background: var(--accent) !important;
    -webkit-tap-highlight-color: transparent;
  }

html.gallery-tablet-portrait:not([data-phone-input="keyboard"]) :is(.drawer-close,
html.gallery-tablet-portrait .purchase-close):focus {
    outline: none !important; box-shadow: none !important;
    transform: none !important;
  }


:root.gallery-tablet-portrait {
    --tablet-columns: 6;
    --tablet-menu-columns: 8;
    --phone-menu-gap: 7.8px;
    --phone-menu-height: var(--phone-menu-tile);
    --header-gap: 32px !important;
    --matrix-top-offset: calc(var(--phone-menu-height) + 32px) !important;
  }

html.gallery-tablet-portrait .matrix-frame {
    width: min(calc(100vw - 80px), calc(var(--tablet-columns) * var(--work-circle-size))) !important;
    max-width: calc(100vw - 64px) !important;
  }

html.gallery-tablet-portrait .matrix-header {
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    grid-template-rows: var(--phone-menu-tile) !important;
    height: var(--phone-menu-tile) !important;
  }

html.gallery-tablet-portrait .matrix-header .tab-number,
html.gallery-tablet-portrait .matrix-header .tab-name {
    font-size: 12.65px !important;
    font-weight: 700 !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-header { padding-bottom: 24px !important; }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-media-panel { margin-bottom: 24px !important; }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case-body { max-width: 680px; margin-inline: auto; }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-case + .gallery-case { margin-top: 48px !important; }

html.gallery-tablet-portrait .phone-gallery-flow .phone-photo-card {
    flex-basis: min(calc(100vw - 80px), calc(6 * var(--work-circle-size)));
    width: min(calc(100vw - 80px), calc(6 * var(--work-circle-size)));
    height: min(calc(100vw - 80px), calc(6 * var(--work-circle-size)));
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-photo-matrix,
html.gallery-tablet-portrait .phone-gallery-flow #artist-work-matrix {
    width: min(100%, calc(5 * var(--work-circle-size))) !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    aspect-ratio: auto !important;
  }

html.gallery-tablet-portrait .phone-gallery-flow #gallery-photo-matrix > .work-orb:nth-child(n + 10),
html.gallery-tablet-portrait .phone-gallery-flow #artist-work-matrix > .work-orb:nth-child(n + 10) { display: block !important; }

html.gallery-tablet-portrait .phone-gallery-flow .gallery-photo-matrix-block,
html.gallery-tablet-portrait .phone-gallery-flow .artist-work-gallery { margin-top: 48px !important; }

html.gallery-tablet-portrait .phone-gallery-flow .gallery-photo-stack { max-height: none !important; }

html.gallery-tablet-portrait .section-page .works-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }


}

/* GARDARI_TABLET_1_2_1: tablet title size follows the authored native size at 4/3 scale. */

/* Author tablet refinements: full-width circles and 20% taller text actions. */
@media (min-width: 601px) and (max-width: 1100px) and (orientation: portrait) {
  html.gallery-tablet-portrait .matrix-pack { width: 100% !important; }
  html.gallery-tablet-portrait #work-matrix { --work-circle-size: var(--tablet-orb-size, 128.547px); }
  html.gallery-tablet-portrait .phone-gallery-flow #gallery-layout .gallery-action-button { min-height: 57.6px !important; }
  html.gallery-tablet-portrait .phone-gallery-flow :is(#gallery-photo-matrix, #artist-work-matrix) {
    width: 100% !important; grid-auto-rows: auto !important;
  }
  html.gallery-tablet-portrait .phone-gallery-flow :is(#gallery-photo-matrix, #artist-work-matrix) > .work-orb {
    width: 100% !important; height: auto !important; aspect-ratio: 1;
  }
}

/* Fixed tablet Home navigation; preserve its initial horizontal position. */
html.gallery-tablet :is(body:not([data-page]),body[data-page="home"]) .matrix-header {
  position: fixed !important;
  top: max(var(--tablet-home-menu-top, 20px), calc(20px + env(safe-area-inset-top, 0px))) !important;
  left: var(--tablet-home-menu-left, 0px) !important;
  right: auto !important; bottom: auto !important;
  width: var(--tablet-home-menu-width, 100%) !important;
  transform: none !important; z-index:100;
}
html.gallery-tablet :is(body:not([data-page]),body[data-page="home"]) .matrix-header::before {
  content:''; position:absolute; top:-100vh;
  left:calc((100% - 100vw) / 2); width:100vw;
  bottom:calc(-1 * var(--header-gap));
  background:var(--paper, #fff); z-index:-1; pointer-events:none;
}