closes #33

app/assets/css/locations-list.css

@@ -71,6 +71,19 @@
     background: #218838;
 }
 
+.button-secondary {
+    background: #6c757d;
+}
+
+.button-secondary:hover {
+    background: #5a6268;
+}
+
+.button:disabled {
+    opacity: 0.6;
+    cursor: not-allowed;
+}
+
 .button-small {
     padding: 4px 8px;
     font-size: 0.85em;
@@ -185,3 +198,98 @@
     padding: 4px 10px;
     font-size: 0.8rem;
 }
+
+.floor-preview-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(15, 23, 42, 0.85);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 16px;
+    z-index: 1100;
+    visibility: hidden;
+    opacity: 0;
+    pointer-events: none;
+    transition: opacity 0.2s ease, visibility 0.2s ease;
+}
+
+.floor-preview-overlay.is-visible {
+    visibility: visible;
+    opacity: 1;
+    pointer-events: auto;
+}
+
+.floor-preview-card {
+    width: min(960px, 100%);
+    max-height: calc(100vh - 32px);
+    background: #fff;
+    border-radius: 12px;
+    box-shadow: 0 25px 60px rgba(15, 23, 42, 0.35);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+
+.floor-preview-header,
+.floor-preview-footer {
+    padding: 16px 24px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 12px;
+    border-bottom: 1px solid #edf2f7;
+}
+
+.floor-preview-footer {
+    border-top: 1px solid #edf2f7;
+    border-bottom: none;
+    justify-content: flex-end;
+}
+
+.floor-preview-label {
+    font-size: 0.8rem;
+    letter-spacing: 0.1em;
+    text-transform: uppercase;
+    margin: 0;
+    color: #6c757d;
+}
+
+.floor-preview-header h3 {
+    margin: 2px 0 0;
+    font-size: 1.35rem;
+}
+
+.floor-preview-body {
+    padding: 16px 24px 24px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 12px;
+    overflow-y: auto;
+    flex: 1 1 auto;
+}
+
+.floor-preview-body canvas {
+    width: 100%;
+    max-width: 900px;
+    background: #0a0c10;
+    border-radius: 10px;
+    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
+}
+
+.floor-preview-empty {
+    margin: 0;
+    color: #6c757d;
+    font-size: 0.95rem;
+}
+
+.floor-preview-close {
+    background: transparent;
+    color: #1f2a37;
+    border: 1px solid #dfe3ea;
+}
+
+.floor-preview-close:hover {
+    background: #f4f5f7;
+}