body {
    margin: 0;
    padding: 0;
    overflow: hidden;
  }
  
  html {
    box-sizing: border-box;
  }
  
  *, *:before, *:after {
    box-sizing: inherit;
  }
  
  /* TABLE ON BACK FACE */
  table {
    border-collapse: collapse;
    width: 100%;
    font-size: 10pt;
    font-family: Helvetica, sans-serif;
  }
  
  th, td {
    border: 1px solid #dddddd;
    text-align: start;
    padding: 5px;
    word-wrap: break-word;
    max-width: 100px;
  }
  
  th {
    background-color: #f2f2f2;
  }
  
  .first-column {
    text-align: right;
  }
  
  /* SCENE */
  .scene2 {
    width: 100vw;
    height: 100vh;
    margin: 0;
    perspective: 100vh;
  }
  
  /* INFO LAYER */
  #infoButton {
    position: fixed;
    font-size: 14pt;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9997;
  }
  
  #closeInfoButton {
    position: fixed;
    font-size: 14pt;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px;
    z-index: 9999;
  }
  
  .info-layer {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.5);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9998;
    backdrop-filter: blur(1vw);
  }
  
  .info-content {
    text-align: center;
    max-width: 60vw;
  }
  
  .infoH {
    font-family: Helvetica, sans-serif;
    font-size: 21pt;
  }
  
  .infoP {
    font-family: Helvetica, sans-serif;
    font-size: 13pt;
    line-height: 150%;
  }
  
  /* PRISM */
  .prism {
    width: 100vw;
    height: 100vh;
    position: relative;
    transform-style: preserve-3d;
    transform: translateZ(-160vh) translateY(0vh) translateX(0vh)
               rotateY(0deg) rotateX(0deg) rotateZ(0deg);
    transition: transform 1s ease-in-out;
  }
  
  .prism__face {
    position: absolute;
    width: 100vw;
    height: 100vh;
    border: 1px solid black;
    font-family: Helvetica, sans-serif;
    font-size: 5pt;
  }
  
  .prism__side-face {
    position: absolute;
    width: 100vh;
    height: 100vh;
    border: 1px solid black;
    font-family: Helvetica, sans-serif;
    font-size: 5pt;
    transform-origin: center center !important;
    left: 50%;
    top: 50%;
  }
  
  .prism__face-custom {
    position: absolute;
    border: 1px solid black;
    transform-origin: center center;
    left: 50%;
    right: 50%;
    font-family: Helvetica, sans-serif;
    font-size: 5pt;
  }
  
  .prism__face-custom_without_bg {
    position: absolute;
    border: 0;
    transform-origin: center center;
    left: 50%;
    right: 50%;
    font-family: Helvetica, sans-serif;
    font-size: 5pt;
  }
  
  /* MAIN FACES */
  .prism__face--top {
    transform: rotateX(90deg) translateZ(50vh);
    background-image: url(img/sides/top.jpg);
    background-size: contain;
  }
  
  .prism__face--left {
    transform: translate(-50%, -50%) translateX(-50vw) rotateY(90deg);
    background-image: url(img/sides/left1.jpg);
  }
  
  .prism__face--right {
    transform: translate(-50%, -50%) translateX(50vw) rotateY(270deg);
    background-image: url(img/sides/right.jpg);
  }
  
  .prism__face--bottom {
    transform: rotateX(90deg) translateZ(-50vh);
    background-image: url(img/sides/bottom.jpg);
    background-size: contain;
  }
  
  .prism__face--back {
    transform: translateZ(-50vh);
    background-image: url(img/sides/net_transpC.png);
    background-position: 30% 30%;
    background-size: cover;
  }
  
  /* FRONT SIGN */
  .prism__face--front-sign {
    width: 34vw;
    height: 30vh;
    border: 0;
    background-image: url(img/sides/sign_transp.png);
    background-size: contain;
    transform: translateZ(170vh) translateY(11vh) translateX(-36vw);
  }
  
  /* LEFT SIDE PANELS */
  .prism__face--left--whitepanel {
    width: 40vh;
    height: 100vh;
    transform: translateY(0vh) translateZ(35vh) translateX(35vw) rotateY(90deg);
    background-image: url(img/sides/spining_board.jpg);
    background-size: cover;
  }
  
  .prism__face--left--spinnings {
    width: 30vh;
    height: 65vh;
    transform: translateY(7vh) translateZ(43vh) translateX(35vw) rotateY(95deg);
    background-image: url(img/tovar/spinings.png);
    background-size: cover;
  }
  
  /* RIGHT BLUE THINGS / LURES */
  .prism__face--right--bluething {
    width: 25vh;
    height: 32vh;
    transform: translateX(-50vw) translateY(68vh) translateZ(20vw)
               rotateX(0deg) rotateZ(345deg) rotateY(90deg);
    background-image: url(img/sides/blue_thing1.jpg);
    background-size: cover;
  }
  
  .prism__face--right--bluething2 {
    width: 40vh;
    height: 40vh;
    transform: translateX(-54vw) translateY(64vh) translateZ(6vw)
               rotateX(0deg) rotateZ(345deg) rotateY(90deg);
    background-image: url(img/sides/blue_thing1.jpg);
    background-size: cover;
  }
  
  .prism__face--right--blyosna {
    width: 25vh;
    height: 32vh;
    transform: translateX(-49vw) translateY(68vh) translateZ(20vw)
               rotateX(0deg) rotateZ(345deg) rotateY(90deg);
    background-image: url(img/tovar/blyosna3C.png);
    background-size: cover;
  }
  
  .prism__face--right--blyosna2 {
    width: 40vh;
    height: 40vh;
    transform: translateX(-52vw) translateY(64vh) translateZ(6vw)
               rotateX(0deg) rotateZ(345deg) rotateY(90deg);
    background-image: url(img/tovar/blyosna_and_transp_layerC.png);
    background-size: contain;
  }
  
  /* RIGHT WHITE SHELVES */
  .prism__face--right--white-shelf {
    width: 40vh;
    height: 60vh;
    background-size: contain;
    background-image: url(img/sides/white_shelfC.jpg);
    transform: translateX(-55vw) translateY(-40vh) translateZ(-31vh)
               rotateX(0deg) rotateY(85deg) rotateZ(0deg);
  }
  
  .prism__face--right--white-shelf-horizontal1 {
    width: 20vh;
    height: 137vh;
    background-size: contain;
    background-image: url(img/sides/wooden_panel.jpg);
    transform: translateX(-48vw) translateY(-60vh) translateZ(-14vh)
               rotateX(270deg) rotateY(174deg) rotateZ(180deg);
  }
  
  .prism__face--right--white-shelf-horizontal2 {
    width: 47vh;
    height: 19vh;
    background-size: contain;
    background-image: url(img/sides/white_shelfC.jpg);
    transform: translateX(-53vw) translateY(-17vh) translateZ(-31vh)
               rotateX(270deg) rotateY(181deg) rotateZ(270deg);
  }
  
  .prism__face--right--white-shelf-horizontal3 {
    width: 47vh;
    height: 19vh;
    background-size: contain;
    background-image: url(img/sides/white_shelfC.jpg);
    transform: translateX(-53vw) translateY(-35vh) translateZ(-31vh)
               rotateX(270deg) rotateY(181deg) rotateZ(270deg);
  }
  
  .prism__face--right--wooden-shelf {
    width: 20vh;
    height: 50vh;
    background-size: contain;
    background-image: url(img/sides/wooden_panel.jpg);
    transform: translateX(40vw) translateY(3vh) translateZ(-4vh)
               rotateX(270deg) rotateY(184deg) rotateZ(180deg);
  }
  
  /* GOODS ON SHELF / FLOOR */
  .prism__face--knives {
    width: 20vh;
    height: 14vh;
    background-size: contain;
    background-image: url(img/tovar/knivesC.png);
    transform: translateX(38vw) translateY(69vh) translateZ(4vh)
               rotateX(270deg) rotateY(195deg) rotateZ(271deg);
  }
  
  .prism__face--strange-things {
    width: 9vw;
    height: 22vh;
    background-size: contain;
    background-image: url(img/tovar/strange_thingsC.png);
    transform: translateX(-22vw) translateY(86vh) translateZ(-15vh)
               rotateX(87deg) rotateY(0deg) rotateZ(310deg);
  }
  
  .prism__face--document {
    width: 6vw;
    height: 7vw;
    background-size: contain;
    background-image: url(img/rybachka/rent-payment.png);
    transform: translateX(-46vw) translateY(-2vh) translateZ(48vh)
               rotateX(270deg) rotateY(157deg) rotateZ(90deg);
  }
  
  .prism__face--document2 {
    width: 6vw;
    height: 7vw;
    background-size: contain;
    background-image: url(img/rybachka/rent-payment-smaller.jpg);
    transform: translateX(-46vw) translateY(-1vh) translateZ(46vh)
               rotateX(270deg) rotateY(161deg) rotateZ(90deg);
  }
  
  .prism__face--katushka {
    width: 7vw;
    height: 7vw;
    background-size: contain;
    background-image: url(img/tovar/katushka.png);
    transform: translateX(-46vw) translateY(-4vh) translateZ(-10vh)
               rotateX(270deg) rotateY(101deg) rotateZ(90deg);
  }
  
  .prism__face--baits {
    width: 12vw;
    height: 9vw;
    background-size: contain;
    background-image: url(img/tovar/baitsC.png);
    transform: translateX(-47vw) translateY(-6vh) translateZ(-29vh)
               rotateX(267deg) rotateY(103deg) rotateZ(93deg);
  }
  
  .prism__face--fanatik {
    width: 14vw;
    height: 6vw;
    background-size: contain;
    background-image: url(img/tovar/fanatikC.png);
    transform: translateX(-50vw) translateY(-3vh) translateZ(9vh)
               rotateX(270deg) rotateY(101deg) rotateZ(90deg);
  }
  
  .prism__face--zip {
    width: 7vw;
    height: 6vw;
    background-size: contain;
    background-image: url(img/tovar/ziplocksC.png);
    transform: translateX(-46vw) translateY(-18vh) translateZ(-22vh)
               rotateX(177deg) rotateY(122deg) rotateZ(180deg);
  }
  
  .prism__face--zip2 {
    width: 6vw;
    height: 8vw;
    background-size: contain;
    background-image: url(img/tovar/items3.png);
    transform: translateX(-46vw) translateY(-22vh) translateZ(-37vh)
               rotateX(177deg) rotateY(100deg) rotateZ(180deg);
  }
  
  .owners-portrait {
    width: 8vw;
    height: 18vh;
    background-image: url(img/rybachka/rybachka_face2.JPG);
    background-size: cover;
    transform: translateX(-47vw) translateY(7vh) translateZ(-20vh)
               rotateX(270deg) rotateY(94deg) rotateZ(90deg);
  }
  
  /* GRIDS */
  .prism__face--left--layer {
    transform: translate(-50%, -50%) translateX(-49vw) rotateY(90deg);
    background-image: url(img/sides/osb_transpC.png);
    background-size: contain;
  }
  
  .prism__face--right--layer {
    transform: rotateY(270deg) translateZ(-500px);
    background-image: url(img/sides/gridC.png);
  }
  
  .prism__face--custom--grid {
    width: 50vh;
    height: 85vh;
    transform: rotateY(307deg) translateZ(-40vh) translateX(-1vh) translateY(15vh);
    background-image: url(img/sides/gridC.png);
    background-size: contain;
  }
  
  .prism__face--grid-items {
    width: 19vw;
    height: 65vh;
    transform: rotateY(306deg) translateZ(-41vh) translateX(-6vh) translateY(21vh);
    background-image: url(img/tovar/many_itemsC.png);
    background-size: cover;
  }
  
  .prism__face--grid-items2 {
    width: 7vw;
    height: 27vh;
    transform: rotateY(300deg) translateZ(-50vh) translateX(18vh) translateY(23vh);
    background-image: url(img/tovar/more_itemsC.png);
    background-size: cover;
  }
  
  /* TABLE + FLOOR GOODS */
  .prism__face--bottom-table {
    width: 25vw;
    height: 25vh;
    background-size: cover;
    transform: translateY(70vh) translateZ(50vh) translateX(23vh) rotateX(90deg);
    background-image: url(img/sides/tableC.png);
  }
  
  .prism__face--bottom-gloves1 {
    width: 25vw;
    height: 25vh;
    background-size: cover;
    transform: translateY(68vh) translateZ(50vh) translateX(24vh) rotateX(84deg);
    background-image: url(img/tovar/gloves1C.png);
  }
  
  .prism__face--bottom-gloves2 {
    width: 15vw;
    height: 18vh;
    background-size: cover;
    transform: translateY(70vh) translateZ(48vh) translateX(51vh) rotateX(80deg);
    background-image: url(img/tovar/gloves2.png);
  }
  
  /* DOORS */
  .prism__face-door-left {
    position: absolute;
    font-family: Helvetica, sans-serif;
    font-size: 5pt;
    border: 1px solid black;
    width: 50vw;
    height: 100vh;
    background-image: url(img/sides/doorsL.jpg);
    background-size: cover;
    transform: translateZ(50vh) rotateY(0deg);
    transform-origin: left center;
    transition: transform 2.5s ease-in-out;
  }
  
  .prism__face-door-left.is-open {
    transform: translateZ(50vh) rotateY(-210deg);
  }
  
  .prism__face-door-right {
    border: 1px solid black;
    font-family: Helvetica, sans-serif;
    font-size: 5pt;
    width: 50vw;
    height: 100vh;
    background-image: url(img/sides/doorsR.jpg);
    background-size: contain;
    transform: translate(100%) translateZ(50vh) rotateY(0deg);
    transform-origin: right center;
    transition: transform 2.5s ease-in-out;
  }
  
  .prism__face-door-right.is-open {
    transform: translate(100%) translateZ(50vh) rotateY(210deg);
  }
  
  /* HIDDEN TEXT PLANE */
  .prism__face--hidden--bottom {
    width: 100vw;
    height: 70vh;
    font-size: 35pt;
    font-family: Helvetica, sans-serif;
    transform: translateX(-39vw) translateY(73vh) translateZ(72vh)
               rotateX(90deg) rotateY(0deg) rotateZ(0deg);
  }
  
  /* SCHEDULE & CAMERA */
  .schedule {
    width: 607px;
    height: 940px;
    position: absolute;
    background-image: url(img/sides/schedule2C.jpg);
    transform: translateX(190vw) translateY(-200vh) translateZ(134vh)
               rotateX(0deg) rotateY(240deg) rotateZ(0deg);
  }
  
  .surveillance_camera {
    width: 27vh;
    height: 30vh;
    position: absolute;
    background-image: url(img/sides/surveillance_camera.png);
    background-size: contain;
    transform: translateX(61vw) translateY(-111vh) translateZ(114vh);
  }
  
  /* Make all clickable things show the pointer cursor */
  [data-view-transform],
  .prism__face-door-left,
  .prism__face-door-right,
  #infoButton,
  #closeInfoButton,
  .surveillance_camera {
  cursor: pointer;
  }

  /* Hidden by default (desktop) */
.mobile-warning {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #ffffff;
  color: #000000;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 14pt;
  line-height: 1.5;
  padding: 20px;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* On small screens (mobile), show warning and hide kiosk */
@media (max-width: 900px) {
  .mobile-warning {
    display: flex;
  }

  .scene2 {
    display: none;
  }
}
