/* Genel pürüzsüzlük ayarları (Kaydırma tamamen iptal edildi) */
        body { -webkit-font-smoothing: antialiased; overscroll-behavior: none; }

        /* --- MODERN 3D KUTU ve BUTON STİLLERİ --- */
        .title-3d {
            border-width: 2px;
            border-radius: 0.75rem;
            color: white;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.05em;
            display: flex;
            align-items: center;
            padding: 0.6rem 1rem;
        }
        .title-3d-blue { background: #3b82f6; border-color: #1e3a8a; box-shadow: 0 4px 0 #1e3a8a; }
        .title-3d-purple { background: #a855f7; border-color: #581c87; box-shadow: 0 4px 0 #581c87; }
        .title-3d-emerald { background: #10b981; border-color: #064e3b; box-shadow: 0 4px 0 #064e3b; }

        .btn-3d {
            transition: all 0.1s ease-in-out;
            border-width: 2px;
            font-weight: 800;
            border-radius: 0.75rem;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        /* Tıklama efekti */
        .btn-3d:active:not(:disabled) {
            transform: translateY(4px);
            box-shadow: 0 0px 0 transparent !important;
            margin-bottom: -4px; 
        }
        .btn-3d:disabled {
            opacity: 0.6;
            cursor: not-allowed;
            transform: translateY(4px);
            box-shadow: 0 0px 0 transparent !important;
            margin-bottom: -4px;
        }

        /* Buton Renk Varyasyonları */
        .btn-3d-purple { background: #a855f7; border-color: #581c87; box-shadow: 0 4px 0 #581c87; color: white; }
        .btn-3d-purple:hover:not(:disabled) { background: #bf7ceb; }

        .btn-3d-teal { background: #14b8a6; border-color: #115e59; box-shadow: 0 4px 0 #115e59; color: white; }
        .btn-3d-teal:hover:not(:disabled) { background: #2dd4bf; }

        .btn-3d-blue { background: #3b82f6; border-color: #1e3a8a; box-shadow: 0 4px 0 #1e3a8a; color: white; }
        .btn-3d-blue:hover:not(:disabled) { background: #60a5fa; }

        .btn-3d-emerald { background: #10b981; border-color: #064e3b; box-shadow: 0 4px 0 #064e3b; color: white; }
        .btn-3d-slate { background: #64748b; border-color: #334155; box-shadow: 0 4px 0 #334155; color: white; }
        .btn-3d-red { background: #ef4444; border-color: #7f1d1d; box-shadow: 0 4px 0 #7f1d1d; color: white; }
        .btn-3d-white { background: #ffffff; border-color: #cbd5e1; box-shadow: 0 4px 0 #cbd5e1; color: #334155; }
        .btn-3d-white:hover:not(:disabled) { background: #f8fafc; }

        .quality-card {
            transition: all 0.18s ease;
        }
        .quality-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
        }
        .quality-pill {
            border-radius: 999px;
            font-weight: 800;
            letter-spacing: 0.03em;
        }

        /* --- Builder benzeri panel sistemi --- */
        .builder-shell {
            background: #f8fafc;
            background-image: radial-gradient(#dbe3f0 1.2px, transparent 1.2px);
            background-size: 22px 22px;
        }
        .builder-header {
            background: rgba(255,255,255,0.94);
            border: 1px solid #dbe5f1;
            box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
        }
        .builder-preview {
            background: linear-gradient(180deg, #2f3338 0%, #25282d 100%);
            border: 1px solid rgba(148, 163, 184, 0.18);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
        }
        .builder-panel {
            background: rgba(255,255,255,0.96);
            border: 1px solid #dbe5f1;
            box-shadow: 0 14px 32px rgba(15, 23, 42, 0.06);
        }
        .builder-card {
            background: #ffffff;
            border: 1px solid #e5e7eb;
            border-radius: 1rem;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
        }
        .builder-card-soft {
            background: #f8fafc;
            border: 1px solid #e2e8f0;
            border-radius: 1rem;
        }
        .builder-tabbar {
            background: #eef2ff;
            border: 1px solid #dbe5f1;
            border-radius: 0.95rem;
            padding: 0.25rem;
        }
        .builder-tab {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 0.375rem;
            min-height: 40px;
            border-radius: 0.75rem;
            font-size: 0.75rem;
            font-weight: 800;
            letter-spacing: 0.04em;
            text-transform: uppercase;
            color: #64748b;
            background: transparent;
        }
        .builder-tab.active {
            background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%);
            color: white;
            box-shadow: 0 8px 20px rgba(99, 102, 241, 0.22);
        }
        .builder-field,
        .builder-select,
        .builder-range-wrap {
            border-radius: 0.9rem;
            border: 1px solid #dbe5f1;
            background: #f8fafc;
        }
        .builder-select {
            box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
        }
        .builder-badge {
            display: inline-flex;
            align-items: center;
            gap: 0.35rem;
            padding: 0.3rem 0.65rem;
            border-radius: 999px;
            font-size: 0.68rem;
            font-weight: 800;
            letter-spacing: 0.05em;
            text-transform: uppercase;
        }
        .builder-action {
            border-radius: 0.95rem;
            min-height: 46px;
            box-shadow: none !important;
            border-width: 1px !important;
            font-weight: 800;
        }

        .desktop-panel-order::-webkit-scrollbar { width: 10px; }
        .desktop-panel-order::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }
        .desktop-panel-order::-webkit-scrollbar-track { background: transparent; }
        #settingsContainer::-webkit-scrollbar { width: 10px; }
        #settingsContainer::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }
        #settingsContainer::-webkit-scrollbar-track { background: transparent; }
        .builder-action:active:not(:disabled),
        .builder-action:disabled {
            transform: none !important;
            margin-bottom: 0 !important;
        }
        .builder-upload-label {
            border-radius: 1rem;
            border: 2px dashed #c7d2fe;
            background: linear-gradient(180deg, #eef2ff 0%, #ffffff 100%);
        }
        .builder-mobile-bar {
            background: rgba(255,255,255,0.96);
            border-top: 1px solid #dbe5f1;
            box-shadow: 0 -10px 30px rgba(15, 23, 42, 0.08);
            backdrop-filter: blur(12px);
        }

        /* Builder hissi için mevcut 3D bileşenleri sadeleştir */
        .title-3d {
            border-width: 1px;
            border-radius: 0.95rem;
            box-shadow: none !important;
            padding: 0.72rem 0.9rem;
            font-size: 0.76rem;
            letter-spacing: 0.08em;
        }
        .title-3d-blue { background: linear-gradient(135deg, #eef2ff 0%, #ffffff 100%); color: #4f46e5; border-color: #c7d2fe; }
        .title-3d-purple { background: linear-gradient(135deg, #faf5ff 0%, #ffffff 100%); color: #9333ea; border-color: #e9d5ff; }
        .title-3d-emerald { background: linear-gradient(135deg, rgba(16,185,129,0.16) 0%, rgba(255,255,255,0.04) 100%); color: #6ee7b7; border-color: rgba(110,231,183,0.18); }
        .btn-3d {
            border-width: 1px;
            box-shadow: none !important;
            border-radius: 0.95rem;
            transition: all 0.16s ease;
        }
        .btn-3d:hover:not(:disabled) {
            transform: translateY(-1px);
            filter: saturate(1.03);
        }
        .btn-3d-purple { background: linear-gradient(135deg, #6366f1 0%, #a855f7 100%); border-color: #8b5cf6; }
        .btn-3d-blue { background: linear-gradient(135deg, #2563eb 0%, #4f46e5 100%); border-color: #4f46e5; }
        .btn-3d-teal { background: linear-gradient(135deg, #0f766e 0%, #14b8a6 100%); border-color: #0f766e; }
        .btn-3d-white { background: #ffffff; border-color: #dbe5f1; color: #334155; }
        .btn-3d-red { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); border-color: #dc2626; }

        @media (min-width: 1024px) {
            .desktop-preview-order { order: 1 !important; }
            .desktop-panel-order { order: 2 !important; height: 100%; overflow: hidden !important; }
            #settingsContainer { overflow: hidden !important; }
            #settingsFooter { position: static !important; background: transparent !important; }
        }
    
        /* --- Ortak jeneratör teması: çıkarma/çarpma panel çizgisi --- */
        .builder-shell {
            background: #efefef;
            background-image: none;
        }
        .builder-header {
            background: #ffffff;
            border: 1px solid #dcdcdc;
            box-shadow: 0 2px 10px rgba(15,23,42,0.05);
        }
        .builder-header h1 {
            font-size: 1.45rem;
            line-height: 1.02;
            font-weight: 900;
            letter-spacing: -0.04em;
            background: linear-gradient(90deg,#4f46e5 0%,#7c3aed 65%,#ec4899 100%);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
            margin: 0;
        }
        @media (min-width: 1024px) {
            .builder-header h1 { font-size: 1.75rem; }
        }
        .builder-preview {
            background: linear-gradient(180deg,#202327 0%,#111315 100%);
            border: 1px solid #3a3f45;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
        }
        .builder-preview #statusIdle { color: #c7f9dd; }
        .builder-preview #statusIdle p:first-of-type { color: #ffffff !important; }
        .desktop-panel-order { scrollbar-color:#9ca3af transparent; }
        .builder-tabbar {
            background: #dedede;
            border: 1px solid #d0d0d0;
            border-radius: 1.35rem;
            padding: 0.5rem;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
        }
        .builder-tab {
            min-height: 54px;
            border-radius: 1rem;
            font-size: 1rem;
            font-weight: 900;
            letter-spacing: -0.01em;
            text-transform: none;
            color: #6b7280;
        }
        .builder-tab.active {
            background: #ffffff;
            color: #2563eb;
            box-shadow: 0 3px 10px rgba(0,0,0,0.08);
        }
        .builder-panel {
            background: #dfe6ef;
            border: 1px solid #cfd8e3;
            box-shadow: none;
        }
        .builder-mobile-bar {
            background: #dfe6ef;
            border-top: 1px solid #cfd8e3;
            box-shadow: none;
            backdrop-filter: none;
        }
        .builder-card {
            background: #dfe6ef;
            border: 0;
            box-shadow: none;
        }
        .builder-card-soft {
            background: #dfe6ef;
            border: 1px solid #cad5e2;
            border-radius: 1.65rem;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.55);
        }
        .title-3d {
            background: transparent !important;
            border: 0 !important;
            box-shadow: none !important;
            padding: 0;
            border-radius: 0;
            font-size: 0.9rem;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            font-weight: 900;
        }
        .title-3d-blue,.title-3d-purple { color:#2563eb !important; }
        .title-3d-emerald { color:#e5e7eb !important; }
        .builder-upload-label {
            border-radius: 1.5rem;
            border: 1px solid #b9c8db;
            background: #eef2f6;
            min-height: 74px;
        }
        .builder-select,.builder-field,.builder-range-wrap {
            background: #ffffff;
            border: 1px solid #cfd8e3;
            border-radius: 1rem;
            box-shadow: 0 1px 0 rgba(255,255,255,0.9), inset 0 1px 1px rgba(15,23,42,0.04);
        }
        .builder-select, #customHeightCm, #customWidthCm {
            min-height: 50px;
            font-size: 1rem;
            color: #1f2937;
        }
        .builder-badge {
            border-radius: 0.9rem;
            font-size: 0.75rem;
        }
        #settingsContainer .text-slate-500, #settingsContainer .text-slate-400 { color: #5f6f86 !important; }
        #settingsContainer .text-slate-800 { color: #1f2937 !important; }
        #settingsFooter { position: static !important; }
        .builder-action {
            min-height: 52px;
            border-radius: 1.1rem;
            font-size: 0.95rem;
            font-weight: 900;
            border: 0 !important;
            box-shadow: 0 4px 10px rgba(0,0,0,0.08) !important;
        }
        .btn-3d-purple { background: linear-gradient(90deg,#a855f7 0%, #ec4899 100%) !important; color:#fff !important; }
        .btn-3d-blue { background: #9aa7eb !important; color:#fff !important; }
        .btn-3d-teal { background: #0f9d6c !important; color:#fff !important; }
        .btn-3d-white { background: #ffffff !important; color:#334155 !important; border:1px solid #d6dce5 !important; box-shadow: 0 3px 8px rgba(0,0,0,0.06) !important; }
        #smartFitInfo { background:#eef2f6 !important; border-color:#d6dce5 !important; }
        #previewContainer { background:#eef2f6 !important; border-color:#cfd8e3 !important; border-radius:1.5rem !important; height:135px; }
        #simulationGrid { background:#2d3136 !important; }
        @media (max-width: 1023px) {
            html, body {
                overflow: hidden !important;
                height: 100svh !important;
                min-height: 100svh !important;
                overscroll-behavior: none !important;
            }
            body {
                display: flex !important;
                flex-direction: column !important;
            }
            .builder-shell {
                height: 100svh !important;
                min-height: 100svh !important;
                overflow: hidden !important;
                display: flex !important;
                flex-direction: column !important;
                padding: 0 !important;
                gap: 0 !important;
            }
            main {
                gap: 0 !important;
                flex: 1 1 0 !important;
                min-height: 0 !important;
                overflow: hidden !important;
                display: grid !important;
                grid-template-rows: minmax(0, 35svh) minmax(0, 65svh) !important;
            }
            main > section {
                min-height: 0 !important;
                overflow: hidden !important;
            }
            main > aside {
                min-height: 0 !important;
                overflow: hidden !important;
                display: flex !important;
                flex-direction: column !important;
                background: #eef1f5 !important;
                border-top: 1px solid #d7dde6 !important;
            }

            /* Masaüstüne dokunmadan mobilde üst tuvali optimize et */
            .builder-preview {
                min-height: 0 !important;
                border: 0 !important;
                border-radius: 0 !important;
            }
            #infoMessage {
                display: none !important;
            }
            #statusIdle {
                padding: 0.7rem !important;
            }
            #statusIdle > div {
                width: min(80vw, 430px) !important;
                padding: 1rem 0.95rem !important;
                gap: 0.6rem !important;
                border-radius: 1.5rem !important;
            }
            #statusIdle .bg-emerald-400\/20 {
                padding: 0.9rem !important;
                border-radius: 1rem !important;
            }
            #statusIdle svg {
                width: 36px !important;
                height: 36px !important;
            }
            #statusIdle p.font-black {
                font-size: 1.08rem !important;
                line-height: 1.1 !important;
                margin-bottom: 0.12rem !important;
            }
            #statusIdle p.text-sm {
                font-size: 0.8rem !important;
                line-height: 1.2 !important;
            }
            #statusIdle p.text-xs {
                font-size: 0.68rem !important;
                margin-top: 0.08rem !important;
            }

            /* Mobil panel başlığı */
            main > aside > header.builder-header {
                border-radius: 0 !important;
                padding: 0.55rem 0.85rem !important;
                min-height: 58px !important;
                box-shadow: none !important;
                border-left: 0 !important;
                border-right: 0 !important;
                border-top: 0 !important;
                flex-shrink: 0 !important;
            }
            main > aside > header h1 {
                font-size: 0.96rem !important;
                line-height: 1 !important;
            }
            main > aside > header a svg {
                width: 23px !important;
                height: 23px !important;
            }
            #themeToggleBtn {
                width: 38px !important;
                height: 38px !important;
                min-width: 38px !important;
                min-height: 38px !important;
            }

            /* Mobil ayar paneli */
            #settingsContainer {
                flex: 1 1 0 !important;
                min-height: 0 !important;
                overflow-y: auto !important;
                overflow-x: hidden !important;
                -webkit-overflow-scrolling: touch !important;
                overscroll-behavior-y: contain !important;
                border-top-left-radius: 1rem !important;
                border-top-right-radius: 1rem !important;
                padding: 0.45rem 0.55rem 0.55rem !important;
                box-shadow: none !important;
            }
            #settingsContainer > .flex.items-center.justify-center.gap-2.mb-2 {
                margin-bottom: 0.35rem !important;
            }
            #settingsContainer > .flex.items-center.justify-center.gap-2.mb-2 .tracking-\[0\.28em\] {
                font-size: 0.66rem !important;
                letter-spacing: 0.17em !important;
            }
            #settingsContainer .builder-card,
            #settingsContainer .builder-card-soft {
                border-radius: 1rem !important;
            }
            #settingsContainer .mobile-settings-layout {
                flex: 1 1 auto !important;
                min-height: 0 !important;
            }
            #settingsContainer .mobile-settings-main {
                display: grid !important;
                grid-template-columns: minmax(0, 1fr) !important;
                gap: 0.7rem !important;
                flex: 1 1 auto !important;
                min-height: 0 !important;
            }
            #settingsContainer .mobile-size-card {
                display: flex !important;
                flex-direction: column !important;
                min-height: clamp(220px, 34vh, 320px) !important;
                padding: 0.8rem !important;
                gap: 0.8rem !important;
            }
            #settingsContainer .mobile-size-segment {
                padding: 0.28rem !important;
                border-radius: 1.1rem !important;
                gap: 0.28rem !important;
                background: linear-gradient(180deg, #e8edf8 0%, #f8fbff 100%) !important;
            }
            #settingsContainer .mobile-size-tab {
                min-height: 56px !important;
                font-size: 0.98rem !important;
                line-height: 1 !important;
                letter-spacing: 0.01em !important;
                border-radius: 0.95rem !important;
                display: flex !important;
                align-items: center !important;
                justify-content: center !important;
                text-align: center !important;
                padding: 0.8rem 0.9rem !important;
            }
            #settingsContainer .mobile-size-panel {
                flex: 1 1 auto !important;
                display: flex !important;
                flex-direction: column !important;
                justify-content: center !important;
                min-height: 0 !important;
                gap: 0.65rem !important;
            }
            #settingsContainer .mobile-size-panel label {
                font-size: 0.72rem !important;
                letter-spacing: 0.18em !important;
            }
            #settingsContainer #autoSizePanel select,
            #settingsContainer #customSizePanel input {
                min-height: 58px !important;
                height: 58px !important;
                font-size: 1rem !important;
                border-radius: 1rem !important;
                padding-left: 0.95rem !important;
                padding-right: 0.95rem !important;
            }
            #settingsContainer #customSizePanel .text-\[10px\] {
                font-size: 0.78rem !important;
                line-height: 1.35 !important;
                padding: 0.8rem 0.9rem !important;
            }
            #settingsContainer .mobile-overlap-card {
                padding: 0.85rem !important;
                gap: 0.7rem !important;
                min-height: 112px !important;
            }
            #settingsContainer .builder-card {
                padding: 0.55rem !important;
            }
            #settingsContainer .builder-card-soft {
                padding: 0.55rem !important;
            }
            #settingsContainer .title-3d {
                font-size: 0.68rem !important;
                margin-bottom: 0.28rem !important;
            }
            #settingsContainer .grid {
                gap: 0.5rem !important;
            }
            #settingsContainer .builder-tabbar {
                padding: 0.24rem !important;
                border-radius: 0.95rem !important;
            }
            #settingsContainer .builder-tab {
                min-height: 38px !important;
                font-size: 0.8rem !important;
                border-radius: 0.75rem !important;
            }
            #settingsContainer .builder-select,
            #settingsContainer .builder-field,
            #settingsContainer .builder-range-wrap,
            #customHeightCm, #customWidthCm {
                min-height: 42px !important;
                height: 42px !important;
                font-size: 0.9rem !important;
                border-radius: 0.85rem !important;
            }
            #settingsContainer label.text-slate-500,
            #settingsContainer .tracking-widest.text-slate-500,
            #settingsContainer .text-slate-500.uppercase {
                font-size: 0.66rem !important;
                line-height: 1.1 !important;
                letter-spacing: 0.16em !important;
            }
            #settingsContainer .builder-action {
                min-height: 42px !important;
                font-size: 0.86rem !important;
                border-radius: 0.95rem !important;
                padding-top: 0.45rem !important;
                padding-bottom: 0.45rem !important;
            }
            #settingsContainer .text-\[10px\],
            #settingsContainer .text-xs {
                font-size: 0.68rem !important;
                line-height: 1.2 !important;
            }
            #settingsContainer #smartFitText {
                font-size: 0.7rem !important;
                line-height: 1.25 !important;
            }
            #settingsContainer .p-3 { padding: 0.55rem !important; }
            #settingsContainer .p-4 { padding: 0.65rem !important; }
            #settingsContainer .mb-3 { margin-bottom: 0.38rem !important; }
            #settingsContainer .mb-4 { margin-bottom: 0.45rem !important; }
            #settingsContainer .space-y-4 > :not([hidden]) ~ :not([hidden]) {
                margin-top: 0.45rem !important;
            }
            #settingsContainer .space-y-3 > :not([hidden]) ~ :not([hidden]) {
                margin-top: 0.38rem !important;
            }
            #settingsContainer .gap-3 { gap: 0.45rem !important; }
            #settingsContainer .gap-4 { gap: 0.55rem !important; }
            .builder-mobile-bar {
                backdrop-filter: none !important;
            }
        }

        /* ============================================================
           DARK MODE — html.dark { ... }
           Tüm aydınlık bileşenleri karanlık tema ile ezer.
           ============================================================ */
        html.dark body { color-scheme: dark; }

        /* Shell & yapısal arka planlar */
        html.dark .builder-shell { background: #111418; }
        html.dark .builder-header { background: #1a1d23; border-color: #2a2f3a; box-shadow: 0 2px 12px rgba(0,0,0,0.4); }
        html.dark .builder-header h1 { background: linear-gradient(90deg,#818cf8 0%,#a78bfa 60%,#f472b6 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }
        html.dark .builder-panel { background: #1a1d23; border-color: #2a2f3a; }
        html.dark .builder-mobile-bar { background: #1a1d23; border-top-color: #2a2f3a; }
        html.dark .builder-card { background: #1a1d23; border-color: #2a2f3a; }
        html.dark .builder-card-soft { background: #20242c; border-color: #2e3441; box-shadow: none; }

        /* Metin renkleri */
        html.dark #settingsContainer .text-slate-500,
        html.dark #settingsContainer .text-slate-400 { color: #8b97ab !important; }
        html.dark #settingsContainer .text-slate-800 { color: #e2e8f0 !important; }
        html.dark .text-slate-800 { color: #e2e8f0 !important; }
        html.dark .text-slate-700 { color: #cbd5e1 !important; }
        html.dark .text-slate-600 { color: #94a3b8 !important; }
        html.dark .text-slate-500 { color: #8b97ab !important; }
        html.dark .text-slate-400 { color: #6b7280 !important; }
        html.dark .text-indigo-700 { color: #a5b4fc !important; }
        html.dark .text-purple-700 { color: #c084fc !important; }
        html.dark .text-blue-700 { color: #93c5fd !important; }
        html.dark .text-blue-500 { color: #60a5fa !important; }

        /* Form elemanları */
        html.dark .builder-select,
        html.dark .builder-field,
        html.dark .builder-range-wrap { background: #252930; border-color: #353d4a; color: #e2e8f0; box-shadow: none; }
        html.dark .builder-select { color: #e2e8f0; }
        html.dark select option { background: #252930; color: #e2e8f0; }
        html.dark input[type="text"],
        html.dark input[type="number"] { background: #252930 !important; border-color: #353d4a !important; color: #e2e8f0 !important; }
        html.dark input::placeholder { color: #4b5563; }
        html.dark .bg-slate-50 { background-color: #252930 !important; }
        html.dark .bg-slate-100 { background-color: #20242c !important; }
        html.dark .border-slate-200 { border-color: #2e3441 !important; }
        html.dark .border-dashed { border-color: #353d4a !important; }

        /* Upload alanı */
        html.dark .builder-upload-label { background: #20242c; border-color: #3730a3; }

        /* Preview container */
        html.dark #previewContainer { background: #20242c !important; border-color: #353d4a !important; }

        /* Butonlar */
        html.dark .btn-3d-white { background: #252930 !important; color: #e2e8f0 !important; border-color: #353d4a !important; box-shadow: 0 3px 8px rgba(0,0,0,0.3) !important; }
        html.dark .btn-3d-white:hover:not(:disabled) { background: #2e3441 !important; }
        /* btn-3d-blue dark: #9aa7eb arka planı beyaz metinle 2.31:1 — #4f46e5 ile düzeltildi (6.29:1) */
        html.dark .btn-3d-blue:not(.quality-card) { background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%) !important; color: #fff !important; border-color: #4338ca !important; }

        /* Title-3d bileşenleri */
        html.dark .btn-3d-blue { background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%) !important; color: #fff !important; border-color: #4338ca !important; }
        html.dark .title-3d-blue { color: #818cf8 !important; }
        html.dark .title-3d-purple { color: #c084fc !important; }
        /* Label metinleri (#6b7280 → #8896a8 ile 5.17:1 kontrast) */
        html.dark .text-slate-500.uppercase,
        html.dark label.text-slate-500,
        html.dark .tracking-widest.text-slate-500 { color: #8896a8 !important; }

        /* Boyut modu seçici (Hazır/Özel) */
        html.dark .flex.bg-slate-100.p-1.rounded-2xl { background: #20242c !important; border-color: #2e3441 !important; }
        html.dark #sizeModeAutoBtn.bg-white,
        html.dark #sizeModeCustomBtn.bg-white { background: #2e3441 !important; color: #a5b4fc !important; box-shadow: 0 2px 6px rgba(0,0,0,0.3) !important; }
        html.dark #sizeModeAutoBtn.text-slate-500,
        html.dark #sizeModeCustomBtn.text-slate-500 { color: #6b7280 !important; }

        /* Smart fit info kutusu */
        html.dark #smartFitInfo { background: #1e2218 !important; border-color: #3d4a1e !important; }
        html.dark #smartFitInfo .text-yellow-800 { color: #fcd34d !important; }
        html.dark .bg-amber-50 { background: #1e2218 !important; }
        html.dark .border-amber-200 { border-color: #3d4a1e !important; }
        html.dark .text-amber-800 { color: #fcd34d !important; }
        html.dark .text-amber-600 { color: #f59e0b !important; }

        /* Mobil sürükleme çizgisi */
        html.dark .bg-slate-300 { background-color: #374151 !important; }

        /* Özel cm açıklama kutusu */
        html.dark .text-[10px].leading-relaxed { color: #8b97ab !important; background: #20242c !important; border-color: #2e3441 !important; }
        html.dark .text-slate-700.font-black { color: #e2e8f0 !important; }

        /* Info message bar (simülasyon altı) */
        html.dark #infoMessage { background: rgba(255,255,255,0.04) !important; border-top-color: rgba(255,255,255,0.06) !important; }
        html.dark #infoMessage * { color: #94a3b8 !important; }

        /* Araçlar kartı */
        html.dark .text-slate-500.uppercase.mb-3 { color: #6b7280 !important; }

        /* Scrollbar */
        html.dark .desktop-panel-order::-webkit-scrollbar-thumb { background: #374151; }
        html.dark #settingsContainer::-webkit-scrollbar-thumb { background: #374151; }

        /* Kalite modalı */
        html.dark #qualityModal > div { background: #1a1d23; border-color: #2a2f3a; }
        html.dark #qualityModal .bg-gradient-to-br { background: linear-gradient(135deg, #1e1b2e, #1a1d23) !important; border-color: #2a2f3a !important; }
        html.dark .quality-card { background: #20242c !important; border-color: #2e3441 !important; }
        html.dark .quality-card:hover { border-color: #4f46e5 !important; }
        html.dark .quality-card .text-slate-900 { color: #e2e8f0 !important; }
        html.dark .quality-card .text-slate-700 { color: #94a3b8 !important; }
        html.dark .quality-card.border-fuchsia-400 { border-color: #a855f7 !important; background: #1e1b2e !important; }
        html.dark .quality-card.border-emerald-400 { border-color: #10b981 !important; background: #0d1f1a !important; }
        html.dark .bg-amber-50.px-4 { background: #1e2218 !important; }
        html.dark .text-amber-800.font-semibold { color: #fcd34d !important; }

        /* Sayfa seçim modalı */
        html.dark #pageSelectionModal > div { background: #1a1d23; border-color: #2a2f3a; }
        html.dark #pageSelectionModal .bg-gradient-to-br { background: linear-gradient(135deg,#1e1b2e,#1a1d23) !important; border-color: #2a2f3a !important; }
        html.dark .rounded-\[1\.5rem\].border-2.border-slate-200.bg-white { background: #20242c !important; border-color: #2e3441 !important; }
        html.dark .rounded-\[1\.5rem\].border-2.border-slate-200.bg-white:hover { border-color: #7c3aed !important; }
        html.dark .bg-slate-100.text-slate-500 { background: #252930 !important; color: #8b97ab !important; }
        html.dark .overflow-hidden.rounded-2xl.border.border-slate-200.bg-slate-100 { background: #252930 !important; border-color: #2e3441 !important; }
        html.dark #pageSelectionSummary { color: #94a3b8 !important; }
        html.dark #pageSelectionModal .border-t.border-slate-200 { border-color: #2a2f3a !important; }
        html.dark #pageSelectionModal .bg-white.flex { background: #1a1d23 !important; }

        /* Boş sayfa uyarı modalı */
        html.dark #emptyPagesWarningModal > div { background: #1a1d23; border-color: #3d4a1e; }
        html.dark #emptyPagesWarningModal .bg-gradient-to-br { background: linear-gradient(135deg,#1e2218,#1a1d23) !important; }
        html.dark #emptyPagesWarningModal .text-slate-900 { color: #e2e8f0 !important; }
        html.dark #emptyPagesWarningModal .text-slate-700 { color: #94a3b8 !important; }
        html.dark #emptyPagesWarningModal .bg-amber-100 { background: #2a2a10 !important; border-color: #3d4a1e !important; }
        html.dark #emptyPagesWarningModal .border-b.border-amber-100 { border-color: #2a2a10 !important; }

        /* Zoom modalı */
        html.dark #zoomModal { background: rgba(0,0,0,0.95) !important; }
        html.dark #zoomModal .bg-white.text-slate-800 { background: #20242c !important; color: #e2e8f0 !important; border-color: #2e3441 !important; }

        /* Tema toggle düğmesi */
        html.dark #themeToggleBtn,
        html.dark #themeToggleMobile { background: #252930 !important; border-color: #353d4a !important; color: #a5b4fc !important; }

        /* Header'daki marka yazısı ve linkler */
        html.dark .builder-header a.text-slate-800 { color: #cbd5e1 !important; }

        /* Analiz overlay */
        html.dark #analysisOverlay { background: rgba(26,29,35,0.97) !important; }
        html.dark #analysisOverlay .text-indigo-700 { color: #a5b4fc !important; }
        html.dark #analysisOverlay .text-slate-500 { color: #8b97ab !important; }
        html.dark #analysisOverlay .bg-slate-100 { background: #252930 !important; }
        html.dark #analysisOverlay .text-slate-400 { color: #6b7280 !important; }

        /* Progress overlay (PDF) */
        html.dark #progressOverlay { background: rgba(26,29,35,0.97) !important; border-color: #064e3b !important; }
        html.dark #progressOverlay h3 { color: #6ee7b7 !important; }
        html.dark #progressOverlay .text-emerald-600 { color: #34d399 !important; }

        /* statusSimulating — aydınlık tema */
        #statusSimulating { background: rgba(255,255,255,0.93); }
        #statusSimulating #simSpinner { color: #059669; }
        #statusSimulating #simulationProgressTitle { color: #065f46; }
        #statusSimulating #desktopAnalyseInfo { color: #374151; }
        #statusSimulating #simulationProgressText { color: #064e3b; }
        #statusSimulating #simProgressTrack { background: #d1fae5; border-color: #a7f3d0; }
        #statusSimulating #simulationProgressBar { background: #10b981; }

        /* statusSimulating — karanlık tema */
        html.dark #statusSimulating { background: rgba(15,20,28,0.93); }
        html.dark #statusSimulating #simSpinner { color: #34d399; }
        html.dark #statusSimulating #simulationProgressTitle { color: #6ee7b7; }
        html.dark #statusSimulating #desktopAnalyseInfo { color: #94a3b8; }
        html.dark #statusSimulating #simulationProgressText { color: #a7f3d0; }
        html.dark #statusSimulating #simProgressTrack { background: #052e16; border-color: #064e3b; }
        html.dark #statusSimulating #simulationProgressBar { background: #34d399; }

        /* Tema geçiş animasyonu */
        body, .builder-shell, .builder-header, .builder-panel, .builder-card,
        .builder-card-soft, .builder-mobile-bar, .builder-select, .builder-field,
        .builder-upload-label, #settingsContainer, #previewContainer {
            transition: background-color 0.25s ease, border-color 0.2s ease, color 0.2s ease;
        }

    
        @media (min-width: 1024px) {
            main {
                display: flex !important;
                flex-direction: row !important;
                gap: 1rem !important;
            }
            main > section {
                flex: 1 1 0 !important;
                min-width: 0 !important;
                height: auto !important;
            }
            main > aside.desktop-panel-order {
                width: 420px !important;
                min-width: 420px !important;
                max-width: 420px !important;
                flex: 0 0 420px !important;
                height: auto !important;
                min-height: 0 !important;
                max-height: none !important;
                overflow: hidden !important;
            }
            #settingsContainer {
                flex: 1 1 0 !important;
                min-height: 0 !important;
                overflow: hidden !important;
                padding: 1rem !important;
                border-top-left-radius: 1rem !important;
                border-top-right-radius: 1rem !important;
            }
            #infoMessage {
                display: flex !important;
            }
        }

        @media (max-width: 1023px) {
            main {
                grid-template-rows: minmax(0, 46svh) minmax(0, 54svh) !important;
            }
            #infoMessage {
                display: none !important;
            }
            #settingsContainer {
                padding: 0.55rem 0.7rem 0.65rem !important;
            }
            #settingsContainer > .flex.flex-col.justify-start.lg\:space-y-4.space-y-3 {
                min-height: 100% !important;
                display: flex !important;
                flex-direction: column !important;
            }
            #settingsContainer .grid.grid-cols-1.lg\:grid-cols-1.gap-3 {
                gap: 0.65rem !important;
            }
            #settingsContainer .builder-card-soft {
                border-radius: 1.05rem !important;
            }
            #settingsContainer .builder-card-soft.p-3 {
                padding: 0.75rem !important;
            }
            #settingsContainer label.block.text-\[11px\] {
                font-size: 0.72rem !important;
                letter-spacing: 0.16em !important;
            }
            #settingsContainer #pagesSelect,
            #settingsContainer #customHeightCm,
            #settingsContainer #customWidthCm {
                min-height: 46px !important;
                height: 46px !important;
                font-size: 0.95rem !important;
            }
            #settingsContainer .builder-range-wrap {
                padding: 0.8rem 0.75rem !important;
            }
            #settingsContainer #settingsFooter {
                display: grid !important;
                grid-template-columns: 1fr 1fr !important;
                gap: 0.65rem !important;
                margin-top: auto !important;
                padding-top: 0.3rem !important;
            }
            #settingsContainer #settingsFooter .builder-action {
                min-height: 46px !important;
                font-size: 0.84rem !important;
                line-height: 1.15 !important;
                padding-left: 0.65rem !important;
                padding-right: 0.65rem !important;
                white-space: normal !important;
            }
            #settingsContainer #smartFitInfo {
                margin-top: 0.15rem !important;
            }
        }


        @media (max-width: 1023px) {
            main > aside {
                background: #eef1f5 !important;
            }
            html.dark main > aside {
                background: #1a1d23 !important;
            }
            #settingsContainer {
                overflow-y: auto !important;
                overflow-x: hidden !important;
                align-items: stretch !important;
                justify-content: flex-start !important;
                background: #eef1f5 !important;
            }
            html.dark #settingsContainer {
                background: #1a1d23 !important;
            }
            #settingsContainer > .flex.flex-col.justify-start.lg\:space-y-4.space-y-3 {
                min-height: auto !important;
                height: auto !important;
                flex: 0 0 auto !important;
                justify-content: flex-start !important;
                align-content: flex-start !important;
                padding-bottom: 0 !important;
            }
            #settingsContainer #settingsFooter {
                margin-top: 0.5rem !important;
                padding-top: 0 !important;
                flex: 0 0 auto !important;
                align-self: stretch !important;
            }
            #settingsContainer #settingsFooter:empty {
                display: none !important;
            }
        }


        @media (max-width: 1023px) {
            #virtualAssemblyModal .lg\:w-72 {
                width: 100% !important;
                height: 132px !important;
                min-height: 132px !important;
                max-height: 132px !important;
            }
            #piecesPool {
                display: flex !important;
                flex-wrap: nowrap !important;
                grid-template-columns: none !important;
                grid-auto-flow: column !important;
                align-items: stretch !important;
                align-content: stretch !important;
                gap: 0.65rem !important;
                overflow-x: auto !important;
                overflow-y: hidden !important;
                padding: 0.65rem !important;
                scroll-snap-type: none !important;
                scroll-behavior: auto !important;
                -webkit-overflow-scrolling: touch !important;
                overscroll-behavior-x: contain !important;
                touch-action: pan-x pinch-zoom !important;
                scrollbar-gutter: stable both-edges;
            }
            #piecesPool > div {
                flex: 0 0 88px !important;
                width: 88px !important;
                min-width: 88px !important;
                max-width: 88px !important;
                scroll-snap-align: none !important;
                touch-action: auto !important;
            }
            #assemblyBoardContainer {
                padding: 0.9rem !important;
                align-items: flex-start !important;
                justify-content: center !important;
            }
            #puzzleBoard {
                margin: 0 auto !important;
                max-width: 100% !important;
            }
        }



/* ============================================================
   DESKTOP PANEL — KAYDIRMASIZ KOMPAKT SIĞDIRMA (masaüstü fix)
   Telefon görünümü korunur.
   ============================================================ */
@media (min-width: 1024px) {
    main {
        gap: 0.85rem !important;
    }
    main > aside.desktop-panel-order {
        width: 404px !important;
        min-width: 404px !important;
        max-width: 404px !important;
        flex: 0 0 404px !important;
        gap: 0.75rem !important;
    }
    main > aside > header.builder-header {
        padding: 0.9rem 1rem !important;
        min-height: 64px !important;
    }
    main > aside > header h1 {
        font-size: 1.08rem !important;
        line-height: 1 !important;
    }
    #settingsContainer {
        padding: 0.75rem 0.8rem 0.7rem !important;
        overflow: hidden !important;
    }
    #settingsContainer > .flex.items-center.justify-center.gap-2.mb-2 {
        margin-bottom: 0.3rem !important;
    }
    #settingsContainer > .flex.items-center.justify-center.gap-2.mb-2 .tracking-\[0\.28em\] {
        font-size: 0.64rem !important;
        letter-spacing: 0.16em !important;
    }
    #settingsContainer .mobile-settings-layout {
        gap: 0.45rem !important;
    }
    #settingsContainer .mobile-settings-main {
        gap: 0.55rem !important;
    }
    #settingsContainer .builder-card,
    #settingsContainer .builder-card-soft {
        border-radius: 1.2rem !important;
    }
    #settingsContainer .builder-card-soft {
        padding: 0.8rem !important;
    }
    #settingsContainer .title-3d {
        font-size: 0.7rem !important;
        margin-bottom: 0.18rem !important;
    }
    #settingsContainer label.block.text-\[11px\],
    #settingsContainer label.text-slate-500,
    #settingsContainer .tracking-widest.text-slate-500,
    #settingsContainer .text-slate-500.uppercase {
        font-size: 0.63rem !important;
        line-height: 1.05 !important;
        letter-spacing: 0.15em !important;
    }
    #settingsContainer .mobile-size-segment {
        padding: 0.22rem !important;
        border-radius: 1rem !important;
    }
    #settingsContainer .mobile-size-tab {
        min-height: 40px !important;
        padding: 0.55rem 0.7rem !important;
        font-size: 0.88rem !important;
        border-radius: 0.8rem !important;
    }
    #settingsContainer .mobile-size-panel {
        gap: 0.45rem !important;
    }
    #settingsContainer .builder-select,
    #settingsContainer .builder-field,
    #settingsContainer .builder-range-wrap,
    #settingsContainer #pagesSelect,
    #settingsContainer #customHeightCm,
    #settingsContainer #customWidthCm {
        min-height: 44px !important;
        height: 44px !important;
        font-size: 0.92rem !important;
        border-radius: 0.95rem !important;
    }
    #settingsContainer .builder-range-wrap {
        padding: 0.65rem 0.75rem !important;
    }
    #settingsContainer #overlapValue {
        font-size: 0.78rem !important;
        padding: 0.34rem 0.68rem !important;
    }
    #settingsContainer .text-\[10px\],
    #settingsContainer .text-xs,
    #settingsContainer #smartFitText {
        font-size: 0.68rem !important;
        line-height: 1.2 !important;
    }
    #settingsContainer .p-3 {
        padding: 0.8rem !important;
    }
    #settingsContainer .mb-3 {
        margin-bottom: 0.3rem !important;
    }
    #settingsContainer .mb-4 {
        margin-bottom: 0.35rem !important;
    }
    #settingsContainer .space-y-4 > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0.42rem !important;
    }
    #settingsContainer .space-y-3 > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0.36rem !important;
    }
    #settingsContainer .gap-3 {
        gap: 0.5rem !important;
    }
    #settingsContainer .gap-4 {
        gap: 0.55rem !important;
    }
    #settingsContainer #smartFitInfo {
        padding: 0.7rem !important;
    }
    #desktopActionDock {
        gap: 0.5rem !important;
    }
    #desktopActionDock .builder-action,
    #downloadBtn,
    #virtualAssemblyBtn {
        min-height: 42px !important;
        height: 42px !important;
        padding-top: 0.55rem !important;
        padding-bottom: 0.55rem !important;
        padding-left: 0.9rem !important;
        padding-right: 0.9rem !important;
        font-size: 0.82rem !important;
        line-height: 1.1 !important;
        border-radius: 0.95rem !important;
    }
    #desktopActionDock .builder-action span,
    #downloadBtn span,
    #virtualAssemblyBtn span {
        white-space: nowrap !important;
    }
}


/* ============================================================
   DESKTOP PANEL — EXTRA KOMPAKT FIX (özel cm taşma düzeltme)
   Telefon görünümü aynen korunur.
   ============================================================ */
@media (min-width: 1024px) {
    body {
        gap: 0.6rem !important;
    }
    main {
        gap: 0.7rem !important;
    }
    main > aside.desktop-panel-order {
        width: 392px !important;
        min-width: 392px !important;
        max-width: 392px !important;
        flex: 0 0 392px !important;
    }
    main > aside > header.builder-header {
        padding: 0.75rem 0.9rem !important;
        min-height: 58px !important;
        border-radius: 1.45rem !important;
    }
    main > aside > header h1 {
        font-size: 0.98rem !important;
    }
    #settingsContainer {
        padding: 0.58rem 0.65rem 0.6rem !important;
    }
    #settingsContainer .builder-card-soft {
        padding: 0.68rem !important;
        border-radius: 1rem !important;
    }
    #settingsContainer .title-3d {
        font-size: 0.66rem !important;
        margin-bottom: 0.1rem !important;
    }
    #settingsContainer .mobile-size-segment {
        padding: 0.16rem !important;
        border-radius: 0.85rem !important;
    }
    #settingsContainer .mobile-size-tab {
        min-height: 34px !important;
        padding: 0.38rem 0.55rem !important;
        font-size: 0.78rem !important;
        border-radius: 0.72rem !important;
    }
    #settingsContainer .mobile-size-panel {
        gap: 0.32rem !important;
    }
    #settingsContainer .builder-select,
    #settingsContainer .builder-field,
    #settingsContainer .builder-range-wrap,
    #settingsContainer #pagesSelect,
    #settingsContainer #customHeightCm,
    #settingsContainer #customWidthCm {
        min-height: 38px !important;
        height: 38px !important;
        font-size: 0.82rem !important;
        border-radius: 0.82rem !important;
    }
    #settingsContainer #customHeightCm,
    #settingsContainer #customWidthCm {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    #settingsContainer .builder-range-wrap {
        padding: 0.48rem 0.62rem !important;
    }
    #settingsContainer label.block.text-\[11px\],
    #settingsContainer label.text-slate-500,
    #settingsContainer .tracking-widest.text-slate-500,
    #settingsContainer .text-slate-500.uppercase {
        font-size: 0.58rem !important;
        line-height: 1 !important;
        letter-spacing: 0.12em !important;
    }
    #settingsContainer .text-\[10px\],
    #settingsContainer .text-xs,
    #settingsContainer #smartFitText {
        font-size: 0.61rem !important;
        line-height: 1.12 !important;
    }
    #settingsContainer .p-3 {
        padding: 0.62rem !important;
    }
    #settingsContainer .mb-3 {
        margin-bottom: 0.22rem !important;
    }
    #settingsContainer .mb-4 {
        margin-bottom: 0.26rem !important;
    }
    #settingsContainer .space-y-4 > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0.28rem !important;
    }
    #settingsContainer .space-y-3 > :not([hidden]) ~ :not([hidden]) {
        margin-top: 0.24rem !important;
    }
    #settingsContainer .gap-3 {
        gap: 0.34rem !important;
    }
    #settingsContainer .gap-4 {
        gap: 0.4rem !important;
    }
    #settingsContainer #smartFitInfo {
        padding: 0.5rem !important;
    }
    #settingsContainer #overlapValue {
        font-size: 0.72rem !important;
        padding: 0.25rem 0.55rem !important;
    }
    #desktopActionDock {
        gap: 0.4rem !important;
        margin-top: 0.35rem !important;
    }
    #desktopActionDock .builder-action,
    #downloadBtn,
    #virtualAssemblyBtn {
        min-height: 38px !important;
        height: 38px !important;
        padding-top: 0.42rem !important;
        padding-bottom: 0.42rem !important;
        padding-left: 0.72rem !important;
        padding-right: 0.72rem !important;
        font-size: 0.74rem !important;
        border-radius: 0.82rem !important;
    }
}



/* ============================================================
   DESKTOP PANEL — FINAL HEIGHT FIT FIX
   Telefon görünümü aynen korunur.
   ============================================================ */
@media (min-width: 1024px) {
    main > aside.desktop-panel-order {
        width: 388px !important;
        min-width: 388px !important;
        max-width: 388px !important;
        flex: 0 0 388px !important;
    }
    main > aside > header.builder-header {
        padding: 0.68rem 0.82rem !important;
        min-height: 54px !important;
        border-radius: 1.35rem !important;
    }
    main > aside > header h1 {
        font-size: 0.92rem !important;
        line-height: 1 !important;
    }
    #themeToggleBtn {
        padding: 0.38rem 0.7rem !important;
        font-size: 0.72rem !important;
    }
    #settingsContainer {
        padding: 0.48rem 0.56rem 0.52rem !important;
        overflow: hidden !important;
    }
    #settingsContainer > .mobile-settings-layout {
        gap: 0.38rem !important;
    }
    #settingsContainer h2.title-3d {
        margin-bottom: 0.36rem !important;
        font-size: 0.78rem !important;
        line-height: 1 !important;
    }
    #settingsContainer .builder-card-soft,
    #settingsContainer .builder-card {
        padding: 0.54rem !important;
        border-radius: 0.92rem !important;
    }
    #settingsContainer label.block.text-\[11px\],
    #settingsContainer .text-\[11px\].font-black,
    #settingsContainer .text-\[11px\].lg\:text-xs,
    #settingsContainer .text-\[11px\] {
        font-size: 0.64rem !important;
        line-height: 1.05 !important;
        letter-spacing: 0.12em !important;
    }
    #settingsContainer .mobile-size-card {
        gap: 0.42rem !important;
    }
    #settingsContainer .mobile-size-segment {
        padding: 0.18rem !important;
        border-radius: 0.82rem !important;
    }
    #settingsContainer .mobile-size-tab {
        min-height: 36px !important;
        padding: 0.38rem 0.55rem !important;
        font-size: 0.78rem !important;
        border-radius: 0.72rem !important;
    }
    #pagesSelect,
    #customHeightCm,
    #customWidthCm {
        min-height: 36px !important;
        height: 36px !important;
        font-size: 0.8rem !important;
        border-radius: 0.74rem !important;
        padding-top: 0.35rem !important;
        padding-bottom: 0.35rem !important;
    }
    #customSizePanel .grid.grid-cols-1.gap-2 {
        gap: 0.34rem !important;
    }
    #customSizePanel .hidden.lg\:block.text-\[10px\].leading-relaxed {
        display: none !important;
    }
    #settingsContainer > .mobile-settings-layout > .mobile-settings-main {
        gap: 0.42rem !important;
    }
    #settingsContainer .builder-card-soft.flex.flex-col.justify-center {
        gap: 0.28rem !important;
        padding-top: 0.46rem !important;
        padding-bottom: 0.46rem !important;
    }
    .builder-range-wrap {
        padding: 0.22rem 0.42rem !important;
        border-radius: 0.62rem !important;
    }
    #overlapInput { height: 5px !important; }
    #overlapValue {
        font-size: 0.62rem !important;
        padding: 0.1rem 0.34rem !important;
    }
    #smartFitInfo {
        padding: 0.46rem !important;
        border-radius: 0.82rem !important;
        gap: 0.34rem !important;
    }
    #smartFitInfo p.font-extrabold {
        font-size: 0.6rem !important;
        margin-bottom: 0.05rem !important;
    }
    #smartFitText {
        font-size: 0.6rem !important;
        line-height: 1.12 !important;
    }
    #settingsContainer .hidden.lg\:block.builder-card.p-3 {
        padding: 0.5rem !important;
        margin-top: 0 !important;
    }
    #settingsContainer .hidden.lg\:block.builder-card.p-3 > .text-\[11px\] {
        margin-bottom: 0.28rem !important;
        font-size: 0.62rem !important;
    }
    #desktopActionDock {
        gap: 0.34rem !important;
    }
    #desktopActionDock .builder-action,
    #downloadBtn,
    #virtualAssemblyBtn {
        min-height: 36px !important;
        height: 36px !important;
        font-size: 0.74rem !important;
        line-height: 1 !important;
        border-radius: 0.78rem !important;
        padding: 0.3rem 0.5rem !important;
        gap: 0.22rem !important;
    }
    #desktopActionDock .builder-action svg,
    #downloadBtn svg,
    #virtualAssemblyBtn svg {
        width: 14px !important;
        height: 14px !important;
        flex: 0 0 14px !important;
    }
}