/* Стили визуализатора */
.room-container {
    position: relative;
    width: 100%;
    background: linear-gradient(180deg, #F0F0F3 0%, #E2E2E5 100%);
    overflow: hidden;
    box-shadow: inset 0 2px 20px rgba(0,0,0,0.03), 0 20px 40px rgba(0,0,0,0.05);
    border-bottom: 2px solid #D1D1D6;
}

.baseboard {
    position: absolute; bottom: 0; left: 0; right: 0; height: 12px;
    background: linear-gradient(to bottom, #E5E5EA, #D1D1D6);
    border-top: 1px solid #C7C7CC; z-index: 10;
}

.sofa-anchor {
    position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);
    z-index: 20; pointer-events: none;
    filter: drop-shadow(0 15px 20px rgba(0,0,0,0.12));
}

.canvas-item {
    position: absolute; background: #fff;
    box-shadow: 0 10px 40px rgba(0,0,0,0.15), 0 0 0 1px rgba(0,0,0,0.05);
    cursor: grab; z-index: 5; overflow: hidden;
    touch-action: none; border-radius: 2px;
    transition: outline 0.2s ease;
}
.canvas-item:active { cursor: grabbing; }
.canvas-item.selected {
    outline: 3px solid #007AFF; outline-offset: 3px; z-index: 30;
    box-shadow: 0 20px 50px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.05);
}
.canvas-item.edit-photo-mode { outline: 3px solid #34C759; }

.img-layer { width: 100%; height: 100%; position: relative; overflow: hidden; pointer-events: none; }
.img-layer img {
    position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%;
    transform: translate(-50%, -50%) scale(var(--scale)) translate(var(--x), var(--y));
    will-change: transform;
}

.tabs-container {
    display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px;
    scrollbar-width: none; /* Firefox */
}
.tabs-container::-webkit-scrollbar { display: none; } /* Chrome/Safari */

.tab-item {
    flex-shrink: 0; padding: 8px 16px; border-radius: 12px;
    font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.05em;
    transition: all 0.2s; border: 1px solid rgba(0,0,0,0.05);
}
.tab-item.active { background: #1d1d1f; color: white; border-color: #1d1d1f; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
.tab-item.inactive { background: white; color: rgba(0,0,0,0.4); }

.tab-add {
    flex-shrink: 0; width: 36px; height: 36px; border-radius: 12px;
    background: #fff; color: #1d1d1f; display: flex; align-items: center; border: 1px solid rgba(0,0,0,0.05);
    justify-content: center; font-size: 18px; transition: all 0.2s; box-shadow: 0 2px 5px rgba(0,0,0,0.02);
}
.tab-add:active { transform: scale(0.9); background: #F0F0F3; }

.size-tag {
    position: absolute; bottom: -28px; left: 50%; transform: translateX(-50%);
    background: rgba(29, 29, 31, 0.85); backdrop-filter: blur(8px);
    color: #fff; font-size: 10px; font-weight: 700; padding: 2px 8px;
    border-radius: 6px; white-space: nowrap; pointer-events: none;
    opacity: 0; transition: opacity 0.2s;
}
.canvas-item.selected .size-tag { opacity: 1; }

/* Скрытие стандартного маркера в блоке вопросов-ответов */
details > summary { list-style: none; }
details > summary::-webkit-details-marker { display: none; }