tss web 3d viewer

frontend/src/styles.css

@@ -450,6 +450,17 @@ h3 {
   color: var(--color-fury-white);
 }
 
+.rc-mode-btn-disabled,
+.rc-mode-btn:disabled {
+  opacity: 0.35;
+  cursor: not-allowed;
+}
+
+.rc-mode-btn-disabled:hover,
+.rc-mode-btn:disabled:hover {
+  color: var(--color-text-soft);
+}
+
 .rc-layout {
   display: grid;
   grid-template-columns: minmax(160px, 200px) min(720px, 60vh, 92vw) minmax(160px, 200px);
@@ -591,6 +602,20 @@ h3 {
   align-items: center;
 }
 
+.rc-stage {
+  position: relative;
+  width: 100%;
+  aspect-ratio: 1 / 1;
+}
+
+.rc-stage .rc-canvas,
+.rc-stage .rc-3d-container {
+  position: absolute;
+  inset: 0;
+  width: 100%;
+  height: 100%;
+}
+
 .rc-canvas {
   width: 100%;
   height: auto;
@@ -600,6 +625,24 @@ h3 {
   cursor: crosshair;
 }
 
+.rc-3d-container {
+  border: 1px solid rgba(255, 255, 255, 0.08);
+  border-radius: 8px;
+  overflow: hidden;
+  background: #0b0d10;
+}
+
+.rc-3d-container .rc3d-canvas {
+  display: block;
+  width: 100%;
+  height: 100%;
+  cursor: grab;
+}
+
+.rc-hidden {
+  display: none !important;
+}
+
 .rc-tickets {
   display: flex;
   width: 100%;