/* SAVDO: tarif tanlash, sahna paneli, kartochka */
.tarif-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 2px 0 6px; }
.tarif-btn { display: flex; flex-direction: column; gap: 3px; align-items: flex-start; text-align: left; padding: 11px 12px; border: 2px solid var(--line, #e2e8f0); border-radius: 14px; background: #fff; cursor: pointer; font: inherit; color: inherit; }
.tarif-btn.active { border-color: #1a73e8; background: #eef5ff; }
.tarif-btn.pro.active { border-color: #7c3aed; background: linear-gradient(135deg, #f5f0ff, #eef5ff); }
.tarif-name { font-weight: 700; font-size: 15.5px; }
.tarif-price { font-size: 13px; color: #1e8e3e; font-weight: 600; }
.tarif-btn.pro .tarif-price { color: #6d28d9; }
.tarif-desc { font-size: 12.5px; color: #64748b; line-height: 1.35; }
.tarif-note { font-size: 12.5px; color: #64748b; margin: 0 0 10px; }
.fon-bar { margin: 10px 0 4px; padding: 10px 12px; border: 1px solid var(--line, #e2e8f0); border-radius: 12px; background: #fafbff; }
.fon-title { font-weight: 700; font-size: 14px; margin-bottom: 8px; }
.fon-scenes { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.fon-scene { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 8px; border: 2px solid transparent; border-radius: 10px; background: #fff; cursor: pointer; font: inherit; font-size: 12px; color: #334155; }
.fon-scene.active { border-color: #7c3aed; }
.fon-sw { display: block; width: 46px; height: 34px; border-radius: 7px; border: 1px solid rgba(15, 23, 42, .12); }
.fon-asl { background: repeating-linear-gradient(45deg, #e2e8f0 0 6px, #f8fafc 6px 12px); }
.fon-studio { background: radial-gradient(circle at 50% 40%, #ffffff, #dfe5ee); }
.fon-podium { background: radial-gradient(ellipse 60% 22% at 50% 82%, #e9e2d6 0 99%, transparent 100%), linear-gradient(#1b2440, #2d3a63); }
.fon-wood { background: linear-gradient(#f1e7d6 0 55%, #9a6238 55% 100%); }
.fon-dark { background: radial-gradient(circle at 50% 45%, #3b4a7a, #0b0f1c); }
.fon-fabric { background: linear-gradient(115deg, #e8dfd3, #f6f1ea 45%, #ddd2c4); }
.fon-concrete { background: linear-gradient(135deg, #b9bec5, #9aa0a8); }
.fon-card-row { margin-top: 8px; font-size: 13.5px; gap: 8px; flex-wrap: wrap; }
.fon-card-view img { display: block; width: 100%; max-width: 340px; margin: 10px auto 2px; border-radius: 12px; box-shadow: 0 6px 22px rgba(15, 23, 42, .18); cursor: pointer; }
.fon-card-edit { margin-top: 8px; font-size: 13.5px; }
.fon-card-edit summary { cursor: pointer; font-weight: 600; padding: 4px 0; }
.fon-card-edit input { display: block; width: 100%; margin: 6px 0 0; padding: 9px 10px; border: 1px solid var(--line, #e2e8f0); border-radius: 8px; font: inherit; background: #fff; }
.fon-card-view a { display: block; width: max-content; margin: 8px auto 0; }
.fon-ai { background: conic-gradient(from 210deg at 50% 50%, #fde68a, #f9a8d4, #a5b4fc, #99f6e4, #fde68a); }