
/* === ILOVETOOLS UNIVERSAL COLOR UI V16.4 START === */
:root{--ui-blue:#3b82f6;--ui-purple:#8b5cf6;--ui-cyan:#06b6d4;--ui-green:#22c55e;--ui-orange:#f59e0b;--ui-pink:#ec4899}
html:not([data-theme="dark"]) body{background:radial-gradient(circle at 7% 5%,rgba(59,130,246,.055),transparent 22%),radial-gradient(circle at 92% 12%,rgba(168,85,247,.045),transparent 24%),#f7f9fc}
.tool-card{--card-accent:#3b82f6;--card-rgb:59,130,246;position:relative;overflow:hidden;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease,background .16s ease}
.tool-card:nth-child(8n+1){--card-accent:#3b82f6;--card-rgb:59,130,246}.tool-card:nth-child(8n+2){--card-accent:#8b5cf6;--card-rgb:139,92,246}.tool-card:nth-child(8n+3){--card-accent:#06b6d4;--card-rgb:6,182,212}.tool-card:nth-child(8n+4){--card-accent:#22c55e;--card-rgb:34,197,94}.tool-card:nth-child(8n+5){--card-accent:#f59e0b;--card-rgb:245,158,11}.tool-card:nth-child(8n+6){--card-accent:#ec4899;--card-rgb:236,72,153}.tool-card:nth-child(8n+7){--card-accent:#14b8a6;--card-rgb:20,184,166}.tool-card:nth-child(8n+8){--card-accent:#f97316;--card-rgb:249,115,22}
.tool-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--card-accent),transparent 82%);opacity:.78}
html:not([data-theme="dark"]) .tool-card{background:radial-gradient(circle at 100% 0%,rgba(var(--card-rgb),.085),transparent 38%),linear-gradient(145deg,#fff,#fbfdff);border-color:rgba(var(--card-rgb),.17);box-shadow:0 8px 22px rgba(var(--card-rgb),.045)}
html:not([data-theme="dark"]) .tool-card:hover{transform:translateY(-3px);border-color:rgba(var(--card-rgb),.38);box-shadow:0 16px 34px rgba(var(--card-rgb),.12)}
html[data-theme="dark"] .tool-card{background:radial-gradient(circle at 100% 0%,rgba(var(--card-rgb),.10),transparent 38%),linear-gradient(145deg,#1b1e27,#161920);border-color:rgba(var(--card-rgb),.14)}
html[data-theme="dark"] .tool-card:hover{border-color:rgba(var(--card-rgb),.34);box-shadow:0 16px 36px rgba(0,0,0,.26),0 0 0 1px rgba(var(--card-rgb),.06)}
.tool-card .tool-badge,.tool-card .card-badge,.tool-card span.badge{background:rgba(var(--card-rgb),.13)!important;border:1px solid rgba(var(--card-rgb),.20)!important;color:var(--card-accent)!important}
html:not([data-theme="dark"]) .catalog-toolbar,html:not([data-theme="dark"]) .runner-panel,html:not([data-theme="dark"]) .result-card{border-color:#dbe5f1;box-shadow:0 12px 32px rgba(37,99,235,.055)}
html:not([data-theme="dark"]) .catalog-toolbar{background:linear-gradient(100deg,#fff,#f7fbff 52%,#faf7ff)}
html:not([data-theme="dark"]) .runner-panel{background:radial-gradient(circle at 100% 0%,rgba(59,130,246,.055),transparent 30%),linear-gradient(145deg,#fff,#fbfdff)}
html:not([data-theme="dark"]) .result-card{background:radial-gradient(circle at 100% 0%,rgba(34,197,94,.055),transparent 30%),linear-gradient(145deg,#fff,#fbfffd)}
html:not([data-theme="dark"]) .form-field input,html:not([data-theme="dark"]) .form-field select,html:not([data-theme="dark"]) .form-field textarea{background:linear-gradient(180deg,#fff,#fbfdff);border-color:#d4e0ed;transition:border-color .15s,box-shadow .15s,background .15s}
html:not([data-theme="dark"]) .form-field input:focus,html:not([data-theme="dark"]) .form-field select:focus,html:not([data-theme="dark"]) .form-field textarea:focus{border-color:#60a5fa!important;box-shadow:0 0 0 3px rgba(59,130,246,.11)!important;background:#fff}
html:not([data-theme="dark"]) .tool-primary{background:linear-gradient(135deg,#3b82f6,#06b6d4)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 8px 20px rgba(59,130,246,.17)}
html:not([data-theme="dark"]) .tool-primary:hover{box-shadow:0 11px 24px rgba(59,130,246,.24);transform:translateY(-1px)}
html:not([data-theme="dark"]) .tool-error{background:#fff1f2;border-color:#fecdd3;color:#be123c}html:not([data-theme="dark"]) .tool-tip{background:linear-gradient(120deg,#eff6ff,#ecfeff);border-color:#c7e7fb;color:#27527a}
html:not([data-theme="dark"]) table thead th{background:linear-gradient(180deg,#f3f7ff,#eef4fb)}html:not([data-theme="dark"]) table tbody tr:hover td{background:rgba(59,130,246,.035)}
/* === ILOVETOOLS UNIVERSAL COLOR UI V16.4 END === */
