/* FUTURUSS interface themes — 2026.09.23.10
   Default intentionally preserves the current production design.
   Alternative themes are deliberately separate visual systems. */
html[data-interface-theme=default]{--ui-accent:#087f8c;--ui-radius:8px;--ui-bg:#f3f5f7;--ui-font:13px;--ui-pad:6px;--ui-field:32px}

/* Shared bridge for SPA components. Kept equivalent to the previous Default behavior. */
html[data-interface-theme] .management-view,html[data-interface-theme] .standalone-view{background:var(--ui-bg)!important}
html[data-interface-theme] .management-brand{background:var(--ui-accent)!important}
html[data-interface-theme] .management-nav-btn.router-link-active{color:var(--ui-accent)!important;border-color:var(--ui-accent)!important}
html[data-interface-theme] .spa-btn.primary,html[data-interface-theme] .session-pill.primary{background:var(--ui-accent)!important;border-color:var(--ui-accent)!important}

/* SOFT — Apple-like calm surfaces, large radii, restrained depth. */
html[data-interface-theme=soft]{--ui-accent:#007aff;--ui-radius:16px;--ui-bg:#f5f5f7;--ui-font:13px;--ui-pad:8px;--ui-field:38px;color-scheme:light}
html[data-interface-theme=soft] body{background:#f5f5f7!important;color:#1d1d1f!important;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif!important}
html[data-interface-theme=soft] .wrap{max-width:1420px!important}
html[data-interface-theme=soft] header .badge,html[data-interface-theme=soft] .management-brand,html[data-interface-theme=soft] .standalone-brand{background:#1d1d1f!important;color:#fff!important;border-radius:12px!important;box-shadow:none!important}
html[data-interface-theme=soft] .tabs{background:#ffffffcc!important;border:1px solid #e5e5ea!important;border-radius:16px!important;padding:5px!important;backdrop-filter:blur(18px) saturate(1.2)}
html[data-interface-theme=soft] .tab-btn,html[data-interface-theme=soft] .catalog-tab-btn,html[data-interface-theme=soft] .session-pill{border:0!important;border-radius:12px!important;background:transparent!important;color:#3a3a3c!important;box-shadow:none!important}
html[data-interface-theme=soft] .tab-btn.active{background:#fff!important;color:#007aff!important;box-shadow:0 1px 6px #00000010!important;border:0!important}
html[data-interface-theme=soft] .card,html[data-interface-theme=soft] .design-section,html[data-interface-theme=soft] .input-card,html[data-interface-theme=soft] .design-preview,html[data-interface-theme=soft] .management-card,html[data-interface-theme=soft] .spa-modal,html[data-interface-theme=soft] .standalone-card{background:#fff!important;border:1px solid #e5e5ea!important;border-radius:18px!important;box-shadow:0 1px 2px #00000008,0 10px 30px #0000000a!important}
html[data-interface-theme=soft] input,html[data-interface-theme=soft] select,html[data-interface-theme=soft] textarea,html[data-interface-theme=soft] .spa-password-wrap input{height:auto;border:1px solid #d1d1d6!important;border-radius:12px!important;background:#fff!important;color:#1d1d1f!important;box-shadow:inset 0 1px 1px #00000005!important}
html[data-interface-theme=soft] input:focus,html[data-interface-theme=soft] select:focus,html[data-interface-theme=soft] textarea:focus{border-color:#007aff!important;outline:3px solid #007aff22!important;outline-offset:0!important}
html[data-interface-theme=soft] button,html[data-interface-theme=soft] .spa-btn{border-radius:12px!important}
html[data-interface-theme=soft] .spa-btn.primary,html[data-interface-theme=soft] .design-actions .calc{background:#007aff!important;border-color:#007aff!important;color:white!important;box-shadow:none!important}
html[data-interface-theme=soft] #combined-card th,html[data-interface-theme=soft] .settings-table th{background:#f2f2f7!important;color:#48484a!important;border-color:#e5e5ea!important}
html[data-interface-theme=soft] .node,html[data-interface-theme=soft] .check-card{border-color:#e5e5ea!important;border-radius:14px!important;background:#fbfbfd!important}

/* EASY — maximum legibility: flat, larger controls, strong blue/green accents. */
html[data-interface-theme=easy]{--ui-accent:#1565c0;--ui-radius:7px;--ui-bg:#eef5fb;--ui-font:15px;--ui-pad:11px;--ui-field:44px;color-scheme:light}
html[data-interface-theme=easy] body{background:#eef5fb!important;color:#17324d!important;font-family:Arial,"Segoe UI",sans-serif!important;font-size:15px!important}
html[data-interface-theme=easy] .wrap{max-width:1500px!important}
html[data-interface-theme=easy] header .badge,html[data-interface-theme=easy] .management-brand,html[data-interface-theme=easy] .standalone-brand{background:#1565c0!important;border-radius:6px!important;color:#fff!important}
html[data-interface-theme=easy] .tabs{background:#fff!important;border:2px solid #bdd4e8!important;border-radius:8px!important;padding:4px!important}
html[data-interface-theme=easy] .tab-btn,html[data-interface-theme=easy] .catalog-tab-btn,html[data-interface-theme=easy] .session-pill{min-height:42px!important;border:1px solid #a9c5dd!important;border-radius:6px!important;background:#fff!important;color:#234b6b!important;font-size:14px!important;font-weight:700!important}
html[data-interface-theme=easy] .tab-btn.active{background:#1565c0!important;color:#fff!important;border-color:#1565c0!important;box-shadow:none!important}
html[data-interface-theme=easy] .card,html[data-interface-theme=easy] .design-section,html[data-interface-theme=easy] .input-card,html[data-interface-theme=easy] .design-preview,html[data-interface-theme=easy] .management-card,html[data-interface-theme=easy] .spa-modal,html[data-interface-theme=easy] .standalone-card{background:#fff!important;border:2px solid #c8dceb!important;border-radius:9px!important;box-shadow:none!important}
html[data-interface-theme=easy] .design-section h3,html[data-interface-theme=easy] h2,html[data-interface-theme=easy] .section-title{color:#17324d!important;font-weight:800!important}
html[data-interface-theme=easy] input,html[data-interface-theme=easy] select,html[data-interface-theme=easy] textarea,html[data-interface-theme=easy] .spa-password-wrap input{min-height:44px!important;border:2px solid #9dbbd3!important;border-radius:6px!important;background:#fff!important;color:#102c45!important;font-size:15px!important}
html[data-interface-theme=easy] input:focus,html[data-interface-theme=easy] select:focus,html[data-interface-theme=easy] textarea:focus{border-color:#1565c0!important;outline:3px solid #90caf966!important}
html[data-interface-theme=easy] button,html[data-interface-theme=easy] .spa-btn{min-height:42px!important;border-radius:6px!important;font-size:14px!important;font-weight:700!important}
html[data-interface-theme=easy] .spa-btn.primary,html[data-interface-theme=easy] .design-actions .calc{background:#137333!important;border-color:#137333!important;color:#fff!important}
html[data-interface-theme=easy] #combined-card th,html[data-interface-theme=easy] .settings-table th{background:#dcecf8!important;color:#17324d!important;border-bottom:2px solid #9dbbd3!important;font-size:12px!important}
html[data-interface-theme=easy] .hint,html[data-interface-theme=easy] .meta{color:#4c667d!important;font-size:12px!important}
html[data-interface-theme=easy] .node{border:2px solid #c8dceb!important;border-radius:8px!important}

/* GLOSSY — glass, gradients, reflections and floating translucent layers. */
html[data-interface-theme=glossy]{--ui-accent:#00a3b8;--ui-radius:20px;--ui-bg:#dceff4;--ui-font:13px;--ui-pad:9px;--ui-field:40px;color-scheme:light}
html[data-interface-theme=glossy] body{background:radial-gradient(circle at 5% -10%,#92e7f0 0,transparent 36%),radial-gradient(circle at 95% 0,#cbbcff 0,transparent 34%),radial-gradient(circle at 50% 110%,#ffd9ea 0,transparent 38%),linear-gradient(145deg,#dfeff4,#eef0f8 52%,#e7f5f4)!important;background-attachment:fixed!important;color:#17313b!important}
html[data-interface-theme=glossy] header .badge,html[data-interface-theme=glossy] .management-brand,html[data-interface-theme=glossy] .standalone-brand{background:linear-gradient(135deg,#0e879a,#7457d9)!important;color:#fff!important;border:1px solid #ffffff7a!important;border-radius:16px!important;box-shadow:0 10px 24px #315d8033,inset 0 1px 0 #ffffff99!important}
html[data-interface-theme=glossy] .tabs{background:#ffffff75!important;border:1px solid #ffffffb8!important;border-radius:20px!important;padding:6px!important;backdrop-filter:blur(22px) saturate(1.45);box-shadow:0 15px 45px #345d7930,inset 0 1px 0 #fff!important}
html[data-interface-theme=glossy] .tab-btn,html[data-interface-theme=glossy] .catalog-tab-btn,html[data-interface-theme=glossy] .session-pill{border:1px solid #ffffff9e!important;border-radius:15px!important;background:linear-gradient(180deg,#ffffffc9,#ffffff73)!important;color:#274858!important;box-shadow:inset 0 1px 0 #fff,0 6px 16px #355d7315!important}
html[data-interface-theme=glossy] .tab-btn.active{background:linear-gradient(135deg,#00a3b8,#6654cf)!important;color:#fff!important;border-color:#ffffff8a!important;box-shadow:0 8px 20px #35677d36,inset 0 1px 0 #ffffff80!important}
html[data-interface-theme=glossy] .card,html[data-interface-theme=glossy] .design-section,html[data-interface-theme=glossy] .input-card,html[data-interface-theme=glossy] .design-preview,html[data-interface-theme=glossy] .management-card,html[data-interface-theme=glossy] .spa-modal,html[data-interface-theme=glossy] .standalone-card{background:linear-gradient(145deg,#ffffffc7,#ffffff83)!important;border:1px solid #ffffffcc!important;border-radius:22px!important;backdrop-filter:blur(24px) saturate(1.4);box-shadow:0 18px 50px #345d792b,inset 0 1px 0 #fff,inset 0 -1px 0 #ffffff4f!important}
html[data-interface-theme=glossy] input,html[data-interface-theme=glossy] select,html[data-interface-theme=glossy] textarea,html[data-interface-theme=glossy] .spa-password-wrap input{background:linear-gradient(180deg,#ffffffde,#ffffff9f)!important;border:1px solid #ffffff!important;border-radius:14px!important;color:#17313b!important;box-shadow:inset 0 1px 1px #fff,0 6px 14px #355d7313!important}
html[data-interface-theme=glossy] input:focus,html[data-interface-theme=glossy] select:focus,html[data-interface-theme=glossy] textarea:focus{border-color:#5bd7e6!important;outline:4px solid #19b5c52b!important}
html[data-interface-theme=glossy] .spa-btn.primary,html[data-interface-theme=glossy] .design-actions .calc{background:linear-gradient(135deg,#00a3b8,#6854d9)!important;border:1px solid #ffffff75!important;color:#fff!important;box-shadow:0 10px 22px #37667e30,inset 0 1px 0 #ffffff7d!important}
html[data-interface-theme=glossy] #combined-card th,html[data-interface-theme=glossy] .settings-table th{background:#ffffff8f!important;color:#315165!important;border-color:#ffffffb5!important}
html[data-interface-theme=glossy] .node,html[data-interface-theme=glossy] .check-card{background:#ffffff73!important;border:1px solid #ffffffbd!important;border-radius:16px!important;backdrop-filter:blur(16px)}

/* MATERIAL — Material 3 inspired surfaces, tonal containers and filled pills. */
html[data-interface-theme=material]{--ui-accent:#6750a4;--ui-radius:12px;--ui-bg:#f7f2fa;--ui-font:13px;--ui-pad:8px;--ui-field:40px;color-scheme:light}
html[data-interface-theme=material] body{background:#f7f2fa!important;color:#1d1b20!important;font-family:Roboto,"Segoe UI",Arial,sans-serif!important}
html[data-interface-theme=material] header .badge,html[data-interface-theme=material] .management-brand,html[data-interface-theme=material] .standalone-brand{background:#6750a4!important;color:#fff!important;border-radius:20px!important;box-shadow:0 1px 2px #0003!important}
html[data-interface-theme=material] .tabs{background:#f3edf7!important;border:0!important;border-radius:24px!important;padding:5px!important;box-shadow:none!important}
html[data-interface-theme=material] .tab-btn,html[data-interface-theme=material] .catalog-tab-btn,html[data-interface-theme=material] .session-pill{border:0!important;border-radius:20px!important;background:transparent!important;color:#49454f!important;font-weight:600!important;box-shadow:none!important}
html[data-interface-theme=material] .tab-btn.active{background:#e8def8!important;color:#1d192b!important;border:0!important;box-shadow:none!important}
html[data-interface-theme=material] .card,html[data-interface-theme=material] .design-section,html[data-interface-theme=material] .input-card,html[data-interface-theme=material] .design-preview,html[data-interface-theme=material] .management-card,html[data-interface-theme=material] .spa-modal,html[data-interface-theme=material] .standalone-card{background:#fffbfe!important;border:0!important;border-radius:16px!important;box-shadow:0 1px 2px #1d1b2030,0 2px 6px #1d1b2014!important}
html[data-interface-theme=material] .design-section{background:#f7f2fa!important}
html[data-interface-theme=material] input,html[data-interface-theme=material] select,html[data-interface-theme=material] textarea,html[data-interface-theme=material] .spa-password-wrap input{min-height:40px!important;background:#fffbfe!important;border:1px solid #79747e!important;border-radius:4px 4px 0 0!important;border-bottom:2px solid #6750a4!important;color:#1d1b20!important;box-shadow:none!important}
html[data-interface-theme=material] input:focus,html[data-interface-theme=material] select:focus,html[data-interface-theme=material] textarea:focus{border-color:#6750a4!important;outline:0!important;background:#f9f5ff!important}
html[data-interface-theme=material] button,html[data-interface-theme=material] .spa-btn{border-radius:20px!important;box-shadow:none!important}
html[data-interface-theme=material] .spa-btn.primary,html[data-interface-theme=material] .design-actions .calc{background:#6750a4!important;border-color:#6750a4!important;color:#fff!important;border-radius:22px!important;box-shadow:0 1px 2px #0003!important}
html[data-interface-theme=material] .spa-btn:not(.primary),html[data-interface-theme=material] .session-pill{background:#fffbfe!important;border:1px solid #79747e!important;color:#49454f!important}
html[data-interface-theme=material] #combined-card th,html[data-interface-theme=material] .settings-table th{background:#eaddff!important;color:#21005d!important;border-color:#cac4d0!important}
html[data-interface-theme=material] .node,html[data-interface-theme=material] .check-card{background:#f3edf7!important;border:0!important;border-radius:12px!important}
html[data-interface-theme=material] .tag{background:#e8def8!important;color:#4a4458!important;border-radius:8px!important}

@media(max-width:760px){
 html[data-interface-theme=soft] .tabs,html[data-interface-theme=glossy] .tabs,html[data-interface-theme=material] .tabs{border-radius:14px!important}
 html[data-interface-theme=easy] body{font-size:14px!important}
}

/* Final high-specificity controls: legacy calculator has compact !important rules. */
html[data-interface-theme=soft] .input-card input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=soft] .input-card select,
html[data-interface-theme=soft] .design-section input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=soft] .design-section select{height:38px!important;min-height:38px!important;padding:7px 10px!important;border-radius:12px!important;font-size:13px!important}
html[data-interface-theme=soft] .input-card button.calc,html[data-interface-theme=soft] .input-card button.ghost{height:38px!important;min-height:38px!important;border-radius:12px!important;font-size:12px!important}
html[data-interface-theme=soft] .input-card #futuruss-extra-options label:has(input[type=checkbox]){border-radius:10px!important;background:#f2f2f7!important;border-color:#e5e5ea!important;color:#3a3a3c!important;padding:7px 9px!important}
html[data-interface-theme=soft] .input-card #futuruss-extra-options label:has(input:checked){background:#007aff!important;border-color:#007aff!important;color:#fff!important}

html[data-interface-theme=easy] .input-card input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=easy] .input-card select,
html[data-interface-theme=easy] .design-section input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=easy] .design-section select{height:44px!important;min-height:44px!important;padding:8px 11px!important;border:2px solid #9dbbd3!important;border-radius:6px!important;font-size:15px!important}
html[data-interface-theme=easy] .input-card button.calc,html[data-interface-theme=easy] .input-card button.ghost{height:44px!important;min-height:44px!important;border-radius:6px!important;font-size:14px!important}
html[data-interface-theme=easy] .input-card #futuruss-extra-options label:has(input[type=checkbox]){min-height:42px!important;border:2px solid #b7cee0!important;border-radius:6px!important;background:#fff!important;color:#234b6b!important;font-size:13px!important;padding:9px!important}
html[data-interface-theme=easy] .input-card #futuruss-extra-options label:has(input:checked){background:#1565c0!important;border-color:#1565c0!important;color:#fff!important}

html[data-interface-theme=glossy] .input-card input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=glossy] .input-card select,
html[data-interface-theme=glossy] .design-section input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=glossy] .design-section select{height:40px!important;min-height:40px!important;padding:8px 11px!important;border:1px solid #ffffff!important;border-radius:14px!important;font-size:13px!important;background:linear-gradient(180deg,#ffffffdf,#ffffffa8)!important;box-shadow:inset 0 1px 0 #fff,0 6px 14px #355d7313!important}
html[data-interface-theme=glossy] .input-card button.calc,html[data-interface-theme=glossy] .input-card button.ghost{height:40px!important;min-height:40px!important;border-radius:14px!important;font-size:12px!important}
html[data-interface-theme=glossy] .input-card #futuruss-extra-options label:has(input[type=checkbox]){border:1px solid #ffffffc7!important;border-radius:14px!important;background:#ffffff7d!important;color:#315165!important;padding:8px 10px!important;box-shadow:inset 0 1px 0 #fff!important}
html[data-interface-theme=glossy] .input-card #futuruss-extra-options label:has(input:checked){background:linear-gradient(135deg,#00a3b8,#6854d9)!important;border-color:#ffffff9c!important;color:#fff!important}

html[data-interface-theme=material] .input-card input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=material] .input-card select,
html[data-interface-theme=material] .design-section input:not([type=checkbox]):not([type=hidden]),
html[data-interface-theme=material] .design-section select{height:42px!important;min-height:42px!important;padding:8px 11px!important;background:#fffbfe!important;border:1px solid #79747e!important;border-bottom:2px solid #6750a4!important;border-radius:4px 4px 0 0!important;font-size:13px!important}
html[data-interface-theme=material] .input-card button.calc,html[data-interface-theme=material] .input-card button.ghost{height:40px!important;min-height:40px!important;border-radius:20px!important;font-size:12px!important}
html[data-interface-theme=material] .input-card #futuruss-extra-options label:has(input[type=checkbox]){border:0!important;border-radius:12px!important;background:#f3edf7!important;color:#49454f!important;padding:8px 10px!important}
html[data-interface-theme=material] .input-card #futuruss-extra-options label:has(input:checked){background:#e8def8!important;color:#21005d!important;box-shadow:inset 0 0 0 1px #6750a4!important}