.lemyox-login-screen,
.lemyox-app {
    min-height: 100vh;
    background: #070d19;
    color: #f8fafc;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.5;
}

/* Projects dashboard: intentionally scoped so the editor and other app views keep their existing UI. */
.lemyox-app[data-current-view="projects"] {
    --project-bg: #0b1118;
    --project-sidebar: #080e14;
    --project-panel: #111922;
    --project-panel-soft: #0e161f;
    --project-border: #26313b;
    --project-text: #f6f8fb;
    --project-muted: #8e99a5;
    --project-orange: #ff7300;
    --project-green: #62cf7b;
    background: var(--project-bg);
    color: var(--project-text);
    grid-template-columns: 258px minmax(0, 1fr);
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] {
    --project-bg: #f7f8fa;
    --project-sidebar: #fff;
    --project-panel: #fff;
    --project-panel-soft: #fafbfc;
    --project-border: #e3e7eb;
    --project-text: #15191e;
    --project-muted: #69727d;
    --project-green: #249447;
}

.lemyox-brand-home {
    align-items: center;
    color: inherit;
    display: flex;
    gap: 10px;
    min-width: 0;
    text-decoration: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-sidebar {
    background: var(--project-sidebar);
    border-color: var(--project-border);
    padding: 18px 12px 12px;
}

.lemyox-app[data-current-view="projects"] .lemyox-brand {
    border-color: var(--project-border);
    margin: 0 8px 12px;
    padding: 0 0 16px;
}

.lemyox-app[data-current-view="projects"] .lemyox-brand-mark,
.lemyox-app[data-current-view="projects"] .lemyox-brand-text span {
    display: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-brand-text strong {
    color: var(--project-text);
    font-size: 27px;
    letter-spacing: -.7px;
}

.lemyox-app[data-current-view="projects"] .lemyox-brand-text strong::first-letter {
    color: inherit;
}

.lemyox-app[data-current-view="projects"] .lemyox-nav {
    gap: 2px;
}

.lemyox-app[data-current-view="projects"] .lemyox-nav-label {
    color: var(--project-muted);
    font-size: 10px;
    margin: 13px 10px 5px;
}

.lemyox-app[data-current-view="projects"] .lemyox-nav-item {
    border: 0;
    border-left: 2px solid transparent;
    border-radius: 5px;
    color: var(--project-muted);
    font-size: 12px;
    min-height: 35px;
    padding: 7px 10px;
}

.lemyox-app[data-current-view="projects"] .lemyox-nav-item:hover,
.lemyox-app[data-current-view="projects"] .lemyox-nav-item.is-active {
    background: color-mix(in srgb, var(--project-text) 7%, transparent);
    border-left-color: var(--project-orange);
    color: var(--project-text);
}

.lemyox-app[data-current-view="projects"] .lemyox-nav-item.is-active svg {
    color: var(--project-orange);
}

.lemyox-app[data-current-view="projects"] .lemyox-sidebar-bottom {
    border-color: var(--project-border);
}

.lemyox-app[data-current-view="projects"] .lemyox-storage-card {
    background: var(--project-panel);
    border-color: var(--project-border);
    box-shadow: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-storage-card .lemyox-gradient-btn {
    background: transparent;
    border-color: var(--project-orange);
    color: var(--project-text);
}

.lemyox-app[data-current-view="projects"] .lemyox-user-box {
    display: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-main {
    background: var(--project-bg);
    padding: 0;
}

.lemyox-app[data-current-view="projects"] .lemyox-main > .lemyox-topbar,
.lemyox-app[data-current-view="projects"] .lemyox-main > .lemyox-stepper {
    display: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-route[data-route="projects"] {
    margin: 0;
}

.lemyox-projects-page {
    min-height: 100vh;
    padding: 18px 22px 24px;
}

.lemyox-projects-header {
    align-items: center;
    display: flex;
    gap: 18px;
    margin-bottom: 18px;
}

.lemyox-projects-header .lemyox-mobile-menu {
    display: none;
}

.lemyox-projects-heading {
    margin-right: auto;
}

.lemyox-projects-heading h2 {
    color: var(--project-text);
    font-size: 24px;
    line-height: 1.2;
    margin: 0 0 5px;
}

.lemyox-projects-heading p {
    color: var(--project-muted);
    font-size: 12px;
    margin: 0;
}

.lemyox-projects-header-actions {
    align-items: center;
    display: flex;
    gap: 10px;
}

.lemyox-project-search {
    align-items: center;
    background: var(--project-panel-soft);
    border: 1px solid var(--project-border);
    border-radius: 7px;
    display: flex;
    min-width: 290px;
    padding: 0 12px;
}

.lemyox-project-search input {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: var(--project-text) !important;
    height: 40px;
    min-width: 0;
    padding: 0 8px !important;
    width: 100%;
}

.lemyox-project-icon-button {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--project-muted);
    display: inline-flex;
    height: 40px;
    justify-content: center;
    position: relative;
    text-decoration: none;
    width: 40px;
}

.lemyox-project-icon-button b {
    background: var(--project-orange);
    border-radius: 10px;
    color: #fff;
    font-size: 9px;
    line-height: 15px;
    position: absolute;
    right: 1px;
    top: 0;
    width: 15px;
}

.lemyox-project-form {
    display: flex;
}

.lemyox-project-form input {
    background: var(--project-panel-soft) !important;
    border: 1px solid var(--project-border) !important;
    border-radius: 6px 0 0 6px !important;
    color: var(--project-text) !important;
    max-width: 150px;
    padding: 0 10px !important;
}

.lemyox-project-form button {
    background: var(--project-orange);
    border: 1px solid var(--project-orange);
    border-radius: 6px;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
    min-height: 42px;
    padding: 0 18px;
}

.lemyox-project-stats {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 18px;
}

.lemyox-project-stats article {
    align-items: flex-start;
    background: var(--project-panel);
    border: 1px solid var(--project-border);
    border-radius: 7px;
    display: flex;
    gap: 13px;
    min-height: 108px;
    padding: 17px;
}

.lemyox-project-stat-icon {
    align-items: center;
    border: 1px solid var(--project-border);
    border-radius: 7px;
    color: var(--project-muted);
    display: flex;
    font-size: 23px;
    height: 39px;
    justify-content: center;
    width: 39px;
}

.lemyox-project-stat-icon.is-green {
    border-color: var(--project-green);
    color: var(--project-green);
}

.lemyox-project-stats article div {
    display: grid;
    flex: 1;
    gap: 5px;
    min-width: 0;
}

.lemyox-project-stats small,
.lemyox-project-stats i,
.lemyox-project-stats em {
    color: var(--project-muted);
    font-size: 10px;
    font-style: normal;
}

.lemyox-project-stats strong {
    color: var(--project-text);
    font-size: 21px;
}

.lemyox-project-stats strong i {
    font-weight: 400;
}

.lemyox-project-stats em.is-up {
    color: var(--project-green);
}

.lemyox-project-stats em.is-down {
    color: var(--project-orange);
}

.lemyox-project-stat-progress {
    background: var(--project-border);
    border-radius: 5px;
    height: 4px;
    margin-top: 6px;
    overflow: hidden;
}

.lemyox-project-stat-progress b {
    background: var(--project-orange);
    display: block;
    height: 100%;
}

.lemyox-project-controls {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    position: relative;
}

.lemyox-project-tabs,
.lemyox-project-view-switch,
.lemyox-project-control-actions {
    display: flex;
}

.lemyox-project-tabs {
    border: 1px solid var(--project-border);
    border-radius: 6px;
    overflow: hidden;
}

.lemyox-project-tabs button,
.lemyox-project-view-switch button,
.lemyox-project-filter-button,
.lemyox-project-control-actions select {
    background: var(--project-panel-soft);
    border: 0;
    color: var(--project-muted);
    cursor: pointer;
    min-height: 40px;
    padding: 0 18px;
}

.lemyox-project-tabs button + button,
.lemyox-project-view-switch button + button {
    border-left: 1px solid var(--project-border);
}

.lemyox-project-tabs button.is-active,
.lemyox-project-view-switch button.is-active {
    color: var(--project-orange);
}

.lemyox-project-control-actions {
    align-items: center;
    flex-wrap: nowrap;
    gap: 10px;
    white-space: nowrap;
}

.lemyox-project-control-actions select,
.lemyox-project-filter-button,
.lemyox-project-view-switch {
    border: 1px solid var(--project-border);
    border-radius: 6px;
    overflow: hidden;
}

.lemyox-project-view-switch {
    align-items: center;
    flex: 0 0 auto;
}

.lemyox-project-view-switch button {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
}

.lemyox-project-view-switch svg {
    display: block;
    fill: none;
    height: 18px;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
    width: 18px;
}

.lemyox-project-view-switch [data-project-view="grid"] svg {
    fill: currentColor;
    stroke: none;
}

.lemyox-project-filter-button {
    align-items: center;
    display: inline-flex;
    flex: 0 0 auto;
    gap: 6px;
    justify-content: center;
    white-space: nowrap;
}

.lemyox-project-filter-panel {
    background: var(--project-panel);
    border: 1px solid var(--project-border);
    border-radius: 6px;
    padding: 10px;
    position: absolute;
    right: 0;
    top: 48px;
    z-index: 8;
}

.lemyox-projects-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lemyox-project-tile {
    background: var(--project-panel);
    border: 1px solid var(--project-border);
    border-radius: 7px;
    color: var(--project-text);
    min-width: 0;
    position: relative;
}

.lemyox-project-cover {
    aspect-ratio: 1.95 / 1;
    background: var(--project-panel-soft);
    border-radius: 6px 6px 0 0;
    display: block;
    overflow: hidden;
    position: relative;
}

.lemyox-project-cover img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.lemyox-project-cover-placeholder {
    align-items: center;
    color: var(--project-muted);
    display: flex;
    font-size: 22px;
    height: 100%;
    justify-content: center;
}

.lemyox-project-cover b {
    background: #26343f;
    border: 1px solid #5d6d79;
    border-radius: 5px;
    color: #dce4ea;
    font-size: 9px;
    left: 8px;
    padding: 5px 8px;
    position: absolute;
    top: 8px;
}

.lemyox-project-cover b.is-processing {
    background: #402914;
    border-color: #a35d1f;
    color: #ff9b38;
}

.lemyox-project-cover b.is-completed {
    background: #173624;
    border-color: #367d4c;
    color: #78dc91;
}

.lemyox-project-tile-body {
    padding: 10px 12px 11px;
    position: relative;
}

.lemyox-project-tile h3 {
    font-size: 13px;
    margin: 0 0 7px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-project-tile h3 a {
    color: var(--project-text);
    text-decoration: none;
}

.lemyox-project-meta,
.lemyox-project-updated {
    color: var(--project-muted);
    display: flex;
    font-size: 10px;
    gap: 14px;
}

.lemyox-project-updated {
    align-items: center;
    justify-content: space-between;
    margin-top: 6px;
}

.lemyox-project-updated button {
    background: transparent;
    border: 0;
    color: var(--project-muted);
    cursor: pointer;
    font-size: 19px;
    padding: 0 2px;
}

.lemyox-project-menu {
    background: var(--project-panel);
    border: 1px solid var(--project-border);
    border-radius: 6px;
    bottom: 33px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .24);
    min-width: 125px;
    padding: 5px;
    position: absolute;
    right: 9px;
    z-index: 9;
}

.lemyox-project-menu.is-floating {
    bottom: auto;
    position: fixed;
    right: auto;
    z-index: 10000;
}

.lemyox-project-menu a,
.lemyox-project-menu button {
    background: transparent;
    border: 0;
    border-radius: 4px;
    color: var(--project-text);
    cursor: pointer;
    display: block;
    font: inherit;
    padding: 7px 9px;
    text-align: left;
    text-decoration: none;
    width: 100%;
}

.lemyox-project-menu a:hover,
.lemyox-project-menu button:hover {
    background: var(--project-panel-soft);
}

.lemyox-project-menu .is-danger {
    color: #ff716a;
}

.lemyox-projects-grid.is-list-view {
    grid-template-columns: 1fr;
}

.lemyox-projects-grid.is-list-view .lemyox-project-tile {
    align-items: center;
    display: grid;
    grid-template-columns: 190px 1fr;
}

.lemyox-projects-grid.is-list-view .lemyox-project-cover {
    border-radius: 6px 0 0 6px;
}

.lemyox-project-upgrade {
    align-items: center;
    background: var(--project-panel);
    border: 1px solid var(--project-orange);
    border-radius: 7px;
    color: var(--project-muted);
    display: flex;
    font-size: 11px;
    gap: 24px;
    margin-top: 18px;
    padding: 13px 18px;
}

.lemyox-project-upgrade-icon {
    color: #f6b84b;
    font-size: 29px;
}

.lemyox-project-upgrade div {
    display: grid;
    gap: 3px;
    margin-right: auto;
}

.lemyox-project-upgrade strong {
    color: var(--project-text);
    font-size: 13px;
}

.lemyox-project-upgrade a {
    background: var(--project-orange);
    border-radius: 5px;
    color: #fff;
    font-weight: 700;
    padding: 11px 18px;
    text-decoration: none;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-cover b.is-draft {
    background: rgba(255,255,255,.85);
    color: #4c5964;
}

@media (max-width: 1399px) {
    .lemyox-projects-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lemyox-project-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lemyox-project-upgrade > span:not(.lemyox-project-upgrade-icon) { display: none; }
}

@media (max-width: 1100px) {
    .lemyox-projects-header { align-items: flex-start; }
    .lemyox-projects-header-actions { flex-wrap: wrap; justify-content: flex-end; }
    .lemyox-project-search { min-width: 230px; }
    .lemyox-projects-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .lemyox-app[data-current-view="projects"] { display: block; }
    .lemyox-app[data-current-view="projects"] .lemyox-sidebar { width: 270px; }
    .lemyox-projects-header .lemyox-mobile-menu { display: inline-flex; }
    .lemyox-projects-header { flex-wrap: wrap; }
    .lemyox-projects-header-actions { width: 100%; }
    .lemyox-project-search { flex: 1; }
    .lemyox-project-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .lemyox-projects-page { padding: 14px 12px 20px; }
    .lemyox-projects-heading h2 { font-size: 20px; }
    .lemyox-projects-header-actions { justify-content: stretch; }
    .lemyox-project-search { flex-basis: calc(100% - 100px); min-width: 0; }
    .lemyox-project-form { width: 100%; }
    .lemyox-project-form input { flex: 1; max-width: none; }
    .lemyox-project-stats,
    .lemyox-projects-grid { grid-template-columns: 1fr; }
    .lemyox-project-controls { align-items: stretch; flex-direction: column; gap: 10px; }
    .lemyox-project-tabs { overflow-x: auto; }
    .lemyox-project-tabs button { flex: 0 0 auto; padding: 0 13px; }
    .lemyox-project-control-actions { justify-content: flex-start; overflow-x: auto; }
    .lemyox-project-filter-button span { display: inline; }
    .lemyox-project-upgrade { align-items: flex-start; flex-wrap: wrap; }
    .lemyox-project-upgrade a { margin-left: auto; }
}

.lemyox-app *,
.lemyox-login-screen * {
    box-sizing: border-box;
}

.lemyox-app ::selection,
.lemyox-login-screen ::selection {
    background: rgba(255, 122, 26, 0.35);
    color: #fff;
}

.lemyox-app a,
.lemyox-app button,
.lemyox-app input,
.lemyox-app select,
.lemyox-app textarea {
    font: inherit;
}

.lemyox-login-screen {
    display: grid;
    place-items: center;
    padding: 24px;
}

.lemyox-login-card,
.lemyox-card,
.lemyox-stat-card,
.lemyox-table-card {
    background: linear-gradient(180deg, rgba(21, 29, 44, 0.96), rgba(17, 24, 39, 0.96));
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.22);
}

.lemyox-login-card {
    width: min(440px, 100%);
    padding: 28px;
}

.lemyox-login-brand,
.lemyox-brand,
.lemyox-user-box,
.lemyox-row,
.lemyox-topbar,
.lemyox-section-head,
.lemyox-profile-head,
.lemyox-card-actions,
.lemyox-license-actions,
.lemyox-toolbar,
.lemyox-inline-form {
    display: flex;
    align-items: center;
}

.lemyox-login-brand {
    gap: 14px;
    margin-bottom: 22px;
}

.lemyox-logo-mark,
.lemyox-brand-mark {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    color: #fff;
    font-weight: 900;
}

.lemyox-login-brand strong,
.lemyox-brand-text strong {
    color: #fff;
    display: block;
}

.lemyox-login-brand p,
.lemyox-brand-text span,
.lemyox-card p,
.lemyox-stat-card p,
.lemyox-empty p,
.lemyox-note,
.lemyox-user-box span {
    color: #94a3b8;
}

.lemyox-login-card input[type="text"],
.lemyox-login-card input[type="password"],
.lemyox-app input,
.lemyox-app textarea,
.lemyox-app select {
    width: 100%;
    background: #0b1220;
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 8px;
    color: #f8fafc;
    padding: 11px 12px;
    outline: none;
}

.lemyox-login-card input:focus,
.lemyox-app input:focus,
.lemyox-app textarea:focus,
.lemyox-app select:focus {
    border-color: #ff7a1a;
    box-shadow: 0 0 0 3px rgba(255, 122, 26, 0.12);
}

.lemyox-app {
    display: grid;
    grid-template-columns: 280px minmax(0, 1fr);
    overflow: hidden;
}

.lemyox-sidebar {
    display: flex;
    flex-direction: column;
    height: 100vh;
    overflow: auto;
    background: #0b1220;
    border-right: 1px solid rgba(148, 163, 184, 0.16);
    padding: 16px 12px;
    scrollbar-color: rgba(148, 163, 184, 0.24) transparent;
    scrollbar-width: thin;
}

.lemyox-brand {
    gap: 10px;
    padding: 0 4px 16px;
}

.lemyox-brand-text {
    flex: 1;
    min-width: 0;
}

.lemyox-icon-btn {
    display: inline-grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    background: #111827;
    color: #f8fafc;
    cursor: pointer;
    transition: border-color .16s ease, background .16s ease, transform .16s ease;
}

.lemyox-icon-btn:hover {
    border-color: rgba(255, 122, 26, 0.45);
    background: #151d2c;
    transform: translateY(-1px);
}

.lemyox-nav {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.lemyox-nav-label {
    margin: 16px 10px 7px;
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lemyox-nav-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 38px;
    padding: 9px 10px;
    color: #cbd5e1;
    border: 1px solid transparent;
    border-radius: 8px;
    text-decoration: none;
    transition: background .16s ease, color .16s ease, border-color .16s ease;
}

.lemyox-nav-item svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
}

.lemyox-nav-item:hover,
.lemyox-nav-item.is-active {
    color: #fff;
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.16), rgba(155, 93, 229, 0.14));
    border-color: rgba(255, 122, 26, 0.28);
}

.lemyox-sidebar-bottom {
    margin-top: auto;
    padding-top: 16px;
}

.lemyox-storage-card {
    padding: 12px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    background: #111827;
}

.lemyox-row {
    justify-content: space-between;
    gap: 12px;
}

.lemyox-progress,
.lemyox-big-meter {
    height: 8px;
    background: rgba(148, 163, 184, 0.14);
    border-radius: 999px;
    overflow: hidden;
}

.lemyox-progress span,
.lemyox-big-meter span {
    display: block;
    height: 100%;
    background: linear-gradient(90deg, #ff7a1a, #9b5de5);
}

.lemyox-user-box {
    gap: 10px;
    margin-top: 10px;
    padding: 10px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.04);
}

.lemyox-user-box img,
.lemyox-profile-head img {
    width: 38px;
    height: 38px;
    border-radius: 50%;
}

.lemyox-user-box div {
    flex: 1;
    min-width: 0;
}

.lemyox-user-box strong,
.lemyox-user-box span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-user-box b {
    color: #ffb86c;
    font-size: 11px;
}

.lemyox-main {
    height: 100vh;
    overflow: auto;
    padding: 20px;
    scrollbar-color: rgba(148, 163, 184, 0.28) transparent;
    scrollbar-width: thin;
}

.lemyox-topbar {
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.lemyox-topbar h1 {
    margin: 2px 0 0;
    color: #fff;
    font-size: 24px;
    line-height: 1.2;
}

.lemyox-eyebrow {
    color: #ffb86c;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.lemyox-top-actions,
.lemyox-hero-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.lemyox-gradient-btn,
.lemyox-ghost-btn,
.lemyox-danger-btn,
.lemyox-login-card .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 38px;
    padding: 9px 14px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 800;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .16s ease, box-shadow .16s ease, opacity .16s ease, transform .16s ease;
}

.lemyox-gradient-btn,
.lemyox-login-card .button {
    border: 0;
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    color: #fff;
    box-shadow: 0 8px 22px rgba(255, 122, 26, 0.14);
}

.lemyox-ghost-btn {
    border: 1px solid rgba(148, 163, 184, 0.18);
    background: #111827;
    color: #f8fafc;
}

.lemyox-danger-btn {
    border: 1px solid rgba(248, 113, 113, 0.3);
    background: rgba(127, 29, 29, 0.28);
    color: #fecaca;
}

.lemyox-gradient-btn:hover,
.lemyox-ghost-btn:hover,
.lemyox-danger-btn:hover,
.lemyox-login-card .button:hover {
    color: #fff;
    transform: translateY(-1px);
}

.lemyox-gradient-btn:hover,
.lemyox-login-card .button:hover {
    box-shadow: 0 10px 26px rgba(155, 93, 229, 0.24);
}

.lemyox-ghost-btn:hover {
    border-color: rgba(255, 122, 26, 0.4);
    background: #151d2c;
}

.lemyox-danger-btn:hover {
    border-color: rgba(248, 113, 113, 0.55);
    background: rgba(127, 29, 29, 0.42);
}

.lemyox-app button:disabled,
.lemyox-app a[aria-disabled="true"] {
    cursor: wait;
    opacity: .52;
    transform: none;
}

.lemyox-stepper {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 16px;
}

.lemyox-stepper a {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 10px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    background: #0b1220;
    color: #cbd5e1;
    text-decoration: none;
}

.lemyox-stepper a.is-active {
    border-color: rgba(255, 122, 26, 0.4);
    background: rgba(255, 122, 26, 0.1);
}

.lemyox-stepper span,
.lemyox-step-badge {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    color: #fff;
    font-weight: 900;
}

.lemyox-stepper b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-route {
    display: none;
}

.lemyox-route.is-active {
    display: block;
}

.lemyox-hero {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 22px;
    margin-bottom: 16px;
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    background: radial-gradient(circle at 10% 0%, rgba(255, 122, 26, 0.16), transparent 32%), linear-gradient(135deg, #111827, #151d2c);
}

.lemyox-hero h2,
.lemyox-section-head h2,
.lemyox-card h2,
.lemyox-card h3 {
    margin: 0 0 8px;
    color: #fff;
}

.lemyox-stat-grid,
.lemyox-card-grid,
.lemyox-plan-grid,
.lemyox-mini-grid {
    display: grid;
    gap: 12px;
}

.lemyox-stat-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 16px;
}

.lemyox-stat-card,
.lemyox-card {
    padding: 16px;
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.lemyox-card:hover,
.lemyox-stat-card:hover {
    border-color: rgba(148, 163, 184, 0.28);
    box-shadow: 0 20px 54px rgba(0, 0, 0, 0.26);
}

.lemyox-stat-card span {
    color: #94a3b8;
    display: block;
    margin-bottom: 8px;
}

.lemyox-stat-card strong {
    display: block;
    color: #fff;
    font-size: 24px;
}

.lemyox-grid-2 {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
    gap: 16px;
    margin-bottom: 16px;
}

.lemyox-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.lemyox-plan-grid {
    align-items: stretch;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-mini-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-mini-grid div,
.lemyox-empty,
.lemyox-drop-mini,
.lemyox-video-placeholder,
.lemyox-timeline article {
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 8px;
    background: rgba(7, 13, 25, 0.42);
    padding: 14px;
}

.lemyox-mini-grid b,
.lemyox-mini-grid span,
.lemyox-clean-list b,
.lemyox-clean-list span {
    display: block;
}

.lemyox-section-head {
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.lemyox-toolbar {
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}

.lemyox-toolbar input,
.lemyox-toolbar select {
    min-width: 170px;
}

.lemyox-toolbar input[type="search"] {
    flex: 1 1 260px;
}

.lemyox-toolbar input[type="number"] {
    min-width: 130px;
    width: 150px;
}

.lemyox-toolbar > .lemyox-ghost-btn {
    min-height: 42px;
    white-space: nowrap;
}

.lemyox-toolbar-count {
    color: #94a3b8;
    font-size: 12px;
    font-weight: 700;
    margin-left: auto;
}

.lemyox-selectionbar {
    align-items: center;
    background: rgba(15, 23, 42, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 0 14px;
    padding: 10px;
}

.lemyox-selectionbar input {
    min-width: 220px;
}

.lemyox-select-check {
    align-items: center;
    background: rgba(7, 13, 25, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 999px;
    display: inline-flex;
    gap: 6px;
    padding: 6px 10px;
}

.lemyox-image-card.is-selected {
    border-color: rgba(255, 122, 26, 0.72);
    box-shadow: 0 0 0 1px rgba(155, 93, 229, 0.28);
}

.lemyox-table-card {
    overflow: auto;
    border-radius: 8px;
}

.lemyox-table-card table {
    width: 100%;
    border-collapse: collapse;
}

.lemyox-table-card th,
.lemyox-table-card td {
    padding: 12px;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
    text-align: left;
    vertical-align: middle;
}

.lemyox-table-card th {
    background: rgba(7, 13, 25, 0.72);
    color: #94a3b8;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    position: sticky;
    text-transform: uppercase;
    top: 0;
    z-index: 1;
}

.lemyox-table-card tbody tr {
    transition: background .16s ease;
}

.lemyox-table-card tbody tr:hover {
    background: rgba(255, 255, 255, 0.025);
}

.lemyox-table-card td > strong,
.lemyox-table-card td > span {
    display: block;
}

.lemyox-table-card td > span {
    color: #94a3b8;
    font-size: 12px;
    margin-top: 3px;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-export-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 7px;
    max-width: 360px;
}

.lemyox-export-meta span {
    background: rgba(155, 93, 229, 0.1);
    border: 1px solid rgba(155, 93, 229, 0.22);
    border-radius: 999px;
    color: #d8b4fe;
    display: inline-flex;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
    padding: 4px 7px;
    white-space: nowrap;
}

.lemyox-export-detail-row[hidden] {
    display: none !important;
}

.lemyox-export-detail-row td {
    background: rgba(7, 13, 25, 0.52);
    padding: 0 12px 14px !important;
}

.lemyox-export-detail {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: 14px;
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 8px;
    background: rgba(11, 18, 32, 0.86);
    padding: 14px;
}

.lemyox-export-detail h4 {
    margin: 0 0 10px;
    color: #f8fafc;
    font-size: 13px;
}

.lemyox-export-detail dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.lemyox-export-detail dl div {
    border-bottom: 1px solid rgba(148, 163, 184, 0.1);
    padding-bottom: 7px;
}

.lemyox-export-detail dt {
    color: #64748b;
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.lemyox-export-detail dd {
    margin: 3px 0 0;
    color: #f8fafc;
    font-size: 13px;
    overflow-wrap: anywhere;
}

.lemyox-export-detail pre,
.lemyox-export-detail p {
    margin: 0;
    max-height: 220px;
    overflow: auto;
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    background: #070d19;
    color: #cbd5e1;
    font-size: 12px;
    line-height: 1.5;
    padding: 10px;
    white-space: pre-wrap;
}

.lemyox-export-detail-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.lemyox-export-detail-actions .lemyox-ghost-btn {
    min-height: 30px;
    padding: 5px 8px;
    font-size: 11px;
}

.lemyox-ghost-btn.is-success {
    border-color: rgba(34, 197, 94, 0.46);
    background: rgba(34, 197, 94, 0.12);
    color: #86efac;
}

.lemyox-action-row {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 300px;
}

.lemyox-action-row .lemyox-gradient-btn,
.lemyox-action-row .lemyox-ghost-btn,
.lemyox-action-row .lemyox-danger-btn {
    min-height: 32px;
    padding: 6px 9px;
    font-size: 12px;
}

.lemyox-status-pill {
    background: rgba(34, 197, 94, 0.1);
    border: 1px solid rgba(34, 197, 94, 0.24);
    border-radius: 999px;
    color: #86efac !important;
    display: inline-flex !important;
    font-size: 11px !important;
    font-weight: 800;
    margin: 0 !important;
    padding: 4px 8px;
    text-transform: uppercase;
}

.lemyox-ghost-btn.is-active {
    border-color: rgba(255, 122, 26, 0.5);
    color: #fff;
    background: rgba(255, 122, 26, 0.12);
}

.lemyox-clean-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.lemyox-clean-list li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.12);
}

.lemyox-thumb-placeholder,
.lemyox-thumb-img,
.lemyox-image-card img {
    width: 100%;
    aspect-ratio: 16 / 10;
    border-radius: 8px;
    object-fit: cover;
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.18), rgba(155, 93, 229, 0.18));
    border: 1px solid rgba(148, 163, 184, 0.16);
}

.lemyox-thumb-placeholder {
    display: grid;
    place-items: center;
    color: #ffb86c;
    font-weight: 900;
}

.lemyox-image-card h3,
.lemyox-preset-card h3 {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-image-card span,
.lemyox-preset-card span {
    color: #94a3b8;
    font-size: 12px;
}

.lemyox-license-status dl {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 12px;
}

.lemyox-license-status dt {
    color: #94a3b8;
}

.lemyox-profile-form,
.lemyox-support-form {
    max-width: 760px;
}

.lemyox-profile-form label,
.lemyox-support-form label,
.lemyox-license-form label {
    display: grid;
    gap: 7px;
    margin: 12px 0;
    color: #cbd5e1;
}

.lemyox-file-field input[type="file"] {
    border-style: dashed;
    cursor: pointer;
    padding: 14px;
}

.lemyox-file-field span {
    color: #94a3b8;
    font-size: 12px;
}

.lemyox-profile-head {
    gap: 12px;
    margin: 12px 0;
}

.lemyox-plan-card.is-current {
    border-color: rgba(255, 122, 26, 0.48);
    box-shadow: 0 0 0 1px rgba(255, 122, 26, 0.16);
}

.lemyox-plan-card {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-height: 100%;
    position: relative;
}

.lemyox-plan-card h3 {
    color: #f8fafc;
    font-size: 25px;
    margin: 2px 0;
}

.lemyox-plan-card ul {
    display: grid;
    gap: 8px;
    list-style: none;
    margin: 8px 0 16px;
    padding: 0;
}

.lemyox-plan-card li {
    color: #cbd5e1;
    font-size: 13px;
    padding-left: 20px;
    position: relative;
}

.lemyox-plan-card li::before {
    color: #ff8a2b;
    content: "\2713";
    font-weight: 800;
    left: 0;
    position: absolute;
}

.lemyox-plan-card li.is-unavailable {
    color: #7f8b9d;
}

.lemyox-plan-card li.is-unavailable::before {
    color: #64748b;
    content: "×";
}

.lemyox-plan-card .lemyox-gradient-btn,
.lemyox-plan-selected {
    margin-top: auto;
}

.lemyox-plan-name {
    color: #f8fafc;
    font-size: 18px;
    font-weight: 800;
}

.lemyox-plan-popular,
.lemyox-plan-current {
    border: 1px solid rgba(155, 93, 229, 0.32);
    border-radius: 999px;
    color: #d8b4fe;
    font-size: 11px;
    font-weight: 800;
    padding: 4px 8px;
    position: absolute;
    right: 14px;
    top: 14px;
}

.lemyox-plan-current {
    border-color: rgba(255, 122, 26, 0.38);
    color: #ffb272;
}

.lemyox-plan-card.is-current .lemyox-plan-popular {
    top: 46px;
}

.lemyox-plan-selected {
    background: rgba(255, 122, 26, 0.1);
    border: 1px solid rgba(255, 122, 26, 0.3);
    border-radius: 7px;
    color: #ffb272;
    display: block;
    font-size: 13px;
    font-weight: 800;
    padding: 11px 14px;
    text-align: center;
}

.lemyox-locked-feature {
    align-items: flex-start;
    display: grid;
    gap: 10px;
    max-width: 720px;
}

.lemyox-big-meter {
    height: 18px;
    margin: 18px 0;
}

.lemyox-storage-breakdown {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 14px 0;
}

.lemyox-storage-breakdown > div {
    background: rgba(7, 13, 25, 0.56);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    display: grid;
    gap: 5px;
    padding: 12px;
}

.lemyox-storage-breakdown span {
    color: #94a3b8;
    font-size: 12px;
}

.lemyox-storage-breakdown b {
    color: #f8fafc;
    font-size: 16px;
}

.lemyox-ticket-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
}

.lemyox-ticket-list article {
    background: rgba(7, 13, 25, 0.56);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 8px;
    padding: 12px;
    transition: border-color .16s ease, background .16s ease;
}

.lemyox-ticket-list article:hover {
    background: rgba(15, 23, 42, 0.72);
    border-color: rgba(255, 122, 26, 0.26);
}

.lemyox-ticket-list article > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.lemyox-ticket-list span,
.lemyox-ticket-list p {
    color: #94a3b8;
}

.lemyox-ticket-list em {
    color: #ff7a1a;
    display: inline-block;
    font-size: 12px;
    font-style: normal;
    margin-top: 8px;
    text-transform: uppercase;
}

.lemyox-ticket-attachment {
    color: #ffb86c;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    margin-top: 4px;
    text-decoration: none;
}

.lemyox-ticket-attachment:hover {
    color: #fff;
    text-decoration: underline;
}

.lemyox-workflow-embed > .plt-fullwidth-wrap {
    height: auto;
}

.lemyox-workflow-embed > .plt-fullwidth-wrap > .plt-app {
    display: block;
    min-height: auto;
    height: auto;
    background: transparent;
}

.lemyox-workflow-embed > .plt-fullwidth-wrap > .plt-app > .plt-sidebar,
.lemyox-workflow-embed .plt-mobile-bar {
    display: none !important;
}

.lemyox-workflow-embed .plt-main {
    height: auto;
    min-height: 70vh;
    overflow: visible;
    padding: 0;
}

.lemyox-app[data-current-view="studio"] .lemyox-topbar,
.lemyox-app[data-current-view="studio"] > .lemyox-main > .lemyox-stepper {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .lemyox-main,
.lemyox-app[data-current-view="studio"] .lemyox-route-studio,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap > .plt-app,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-main {
    max-width: 100%;
    min-width: 0;
    width: 100%;
}

.lemyox-app[data-current-view="studio"] .lemyox-main {
    height: 100vh;
    min-height: 0;
    overflow: hidden;
    padding: 0;
}

.lemyox-app[data-current-view="studio"] .lemyox-route-studio,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap {
    overflow: hidden;
}

.lemyox-app[data-current-view="studio"] .lemyox-route-studio.is-active,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap > .plt-app,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-main {
    height: 100%;
    max-height: 100%;
    min-height: 0;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap {
    box-sizing: border-box;
    margin-left: 0 !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed > .plt-fullwidth-wrap > .plt-app,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-main,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-workflow-bar,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps {
    width: 100% !important;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-main {
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: hidden;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-workflow-bar {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-studio-topbar {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar {
    align-items: center;
    background: linear-gradient(180deg, rgba(15, 23, 42, .96), rgba(7, 13, 25, .96));
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 0 0 16px 16px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .22);
    box-sizing: border-box;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    flex: 0 0 auto;
    margin: 0 0 10px;
    max-width: 100%;
    min-width: 0;
    padding: 12px 16px;
    width: 100%;
    z-index: 40;
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand {
    align-items: center;
    color: #f8fafc;
    display: flex;
    gap: 11px;
    min-width: 190px;
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand strong {
    display: block;
    font-size: 14px;
    line-height: 1.1;
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand small {
    color: #94a3b8;
    display: block;
    font-size: 11px;
    line-height: 1.25;
    margin-top: 3px;
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__dot {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    border-radius: 999px;
    box-shadow: 0 0 0 6px rgba(255, 122, 26, .13);
    flex: 0 0 10px;
    height: 10px;
    width: 10px;
}

.lemyox-app[data-current-view="studio"] .plt-editor-menu {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    gap: 8px;
    justify-content: flex-end;
    min-width: 0;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary {
    align-items: flex-start;
    background: rgba(15, 23, 42, .72);
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 12px;
    color: #cbd5e1;
    cursor: pointer;
    display: inline-flex;
    flex-direction: column;
    gap: 2px;
    justify-content: center;
    min-height: 42px;
    min-width: 108px;
    padding: 7px 11px;
    text-align: left;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command:hover,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary:hover {
    background: rgba(30, 41, 59, .8);
    border-color: rgba(255, 122, 26, .38);
    color: #fff;
    transform: translateY(-1px);
}

.lemyox-app[data-current-view="studio"] .plt-editor-command.is-active,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu.is-active > summary,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu[open] > summary {
    background: linear-gradient(135deg, rgba(255, 122, 26, .18), rgba(155, 93, 229, .18));
    border-color: rgba(255, 122, 26, .58);
    color: #fff;
    box-shadow: inset 3px 0 0 #ff7a1a;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command span,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu summary span {
    color: #ff9a4f;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    line-height: 1;
    text-transform: uppercase;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command b,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu summary b {
    font-size: 12px;
    line-height: 1.15;
    white-space: nowrap;
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu {
    position: relative;
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary {
    list-style: none;
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary::-webkit-details-marker {
    display: none;
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel {
    background: #0f172a;
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 12px;
    box-shadow: 0 20px 55px rgba(0, 0, 0, .38);
    display: grid;
    gap: 6px;
    min-width: 190px;
    padding: 8px;
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    z-index: 60;
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel button {
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: #cbd5e1;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 12px;
    text-align: left;
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel button:hover {
    background: rgba(255, 122, 26, .12);
    color: #fff;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] > h2 {
    display: none;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"].is-active {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}

.lemyox-app[data-current-view="studio"] .plt-panel.is-active:not([data-panel="3"]) {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 0 14px 16px;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] {
    align-items: stretch;
    display: flex !important;
    flex: 1 1 auto;
    gap: 4px !important;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    padding: 0 14px 16px;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-resize-pane {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-resize-pane:first-child {
    flex: 0 0 var(--plt-step3-list-w, 230px) !important;
    max-width: 380px !important;
    min-width: 190px;
    width: var(--plt-step3-list-w, 230px) !important;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-resize-pane:last-child {
    flex: 1 1 auto !important;
    min-width: 0;
    width: auto !important;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-col-resizer {
    cursor: col-resize;
    flex: 0 0 4px !important;
    min-width: 4px !important;
    position: relative;
    touch-action: none;
    user-select: none;
    width: 4px !important;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-col-resizer::after {
    bottom: 0;
    content: "";
    left: -8px;
    position: absolute;
    right: -8px;
    top: 0;
}

.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] .plt-step3-editor-zone {
    height: 100%;
    max-height: 100%;
    min-height: 0;
}

.lemyox-app[data-current-view="studio"] .plt-step3-list-card,
.lemyox-app[data-current-view="studio"] .plt-step3-edit-card,
.lemyox-app[data-current-view="studio"] .plt-step3-color-card {
    border-color: rgba(148, 163, 184, .16);
    box-shadow: 0 16px 38px rgba(0, 0, 0, .18);
    max-height: 100%;
    min-height: 0;
    overflow: hidden;
}

.lemyox-app[data-current-view="studio"] .plt-step3-list-card .plt-edit-image-list,
.lemyox-app[data-current-view="studio"] .plt-step3-color-card .plt-adjust-panel,
.lemyox-app[data-current-view="studio"] .plt-step3-edit-card .plt-edit-workspace-wrap {
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

.lemyox-app[data-current-view="studio"] .plt-step3-edit-card .plt-edit-studio-bar,
.lemyox-app[data-current-view="studio"] .plt-step3-edit-card #plt-step3-message,
.lemyox-app[data-current-view="studio"] .plt-step3-color-card .plt-step3-next-action {
    flex: 0 0 auto;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-topbar,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-topbar {
    background: rgba(255, 255, 255, .94);
    border-color: rgba(15, 23, 42, .1);
    box-shadow: 0 18px 50px rgba(15, 23, 42, .08);
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-topbar__brand,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-topbar__brand {
    color: #0f172a;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-topbar__brand small,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-topbar__brand small {
    color: #64748b;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-command,
.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu > summary,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-command,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu > summary {
    background: #fff;
    border-color: rgba(15, 23, 42, .11);
    color: #334155;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-command:hover,
.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu > summary:hover,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-command:hover,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu > summary:hover {
    background: #fff7ed;
    color: #0f172a;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-command.is-active,
.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu.is-active > summary,
.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu[open] > summary,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-command.is-active,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu.is-active > summary,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu[open] > summary {
    background: linear-gradient(135deg, rgba(255, 122, 26, .12), rgba(155, 93, 229, .1));
    border-color: rgba(255, 122, 26, .46);
    color: #0f172a;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu__panel,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu__panel {
    background: #fff;
    border-color: rgba(15, 23, 42, .12);
    box-shadow: 0 20px 55px rgba(15, 23, 42, .14);
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu__panel button,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu__panel button {
    color: #334155;
}

.lemyox-app[data-current-view="studio"] .plt-theme-light .plt-editor-utility-menu__panel button:hover,
.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-editor-utility-menu__panel button:hover {
    background: #fff7ed;
    color: #0f172a;
}

/* Studio color bridge: force the embedded editor to follow the app theme palette. */
.lemyox-app[data-current-view="studio"] {
    --studio-bg: #0b1118;
    --studio-sidebar: #080e14;
    --studio-panel: #111922;
    --studio-panel-soft: #0e161f;
    --studio-panel-deep: #091019;
    --studio-border: #26313b;
    --studio-border-soft: rgba(148, 163, 184, .16);
    --studio-text: #f6f8fb;
    --studio-muted: #8e99a5;
    --studio-muted-soft: #64717e;
    --studio-orange: #ff7300;
    --studio-orange-soft: rgba(255, 115, 0, .15);
    --studio-purple: #9b5de5;
    --studio-green: #62cf7b;
    --studio-shadow: rgba(0, 0, 0, .28);
}

.lemyox-app[data-current-view="studio"][data-app-theme="light"],
.lemyox-app[data-current-view="studio"][data-project-theme="light"] {
    --studio-bg: #f7f8fa;
    --studio-sidebar: #fff;
    --studio-panel: #fff;
    --studio-panel-soft: #fafbfc;
    --studio-panel-deep: #f1f4f7;
    --studio-border: #e3e7eb;
    --studio-border-soft: rgba(15, 23, 42, .1);
    --studio-text: #15191e;
    --studio-muted: #69727d;
    --studio-muted-soft: #8b96a3;
    --studio-orange-soft: rgba(255, 115, 0, .1);
    --studio-green: #249447;
    --studio-shadow: rgba(15, 23, 42, .08);
}

.lemyox-app[data-current-view="studio"] .plt-app {
    --plt-bg-primary: var(--studio-bg);
    --plt-bg-secondary: var(--studio-panel-soft);
    --plt-bg-card: var(--studio-panel);
    --plt-bg-card-hover: var(--studio-panel-soft);
    --plt-bg-sidebar: var(--studio-sidebar);
    --plt-border-color: var(--studio-border);
    --plt-border-hover: rgba(255, 115, 0, .42);
    --plt-text-primary: var(--studio-text);
    --plt-text-secondary: var(--studio-muted);
    --plt-text-muted: var(--studio-muted-soft);
    --plt-accent: var(--studio-orange);
    --plt-accent-hover: #ff8a24;
    --plt-accent-glow: var(--studio-orange-soft);
    --plt-glass-bg: color-mix(in srgb, var(--studio-panel) 88%, transparent);
    --plt-glass-border: var(--studio-border);
    background: var(--studio-bg) !important;
    color: var(--studio-text) !important;
}

.lemyox-app[data-current-view="studio"] .plt-main,
.lemyox-app[data-current-view="studio"] .plt-panel,
.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"].is-active {
    background: var(--studio-bg) !important;
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar {
    background: linear-gradient(180deg, color-mix(in srgb, var(--studio-panel) 96%, transparent), color-mix(in srgb, var(--studio-panel-deep) 96%, transparent));
    border-color: var(--studio-border);
    box-shadow: 0 18px 50px var(--studio-shadow);
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand,
.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand strong {
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand small {
    color: var(--studio-muted);
}

.lemyox-app[data-current-view="studio"] .plt-editor-command,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary {
    background: var(--studio-panel);
    border-color: var(--studio-border);
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-command:hover,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary:hover {
    background: var(--studio-panel-soft);
    border-color: rgba(255, 115, 0, .46);
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-command.is-active,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu.is-active > summary,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu[open] > summary {
    background: linear-gradient(135deg, rgba(255, 115, 0, .2), rgba(155, 93, 229, .16));
    border-color: rgba(255, 115, 0, .58);
    box-shadow: inset 3px 0 0 var(--studio-orange);
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-command span,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu summary span {
    color: var(--studio-orange);
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel,
.lemyox-app[data-current-view="studio"] .plt-step3-context-menu {
    background: var(--studio-panel);
    border-color: var(--studio-border);
    box-shadow: 0 20px 55px var(--studio-shadow);
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel button,
.lemyox-app[data-current-view="studio"] .plt-step3-context-menu button {
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel button:hover,
.lemyox-app[data-current-view="studio"] .plt-step3-context-menu button:hover:not(:disabled) {
    background: var(--studio-orange-soft);
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-card,
.lemyox-app[data-current-view="studio"] .plt-step3-list-card,
.lemyox-app[data-current-view="studio"] .plt-step3-edit-card,
.lemyox-app[data-current-view="studio"] .plt-step3-color-card,
.lemyox-app[data-current-view="studio"] .plt-edit-studio-toolbar,
.lemyox-app[data-current-view="studio"] .plt-edit-studio-bar,
.lemyox-app[data-current-view="studio"] .plt-adjust-section,
.lemyox-app[data-current-view="studio"] .plt-edit-workspace-dock,
.lemyox-app[data-current-view="studio"] .plt-message {
    background: var(--studio-panel) !important;
    border-color: var(--studio-border) !important;
    color: var(--studio-text) !important;
    box-shadow: 0 16px 38px var(--studio-shadow);
}

.lemyox-app[data-current-view="studio"] .plt-step3-list-card,
.lemyox-app[data-current-view="studio"] .plt-step3-color-card {
    background: var(--studio-panel) !important;
}

.lemyox-app[data-current-view="studio"] .plt-step3-edit-card {
    background: var(--studio-panel-soft) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-workspace-wrap,
.lemyox-app[data-current-view="studio"] .plt-edit-workspace,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-wrap,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-area {
    background: var(--studio-panel-soft) !important;
    color: var(--studio-text);
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page,
.lemyox-app[data-current-view="studio"] .plt-edit-grid-cell,
.lemyox-app[data-current-view="studio"] .plt-preview-paper {
    background: color-mix(in srgb, var(--studio-panel) 88%, #fff 12%);
    border-color: var(--studio-border) !important;
    color: var(--studio-text);
    box-shadow: 0 22px 60px var(--studio-shadow);
}

.lemyox-app[data-current-view="studio"] .plt-edit-ruler,
.lemyox-app[data-current-view="studio"] .plt-edit-ruler-corner {
    background: color-mix(in srgb, var(--studio-panel-soft) 86%, transparent);
    border-color: var(--studio-border);
    color: var(--studio-muted);
}

.lemyox-app[data-current-view="studio"] .plt-edit-image-item,
.lemyox-app[data-current-view="studio"] .plt-upload-list-item,
.lemyox-app[data-current-view="studio"] .plt-step3-filter-btn,
.lemyox-app[data-current-view="studio"] .plt-edit-workspace-view__btn,
.lemyox-app[data-current-view="studio"] .plt-edit-tool-btn,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-zoom,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-zoom__btn,
.lemyox-app[data-current-view="studio"] .plt-edit-long-border-wrap {
    background: var(--studio-panel-soft) !important;
    border-color: var(--studio-border) !important;
    color: var(--studio-text) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-image-item:hover,
.lemyox-app[data-current-view="studio"] .plt-edit-tool-btn:hover:not(:disabled),
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-zoom__btn:hover,
.lemyox-app[data-current-view="studio"] .plt-edit-workspace-view__btn:hover {
    background: color-mix(in srgb, var(--studio-panel-soft) 72%, var(--studio-orange) 28%) !important;
    border-color: rgba(255, 115, 0, .46) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-image-item.is-active,
.lemyox-app[data-current-view="studio"] .plt-edit-image-item.is-selected,
.lemyox-app[data-current-view="studio"] .plt-step3-filter-btn.is-active,
.lemyox-app[data-current-view="studio"] .plt-edit-workspace-view__btn.is-active,
.lemyox-app[data-current-view="studio"] .plt-edit-tool-btn.is-active {
    background: linear-gradient(135deg, rgba(255, 115, 0, .18), rgba(155, 93, 229, .15)) !important;
    border-color: rgba(255, 115, 0, .64) !important;
    color: var(--studio-text) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-image-card,
.lemyox-app[data-current-view="studio"] .plt-edit-image-thumb,
.lemyox-app[data-current-view="studio"] .plt-edit-image-item img {
    border-color: var(--studio-border) !important;
}

.lemyox-app[data-current-view="studio"] h1,
.lemyox-app[data-current-view="studio"] h2,
.lemyox-app[data-current-view="studio"] h3,
.lemyox-app[data-current-view="studio"] h4,
.lemyox-app[data-current-view="studio"] .plt-card-title,
.lemyox-app[data-current-view="studio"] .plt-adjust-section__head,
.lemyox-app[data-current-view="studio"] .plt-edit-studio-bar__nav strong,
.lemyox-app[data-current-view="studio"] .plt-edit-grid-cell__name {
    color: var(--studio-text) !important;
}

.lemyox-app[data-current-view="studio"] p,
.lemyox-app[data-current-view="studio"] small,
.lemyox-app[data-current-view="studio"] .plt-muted,
.lemyox-app[data-current-view="studio"] .plt-step3-upload-hint,
.lemyox-app[data-current-view="studio"] .plt-adjust-row__label,
.lemyox-app[data-current-view="studio"] .plt-edit-nav-info,
.lemyox-app[data-current-view="studio"] .plt-edit-zoom-label,
.lemyox-app[data-current-view="studio"] .plt-edit-grid-cell__caption,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page__head {
    color: var(--studio-muted) !important;
}

.lemyox-app[data-current-view="studio"] input,
.lemyox-app[data-current-view="studio"] select,
.lemyox-app[data-current-view="studio"] textarea,
.lemyox-app[data-current-view="studio"] .plt-tool-input,
.lemyox-app[data-current-view="studio"] .plt-tool-select,
.lemyox-app[data-current-view="studio"] .plt-adjust-row__input,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-zoom__input {
    background: var(--studio-panel-deep) !important;
    border-color: var(--studio-border) !important;
    color: var(--studio-text) !important;
}

.lemyox-app[data-current-view="studio"] input:focus,
.lemyox-app[data-current-view="studio"] select:focus,
.lemyox-app[data-current-view="studio"] textarea:focus,
.lemyox-app[data-current-view="studio"] .plt-tool-input:focus,
.lemyox-app[data-current-view="studio"] .plt-tool-select:focus,
.lemyox-app[data-current-view="studio"] .plt-adjust-row__input:focus,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-zoom__input:focus {
    border-color: rgba(255, 115, 0, .62) !important;
    box-shadow: 0 0 0 3px var(--studio-orange-soft) !important;
    outline: 0;
}

.lemyox-app[data-current-view="studio"] input::placeholder,
.lemyox-app[data-current-view="studio"] textarea::placeholder {
    color: var(--studio-muted-soft);
}

.lemyox-app[data-current-view="studio"] .plt-btn,
.lemyox-app[data-current-view="studio"] .plt-upload-btn,
.lemyox-app[data-current-view="studio"] .plt-step-continue-btn,
.lemyox-app[data-current-view="studio"] .plt-step3-next-action .plt-btn {
    background: linear-gradient(135deg, var(--studio-orange), var(--studio-purple)) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 14px 34px rgba(255, 115, 0, .24);
}

.lemyox-app[data-current-view="studio"] .plt-btn--ghost,
.lemyox-app[data-current-view="studio"] .plt-btn--secondary {
    background: var(--studio-panel-soft) !important;
    border: 1px solid var(--studio-border) !important;
    color: var(--studio-text) !important;
    box-shadow: none;
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-zoom__range {
    accent-color: var(--studio-orange);
}

.lemyox-app[data-current-view="studio"] ::-webkit-scrollbar-track {
    background: var(--studio-panel-deep);
}

.lemyox-app[data-current-view="studio"] ::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--studio-border) 72%, var(--studio-muted) 28%);
    border-color: var(--studio-panel-deep);
}

/* Compact Studio toolbar: icon + label only, no descriptive heading. */
.lemyox-app[data-current-view="studio"] .plt-editor-topbar {
    align-items: center !important;
    background: var(--studio-panel) !important;
    border-color: var(--studio-border) !important;
    border-radius: 0 0 12px 12px !important;
    border-top: 0 !important;
    box-shadow: 0 12px 28px var(--studio-shadow) !important;
    gap: 8px !important;
    margin: 0 8px 10px !important;
    min-height: 50px;
    padding: 7px 12px !important;
    width: calc(100% - 16px) !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-menu {
    align-items: center;
    display: flex;
    gap: 7px;
    justify-content: flex-end;
    overflow-x: auto;
    scrollbar-width: none;
    width: 100%;
}

.lemyox-app[data-current-view="studio"] .plt-editor-menu::-webkit-scrollbar {
    display: none;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary {
    align-items: center !important;
    background: var(--studio-panel-soft) !important;
    border: 1px solid var(--studio-border) !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    color: var(--studio-text) !important;
    flex-direction: row !important;
    gap: 7px !important;
    min-height: 34px !important;
    min-width: 0 !important;
    padding: 7px 11px !important;
    white-space: nowrap;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command::before,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary::before {
    align-items: center;
    background: rgba(255, 115, 0, .12);
    border: 1px solid rgba(255, 115, 0, .26);
    border-radius: 8px;
    color: var(--studio-orange);
    display: inline-flex;
    flex: 0 0 22px;
    font-size: 13px;
    font-weight: 900;
    height: 22px;
    justify-content: center;
    line-height: 1;
    width: 22px;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="size"]::before,
.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="size-border"]::before {
    content: "S";
}

.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="border"] {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="border"]::before {
    content: "V";
}

.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="edit"]::before {
    content: "E";
}

.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary::before {
    content: "+";
}

.lemyox-app[data-current-view="studio"] .plt-editor-command span,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu summary span {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command b,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu summary b {
    color: var(--studio-text) !important;
    font-size: 12px !important;
    font-weight: 800;
    line-height: 1 !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="size-border"] b {
    font-size: 0 !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command[data-editor-focus="size-border"] b::after {
    content: "Size & viền";
    font-size: 12px;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command:hover,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary:hover {
    background: color-mix(in srgb, var(--studio-panel-soft) 78%, var(--studio-orange) 22%) !important;
    border-color: rgba(255, 115, 0, .48) !important;
    transform: translateY(-1px);
}

.lemyox-app[data-current-view="studio"] .plt-editor-command.is-active,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu.is-active > summary,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu[open] > summary {
    background: linear-gradient(135deg, rgba(255, 115, 0, .22), rgba(155, 93, 229, .16)) !important;
    border-color: rgba(255, 115, 0, .7) !important;
    box-shadow: inset 0 -2px 0 var(--studio-orange) !important;
}

.lemyox-app[data-current-view="studio"] .plt-editor-command.is-active::before,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu.is-active > summary::before,
.lemyox-app[data-current-view="studio"] .plt-editor-utility-menu[open] > summary::before {
    background: linear-gradient(135deg, var(--studio-orange), var(--studio-purple));
    border-color: transparent;
    color: #fff;
}

/* Keep the active photo frame visually uniform while editing/cropping. */
.lemyox-app[data-current-view="studio"] {
    --studio-photo-matte: #f4f6f8;
    --studio-photo-paper: #ffffff;
}

.lemyox-app[data-current-view="studio"][data-app-theme="light"],
.lemyox-app[data-current-view="studio"][data-project-theme="light"] {
    --studio-photo-matte: #f7f8fa;
    --studio-photo-paper: #ffffff;
}

.lemyox-app[data-current-view="studio"] .plt-edit-workspace-inner,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-scroll {
    background: var(--studio-panel-soft) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page__stage,
.lemyox-app[data-current-view="studio"] .plt-edit-viewport,
.lemyox-app[data-current-view="studio"] .plt-edit-viewport__inner {
    background: var(--studio-photo-matte) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-edit-print-sheet,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-stage,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-step2-frame,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-step2-frame-grid,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-step2-grid,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-step2-border-cell,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-step2-image-cell,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-step2-image-fit,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-crop-zone,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-window {
    background: var(--studio-photo-paper) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-edit-print-sheet,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-step2-frame,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-step2-frame-grid,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-step2-grid,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-step2-border-cell,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-step2-image-cell,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-step2-image-fit,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-crop-zone {
    overflow: visible !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-window {
    overflow: hidden !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-ghost-layer {
    background: transparent !important;
    inset: 0 !important;
    overflow: visible !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-ghost-layer::after {
    background: transparent !important;
    bottom: -200% !important;
    left: -200% !important;
    right: -200% !important;
    top: -200% !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-ghost,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-frame-fit-visible,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page .plt-edit-preview-img {
    background: var(--studio-photo-paper) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-frame-fit-ghost {
    max-height: none !important;
    max-width: none !important;
    opacity: .48 !important;
}

/* Let the ghost image fill zoomed-out gaps; avoid white seams between ghost and main photo. */
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-step2-image-cell,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-step2-image-fit,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-frame-fit-crop-zone,
.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-frame-fit-window {
    background: transparent !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-frame-fit-window {
    box-shadow: 0 0 0 1px rgba(139, 92, 246, .2) !important;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-frame-fit-ghost-layer {
    z-index: 1;
}

.lemyox-app[data-current-view="studio"] .plt-edit-canvas-page.is-frame-fit-mode .plt-frame-fit-stage.is-frame-fit-active .plt-frame-fit-visible {
    position: relative;
    z-index: 3;
}

/* Right edit panel: match the compact LemyOX adjustment rail with full-width sliders. */
.lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] .plt-step3-editor-zone {
    --plt-color-panel-w: 314px;
}

.lemyox-app[data-current-view="studio"] .plt-step3-panel-resizer {
    background: transparent !important;
    display: block !important;
    flex: 0 0 10px;
    opacity: 1 !important;
    position: relative;
    z-index: 12;
}

.lemyox-app[data-current-view="studio"] .plt-step3-panel-resizer--h {
    align-self: stretch;
    cursor: col-resize;
    margin: 0 -2px;
    width: 10px !important;
}

.lemyox-app[data-current-view="studio"] .plt-step3-panel-resizer--h::before {
    background: rgba(148, 163, 184, .18);
    border-radius: 999px;
    content: "";
    display: block;
    height: 100%;
    margin: 0 auto;
    transition: background .16s ease, box-shadow .16s ease, transform .16s ease;
    width: 3px;
}

.lemyox-app[data-current-view="studio"] .plt-step3-panel-resizer--h:hover::before,
.lemyox-app[data-current-view="studio"] .plt-step3-panel-resizer--h.is-dragging::before {
    background: linear-gradient(180deg, var(--studio-orange), var(--studio-purple));
    box-shadow: 0 0 0 4px rgba(255, 115, 0, .12);
    transform: scaleX(1.35);
}

.lemyox-app[data-current-view="studio"] .plt-step3-panel-resizer--v {
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .plt-step3-color-card {
    min-width: 260px;
}

body.plt-is-resizing,
body.plt-is-resizing * {
    cursor: col-resize !important;
    user-select: none !important;
}

.lemyox-app[data-current-view="studio"] .plt-step3-color-card {
    background: linear-gradient(180deg, #101925, #0c1520) !important;
    border: 1px solid #243241 !important;
    border-radius: 8px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 18px 44px rgba(0, 0, 0, .22) !important;
    padding: 15px 16px !important;
}

.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-step3-color-card,
.lemyox-app[data-current-view="studio"][data-project-theme="light"] .plt-step3-color-card {
    background: #fff !important;
    border-color: #e3e7eb !important;
    box-shadow: 0 14px 32px rgba(15, 23, 42, .08) !important;
}

.lemyox-app[data-current-view="studio"] .plt-step3-color-card .plt-adjust-panel {
    display: block;
    overflow-x: hidden;
    padding: 0 2px 0 0 !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, .16) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 14px 0 15px !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section:first-child {
    padding-top: 0 !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section:last-of-type {
    border-bottom: 0 !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section__head {
    align-items: center;
    color: var(--studio-text) !important;
    display: flex;
    font-size: 15px !important;
    font-weight: 850 !important;
    gap: 9px;
    line-height: 1.15;
    margin: 0 0 13px !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section__icon {
    align-items: center;
    color: #60a5fa;
    display: inline-flex;
    font-size: 14px;
    height: 18px;
    justify-content: center;
    line-height: 1;
    width: 18px;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section:nth-of-type(2) .plt-adjust-section__icon {
    color: var(--studio-orange);
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section:nth-of-type(4) .plt-adjust-section__head::before {
    color: var(--studio-text);
    content: "⌗";
    font-size: 16px;
    line-height: 1;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-section:nth-of-type(4) .plt-adjust-section__head::after {
    background: linear-gradient(135deg, var(--studio-orange), var(--studio-purple));
    border-radius: 999px;
    box-shadow: 0 0 0 3px rgba(255, 115, 0, .12);
    content: "";
    height: 18px;
    margin-left: auto;
    width: 30px;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row {
    align-items: center;
    display: grid !important;
    gap: 12px !important;
    grid-template-columns: 86px minmax(92px, 1fr) 48px !important;
    margin: 0 0 11px !important;
    min-height: 34px;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row:last-child {
    margin-bottom: 0 !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row__label {
    color: #c6d0dc !important;
    font-size: 13px !important;
    font-weight: 600;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-adjust-row__label,
.lemyox-app[data-current-view="studio"][data-project-theme="light"] .plt-adjust-row__label {
    color: #566273 !important;
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider {
    -webkit-appearance: none;
    appearance: none;
    background: transparent !important;
    border: 0 !important;
    cursor: pointer;
    height: 26px !important;
    margin: 0 !important;
    min-width: 0;
    padding: 0 !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider::-webkit-slider-runnable-track {
    background: linear-gradient(90deg, rgba(83, 101, 122, .74), rgba(83, 101, 122, .74) 64%, var(--studio-orange));
    border: 0;
    border-radius: 999px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .28);
    height: 3px;
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    background: #3b82f6;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, .16), 0 1px 5px rgba(0, 0, 0, .35);
    height: 14px;
    margin-top: -5.5px;
    width: 14px;
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider:hover::-webkit-slider-thumb {
    background: #60a5fa;
    box-shadow: 0 0 0 5px rgba(96, 165, 250, .18), 0 1px 7px rgba(0, 0, 0, .38);
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider::-moz-range-track {
    background: linear-gradient(90deg, rgba(83, 101, 122, .74), rgba(83, 101, 122, .74) 64%, var(--studio-orange));
    border: 0;
    border-radius: 999px;
    height: 3px;
}

.lemyox-app[data-current-view="studio"] input[type=range].plt-adjust-row__slider::-moz-range-thumb {
    background: #3b82f6;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, .16), 0 1px 5px rgba(0, 0, 0, .35);
    height: 14px;
    width: 14px;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row--warmth .plt-adjust-row__slider::-webkit-slider-runnable-track {
    background: linear-gradient(90deg, #365f9d, #53657a 50%, var(--studio-orange));
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row--saturation .plt-adjust-row__slider::-webkit-slider-runnable-track {
    background: linear-gradient(90deg, #53657a, #3b82f6 62%, #f59e0b);
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row--vibrance .plt-adjust-row__slider::-webkit-slider-runnable-track {
    background: linear-gradient(90deg, #53657a, #3b82f6 62%, #f472b6);
}

.lemyox-app[data-current-view="studio"] .plt-adjust-row__input {
    background: #101b29 !important;
    border: 1px solid #26384a !important;
    border-radius: 6px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025);
    color: var(--studio-text) !important;
    font-size: 13px !important;
    font-weight: 750;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 4px !important;
    text-align: center;
    width: 48px !important;
}

.lemyox-app[data-current-view="studio"][data-app-theme="light"] .plt-adjust-row__input,
.lemyox-app[data-current-view="studio"][data-project-theme="light"] .plt-adjust-row__input {
    background: #fff !important;
    border-color: #d8dee7 !important;
    color: #15191e !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-presets {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px !important;
}

.lemyox-app[data-current-view="studio"] .plt-adjust-presets .plt-btn {
    border-radius: 999px !important;
    box-shadow: none !important;
    font-size: 11px !important;
    min-height: 24px !important;
    padding: 3px 8px !important;
}

.lemyox-app[data-current-view="studio"] .plt-step3-color-card .plt-step3-next-action {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding-top: 12px;
}

.lemyox-app[data-current-view="studio"] .plt-step3-color-card .plt-step3-next-action .plt-btn {
    border-radius: 7px !important;
    font-size: 14px !important;
    font-weight: 850;
    min-height: 48px;
    width: 100%;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps {
    box-sizing: border-box;
    display: grid !important;
    gap: 0;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    padding: 18px 32px !important;
    width: 100%;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps::before {
    left: 56px;
    right: 56px;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps button {
    box-sizing: border-box;
    gap: 10px;
    min-width: 0 !important;
    overflow: visible;
    padding: 0 8px !important;
    width: auto;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps button::after {
    content: none !important;
    display: none !important;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-step-text {
    min-width: 0;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-step-title,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-step-sub {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-panel,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-export-studio,
.lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-ex-body {
    max-width: 100%;
    min-width: 0;
}

@media (max-width: 1280px) {
    .lemyox-app[data-current-view="studio"] .plt-editor-topbar {
        align-items: center;
        flex-direction: row;
        gap: 10px;
    }

    .lemyox-app[data-current-view="studio"] .plt-editor-menu {
        justify-content: flex-end;
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .lemyox-app[data-current-view="studio"] .plt-editor-topbar__brand small {
        display: none;
    }

    .lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps {
        padding-inline: 18px !important;
    }

    .lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-step-sub {
        display: none;
    }
}

@media (max-width: 900px) {
    .lemyox-app[data-current-view="studio"] .plt-editor-topbar {
        border-radius: 0 0 12px 12px;
        padding: 10px;
        position: sticky;
    }

    .lemyox-app[data-current-view="studio"] .plt-editor-command,
    .lemyox-app[data-current-view="studio"] .plt-editor-utility-menu > summary {
        min-width: 112px;
    }

    .lemyox-app[data-current-view="studio"] .plt-editor-utility-menu__panel {
        left: 0;
        right: auto;
    }

    .lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] {
        flex-direction: column;
        padding: 0 10px 14px;
    }

    .lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-resize-pane,
    .lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-resize-pane:first-child,
    .lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-resize-pane:last-child {
        flex: 0 0 auto !important;
        max-width: none !important;
        width: 100% !important;
    }

    .lemyox-app[data-current-view="studio"] .plt-panel[data-panel="3"] [data-resize-key="cols3step"] > .plt-col-resizer {
        display: none !important;
    }

    .lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-top-steps {
        display: none !important;
    }

    .lemyox-app[data-current-view="studio"] .lemyox-workflow-embed .plt-workflow-compact {
        display: grid !important;
    }
}

.lemyox-mobile-menu {
    display: none;
}

.lemyox-app.is-sidebar-collapsed {
    grid-template-columns: 72px minmax(0, 1fr);
}

.lemyox-app.is-sidebar-collapsed .lemyox-brand-text,
.lemyox-app.is-sidebar-collapsed .lemyox-nav-label,
.lemyox-app.is-sidebar-collapsed .lemyox-nav-item span,
.lemyox-app.is-sidebar-collapsed .lemyox-storage-card,
.lemyox-app.is-sidebar-collapsed .lemyox-user-box div,
.lemyox-app.is-sidebar-collapsed .lemyox-user-box b {
    display: none;
}

.lemyox-toast {
    position: fixed;
    top: 18px;
    right: 18px;
    z-index: 99999;
    max-width: 360px;
    padding: 12px 14px;
    border-radius: 8px;
    background: #111827;
    border: 1px solid rgba(148, 163, 184, 0.24);
    color: #fff;
    box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
    animation: lemyox-toast-in .2s ease-out;
}

.lemyox-toast.is-error {
    border-color: rgba(248, 113, 113, 0.45);
}

@keyframes lemyox-toast-in {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 1100px) {
    .lemyox-stat-grid,
    .lemyox-plan-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lemyox-stepper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lemyox-grid-2 {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .lemyox-app {
        grid-template-columns: 1fr;
    }

    .lemyox-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 10000;
        width: min(320px, 86vw);
        transform: translateX(-105%);
        transition: transform .2s ease;
    }

    .lemyox-app.is-drawer-open .lemyox-sidebar {
        transform: translateX(0);
    }

    .lemyox-drawer-backdrop:not([hidden]) {
        position: fixed;
        inset: 0;
        z-index: 9999;
        background: rgba(0, 0, 0, 0.55);
    }

    .lemyox-mobile-menu {
        display: inline-grid;
    }

    .lemyox-main {
        padding: 12px;
    }

    .lemyox-topbar,
    .lemyox-hero,
    .lemyox-section-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .lemyox-top-actions,
    .lemyox-hero-actions,
    .lemyox-toolbar,
    .lemyox-inline-form {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .lemyox-toolbar-count {
        margin-left: 0;
    }

    .lemyox-toolbar input[type="number"] {
        width: 100%;
    }

    .lemyox-stepper {
        grid-template-columns: 1fr 1fr;
    }

    .lemyox-stepper b {
        display: none;
    }

    .lemyox-stat-grid,
    .lemyox-plan-grid,
    .lemyox-mini-grid {
        grid-template-columns: 1fr;
    }

    .lemyox-card,
    .lemyox-stat-card,
    .lemyox-login-card {
        padding: 14px;
    }

    .lemyox-table-card {
        background: transparent;
        border: 0;
        box-shadow: none;
        overflow: visible;
    }

    .lemyox-table-card table,
    .lemyox-table-card tbody,
    .lemyox-table-card tr,
    .lemyox-table-card td {
        display: block;
        width: 100%;
    }

    .lemyox-table-card thead {
        display: none;
    }

    .lemyox-table-card tr {
        background: linear-gradient(180deg, rgba(21, 29, 44, 0.96), rgba(17, 24, 39, 0.96));
        border: 1px solid rgba(148, 163, 184, 0.16);
        border-radius: 8px;
        margin-bottom: 10px;
        padding: 8px;
    }

    .lemyox-table-card td {
        border-bottom: 1px solid rgba(148, 163, 184, 0.08);
        padding: 8px;
    }

    .lemyox-table-card td:last-child {
        border-bottom: 0;
    }

    .lemyox-action-row {
        min-width: 0;
    }

    .lemyox-export-meta {
        max-width: none;
    }

    .lemyox-export-detail-row td {
        padding: 0 !important;
    }

    .lemyox-export-detail {
        grid-template-columns: 1fr;
        margin-top: 8px;
    }

    .lemyox-export-detail dl {
        grid-template-columns: 1fr;
    }

    .lemyox-export-detail-actions > * {
        flex: 1 1 auto;
    }

    .lemyox-action-row > * {
        flex: 1 1 auto;
    }

    .lemyox-ticket-list article > div {
        align-items: flex-start;
        flex-direction: column;
    }
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-header {
    display: flex !important;
}

/* Shared app shell: keep every dashboard view aligned with the Projects sidebar. */
.lemyox-app {
    --shell-bg: #070d19;
    --shell-sidebar: #080e14;
    --shell-panel: #111922;
    --shell-panel-soft: #0d141d;
    --shell-border: #26313b;
    --shell-text: #f6f8fb;
    --shell-muted: #94a3b8;
    --shell-orange: #ff7300;
    font-size: 14px;
    grid-template-columns: 258px minmax(0, 1fr);
}

.lemyox-app[data-app-theme="light"] {
    --shell-bg: #f7f8fb;
    --shell-sidebar: #fff;
    --shell-panel: #fff;
    --shell-panel-soft: #f3f6fa;
    --shell-border: #e3e7ee;
    --shell-text: #151a23;
    --shell-muted: #657183;
    background: var(--shell-bg);
    color: var(--shell-text);
}

.lemyox-app[data-app-theme="light"] .lemyox-main {
    background: var(--shell-bg);
}

.lemyox-app[data-app-theme="light"] .lemyox-card,
.lemyox-app[data-app-theme="light"] .lemyox-stat-card,
.lemyox-app[data-app-theme="light"] .lemyox-table-card,
.lemyox-app[data-app-theme="light"] .lemyox-profile-panel,
.lemyox-app[data-app-theme="light"] .lemyox-profile-summary,
.lemyox-app[data-app-theme="light"] .lemyox-overview-panel,
.lemyox-app[data-app-theme="light"] .lemyox-overview-stats article {
    background: #fff;
    border-color: var(--shell-border);
    box-shadow: 0 14px 34px rgba(15, 23, 42, .08);
    color: var(--shell-text);
}

.lemyox-app[data-app-theme="light"] input,
.lemyox-app[data-app-theme="light"] textarea,
.lemyox-app[data-app-theme="light"] select {
    background: #fff;
    border-color: var(--shell-border);
    color: var(--shell-text);
}

.lemyox-app[data-app-theme="light"] .lemyox-card h2,
.lemyox-app[data-app-theme="light"] .lemyox-card h3,
.lemyox-app[data-app-theme="light"] .lemyox-stat-card strong,
.lemyox-app[data-app-theme="light"] .lemyox-overview-header h2,
.lemyox-app[data-app-theme="light"] .lemyox-overview-panel h3,
.lemyox-app[data-app-theme="light"] .lemyox-profile-titlebar h2,
.lemyox-app[data-app-theme="light"] .lemyox-profile-panel h3,
.lemyox-app[data-app-theme="light"] .lemyox-profile-summary h3,
.lemyox-app[data-app-theme="light"] .lemyox-profile-summary > strong {
    color: #0f172a;
}

.lemyox-app[data-app-theme="light"] .lemyox-nav-item:hover,
.lemyox-app[data-app-theme="light"] .lemyox-nav-item.is-active {
    background: rgba(255, 115, 0, .09);
}

.lemyox-app[data-density="compact"] {
    font-size: 13px;
}

.lemyox-app[data-density="compact"] .lemyox-main {
    padding-top: 18px;
}

.lemyox-app[data-density="compact"] .lemyox-card,
.lemyox-app[data-density="compact"] .lemyox-profile-panel {
    padding: 14px;
}

.lemyox-app[data-density="comfortable"] .lemyox-main {
    padding-top: 30px;
}

.lemyox-app .lemyox-sidebar {
    background: var(--shell-sidebar);
    border-color: var(--shell-border);
    padding: 18px 12px 12px;
}

.lemyox-app .lemyox-brand {
    border-bottom: 1px solid var(--shell-border);
    gap: 10px;
    margin: 0 8px 12px;
    padding: 0 0 16px;
}

.lemyox-app .lemyox-brand-mark,
.lemyox-app .lemyox-brand-text span {
    display: none;
}

.lemyox-app .lemyox-brand-text strong {
    color: var(--shell-text);
    display: block;
    font-size: 27px;
    font-weight: 800;
    letter-spacing: -.7px;
    line-height: 1.2;
}

.lemyox-app .lemyox-sidebar-collapse {
    border-color: var(--shell-border);
    height: 40px;
    width: 40px;
}

.lemyox-app .lemyox-nav {
    gap: 2px;
}

.lemyox-app .lemyox-nav-label {
    color: var(--shell-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    margin: 13px 10px 5px;
}

.lemyox-app .lemyox-nav-item {
    border: 0;
    border-left: 2px solid transparent;
    border-radius: 5px;
    color: var(--shell-muted);
    font-size: 12px;
    gap: 10px;
    line-height: 1.35;
    min-height: 35px;
    padding: 7px 10px;
}

.lemyox-app .lemyox-nav-item svg {
    flex: 0 0 18px;
    height: 18px;
    width: 18px;
}

.lemyox-app .lemyox-nav-item:hover,
.lemyox-app .lemyox-nav-item.is-active {
    background: rgba(248, 250, 252, .07);
    border-left-color: var(--shell-orange);
    color: var(--shell-text);
}

.lemyox-app .lemyox-nav-item.is-active svg {
    color: var(--shell-orange);
}

.lemyox-app .lemyox-sidebar-bottom {
    border-color: var(--shell-border);
    padding-top: 14px;
}

.lemyox-app .lemyox-storage-card,
.lemyox-app .lemyox-user-box {
    background: var(--shell-panel);
    border-color: var(--shell-border);
    box-shadow: none;
    font-size: 11px;
}

.lemyox-app .lemyox-user-box {
    display: none;
}

.lemyox-app .lemyox-storage-card .lemyox-gradient-btn {
    background: transparent;
    border-color: var(--shell-orange);
    color: var(--shell-text);
    font-size: 12px;
    min-height: 35px;
}

.lemyox-app:not([data-current-view="studio"]) .lemyox-main {
    color: var(--shell-text);
    font-size: 14px;
}

.lemyox-app:not([data-current-view="studio"]) .lemyox-topbar h1,
.lemyox-app:not([data-current-view="studio"]) .lemyox-section-head h2 {
    font-size: 24px;
    letter-spacing: 0;
    line-height: 1.2;
}

.lemyox-app:not([data-current-view="studio"]) .lemyox-section-head p,
.lemyox-app:not([data-current-view="studio"]) .lemyox-eyebrow,
.lemyox-app:not([data-current-view="studio"]) .lemyox-card p,
.lemyox-app:not([data-current-view="studio"]) .lemyox-toolbar {
    font-size: 12px;
}

.lemyox-app:not([data-current-view="studio"]) .lemyox-card h3,
.lemyox-app:not([data-current-view="studio"]) .lemyox-stat-card h3 {
    font-size: 15px;
    letter-spacing: 0;
}

.lemyox-app:not([data-current-view="studio"]) button,
.lemyox-app:not([data-current-view="studio"]) input,
.lemyox-app:not([data-current-view="studio"]) select,
.lemyox-app:not([data-current-view="studio"]) textarea {
    font-size: 13px;
}

@media (max-width: 900px) {
    .lemyox-app .lemyox-sidebar {
        width: 270px;
    }
}

/* Online tools dashboard. */
.lemyox-app[data-current-view="tools"] {
    background:
        radial-gradient(circle at 76% 0%, rgba(155, 93, 229, .08), transparent 30%),
        radial-gradient(circle at 18% 0%, rgba(255, 115, 0, .07), transparent 28%),
        var(--shell-bg);
    color: var(--shell-text);
}

.lemyox-app[data-current-view="tools"] .lemyox-topbar,
.lemyox-app[data-current-view="tools"] .lemyox-stepper {
    display: none;
}

.lemyox-app[data-current-view="license"] .lemyox-stepper {
    display: none;
}

.lemyox-app[data-current-view="tools"] .lemyox-main {
    background: transparent;
    padding: 28px 32px 32px;
}

.lemyox-tools-page {
    display: grid;
    gap: 14px;
    margin: 0 auto;
    max-width: 1560px;
}

.lemyox-tools-titlebar {
    align-items: flex-start;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin-bottom: 8px;
}

.lemyox-tools-titlebar h2 {
    color: var(--shell-text);
    font-size: 26px;
    line-height: 1.12;
    margin: 0 0 9px;
}

.lemyox-tools-titlebar p {
    color: var(--shell-muted);
    font-size: 14px;
    margin: 0;
}

.lemyox-tools-actions {
    align-items: center;
    display: flex;
    gap: 14px;
}

.lemyox-tools-search {
    align-items: center;
    background: rgba(7, 13, 25, .54);
    border: 1px solid var(--shell-border);
    border-radius: 7px;
    color: #7f8da1;
    display: flex;
    gap: 10px;
    min-height: 46px;
    padding: 0 12px;
    width: min(400px, 34vw);
}

.lemyox-tools-search svg,
.lemyox-tools-stats svg,
.lemyox-tool-card svg,
.lemyox-tools-recent svg,
.lemyox-tools-tip svg {
    height: 20px;
    width: 20px;
}

.lemyox-tools-search input {
    background: transparent;
    border: 0;
    color: var(--shell-text);
    flex: 1;
    min-width: 0;
    padding: 0;
}

.lemyox-tools-search kbd {
    background: rgba(148, 163, 184, .12);
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 5px;
    color: #aab7c7;
    font-size: 11px;
    padding: 3px 8px;
}

.lemyox-tools-actions .lemyox-gradient-btn {
    align-items: center;
    border: 0;
    border-radius: 7px;
    display: inline-flex;
    gap: 9px;
    min-height: 46px;
    padding: 0 20px;
    text-decoration: none;
    white-space: nowrap;
    width: auto;
}

.lemyox-tools-actions .lemyox-gradient-btn span {
    font-size: 22px;
    line-height: 1;
}

.lemyox-tools-stats {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lemyox-tools-stats article,
.lemyox-tools-panel {
    background: linear-gradient(180deg, rgba(17, 25, 34, .96), rgba(12, 18, 26, .96));
    border: 1px solid var(--shell-border);
    border-radius: 8px;
    box-shadow: 0 16px 44px rgba(0, 0, 0, .18);
}

.lemyox-tools-stats article {
    align-items: center;
    display: flex;
    gap: 24px;
    min-height: 110px;
    padding: 20px 26px;
}

.lemyox-tools-stats article > span,
.lemyox-tool-card > span {
    align-items: center;
    background: rgba(255, 115, 0, .13);
    color: var(--shell-orange);
    display: inline-flex;
    justify-content: center;
}

.lemyox-tools-stats article > span {
    border-radius: 50%;
    flex: 0 0 auto;
    height: 62px;
    width: 62px;
}

.lemyox-tools-stats article > span svg {
    height: 30px;
    width: 30px;
}

.lemyox-tools-stats small,
.lemyox-tools-stats em {
    color: var(--shell-muted);
    display: block;
    font-size: 13px;
    font-style: normal;
}

.lemyox-tools-stats strong {
    color: var(--shell-text);
    display: block;
    font-size: 25px;
    line-height: 1.1;
    margin: 5px 0 7px;
}

.lemyox-tools-panel {
    padding: 18px;
}

.lemyox-tools-panel h3 {
    color: var(--shell-text);
    font-size: 18px;
    margin: 0 0 16px;
}

.lemyox-tools-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lemyox-tool-card {
    background: rgba(12, 20, 31, .72);
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 8px;
    display: grid;
    grid-template-columns: 62px minmax(0, 1fr);
    min-height: 148px;
    padding: 16px;
    position: relative;
}

.lemyox-tool-card::before {
    background: linear-gradient(90deg, rgba(255, 115, 0, .7), transparent);
    border-radius: 999px;
    content: "";
    height: 2px;
    left: 16px;
    opacity: .4;
    position: absolute;
    top: 16px;
    width: 44px;
}

.lemyox-tool-card > span {
    align-self: start;
    border-radius: 50%;
    height: 58px;
    margin-top: 16px;
    width: 58px;
}

.lemyox-tool-card > span svg {
    height: 28px;
    width: 28px;
}

.lemyox-tool-card h4 {
    color: var(--shell-text);
    font-size: 16px;
    margin: 14px 0 8px;
}

.lemyox-tool-card p {
    color: #aab7c7;
    font-size: 13px;
    line-height: 1.55;
    margin: 0;
}

.lemyox-tool-card footer {
    align-items: center;
    display: flex;
    gap: 12px;
    grid-column: 1 / -1;
    justify-content: space-between;
    margin-top: 20px;
}

.lemyox-tool-card small {
    align-items: center;
    color: #94a3b8;
    display: inline-flex;
    gap: 7px;
    min-width: 0;
}

.lemyox-tool-card small svg {
    height: 14px;
    width: 14px;
}

.lemyox-tool-card a,
.lemyox-tools-panel-head a {
    border: 1px solid rgba(255, 115, 0, .55);
    border-radius: 6px;
    color: #ff8b22;
    font-size: 12px;
    font-weight: 800;
    padding: 8px 12px;
    text-decoration: none;
    white-space: nowrap;
}

.lemyox-tools-panel-head a {
    border: 0;
    padding: 0;
}

.lemyox-tools-empty {
    border: 1px dashed rgba(148, 163, 184, .24);
    border-radius: 8px;
    color: var(--shell-muted);
    margin-top: 14px;
    padding: 26px;
    text-align: center;
}

.lemyox-tools-empty strong {
    color: var(--shell-text);
    display: block;
    margin-bottom: 5px;
}

.lemyox-tools-bottom {
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(0, 1fr) minmax(360px, 1fr);
}

.lemyox-tools-panel-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.lemyox-tools-panel-head h3 {
    align-items: center;
    display: inline-flex;
    gap: 10px;
}

.lemyox-tools-recent {
    display: grid;
    gap: 12px;
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
}

.lemyox-tools-recent li {
    align-items: center;
    display: grid;
    gap: 14px;
    grid-template-columns: 34px 120px minmax(0, 1fr) auto;
}

.lemyox-tools-recent li > span {
    align-items: center;
    background: rgba(255, 115, 0, .14);
    border-radius: 7px;
    color: var(--shell-orange);
    display: inline-flex;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.lemyox-tools-recent b {
    color: var(--shell-text);
}

.lemyox-tools-recent small,
.lemyox-tools-recent em {
    color: var(--shell-muted);
    font-size: 12px;
    font-style: normal;
}

.lemyox-tools-tip > div {
    align-items: center;
    background: linear-gradient(135deg, rgba(255, 115, 0, .11), rgba(255, 115, 0, .03));
    border: 1px solid rgba(255, 115, 0, .22);
    border-radius: 8px;
    display: flex;
    gap: 18px;
    min-height: 110px;
    padding: 20px;
}

.lemyox-tools-tip > div > span {
    color: var(--shell-orange);
    flex: 0 0 auto;
}

.lemyox-tools-tip > div > span svg {
    height: 30px;
    width: 30px;
}

.lemyox-tools-tip p {
    color: #c6d0dc;
    line-height: 1.55;
    margin: 0;
}

.lemyox-tools-tip b {
    color: #ffad5c;
    display: block;
    margin-bottom: 8px;
}

.lemyox-tools-tip nav {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 22px;
}

.lemyox-tools-tip nav i {
    background: rgba(148, 163, 184, .2);
    border-radius: 50%;
    height: 8px;
    width: 8px;
}

.lemyox-tools-tip nav i:first-child {
    background: var(--shell-orange);
    border-radius: 999px;
    width: 18px;
}

.lemyox-app[data-app-theme="light"] .lemyox-tools-stats article,
.lemyox-app[data-app-theme="light"] .lemyox-tools-panel {
    background: #fff;
    border-color: var(--shell-border);
}

.lemyox-app[data-app-theme="light"] .lemyox-tools-search,
.lemyox-app[data-app-theme="light"] .lemyox-tool-card,
.lemyox-app[data-app-theme="light"] .lemyox-tools-tip > div {
    background: #f8fafc;
    border-color: var(--shell-border);
}

.lemyox-app[data-app-theme="light"] .lemyox-tool-card p,
.lemyox-app[data-app-theme="light"] .lemyox-tools-tip p {
    color: #657183;
}

.lemyox-quick-tool { display: flex; flex-direction: column; gap: 18px; }
.lemyox-quick-tool__head { align-items: flex-end; display: flex; gap: 18px; justify-content: space-between; }
.lemyox-back-link { color: var(--lemyox-muted, #94a3b8); display: inline-flex; font-size: 13px; font-weight: 800; margin-bottom: 10px; text-decoration: none; }
.lemyox-quick-tool__head h2 { color: var(--lemyox-text, #f8fafc); font-size: 28px; line-height: 1.1; margin: 0; }
.lemyox-quick-tool__head p,
.lemyox-quick-tool__head > span { color: var(--lemyox-muted, #94a3b8); font-size: 14px; margin: 8px 0 0; }
.lemyox-quick-tool__head > span { background: rgba(255, 122, 26, .1); border: 1px solid rgba(255, 122, 26, .32); border-radius: 999px; color: #ffb076; flex: 0 0 auto; margin: 0; padding: 9px 14px; }
.lemyox-quick-tool__layout { display: grid; gap: 16px; grid-template-columns: minmax(320px, .95fr) minmax(300px, 1fr) minmax(300px, .95fr); }
.lemyox-quick-tool__panel { background: linear-gradient(180deg, rgba(17, 27, 42, .96), rgba(10, 19, 30, .96)); border: 1px solid rgba(148, 163, 184, .18); border-radius: 12px; box-shadow: 0 18px 45px rgba(0, 0, 0, .2); min-width: 0; padding: 18px; }
.lemyox-tool-drop { align-items: center; border: 1px dashed rgba(148, 163, 184, .35); border-radius: 12px; cursor: pointer; display: flex; flex-direction: column; gap: 8px; justify-content: center; min-height: 160px; overflow: hidden; padding: 22px; position: relative; text-align: center; }
.lemyox-tool-drop input { cursor: pointer; inset: 0; opacity: 0; position: absolute; }
.lemyox-tool-drop strong { color: var(--lemyox-text, #f8fafc); font-size: 16px; }
.lemyox-tool-drop small { color: var(--lemyox-muted, #94a3b8); line-height: 1.5; }
.lemyox-tool-drop.is-dragover { background: rgba(255, 122, 26, .08); border-color: rgba(255, 122, 26, .72); }
.lemyox-tool-options { display: grid; gap: 12px; margin-top: 16px; }
.lemyox-tool-option { background: rgba(7, 13, 25, .48); border: 1px solid rgba(148, 163, 184, .14); border-radius: 10px; color: var(--lemyox-text, #f8fafc); display: grid; gap: 8px; padding: 12px; }
.lemyox-tool-option[hidden] { display: none !important; }
.lemyox-tool-option span,
.lemyox-tool-option label { color: var(--lemyox-text, #f8fafc); font-size: 13px; font-weight: 800; }
.lemyox-tool-option b { color: #ff7a1a; font-size: 12px; }
.lemyox-tool-option input[type="range"] { accent-color: #ff7a1a; width: 100%; }
.lemyox-tool-option input[type="number"],
.lemyox-tool-option input[type="text"],
.lemyox-tool-option select { background: #070d19; border: 1px solid rgba(148, 163, 184, .22); border-radius: 8px; color: var(--lemyox-text, #f8fafc); min-height: 38px; padding: 8px 10px; }
.lemyox-tool-option--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lemyox-tool-actions { display: flex; gap: 10px; margin-top: 16px; }
.lemyox-tool-progress { background: rgba(7, 13, 25, .55); border: 1px solid rgba(148, 163, 184, .16); border-radius: 999px; color: var(--lemyox-muted, #94a3b8); margin-top: 14px; min-height: 34px; overflow: hidden; position: relative; }
.lemyox-tool-progress i { background: linear-gradient(90deg, #ff7a1a, #9b5de5); display: block; height: 4px; left: 0; position: absolute; top: 0; transition: width .2s ease; width: 0; }
.lemyox-tool-progress span { display: block; font-size: 12px; font-weight: 800; padding: 11px 14px 8px; }
.lemyox-tool-panel-head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 12px; }
.lemyox-tool-panel-head h3 { color: var(--lemyox-text, #f8fafc); font-size: 16px; margin: 0; }
.lemyox-tool-panel-head span { color: var(--lemyox-muted, #94a3b8); font-size: 12px; font-weight: 800; }
.lemyox-tool-file-list { display: grid; gap: 10px; max-height: 560px; overflow: auto; }
.lemyox-tool-file { align-items: center; background: rgba(7, 13, 25, .48); border: 1px solid rgba(148, 163, 184, .14); border-radius: 10px; display: grid; gap: 10px; grid-template-columns: 64px minmax(0, 1fr) 32px; padding: 8px; }
.lemyox-tool-file img { aspect-ratio: 1; border-radius: 8px; object-fit: cover; width: 64px; }
.lemyox-tool-file b,
.lemyox-tool-output-list b { color: var(--lemyox-text, #f8fafc); display: block; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lemyox-tool-file small,
.lemyox-tool-output-list span { color: var(--lemyox-muted, #94a3b8); font-size: 12px; }
.lemyox-tool-file button { background: rgba(255, 122, 26, .12); border: 1px solid rgba(255, 122, 26, .28); border-radius: 8px; color: #ff7a1a; cursor: pointer; font-size: 18px; height: 32px; width: 32px; }
.lemyox-tool-ready { background: linear-gradient(135deg, rgba(255, 122, 26, .16), rgba(155, 93, 229, .12)); border: 1px solid rgba(255, 122, 26, .34); border-radius: 12px; padding: 16px; }
.lemyox-tool-ready strong { color: var(--lemyox-text, #f8fafc); display: block; font-size: 17px; }
.lemyox-tool-ready p { color: var(--lemyox-muted, #94a3b8); margin: 8px 0 14px; }
.lemyox-tool-output-list { display: grid; gap: 8px; list-style: none; margin: 12px 0 0; padding: 0; }
.lemyox-tool-output-list li { background: rgba(7, 13, 25, .36); border: 1px solid rgba(148, 163, 184, .12); border-radius: 9px; padding: 10px 12px; }
.lemyox-app[data-app-theme="light"] .lemyox-quick-tool__panel,
.lemyox-app[data-app-theme="light"] .lemyox-tool-option,
.lemyox-app[data-app-theme="light"] .lemyox-tool-file,
.lemyox-app[data-app-theme="light"] .lemyox-tool-output-list li { background: #fff; border-color: rgba(15, 23, 42, .1); box-shadow: 0 16px 36px rgba(15, 23, 42, .06); }
.lemyox-app[data-app-theme="light"] .lemyox-tool-option input[type="number"],
.lemyox-app[data-app-theme="light"] .lemyox-tool-option input[type="text"],
.lemyox-app[data-app-theme="light"] .lemyox-tool-option select { background: #f8fafc; color: #0f172a; }

.lemyox-tools-workbench {
    overflow: hidden;
    padding: 0 !important;
}

.lemyox-tools-workbench-head {
    align-items: flex-end;
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, .12), transparent 34%),
        radial-gradient(circle at 78% 0%, rgba(155, 93, 229, .12), transparent 38%),
        rgba(7, 13, 25, .38);
    border-bottom: 1px solid rgba(148, 163, 184, .16);
    display: flex;
    gap: 18px;
    justify-content: space-between;
    padding: 20px;
}

.lemyox-tools-workbench-head span {
    color: #ff7a1a;
    display: block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.lemyox-tools-workbench-head h3 {
    color: var(--lemyox-text, #f8fafc);
    font-size: 22px;
    margin: 0;
}

.lemyox-tools-workbench-head p {
    color: var(--lemyox-muted, #94a3b8);
    margin: 8px 0 0;
}

.lemyox-tool-tabs {
    background: rgba(7, 13, 25, .58);
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 6px;
}

.lemyox-tool-tabs button {
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: var(--lemyox-muted, #94a3b8);
    cursor: pointer;
    font-size: 13px;
    font-weight: 900;
    min-height: 36px;
    padding: 0 12px;
}

.lemyox-tool-tabs button.is-active {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    color: #fff;
    box-shadow: 0 10px 24px rgba(255, 122, 26, .22);
}

.lemyox-tool-panels {
    padding: 18px;
}

.lemyox-tool-panel[hidden] {
    display: none !important;
}

.lemyox-tools-workbench .lemyox-quick-tool__head {
    align-items: center;
    background: rgba(7, 13, 25, .32);
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 12px;
    margin-bottom: 14px;
    padding: 16px;
}

.lemyox-tools-workbench .lemyox-back-link {
    display: none;
}

.lemyox-tools-workbench .lemyox-quick-tool__head h2 {
    font-size: 22px;
}

.lemyox-tools-workbench .lemyox-quick-tool__layout {
    grid-template-columns: minmax(300px, .9fr) minmax(320px, 1fr) minmax(300px, .9fr);
}

.lemyox-tool-card.is-selected {
    border-color: rgba(255, 122, 26, .62) !important;
    box-shadow: 0 18px 36px rgba(255, 122, 26, .12), inset 0 0 0 1px rgba(155, 93, 229, .18);
}

.lemyox-tool-card.is-selected footer a {
    background: linear-gradient(135deg, rgba(255, 122, 26, .24), rgba(155, 93, 229, .18));
    color: #ffb076;
}

.lemyox-app[data-app-theme="light"] .lemyox-tools-workbench-head,
.lemyox-app[data-app-theme="light"] .lemyox-tools-workbench .lemyox-quick-tool__head {
    background: #f8fafc;
}

.lemyox-app[data-app-theme="light"] .lemyox-tool-tabs {
    background: #eef2f7;
    border-color: rgba(15, 23, 42, .08);
}

.lemyox-tools-simple {
    display: grid;
    gap: 22px;
    min-height: calc(100vh - 140px);
}

.lemyox-tools-simple-hero {
    background:
        radial-gradient(circle at 80% 0%, rgba(155, 93, 229, .16), transparent 34%),
        radial-gradient(circle at 15% 0%, rgba(255, 122, 26, .14), transparent 32%),
        linear-gradient(180deg, rgba(17, 27, 42, .96), rgba(10, 19, 30, .96));
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 12px;
    padding: 24px;
}

.lemyox-tools-simple-hero span {
    color: #ff7a1a;
    display: block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.lemyox-tools-simple-hero h2 {
    color: var(--lemyox-text, #f8fafc);
    font-size: 30px;
    line-height: 1.1;
    margin: 0;
}

.lemyox-tools-simple-hero p {
    color: var(--lemyox-muted, #94a3b8);
    font-size: 15px;
    margin: 10px 0 0;
    max-width: 760px;
}

.lemyox-tools-simple-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-product-tools {
    display: grid;
    gap: 14px;
}

.lemyox-product-tools__head {
    align-items: end;
    display: flex;
    gap: 14px;
    justify-content: space-between;
}

.lemyox-product-tools__head span {
    color: #ff7a1a;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lemyox-product-tools__head h3 {
    color: var(--lemyox-text, #f8fafc);
    font-size: 18px;
    line-height: 1.2;
    margin: 0;
}

.lemyox-product-tools__grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lemyox-simple-tool-btn {
    align-items: flex-start;
    background: linear-gradient(180deg, rgba(17, 27, 42, .96), rgba(10, 19, 30, .96));
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 12px;
    color: var(--lemyox-text, #f8fafc);
    cursor: pointer;
    display: grid;
    gap: 10px;
    min-height: 178px;
    overflow: hidden;
    padding: 20px;
    position: relative;
    text-align: left;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.lemyox-simple-tool-btn::after {
    background: linear-gradient(135deg, rgba(255, 122, 26, .18), rgba(155, 93, 229, .12));
    content: "";
    inset: auto 0 0;
    height: 4px;
    opacity: 0;
    position: absolute;
    transition: opacity .18s ease;
}

.lemyox-simple-tool-btn:hover {
    border-color: rgba(255, 122, 26, .6);
    box-shadow: 0 20px 44px rgba(255, 122, 26, .12);
    transform: translateY(-2px);
}

.lemyox-simple-tool-btn:hover::after {
    opacity: 1;
}

.lemyox-simple-tool-btn > span {
    align-items: center;
    background: rgba(255, 122, 26, .12);
    border: 1px solid rgba(255, 122, 26, .28);
    border-radius: 12px;
    color: #ff7a1a;
    display: inline-flex;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.lemyox-simple-tool-btn svg {
    height: 24px;
    width: 24px;
}

.lemyox-simple-tool-btn b {
    color: var(--lemyox-text, #f8fafc);
    font-size: 18px;
    line-height: 1.2;
}

.lemyox-simple-tool-btn small {
    color: var(--lemyox-muted, #94a3b8);
    font-size: 13px;
    line-height: 1.5;
}

.lemyox-simple-tool-btn em {
    align-self: end;
    color: #ffb076;
    font-size: 12px;
    font-style: normal;
    font-weight: 900;
}

.lemyox-simple-tool-btn--product {
    min-height: 160px;
}

.lemyox-tool-modal[hidden] {
    display: none !important;
}

.lemyox-tool-modal {
    inset: 0;
    position: fixed;
    z-index: 9999;
}

.lemyox-tool-modal__backdrop {
    backdrop-filter: blur(8px);
    background: rgba(2, 6, 15, .74);
    inset: 0;
    position: absolute;
}

.lemyox-tool-modal__panel {
    background: linear-gradient(180deg, rgba(17, 27, 42, .98), rgba(7, 13, 25, .98));
    border: 1px solid rgba(148, 163, 184, .22);
    border-radius: 14px;
    box-shadow: 0 30px 90px rgba(0, 0, 0, .5);
    inset: 40px;
    overflow: hidden;
    position: absolute;
}

.lemyox-tool-modal__close {
    align-items: center;
    background: rgba(15, 23, 42, .92);
    border: 1px solid rgba(148, 163, 184, .28);
    border-radius: 12px;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .28);
    color: var(--lemyox-text, #f8fafc);
    cursor: pointer;
    display: inline-flex;
    font-size: 20px;
    font-weight: 900;
    height: 40px;
    justify-content: center;
    position: absolute;
    right: 18px;
    top: 18px;
    width: 42px;
    z-index: 5;
}

.lemyox-tool-modal__close:hover {
    background: linear-gradient(135deg, rgba(255, 122, 26, .24), rgba(155, 93, 229, .2));
    border-color: rgba(255, 122, 26, .5);
}

.lemyox-tool-modal__body {
    height: 100%;
    overflow: auto;
    padding: 72px 22px 22px;
}

.lemyox-modal-tool-panel[hidden] {
    display: none !important;
}

.lemyox-tool-modal .lemyox-quick-tool__head {
    align-items: center;
    border-radius: 12px;
    margin-bottom: 16px;
    min-height: 86px;
    padding: 18px 20px;
}

.lemyox-tool-modal .lemyox-back-link {
    display: none;
}

.lemyox-tool-modal .lemyox-quick-tool__head h2 {
    font-size: 24px;
    line-height: 1.18;
}

.lemyox-tool-modal .lemyox-quick-tool__head p {
    line-height: 1.55;
    margin-top: 7px;
}

.lemyox-tool-modal .lemyox-quick-tool__head > span {
    line-height: 1.35;
    max-width: 360px;
    text-align: right;
}

.lemyox-tool-modal .lemyox-quick-tool__layout {
    align-items: stretch;
    gap: 16px;
}

.lemyox-tool-modal .lemyox-quick-tool__panel {
    padding: 16px;
}

.lemyox-tool-modal .lemyox-tool-panel-head {
    min-height: 24px;
}

.lemyox-tool-modal .lemyox-tool-panel-head h3 {
    font-size: 15px;
    line-height: 1.25;
}

.lemyox-tool-modal .lemyox-tool-panel-head span {
    line-height: 1.2;
}

.lemyox-tool-modal .lemyox-tool-drop strong,
.lemyox-tool-modal .lemyox-tool-option span,
.lemyox-tool-modal .lemyox-tool-option label,
.lemyox-tool-modal .lemyox-tool-ready strong {
    line-height: 1.35;
}

.lemyox-preset-popup {
    display: grid;
    gap: 18px;
    margin: 0 auto;
    max-width: 920px;
    padding: 34px 12px;
}

.lemyox-preset-popup header span {
    color: #ff7a1a;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.lemyox-preset-popup header h2 {
    color: var(--lemyox-text, #f8fafc);
    font-size: 28px;
    margin: 8px 0;
}

.lemyox-preset-popup header p {
    color: var(--lemyox-muted, #94a3b8);
    margin: 0;
}

.lemyox-app[data-app-theme="light"] .lemyox-tools-simple-hero,
.lemyox-app[data-app-theme="light"] .lemyox-simple-tool-btn,
.lemyox-app[data-app-theme="light"] .lemyox-tool-modal__panel {
    background: #fff;
    border-color: rgba(15, 23, 42, .1);
}

/* Profile settings screen. */
.lemyox-app[data-current-view="profile"] {
    background:
        radial-gradient(circle at 72% 0%, rgba(155, 93, 229, .08), transparent 30%),
        radial-gradient(circle at 18% 0%, rgba(255, 115, 0, .07), transparent 28%),
        var(--shell-bg);
    color: var(--shell-text);
}

.lemyox-app[data-current-view="profile"] .lemyox-topbar,
.lemyox-app[data-current-view="profile"] .lemyox-stepper {
    display: none;
}

.lemyox-app[data-current-view="profile"] .lemyox-main {
    background: transparent;
    padding: 26px 32px 36px;
}

.lemyox-profile-page {
    display: grid;
    gap: 24px;
    margin: 0 auto;
    max-width: 1540px;
}

.lemyox-profile-titlebar {
    align-items: flex-start;
    display: flex;
    gap: 20px;
    justify-content: space-between;
}

.lemyox-profile-titlebar h2 {
    color: var(--shell-text);
    font-size: 26px;
    line-height: 1.12;
    margin: 0 0 8px;
}

.lemyox-profile-titlebar p {
    color: var(--shell-muted);
    font-size: 13px;
    margin: 0;
}

.lemyox-profile-titlebar .lemyox-gradient-btn {
    border: 0;
    border-radius: 7px;
    cursor: pointer;
    min-height: 42px;
    padding: 0 20px;
    width: auto;
}

.lemyox-profile-layout {
    align-items: start;
    display: grid;
    gap: 16px;
    grid-template-columns: 305px minmax(0, 1fr);
    min-width: 0;
}

.lemyox-profile-summary,
.lemyox-profile-panel {
    background: linear-gradient(180deg, rgba(17, 25, 34, .96), rgba(12, 18, 26, .96));
    border: 1px solid var(--shell-border);
    border-radius: 8px;
    box-shadow: 0 16px 44px rgba(0, 0, 0, .18);
}

.lemyox-profile-summary {
    display: grid;
    justify-items: center;
    padding: 20px 16px 16px;
}

.lemyox-profile-summary h3 {
    align-self: start;
    color: var(--shell-text);
    font-size: 16px;
    justify-self: start;
    margin: 0 0 20px;
}

.lemyox-profile-avatar {
    height: 112px;
    margin-bottom: 16px;
    position: relative;
    width: 112px;
}

.lemyox-profile-avatar img {
    background: #fff;
    border-radius: 50%;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.lemyox-profile-avatar button {
    align-items: center;
    background: #293443;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 50%;
    bottom: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    height: 30px;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 5px;
    width: 30px;
}

.lemyox-profile-avatar svg {
    height: 16px;
    width: 16px;
}

.lemyox-profile-summary > strong {
    color: var(--shell-text);
    font-size: 20px;
    line-height: 1.2;
}

.lemyox-profile-summary > p {
    color: var(--shell-muted);
    font-size: 13px;
    margin: 6px 0 28px;
}

.lemyox-profile-plan {
    align-items: center;
    display: flex;
    gap: 14px;
    margin-bottom: 28px;
}

.lemyox-profile-plan > span {
    align-items: center;
    background: linear-gradient(135deg, #7c3aed, #9b5de5);
    border-radius: 7px;
    color: #fff;
    display: inline-flex;
    font-weight: 800;
    height: 34px;
    justify-content: center;
    min-width: 44px;
    padding: 0 9px;
}

.lemyox-profile-plan b {
    color: var(--shell-text);
    display: block;
    font-size: 14px;
}

.lemyox-profile-plan small {
    color: var(--shell-muted);
}

.lemyox-profile-meter,
.lemyox-profile-joined {
    background: rgba(8, 14, 20, .42);
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 7px;
    justify-self: stretch;
    padding: 13px;
}

.lemyox-profile-meter div,
.lemyox-profile-joined {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.lemyox-profile-meter span,
.lemyox-profile-joined span {
    color: var(--shell-text);
    font-size: 12px;
    font-weight: 700;
}

.lemyox-profile-meter b,
.lemyox-profile-joined b {
    color: var(--shell-text);
    font-size: 11px;
}

.lemyox-profile-meter div b {
    color: var(--shell-orange);
}

.lemyox-profile-meter i {
    background: rgba(148, 163, 184, .18);
    border-radius: 999px;
    display: block;
    height: 5px;
    margin-top: 12px;
    overflow: hidden;
}

.lemyox-profile-meter i b {
    background: linear-gradient(90deg, #ff7300, #9b5de5);
    display: block;
    height: 100%;
}

.lemyox-profile-meter em {
    color: var(--shell-muted);
    display: block;
    font-size: 11px;
    font-style: normal;
    margin-top: 5px;
    text-align: right;
}

.lemyox-profile-joined {
    margin-top: 6px;
}

.lemyox-profile-form {
    display: grid;
    gap: 16px;
    max-width: none;
    min-width: 0;
}

.lemyox-profile-panel {
    min-width: 0;
    padding: 22px;
}

.lemyox-profile-tabs {
    align-items: stretch;
    border-bottom: 1px solid rgba(148, 163, 184, .16);
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin: 0 0 28px;
}

.lemyox-profile-tabs button {
    align-items: center;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    color: #a9b6c8;
    cursor: pointer;
    display: inline-flex;
    gap: 10px;
    justify-content: center;
    min-height: 50px;
    padding: 0 12px 14px;
}

.lemyox-profile-tabs button.is-active {
    border-bottom-color: var(--shell-orange);
    color: var(--shell-orange);
}

.lemyox-profile-tabs svg,
.lemyox-profile-options svg,
.lemyox-profile-settings-list svg,
.lemyox-profile-security-grid svg {
    height: 18px;
    width: 18px;
}

.lemyox-profile-section h3,
.lemyox-profile-appearance h3,
.lemyox-profile-other h3 {
    color: var(--shell-text);
    font-size: 17px;
    margin: 0 0 8px;
}

.lemyox-profile-section > p,
.lemyox-profile-appearance > p,
.lemyox-profile-other > p {
    color: var(--shell-muted);
    font-size: 13px;
    margin: 0 0 22px;
}

.lemyox-profile-fields {
    display: grid;
    gap: 18px 24px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lemyox-profile-fields label,
.lemyox-profile-form label {
    color: #b9c4d3;
    display: grid;
    font-size: 12px;
    font-weight: 700;
    gap: 8px;
    margin: 0;
}

.lemyox-profile-fields label.is-full {
    grid-column: 1 / -1;
}

.lemyox-profile-fields input,
.lemyox-profile-fields textarea,
.lemyox-profile-select select {
    background: rgba(4, 10, 18, .64);
    border: 1px solid rgba(148, 163, 184, .18);
    border-radius: 7px;
    color: var(--shell-text);
    min-height: 42px;
}

.lemyox-profile-fields input:disabled {
    opacity: .92;
}

.lemyox-profile-fields textarea {
    min-height: 44px;
    resize: vertical;
}

.lemyox-profile-options {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-profile-options article {
    background: rgba(8, 14, 20, .42);
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 8px;
    display: grid;
    gap: 9px;
    padding: 14px;
}

.lemyox-profile-options h4 {
    color: var(--shell-text);
    font-size: 13px;
    margin: 0;
}

.lemyox-profile-options article > p {
    color: var(--shell-muted);
    font-size: 12px;
    margin: 0 0 5px;
}

.lemyox-profile-options button,
.lemyox-profile-select {
    align-items: center;
    background: rgba(8, 14, 20, .46);
    border: 1px solid rgba(148, 163, 184, .12);
    border-radius: 7px;
    color: var(--shell-text);
    cursor: pointer;
    display: flex;
    gap: 12px;
    min-height: 47px;
    padding: 10px 12px;
    text-align: left;
}

.lemyox-profile-options button.is-active {
    background: rgba(255, 115, 0, .12);
    border-color: var(--shell-orange);
    box-shadow: inset 0 0 0 1px rgba(255, 115, 0, .12);
}

.lemyox-profile-options button > svg,
.lemyox-profile-select > svg {
    color: #aab7c7;
    flex: 0 0 auto;
}

.lemyox-profile-options button.is-active > svg {
    color: var(--shell-orange);
}

.lemyox-profile-options button span {
    display: grid;
    flex: 1;
    gap: 2px;
}

.lemyox-profile-options button b {
    color: var(--shell-text);
    font-size: 13px;
}

.lemyox-profile-options button small {
    color: var(--shell-muted);
    font-size: 11px;
}

.lemyox-profile-options button i {
    align-items: center;
    background: var(--shell-orange);
    border-radius: 50%;
    color: #fff;
    display: none;
    font-style: normal;
    height: 20px;
    justify-content: center;
    width: 20px;
}

.lemyox-profile-options button.is-active i {
    display: inline-flex;
}

.lemyox-profile-select select {
    appearance: none;
    background: transparent;
    border: 0;
    flex: 1;
    min-height: auto;
    padding: 0;
}

.lemyox-profile-settings-list,
.lemyox-profile-other {
    display: grid;
    gap: 10px;
}

.lemyox-profile-settings-list label,
.lemyox-profile-other label {
    align-items: center;
    background: rgba(8, 14, 20, .42);
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    min-height: 48px;
    padding: 12px 14px;
}

.lemyox-profile-settings-list label span {
    align-items: center;
    display: inline-flex;
    gap: 10px;
}

.lemyox-profile-settings-list input,
.lemyox-profile-other input {
    accent-color: var(--shell-orange);
    height: 18px;
    width: 18px;
}

.lemyox-profile-security-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lemyox-profile-security-grid .lemyox-ghost-btn {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    justify-content: center;
    text-decoration: none;
}

.lemyox-profile-security-grid span {
    color: var(--shell-muted);
    grid-column: 1 / -1;
}

.lemyox-profile-api-box {
    background: rgba(8, 14, 20, .42);
    border: 1px solid rgba(148, 163, 184, .14);
    border-radius: 8px;
    display: grid;
    gap: 10px;
    padding: 16px;
}

.lemyox-profile-api-box code {
    color: #ffb86c;
    white-space: normal;
}

.lemyox-profile-api-box span {
    color: var(--shell-muted);
    font-size: 12px;
}

.lemyox-app[data-app-theme="light"] .lemyox-profile-summary,
.lemyox-app[data-app-theme="light"] .lemyox-profile-panel {
    background: #fff;
}

.lemyox-app[data-app-theme="light"] .lemyox-profile-meter,
.lemyox-app[data-app-theme="light"] .lemyox-profile-joined,
.lemyox-app[data-app-theme="light"] .lemyox-profile-options article,
.lemyox-app[data-app-theme="light"] .lemyox-profile-options button,
.lemyox-app[data-app-theme="light"] .lemyox-profile-select,
.lemyox-app[data-app-theme="light"] .lemyox-profile-settings-list label,
.lemyox-app[data-app-theme="light"] .lemyox-profile-other label,
.lemyox-app[data-app-theme="light"] .lemyox-profile-api-box {
    background: #f8fafc;
    border-color: var(--shell-border);
}

.lemyox-app[data-app-theme="light"] .lemyox-profile-fields input,
.lemyox-app[data-app-theme="light"] .lemyox-profile-fields textarea {
    background: #fff;
}

/* Overview dashboard, scoped to the home/overview route. */
.lemyox-app[data-current-view="overview"] {
    background:
        radial-gradient(circle at 78% 0%, rgba(155, 93, 229, .08), transparent 30%),
        radial-gradient(circle at 18% 0%, rgba(255, 115, 0, .08), transparent 28%),
        #0b1118;
    color: var(--shell-text);
}

.lemyox-app[data-current-view="overview"] .lemyox-topbar,
.lemyox-app[data-current-view="overview"] .lemyox-stepper {
    display: none;
}

.lemyox-app[data-current-view="overview"] .lemyox-main {
    background: transparent;
    padding: 24px 32px 32px;
}

.lemyox-overview-page {
    display: grid;
    gap: 18px;
    margin: 0 auto;
    max-width: 1600px;
}

.lemyox-overview-header {
    align-items: flex-start;
    display: flex;
    gap: 24px;
    justify-content: space-between;
}

.lemyox-overview-header h2 {
    color: #fff;
    font-size: 26px;
    letter-spacing: 0;
    line-height: 1.12;
    margin: 0 0 10px;
}

.lemyox-overview-header h2 span {
    font-size: 22px;
}

.lemyox-overview-header p {
    color: var(--shell-muted);
    font-size: 13px;
    margin: 0;
}

.lemyox-overview-actions {
    align-items: center;
    display: flex;
    gap: 12px;
    padding-top: 8px;
}

.lemyox-overview-actions a {
    align-items: center;
    border-radius: 7px;
    display: inline-flex;
    gap: 9px;
    min-height: 42px;
    padding: 0 18px;
    text-decoration: none;
    white-space: nowrap;
}

.lemyox-overview-actions svg,
.lemyox-overview-tips svg,
.lemyox-overview-empty svg,
.lemyox-overview-project-list svg,
.lemyox-overview-export-list svg {
    height: 18px;
    width: 18px;
}

.lemyox-overview-stats {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lemyox-overview-stats article,
.lemyox-overview-panel {
    background: linear-gradient(180deg, rgba(17, 25, 34, .96), rgba(12, 18, 26, .96));
    border: 1px solid var(--shell-border);
    border-radius: 8px;
    box-shadow: 0 16px 44px rgba(0, 0, 0, .18);
}

.lemyox-overview-stats article {
    align-items: center;
    display: flex;
    gap: 22px;
    min-height: 134px;
    padding: 24px 26px;
}

.lemyox-overview-stats article > span {
    align-items: center;
    border-radius: 13px;
    display: inline-flex;
    flex: 0 0 auto;
    height: 66px;
    justify-content: center;
    width: 66px;
}

.lemyox-overview-stats article > span svg {
    height: 32px;
    width: 32px;
}

.lemyox-overview-stats .is-orange > span {
    background: rgba(255, 115, 0, .14);
    color: #ff7300;
}

.lemyox-overview-stats .is-purple > span {
    background: rgba(155, 93, 229, .15);
    color: #a96dff;
}

.lemyox-overview-stats .is-blue > span {
    background: rgba(59, 130, 246, .15);
    color: #68a7ff;
}

.lemyox-overview-stats .is-green > span {
    background: rgba(34, 197, 94, .15);
    color: #63d985;
}

.lemyox-overview-stats small,
.lemyox-overview-stats em {
    color: var(--shell-muted);
    display: block;
    font-size: 13px;
    font-style: normal;
}

.lemyox-overview-stats strong {
    color: #fff;
    display: block;
    font-size: 26px;
    letter-spacing: -.01em;
    line-height: 1.15;
    margin: 5px 0 10px;
}

.lemyox-overview-stats .is-orange em {
    color: #ff7300;
}

.lemyox-overview-stats .is-purple em {
    color: #b77cff;
}

.lemyox-overview-stats .is-green em {
    color: #61d985;
}

.lemyox-overview-stats i {
    background: rgba(148, 163, 184, .18);
    border-radius: 999px;
    display: block;
    height: 5px;
    margin-top: 11px;
    overflow: hidden;
    width: min(210px, 100%);
}

.lemyox-overview-stats i b {
    background: linear-gradient(90deg, #ff7300, #9b5de5);
    border-radius: inherit;
    display: block;
    height: 100%;
}

.lemyox-overview-workspace {
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1.55fr) minmax(360px, 1fr);
}

.lemyox-overview-panel {
    padding: 22px;
}

.lemyox-overview-panel-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.lemyox-overview-panel h3 {
    color: #fff;
    font-size: 16px;
    line-height: 1.2;
    margin: 0;
}

.lemyox-overview-panel-head > span,
.lemyox-overview-panel-head > a {
    color: #ff7300;
    display: inline-flex;
    text-decoration: none;
}

.lemyox-overview-project-list,
.lemyox-overview-export-list {
    display: grid;
    list-style: none;
    margin: 0;
    padding: 0;
}

.lemyox-overview-project-list li,
.lemyox-overview-export-list li {
    align-items: center;
    border-bottom: 1px solid rgba(148, 163, 184, .14);
    display: grid;
    gap: 14px;
    min-height: 62px;
}

.lemyox-overview-project-list li {
    grid-template-columns: 38px minmax(0, 1fr) auto;
}

.lemyox-overview-export-list li {
    grid-template-columns: 38px minmax(0, 1fr) auto;
}

.lemyox-overview-project-list li:last-child,
.lemyox-overview-export-list li:last-child {
    border-bottom: 0;
}

.lemyox-overview-project-list li > span,
.lemyox-overview-export-list li > span {
    align-items: center;
    background: rgba(255, 115, 0, .12);
    border-radius: 8px;
    color: #ff7300;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.lemyox-overview-project-list b,
.lemyox-overview-export-list b {
    color: #fff;
    display: block;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-overview-project-list small,
.lemyox-overview-export-list small,
.lemyox-overview-project-list em {
    color: #9aa6b2;
    font-size: 12px;
    font-style: normal;
}

.lemyox-overview-project-list em {
    color: #fff;
    font-weight: 700;
}

.lemyox-overview-export-list a {
    color: #ff7300;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.lemyox-overview-more {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    justify-content: center;
    margin-top: 12px;
    text-decoration: none;
}

.lemyox-overview-empty {
    align-items: center;
    border: 1px solid rgba(148, 163, 184, .15);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 300px;
    padding: 28px;
    text-align: center;
}

.lemyox-overview-empty > span {
    align-items: center;
    background: linear-gradient(180deg, rgba(148, 163, 184, .22), rgba(148, 163, 184, .08));
    border-radius: 20px;
    color: #b5c0cd;
    display: inline-flex;
    height: 88px;
    justify-content: center;
    margin-bottom: 18px;
    width: 96px;
}

.lemyox-overview-empty > span svg {
    height: 48px;
    width: 48px;
}

.lemyox-overview-empty strong {
    color: #fff;
    font-size: 16px;
}

.lemyox-overview-empty p {
    color: var(--shell-muted);
    margin: 8px 0 18px;
}

.lemyox-overview-empty .lemyox-ghost-btn {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    min-height: 40px;
    width: auto;
}

.lemyox-overview-tips > div {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 14px;
}

.lemyox-overview-tips article {
    align-items: center;
    background: rgba(8, 14, 20, .54);
    border: 1px solid rgba(148, 163, 184, .16);
    border-radius: 8px;
    display: flex;
    gap: 18px;
    min-height: 94px;
    padding: 18px 22px;
}

.lemyox-overview-tips article span {
    align-items: center;
    border-radius: 10px;
    display: inline-flex;
    flex: 0 0 auto;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.lemyox-overview-tips article:nth-child(1) span {
    background: rgba(255, 115, 0, .13);
    color: #ff7300;
}

.lemyox-overview-tips article:nth-child(2) span {
    background: rgba(155, 93, 229, .15);
    color: #a96dff;
}

.lemyox-overview-tips article:nth-child(3) span {
    background: rgba(34, 197, 94, .15);
    color: #63d985;
}

.lemyox-overview-tips p {
    color: #c2cbd6;
    font-size: 13px;
    margin: 0;
}

.lemyox-overview-tips b {
    color: #fff;
    display: block;
    margin-bottom: 3px;
}

/* Projects reference UI: dark/light desktop layouts supplied by the product owner. */
.lemyox-sidebar-user-card {
    align-items: center;
    background: var(--shell-panel);
    border: 1px solid var(--shell-border);
    border-radius: 7px;
    color: var(--shell-text);
    display: flex;
    gap: 10px;
    margin: 0 8px 8px;
    padding: 11px 9px;
    text-decoration: none;
}

.lemyox-sidebar-user-card img {
    border: 1px solid #45556a;
    border-radius: 50%;
    height: 42px;
    object-fit: cover;
    width: 42px;
}

.lemyox-sidebar-user-card span {
    display: grid;
    flex: 1;
    gap: 2px;
    min-width: 0;
}

.lemyox-sidebar-user-card strong {
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-sidebar-user-card small {
    color: var(--shell-muted);
    font-size: 10px;
}

.lemyox-sidebar-user-card b {
    background: #6941d9;
    border-radius: 4px;
    color: #fff;
    font-size: 9px;
    padding: 3px 5px;
}

.lemyox-app .lemyox-brand-text strong {
    font-size: 0;
}

.lemyox-app .lemyox-brand-text strong::before {
    color: var(--shell-text);
    content: "Lemy";
    font-size: 27px;
}

.lemyox-app .lemyox-brand-text strong::after {
    color: var(--shell-orange);
    content: "OX";
    font-size: 27px;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-page {
    padding: 23px 32px 18px 27px;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-header {
    margin-bottom: 18px;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-heading h2 {
    font-size: 24px;
    font-weight: 750;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-search {
    min-width: 308px;
    width: 308px;
}

.lemyox-app[data-current-view="projects"] [data-project-theme-toggle] {
    bottom: 18px;
    display: inline-flex;
    left: 17px;
    position: fixed;
    z-index: 12;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-form input {
    display: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-form button {
    border-radius: 6px;
    min-width: 150px;
    padding: 0 18px;
    position: relative;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-form button::after {
    content: none;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats {
    gap: 13px;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin-bottom: 23px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats article {
    align-items: center;
    min-height: 88px;
    padding: 11px 13px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stat-icon {
    flex: 0 0 34px;
    font-size: 18px;
    height: 34px;
    width: 34px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats article div {
    align-content: center;
    gap: 3px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats strong {
    font-size: 19px;
    line-height: 1.15;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stat-progress {
    margin-top: 4px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-controls {
    margin-bottom: 14px;
    min-height: 44px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-control-actions {
    align-items: center;
    flex-wrap: nowrap;
    gap: 11px;
    white-space: nowrap;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-view-switch {
    display: inline-flex;
    flex: 0 0 auto;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-view-switch button {
    height: 44px;
    min-height: 44px;
    padding: 0;
    width: 46px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-view-switch button.is-active {
    background: color-mix(in srgb, var(--project-orange) 13%, var(--project-panel-soft));
}

.lemyox-app[data-current-view="projects"] .lemyox-project-filter-button {
    display: inline-flex;
    flex: 0 0 auto;
    min-width: 86px;
    width: auto;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-grid {
    gap: 13px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-cover {
    aspect-ratio: 2.18 / 1;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile-body {
    min-height: 89px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-upgrade {
    margin-top: 22px;
    min-height: 87px;
}

.lemyox-app[data-current-view="projects"] .lemyox-sidebar-bottom {
    padding-bottom: 54px;
}

.lemyox-app[data-current-view="projects"] .lemyox-nav-label:has(+ .lemyox-nav-item[data-view="profile"]),
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[data-view="profile"],
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[data-view="plan"],
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[data-view="storage"],
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[data-view="security"],
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[data-view="guide"],
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[data-view="support"],
.lemyox-app[data-current-view="projects"] .lemyox-nav-item[href*="action=logout"] {
    display: none;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] {
    --shell-sidebar: #fff;
    --shell-panel: #fff;
    --shell-border: #e4e7eb;
    --shell-text: #15191e;
    --shell-muted: #66717d;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-sidebar {
    background: #fff;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-nav-item:hover,
.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-nav-item.is-active {
    background: #fff4ec;
    color: #f05a00;
}

/* Library reference UI: scoped to keep the studio/editor and other pages unchanged. */
.lemyox-app[data-current-view="library"] {
    --library-bg: #0b1118;
    --library-panel: #111922;
    --library-panel-soft: #0e161f;
    --library-border: #26313b;
    --library-text: #f6f8fb;
    --library-muted: #9aa6b4;
    --library-orange: #ff7300;
    --library-pink: #ff3e9e;
    background: var(--library-bg);
    color: var(--library-text);
}

.lemyox-app[data-current-view="library"] .lemyox-topbar,
.lemyox-app[data-current-view="library"] .lemyox-stepper {
    display: none;
}

.lemyox-app[data-current-view="library"] .lemyox-main {
    background: var(--library-bg);
    min-width: 0;
    padding: 26px 28px 28px;
}

.lemyox-library-page {
    color: var(--library-text);
    display: grid;
    gap: 18px;
}

.lemyox-library-header {
    align-items: flex-start;
    display: flex;
    gap: 18px;
    justify-content: space-between;
}

.lemyox-library-mobile-menu {
    margin: 0 0 12px;
}

.lemyox-library-header h2 {
    color: var(--library-text);
    font-size: 28px;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.12;
    margin: 0 0 8px;
}

.lemyox-library-header p {
    color: #b2bdca;
    font-size: 13px;
    font-weight: 500;
    margin: 0;
}

.lemyox-library-upload {
    align-items: center;
    background: var(--library-orange);
    border: 1px solid var(--library-orange);
    border-radius: 7px;
    box-shadow: 0 12px 24px rgba(255, 115, 0, .22);
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 800;
    gap: 8px;
    justify-content: center;
    min-height: 42px;
    padding: 0 18px;
    text-decoration: none;
}

.lemyox-library-toolbar {
    align-items: center;
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(320px, 380px) minmax(0, 1fr);
}

.lemyox-library-search {
    align-items: center;
    background: var(--library-panel-soft);
    border: 1px solid var(--library-border);
    border-radius: 7px;
    color: var(--library-muted);
    display: flex;
    gap: 9px;
    min-height: 46px;
    padding: 0 14px;
}

.lemyox-library-search input {
    background: transparent;
    border: 0;
    color: var(--library-text);
    flex: 1;
    min-height: 44px;
    min-width: 0;
    outline: 0;
    padding: 0;
}

.lemyox-library-search input::placeholder {
    color: var(--library-muted);
}

.lemyox-library-filters {
    align-items: center;
    display: flex;
    gap: 11px;
    justify-content: flex-end;
    min-width: 0;
}

.lemyox-library-filters select,
.lemyox-library-filter-btn,
.lemyox-library-sort {
    background: #0f1724;
    border: 1px solid var(--library-border);
    border-radius: 7px;
    color: var(--library-text);
    min-height: 46px;
}

.lemyox-library-filters select {
    min-width: 218px;
    padding: 0 38px 0 15px;
}

.lemyox-library-filter-btn {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    font-weight: 650;
    gap: 7px;
    justify-content: center;
    min-width: 112px;
    padding: 0 14px;
    white-space: nowrap;
}

.lemyox-library-selectionbar {
    align-items: center;
    background: var(--library-panel);
    border: 1px solid var(--library-border);
    border-radius: 8px;
    box-shadow: none;
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    margin: 0;
    min-height: 58px;
    padding: 8px 10px 8px 16px;
}

.lemyox-library-selectionbar strong {
    color: var(--library-text);
    flex: 0 0 auto;
    font-size: 13px;
    min-width: 104px;
}

.lemyox-library-selectionbar [data-library-project-title] {
    display: none;
}

.lemyox-library-selectionbar .lemyox-ghost-btn,
.lemyox-library-selectionbar .lemyox-gradient-btn,
.lemyox-library-viewbar button,
.lemyox-library-sort {
    border-radius: 7px;
    font-size: 12px;
    font-weight: 800;
    min-height: 38px;
}

.lemyox-library-selectionbar .lemyox-ghost-btn {
    background: #0f1724;
    border-color: var(--library-border);
    color: var(--library-text);
    padding: 0 15px;
}

.lemyox-library-selectionbar .lemyox-gradient-btn {
    background: rgba(255, 62, 158, .12);
    border: 1px solid rgba(255, 62, 158, .42);
    color: #ff6eb5;
    padding: 0 16px;
}

.lemyox-library-selectionbar .lemyox-gradient-btn:disabled,
.lemyox-library-selectionbar .lemyox-ghost-btn:disabled {
    cursor: not-allowed;
    opacity: .58;
}

.lemyox-library-viewbar {
    align-items: center;
    display: inline-flex;
    gap: 7px;
    margin-left: auto;
}

.lemyox-library-viewbar button {
    align-items: center;
    background: #0f1724;
    border: 1px solid var(--library-border);
    color: var(--library-muted);
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    padding: 0;
    width: 40px;
}

.lemyox-library-viewbar button.is-active {
    background: rgba(255, 115, 0, .15);
    border-color: var(--library-orange);
    color: var(--library-orange);
}

.lemyox-library-sort {
    min-width: 126px;
    padding: 0 34px 0 13px;
}

.lemyox-library-selectionbar .lemyox-toolbar-count {
    color: var(--library-muted);
    display: none;
    font-size: 12px;
    margin-left: 0;
}

.lemyox-library-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.lemyox-library-list-head,
.lemyox-image-date {
    display: none;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card {
    background: var(--library-panel);
    border: 1px solid var(--library-border);
    border-radius: 8px;
    box-shadow: none;
    overflow: hidden;
    padding: 0;
    transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card:hover {
    border-color: #3a4754;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .28);
    transform: translateY(-1px);
}

.lemyox-image-thumb {
    aspect-ratio: 1.48 / 1;
    background: #0c131c;
    overflow: hidden;
    position: relative;
}

.lemyox-image-thumb-empty {
    align-items: center;
    color: var(--library-muted);
    display: flex;
    font-size: 11px;
    font-weight: 800;
    height: 100%;
    justify-content: center;
    padding: 10px;
    text-align: center;
}

.lemyox-app[data-current-view="library"] .lemyox-image-thumb img,
.lemyox-app[data-current-view="library"] .lemyox-image-card > img {
    aspect-ratio: auto;
    background: #0c131c;
    border: 0;
    border-radius: 0;
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.lemyox-app[data-current-view="library"] .lemyox-select-check {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 4px;
    display: inline-flex;
    height: 23px;
    left: 9px;
    padding: 0;
    position: absolute;
    top: 9px;
    width: 23px;
    z-index: 1;
}

.lemyox-app[data-current-view="library"] .lemyox-select-check input {
    appearance: none;
    background: rgba(247, 250, 252, .94);
    border: 1px solid rgba(123, 140, 158, .76);
    border-radius: 4px;
    cursor: pointer;
    height: 23px;
    margin: 0;
    width: 23px;
}

.lemyox-app[data-current-view="library"] .lemyox-select-check input:checked {
    background: var(--library-orange);
    border-color: var(--library-orange);
    box-shadow: inset 0 0 0 5px #fff;
}

.lemyox-app[data-current-view="library"] .lemyox-select-check span {
    clip: rect(0 0 0 0);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card h3,
.lemyox-app[data-current-view="library"] .lemyox-image-card p,
.lemyox-app[data-current-view="library"] .lemyox-image-card > span,
.lemyox-app[data-current-view="library"] .lemyox-image-card .lemyox-card-actions {
    margin-left: 12px;
    margin-right: 12px;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card h3 {
    color: var(--library-text);
    font-size: 12px;
    font-weight: 850;
    letter-spacing: 0;
    line-height: 1.35;
    margin-bottom: 8px;
    margin-top: 12px;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card .lemyox-image-meta {
    color: #b6c1ce;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.35;
    margin-bottom: 10px;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card > .lemyox-image-project {
    color: #c9d3df;
    display: block;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.25;
    margin-bottom: 10px;
}

.lemyox-app[data-current-view="library"] .lemyox-card-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    margin-bottom: 12px;
    min-height: 22px;
}

.lemyox-app[data-current-view="library"] .lemyox-card-actions .lemyox-ghost-btn,
.lemyox-app[data-current-view="library"] .lemyox-card-actions .lemyox-danger-btn {
    display: none;
}

.lemyox-library-more {
    background: transparent;
    border: 0;
    color: var(--library-text);
    cursor: pointer;
    font-size: 16px;
    font-weight: 900;
    letter-spacing: 2px;
    margin-left: auto;
    padding: 0;
}

.lemyox-library-menu {
    background: var(--library-panel);
    border: 1px solid var(--library-border);
    border-radius: 7px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .32);
    min-width: 150px;
    padding: 6px;
    position: absolute;
    right: 10px;
    top: calc(100% - 8px);
    z-index: 20;
}

.lemyox-library-menu.is-floating {
    position: fixed;
    right: auto;
    top: auto;
    z-index: 10000;
}

.lemyox-library-menu a,
.lemyox-library-menu button {
    background: transparent;
    border: 0;
    border-radius: 5px;
    color: var(--library-text);
    cursor: pointer;
    display: block;
    font: inherit;
    font-size: 12px;
    font-weight: 750;
    padding: 9px 10px;
    text-align: left;
    text-decoration: none;
    width: 100%;
}

.lemyox-library-menu a:hover,
.lemyox-library-menu button:hover {
    background: var(--library-panel-soft);
}

.lemyox-library-menu .is-danger {
    color: #ff716a;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card.is-selected {
    border-color: var(--library-orange);
    box-shadow: 0 0 0 1px rgba(255, 115, 0, .38), 0 18px 44px rgba(0, 0, 0, .28);
}

.lemyox-library-pagination {
    align-items: center;
    background: var(--library-panel);
    border: 1px solid var(--library-border);
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    margin-top: 6px;
    min-height: 58px;
    padding: 9px 12px;
}

.lemyox-library-pagination > span {
    color: #c1cad5;
    font-size: 13px;
    font-weight: 600;
}

.lemyox-library-pagination div {
    align-items: center;
    display: flex;
    gap: 8px;
}

.lemyox-library-pagination button {
    background: #0f1724;
    border: 1px solid var(--library-border);
    border-radius: 7px;
    color: var(--library-text);
    cursor: pointer;
    font-weight: 800;
    height: 38px;
    min-width: 38px;
}

.lemyox-library-pagination button.is-active {
    background: rgba(255, 115, 0, .14);
    border-color: var(--library-orange);
    color: var(--library-orange);
}

.lemyox-library-pagination button:disabled {
    color: #607082;
    cursor: not-allowed;
    opacity: .75;
}

.lemyox-library-pagination div span {
    color: var(--library-muted);
    padding: 0 4px;
}

@media (min-width: 901px) {
    .lemyox-library-list-head.is-visible {
        align-items: center;
        border-bottom: 1px solid var(--library-border);
        color: var(--library-text);
        display: grid;
        font-size: 12px;
        font-weight: 850;
        gap: 14px;
        grid-template-columns: 64px minmax(250px, 2fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(145px, .8fr) 54px;
        padding: 8px 12px 10px;
    }

    .lemyox-library-list-head strong:first-child {
        grid-column: 1 / 3;
    }

    .lemyox-library-grid.is-list-view {
        display: block;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card {
        align-items: center;
        background: transparent;
        border: 0;
        border-bottom: 1px solid var(--library-border);
        border-radius: 0;
        box-shadow: none;
        display: grid;
        gap: 14px;
        grid-template-columns: 64px minmax(250px, 2fr) minmax(150px, .8fr) minmax(150px, .8fr) minmax(145px, .8fr) 54px;
        min-height: 82px;
        overflow: visible;
        padding: 9px 12px;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card:hover {
        background: color-mix(in srgb, var(--library-text) 4%, transparent);
        box-shadow: none;
        transform: none;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-thumb {
        aspect-ratio: 1 / 1;
        border-radius: 8px;
        height: 62px;
        width: 62px;
    }

    .lemyox-library-grid.is-list-view .lemyox-select-check {
        height: 18px;
        left: 5px;
        top: 5px;
        width: 18px;
    }

    .lemyox-library-grid.is-list-view .lemyox-select-check input {
        height: 18px;
        width: 18px;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card h3,
    .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project,
    .lemyox-library-grid.is-list-view .lemyox-image-date,
    .lemyox-library-grid.is-list-view .lemyox-card-actions {
        margin: 0;
        min-width: 0;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card h3 {
        font-size: 13px;
        white-space: normal;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project,
    .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-library-grid.is-list-view .lemyox-image-date {
        align-items: center;
        display: flex;
        font-size: 12px;
        min-height: 20px;
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project {
        color: var(--library-muted);
    }

    .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-library-grid.is-list-view .lemyox-image-date {
        color: #b9c4d0;
    }

    .lemyox-library-grid.is-list-view .lemyox-card-actions {
        justify-content: flex-end;
    }
}

@media (max-width: 900px) {
    .lemyox-app[data-current-view="projects"] .lemyox-project-form input {
        display: block;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lemyox-library-toolbar {
        grid-template-columns: 1fr;
    }

    .lemyox-library-filters {
        justify-content: flex-start;
        overflow-x: auto;
    }

    .lemyox-library-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lemyox-library-selectionbar {
        flex-wrap: wrap;
    }

    .lemyox-library-viewbar {
        margin-left: 0;
    }

    .lemyox-library-list-head {
        display: none !important;
    }

    .lemyox-library-grid.is-list-view {
        display: grid;
    }
}

@media (max-width: 620px) {
    .lemyox-app[data-current-view="library"] {
        display: block;
        grid-template-columns: 1fr;
    }

    .lemyox-app[data-current-view="library"] .lemyox-sidebar {
        position: fixed;
        width: min(320px, 86vw);
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-stats {
        grid-template-columns: 1fr;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-control-actions {
        overflow-x: auto;
        padding-bottom: 2px;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-filter-button span {
        display: inline;
    }

    .lemyox-app[data-current-view="library"] .lemyox-main {
        padding: 18px 14px 24px;
    }

    .lemyox-library-header {
        align-items: stretch;
        flex-direction: column;
    }

    .lemyox-library-upload {
        width: 100%;
    }

    .lemyox-library-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .lemyox-library-filters select {
        min-width: 190px;
    }

    .lemyox-library-pagination {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }
}

body.lemyox-has-modal {
    overflow: hidden;
}

.lemyox-project-create-modal {
    align-items: center;
    display: flex;
    inset: 0;
    justify-content: center;
    padding: 20px;
    position: fixed;
    z-index: 9999;
}

.lemyox-project-create-modal[hidden] {
    display: none;
}

.lemyox-project-create-backdrop {
    backdrop-filter: blur(3px);
    background: rgba(2, 7, 13, .74);
    border: 0;
    inset: 0;
    position: absolute;
}

.lemyox-project-create-dialog {
    background: var(--project-panel);
    border: 1px solid var(--project-border);
    border-radius: 8px;
    box-shadow: 0 26px 70px rgba(0, 0, 0, .48);
    color: var(--project-text);
    max-width: 440px;
    padding: 28px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.lemyox-project-create-mark {
    align-items: center;
    background: var(--project-orange);
    border-radius: 7px;
    color: #fff;
    display: flex;
    font-size: 23px;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.lemyox-project-create-heading {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-bottom: 22px;
}

.lemyox-project-create-dialog h3 {
    font-size: 20px;
    margin: 0;
}

.lemyox-project-create-dialog p {
    color: var(--project-muted);
    font-size: 12px;
    margin: 0 0 22px;
}

.lemyox-project-create-dialog label {
    color: var(--project-muted);
    display: grid;
    font-size: 11px;
    gap: 7px;
}

.lemyox-project-create-dialog input {
    background: var(--project-panel-soft) !important;
    border: 1px solid var(--project-border) !important;
    border-radius: 6px !important;
    color: var(--project-text) !important;
    height: 44px;
    padding: 0 12px !important;
    width: 100%;
}

.lemyox-project-create-dialog input:focus {
    border-color: var(--project-orange) !important;
    box-shadow: 0 0 0 3px rgba(255, 115, 0, .12) !important;
    outline: 0;
}

.lemyox-project-create-x {
    background: transparent;
    border: 0;
    color: var(--project-muted);
    cursor: pointer;
    font-size: 25px !important;
    line-height: 1;
    padding: 5px;
    position: absolute;
    right: 13px;
    top: 11px;
}

.lemyox-project-create-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 24px;
}

.lemyox-project-create-actions button {
    background: transparent;
    border: 1px solid var(--project-border);
    border-radius: 6px;
    color: var(--project-text);
    cursor: pointer;
    min-height: 40px;
    padding: 0 16px;
}

.lemyox-project-create-actions [data-project-create-confirm] {
    background: var(--project-orange);
    border-color: var(--project-orange);
    color: #fff;
    font-weight: 700;
}

.lemyox-project-create-actions button:disabled {
    cursor: wait;
    opacity: .65;
}

@media (max-width: 520px) {
    .lemyox-project-create-dialog {
        padding: 22px 18px;
    }

    .lemyox-project-create-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }
}

.lemyox-project-list-head,
.lemyox-project-list-owner,
.lemyox-project-list-type,
.lemyox-project-list-modified,
.lemyox-project-list-actions {
    display: none;
}

@media (min-width: 901px) {
    .lemyox-project-list-head.is-visible {
        align-items: center;
        border-bottom: 1px solid var(--project-border);
        color: var(--project-text);
        display: grid;
        font-size: 12px;
        gap: 12px;
        grid-template-columns: 64px minmax(220px, 2fr) 160px 170px 180px 78px;
        padding: 9px 12px 11px;
    }

    .lemyox-project-list-head strong:first-child {
        grid-column: 1 / 3;
    }

    .lemyox-projects-grid.is-list-view {
        display: block;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-tile {
        align-items: center;
        background: transparent;
        border: 0;
        border-bottom: 1px solid var(--project-border);
        border-radius: 0;
        display: grid;
        gap: 12px;
        grid-template-columns: 64px minmax(220px, 2fr) 160px 170px 180px 78px;
        min-height: 82px;
        padding: 9px 12px;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-tile:hover {
        background: color-mix(in srgb, var(--project-text) 4%, transparent);
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-cover {
        aspect-ratio: 1 / 1;
        border-radius: 8px;
        height: 62px;
        width: 62px;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-cover b {
        display: none;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-cover-placeholder {
        font-size: 10px;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-tile-body {
        min-height: 0;
        padding: 0;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-tile h3 {
        font-size: 13px;
        margin: 0;
        white-space: normal;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-meta,
    .lemyox-projects-grid.is-list-view .lemyox-project-updated {
        display: none;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-owner,
    .lemyox-projects-grid.is-list-view .lemyox-project-list-type,
    .lemyox-projects-grid.is-list-view .lemyox-project-list-modified,
    .lemyox-projects-grid.is-list-view .lemyox-project-list-actions {
        align-items: center;
        color: var(--project-text);
        display: flex;
        font-size: 12px;
        min-width: 0;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-owner span {
        background: var(--project-panel-soft);
        border-radius: 12px;
        color: var(--project-muted);
        font-size: 10px;
        padding: 4px 8px;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-modified {
        color: var(--project-muted);
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-actions {
        gap: 5px;
        justify-content: flex-end;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-actions button {
        background: transparent;
        border: 0;
        border-radius: 6px;
        color: var(--project-text);
        cursor: pointer;
        font-size: 21px;
        height: 34px;
        padding: 0;
        width: 34px;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-actions button:hover {
        background: var(--project-panel-soft);
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-actions .is-favorite {
        color: var(--project-orange);
    }
}

@media (max-width: 900px) {
    .lemyox-project-list-head {
        display: none !important;
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-tile {
        grid-template-columns: 82px minmax(0, 1fr);
    }

    .lemyox-projects-grid.is-list-view .lemyox-project-list-owner,
    .lemyox-projects-grid.is-list-view .lemyox-project-list-type,
    .lemyox-projects-grid.is-list-view .lemyox-project-list-modified,
    .lemyox-projects-grid.is-list-view .lemyox-project-list-actions {
        display: none;
    }
}

.lemyox-app[data-app-theme="light"][data-current-view="library"] {
    --library-bg: #f7f8fb;
    --library-panel: #fff;
    --library-panel-soft: #f3f6fa;
    --library-border: #e3e7ee;
    --library-text: #151a23;
    --library-muted: #657183;
}

.lemyox-app[data-app-theme="light"][data-current-view="overview"] {
    background: #f7f8fb;
}

.lemyox-app[data-app-theme="light"] .lemyox-overview-project-list b,
.lemyox-app[data-app-theme="light"] .lemyox-overview-export-list b,
.lemyox-app[data-app-theme="light"] .lemyox-overview-project-list em,
.lemyox-app[data-app-theme="light"] .lemyox-overview-more,
.lemyox-app[data-app-theme="light"] .lemyox-overview-empty strong,
.lemyox-app[data-app-theme="light"] .lemyox-overview-tips b,
.lemyox-app[data-app-theme="light"] .lemyox-profile-options button b,
.lemyox-app[data-app-theme="light"] .lemyox-profile-plan b,
.lemyox-app[data-app-theme="light"] .lemyox-profile-meter span,
.lemyox-app[data-app-theme="light"] .lemyox-profile-meter b,
.lemyox-app[data-app-theme="light"] .lemyox-profile-joined span,
.lemyox-app[data-app-theme="light"] .lemyox-profile-joined b {
    color: #151a23;
}

.lemyox-app[data-app-theme="light"] .lemyox-overview-stats small,
.lemyox-app[data-app-theme="light"] .lemyox-overview-stats em,
.lemyox-app[data-app-theme="light"] .lemyox-overview-project-list small,
.lemyox-app[data-app-theme="light"] .lemyox-overview-export-list small,
.lemyox-app[data-app-theme="light"] .lemyox-overview-empty p,
.lemyox-app[data-app-theme="light"] .lemyox-overview-tips p,
.lemyox-app[data-app-theme="light"] .lemyox-profile-summary > p,
.lemyox-app[data-app-theme="light"] .lemyox-profile-plan small,
.lemyox-app[data-app-theme="light"] .lemyox-profile-options button small {
    color: #657183;
}

.lemyox-app[data-app-theme="light"] .lemyox-overview-tips article,
.lemyox-app[data-app-theme="light"] .lemyox-image-card,
.lemyox-app[data-app-theme="light"] .lemyox-library-toolbar,
.lemyox-app[data-app-theme="light"] .lemyox-library-selectionbar,
.lemyox-app[data-app-theme="light"] .lemyox-library-pager,
.lemyox-app[data-app-theme="light"] .lemyox-library-menu {
    background: #fff;
    border-color: #e3e7ee;
}

@media (max-width: 1180px) {
    .lemyox-tools-stats,
    .lemyox-tools-grid,
    .lemyox-tools-bottom {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lemyox-tools-bottom {
        grid-template-columns: 1fr;
    }

    .lemyox-profile-layout,
    .lemyox-profile-options {
        grid-template-columns: 1fr;
    }

    .lemyox-profile-summary {
        align-items: center;
        grid-template-columns: 140px minmax(0, 1fr);
        justify-items: start;
    }

    .lemyox-profile-summary h3,
    .lemyox-profile-meter,
    .lemyox-profile-joined {
        grid-column: 1 / -1;
    }

    .lemyox-profile-avatar {
        grid-row: 2 / 5;
    }
}

@media (max-width: 820px) {
    .lemyox-app[data-current-view="tools"] {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="tools"] .lemyox-main {
        padding: 18px 14px 26px;
        width: 100%;
    }

    .lemyox-tools-titlebar,
    .lemyox-tools-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .lemyox-tools-search {
        width: 100%;
    }

    .lemyox-tools-stats,
    .lemyox-tools-grid,
    .lemyox-tools-bottom {
        grid-template-columns: 1fr;
    }

    .lemyox-tools-recent li {
        grid-template-columns: 34px minmax(0, 1fr);
    }

    .lemyox-tools-recent small,
    .lemyox-tools-recent em {
        grid-column: 2;
    }

    .lemyox-app[data-current-view="profile"] {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="profile"] .lemyox-main {
        padding: 18px 14px 26px;
        width: 100%;
    }

    .lemyox-profile-titlebar,
    .lemyox-profile-layout {
        grid-template-columns: 1fr;
        max-width: 100%;
        min-width: 0;
        width: 100%;
    }

    .lemyox-profile-titlebar {
        align-items: stretch;
        flex-direction: column;
    }

    .lemyox-profile-titlebar .lemyox-gradient-btn {
        justify-content: center;
    }

    .lemyox-profile-tabs {
        display: flex;
        gap: 4px;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
    }

    .lemyox-profile-tabs button {
        flex: 0 0 auto;
        min-width: 120px;
    }

    .lemyox-profile-summary,
    .lemyox-profile-form,
    .lemyox-profile-panel {
        max-width: 100%;
        min-width: 0;
        width: 100%;
    }

    .lemyox-profile-fields,
    .lemyox-profile-security-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .lemyox-profile-summary {
        display: grid;
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
    }

    .lemyox-profile-avatar {
        grid-row: auto;
    }

    .lemyox-profile-plan,
    .lemyox-profile-meter div,
    .lemyox-profile-joined {
        align-items: center;
        flex-direction: column;
        text-align: center;
    }
}

@media (max-width: 1180px) {
    .lemyox-overview-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lemyox-overview-workspace,
    .lemyox-overview-tips > div {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="overview"] {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-main {
        padding: 18px 14px 24px;
        width: 100%;
    }

    .lemyox-overview-page {
        max-width: none;
        width: 100%;
    }

    .lemyox-overview-header,
    .lemyox-overview-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .lemyox-overview-header h2 {
        font-size: 24px;
    }

    .lemyox-overview-actions a {
        justify-content: center;
        width: 100%;
    }

    .lemyox-overview-stats {
        grid-template-columns: 1fr;
    }

    .lemyox-overview-stats article {
        min-height: 108px;
        padding: 18px;
    }

    .lemyox-overview-stats article > span {
        height: 54px;
        width: 54px;
    }

    .lemyox-overview-stats strong {
        font-size: 23px;
    }

    .lemyox-overview-workspace {
        grid-template-columns: minmax(0, 1fr);
    }

    .lemyox-overview-panel {
        padding: 16px;
    }

    .lemyox-overview-project-list li {
        grid-template-columns: 34px minmax(0, 1fr);
        padding: 10px 0;
    }

    .lemyox-overview-project-list em {
        grid-column: 2;
    }

    .lemyox-overview-empty {
        min-height: 230px;
    }

    .lemyox-overview-tips article {
        align-items: flex-start;
        padding: 16px;
    }
}

@media (max-width: 1280px) {
    .lemyox-quick-tool__layout,
    .lemyox-tools-workbench .lemyox-quick-tool__layout {
        grid-template-columns: 1fr;
    }

    .lemyox-tools-simple-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .lemyox-quick-tool__head,
    .lemyox-tools-workbench-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .lemyox-tool-tabs {
        width: 100%;
    }

    .lemyox-tool-tabs button {
        flex: 1 1 130px;
    }

    .lemyox-tool-option--grid {
        grid-template-columns: 1fr;
    }

    .lemyox-tool-actions {
        flex-direction: column;
    }

    .lemyox-tools-simple-grid {
        grid-template-columns: 1fr;
    }

    .lemyox-tool-modal__panel {
        border-radius: 12px 12px 0 0;
        inset: 22px 0 0;
    }

    .lemyox-tool-modal__close {
        right: 12px;
        top: 12px;
    }

    .lemyox-tool-modal__body {
        padding: 64px 14px 14px;
    }

    .lemyox-tool-modal .lemyox-quick-tool__head {
        align-items: flex-start;
    }

    .lemyox-tool-modal .lemyox-quick-tool__head > span {
        max-width: none;
        text-align: left;
    }
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-bottom {
    display: none !important;
}

/* Compact app pages: account, history, storage, security and plan */
.lemyox-app[data-current-view="account"] .lemyox-stepper,
.lemyox-app[data-current-view="history"] .lemyox-stepper,
.lemyox-app[data-current-view="storage"] .lemyox-stepper,
.lemyox-app[data-current-view="security"] .lemyox-stepper,
.lemyox-app[data-current-view="plan"] .lemyox-stepper,
.lemyox-app[data-current-view="account"] .lemyox-topbar,
.lemyox-app[data-current-view="plan"] .lemyox-topbar {
    display: none !important;
}

.lemyox-app[data-current-view="account"],
.lemyox-app[data-current-view="history"],
.lemyox-app[data-current-view="storage"],
.lemyox-app[data-current-view="security"],
.lemyox-app[data-current-view="plan"] {
    --compact-bg: #09111b;
    --compact-panel: #101a26;
    --compact-panel-2: #0c1520;
    --compact-border: rgba(148, 163, 184, 0.18);
    --compact-text: #f8fafc;
    --compact-muted: #9aa8ba;
    --compact-orange: #ff7a1a;
    --compact-green: #35d07f;
    background:
        radial-gradient(circle at 20% 0, rgba(255, 122, 26, 0.08), transparent 26%),
        radial-gradient(circle at 80% 10%, rgba(75, 119, 255, 0.08), transparent 28%),
        var(--compact-bg);
}

.lemyox-app[data-project-theme="light"][data-current-view="account"],
.lemyox-app[data-project-theme="light"][data-current-view="history"],
.lemyox-app[data-project-theme="light"][data-current-view="storage"],
.lemyox-app[data-project-theme="light"][data-current-view="security"],
.lemyox-app[data-project-theme="light"][data-current-view="plan"] {
    --compact-bg: #f7f8fb;
    --compact-panel: #ffffff;
    --compact-panel-2: #fbfcfe;
    --compact-border: rgba(15, 23, 42, 0.10);
    --compact-text: #0f172a;
    --compact-muted: #64748b;
}

.lemyox-app[data-current-view="account"] .lemyox-main,
.lemyox-app[data-current-view="history"] .lemyox-main,
.lemyox-app[data-current-view="storage"] .lemyox-main,
.lemyox-app[data-current-view="security"] .lemyox-main,
.lemyox-app[data-current-view="plan"] .lemyox-main {
    background: transparent;
    color: var(--compact-text);
    padding: 28px 34px 34px;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin: 0 0 18px;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head h2 {
    color: var(--compact-text);
    font-size: 30px;
    letter-spacing: -0.03em;
    margin: 0 0 4px;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head p {
    color: var(--compact-muted);
    font-size: 14px;
    margin: 0;
}

.lemyox-app[data-current-view="history"] .lemyox-toolbar {
    align-items: center;
    background: rgba(16, 26, 38, 0.76);
    border: 1px solid var(--compact-border);
    border-radius: 12px;
    display: flex;
    gap: 10px;
    margin: 0 0 16px;
    padding: 10px;
}

.lemyox-app[data-current-view="history"] .lemyox-toolbar input,
.lemyox-app[data-current-view="history"] .lemyox-toolbar select {
    background: var(--compact-panel-2);
    border: 1px solid var(--compact-border);
    border-radius: 10px;
    color: var(--compact-text);
    height: 42px;
    padding: 0 13px;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline {
    display: grid;
    gap: 10px;
    max-width: 1060px;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article {
    align-items: center;
    background: linear-gradient(135deg, rgba(16, 26, 38, 0.96), rgba(11, 19, 29, 0.96));
    border: 1px solid var(--compact-border);
    border-radius: 12px;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.14);
    display: grid;
    gap: 10px;
    grid-template-columns: 160px minmax(0, 1fr) 190px;
    min-height: 64px;
    padding: 13px 16px;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article b {
    align-items: center;
    color: #fff;
    display: inline-flex;
    font-size: 13px;
    gap: 8px;
    text-transform: capitalize;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article b::before {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    border-radius: 999px;
    content: "";
    height: 9px;
    width: 9px;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article p {
    color: var(--compact-muted);
    font-size: 13px;
    margin: 0;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article span {
    color: #b9c6d8;
    font-size: 12px;
    text-align: right;
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-toolbar,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline article {
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06);
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline article b {
    color: #0f172a;
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline article span {
    color: #64748b;
}

.lemyox-app[data-current-view="storage"] .lemyox-grid-2 {
    align-items: stretch;
    grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
    margin: 0;
}

.lemyox-app[data-current-view="storage"] .lemyox-card {
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.96), rgba(11, 19, 29, 0.96));
    border-color: var(--compact-border);
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
}

.lemyox-app[data-project-theme="light"][data-current-view="storage"] .lemyox-card {
    background: #fff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, 0.07);
}

.lemyox-app[data-current-view="security"] .lemyox-card {
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.96), rgba(11, 19, 29, 0.96));
    border-color: var(--compact-border);
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
    max-width: 760px;
}

.lemyox-app[data-current-view="security"] .lemyox-card h2 {
    color: var(--compact-text);
    font-size: 28px;
    letter-spacing: -0.03em;
}

.lemyox-app[data-current-view="security"] .lemyox-card p {
    color: var(--compact-muted);
}

.lemyox-app[data-project-theme="light"][data-current-view="security"] .lemyox-card {
    background: #fff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, 0.07);
}

.lemyox-account-hub {
    display: grid;
    gap: 16px;
    margin: 0 auto;
    max-width: 1040px;
}

.lemyox-account-hero,
.lemyox-account-mini-stats article,
.lemyox-account-panel {
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.96), rgba(11, 19, 29, 0.96));
    border: 1px solid var(--compact-border);
    border-radius: 16px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
}

.lemyox-account-hero {
    align-items: center;
    display: grid;
    gap: 16px;
    grid-template-columns: 72px minmax(0, 1fr) auto;
    padding: 18px;
}

.lemyox-account-avatar {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.22), rgba(155, 93, 229, 0.22));
    border: 1px solid rgba(255, 122, 26, 0.28);
    border-radius: 18px;
    height: 72px;
    padding: 5px;
    width: 72px;
}

.lemyox-account-avatar img {
    border-radius: 14px;
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.lemyox-account-hero span {
    color: #ff8a1f;
    display: block;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.lemyox-account-hero h2 {
    color: var(--compact-text);
    font-size: 28px;
    letter-spacing: -0.03em;
    margin: 3px 0 0;
}

.lemyox-account-hero p {
    color: var(--compact-muted);
    margin: 2px 0 0;
}

.lemyox-account-mini-stats,
.lemyox-account-panel {
    display: grid;
    gap: 12px;
}

.lemyox-account-mini-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-account-mini-stats article {
    padding: 15px 16px;
}

.lemyox-account-mini-stats small,
.lemyox-account-tile small {
    color: var(--compact-muted);
    display: block;
    font-size: 12px;
}

.lemyox-account-mini-stats strong {
    color: var(--compact-text);
    display: block;
    font-size: 22px;
    margin-top: 3px;
}

.lemyox-account-mini-stats span {
    color: #ff8a1f;
    display: block;
    font-size: 12px;
    font-weight: 800;
    margin-top: 2px;
}

.lemyox-account-panel {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 14px;
}

.lemyox-account-tile {
    background: rgba(7, 13, 25, 0.34);
    border: 1px solid rgba(148, 163, 184, 0.13);
    border-radius: 14px;
    color: var(--compact-text);
    display: grid;
    gap: 8px;
    min-height: 154px;
    padding: 16px;
    text-decoration: none;
    transition: border-color .18s ease, transform .18s ease, background .18s ease;
}

.lemyox-account-tile:hover {
    background: rgba(255, 122, 26, 0.07);
    border-color: rgba(255, 122, 26, 0.44);
    transform: translateY(-2px);
}

.lemyox-account-tile > span {
    align-items: center;
    background: rgba(255, 122, 26, 0.12);
    border: 1px solid rgba(255, 122, 26, 0.22);
    border-radius: 12px;
    color: #ff8a1f;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.lemyox-account-tile svg {
    height: 21px;
    width: 21px;
}

.lemyox-account-tile b {
    color: var(--compact-text);
    font-size: 15px;
}

.lemyox-account-tile.is-logout {
    border-color: rgba(248, 113, 113, 0.24);
}

.lemyox-account-tile.is-logout > span {
    background: rgba(248, 113, 113, 0.12);
    border-color: rgba(248, 113, 113, 0.25);
    color: #fb7185;
}

.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-hero,
.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-mini-stats article,
.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-panel {
    background: #fff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, 0.07);
}

.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-tile {
    background: #fbfcfe;
}

.lemyox-plan-page {
    display: grid;
    gap: 22px;
    margin: 0 auto;
    max-width: 1360px;
}

.lemyox-plan-hero {
    align-items: flex-start;
    display: flex;
    gap: 18px;
    justify-content: space-between;
}

.lemyox-plan-hero h2 {
    color: var(--compact-text);
    font-size: 34px;
    letter-spacing: -0.04em;
    line-height: 1.1;
    margin: 0 0 8px;
}

.lemyox-plan-hero p {
    color: var(--compact-muted);
    font-size: 15px;
    margin: 0;
}

.lemyox-plan-price-link,
.lemyox-plan-footer-cta .lemyox-ghost-btn {
    align-items: center;
    background: rgba(16, 26, 38, 0.72);
    border: 1px solid var(--compact-border);
    border-radius: 10px;
    color: var(--compact-text);
    display: inline-flex;
    font-weight: 700;
    min-height: 44px;
    padding: 0 16px;
    text-decoration: none;
}

.lemyox-plan-billing {
    align-items: center;
    color: var(--compact-muted);
    display: flex;
    gap: 14px;
    justify-content: center;
}

.lemyox-plan-billing button {
    background: rgba(15, 23, 42, 0.82);
    border: 1px solid var(--compact-border);
    border-radius: 999px;
    height: 36px;
    padding: 4px;
    width: 70px;
}

.lemyox-plan-billing button i {
    background: linear-gradient(135deg, #ff7a1a, #ffb000);
    border-radius: 50%;
    display: block;
    height: 26px;
    margin-left: auto;
    width: 26px;
}

.lemyox-plan-billing b {
    color: var(--compact-text);
}

.lemyox-plan-billing em {
    background: rgba(35, 197, 94, 0.16);
    border: 1px solid rgba(35, 197, 94, 0.28);
    border-radius: 999px;
    color: #4ade80;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    padding: 4px 10px;
    text-transform: uppercase;
}

.lemyox-plan-summary,
.lemyox-pricing-grid,
.lemyox-plan-footer-cta {
    display: grid;
    gap: 16px;
}

.lemyox-plan-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-plan-summary article,
.lemyox-pricing-card,
.lemyox-plan-footer-cta article {
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.94), rgba(11, 19, 29, 0.94));
    border: 1px solid var(--compact-border);
    border-radius: 16px;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18);
}

.lemyox-plan-summary article {
    align-items: center;
    display: flex;
    gap: 18px;
    min-height: 110px;
    padding: 20px;
}

.lemyox-plan-summary article > span,
.lemyox-plan-footer-cta article > span {
    align-items: center;
    background: rgba(255, 122, 26, 0.12);
    border: 1px solid rgba(255, 122, 26, 0.2);
    border-radius: 50%;
    color: #ff8a1f;
    display: inline-flex;
    flex: 0 0 auto;
    height: 54px;
    justify-content: center;
    width: 54px;
}

.lemyox-plan-summary svg,
.lemyox-plan-footer-cta svg {
    height: 25px;
    width: 25px;
}

.lemyox-plan-summary small {
    color: var(--compact-muted);
    display: block;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.lemyox-plan-summary strong {
    color: var(--compact-text);
    display: block;
    font-size: 21px;
    line-height: 1.25;
    margin-top: 5px;
}

.lemyox-plan-summary strong i {
    color: var(--compact-muted);
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
}

.lemyox-plan-summary p {
    color: #ff8a1f;
    font-size: 13px;
    font-weight: 800;
    margin: 3px 0 0;
}

.lemyox-plan-summary p.is-active {
    color: var(--compact-green);
}

.lemyox-plan-summary em {
    background: rgba(148, 163, 184, 0.16);
    border-radius: 999px;
    display: block;
    height: 7px;
    margin-top: 9px;
    overflow: hidden;
}

.lemyox-plan-summary em b {
    background: linear-gradient(90deg, #ff7a1a, #9b5de5);
    display: block;
    height: 100%;
}

.lemyox-pricing-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-pricing-card {
    min-height: 430px;
    padding: 28px;
    position: relative;
}

.lemyox-pricing-card.is-popular {
    border-color: rgba(255, 122, 26, 0.95);
    box-shadow: 0 0 0 1px rgba(255, 122, 26, 0.18), 0 22px 56px rgba(255, 122, 26, 0.12);
}

.lemyox-popular-badge {
    background: linear-gradient(135deg, #ff7a1a, #ff9e1a);
    border-radius: 999px;
    box-shadow: 0 12px 28px rgba(255, 122, 26, 0.32);
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    left: 50%;
    letter-spacing: 0.02em;
    padding: 8px 20px;
    position: absolute;
    text-transform: uppercase;
    top: -18px;
    transform: translateX(-50%);
    white-space: nowrap;
}

.lemyox-pricing-card__head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.lemyox-pricing-card h3 {
    color: var(--compact-text);
    font-size: 28px;
    letter-spacing: -0.03em;
    margin: 0;
}

.lemyox-pricing-card__head span {
    border: 1px solid rgba(255, 122, 26, 0.45);
    border-radius: 8px;
    color: #ff8a1f;
    font-size: 12px;
    font-weight: 800;
    padding: 6px 10px;
}

.lemyox-pricing-card p {
    color: var(--compact-muted);
    margin: 14px 0 20px;
}

.lemyox-pricing-card > strong {
    border-bottom: 1px solid var(--compact-border);
    color: #ff7a1a;
    display: block;
    font-size: 34px;
    line-height: 1;
    margin-bottom: 18px;
    padding-bottom: 22px;
}

.lemyox-pricing-card ul {
    display: grid;
    gap: 14px;
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
}

.lemyox-pricing-card li {
    align-items: center;
    color: var(--compact-text);
    display: flex;
    font-size: 15px;
    gap: 10px;
}

.lemyox-pricing-card li::before {
    align-items: center;
    border: 1px solid #ff7a1a;
    border-radius: 50%;
    color: #ff8a1f;
    content: "✓";
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 900;
    height: 19px;
    justify-content: center;
    width: 19px;
}

.lemyox-pricing-card .lemyox-gradient-btn,
.lemyox-pricing-card button {
    align-items: center;
    border-radius: 10px;
    bottom: 24px;
    display: inline-flex;
    font-size: 15px;
    font-weight: 900;
    justify-content: center;
    left: 28px;
    min-height: 48px;
    position: absolute;
    right: 28px;
    text-decoration: none;
}

.lemyox-pricing-card button[disabled] {
    background: rgba(255, 122, 26, 0.10);
    border: 1px solid rgba(255, 122, 26, 0.24);
    color: #ff8a1f;
}

.lemyox-plan-footer-cta {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lemyox-plan-footer-cta article {
    align-items: center;
    display: flex;
    gap: 20px;
    padding: 22px;
}

.lemyox-plan-footer-cta h3 {
    color: var(--compact-text);
    font-size: 17px;
    margin: 0 0 6px;
}

.lemyox-plan-footer-cta p {
    color: var(--compact-muted);
    margin: 0 0 12px;
}

.lemyox-plan-footer-cta .lemyox-ghost-btn {
    min-height: 36px;
}

.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-price-link,
.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-summary article,
.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-pricing-card,
.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-footer-cta article,
.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-footer-cta .lemyox-ghost-btn {
    background: #fff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, 0.07);
}

.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-billing button {
    background: #e8edf5;
}

@media (max-width: 1100px) {
    .lemyox-account-panel {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lemyox-plan-summary,
    .lemyox-pricing-grid,
    .lemyox-plan-footer-cta,
    .lemyox-app[data-current-view="storage"] .lemyox-grid-2 {
        grid-template-columns: 1fr;
    }

    .lemyox-pricing-card {
        min-height: auto;
        padding-bottom: 92px;
    }
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="history"] .lemyox-main,
    .lemyox-app[data-current-view="storage"] .lemyox-main,
    .lemyox-app[data-current-view="plan"] .lemyox-main {
        padding: 18px 14px 26px;
    }

    .lemyox-plan-hero,
    .lemyox-app[data-current-view="history"] .lemyox-section-head {
        align-items: stretch;
        flex-direction: column;
    }

    .lemyox-plan-hero h2,
    .lemyox-app[data-current-view="history"] .lemyox-section-head h2 {
        font-size: 26px;
    }

    .lemyox-plan-billing {
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .lemyox-app[data-current-view="history"] .lemyox-timeline article {
        grid-template-columns: 1fr;
    }

    .lemyox-app[data-current-view="history"] .lemyox-timeline article span {
        text-align: left;
    }

    .lemyox-plan-footer-cta article,
    .lemyox-plan-summary article {
        align-items: flex-start;
    }

    .lemyox-account-hero {
        grid-template-columns: 64px minmax(0, 1fr);
    }

    .lemyox-account-hero .lemyox-gradient-btn {
        grid-column: 1 / -1;
        justify-content: center;
    }

    .lemyox-account-mini-stats,
    .lemyox-account-panel {
        grid-template-columns: 1fr;
    }
}

/* Plan page v2: synced with lemyoxcom.local/bang-gia */
.lemyox-plan-page--v2 {
    gap: 18px;
}

.lemyox-plan-page--v2 .lemyox-plan-hero {
    align-items: center;
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.10), transparent 42%),
        linear-gradient(145deg, rgba(16, 26, 38, 0.96), rgba(10, 18, 29, 0.98));
    border: 1px solid var(--compact-border);
    border-radius: 18px;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.20);
    padding: 24px;
}

.lemyox-plan-page--v2 .lemyox-plan-hero span {
    color: #ff8a1f;
    display: inline-flex;
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.08em;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.lemyox-plan-page--v2 .lemyox-plan-billing {
    background: rgba(16, 26, 38, 0.78);
    border: 1px solid var(--compact-border);
    border-radius: 999px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    justify-self: center;
    padding: 5px;
}

.lemyox-plan-page--v2 .lemyox-plan-billing button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 999px;
    color: var(--compact-muted);
    cursor: pointer;
    display: inline-flex;
    font-weight: 900;
    gap: 8px;
    height: 38px;
    justify-content: center;
    min-width: 138px;
    padding: 0 16px;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease;
    width: auto;
}

.lemyox-plan-page--v2 .lemyox-plan-billing button.is-active {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    box-shadow: 0 12px 28px rgba(255, 122, 26, 0.26);
    color: #fff;
}

.lemyox-plan-page--v2 .lemyox-plan-billing button em {
    background: rgba(255, 255, 255, 0.18);
    border: 0;
    color: inherit;
    font-size: 11px;
    padding: 3px 8px;
}

.lemyox-plan-page--v2 .lemyox-plan-summary article,
.lemyox-plan-page--v2 .lemyox-pricing-card,
.lemyox-plan-page--v2 .lemyox-plan-footer-cta article,
.lemyox-plan-page--v2 .lemyox-plan-compare {
    backdrop-filter: blur(14px);
}

.lemyox-plan-page--v2 .lemyox-pricing-card {
    display: flex;
    flex-direction: column;
    min-height: 510px;
    overflow: visible;
    padding: 26px;
}

.lemyox-plan-page--v2 .lemyox-pricing-card p {
    min-height: 44px;
}

.lemyox-plan-page--v2 .lemyox-pricing-card ul {
    margin-bottom: 22px;
}

.lemyox-plan-page--v2 .lemyox-pricing-card .lemyox-gradient-btn,
.lemyox-plan-page--v2 .lemyox-pricing-card button {
    bottom: auto;
    left: auto;
    margin-top: auto;
    position: static;
    right: auto;
    width: 100%;
}

.lemyox-plan-price {
    align-items: baseline;
    border-bottom: 1px solid var(--compact-border);
    display: flex;
    gap: 9px;
    margin-bottom: 8px;
    padding: 4px 0 18px;
}

.lemyox-plan-price strong {
    color: #ff7a1a;
    font-size: 42px;
    letter-spacing: -0.05em;
    line-height: 1;
}

.lemyox-plan-price span {
    color: var(--compact-muted);
    font-size: 15px;
    font-weight: 800;
}

.lemyox-plan-saving {
    background: rgba(35, 197, 94, 0.12);
    border: 1px solid rgba(35, 197, 94, 0.24);
    border-radius: 999px;
    color: #4ade80;
    display: inline-flex;
    font-size: 12px;
    font-weight: 900;
    margin: 0 0 16px;
    padding: 5px 10px;
}

.lemyox-plan-page--v2[data-plan-billing="monthly"] .lemyox-plan-saving {
    display: none;
}

.lemyox-plan-compare {
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.94), rgba(11, 19, 29, 0.94));
    border: 1px solid var(--compact-border);
    border-radius: 16px;
    box-shadow: 0 18px 46px rgba(0, 0, 0, 0.18);
    display: grid;
    overflow: hidden;
}

.lemyox-plan-compare > div {
    display: grid;
    grid-template-columns: minmax(220px, 1.35fr) repeat(3, minmax(120px, 1fr));
}

.lemyox-plan-compare > div + div {
    border-top: 1px solid var(--compact-border);
}

.lemyox-plan-compare b,
.lemyox-plan-compare span {
    color: var(--compact-text);
    font-size: 13px;
    min-height: 46px;
    padding: 14px 16px;
}

.lemyox-plan-compare b {
    background: rgba(255, 122, 26, 0.08);
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.lemyox-plan-compare span:not(:first-child) {
    color: var(--compact-muted);
    font-weight: 800;
}

.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-page--v2 .lemyox-plan-hero,
.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-page--v2 .lemyox-plan-billing,
.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-compare {
    background: #fff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, 0.07);
}

.lemyox-app[data-project-theme="light"][data-current-view="plan"] .lemyox-plan-page--v2 .lemyox-plan-billing button:not(.is-active) {
    color: #64748b;
}

@media (max-width: 860px) {
    .lemyox-plan-page--v2 .lemyox-plan-hero {
        align-items: flex-start;
    }

    .lemyox-plan-compare {
        overflow-x: auto;
    }

    .lemyox-plan-compare > div {
        min-width: 680px;
    }
}

@media (max-width: 560px) {
    .lemyox-plan-page--v2 .lemyox-plan-billing {
        border-radius: 16px;
        justify-self: stretch;
        width: 100%;
    }

    .lemyox-plan-page--v2 .lemyox-plan-billing button {
        flex: 1 1 100%;
        min-width: 0;
    }

    .lemyox-plan-price strong {
        font-size: 34px;
    }
}

/* Sidebar compact pass */
.lemyox-app:not(.is-sidebar-collapsed) {
    grid-template-columns: 250px minmax(0, 1fr);
}

.lemyox-app .lemyox-sidebar {
    padding: 12px 10px;
}

.lemyox-app .lemyox-brand {
    gap: 8px;
    padding: 0 4px 10px;
}

.lemyox-app .lemyox-sidebar-user-card {
    margin: 0 0 10px;
    min-height: 58px;
    padding: 9px;
}

.lemyox-app .lemyox-sidebar-user-card img {
    height: 36px;
    width: 36px;
}

.lemyox-app .lemyox-sidebar-user-card strong {
    font-size: 13px;
}

.lemyox-app .lemyox-sidebar-user-card small,
.lemyox-app .lemyox-storage-card p {
    font-size: 11px;
}

.lemyox-app .lemyox-nav {
    gap: 2px;
}

.lemyox-app .lemyox-nav-label {
    font-size: 10px;
    letter-spacing: 0.075em;
    margin: 10px 9px 4px;
}

.lemyox-app .lemyox-nav-item {
    border-radius: 7px;
    font-size: 13px;
    gap: 9px;
    min-height: 34px;
    padding: 7px 9px;
}

.lemyox-app .lemyox-nav-item svg {
    flex-basis: 17px;
    height: 17px;
    width: 17px;
}

.lemyox-app .lemyox-sidebar-bottom {
    padding-top: 10px;
}

.lemyox-app .lemyox-storage-card {
    border-radius: 8px;
    padding: 10px;
}

.lemyox-app .lemyox-storage-card .lemyox-row {
    font-size: 11px;
}

.lemyox-app .lemyox-storage-card .lemyox-gradient-btn {
    min-height: 34px;
    padding: 0 10px;
}

.lemyox-app[data-current-view] .lemyox-sidebar {
    padding: 12px 10px;
}

.lemyox-app[data-current-view] .lemyox-brand {
    margin-bottom: 8px;
    padding-bottom: 10px;
}

.lemyox-app[data-current-view] .lemyox-nav-label {
    margin: 10px 9px 4px;
}

.lemyox-app[data-current-view] .lemyox-nav-item {
    min-height: 34px;
    padding: 7px 9px;
}

.lemyox-app[data-current-view] .lemyox-sidebar-bottom {
    padding-top: 10px;
}

/* Account mini dashboard */
.lemyox-account-mini-dashboard {
    display: grid;
    gap: 18px;
    grid-template-columns: 310px minmax(0, 1fr);
    margin: 0;
    max-width: none;
}

.lemyox-account-side,
.lemyox-account-card,
.lemyox-account-stat-grid article,
.lemyox-account-quick-card {
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.96), rgba(8, 15, 25, 0.98));
    border: 1px solid var(--compact-border);
    border-radius: 16px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
}

.lemyox-account-side {
    align-self: start;
    display: grid;
    gap: 18px;
    min-height: calc(100vh - 58px);
    padding: 18px;
    position: sticky;
    top: 18px;
}

.lemyox-account-side-user {
    align-items: center;
    display: grid;
    justify-items: center;
    text-align: center;
}

.lemyox-account-avatar.is-large {
    border-radius: 50%;
    height: 112px;
    margin-bottom: 12px;
    padding: 4px;
    width: 112px;
}

.lemyox-account-avatar.is-large img {
    border-radius: 50%;
}

.lemyox-account-side h2 {
    color: var(--compact-text);
    font-size: 21px;
    margin: 0 0 4px;
}

.lemyox-account-side p {
    color: var(--compact-muted);
    font-size: 13px;
    margin: 0;
}

.lemyox-account-plan-pill {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-top: 18px;
}

.lemyox-account-plan-pill b {
    background: linear-gradient(135deg, #9b5de5, #6d4aff);
    border-radius: 8px;
    color: #fff;
    padding: 7px 11px;
}

.lemyox-account-plan-pill span {
    color: var(--compact-text);
    font-weight: 800;
}

.lemyox-account-side-meter {
    background: rgba(7, 13, 25, 0.34);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 12px;
    padding: 14px;
}

.lemyox-account-side-meter div {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.lemyox-account-side-meter span,
.lemyox-account-side-meter em {
    color: var(--compact-muted);
    font-size: 12px;
    font-style: normal;
}

.lemyox-account-side-meter b {
    color: #ff8a1f;
    font-size: 12px;
}

.lemyox-account-side-meter i,
.lemyox-account-stat-grid u {
    background: rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    display: block;
    height: 6px;
    margin-top: 10px;
    overflow: hidden;
    text-decoration: none;
}

.lemyox-account-side-meter i b,
.lemyox-account-stat-grid u b {
    background: linear-gradient(90deg, #ff7a1a, #9b5de5);
    display: block;
    height: 100%;
}

.lemyox-account-side-meter em {
    display: block;
    margin-top: 5px;
    text-align: right;
}

.lemyox-account-side-nav {
    border-top: 1px solid var(--compact-border);
    display: grid;
    gap: 6px;
    padding-top: 14px;
}

.lemyox-account-side-nav a,
.lemyox-account-logout {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 10px;
    color: #cbd5e1;
    display: flex;
    gap: 12px;
    min-height: 42px;
    padding: 0 12px;
    text-decoration: none;
}

.lemyox-account-side-nav a svg,
.lemyox-account-logout svg {
    height: 18px;
    width: 18px;
}

.lemyox-account-side-nav a:hover,
.lemyox-account-side-nav a.is-active {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.16), rgba(255, 122, 26, 0.05));
    border-color: rgba(255, 122, 26, 0.44);
    box-shadow: inset -4px 0 0 rgba(255, 122, 26, 0.9);
    color: #ff8a1f;
}

.lemyox-account-logout {
    border-top: 1px solid var(--compact-border);
    border-radius: 0;
    color: #fb7185;
    margin-top: auto;
    padding-top: 18px;
}

.lemyox-account-workspace {
    display: grid;
    gap: 18px;
    min-width: 0;
}

.lemyox-account-stat-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-account-stat-grid article {
    align-items: center;
    display: flex;
    gap: 18px;
    min-height: 112px;
    padding: 22px 24px;
}

.lemyox-account-stat-grid article > span {
    align-items: center;
    background: rgba(255, 122, 26, 0.12);
    border: 1px solid rgba(255, 122, 26, 0.2);
    border-radius: 16px;
    color: #ff8a1f;
    display: inline-flex;
    flex: 0 0 48px;
    height: 48px;
    justify-content: center;
}

.lemyox-account-stat-grid article:nth-child(2) > span {
    background: rgba(155, 93, 229, 0.18);
    color: #a855f7;
}

.lemyox-account-stat-grid article:nth-child(3) > span {
    background: rgba(34, 197, 94, 0.14);
    color: #4ade80;
}

.lemyox-account-stat-grid svg {
    height: 20px;
    width: 20px;
}

.lemyox-account-stat-grid small {
    color: var(--compact-muted);
    display: block;
    font-size: 13px;
}

.lemyox-account-stat-grid strong {
    color: var(--compact-text);
    display: block;
    font-size: 26px;
    letter-spacing: -0.03em;
}

.lemyox-account-stat-grid strong i {
    color: #ff8a1f;
    font-style: normal;
}

.lemyox-account-stat-grid em {
    color: var(--compact-muted);
    display: block;
    font-size: 12px;
    font-style: normal;
    margin-top: 3px;
}

.lemyox-account-card {
    padding: 24px;
}

.lemyox-account-card-head {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 22px;
}

.lemyox-account-card-head h2 {
    color: var(--compact-text);
    font-size: 28px;
    letter-spacing: -0.03em;
    margin: 0;
}

.lemyox-account-card-head p {
    color: var(--compact-muted);
    margin: 5px 0 0;
}

.lemyox-account-card-head .lemyox-gradient-btn {
    gap: 8px;
    min-width: 150px;
}

.lemyox-account-card-head .lemyox-gradient-btn svg {
    height: 16px;
    width: 16px;
}

.lemyox-account-tabs {
    border-bottom: 1px solid var(--compact-border);
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 24px;
}

.lemyox-account-tabs a {
    align-items: center;
    border-bottom: 2px solid transparent;
    color: var(--compact-muted);
    display: flex;
    gap: 8px;
    justify-content: center;
    min-height: 44px;
    text-decoration: none;
}

.lemyox-account-tabs a.is-active {
    border-color: #ff7a1a;
    color: #ff8a1f;
}

.lemyox-account-tabs svg {
    height: 17px;
    width: 17px;
}

.lemyox-account-fields {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.lemyox-account-fields label,
.lemyox-account-settings h3 {
    color: var(--compact-text);
    font-weight: 800;
}

.lemyox-account-fields label {
    display: grid;
    gap: 8px;
}

.lemyox-account-fields .is-full {
    grid-column: 1 / -1;
}

.lemyox-account-fields input,
.lemyox-account-fields textarea,
.lemyox-account-select {
    background: rgba(7, 13, 25, 0.50) !important;
    border: 1px solid var(--compact-border) !important;
    border-radius: 10px !important;
    color: var(--compact-text) !important;
}

.lemyox-account-fields textarea {
    min-height: 50px;
    resize: vertical;
}

.lemyox-account-setting-grid,
.lemyox-account-quick-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-account-setting-grid article {
    border-left: 1px solid var(--compact-border);
    padding-left: 16px;
}

.lemyox-account-setting-grid article:first-child {
    border-left: 0;
    padding-left: 0;
}

.lemyox-account-setting-grid p,
.lemyox-account-quick-card small {
    color: var(--compact-muted);
}

.lemyox-account-choice-row {
    display: flex;
    gap: 10px;
    margin-top: 12px;
}

.lemyox-account-choice-row button,
.lemyox-account-select {
    align-items: center;
    display: flex;
    gap: 8px;
    min-height: 44px;
    padding: 0 14px;
}

.lemyox-account-choice-row button {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--compact-border);
    border-radius: 10px;
    color: var(--compact-text);
    cursor: pointer;
    flex: 1;
    justify-content: center;
}

.lemyox-account-choice-row button.is-active {
    background: rgba(255, 122, 26, 0.16);
    border-color: rgba(255, 122, 26, 0.7);
    color: #ff8a1f;
}

.lemyox-account-select select {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
}

.lemyox-account-quick-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lemyox-account-quick-card {
    color: var(--compact-text);
    display: grid;
    gap: 8px;
    min-height: 132px;
    padding: 16px;
    text-decoration: none;
}

.lemyox-account-quick-card > span {
    align-items: center;
    background: rgba(255, 122, 26, 0.12);
    border: 1px solid rgba(255, 122, 26, 0.22);
    border-radius: 12px;
    color: #ff8a1f;
    display: inline-flex;
    height: 42px;
    justify-content: center;
    width: 42px;
}

.lemyox-account-quick-card:hover {
    border-color: rgba(255, 122, 26, 0.48);
    transform: translateY(-2px);
}

.lemyox-account-panel-view {
    min-width: 0;
}

.lemyox-account-panel-view[hidden] {
    display: none !important;
}

.lemyox-account-license-form {
    display: grid;
    gap: 10px;
    margin-bottom: 14px;
}

.lemyox-account-status-list {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 16px 0 0;
}

.lemyox-account-status-list div,
.lemyox-account-plan-mini article,
.lemyox-account-help-grid span {
    background: rgba(7, 13, 25, 0.36);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 12px;
    padding: 13px;
}

.lemyox-account-status-list dt {
    color: var(--compact-muted);
    font-size: 12px;
    margin-bottom: 4px;
}

.lemyox-account-status-list dd {
    color: var(--compact-text);
    font-weight: 900;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-account-plan-mini,
.lemyox-account-help-grid {
    display: grid;
    gap: 12px;
}

.lemyox-account-plan-mini {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-account-plan-mini article {
    display: grid;
    gap: 9px;
    padding: 18px 20px;
}

.lemyox-account-plan-mini article.is-featured {
    border-color: rgba(255, 122, 26, 0.72);
    box-shadow: 0 0 0 1px rgba(255, 122, 26, 0.12);
}

.lemyox-account-plan-mini b,
.lemyox-account-help-grid span {
    color: var(--compact-text);
    font-weight: 900;
}

.lemyox-account-plan-mini strong {
    color: #ff8a1f;
    font-size: 24px;
}

.lemyox-account-plan-mini span {
    color: var(--compact-muted);
    font-size: 13px;
}

.lemyox-account-storage-large {
    background: rgba(7, 13, 25, 0.36);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 14px;
    padding: 20px;
}

.lemyox-account-storage-large strong {
    color: var(--compact-text);
    font-size: 34px;
    letter-spacing: -0.04em;
}

.lemyox-account-storage-large span,
.lemyox-account-storage-large em {
    color: var(--compact-muted);
    font-style: normal;
}

.lemyox-account-storage-large i {
    background: rgba(148, 163, 184, 0.18);
    border-radius: 999px;
    display: block;
    height: 8px;
    margin: 14px 0 8px;
    overflow: hidden;
}

.lemyox-account-storage-large i b {
    background: linear-gradient(90deg, #ff7a1a, #9b5de5);
    display: block;
    height: 100%;
}

.lemyox-account-action-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.lemyox-account-help-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-side,
.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-card,
.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-stat-grid article,
.lemyox-app[data-project-theme="light"][data-current-view="account"] .lemyox-account-quick-card {
    background: #fff;
    box-shadow: 0 16px 42px rgba(15, 23, 42, 0.07);
}

@media (max-width: 1320px) {
    .lemyox-account-mini-dashboard {
        grid-template-columns: 280px minmax(0, 1fr);
    }

    .lemyox-account-stat-grid,
    .lemyox-account-quick-grid,
    .lemyox-account-plan-mini,
    .lemyox-account-help-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 980px) {
    .lemyox-account-mini-dashboard {
        grid-template-columns: 1fr;
    }

    .lemyox-account-side {
        min-height: 0;
        position: static;
    }

    .lemyox-account-side-nav {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lemyox-account-tabs,
    .lemyox-account-setting-grid,
    .lemyox-account-fields,
    .lemyox-account-status-list {
        grid-template-columns: 1fr;
    }

    .lemyox-account-setting-grid article {
        border-left: 0;
        border-top: 1px solid var(--compact-border);
        padding-left: 0;
        padding-top: 14px;
    }
}

@media (max-width: 620px) {
    .lemyox-account-stat-grid,
    .lemyox-account-quick-grid,
    .lemyox-account-plan-mini,
    .lemyox-account-help-grid,
    .lemyox-account-side-nav {
        grid-template-columns: 1fr;
    }

    .lemyox-account-card-head {
        align-items: stretch;
        flex-direction: column;
    }
}

/* Account mini dashboard: final polish and sizing repair */
.lemyox-app[data-current-view="account"] .lemyox-main {
    align-content: start;
    overflow: auto;
}

.lemyox-app[data-current-view="account"] .lemyox-route[data-route="account"] {
    min-height: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-mini-dashboard {
    align-items: start;
    gap: 16px;
    grid-template-columns: minmax(250px, 280px) minmax(0, 1fr);
    margin: 0 auto;
    max-width: 1440px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-side {
    gap: 14px;
    max-height: calc(100vh - 56px);
    min-height: auto;
    overflow: auto;
    padding: 16px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-avatar.is-large {
    height: 92px;
    margin-bottom: 10px;
    width: 92px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-side h2 {
    font-size: 18px;
    line-height: 1.2;
}

.lemyox-app[data-current-view="account"] .lemyox-account-side p,
.lemyox-app[data-current-view="account"] .lemyox-account-side small {
    font-size: 12px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-side-nav {
    gap: 4px;
    padding-top: 12px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-side-nav a,
.lemyox-app[data-current-view="account"] .lemyox-account-logout {
    font-size: 13px;
    min-height: 38px;
    padding: 0 10px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-side-nav svg,
.lemyox-app[data-current-view="account"] .lemyox-account-logout svg {
    flex: 0 0 17px;
    height: 17px;
    width: 17px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-workspace {
    align-content: start;
    display: grid;
    gap: 14px;
    min-width: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-panel-view {
    align-self: start;
    min-width: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid {
    align-items: stretch;
    gap: 14px;
    grid-auto-rows: auto;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid article {
    align-self: start;
    height: auto !important;
    min-height: 104px !important;
    padding: 20px 22px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid article > span {
    border-radius: 12px;
    flex: 0 0 48px;
    height: 48px;
    width: 48px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid svg {
    height: 22px;
    width: 22px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid strong {
    font-size: 22px;
    line-height: 1.15;
}

.lemyox-app[data-current-view="account"] .lemyox-account-card {
    padding: 20px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-card-head {
    margin-bottom: 16px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-card-head h2 {
    font-size: 24px;
    line-height: 1.2;
}

.lemyox-app[data-current-view="account"] .lemyox-account-tabs {
    gap: 8px;
    margin-bottom: 18px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-tabs a {
    font-size: 13px;
    min-height: 38px;
    padding: 0 12px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-tabs svg {
    flex: 0 0 17px;
    height: 17px;
    width: 17px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-fields {
    gap: 14px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-fields input,
.lemyox-app[data-current-view="account"] .lemyox-account-fields textarea,
.lemyox-app[data-current-view="account"] .lemyox-inline-form input {
    min-height: 40px;
    padding: 9px 11px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-setting-grid article {
    min-width: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-choice-row button,
.lemyox-app[data-current-view="account"] .lemyox-account-select {
    min-height: 42px;
    overflow: hidden;
}

.lemyox-app[data-current-view="account"] .lemyox-account-choice-row button svg,
.lemyox-app[data-current-view="account"] .lemyox-account-select svg {
    flex: 0 0 18px !important;
    height: 18px !important;
    max-height: 18px !important;
    max-width: 18px !important;
    width: 18px !important;
}

.lemyox-app[data-current-view="account"] .lemyox-account-select select {
    min-height: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-status-list,
.lemyox-app[data-current-view="account"] .lemyox-account-plan-mini,
.lemyox-app[data-current-view="account"] .lemyox-account-help-grid,
.lemyox-app[data-current-view="account"] .lemyox-account-quick-grid {
    gap: 12px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-quick-card {
    min-height: 118px;
}

.lemyox-app[data-current-view="account"] .lemyox-inline-form {
    align-items: end;
}

.lemyox-app[data-current-view="account"] .lemyox-inline-form .lemyox-gradient-btn {
    min-height: 42px;
    white-space: nowrap;
}

@media (max-width: 1180px) {
    .lemyox-app[data-current-view="account"] .lemyox-account-mini-dashboard {
        grid-template-columns: 1fr;
    }

    .lemyox-app[data-current-view="account"] .lemyox-account-side {
        max-height: none;
        position: static;
    }

    .lemyox-app[data-current-view="account"] .lemyox-account-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 700px) {
    .lemyox-app[data-current-view="account"] .lemyox-account-stat-grid,
    .lemyox-app[data-current-view="account"] .lemyox-account-fields,
    .lemyox-app[data-current-view="account"] .lemyox-account-setting-grid,
    .lemyox-app[data-current-view="account"] .lemyox-account-status-list,
    .lemyox-app[data-current-view="account"] .lemyox-account-quick-grid {
        grid-template-columns: 1fr;
    }

    .lemyox-app[data-current-view="account"] .lemyox-account-card-head {
        align-items: stretch;
        flex-direction: column;
    }
}

/* Account dashboard guardrails: prevent old account styles from stretching the mini hub. */
.lemyox-app[data-current-view="account"] .lemyox-account-hub.lemyox-account-mini-dashboard {
    align-items: start !important;
    max-width: 1440px !important;
}

.lemyox-app[data-current-view="account"] .lemyox-account-workspace {
    grid-auto-rows: max-content;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid {
    height: auto !important;
    max-height: none !important;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid article {
    box-sizing: border-box;
    max-height: 126px;
    overflow: hidden;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid article > div {
    min-width: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid small,
.lemyox-app[data-current-view="account"] .lemyox-account-stat-grid em {
    line-height: 1.35;
}

.lemyox-app[data-current-view="account"] .lemyox-account-card h2,
.lemyox-app[data-current-view="account"] .lemyox-account-card h3,
.lemyox-app[data-current-view="account"] .lemyox-account-card p {
    margin-top: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-card svg,
.lemyox-app[data-current-view="account"] .lemyox-account-quick-card svg {
    max-height: 22px;
    max-width: 22px;
}

.lemyox-app[data-current-view="account"] .lemyox-account-choice-row {
    align-items: stretch;
}

.lemyox-app[data-current-view="account"] .lemyox-account-choice-row button {
    box-sizing: border-box;
    font-size: 13px;
    line-height: 1.2;
    min-width: 0;
}

.lemyox-app[data-current-view="account"] .lemyox-account-select {
    box-sizing: border-box;
    font-size: 13px;
    width: 100%;
}

/* History page polish */
.lemyox-app[data-current-view="history"] .lemyox-main {
    background:
        radial-gradient(circle at 20% 0, rgba(255, 122, 26, 0.10), transparent 28%),
        radial-gradient(circle at 84% 8%, rgba(155, 93, 229, 0.10), transparent 30%),
        #09111b;
    color: var(--compact-text);
    overflow: auto;
    padding: 26px 30px 32px;
}

.lemyox-app[data-current-view="history"] .lemyox-route[data-route="history"] {
    margin: 0 auto;
    max-width: 1220px;
    min-height: 0;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head {
    align-items: center;
    background: linear-gradient(145deg, rgba(16, 26, 38, 0.92), rgba(9, 17, 27, 0.96));
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 18px;
    box-shadow: 0 22px 70px rgba(0, 0, 0, 0.20);
    display: flex;
    isolation: isolate;
    justify-content: space-between;
    margin: 0 0 14px;
    overflow: hidden;
    padding: 22px 24px;
    position: relative;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head::before {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.18), rgba(155, 93, 229, 0.12));
    border-radius: 999px;
    content: "";
    height: 150px;
    position: absolute;
    right: -44px;
    top: -72px;
    width: 150px;
    z-index: -1;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head h2 {
    color: #f8fafc;
    font-size: 28px;
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.12;
    margin: 0 0 8px;
}

.lemyox-app[data-current-view="history"] .lemyox-section-head p {
    color: #9aa8ba;
    font-size: 13px;
    line-height: 1.55;
    margin: 0;
    max-width: 620px;
}

.lemyox-app[data-current-view="history"] .lemyox-toolbar {
    align-items: center;
    background: rgba(16, 26, 38, 0.78);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 16px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.16);
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(260px, 1fr) minmax(180px, 220px) minmax(180px, 220px) auto;
    margin: 0 0 14px;
    padding: 10px;
}

.lemyox-app[data-current-view="history"] .lemyox-toolbar input,
.lemyox-app[data-current-view="history"] .lemyox-toolbar select {
    appearance: none;
    background: rgba(7, 13, 25, 0.72) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    color: #f8fafc !important;
    font-size: 13px;
    height: 42px;
    outline: 0;
    padding: 0 13px !important;
    width: 100%;
}

.lemyox-app[data-current-view="history"] .lemyox-toolbar input:focus,
.lemyox-app[data-current-view="history"] .lemyox-toolbar select:focus {
    border-color: rgba(255, 122, 26, 0.78) !important;
    box-shadow: 0 0 0 3px rgba(255, 122, 26, 0.12) !important;
}

.lemyox-app[data-current-view="history"] .lemyox-toolbar-count {
    align-items: center;
    background: rgba(255, 122, 26, 0.12);
    border: 1px solid rgba(255, 122, 26, 0.24);
    border-radius: 999px;
    color: #ff9a3d;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    justify-content: center;
    min-height: 34px;
    min-width: 86px;
    padding: 0 12px;
    white-space: nowrap;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline {
    background: rgba(16, 26, 38, 0.48);
    border: 1px solid rgba(148, 163, 184, 0.14);
    border-radius: 18px;
    display: grid;
    gap: 0;
    max-width: none;
    overflow: hidden;
    padding: 4px;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article {
    align-items: center;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.11);
    border-radius: 14px;
    box-shadow: none;
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(130px, 170px) minmax(0, 1fr) minmax(140px, 190px);
    min-height: 62px;
    padding: 13px 15px;
    transition: background 0.18s ease, transform 0.18s ease;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article:last-child {
    border-bottom-color: transparent;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article:hover {
    background: rgba(255, 255, 255, 0.045);
    transform: translateY(-1px);
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article b {
    align-items: center;
    color: #f8fafc;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 9px;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article b::before {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    border-radius: 999px;
    box-shadow: 0 0 0 5px rgba(255, 122, 26, 0.10);
    content: "";
    flex: 0 0 10px;
    height: 10px;
    width: 10px;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article p {
    color: #b9c6d8;
    font-size: 13px;
    line-height: 1.45;
    margin: 0;
    min-width: 0;
}

.lemyox-app[data-current-view="history"] .lemyox-timeline article span {
    color: #7f8da3;
    font-size: 12px;
    justify-self: end;
    text-align: right;
    white-space: nowrap;
}

.lemyox-app[data-current-view="history"] .lemyox-empty {
    background: transparent;
    border: 0;
    min-height: 220px;
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-main {
    background: #f7f8fb;
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-section-head,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-toolbar,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline {
    background: #ffffff;
    border-color: rgba(15, 23, 42, 0.10);
    box-shadow: 0 18px 46px rgba(15, 23, 42, 0.07);
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-section-head h2,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline article b {
    color: #0f172a;
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-section-head p,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline article p,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-timeline article span {
    color: #64748b;
}

.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-toolbar input,
.lemyox-app[data-project-theme="light"][data-current-view="history"] .lemyox-toolbar select {
    background: #fbfcfe !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
    color: #0f172a !important;
}

@media (max-width: 980px) {
    .lemyox-app[data-current-view="history"] .lemyox-main {
        padding: 18px;
    }

    .lemyox-app[data-current-view="history"] .lemyox-toolbar {
        grid-template-columns: 1fr 1fr;
    }

    .lemyox-app[data-current-view="history"] .lemyox-toolbar input {
        grid-column: 1 / -1;
    }

    .lemyox-app[data-current-view="history"] .lemyox-timeline article {
        grid-template-columns: 1fr;
    }

    .lemyox-app[data-current-view="history"] .lemyox-timeline article span {
        justify-self: start;
        text-align: left;
    }
}

@media (max-width: 620px) {
    .lemyox-app[data-current-view="history"] .lemyox-section-head {
        padding: 18px;
    }

    .lemyox-app[data-current-view="history"] .lemyox-section-head h2 {
        font-size: 24px;
    }

    .lemyox-app[data-current-view="history"] .lemyox-toolbar {
        grid-template-columns: 1fr;
    }
}

/* Sidebar logo and menu organization */
.lemyox-app .lemyox-brand {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.lemyox-app .lemyox-brand-home {
    align-items: center;
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
}

.lemyox-app .lemyox-brand-mark {
    display: none !important;
}

.lemyox-app .lemyox-brand-logo {
    align-items: center;
    display: inline-flex;
    height: 36px;
    min-width: 0;
    width: 118px;
}

.lemyox-app .lemyox-brand-logo img {
    display: block;
    height: auto;
    max-height: 34px;
    max-width: 100%;
    object-fit: contain;
    width: 100%;
}

.lemyox-app .lemyox-logo-light {
    display: none;
}

.lemyox-app[data-project-theme="light"] .lemyox-logo-dark {
    display: none;
}

.lemyox-app[data-project-theme="light"] .lemyox-logo-light {
    display: block;
}

.lemyox-app .lemyox-brand-text {
    display: none !important;
}

.lemyox-app .lemyox-sidebar-collapse {
    align-items: center;
    border-color: rgba(148, 163, 184, 0.18);
    border-radius: 10px;
    color: var(--shell-muted);
    display: inline-flex;
    flex: 0 0 34px;
    font-size: 0;
    height: 34px;
    justify-content: center;
    transition: background 0.16s ease, border-color 0.16s ease, color 0.16s ease, transform 0.16s ease;
    width: 34px;
}

.lemyox-app .lemyox-sidebar-collapse:hover {
    background: rgba(255, 122, 26, 0.12);
    border-color: rgba(255, 122, 26, 0.42);
    color: var(--shell-orange);
}

.lemyox-app .lemyox-sidebar-collapse::before {
    border: solid currentColor;
    border-width: 0 2px 2px 0;
    content: "";
    display: block;
    height: 8px;
    transform: rotate(135deg);
    width: 8px;
}

.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-collapse::before {
    transform: rotate(-45deg);
}

.lemyox-app.is-sidebar-collapsed .lemyox-brand {
    justify-content: center;
}

.lemyox-app.is-sidebar-collapsed .lemyox-brand-home {
    display: none;
}

.lemyox-app .lemyox-nav {
    display: flex;
    flex-direction: column;
}

.lemyox-app .lemyox-nav-label,
.lemyox-app .lemyox-nav-item {
    order: 90;
}

.lemyox-app .lemyox-nav-label {
    font-size: 0 !important;
}

.lemyox-app .lemyox-nav-label::after {
    color: inherit;
    content: "";
    font-size: 10px;
}

.lemyox-app .lemyox-nav-label:nth-of-type(1) {
    order: 10;
}

.lemyox-app .lemyox-nav-label:nth-of-type(1)::after {
    content: "CHÍNH";
}

.lemyox-app .lemyox-nav-label:nth-of-type(2) {
    order: 20;
}

.lemyox-app .lemyox-nav-label:nth-of-type(2)::after {
    content: "SẢN XUẤT";
}

.lemyox-app .lemyox-nav-label:nth-of-type(3) {
    order: 30;
}

.lemyox-app .lemyox-nav-label:nth-of-type(3)::after {
    content: "TÀI KHOẢN";
}

.lemyox-app .lemyox-nav-item[data-view="projects"] {
    order: 11;
}

.lemyox-app .lemyox-nav-item[data-view="tools"] {
    order: 12;
}

.lemyox-app .lemyox-nav-item[data-view="library"] {
    order: 13;
}

.lemyox-app .lemyox-nav-item[data-view="overview"] {
    order: 14;
}

.lemyox-app .lemyox-nav-item[data-view="presets"] {
    order: 21;
}

.lemyox-app .lemyox-nav-item[data-view="batch"] {
    order: 22;
}

.lemyox-app .lemyox-nav-item[data-view="history"] {
    order: 23;
}

.lemyox-app .lemyox-nav-item[data-view="account"] {
    order: 31;
}

.lemyox-app .lemyox-nav-item span {
    font-size: 0;
}

.lemyox-app .lemyox-nav-item span::after {
    font-size: 13px;
}

.lemyox-app .lemyox-nav-item[data-view="projects"] span::after {
    content: "Dự án của tôi";
}

.lemyox-app .lemyox-nav-item[data-view="tools"] span::after {
    content: "Công cụ Online";
}

.lemyox-app .lemyox-nav-item[data-view="library"] span::after {
    content: "Thư viện ảnh";
}

.lemyox-app .lemyox-nav-item[data-view="overview"] span::after {
    content: "Tổng quan";
}

.lemyox-app .lemyox-nav-item[data-view="presets"] span::after {
    content: "Preset của tôi";
}

.lemyox-app .lemyox-nav-item[data-view="batch"] span::after {
    content: "Chỉnh sửa hàng loạt";
}

.lemyox-app .lemyox-nav-item[data-view="history"] span::after {
    content: "Lịch sử xử lý";
}

.lemyox-app .lemyox-nav-item[data-view="account"] span::after {
    content: "Tài khoản";
}

.lemyox-app.is-sidebar-collapsed .lemyox-nav-item span::after,
.lemyox-app.is-sidebar-collapsed .lemyox-nav-label::after {
    display: none;
}

/* Login screen polish */
.lemyox-login-screen {
    align-items: center;
    background:
        radial-gradient(circle at 16% 16%, rgba(255, 122, 26, 0.16), transparent 30%),
        radial-gradient(circle at 82% 12%, rgba(155, 93, 229, 0.18), transparent 34%),
        linear-gradient(135deg, #070d19 0%, #09111b 52%, #050914 100%);
    display: grid;
    gap: 22px;
    grid-template-columns: minmax(360px, 1fr) minmax(360px, 430px);
    justify-content: center;
    min-height: 100vh;
    overflow: hidden;
    padding: 34px;
    position: relative;
}

.lemyox-login-screen::before {
    align-self: stretch;
    background:
        linear-gradient(rgba(8, 14, 24, 0.12), rgba(8, 14, 24, 0.12)),
        url("../../../../uploads/2026/06/Logo-LemyOX-trang-scaled.png") no-repeat 34px 34px / 170px auto,
        linear-gradient(145deg, rgba(17, 24, 39, 0.78), rgba(8, 15, 25, 0.92));
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 22px;
    box-shadow: 0 24px 80px rgba(0, 0, 0, 0.30);
    color: #f8fafc;
    content: "Smart Photo Workflow\A\AQuản lý dự án in ảnh chuyên nghiệp\A\ATải ảnh, chỉnh sửa, bình file A4 và xuất PDF/ZIP trong một không gian làm việc gọn, nhanh và đồng bộ.";
    display: flex;
    flex-direction: column;
    font-size: 15px;
    font-weight: 500;
    justify-content: flex-end;
    line-height: 1.7;
    max-width: 600px;
    min-height: 520px;
    padding: 230px 36px 38px;
    white-space: pre-line;
}

.lemyox-login-screen::after {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5);
    border-radius: 999px;
    content: "";
    filter: blur(54px);
    height: 180px;
    opacity: 0.24;
    position: absolute;
    right: 14%;
    top: 9%;
    width: 180px;
}

.lemyox-login-card {
    background: linear-gradient(180deg, rgba(17, 25, 38, 0.96), rgba(9, 17, 27, 0.98));
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 22px;
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.36);
    isolation: isolate;
    padding: 30px;
    position: relative;
    width: 100%;
    z-index: 1;
}

.lemyox-login-card::before {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.24), rgba(155, 93, 229, 0.16));
    border-radius: inherit;
    content: "";
    inset: -1px;
    opacity: 0.34;
    position: absolute;
    z-index: -1;
}

.lemyox-login-brand {
    align-items: center;
    border-bottom: 1px solid rgba(148, 163, 184, 0.13);
    gap: 14px;
    margin-bottom: 22px;
    padding-bottom: 20px;
}

.lemyox-login-brand .lemyox-logo-mark {
    background:
        url("../../../../uploads/2026/06/Logo-LemyOX-trang-scaled.png") no-repeat center / contain;
    border-radius: 0;
    color: transparent;
    flex: 0 0 132px;
    height: 42px;
    overflow: hidden;
    width: 132px;
}

.lemyox-login-brand strong {
    color: #f8fafc;
    display: block;
    font-size: 0;
    line-height: 1.2;
}

.lemyox-login-brand strong::after {
    content: "Đăng nhập LemyOX";
    font-size: 19px;
    font-weight: 850;
    letter-spacing: -0.02em;
}

.lemyox-login-brand p {
    color: #9aa8ba;
    font-size: 0;
    margin: 5px 0 0;
}

.lemyox-login-brand p::after {
    content: "Vào app để quản lý dự án và xuất file in.";
    font-size: 13px;
}

#lemyox-login-form {
    display: grid;
    gap: 14px;
}

#lemyox-login-form p {
    margin: 0;
}

#lemyox-login-form label {
    color: #d8e1ee;
    display: block;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 8px;
}

#lemyox-login-form .login-username label,
#lemyox-login-form .login-password label {
    font-size: 0;
}

#lemyox-login-form .login-username label::after {
    content: "Email hoặc tên đăng nhập";
    font-size: 13px;
}

#lemyox-login-form .login-password label::after {
    content: "Mật khẩu";
    font-size: 13px;
}

.lemyox-login-card input[type="text"],
.lemyox-login-card input[type="password"] {
    background: rgba(7, 13, 25, 0.78) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 12px !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
    color: #f8fafc !important;
    height: 46px;
    padding: 0 14px !important;
}

.lemyox-login-card input[type="text"]:focus,
.lemyox-login-card input[type="password"]:focus {
    border-color: rgba(255, 122, 26, 0.78) !important;
    box-shadow: 0 0 0 4px rgba(255, 122, 26, 0.12) !important;
}

#lemyox-login-form .login-remember {
    align-items: center;
    display: flex;
    min-height: 30px;
}

#lemyox-login-form .login-remember label {
    align-items: center;
    color: #c8d3e1;
    cursor: pointer;
    display: inline-flex;
    font-size: 0;
    gap: 9px;
    margin: 0;
}

#lemyox-login-form .login-remember label::after {
    content: "Ghi nhớ đăng nhập";
    font-size: 13px;
    font-weight: 700;
}

#lemyox-login-form input[type="checkbox"] {
    accent-color: #ff7a1a;
    height: 16px;
    width: 16px;
}

#lemyox-login-form .login-submit {
    margin-top: 4px;
    position: relative;
}

.lemyox-login-card .button {
    background: linear-gradient(135deg, #ff7a1a, #9b5de5) !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 36px rgba(255, 122, 26, 0.22);
    color: transparent !important;
    height: 46px;
    min-width: 190px;
    padding: 0 22px !important;
    width: auto;
}

#lemyox-login-form .login-submit::after {
    color: #fff;
    content: "Đăng nhập vào app";
    font-size: 14px;
    font-weight: 850;
    left: 22px;
    line-height: 46px;
    pointer-events: none;
    position: absolute;
    top: 0;
}

.lemyox-login-card .button:hover {
    box-shadow: 0 18px 42px rgba(155, 93, 229, 0.32);
    transform: translateY(-1px);
}

.lemyox-login-links {
    align-items: center;
    border-top: 1px solid rgba(148, 163, 184, 0.13);
    color: #9aa8ba;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
    padding-top: 18px;
}

.lemyox-login-links a {
    color: #ff9a3d;
    font-size: 0;
    font-weight: 800;
    text-decoration: none;
}

.lemyox-login-links a::after {
    content: "Quên mật khẩu?";
    font-size: 13px;
}

.lemyox-login-links span {
    color: #9aa8ba;
    font-size: 0;
}

.lemyox-login-links span::after {
    content: "Admin có thể tạo user tại WP Admin > Users.";
    font-size: 13px;
}

@media (max-width: 900px) {
    .lemyox-login-screen {
        grid-template-columns: minmax(0, 430px);
        padding: 22px;
    }

    .lemyox-login-screen::before {
        display: none;
    }
}

@media (max-width: 520px) {
    .lemyox-login-card {
        border-radius: 18px;
        padding: 22px;
    }

    .lemyox-login-brand {
        align-items: flex-start;
        flex-direction: column;
    }

    .lemyox-login-card .button {
        width: 100%;
    }

    #lemyox-login-form .login-submit::after {
        left: 0;
        text-align: center;
        width: 100%;
    }
}

/* Login layout fix: keep the welcome panel and form centered as one composition. */
.lemyox-login-screen {
    align-items: center !important;
    grid-template-columns: minmax(320px, 520px) minmax(340px, 420px) !important;
    justify-content: center !important;
    justify-items: stretch;
    min-height: 100vh;
    padding: 32px !important;
}

.lemyox-login-screen::before {
    align-self: center;
    background:
        url("../../../../uploads/2026/06/Logo-LemyOX-trang-scaled.png") no-repeat 32px 30px / 150px auto,
        radial-gradient(circle at 18% 18%, rgba(255, 122, 26, 0.12), transparent 34%),
        linear-gradient(145deg, rgba(17, 24, 39, 0.82), rgba(8, 15, 25, 0.96));
    border-radius: 18px;
    box-sizing: border-box;
    max-width: 520px;
    min-height: 430px;
    padding: 178px 32px 34px;
}

.lemyox-login-card {
    align-self: center;
    max-width: 420px;
    min-height: 0;
}

.lemyox-login-brand {
    display: grid;
    gap: 12px;
    grid-template-columns: 88px minmax(0, 1fr);
}

.lemyox-login-brand .lemyox-logo-mark {
    flex-basis: auto;
    height: 34px;
    width: 88px;
}

.lemyox-login-brand strong::after {
    font-size: 18px;
}

.lemyox-login-brand p::after {
    font-size: 12px;
    line-height: 1.45;
}

.lemyox-login-card .button {
    min-width: 176px;
}

@media (max-width: 980px) {
    .lemyox-login-screen {
        grid-template-columns: minmax(0, 430px) !important;
    }

    .lemyox-login-screen::before {
        display: none;
    }
}

@media (max-width: 520px) {
    .lemyox-login-screen {
        padding: 18px !important;
    }

    .lemyox-login-brand {
        grid-template-columns: 1fr;
    }
}

/* Login reference layout */
.lemyox-login-screen {
    align-items: center !important;
    background:
        radial-gradient(circle at 50% 8%, rgba(45, 74, 112, 0.35), transparent 35%),
        radial-gradient(circle at 50% 100%, rgba(13, 23, 36, 0.80), transparent 42%),
        linear-gradient(180deg, #0b1624 0%, #07101b 100%) !important;
    display: grid !important;
    gap: 0 !important;
    grid-template-columns: 560px 560px !important;
    justify-content: center !important;
    justify-items: stretch !important;
    min-height: 100vh !important;
    overflow: hidden;
    padding: 30px !important;
}

.lemyox-login-screen::before,
.lemyox-login-card {
    height: 674px;
}

.lemyox-login-screen::before {
    align-self: center;
    background:
        url("../../../../uploads/2026/06/Logo-LemyOX-trang-scaled.png") no-repeat 56px 62px / 158px auto,
        radial-gradient(circle at 20% 0, rgba(255, 122, 26, 0.08), transparent 30%),
        linear-gradient(145deg, rgba(20, 31, 47, 0.76), rgba(10, 18, 29, 0.96));
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 18px 0 0 18px;
    border-right: 0;
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.32);
    box-sizing: border-box;
    color: #f8fafc;
    content: "Smart Photo Workflow\A\AQuản lý dự án in ảnh\A\AQuản lý dự án in ảnh chuyên nghiệp, từ chỉnh sửa,\A bình file A4 đến xuất PDF/ZIP nhanh chóng.\A\A✣  Chỉnh ảnh\A\A▱  Bình file A4\A\A▣  Xuất PDF/ZIP";
    display: block;
    font-size: 18px;
    font-weight: 750;
    line-height: 1.58;
    margin: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    padding: 194px 58px 56px !important;
    text-shadow: 0 1px 18px rgba(0, 0, 0, 0.18);
    white-space: pre-line;
    width: 560px;
}

.lemyox-login-screen::after {
    display: none !important;
}

.lemyox-login-card {
    align-self: center;
    background:
        radial-gradient(circle at 85% 12%, rgba(155, 93, 229, 0.08), transparent 30%),
        linear-gradient(145deg, rgba(20, 31, 47, 0.72), rgba(10, 18, 29, 0.96)) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-left: 1px solid rgba(148, 163, 184, 0.14) !important;
    border-radius: 0 18px 18px 0 !important;
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.32) !important;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: none !important;
    padding: 0 58px !important;
    width: 560px !important;
}

.lemyox-login-card::before {
    display: none !important;
}

.lemyox-login-brand {
    border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
    display: block !important;
    margin: 0 0 36px !important;
    padding: 0 0 30px !important;
}

.lemyox-login-brand .lemyox-logo-mark {
    display: none !important;
}

.lemyox-login-brand strong {
    color: #f8fafc !important;
    display: block !important;
    font-size: 0 !important;
    line-height: 1.18;
}

.lemyox-login-brand strong::after {
    content: "Đăng nhập LemyOX";
    font-size: 31px !important;
    font-weight: 850;
    letter-spacing: -0.035em;
}

.lemyox-login-brand p {
    color: #b6c1d0 !important;
    font-size: 0 !important;
    margin: 14px 0 0 !important;
}

.lemyox-login-brand p::after {
    content: "Vào app để quản lý dự án và xuất file in.";
    font-size: 17px !important;
    line-height: 1.45;
}

#lemyox-login-form {
    display: grid !important;
    gap: 22px !important;
    position: relative;
}

#lemyox-login-form p {
    margin: 0 !important;
}

#lemyox-login-form label {
    color: #d8e1ee !important;
    display: block;
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1.35;
    margin: 0 0 11px !important;
}

#lemyox-login-form .login-username label,
#lemyox-login-form .login-password label {
    font-size: 0 !important;
}

#lemyox-login-form .login-username label::after {
    content: "Email hoặc tên đăng nhập";
    font-size: 15px;
}

#lemyox-login-form .login-password label::after {
    content: "Mật khẩu";
    font-size: 15px;
}

#lemyox-login-form .login-password {
    position: relative;
}

#lemyox-login-form .login-password::after {
    align-items: center;
    border: 2px solid #aab6c7;
    border-radius: 999px;
    box-sizing: border-box;
    content: "";
    display: flex;
    height: 15px;
    justify-content: center;
    pointer-events: none;
    position: absolute;
    right: 18px;
    top: 50px;
    width: 22px;
}

#lemyox-login-form .login-password::before {
    background: #aab6c7;
    border-radius: 999px;
    content: "";
    height: 5px;
    pointer-events: none;
    position: absolute;
    right: 26px;
    top: 55px;
    width: 5px;
    z-index: 2;
}

.lemyox-login-card input[type="text"],
.lemyox-login-card input[type="password"] {
    background: rgba(5, 13, 24, 0.78) !important;
    border: 1px solid rgba(148, 163, 184, 0.20) !important;
    border-radius: 10px !important;
    color: #f8fafc !important;
    font-size: 16px !important;
    height: 58px !important;
    padding: 0 18px !important;
}

.lemyox-login-card input[type="text"]::placeholder,
.lemyox-login-card input[type="password"]::placeholder {
    color: #7f8da3;
}

.lemyox-login-card input[type="text"]:focus,
.lemyox-login-card input[type="password"]:focus {
    border-color: rgba(255, 122, 26, 0.72) !important;
    box-shadow: 0 0 0 4px rgba(255, 122, 26, 0.12) !important;
}

#lemyox-login-form .login-remember {
    align-items: center;
    display: flex;
    min-height: 28px;
}

#lemyox-login-form .login-remember label {
    align-items: center;
    color: #cbd5e1 !important;
    cursor: pointer;
    display: inline-flex !important;
    font-size: 0 !important;
    gap: 13px;
    margin: 0 !important;
}

#lemyox-login-form .login-remember label::after {
    content: "Ghi nhớ đăng nhập";
    font-size: 15px;
    font-weight: 650;
}

#lemyox-login-form input[type="checkbox"] {
    accent-color: #ff7a1a;
    height: 22px !important;
    margin: 0 !important;
    width: 22px !important;
}

#lemyox-login-form .login-submit {
    margin-top: 8px !important;
    position: relative;
}

.lemyox-login-card .button {
    background: linear-gradient(180deg, #ff6d20, #ff5317) !important;
    border: 0 !important;
    border-radius: 9px !important;
    box-shadow: 0 16px 34px rgba(255, 91, 24, 0.22) !important;
    color: transparent !important;
    height: 58px !important;
    min-width: 0 !important;
    padding: 0 22px !important;
    width: 100% !important;
}

#lemyox-login-form .login-submit::after {
    color: #fff;
    content: "Đăng nhập vào app";
    font-size: 18px;
    font-weight: 850;
    inset: 0;
    line-height: 58px;
    pointer-events: none;
    position: absolute;
    text-align: center;
}

.lemyox-login-card .button:hover {
    box-shadow: 0 18px 42px rgba(255, 91, 24, 0.34) !important;
    transform: translateY(-1px);
}

.lemyox-login-links {
    border-top: 0 !important;
    display: block !important;
    margin: 25px 0 0 !important;
    padding: 0 !important;
}

.lemyox-login-links a {
    color: #ff7a1a !important;
    display: block;
    font-size: 0 !important;
    font-weight: 800;
    margin: -114px 0 82px auto;
    position: relative;
    text-align: right;
    text-decoration: none;
    width: max-content;
    z-index: 3;
}

.lemyox-login-links a::after {
    content: "Quên mật khẩu?";
    font-size: 15px;
}

.lemyox-login-links span {
    color: #9aa8ba !important;
    display: block;
    font-size: 0 !important;
}

.lemyox-login-links span::after {
    content: "Admin có thể tạo user tại WP Admin > Users.";
    font-size: 16px;
}

@media (max-width: 1180px) {
    .lemyox-login-screen {
        grid-template-columns: minmax(320px, 500px) minmax(340px, 500px) !important;
    }

    .lemyox-login-screen::before,
    .lemyox-login-card {
        width: auto !important;
    }
}

@media (max-width: 900px) {
    .lemyox-login-screen {
        grid-template-columns: minmax(0, 520px) !important;
        padding: 24px !important;
    }

    .lemyox-login-screen::before {
        border-radius: 18px 18px 0 0;
        border-right: 1px solid rgba(148, 163, 184, 0.18);
        height: auto;
        min-height: 310px !important;
        padding: 146px 30px 30px !important;
        width: 100% !important;
    }

    .lemyox-login-card {
        border-radius: 0 0 18px 18px !important;
        height: auto;
        padding: 36px 30px !important;
        width: 100% !important;
    }
}

@media (max-width: 560px) {
    .lemyox-login-screen {
        padding: 16px !important;
    }

    .lemyox-login-screen::before {
        display: none !important;
    }

    .lemyox-login-card {
        border-radius: 18px !important;
    }

    .lemyox-login-brand strong::after {
        font-size: 25px !important;
    }
}

/* Login showcase polish: replace the old text-only left panel with real feature cards. */
.lemyox-login-screen {
    grid-template-columns: 560px 560px !important;
}

.lemyox-login-screen::before {
    display: none !important;
}

.lemyox-login-showcase,
.lemyox-login-card {
    height: 674px;
}

.lemyox-login-showcase {
    align-self: center;
    background:
        radial-gradient(circle at 18% 16%, rgba(255, 122, 26, 0.16), transparent 28%),
        radial-gradient(circle at 82% 0%, rgba(155, 93, 229, 0.12), transparent 34%),
        linear-gradient(145deg, rgba(20, 31, 47, 0.78), rgba(8, 15, 25, 0.96));
    border: 1px solid rgba(148, 163, 184, 0.18);
    border-radius: 18px 0 0 18px;
    border-right: 0;
    box-shadow: 0 28px 90px rgba(0, 0, 0, 0.32);
    box-sizing: border-box;
    color: #f8fafc;
    overflow: hidden;
    padding: 62px 56px 52px;
    position: relative;
    width: 560px;
}

.lemyox-login-showcase::before {
    background:
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: 44px 44px;
    content: "";
    inset: 0;
    mask-image: radial-gradient(circle at 20% 20%, black, transparent 62%);
    opacity: 0.55;
    pointer-events: none;
    position: absolute;
}

.lemyox-login-showcase::after {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.22), rgba(155, 93, 229, 0.16));
    border-radius: 999px;
    bottom: -76px;
    content: "";
    filter: blur(34px);
    height: 180px;
    opacity: 0.42;
    position: absolute;
    right: -56px;
    width: 180px;
}

.lemyox-login-showcase-glow {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.16), rgba(155, 93, 229, 0.14));
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 26px;
    height: 220px;
    opacity: 0.42;
    position: absolute;
    right: 48px;
    top: 52px;
    transform: rotate(12deg);
    width: 170px;
}

.lemyox-login-showcase-logo,
.lemyox-login-showcase-kicker,
.lemyox-login-showcase h2,
.lemyox-login-showcase p,
.lemyox-login-feature-stack {
    position: relative;
    z-index: 2;
}

.lemyox-login-showcase-logo {
    display: block;
    height: auto;
    margin: 0 0 68px;
    width: 166px;
}

.lemyox-login-showcase-kicker {
    color: #ff7a1a;
    display: inline-flex;
    font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.01em;
    margin-bottom: 18px;
}

.lemyox-login-showcase h2 {
    color: #f8fafc;
    font-size: 31px;
    font-weight: 850;
    letter-spacing: -0.035em;
    line-height: 1.12;
    margin: 0 0 18px;
}

.lemyox-login-showcase p {
    color: #c1ccda;
    font-size: 17px;
    line-height: 1.65;
    margin: 0;
    max-width: 390px;
}

.lemyox-login-feature-stack {
    display: grid;
    gap: 16px;
    margin-top: 40px;
    max-width: 360px;
}

.lemyox-login-feature-card {
    align-items: center;
    background: rgba(255, 255, 255, 0.035);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 16px;
    display: grid;
    gap: 16px;
    grid-template-columns: 54px minmax(0, 1fr);
    min-height: 74px;
    padding: 10px 14px;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.lemyox-login-feature-card:hover {
    background: rgba(255, 122, 26, 0.075);
    border-color: rgba(255, 122, 26, 0.24);
    transform: translateX(4px);
}

.lemyox-login-feature-icon {
    align-items: center;
    background: linear-gradient(145deg, rgba(255, 122, 26, 0.16), rgba(148, 163, 184, 0.08));
    border: 1px solid rgba(255, 122, 26, 0.16);
    border-radius: 14px;
    color: #ff8a1f;
    display: inline-flex;
    height: 54px;
    justify-content: center;
    position: relative;
    width: 54px;
}

.lemyox-login-feature-icon::before,
.lemyox-login-feature-icon::after {
    content: "";
    position: absolute;
}

.lemyox-login-feature-icon.is-edit::before {
    border: 2px solid currentColor;
    border-radius: 5px;
    height: 18px;
    transform: rotate(-12deg);
    width: 18px;
}

.lemyox-login-feature-icon.is-edit::after {
    background: currentColor;
    border-radius: 999px;
    box-shadow: -12px 0 0 currentColor, 12px 0 0 currentColor, 0 -12px 0 currentColor, 0 12px 0 currentColor;
    height: 4px;
    width: 4px;
}

.lemyox-login-feature-icon.is-layout::before {
    border: 2px solid currentColor;
    border-radius: 3px;
    height: 24px;
    width: 18px;
}

.lemyox-login-feature-icon.is-layout::after {
    background: currentColor;
    box-shadow: 0 8px 0 currentColor;
    height: 2px;
    width: 18px;
}

.lemyox-login-feature-icon.is-export::before {
    border: 2px solid currentColor;
    border-radius: 3px;
    height: 24px;
    width: 18px;
}

.lemyox-login-feature-icon.is-export::after {
    border: solid currentColor;
    border-width: 0 2px 2px 0;
    height: 8px;
    transform: rotate(45deg);
    width: 8px;
}

.lemyox-login-feature-card strong {
    color: #f8fafc;
    display: block;
    font-size: 17px;
    font-weight: 800;
    margin-bottom: 3px;
}

.lemyox-login-feature-card small {
    color: #8fa0b6;
    display: block;
    font-size: 12px;
    line-height: 1.4;
}

@media (max-width: 1180px) {
    .lemyox-login-screen {
        grid-template-columns: minmax(320px, 500px) minmax(340px, 500px) !important;
    }

    .lemyox-login-showcase {
        width: auto;
    }
}

@media (max-width: 900px) {
    .lemyox-login-screen {
        grid-template-columns: minmax(0, 520px) !important;
    }

    .lemyox-login-showcase {
        border-radius: 18px 18px 0 0;
        border-right: 1px solid rgba(148, 163, 184, 0.18);
        height: auto;
        min-height: 430px;
        padding: 42px 30px 34px;
        width: 100%;
    }

    .lemyox-login-showcase-logo {
        margin-bottom: 42px;
    }

    .lemyox-login-card {
        border-radius: 0 0 18px 18px !important;
    }
}

@media (max-width: 560px) {
    .lemyox-login-showcase {
        display: none;
    }
}

/* User password recovery pages */
.lemyox-auth-card.is-forgot .lemyox-login-brand strong::after {
    content: "Quên mật khẩu";
}

.lemyox-auth-card.is-reset .lemyox-login-brand strong::after {
    content: "Cấp lại mật khẩu";
}

.lemyox-auth-card.is-forgot .lemyox-login-brand p::after {
    content: "Nhập email hoặc tên đăng nhập để nhận liên kết bảo mật.";
}

.lemyox-auth-card.is-reset .lemyox-login-brand p::after {
    content: "Tạo mật khẩu mới cho tài khoản LemyOX của bạn.";
}

.lemyox-auth-form {
    display: grid;
    gap: 18px;
}

.lemyox-auth-form label {
    color: #d8e1ee;
    font-size: 15px;
    font-weight: 700;
}

.lemyox-auth-form input {
    background: rgba(5, 13, 24, 0.78) !important;
    border: 1px solid rgba(148, 163, 184, 0.20) !important;
    border-radius: 10px !important;
    color: #f8fafc !important;
    font-size: 16px;
    height: 56px;
    padding: 0 18px !important;
}

.lemyox-auth-form input:focus {
    border-color: rgba(255, 122, 26, 0.72) !important;
    box-shadow: 0 0 0 4px rgba(255, 122, 26, 0.12) !important;
}

.lemyox-auth-submit {
    background: linear-gradient(180deg, #ff6d20, #ff5317);
    border: 0;
    border-radius: 10px;
    box-shadow: 0 16px 34px rgba(255, 91, 24, 0.22);
    color: #fff;
    cursor: pointer;
    font-size: 17px;
    font-weight: 850;
    height: 56px;
    margin-top: 4px;
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

.lemyox-auth-submit:hover {
    box-shadow: 0 18px 42px rgba(255, 91, 24, 0.34);
    transform: translateY(-1px);
}

.lemyox-auth-notice {
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.55;
    margin: -18px 0 22px;
    padding: 13px 15px;
}

.lemyox-auth-notice.is-success {
    background: rgba(34, 197, 94, 0.12);
    border: 1px solid rgba(34, 197, 94, 0.28);
    color: #86efac;
}

.lemyox-auth-notice.is-error {
    background: rgba(248, 113, 113, 0.12);
    border: 1px solid rgba(248, 113, 113, 0.30);
    color: #fecaca;
}

.lemyox-auth-links {
    border-top: 1px solid rgba(148, 163, 184, 0.14) !important;
    display: grid !important;
    gap: 10px !important;
    margin: 24px 0 0 !important;
    padding: 18px 0 0 !important;
}

.lemyox-auth-links a {
    color: #ff7a1a !important;
    display: inline-flex !important;
    font-size: 14px !important;
    font-weight: 800;
    margin: 0 !important;
    position: static !important;
    text-align: left !important;
    width: max-content !important;
}

.lemyox-auth-links a::after {
    content: "" !important;
}

.lemyox-auth-links span {
    color: #9aa8ba !important;
    display: block !important;
    font-size: 13px !important;
}

.lemyox-auth-links span::after {
    content: "" !important;
}

/* Sidebar logo final: show one themed bitmap logo only. */
.lemyox-app .lemyox-brand-home {
    flex: 1 1 auto;
    overflow: hidden;
}

.lemyox-app .lemyox-brand-logo {
    flex: 0 0 142px !important;
    height: 42px !important;
    width: 142px !important;
}

.lemyox-app .lemyox-brand-logo img {
    height: auto !important;
    max-height: 40px !important;
    max-width: 142px !important;
    object-fit: contain;
    width: 142px !important;
}

.lemyox-app .lemyox-brand-text,
.lemyox-app .lemyox-brand-text *,
.lemyox-app .lemyox-brand-text strong,
.lemyox-app .lemyox-brand-text span {
    display: none !important;
    font-size: 0 !important;
    height: 0 !important;
    line-height: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    width: 0 !important;
}

.lemyox-app .lemyox-brand-text strong::before,
.lemyox-app .lemyox-brand-text strong::after {
    content: "" !important;
    display: none !important;
}

.lemyox-app .lemyox-logo-dark {
    display: block !important;
}

.lemyox-app .lemyox-logo-light {
    display: none !important;
}

.lemyox-app[data-project-theme="light"] .lemyox-logo-dark,
.lemyox-app[data-app-theme="light"] .lemyox-logo-dark {
    display: none !important;
}

.lemyox-app[data-project-theme="light"] .lemyox-logo-light,
.lemyox-app[data-app-theme="light"] .lemyox-logo-light {
    display: block !important;
}

.lemyox-app.is-sidebar-collapsed .lemyox-brand-logo {
    flex-basis: 0 !important;
    width: 0 !important;
}

/* Sidebar user card: move to bottom and keep only avatar + plan badge. */
.lemyox-app .lemyox-sidebar {
    display: flex;
    flex-direction: column;
}

.lemyox-app .lemyox-sidebar-user-card {
    align-items: center !important;
    align-self: stretch;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    display: flex !important;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 8px !important;
    justify-content: center;
    margin: 10px 0 0 !important;
    min-height: auto !important;
    order: 98;
    padding: 8px 0 2px !important;
    text-align: center;
}

.lemyox-app .lemyox-sidebar-user-card img {
    border: 1px solid rgba(148, 163, 184, 0.22);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
    height: 42px !important;
    width: 42px !important;
}

.lemyox-app .lemyox-sidebar-user-card span,
.lemyox-app .lemyox-sidebar-user-card strong,
.lemyox-app .lemyox-sidebar-user-card small {
    display: none !important;
}

.lemyox-app .lemyox-sidebar-user-card b {
    background: rgba(155, 93, 229, 0.18) !important;
    border: 1px solid rgba(155, 93, 229, 0.34);
    border-radius: 999px !important;
    color: #ffffff !important;
    display: inline-flex !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1;
    padding: 5px 9px !important;
    position: static !important;
    text-transform: capitalize;
}

.lemyox-app .lemyox-nav {
    flex: 1 1 auto;
    order: 10;
}

.lemyox-app .lemyox-sidebar-bottom {
    flex: 0 0 auto;
    margin-top: auto !important;
    order: 97;
}

.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card {
    display: none !important;
}

/* Sidebar: account is opened from avatar, so hide duplicated nav entry. */
.lemyox-app .lemyox-nav-label:nth-of-type(3),
.lemyox-app .lemyox-nav-item[data-view="account"] {
    display: none !important;
}

/* Sidebar: hide storage/upgrade card, keep avatar as the only bottom control. */
.lemyox-app .lemyox-sidebar-bottom {
    display: none !important;
}

.lemyox-app .lemyox-sidebar-user-card {
    margin-top: auto !important;
}

/* Sidebar rail: Canva-like icon navigation, fixed and always compact. */
.lemyox-app,
.lemyox-app:not(.is-sidebar-collapsed),
.lemyox-app.is-sidebar-collapsed,
.lemyox-app[data-current-view],
.lemyox-app[data-current-view]:not(.is-sidebar-collapsed),
.lemyox-app[data-current-view].is-sidebar-collapsed {
    grid-template-columns: 73px minmax(0, 1fr) !important;
}

.lemyox-app .lemyox-sidebar,
.lemyox-app[data-current-view] .lemyox-sidebar,
.lemyox-app[data-current-view="projects"] .lemyox-sidebar,
.lemyox-app[data-current-view="library"] .lemyox-sidebar {
    align-items: center !important;
    gap: 8px !important;
    overflow-x: hidden !important;
    padding: 12px 7px !important;
    width: 73px !important;
}

.lemyox-app .lemyox-brand,
.lemyox-app.is-sidebar-collapsed .lemyox-brand {
    align-items: center !important;
    border-bottom: 0 !important;
    justify-content: center !important;
    margin: 0 0 7px !important;
    min-height: 37px !important;
    padding: 0 !important;
    width: 100% !important;
}

.lemyox-app .lemyox-brand-home,
.lemyox-app.is-sidebar-collapsed .lemyox-brand-home {
    align-items: center !important;
    display: flex !important;
    flex: 0 0 auto !important;
    justify-content: center !important;
    min-width: 0 !important;
    overflow: visible !important;
    width: 100% !important;
}

.lemyox-app .lemyox-brand-logo,
.lemyox-app.is-sidebar-collapsed .lemyox-brand-logo {
    display: inline-flex !important;
    flex: 0 0 51px !important;
    height: 29px !important;
    justify-content: center !important;
    width: 51px !important;
}

.lemyox-app .lemyox-brand-logo img,
.lemyox-app.is-sidebar-collapsed .lemyox-brand-logo img {
    height: auto !important;
    max-height: 27px !important;
    max-width: 51px !important;
    object-fit: contain !important;
    width: 51px !important;
}

.lemyox-app .lemyox-sidebar-collapse,
.lemyox-app .lemyox-sidebar-bottom,
.lemyox-app .lemyox-storage-card,
.lemyox-app .lemyox-user-box,
.lemyox-app .lemyox-nav-label {
    display: none !important;
}

.lemyox-app .lemyox-nav {
    align-items: center !important;
    display: flex !important;
    flex: 1 1 auto !important;
    gap: 7px !important;
    justify-content: flex-start !important;
    margin: 2px 0 0 !important;
    order: 10 !important;
    padding: 0 !important;
    width: 100% !important;
}

.lemyox-app .lemyox-nav-item,
.lemyox-app[data-current-view] .lemyox-nav-item,
.lemyox-app[data-current-view="projects"] .lemyox-nav-item {
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 12px !important;
    color: #9fb0c6 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    height: 51px !important;
    justify-content: center !important;
    min-height: 51px !important;
    min-width: 0 !important;
    order: 90;
    padding: 5px 3px !important;
    text-align: center !important;
    width: 56px !important;
}

.lemyox-app .lemyox-nav-item:hover,
.lemyox-app .lemyox-nav-item.is-active,
.lemyox-app[data-current-view] .lemyox-nav-item:hover,
.lemyox-app[data-current-view] .lemyox-nav-item.is-active {
    background: rgba(255, 122, 26, 0.12) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 122, 26, 0.16) !important;
    color: #ff8a2a !important;
}

.lemyox-app .lemyox-nav-item svg,
.lemyox-app[data-current-view] .lemyox-nav-item svg {
    flex: 0 0 auto !important;
    height: 20px !important;
    margin: 0 !important;
    stroke-width: 1.8 !important;
    width: 20px !important;
}

.lemyox-app .lemyox-nav-item span,
.lemyox-app.is-sidebar-collapsed .lemyox-nav-item span {
    display: block !important;
    font-size: 0 !important;
    line-height: 1 !important;
    max-width: 53px !important;
    overflow: visible !important;
    text-align: center !important;
    white-space: normal !important;
}

.lemyox-app .lemyox-nav-item span::after,
.lemyox-app.is-sidebar-collapsed .lemyox-nav-item span::after {
    color: currentColor !important;
    display: block !important;
    font-size: 9.5px !important;
    font-weight: 650 !important;
    letter-spacing: 0 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: normal !important;
}

.lemyox-app .lemyox-nav-item[data-view="projects"] {
    order: 10 !important;
}

.lemyox-app .lemyox-nav-item[data-view="tools"] {
    order: 11 !important;
}

.lemyox-app .lemyox-nav-item[data-view="library"] {
    order: 12 !important;
}

.lemyox-app .lemyox-nav-item[data-view="overview"] {
    order: 13 !important;
}

.lemyox-app .lemyox-nav-item[data-view="presets"] {
    order: 20 !important;
}

.lemyox-app .lemyox-nav-item[data-view="batch"] {
    order: 21 !important;
}

.lemyox-app .lemyox-nav-item[data-view="history"] {
    order: 22 !important;
}

.lemyox-app .lemyox-nav-item[data-view="projects"] span::after {
    content: "Dự án" !important;
}

.lemyox-app .lemyox-nav-item[data-view="tools"] span::after {
    content: "Công cụ" !important;
}

.lemyox-app .lemyox-nav-item[data-view="library"] span::after {
    content: "Ảnh" !important;
}

.lemyox-app .lemyox-nav-item[data-view="overview"] span::after {
    content: "Tổng quan" !important;
}

.lemyox-app .lemyox-nav-item[data-view="presets"] span::after {
    content: "Preset" !important;
}

.lemyox-app .lemyox-nav-item[data-view="batch"] span::after {
    content: "Batch" !important;
}

.lemyox-app .lemyox-nav-item[data-view="history"] span::after {
    content: "Lịch sử" !important;
}

.lemyox-app .lemyox-nav-item[data-view="account"],
.lemyox-app .lemyox-nav-item[data-view="profile"],
.lemyox-app .lemyox-nav-item[data-view="plan"],
.lemyox-app .lemyox-nav-item[data-view="storage"],
.lemyox-app .lemyox-nav-item[data-view="security"],
.lemyox-app .lemyox-nav-item[data-view="guide"],
.lemyox-app .lemyox-nav-item[data-view="support"],
.lemyox-app .lemyox-nav-item[href*="action=logout"] {
    display: none !important;
}

.lemyox-app .lemyox-sidebar-user-card,
.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card {
    align-items: center !important;
    align-self: center !important;
    display: flex !important;
    flex: 0 0 auto !important;
    gap: 4px !important;
    margin: auto 0 0 !important;
    order: 98 !important;
    padding: 5px 0 3px !important;
    width: 56px !important;
}

.lemyox-app .lemyox-sidebar-user-card img,
.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card img {
    height: 31px !important;
    width: 31px !important;
}

.lemyox-app .lemyox-sidebar-user-card b,
.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card b {
    border-radius: 999px !important;
    font-size: 8.5px !important;
    padding: 3px 6px !important;
}

.lemyox-app .lemyox-sidebar-user-card b,
.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card b {
    background: rgba(255, 122, 26, 0.10) !important;
    border: 1px solid rgba(255, 122, 26, 0.24) !important;
    box-shadow: none !important;
    color: #ff9a3d !important;
    display: inline-flex !important;
    font-size: 8px !important;
    font-weight: 800 !important;
    justify-content: center !important;
    letter-spacing: 0.02em !important;
    line-height: 1 !important;
    min-width: 26px !important;
    padding: 3px 6px 4px !important;
    text-transform: uppercase !important;
}

.lemyox-app .lemyox-sidebar-user-card:hover b {
    background: rgba(255, 122, 26, 0.16) !important;
    border-color: rgba(255, 122, 26, 0.38) !important;
    color: #ffb06a !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-sidebar-user-card b,
.lemyox-app[data-project-theme="light"] .lemyox-sidebar-user-card b {
    background: rgba(255, 122, 26, 0.09) !important;
    border-color: rgba(255, 122, 26, 0.22) !important;
    color: #f26412 !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-nav-item,
.lemyox-app[data-project-theme="light"] .lemyox-nav-item {
    color: #765aa7 !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-nav-item:hover,
.lemyox-app[data-app-theme="light"] .lemyox-nav-item.is-active,
.lemyox-app[data-project-theme="light"] .lemyox-nav-item:hover,
.lemyox-app[data-project-theme="light"] .lemyox-nav-item.is-active {
    background: rgba(255, 122, 26, 0.12) !important;
    color: #ff6b13 !important;
}

/* Keep the theme toggle out of the account button area in the compact rail. */
.lemyox-app[data-current-view="projects"] [data-project-theme-toggle] {
    bottom: auto !important;
    left: auto !important;
    position: static !important;
    z-index: auto !important;
}

.lemyox-app .lemyox-sidebar-user-card,
.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card {
    border-radius: 14px !important;
    min-height: 56px !important;
}

.lemyox-app .lemyox-sidebar-user-card img,
.lemyox-app.is-sidebar-collapsed .lemyox-sidebar-user-card img {
    height: 36px !important;
    width: 36px !important;
}

@media (max-width: 900px) {
    .lemyox-app,
    .lemyox-app:not(.is-sidebar-collapsed),
    .lemyox-app.is-sidebar-collapsed,
    .lemyox-app[data-current-view] {
        grid-template-columns: 65px minmax(0, 1fr) !important;
    }

    .lemyox-app .lemyox-sidebar,
    .lemyox-app[data-current-view] .lemyox-sidebar {
        padding: 10px 5px !important;
        position: sticky !important;
        transform: none !important;
        width: 65px !important;
    }

    .lemyox-app .lemyox-nav-item {
        height: 48px !important;
        min-height: 48px !important;
        width: 53px !important;
    }
}

/* Tools launchpad polish: clearer one-screen action grid and calmer modal workflow. */
.lemyox-app[data-current-view="tools"] .lemyox-main {
    background:
        radial-gradient(circle at 18% 8%, rgba(255, 122, 26, 0.12), transparent 28%),
        radial-gradient(circle at 86% 0%, rgba(155, 93, 229, 0.16), transparent 32%),
        linear-gradient(135deg, #07101b 0%, #091421 48%, #060b14 100%) !important;
    min-height: 100vh;
    overflow: auto;
    padding: 26px 30px 30px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple {
    align-content: start;
    gap: 18px !important;
    margin: 0 auto !important;
    max-width: 1320px !important;
    min-height: calc(100vh - 56px) !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple-hero {
    align-items: center;
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.13), rgba(155, 93, 229, 0.10) 44%, rgba(15, 23, 42, 0.72)),
        rgba(10, 19, 30, 0.86) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 18px !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.22);
    display: grid;
    gap: 10px;
    min-height: 150px;
    overflow: hidden;
    padding: 24px 28px !important;
    position: relative;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple-hero::after {
    background:
        linear-gradient(90deg, rgba(255, 122, 26, 0.95), rgba(155, 93, 229, 0.72)),
        #ff7a1a;
    border-radius: 999px;
    bottom: 0;
    content: "";
    height: 3px;
    left: 28px;
    position: absolute;
    width: 158px;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple-hero span {
    color: #ff9a3d !important;
    font-size: 11px !important;
    letter-spacing: 0.12em !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple-hero h2 {
    color: #f8fafc !important;
    font-size: clamp(27px, 2.4vw, 38px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.035em;
    margin: 0 !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple-hero p {
    color: #a8b5c7 !important;
    font-size: 14px !important;
    line-height: 1.62 !important;
    margin: 0 !important;
    max-width: 790px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tools-simple-grid {
    display: grid !important;
    gap: 16px !important;
    grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-product-tools {
    background: rgba(10, 19, 30, 0.46);
    border: 1px solid rgba(148, 163, 184, 0.12);
    border-radius: 18px;
    display: grid !important;
    gap: 16px !important;
    padding: 18px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-product-tools__head {
    align-items: center;
    display: flex !important;
    justify-content: space-between;
}

.lemyox-app[data-current-view="tools"] .lemyox-product-tools__head span {
    color: #ff9a3d !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase;
}

.lemyox-app[data-current-view="tools"] .lemyox-product-tools__head h3 {
    color: #f8fafc !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-product-tools__grid {
    display: grid !important;
    gap: 16px !important;
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn--product {
    min-height: 176px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn {
    align-content: start !important;
    background:
        radial-gradient(circle at 88% 12%, rgba(255, 122, 26, 0.14), transparent 28%),
        linear-gradient(180deg, rgba(18, 29, 44, 0.94), rgba(9, 17, 28, 0.96)) !important;
    border: 1px solid rgba(148, 163, 184, 0.15) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
    color: #f8fafc !important;
    cursor: pointer;
    display: grid !important;
    gap: 12px !important;
    min-height: 205px !important;
    padding: 22px !important;
    position: relative;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn::before {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.28), rgba(155, 93, 229, 0.20));
    border-radius: 999px;
    content: "";
    height: 70px;
    opacity: 0;
    position: absolute;
    right: -22px;
    top: -24px;
    transition: opacity 0.18s ease, transform 0.18s ease;
    width: 70px;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn::after {
    background: linear-gradient(90deg, #ff7a1a, #9b5de5) !important;
    border-radius: 999px 999px 0 0;
    bottom: 0;
    content: "";
    height: 4px !important;
    left: 18px;
    opacity: 0.55 !important;
    position: absolute;
    right: 18px;
    transition: opacity 0.18s ease, left 0.18s ease, right 0.18s ease;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn:hover,
.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn:focus-visible {
    border-color: rgba(255, 122, 26, 0.58) !important;
    box-shadow: 0 24px 58px rgba(255, 122, 26, 0.13), 0 0 0 1px rgba(155, 93, 229, 0.10) inset !important;
    outline: none !important;
    transform: translateY(-3px) !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn:hover::before,
.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn:focus-visible::before {
    opacity: 1;
    transform: scale(1.06);
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn:hover::after,
.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn:focus-visible::after {
    left: 12px;
    opacity: 1 !important;
    right: 12px;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn > span {
    align-items: center !important;
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.18), rgba(155, 93, 229, 0.13)) !important;
    border: 1px solid rgba(255, 122, 26, 0.24) !important;
    border-radius: 16px !important;
    color: #ff8a2a !important;
    display: inline-flex !important;
    height: 58px !important;
    justify-content: center !important;
    position: relative;
    width: 58px !important;
    z-index: 1;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn svg {
    height: 28px !important;
    width: 28px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn b {
    color: #f8fafc !important;
    display: block;
    font-size: 19px !important;
    font-weight: 900 !important;
    letter-spacing: -0.01em;
    line-height: 1.2 !important;
    position: relative;
    z-index: 1;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn small {
    color: #a8b5c7 !important;
    display: block;
    font-size: 13px !important;
    line-height: 1.55 !important;
    max-width: 92%;
    position: relative;
    z-index: 1;
}

.lemyox-app[data-current-view="tools"] .lemyox-simple-tool-btn em {
    align-self: end !important;
    background: rgba(255, 122, 26, 0.10);
    border: 1px solid rgba(255, 122, 26, 0.20);
    border-radius: 999px;
    color: #ffaf68 !important;
    display: inline-flex;
    font-size: 11px !important;
    font-style: normal;
    font-weight: 850 !important;
    justify-self: start;
    line-height: 1;
    padding: 7px 10px;
    position: relative;
    z-index: 1;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal {
    align-items: center;
    display: flex;
    justify-content: center;
    padding: 28px;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal__backdrop {
    backdrop-filter: blur(14px);
    background: rgba(2, 6, 15, 0.76) !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal__panel {
    background:
        radial-gradient(circle at 12% 0%, rgba(255, 122, 26, 0.11), transparent 28%),
        linear-gradient(180deg, rgba(17, 27, 42, 0.98), rgba(7, 13, 25, 0.99)) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 22px !important;
    box-shadow: 0 34px 100px rgba(0, 0, 0, 0.55);
    inset: auto !important;
    max-height: min(880px, calc(100vh - 56px));
    max-width: 1480px;
    min-height: 560px;
    overflow: hidden !important;
    position: relative !important;
    width: min(1480px, calc(100vw - 56px));
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal__close {
    align-items: center !important;
    background: rgba(15, 23, 42, 0.92) !important;
    border: 1px solid rgba(148, 163, 184, 0.24) !important;
    border-radius: 14px !important;
    color: #dbe5f2 !important;
    display: inline-flex !important;
    font-size: 18px !important;
    height: 42px !important;
    justify-content: center !important;
    line-height: 1 !important;
    right: 16px !important;
    top: 16px !important;
    width: 42px !important;
    z-index: 20 !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal__close:hover {
    background: rgba(255, 122, 26, 0.16) !important;
    border-color: rgba(255, 122, 26, 0.48) !important;
    color: #fff !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal__body {
    height: 100%;
    max-height: min(880px, calc(100vh - 56px));
    overflow: auto !important;
    padding: 22px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool {
    gap: 14px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head {
    background: rgba(7, 13, 25, 0.46) !important;
    border: 1px solid rgba(148, 163, 184, 0.14) !important;
    border-radius: 16px !important;
    margin: 0 54px 16px 0 !important;
    min-height: 78px !important;
    padding: 16px 18px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head h2 {
    color: #f8fafc !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head p {
    color: #9fb0c6 !important;
    font-size: 13px !important;
    margin: 6px 0 0 !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head > span {
    background: rgba(255, 122, 26, 0.10) !important;
    border-color: rgba(255, 122, 26, 0.25) !important;
    color: #ffad5c !important;
    max-width: 300px !important;
    text-align: left !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__layout {
    display: grid !important;
    gap: 14px !important;
    grid-template-columns: minmax(280px, 0.82fr) minmax(300px, 1fr) minmax(300px, 0.92fr) !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-quick-tool__panel {
    background: rgba(10, 18, 30, 0.84) !important;
    border: 1px solid rgba(148, 163, 184, 0.14) !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    padding: 16px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-drop {
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.05), rgba(155, 93, 229, 0.04)),
        rgba(7, 13, 25, 0.50) !important;
    border: 1px dashed rgba(148, 163, 184, 0.30) !important;
    border-radius: 15px !important;
    min-height: 148px !important;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-drop:hover,
.lemyox-app[data-current-view="tools"] .lemyox-tool-drop.is-dragover {
    background: rgba(255, 122, 26, 0.08) !important;
    border-color: rgba(255, 122, 26, 0.62) !important;
    transform: translateY(-1px);
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-option {
    background: rgba(7, 13, 25, 0.48) !important;
    border-color: rgba(148, 163, 184, 0.12) !important;
    border-radius: 13px !important;
    padding: 12px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-option input[type="range"] {
    accent-color: #ff7a1a !important;
    cursor: pointer;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-option input[type="number"],
.lemyox-app[data-current-view="tools"] .lemyox-tool-option input[type="text"],
.lemyox-app[data-current-view="tools"] .lemyox-tool-option select {
    background: rgba(5, 13, 24, 0.82) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    border-radius: 10px !important;
    color: #f8fafc !important;
    min-height: 42px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-actions {
    align-items: center;
    display: flex;
    gap: 10px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-actions .lemyox-gradient-btn,
.lemyox-app[data-current-view="tools"] .lemyox-tool-ready .lemyox-gradient-btn {
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 16px 34px rgba(255, 122, 26, 0.16);
    min-height: 42px !important;
    padding: 0 18px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-actions .lemyox-ghost-btn {
    border-radius: 12px !important;
    min-height: 42px !important;
    padding: 0 16px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-file-list {
    max-height: 520px !important;
    padding-right: 4px;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-file,
.lemyox-app[data-current-view="tools"] .lemyox-tool-output-list li {
    background: rgba(7, 13, 25, 0.44) !important;
    border-color: rgba(148, 163, 184, 0.12) !important;
    border-radius: 13px !important;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-result {
    min-height: 380px;
}

.lemyox-app[data-current-view="tools"] .lemyox-tool-ready {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.13), rgba(155, 93, 229, 0.12)) !important;
    border-color: rgba(255, 122, 26, 0.26) !important;
    border-radius: 16px !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-main,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-main {
    background:
        radial-gradient(circle at 18% 8%, rgba(255, 122, 26, 0.09), transparent 28%),
        radial-gradient(circle at 86% 0%, rgba(155, 93, 229, 0.10), transparent 32%),
        #f7f8fb !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-tools-simple-hero,
.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-simple-tool-btn,
.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-product-tools,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-tools-simple-hero,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-simple-tool-btn,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-product-tools {
    background: #ffffff !important;
    border-color: rgba(15, 23, 42, 0.10) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08) !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-tools-simple-hero h2,
.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-simple-tool-btn b,
.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-product-tools__head h3,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-tools-simple-hero h2,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-simple-tool-btn b,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-product-tools__head h3 {
    color: #101827 !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-tools-simple-hero p,
.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-simple-tool-btn small,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-tools-simple-hero p,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-simple-tool-btn small {
    color: #64748b !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-tool-modal__panel,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-tool-modal__panel {
    background: #ffffff !important;
    border-color: rgba(15, 23, 42, 0.12) !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-quick-tool__panel,
.lemyox-app[data-app-theme="light"][data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-quick-tool__panel,
.lemyox-app[data-project-theme="light"][data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head {
    background: #f8fafc !important;
    border-color: rgba(15, 23, 42, 0.10) !important;
}

@media (max-width: 1180px) {
    .lemyox-app[data-current-view="tools"] .lemyox-tools-simple-grid {
        grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
    }

    .lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__layout {
        grid-template-columns: minmax(260px, 0.85fr) minmax(300px, 1fr) !important;
    }

    .lemyox-app[data-current-view="tools"] .lemyox-tool-result {
        grid-column: 1 / -1;
    }
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="tools"] .lemyox-main {
        padding: 18px 14px !important;
    }

    .lemyox-app[data-current-view="tools"] .lemyox-tools-simple-grid,
    .lemyox-app[data-current-view="tools"] .lemyox-product-tools__grid,
    .lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__layout {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="tools"] .lemyox-tool-modal {
        padding: 12px;
    }

    .lemyox-app[data-current-view="tools"] .lemyox-tool-modal__panel {
        min-height: auto;
        width: calc(100vw - 24px);
    }

    .lemyox-app[data-current-view="tools"] .lemyox-tool-modal .lemyox-quick-tool__head {
        margin-right: 48px !important;
    }
}

/* Presets page polish. */
.lemyox-app[data-current-view="presets"] {
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.10), transparent 30%),
        radial-gradient(circle at 84% 0%, rgba(155, 93, 229, 0.13), transparent 34%),
        #070d19 !important;
    color: #f8fafc;
}

.lemyox-app[data-current-view="presets"] .lemyox-topbar,
.lemyox-app[data-current-view="presets"] .lemyox-stepper {
    display: none !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-main {
    background: transparent !important;
    min-height: 100vh;
    overflow: auto;
    padding: 28px 32px 34px !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-route[data-route="presets"] {
    display: grid;
    gap: 18px;
    margin: 0 auto;
    max-width: 1320px;
}

.lemyox-app[data-current-view="presets"] .lemyox-section-head {
    align-items: center !important;
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.13), rgba(155, 93, 229, 0.10) 44%, rgba(15, 23, 42, 0.74)),
        rgba(10, 19, 30, 0.88);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 18px;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.20);
    display: flex !important;
    justify-content: space-between !important;
    margin: 0 !important;
    min-height: 138px;
    overflow: hidden;
    padding: 24px 28px !important;
    position: relative;
}

.lemyox-app[data-current-view="presets"] .lemyox-section-head::before {
    background: linear-gradient(90deg, #ff7a1a, #9b5de5);
    border-radius: 999px;
    bottom: 0;
    content: "";
    height: 3px;
    left: 28px;
    position: absolute;
    width: 150px;
}

.lemyox-app[data-current-view="presets"] .lemyox-section-head::after {
    align-items: center;
    background: rgba(255, 122, 26, 0.10);
    border: 1px solid rgba(255, 122, 26, 0.22);
    border-radius: 999px;
    color: #ffad5c;
    content: "Size · Viền · Layout · Export";
    display: inline-flex;
    font-size: 12px;
    font-weight: 850;
    padding: 8px 12px;
}

.lemyox-app[data-current-view="presets"] .lemyox-section-head h2 {
    color: #f8fafc !important;
    font-size: clamp(28px, 2.4vw, 38px) !important;
    font-weight: 900;
    letter-spacing: -0.035em;
    line-height: 1.1;
    margin: 0 0 8px !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-section-head p {
    color: #a8b5c7 !important;
    font-size: 14px !important;
    line-height: 1.55;
    margin: 0 !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-form {
    background:
        radial-gradient(circle at 100% 0%, rgba(255, 122, 26, 0.12), transparent 30%),
        linear-gradient(180deg, rgba(17, 27, 42, 0.94), rgba(9, 17, 28, 0.96)) !important;
    border: 1px solid rgba(148, 163, 184, 0.15) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.18) !important;
    display: grid;
    gap: 16px;
    margin: 0 !important;
    padding: 22px !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-form h3 {
    align-items: center;
    color: #f8fafc !important;
    display: flex;
    font-size: 18px !important;
    font-weight: 900;
    gap: 10px;
    margin: 0 !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-form h3::before {
    background: linear-gradient(135deg, rgba(255, 122, 26, 0.20), rgba(155, 93, 229, 0.14));
    border: 1px solid rgba(255, 122, 26, 0.24);
    border-radius: 13px;
    color: #ff8a2a;
    content: "+";
    display: inline-grid;
    font-size: 22px;
    height: 42px;
    place-items: center;
    width: 42px;
}

.lemyox-app[data-current-view="presets"] .lemyox-inline-form {
    align-items: stretch !important;
    display: grid !important;
    gap: 12px !important;
    grid-template-columns: minmax(240px, 1fr) minmax(180px, 260px) auto !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-inline-form input,
.lemyox-app[data-current-view="presets"] .lemyox-inline-form select {
    background: rgba(5, 13, 24, 0.76) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 13px !important;
    color: #f8fafc !important;
    min-height: 48px !important;
    padding: 0 15px !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-inline-form input:focus,
.lemyox-app[data-current-view="presets"] .lemyox-inline-form select:focus {
    border-color: rgba(255, 122, 26, 0.58) !important;
    box-shadow: 0 0 0 4px rgba(255, 122, 26, 0.10) !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-inline-form .lemyox-gradient-btn {
    border: 0 !important;
    border-radius: 13px !important;
    box-shadow: 0 16px 34px rgba(255, 122, 26, 0.16);
    min-height: 48px !important;
    padding: 0 22px !important;
    white-space: nowrap;
    width: auto !important;
}

.lemyox-app[data-current-view="presets"] [data-lemyox-presets-grid] {
    display: grid !important;
    gap: 16px !important;
    grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card {
    background:
        radial-gradient(circle at 92% 10%, rgba(155, 93, 229, 0.14), transparent 28%),
        linear-gradient(180deg, rgba(17, 27, 42, 0.94), rgba(9, 17, 28, 0.96)) !important;
    border: 1px solid rgba(148, 163, 184, 0.15) !important;
    border-radius: 18px !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16) !important;
    display: grid;
    gap: 10px;
    min-height: 174px;
    overflow: hidden;
    padding: 20px !important;
    position: relative;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card::after {
    background: linear-gradient(90deg, #ff7a1a, #9b5de5);
    border-radius: 999px 999px 0 0;
    bottom: 0;
    content: "";
    height: 4px;
    left: 16px;
    opacity: 0.58;
    position: absolute;
    right: 16px;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card span {
    align-items: center;
    background: rgba(255, 122, 26, 0.10);
    border: 1px solid rgba(255, 122, 26, 0.22);
    border-radius: 999px;
    color: #ffad5c !important;
    display: inline-flex;
    font-size: 11px !important;
    font-weight: 850;
    justify-self: start;
    line-height: 1;
    padding: 7px 10px;
    text-transform: uppercase;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card h3 {
    color: #f8fafc !important;
    font-size: 18px !important;
    font-weight: 900;
    line-height: 1.25;
    margin: 4px 0 0 !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card p {
    color: #9fb0c6 !important;
    font-size: 13px;
    margin: 0 !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card .lemyox-danger-btn,
.lemyox-app[data-current-view="presets"] .lemyox-preset-card button {
    align-self: end;
    background: rgba(248, 113, 113, 0.10) !important;
    border: 1px solid rgba(248, 113, 113, 0.25) !important;
    border-radius: 12px !important;
    color: #ff9a9a !important;
    cursor: pointer;
    font-weight: 850;
    justify-self: start;
    min-height: 38px;
    padding: 0 14px !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-preset-card button:hover {
    background: rgba(248, 113, 113, 0.18) !important;
    color: #fff !important;
}

.lemyox-app[data-current-view="presets"] .lemyox-empty {
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.08), rgba(155, 93, 229, 0.06)),
        rgba(10, 18, 30, 0.78) !important;
    border: 1px dashed rgba(148, 163, 184, 0.28) !important;
    border-radius: 18px !important;
    grid-column: 1 / -1;
    min-height: 220px;
    padding: 44px 24px !important;
    text-align: center;
}

.lemyox-app[data-current-view="presets"] .lemyox-empty strong {
    color: #f8fafc !important;
    display: block;
    font-size: 20px;
    margin-bottom: 8px;
}

.lemyox-app[data-current-view="presets"] .lemyox-empty p {
    color: #9fb0c6 !important;
    margin: 0 auto;
    max-width: 520px;
}

.lemyox-app[data-current-view="presets"] .lemyox-locked-feature {
    background:
        radial-gradient(circle at 92% 4%, rgba(255, 122, 26, 0.18), transparent 30%),
        linear-gradient(180deg, rgba(17, 27, 42, 0.94), rgba(9, 17, 28, 0.96)) !important;
    border: 1px solid rgba(255, 122, 26, 0.24) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(255, 122, 26, 0.10) !important;
    margin: 0 auto;
    max-width: 760px;
    padding: 30px !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="presets"],
.lemyox-app[data-project-theme="light"][data-current-view="presets"] {
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.08), transparent 30%),
        radial-gradient(circle at 84% 0%, rgba(155, 93, 229, 0.09), transparent 34%),
        #f7f8fb !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-section-head,
.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-preset-form,
.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-preset-card,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-section-head,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-preset-form,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-preset-card {
    background: #ffffff !important;
    border-color: rgba(15, 23, 42, 0.10) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.07) !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-section-head h2,
.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-preset-form h3,
.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-preset-card h3,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-section-head h2,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-preset-form h3,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-preset-card h3 {
    color: #101827 !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-section-head p,
.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-preset-card p,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-section-head p,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-preset-card p {
    color: #64748b !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-inline-form input,
.lemyox-app[data-app-theme="light"][data-current-view="presets"] .lemyox-inline-form select,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-inline-form input,
.lemyox-app[data-project-theme="light"][data-current-view="presets"] .lemyox-inline-form select {
    background: #f8fafc !important;
    color: #101827 !important;
}

@media (max-width: 1080px) {
    .lemyox-app[data-current-view="presets"] [data-lemyox-presets-grid] {
        grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
    }
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="presets"] .lemyox-main {
        padding: 18px 14px !important;
    }

    .lemyox-app[data-current-view="presets"] .lemyox-section-head {
        align-items: flex-start !important;
        flex-direction: column;
    }

    .lemyox-app[data-current-view="presets"] .lemyox-section-head::after {
        margin-top: 8px;
    }

    .lemyox-app[data-current-view="presets"] .lemyox-inline-form,
    .lemyox-app[data-current-view="presets"] [data-lemyox-presets-grid] {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="presets"] .lemyox-inline-form .lemyox-gradient-btn {
        justify-content: center;
        width: 100% !important;
    }
}

/* Projects page typography and visual polish. */
.lemyox-app[data-current-view="projects"] .lemyox-main {
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.075), transparent 28%),
        radial-gradient(circle at 78% 0%, rgba(155, 93, 229, 0.085), transparent 32%),
        var(--project-bg, #0b1118) !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-page {
    padding: 30px 34px 28px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-header {
    align-items: center !important;
    margin-bottom: 24px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-heading h2 {
    color: var(--project-text) !important;
    font-size: clamp(29px, 2.25vw, 38px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.035em;
    line-height: 1.08 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-heading h2::after {
    background: linear-gradient(90deg, var(--project-orange, #ff7300), rgba(155, 93, 229, 0.75));
    border-radius: 999px;
    content: "";
    display: block;
    height: 3px;
    margin-top: 10px;
    width: 72px;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-heading p {
    color: color-mix(in srgb, var(--project-muted) 84%, #ffffff 16%) !important;
    font-size: 14px !important;
    line-height: 1.55;
    margin-top: 8px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-search {
    background: rgba(12, 20, 31, 0.76) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    border-radius: 12px !important;
    min-height: 48px !important;
    min-width: 360px !important;
    padding-inline: 14px !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
    width: 360px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-search:focus-within {
    background: rgba(12, 20, 31, 0.94) !important;
    border-color: rgba(255, 122, 26, 0.58) !important;
    box-shadow: 0 0 0 4px rgba(255, 122, 26, 0.10);
}

.lemyox-app[data-current-view="projects"] .lemyox-project-search input {
    color: var(--project-text) !important;
    font-size: 14px !important;
    font-weight: 650;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-icon-button {
    height: 46px !important;
    width: 46px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-form button {
    border-radius: 12px !important;
    box-shadow: 0 16px 34px rgba(255, 115, 0, 0.22);
    font-size: 14px !important;
    font-weight: 850 !important;
    min-height: 48px !important;
    min-width: 166px !important;
    padding: 0 22px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats {
    gap: 16px !important;
    margin-bottom: 26px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats article {
    background:
        radial-gradient(circle at 96% 0%, rgba(255, 122, 26, 0.07), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--project-panel) 92%, #ffffff 8%), var(--project-panel)) !important;
    border-color: color-mix(in srgb, var(--project-border) 84%, #ffffff 16%) !important;
    border-radius: 14px !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.16);
    gap: 14px !important;
    min-height: 104px !important;
    padding: 17px 18px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stat-icon {
    border-radius: 12px !important;
    flex-basis: 46px !important;
    font-size: 22px !important;
    height: 46px !important;
    width: 46px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats small,
.lemyox-app[data-current-view="projects"] .lemyox-project-stats i,
.lemyox-app[data-current-view="projects"] .lemyox-project-stats em {
    font-size: 12px !important;
    line-height: 1.3;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stats strong {
    color: var(--project-text) !important;
    font-size: 26px !important;
    font-weight: 900 !important;
    letter-spacing: -0.025em;
    line-height: 1.05 !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-stat-progress {
    border-radius: 999px !important;
    height: 5px !important;
    margin-top: 8px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-controls {
    margin-bottom: 18px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tabs,
.lemyox-app[data-current-view="projects"] .lemyox-project-view-switch,
.lemyox-app[data-current-view="projects"] .lemyox-project-control-actions select,
.lemyox-app[data-current-view="projects"] .lemyox-project-filter-button {
    border-color: rgba(148, 163, 184, 0.18) !important;
    border-radius: 12px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tabs button,
.lemyox-app[data-current-view="projects"] .lemyox-project-control-actions select,
.lemyox-app[data-current-view="projects"] .lemyox-project-filter-button {
    font-size: 14px !important;
    font-weight: 750 !important;
    min-height: 46px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tabs button {
    padding: 0 22px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tabs button.is-active {
    background: rgba(255, 122, 26, 0.10) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 122, 26, 0.18);
    color: var(--project-orange) !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-view-switch button {
    height: 46px !important;
    width: 48px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-view-switch svg,
.lemyox-app[data-current-view="projects"] .lemyox-project-filter-button svg {
    height: 18px !important;
    width: 18px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-projects-grid {
    gap: 18px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--project-panel) 95%, #ffffff 5%), var(--project-panel)) !important;
    border-color: color-mix(in srgb, var(--project-border) 86%, #ffffff 14%) !important;
    border-radius: 14px !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.14);
    overflow: hidden;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile:hover {
    border-color: rgba(255, 122, 26, 0.42) !important;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.20), 0 0 0 1px rgba(255, 122, 26, 0.08) inset;
    transform: translateY(-2px);
}

.lemyox-app[data-current-view="projects"] .lemyox-project-cover {
    aspect-ratio: 2.05 / 1 !important;
    border-radius: 14px 14px 0 0 !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-cover img {
    transition: transform 0.28s ease, filter 0.28s ease;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile:hover .lemyox-project-cover img {
    filter: saturate(1.06) contrast(1.03);
    transform: scale(1.025);
}

.lemyox-app[data-current-view="projects"] .lemyox-project-cover b {
    backdrop-filter: blur(8px);
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    left: 12px !important;
    letter-spacing: 0.01em;
    padding: 7px 9px !important;
    top: 12px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-cover-placeholder {
    color: #b8c6dc !important;
    font-size: 22px !important;
    letter-spacing: -0.02em;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile-body {
    display: grid;
    gap: 8px;
    min-height: 116px !important;
    padding: 13px 14px 15px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile h3 {
    font-size: 16px !important;
    font-weight: 900 !important;
    letter-spacing: -0.015em;
    line-height: 1.25 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-tile h3 a {
    color: var(--project-text) !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-meta,
.lemyox-app[data-current-view="projects"] .lemyox-project-updated {
    color: color-mix(in srgb, var(--project-muted) 82%, #ffffff 18%) !important;
    font-size: 12px !important;
    gap: 12px !important;
    line-height: 1.35;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-updated button {
    color: color-mix(in srgb, var(--project-muted) 72%, #ffffff 28%) !important;
    font-size: 22px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-menu {
    border-radius: 12px !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.30) !important;
    padding: 8px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-upgrade {
    border-radius: 14px !important;
    font-size: 13px !important;
    margin-top: 24px !important;
    padding: 16px 22px !important;
}

@media (min-width: 901px) {
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile h3 {
        font-size: 15px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-owner,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-type,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-modified,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-actions {
        font-size: 13px !important;
    }
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-search,
.lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-search {
    background: #ffffff !important;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-stats article,
.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-tile,
.lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-stats article,
.lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-tile {
    background: #ffffff !important;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08) !important;
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="projects"] .lemyox-projects-page {
        padding: 20px 14px 24px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-search {
        min-width: 0 !important;
        width: 100% !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-heading h2 {
        font-size: 27px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-stats strong {
        font-size: 23px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-tile h3 {
        font-size: 15px !important;
    }
}

/* Library page typography and visual polish. */
.lemyox-app[data-current-view="library"] .lemyox-main {
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.075), transparent 30%),
        radial-gradient(circle at 82% 0%, rgba(155, 93, 229, 0.10), transparent 34%),
        var(--library-bg, #0b1118) !important;
    min-height: 100vh;
    overflow: auto;
    padding: 30px 34px 28px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-page {
    display: grid;
    gap: 18px !important;
    margin: 0 auto;
    max-width: 1500px;
}

.lemyox-app[data-current-view="library"] .lemyox-library-header {
    align-items: center !important;
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.12), rgba(155, 93, 229, 0.09) 46%, rgba(15, 23, 42, 0.72)),
        rgba(10, 19, 30, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.16);
    border-radius: 18px;
    box-shadow: 0 22px 58px rgba(0, 0, 0, 0.20);
    margin: 0 !important;
    min-height: 140px;
    overflow: hidden;
    padding: 24px 28px !important;
    position: relative;
}

.lemyox-app[data-current-view="library"] .lemyox-library-header::after {
    background: linear-gradient(90deg, var(--library-orange, #ff7300), rgba(155, 93, 229, 0.75));
    border-radius: 999px;
    bottom: 0;
    content: "";
    height: 3px;
    left: 28px;
    position: absolute;
    width: 150px;
}

.lemyox-app[data-current-view="library"] .lemyox-library-header h2 {
    color: var(--library-text) !important;
    font-size: clamp(30px, 2.4vw, 40px) !important;
    font-weight: 900 !important;
    letter-spacing: -0.04em;
    line-height: 1.08 !important;
    margin: 0 0 10px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-header p {
    color: color-mix(in srgb, var(--library-muted) 82%, #ffffff 18%) !important;
    font-size: 14px !important;
    line-height: 1.6;
    margin: 0 !important;
    max-width: 780px;
}

.lemyox-app[data-current-view="library"] .lemyox-library-upload {
    align-items: center !important;
    border: 0 !important;
    border-radius: 13px !important;
    box-shadow: 0 18px 38px rgba(255, 115, 0, 0.22);
    display: inline-flex !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    gap: 9px;
    min-height: 48px !important;
    padding: 0 22px !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.lemyox-app[data-current-view="library"] .lemyox-library-upload:hover {
    box-shadow: 0 22px 48px rgba(255, 115, 0, 0.30);
    transform: translateY(-1px);
}

.lemyox-app[data-current-view="library"] .lemyox-library-toolbar,
.lemyox-app[data-current-view="library"] .lemyox-library-selectionbar,
.lemyox-app[data-current-view="library"] .lemyox-library-pagination {
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--library-panel) 94%, #ffffff 6%), var(--library-panel)) !important;
    border: 1px solid color-mix(in srgb, var(--library-border) 86%, #ffffff 14%) !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.14);
}

.lemyox-app[data-current-view="library"] .lemyox-library-toolbar {
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 14px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-search {
    background: rgba(7, 13, 25, 0.52) !important;
    border-color: rgba(148, 163, 184, 0.18) !important;
    border-radius: 13px !important;
    min-height: 48px !important;
    min-width: min(430px, 42vw) !important;
    padding: 0 14px !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.lemyox-app[data-current-view="library"] .lemyox-library-search:focus-within {
    background: rgba(7, 13, 25, 0.78) !important;
    border-color: rgba(255, 122, 26, 0.55) !important;
    box-shadow: 0 0 0 4px rgba(255, 122, 26, 0.10);
}

.lemyox-app[data-current-view="library"] .lemyox-library-search input {
    color: var(--library-text) !important;
    font-size: 14px !important;
    font-weight: 650;
}

.lemyox-app[data-current-view="library"] .lemyox-library-filters {
    gap: 12px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-filters select,
.lemyox-app[data-current-view="library"] .lemyox-library-filter-btn,
.lemyox-app[data-current-view="library"] .lemyox-library-sort,
.lemyox-app[data-current-view="library"] .lemyox-library-viewbar button,
.lemyox-app[data-current-view="library"] .lemyox-library-selectionbar .lemyox-ghost-btn,
.lemyox-app[data-current-view="library"] .lemyox-library-selectionbar .lemyox-gradient-btn {
    border-color: rgba(148, 163, 184, 0.18) !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    font-weight: 750 !important;
    min-height: 46px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-filters select,
.lemyox-app[data-current-view="library"] .lemyox-library-sort {
    background: rgba(7, 13, 25, 0.48) !important;
    min-width: 190px !important;
    padding-inline: 14px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-filter-btn {
    background: rgba(7, 13, 25, 0.48) !important;
    padding: 0 18px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-selectionbar {
    align-items: center !important;
    gap: 12px !important;
    padding: 14px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-selectionbar strong {
    color: var(--library-text) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    white-space: nowrap;
}

.lemyox-app[data-current-view="library"] .lemyox-library-selectionbar [data-library-project-title] {
    background: rgba(7, 13, 25, 0.48) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 12px !important;
    color: var(--library-text) !important;
    min-height: 46px !important;
    padding: 0 14px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-viewbar {
    background: rgba(7, 13, 25, 0.44) !important;
    border: 1px solid rgba(148, 163, 184, 0.16) !important;
    border-radius: 13px !important;
    padding: 4px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-viewbar button {
    border: 0 !important;
    height: 40px !important;
    min-height: 40px !important;
    width: 42px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-viewbar button.is-active {
    background: rgba(255, 122, 26, 0.14) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 122, 26, 0.20);
    color: var(--library-orange) !important;
}

.lemyox-app[data-current-view="library"] .lemyox-toolbar-count {
    color: color-mix(in srgb, var(--library-muted) 76%, #ffffff 24%) !important;
    font-size: 13px !important;
    font-weight: 850;
}

.lemyox-app[data-current-view="library"] .lemyox-library-grid {
    gap: 18px !important;
    grid-template-columns: repeat(4, minmax(220px, 1fr)) !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card {
    background:
        radial-gradient(circle at 92% 8%, rgba(255, 122, 26, 0.08), transparent 30%),
        linear-gradient(180deg, color-mix(in srgb, var(--library-panel) 94%, #ffffff 6%), var(--library-panel)) !important;
    border-color: color-mix(in srgb, var(--library-border) 86%, #ffffff 14%) !important;
    border-radius: 16px !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, 0.14);
    overflow: hidden;
    padding: 0 !important;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card:hover {
    border-color: rgba(255, 122, 26, 0.42) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.22), 0 0 0 1px rgba(255, 122, 26, 0.08) inset;
    transform: translateY(-2px);
}

.lemyox-app[data-current-view="library"] .lemyox-image-card.is-selected {
    border-color: rgba(255, 122, 26, 0.72) !important;
    box-shadow: 0 22px 56px rgba(255, 122, 26, 0.12), 0 0 0 2px rgba(255, 122, 26, 0.18) inset !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-thumb {
    aspect-ratio: 1.38 / 1 !important;
    background: rgba(7, 13, 25, 0.54) !important;
    border-radius: 16px 16px 0 0 !important;
    overflow: hidden !important;
    position: relative;
}

.lemyox-app[data-current-view="library"] .lemyox-image-thumb img,
.lemyox-app[data-current-view="library"] .lemyox-image-card > img {
    aspect-ratio: 1.38 / 1 !important;
    border: 0 !important;
    border-radius: 0 !important;
    display: block;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.28s ease, filter 0.28s ease;
    width: 100% !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card:hover .lemyox-image-thumb img {
    filter: saturate(1.06) contrast(1.03);
    transform: scale(1.025);
}

.lemyox-app[data-current-view="library"] .lemyox-select-check {
    left: 12px !important;
    top: 12px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-select-check input {
    background: rgba(255, 255, 255, 0.88) !important;
    border: 1px solid rgba(15, 23, 42, 0.24) !important;
    border-radius: 7px !important;
    height: 24px !important;
    width: 24px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-select-check input:checked {
    background: var(--library-orange) !important;
    border-color: var(--library-orange) !important;
    box-shadow: 0 8px 20px rgba(255, 122, 26, 0.30);
}

.lemyox-app[data-current-view="library"] .lemyox-select-check span {
    display: none !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card h3,
.lemyox-app[data-current-view="library"] .lemyox-image-card p,
.lemyox-app[data-current-view="library"] .lemyox-image-card > span,
.lemyox-app[data-current-view="library"] .lemyox-image-card .lemyox-card-actions {
    margin-left: 14px !important;
    margin-right: 14px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card h3 {
    color: var(--library-text) !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    letter-spacing: -0.015em;
    line-height: 1.25 !important;
    margin-top: 13px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card .lemyox-image-meta,
.lemyox-app[data-current-view="library"] .lemyox-image-card > .lemyox-image-project,
.lemyox-app[data-current-view="library"] .lemyox-image-date {
    color: color-mix(in srgb, var(--library-muted) 82%, #ffffff 18%) !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

.lemyox-app[data-current-view="library"] .lemyox-image-card > .lemyox-image-project {
    font-weight: 800;
}

.lemyox-app[data-current-view="library"] .lemyox-card-actions {
    align-items: center !important;
    display: flex !important;
    gap: 8px !important;
    justify-content: flex-end !important;
    margin-bottom: 13px !important;
    margin-top: 10px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-card-actions .lemyox-ghost-btn,
.lemyox-app[data-current-view="library"] .lemyox-card-actions .lemyox-danger-btn {
    display: none !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-more {
    background: rgba(7, 13, 25, 0.44) !important;
    border: 1px solid rgba(148, 163, 184, 0.15) !important;
    border-radius: 11px !important;
    color: var(--library-text) !important;
    height: 36px !important;
    width: 42px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-more:hover {
    background: rgba(255, 122, 26, 0.14) !important;
    border-color: rgba(255, 122, 26, 0.35) !important;
    color: var(--library-orange) !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-menu {
    border-radius: 13px !important;
    box-shadow: 0 22px 54px rgba(0, 0, 0, 0.32) !important;
    min-width: 168px !important;
    padding: 8px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-menu a,
.lemyox-app[data-current-view="library"] .lemyox-library-menu button {
    border-radius: 9px !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    min-height: 36px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination {
    align-items: center !important;
    margin: 0 !important;
    padding: 14px 16px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination > span {
    color: color-mix(in srgb, var(--library-muted) 82%, #ffffff 18%) !important;
    font-size: 13px !important;
    font-weight: 850;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination button {
    border-radius: 11px !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    height: 40px !important;
    min-width: 40px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination button.is-active {
    background: rgba(255, 122, 26, 0.14) !important;
    box-shadow: inset 0 0 0 1px rgba(255, 122, 26, 0.20);
}

@media (min-width: 901px) {
    .lemyox-app[data-current-view="library"] .lemyox-library-list-head.is-visible {
        background: rgba(7, 13, 25, 0.34);
        border: 1px solid var(--library-border) !important;
        border-radius: 14px !important;
        font-size: 13px !important;
        margin-bottom: -6px;
        padding: 12px 14px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card {
        border-radius: 14px !important;
        margin-bottom: 10px;
        min-height: 86px !important;
        padding: 10px 14px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-thumb {
        border-radius: 12px !important;
        height: 66px !important;
        width: 66px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card h3 {
        font-size: 14px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-date,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project {
        font-size: 13px !important;
    }
}

.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-main,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-main {
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.07), transparent 30%),
        radial-gradient(circle at 82% 0%, rgba(155, 93, 229, 0.08), transparent 34%),
        #f7f8fb !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-header,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-toolbar,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-selectionbar,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-pagination,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-image-card,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-header,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-toolbar,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-selectionbar,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-pagination,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-image-card {
    background: #ffffff !important;
    border-color: rgba(15, 23, 42, 0.10) !important;
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.08) !important;
}

.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-search,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-filters select,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-filter-btn,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-sort,
.lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-selectionbar [data-library-project-title],
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-search,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-filters select,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-filter-btn,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-sort,
.lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-selectionbar [data-library-project-title] {
    background: #f8fafc !important;
    color: #101827 !important;
}

@media (max-width: 1280px) {
    .lemyox-app[data-current-view="library"] .lemyox-library-grid {
        grid-template-columns: repeat(3, minmax(220px, 1fr)) !important;
    }
}

@media (max-width: 980px) {
    .lemyox-app[data-current-view="library"] .lemyox-library-grid {
        grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-toolbar,
    .lemyox-app[data-current-view="library"] .lemyox-library-selectionbar {
        align-items: stretch !important;
        flex-wrap: wrap !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-search {
        min-width: 100% !important;
        width: 100% !important;
    }
}

@media (max-width: 700px) {
    .lemyox-app[data-current-view="library"] .lemyox-main {
        padding: 18px 14px 24px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-header {
        align-items: flex-start !important;
        flex-direction: column;
        padding: 22px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-header h2 {
        font-size: 28px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-filters,
    .lemyox-app[data-current-view="library"] .lemyox-library-filters select,
    .lemyox-app[data-current-view="library"] .lemyox-library-filter-btn,
    .lemyox-app[data-current-view="library"] .lemyox-library-sort,
    .lemyox-app[data-current-view="library"] .lemyox-library-selectionbar [data-library-project-title] {
        width: 100% !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-pagination {
        align-items: flex-start !important;
        flex-direction: column;
        gap: 12px !important;
    }
}

/* Projects notification popover. */
.lemyox-app[data-current-view="projects"] .lemyox-project-notify {
    position: relative;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-toggle {
    background: rgba(12, 20, 31, 0.74) !important;
    border: 1px solid rgba(148, 163, 184, 0.18) !important;
    border-radius: 14px !important;
    color: color-mix(in srgb, var(--project-muted) 74%, #ffffff 26%) !important;
    height: 48px !important;
    position: relative;
    transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease, transform 0.18s ease;
    width: 48px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-toggle svg {
    height: 20px !important;
    stroke-width: 1.9;
    width: 20px !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-toggle:hover,
.lemyox-app[data-current-view="projects"] .lemyox-project-notify-toggle.is-active {
    background: rgba(255, 122, 26, 0.13) !important;
    border-color: rgba(255, 122, 26, 0.42) !important;
    box-shadow: 0 16px 34px rgba(255, 122, 26, 0.12);
    color: var(--project-orange) !important;
    transform: translateY(-1px);
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-toggle b {
    align-items: center;
    background: linear-gradient(135deg, #ff7a1a, #ff4d1a) !important;
    border: 2px solid var(--project-bg, #0b1118);
    border-radius: 999px;
    box-shadow: 0 8px 18px rgba(255, 122, 26, 0.34);
    color: #fff !important;
    display: inline-flex;
    font-size: 10px !important;
    font-weight: 900;
    height: 19px;
    justify-content: center;
    line-height: 1;
    min-width: 19px;
    padding: 0 5px;
    position: absolute;
    right: -6px;
    top: -7px;
    width: auto !important;
}

.lemyox-project-notify-panel[hidden] {
    display: none !important;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel {
    background:
        radial-gradient(circle at 100% 0%, rgba(255, 122, 26, 0.12), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--project-panel) 95%, #ffffff 5%), var(--project-panel)) !important;
    border: 1px solid color-mix(in srgb, var(--project-border) 82%, #ffffff 18%);
    border-radius: 18px;
    box-shadow: 0 28px 72px rgba(0, 0, 0, 0.36);
    color: var(--project-text);
    overflow: hidden;
    position: absolute;
    right: 0;
    top: calc(100% + 12px);
    width: min(380px, calc(100vw - 32px));
    z-index: 10020;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel::before {
    background: inherit;
    border-left: 1px solid color-mix(in srgb, var(--project-border) 82%, #ffffff 18%);
    border-top: 1px solid color-mix(in srgb, var(--project-border) 82%, #ffffff 18%);
    content: "";
    height: 12px;
    position: absolute;
    right: 18px;
    top: -7px;
    transform: rotate(45deg);
    width: 12px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel header {
    align-items: center;
    border-bottom: 1px solid rgba(148, 163, 184, 0.13);
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 16px 16px 14px;
    position: relative;
    z-index: 1;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel header strong {
    color: var(--project-text);
    display: block;
    font-size: 16px;
    font-weight: 900;
    letter-spacing: -0.015em;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel header span {
    color: color-mix(in srgb, var(--project-muted) 82%, #ffffff 18%);
    display: block;
    font-size: 12px;
    margin-top: 2px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel header a {
    background: rgba(255, 122, 26, 0.10);
    border: 1px solid rgba(255, 122, 26, 0.22);
    border-radius: 999px;
    color: var(--project-orange);
    font-size: 12px;
    font-weight: 850;
    padding: 7px 10px;
    text-decoration: none;
    white-space: nowrap;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list {
    display: grid;
    gap: 0;
    max-height: 360px;
    overflow: auto;
    padding: 6px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article {
    align-items: center;
    border-radius: 13px;
    display: grid;
    gap: 12px;
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 11px 10px;
    transition: background 0.18s ease;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article:hover {
    background: rgba(255, 255, 255, 0.04);
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article > span {
    align-items: center;
    background: rgba(255, 122, 26, 0.12);
    border: 1px solid rgba(255, 122, 26, 0.24);
    border-radius: 12px;
    color: #ff9a3d;
    display: inline-flex;
    font-size: 13px;
    font-weight: 900;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article strong {
    color: var(--project-text);
    display: block;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article p {
    color: color-mix(in srgb, var(--project-muted) 78%, #ffffff 22%);
    font-size: 12px;
    line-height: 1.35;
    margin: 3px 0 0;
}

.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article.is-empty strong,
.lemyox-app[data-current-view="projects"] .lemyox-project-notify-list article.is-empty p {
    white-space: normal;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-notify-toggle,
.lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-notify-toggle {
    background: #ffffff !important;
    color: #64748b !important;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-notify-panel,
.lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-notify-panel {
    background: #ffffff !important;
    border-color: rgba(15, 23, 42, 0.10) !important;
    box-shadow: 0 26px 70px rgba(15, 23, 42, 0.16) !important;
}

.lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-notify-list article:hover,
.lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-notify-list article:hover {
    background: #f8fafc;
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="projects"] .lemyox-project-notify-panel {
        right: -90px;
        width: min(340px, calc(100vw - 28px));
    }
}

/* Light theme contrast polish. */
.lemyox-app[data-app-theme="light"],
.lemyox-app[data-project-theme="light"] {
    --light-bg: #f5f7fb;
    --light-panel: #ffffff;
    --light-panel-soft: #f8fafc;
    --light-border: #d8dee8;
    --light-border-strong: #cbd5e1;
    --light-text: #07111f;
    --light-body: #1f2937;
    --light-muted: #475569;
    --light-soft: #64748b;
    --light-orange: #ff6b00;
    --light-orange-strong: #ea580c;
    --light-purple: #9b5de5;
    color: var(--light-text) !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-main,
.lemyox-app[data-project-theme="light"] .lemyox-main {
    background:
        radial-gradient(circle at 76% 0%, rgba(155, 93, 229, 0.10), transparent 34%),
        radial-gradient(circle at 18% 0%, rgba(255, 107, 0, 0.10), transparent 30%),
        var(--light-bg) !important;
    color: var(--light-text) !important;
}

.lemyox-app[data-app-theme="light"] h1,
.lemyox-app[data-app-theme="light"] h2,
.lemyox-app[data-app-theme="light"] h3,
.lemyox-app[data-app-theme="light"] h4,
.lemyox-app[data-project-theme="light"] h1,
.lemyox-app[data-project-theme="light"] h2,
.lemyox-app[data-project-theme="light"] h3,
.lemyox-app[data-project-theme="light"] h4 {
    color: var(--light-text) !important;
    text-shadow: none !important;
}

.lemyox-app[data-app-theme="light"] input,
.lemyox-app[data-app-theme="light"] select,
.lemyox-app[data-app-theme="light"] textarea,
.lemyox-app[data-project-theme="light"] input,
.lemyox-app[data-project-theme="light"] select,
.lemyox-app[data-project-theme="light"] textarea {
    background: #ffffff !important;
    border-color: var(--light-border) !important;
    color: var(--light-text) !important;
}

.lemyox-app[data-app-theme="light"] input::placeholder,
.lemyox-app[data-app-theme="light"] textarea::placeholder,
.lemyox-app[data-project-theme="light"] input::placeholder,
.lemyox-app[data-project-theme="light"] textarea::placeholder {
    color: #64748b !important;
    opacity: 1 !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-gradient-btn,
.lemyox-app[data-project-theme="light"] .lemyox-gradient-btn {
    background: linear-gradient(135deg, #ff7a1a 0%, #f25f0b 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 14px 28px rgba(249, 115, 22, 0.20) !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-ghost-btn,
.lemyox-app[data-project-theme="light"] .lemyox-ghost-btn {
    background: #ffffff !important;
    border: 1px solid var(--light-border) !important;
    color: var(--light-text) !important;
}

.lemyox-app[data-app-theme="light"] button:disabled,
.lemyox-app[data-app-theme="light"] .lemyox-gradient-btn:disabled,
.lemyox-app[data-app-theme="light"] .lemyox-ghost-btn:disabled,
.lemyox-app[data-project-theme="light"] button:disabled,
.lemyox-app[data-project-theme="light"] .lemyox-gradient-btn:disabled,
.lemyox-app[data-project-theme="light"] .lemyox-ghost-btn:disabled {
    background: #edf1f7 !important;
    border-color: #d8dee8 !important;
    box-shadow: none !important;
    color: #94a3b8 !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-sidebar,
.lemyox-app[data-project-theme="light"] .lemyox-sidebar {
    background: rgba(255, 255, 255, 0.96) !important;
    border-color: #e2e8f0 !important;
    box-shadow: 16px 0 42px rgba(15, 23, 42, 0.06) !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-nav-item,
.lemyox-app[data-project-theme="light"] .lemyox-nav-item {
    color: #6d55a4 !important;
}

.lemyox-app[data-app-theme="light"] .lemyox-nav-item.is-active,
.lemyox-app[data-project-theme="light"] .lemyox-nav-item.is-active {
    background: rgba(255, 107, 0, 0.12) !important;
    border-color: rgba(255, 107, 0, 0.28) !important;
    color: var(--light-orange-strong) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-header,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-header {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(255, 255, 255, 0.94)),
        #ffffff !important;
    border-color: var(--light-border) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, 0.08) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-header h2,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-header h2 {
    color: #050b16 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-header p,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-header p {
    color: #526176 !important;
    font-weight: 650 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-upload,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-upload {
    background: linear-gradient(135deg, #ff7a1a, #ff5d00) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 16px 30px rgba(255, 107, 0, 0.24) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-toolbar,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-selectionbar,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-image-card,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-toolbar,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-selectionbar,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-image-card {
    background: #ffffff !important;
    border-color: var(--light-border) !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.06) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-search,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-search {
    background: #ffffff !important;
    border-color: var(--light-border) !important;
    color: var(--light-text) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-search:focus-within,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-search:focus-within {
    background: #ffffff !important;
    border-color: rgba(255, 107, 0, 0.58) !important;
    box-shadow: 0 0 0 4px rgba(255, 107, 0, 0.12) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-filters select,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-filter-btn,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-sort,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-filters select,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-filter-btn,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-sort {
    background: #ffffff !important;
    border-color: var(--light-border) !important;
    color: var(--light-text) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-selectionbar strong,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-selectionbar strong {
    color: var(--light-text) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-selectionbar .lemyox-ghost-btn:not(:disabled),
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-selectionbar .lemyox-ghost-btn:not(:disabled) {
    background: #ffffff !important;
    border-color: var(--light-border-strong) !important;
    color: #0f172a !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-selectionbar .lemyox-gradient-btn:not(:disabled),
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-selectionbar .lemyox-gradient-btn:not(:disabled) {
    background: linear-gradient(135deg, #ff7a1a, #e85d04) !important;
    color: #ffffff !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-selectionbar [data-library-project-title],
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-selectionbar [data-library-project-title] {
    background: #ffffff !important;
    border-color: var(--light-border) !important;
    color: var(--light-text) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-viewbar,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-viewbar {
    background: #eef2f7 !important;
    border-color: var(--light-border) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-viewbar button,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-viewbar button {
    background: transparent !important;
    color: #64748b !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-viewbar button.is-active,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-viewbar button.is-active {
    background: #ffffff !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08), inset 0 0 0 1px rgba(255, 107, 0, 0.24) !important;
    color: var(--light-orange-strong) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-list-head.is-visible,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-list-head.is-visible {
    background: #eef2f7 !important;
    border: 1px solid var(--light-border) !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-list-head strong,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-list-head strong {
    color: #0f172a !important;
    font-weight: 900 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-grid.is-list-view .lemyox-image-card,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-grid.is-list-view .lemyox-image-card {
    background: #ffffff !important;
    border-color: #e2e8f0 !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-image-card h3,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-image-card h3 {
    color: #07111f !important;
    font-weight: 850 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-image-card .lemyox-image-meta,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-image-card > .lemyox-image-project,
.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-image-date,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-image-card .lemyox-image-meta,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-image-card > .lemyox-image-project,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-image-date {
    color: #526176 !important;
    font-weight: 650 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-more,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-more {
    background: #eef2f7 !important;
    border-color: #d8dee8 !important;
    color: #1e293b !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-more:hover,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-more:hover {
    background: #ff7a1a !important;
    color: #ffffff !important;
}

/* Overview dashboard polish. */
.lemyox-app[data-current-view="overview"] {
    --overview-bg: #07101c;
    --overview-panel: #101925;
    --overview-panel-soft: #0d1622;
    --overview-border: rgba(148, 163, 184, 0.18);
    --overview-text: #f8fafc;
    --overview-muted: #9ba8ba;
    --overview-soft: #cbd5e1;
    --overview-orange: #ff7a1a;
    --overview-purple: #9b5de5;
    background:
        radial-gradient(circle at 80% 0%, rgba(155, 93, 229, 0.12), transparent 34%),
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.10), transparent 30%),
        linear-gradient(180deg, #07101c 0%, #09121d 100%) !important;
    color: var(--overview-text) !important;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"],
.lemyox-app[data-current-view="overview"][data-project-theme="light"] {
    --overview-bg: #f5f7fb;
    --overview-panel: #ffffff;
    --overview-panel-soft: #f8fafc;
    --overview-border: #dbe2ec;
    --overview-text: #07111f;
    --overview-muted: #536275;
    --overview-soft: #334155;
    background:
        radial-gradient(circle at 78% 0%, rgba(155, 93, 229, 0.09), transparent 34%),
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.10), transparent 32%),
        #f5f7fb !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-main {
    background: transparent !important;
    padding: 28px 34px 32px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-page {
    display: grid !important;
    gap: 18px !important;
    margin: 0 auto !important;
    max-width: 1500px !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-header {
    align-items: center !important;
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.11), rgba(155, 93, 229, 0.08) 45%, rgba(16, 25, 37, 0.82)),
        var(--overview-panel) !important;
    border: 1px solid var(--overview-border) !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.20) !important;
    display: flex !important;
    gap: 22px !important;
    justify-content: space-between !important;
    min-height: 132px !important;
    overflow: hidden !important;
    padding: 24px 28px !important;
    position: relative !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-header::after {
    background: linear-gradient(90deg, var(--overview-orange), rgba(155, 93, 229, 0.82));
    border-radius: 999px;
    bottom: 0;
    content: "";
    height: 3px;
    left: 28px;
    position: absolute;
    width: 170px;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-header,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-header {
    background: linear-gradient(135deg, #ffffff, #ffffff 58%, #fff8f3) !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-header h2 {
    color: var(--overview-text) !important;
    font-size: clamp(30px, 2.45vw, 42px) !important;
    font-weight: 950 !important;
    letter-spacing: -0.045em !important;
    line-height: 1.04 !important;
    margin: 0 0 10px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-header h2 span {
    font-size: 0.72em !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-header p {
    color: var(--overview-muted) !important;
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-actions {
    align-items: center !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    justify-content: flex-end !important;
    padding-top: 0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-actions a {
    align-items: center !important;
    border-radius: 13px !important;
    display: inline-flex !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    gap: 9px !important;
    min-height: 48px !important;
    padding: 0 20px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-actions .lemyox-gradient-btn {
    background: linear-gradient(135deg, #ff7a1a, #ff5d00) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(255, 122, 26, 0.24) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-actions .lemyox-ghost-btn {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: var(--overview-border) !important;
    color: var(--overview-text) !important;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-actions .lemyox-ghost-btn,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-actions .lemyox-ghost-btn {
    background: #ffffff !important;
    color: #0f172a !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats {
    display: grid !important;
    gap: 16px !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats article,
.lemyox-app[data-current-view="overview"] .lemyox-overview-panel {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
        var(--overview-panel) !important;
    border: 1px solid var(--overview-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 52px rgba(0, 0, 0, 0.18) !important;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-stats article,
.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-panel,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-stats article,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-panel {
    background: #ffffff !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.07) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats article {
    align-items: center !important;
    display: grid !important;
    gap: 18px !important;
    grid-template-columns: 58px minmax(0, 1fr) !important;
    min-height: 132px !important;
    padding: 22px !important;
    transition: border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats article:hover {
    border-color: rgba(255, 122, 26, 0.34) !important;
    box-shadow: 0 24px 62px rgba(0, 0, 0, 0.22) !important;
    transform: translateY(-2px);
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-stats article:hover,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-stats article:hover {
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.10) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats article > span {
    align-items: center !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 16px !important;
    display: inline-flex !important;
    height: 58px !important;
    justify-content: center !important;
    width: 58px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats article > span svg {
    height: 27px !important;
    width: 27px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats small {
    color: var(--overview-muted) !important;
    display: block !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    letter-spacing: 0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats strong {
    color: var(--overview-text) !important;
    display: block !important;
    font-size: clamp(27px, 2vw, 34px) !important;
    font-weight: 950 !important;
    letter-spacing: -0.035em !important;
    line-height: 1.04 !important;
    margin: 6px 0 8px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats em {
    color: var(--overview-muted) !important;
    display: block !important;
    font-size: 13px !important;
    font-style: normal !important;
    font-weight: 650 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats .is-orange em,
.lemyox-app[data-current-view="overview"] .lemyox-overview-stats .is-purple em,
.lemyox-app[data-current-view="overview"] .lemyox-overview-stats .is-green em {
    color: var(--overview-muted) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats i {
    background: rgba(148, 163, 184, 0.20) !important;
    border-radius: 999px !important;
    display: block !important;
    height: 6px !important;
    margin-top: 12px !important;
    max-width: 230px !important;
    overflow: hidden !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-stats i b {
    background: linear-gradient(90deg, var(--overview-orange), var(--overview-purple)) !important;
    border-radius: inherit !important;
    display: block !important;
    height: 100% !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-workspace {
    display: grid !important;
    gap: 16px !important;
    grid-template-columns: minmax(0, 1.45fr) minmax(360px, 0.9fr) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-panel {
    padding: 22px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-panel-head {
    align-items: center !important;
    display: flex !important;
    justify-content: space-between !important;
    margin-bottom: 16px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-panel h3 {
    color: var(--overview-text) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-panel-head > span,
.lemyox-app[data-current-view="overview"] .lemyox-overview-panel-head > a {
    align-items: center !important;
    background: rgba(255, 122, 26, 0.12) !important;
    border: 1px solid rgba(255, 122, 26, 0.24) !important;
    border-radius: 12px !important;
    color: var(--overview-orange) !important;
    display: inline-flex !important;
    height: 38px !important;
    justify-content: center !important;
    text-decoration: none !important;
    width: 38px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list {
    display: grid !important;
    gap: 8px !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list li,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list li {
    align-items: center !important;
    background: rgba(255, 255, 255, 0.025) !important;
    border: 1px solid rgba(148, 163, 184, 0.12) !important;
    border-radius: 14px !important;
    display: grid !important;
    gap: 13px !important;
    min-height: 64px !important;
    padding: 11px 12px !important;
    transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list li:hover,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list li:hover {
    background: rgba(255, 122, 26, 0.055) !important;
    border-color: rgba(255, 122, 26, 0.22) !important;
    transform: translateX(2px);
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-project-list li,
.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-export-list li,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-project-list li,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-export-list li {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list li {
    grid-template-columns: 42px minmax(0, 1fr) auto !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list li {
    grid-template-columns: 42px minmax(0, 1fr) auto !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list li:last-child,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list li:last-child {
    border-bottom: 1px solid rgba(148, 163, 184, 0.12) !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list li > span,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list li > span {
    align-items: center !important;
    background: rgba(255, 122, 26, 0.12) !important;
    border: 1px solid rgba(255, 122, 26, 0.18) !important;
    border-radius: 12px !important;
    color: var(--overview-orange) !important;
    display: inline-flex !important;
    height: 40px !important;
    justify-content: center !important;
    width: 40px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list b,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list b {
    color: var(--overview-text) !important;
    display: block !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 1.35 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list small,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list small {
    color: var(--overview-muted) !important;
    display: block !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    margin-top: 2px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list em {
    background: rgba(34, 197, 94, 0.12) !important;
    border: 1px solid rgba(34, 197, 94, 0.22) !important;
    border-radius: 999px !important;
    color: #4ade80 !important;
    font-size: 12px !important;
    font-style: normal !important;
    font-weight: 850 !important;
    padding: 5px 9px !important;
    white-space: nowrap !important;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-project-list em,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-project-list em {
    color: #15803d !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list a,
.lemyox-app[data-current-view="overview"] .lemyox-overview-more {
    color: var(--overview-orange) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    text-decoration: none !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-more {
    align-items: center !important;
    background: rgba(255, 122, 26, 0.09) !important;
    border: 1px solid rgba(255, 122, 26, 0.18) !important;
    border-radius: 13px !important;
    display: inline-flex !important;
    gap: 8px !important;
    justify-content: center !important;
    margin-top: 14px !important;
    min-height: 42px !important;
    padding: 0 16px !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-empty {
    align-items: center !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
        var(--overview-panel-soft) !important;
    border: 1px dashed rgba(148, 163, 184, 0.26) !important;
    border-radius: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-height: 285px !important;
    padding: 30px !important;
    text-align: center !important;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-empty,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-empty {
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-empty > span {
    align-items: center !important;
    background: linear-gradient(180deg, rgba(148, 163, 184, 0.18), rgba(148, 163, 184, 0.07)) !important;
    border: 1px solid rgba(148, 163, 184, 0.14) !important;
    border-radius: 22px !important;
    color: var(--overview-muted) !important;
    display: inline-flex !important;
    height: 86px !important;
    justify-content: center !important;
    margin-bottom: 18px !important;
    width: 96px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-empty strong {
    color: var(--overview-text) !important;
    font-size: 17px !important;
    font-weight: 900 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-empty p {
    color: var(--overview-muted) !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    margin: 8px 0 18px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-empty .lemyox-ghost-btn {
    align-items: center !important;
    border-radius: 12px !important;
    display: inline-flex !important;
    gap: 8px !important;
    min-height: 42px !important;
    padding: 0 16px !important;
    width: auto !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-tips {
    padding: 22px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-tips > div {
    display: grid !important;
    gap: 14px !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    margin-top: 16px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-tips article {
    align-items: center !important;
    background: rgba(255, 255, 255, 0.035) !important;
    border: 1px solid rgba(148, 163, 184, 0.14) !important;
    border-radius: 15px !important;
    display: flex !important;
    gap: 16px !important;
    min-height: 98px !important;
    padding: 17px 18px !important;
}

.lemyox-app[data-current-view="overview"][data-app-theme="light"] .lemyox-overview-tips article,
.lemyox-app[data-current-view="overview"][data-project-theme="light"] .lemyox-overview-tips article {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-tips article span {
    align-items: center !important;
    border-radius: 14px !important;
    display: inline-flex !important;
    flex: 0 0 auto !important;
    height: 52px !important;
    justify-content: center !important;
    width: 52px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-tips p {
    color: var(--overview-muted) !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.45 !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-tips b {
    color: var(--overview-text) !important;
    display: block !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    margin-bottom: 3px !important;
}

.lemyox-app[data-current-view="overview"] .lemyox-overview-actions svg,
.lemyox-app[data-current-view="overview"] .lemyox-overview-tips svg,
.lemyox-app[data-current-view="overview"] .lemyox-overview-empty svg,
.lemyox-app[data-current-view="overview"] .lemyox-overview-project-list svg,
.lemyox-app[data-current-view="overview"] .lemyox-overview-export-list svg {
    height: 18px !important;
    width: 18px !important;
}

@media (max-width: 1240px) {
    .lemyox-app[data-current-view="overview"] .lemyox-overview-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-workspace,
    .lemyox-app[data-current-view="overview"] .lemyox-overview-tips > div {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="overview"] .lemyox-main {
        padding: 16px 12px 22px !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-header,
    .lemyox-app[data-current-view="overview"] .lemyox-overview-actions {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-header {
        padding: 22px !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-header h2 {
        font-size: 28px !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-actions a {
        justify-content: center !important;
        width: 100% !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-stats {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-stats article {
        min-height: 118px !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-panel {
        padding: 16px !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-project-list li {
        grid-template-columns: 40px minmax(0, 1fr) !important;
    }

    .lemyox-app[data-current-view="overview"] .lemyox-overview-project-list em {
        grid-column: 2 !important;
        justify-self: start !important;
    }
}

/* Library width and light pagination polish. */
.lemyox-app[data-current-view="library"] .lemyox-main {
    padding: 30px 34px 28px !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-page {
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-grid {
    width: 100% !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination {
    align-items: center !important;
    display: flex !important;
    gap: 18px !important;
    justify-content: space-between !important;
    min-height: 64px !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination div[data-library-page-buttons] {
    align-items: center !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 9px !important;
    justify-content: flex-end !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination button {
    align-items: center !important;
    display: inline-flex !important;
    justify-content: center !important;
    line-height: 1 !important;
}

.lemyox-app[data-current-view="library"] .lemyox-library-pagination div[data-library-page-buttons] > span {
    align-items: center !important;
    color: color-mix(in srgb, var(--library-muted, #94a3b8) 82%, #ffffff 18%) !important;
    display: inline-flex !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    height: 40px !important;
    justify-content: center !important;
    min-width: 24px !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-page,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-page {
    color: #07111f !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination {
    background: #ffffff !important;
    border: 1px solid #d8dee8 !important;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.07) !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination > span,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination > span {
    color: #475569 !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination button,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination button {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06) !important;
    color: #0f172a !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination button:hover:not(:disabled):not(.is-active),
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination button:hover:not(:disabled):not(.is-active) {
    background: #fff7ed !important;
    border-color: rgba(249, 115, 22, 0.48) !important;
    color: #ea580c !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination button.is-active,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination button.is-active {
    background: linear-gradient(135deg, #ff7a1a, #ff5d00) !important;
    border-color: transparent !important;
    box-shadow: 0 12px 24px rgba(249, 115, 22, 0.24) !important;
    color: #ffffff !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination button:disabled,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination button:disabled {
    background: #edf2f7 !important;
    border-color: #d8dee8 !important;
    box-shadow: none !important;
    color: #94a3b8 !important;
    opacity: 1 !important;
}

.lemyox-app[data-current-view="library"][data-app-theme="light"] .lemyox-library-pagination div[data-library-page-buttons] > span,
.lemyox-app[data-current-view="library"][data-project-theme="light"] .lemyox-library-pagination div[data-library-page-buttons] > span {
    color: #64748b !important;
}

@media (min-width: 1440px) {
    .lemyox-app[data-current-view="library"] .lemyox-library-grid {
        grid-template-columns: repeat(4, minmax(260px, 1fr)) !important;
    }
}

@media (min-width: 1800px) {
    .lemyox-app[data-current-view="library"] .lemyox-library-grid {
        grid-template-columns: repeat(5, minmax(250px, 1fr)) !important;
    }
}

@media (max-width: 700px) {
    .lemyox-app[data-current-view="library"] .lemyox-main {
        padding: 18px 14px 24px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-pagination {
        align-items: stretch !important;
        flex-direction: column !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-pagination div[data-library-page-buttons] {
        justify-content: flex-start !important;
    }
}

/* Batch page: simple one-screen workflow without the print stepper. */
.lemyox-app[data-current-view="batch"] {
    --batch-bg: #07101c;
    --batch-panel: #101925;
    --batch-panel-soft: #0d1622;
    --batch-border: rgba(148, 163, 184, 0.18);
    --batch-text: #f8fafc;
    --batch-muted: #9ba8ba;
    --batch-orange: #ff7a1a;
    --batch-purple: #9b5de5;
    background:
        radial-gradient(circle at 80% 0%, rgba(155, 93, 229, 0.12), transparent 34%),
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.10), transparent 30%),
        var(--batch-bg) !important;
    color: var(--batch-text) !important;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"],
.lemyox-app[data-current-view="batch"][data-project-theme="light"] {
    --batch-bg: #f5f7fb;
    --batch-panel: #ffffff;
    --batch-panel-soft: #f8fafc;
    --batch-border: #dbe2ec;
    --batch-text: #07111f;
    --batch-muted: #536275;
    background:
        radial-gradient(circle at 78% 0%, rgba(155, 93, 229, 0.08), transparent 34%),
        radial-gradient(circle at 18% 0%, rgba(255, 122, 26, 0.09), transparent 32%),
        #f5f7fb !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-stepper,
.lemyox-app[data-current-view="batch"] .lemyox-topbar {
    display: none !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-main {
    background: transparent !important;
    padding: 28px 34px 32px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-route[data-route="batch"] {
    margin: 0 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool {
    display: grid !important;
    gap: 18px !important;
    margin: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head {
    align-items: center !important;
    background:
        linear-gradient(135deg, rgba(255, 122, 26, 0.11), rgba(155, 93, 229, 0.08) 44%, rgba(16, 25, 37, 0.82)),
        var(--batch-panel) !important;
    border: 1px solid var(--batch-border) !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.20) !important;
    display: grid !important;
    gap: 18px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
    min-height: 122px !important;
    overflow: hidden !important;
    padding: 24px 28px !important;
    position: relative !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head::after {
    background: linear-gradient(90deg, var(--batch-orange), var(--batch-purple));
    border-radius: 999px;
    bottom: 0;
    content: "";
    height: 3px;
    left: 28px;
    position: absolute;
    width: 170px;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-quick-tool__head,
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-quick-tool__head {
    background: linear-gradient(135deg, #ffffff, #ffffff 58%, #fff8f3) !important;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.08) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-back-link {
    display: none !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head h2 {
    color: var(--batch-text) !important;
    font-size: clamp(30px, 2.2vw, 40px) !important;
    font-weight: 950 !important;
    letter-spacing: -0.04em !important;
    line-height: 1.05 !important;
    margin: 0 0 10px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head p {
    color: var(--batch-muted) !important;
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1.55 !important;
    margin: 0 !important;
    max-width: 760px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head > span {
    align-items: center !important;
    background: rgba(255, 122, 26, 0.12) !important;
    border: 1px solid rgba(255, 122, 26, 0.28) !important;
    border-radius: 999px !important;
    color: #ffb076 !important;
    display: inline-flex !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    justify-content: center !important;
    line-height: 1.35 !important;
    margin: 0 !important;
    max-width: 460px !important;
    padding: 10px 14px !important;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-quick-tool__head > span,
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-quick-tool__head > span {
    background: #fff7ed !important;
    border-color: rgba(249, 115, 22, 0.28) !important;
    color: #c2410c !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__layout {
    align-items: start !important;
    display: grid !important;
    gap: 18px !important;
    grid-template-columns: minmax(360px, 0.92fr) minmax(320px, 1fr) minmax(320px, 1fr) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-quick-tool__panel {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0)),
        var(--batch-panel) !important;
    border: 1px solid var(--batch-border) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 52px rgba(0, 0, 0, 0.18) !important;
    min-height: 0 !important;
    padding: 18px !important;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-quick-tool__panel,
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-quick-tool__panel {
    background: #ffffff !important;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.07) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-drop {
    background:
        radial-gradient(circle at 50% 0%, rgba(255, 122, 26, 0.08), transparent 46%),
        var(--batch-panel-soft) !important;
    border: 1px dashed color-mix(in srgb, var(--batch-border) 70%, var(--batch-orange) 30%) !important;
    border-radius: 16px !important;
    min-height: 190px !important;
    padding: 28px 22px !important;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-tool-drop,
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-tool-drop {
    background: #f8fafc !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-drop strong {
    color: var(--batch-text) !important;
    font-size: 17px !important;
    font-weight: 900 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-drop small {
    color: var(--batch-muted) !important;
    font-size: 13px !important;
    font-weight: 650 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-options {
    display: grid !important;
    gap: 12px !important;
    margin-top: 14px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-option {
    background: var(--batch-panel-soft) !important;
    border: 1px solid var(--batch-border) !important;
    border-radius: 14px !important;
    box-shadow: none !important;
    color: var(--batch-text) !important;
    gap: 9px !important;
    padding: 14px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-option span,
.lemyox-app[data-current-view="batch"] .lemyox-tool-option label {
    color: var(--batch-text) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-option b {
    color: var(--batch-orange) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-option input[type="range"] {
    accent-color: var(--batch-orange) !important;
    cursor: pointer !important;
    width: 100% !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-option input[type="number"],
.lemyox-app[data-current-view="batch"] .lemyox-tool-option input[type="text"],
.lemyox-app[data-current-view="batch"] .lemyox-tool-option select {
    background: rgba(7, 13, 25, 0.62) !important;
    border: 1px solid rgba(148, 163, 184, 0.22) !important;
    border-radius: 11px !important;
    color: var(--batch-text) !important;
    font-weight: 750 !important;
    min-height: 42px !important;
    padding: 9px 11px !important;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-tool-option input[type="number"],
.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-tool-option input[type="text"],
.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-tool-option select,
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-tool-option input[type="number"],
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-tool-option input[type="text"],
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-tool-option select {
    background: #ffffff !important;
    border-color: #d8dee8 !important;
    color: #07111f !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-option--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-actions {
    align-items: center !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 16px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-actions button {
    border-radius: 13px !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    min-height: 46px !important;
    padding: 0 18px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-actions .lemyox-gradient-btn {
    background: linear-gradient(135deg, #ff7a1a, #ff5d00) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 16px 32px rgba(255, 122, 26, 0.24) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-actions .lemyox-ghost-btn {
    background: rgba(255, 255, 255, 0.055) !important;
    border: 1px solid var(--batch-border) !important;
    color: var(--batch-text) !important;
}

.lemyox-app[data-current-view="batch"][data-app-theme="light"] .lemyox-tool-actions .lemyox-ghost-btn,
.lemyox-app[data-current-view="batch"][data-project-theme="light"] .lemyox-tool-actions .lemyox-ghost-btn {
    background: #ffffff !important;
    color: #0f172a !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-panel-head {
    align-items: center !important;
    border-bottom: 1px solid var(--batch-border) !important;
    display: flex !important;
    justify-content: space-between !important;
    margin: -2px 0 14px !important;
    padding-bottom: 12px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-panel-head h3 {
    color: var(--batch-text) !important;
    font-size: 17px !important;
    font-weight: 900 !important;
    letter-spacing: -0.02em !important;
    margin: 0 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-panel-head span {
    background: rgba(148, 163, 184, 0.12) !important;
    border-radius: 999px !important;
    color: var(--batch-muted) !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    padding: 5px 9px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-file-list,
.lemyox-app[data-current-view="batch"] .lemyox-tool-result-body {
    min-height: 300px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-empty-state {
    background: var(--batch-panel-soft) !important;
    border: 1px dashed rgba(148, 163, 184, 0.24) !important;
    border-radius: 16px !important;
    min-height: 170px !important;
    padding: 24px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-empty-state h3,
.lemyox-app[data-current-view="batch"] .lemyox-empty-state strong {
    color: var(--batch-text) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-empty-state p {
    color: var(--batch-muted) !important;
    font-weight: 650 !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-file,
.lemyox-app[data-current-view="batch"] .lemyox-tool-output-list li,
.lemyox-app[data-current-view="batch"] .lemyox-tool-ready {
    background: var(--batch-panel-soft) !important;
    border-color: var(--batch-border) !important;
    border-radius: 14px !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-file b,
.lemyox-app[data-current-view="batch"] .lemyox-tool-output-list b,
.lemyox-app[data-current-view="batch"] .lemyox-tool-ready strong {
    color: var(--batch-text) !important;
}

.lemyox-app[data-current-view="batch"] .lemyox-tool-file small,
.lemyox-app[data-current-view="batch"] .lemyox-tool-output-list span,
.lemyox-app[data-current-view="batch"] .lemyox-tool-ready p {
    color: var(--batch-muted) !important;
}

@media (max-width: 1240px) {
    .lemyox-app[data-current-view="batch"] .lemyox-quick-tool__layout {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="batch"] .lemyox-tool-file-list,
    .lemyox-app[data-current-view="batch"] .lemyox-tool-result-body {
        min-height: 220px !important;
    }
}

@media (max-width: 760px) {
    .lemyox-app[data-current-view="batch"] .lemyox-main {
        padding: 16px 12px 22px !important;
    }

    .lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head {
        grid-template-columns: 1fr !important;
        padding: 22px !important;
    }

    .lemyox-app[data-current-view="batch"] .lemyox-quick-tool__head h2 {
        font-size: 28px !important;
    }

    .lemyox-app[data-current-view="batch"] .lemyox-tool-option--grid {
        grid-template-columns: 1fr !important;
    }

    .lemyox-app[data-current-view="batch"] .lemyox-tool-actions button {
        justify-content: center !important;
        width: 100% !important;
    }
}

@media (min-width: 901px) {
    .lemyox-app[data-current-view="library"] .lemyox-library-list-head.is-visible {
        align-items: center !important;
        background: #0b121d !important;
        border: 1px solid rgba(148, 163, 184, 0.18) !important;
        border-bottom: 0 !important;
        border-radius: 10px 10px 0 0 !important;
        color: #e5edf7 !important;
        display: grid !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        gap: 16px !important;
        grid-template-columns: 58px minmax(300px, 2.4fr) minmax(150px, .85fr) minmax(170px, .9fr) minmax(160px, .9fr) 42px !important;
        margin: 0 !important;
        min-height: 38px !important;
        padding: 0 14px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-list-head strong:first-child {
        grid-column: 1 / 3 !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view {
        background: #101822 !important;
        border: 1px solid rgba(148, 163, 184, 0.18) !important;
        border-radius: 0 0 10px 10px !important;
        border-top: 0 !important;
        display: block !important;
        overflow: visible !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(148, 163, 184, 0.13) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        display: grid !important;
        gap: 16px !important;
        grid-template-columns: 58px minmax(300px, 2.4fr) minmax(150px, .85fr) minmax(170px, .9fr) minmax(160px, .9fr) 42px !important;
        margin: 0 !important;
        min-height: 58px !important;
        overflow: visible !important;
        padding: 7px 14px !important;
        transform: none !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card:nth-child(even) {
        background: rgba(255, 255, 255, 0.015) !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card:last-child {
        border-bottom: 0 !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card:hover {
        background: rgba(255, 255, 255, 0.045) !important;
        border-color: rgba(148, 163, 184, 0.18) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card.is-selected {
        background: rgba(255, 115, 0, 0.08) !important;
        box-shadow: inset 3px 0 0 rgba(255, 115, 0, 0.82) !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-thumb {
        aspect-ratio: 1 / 1 !important;
        border-radius: 6px !important;
        height: 44px !important;
        width: 44px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-thumb img,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card:hover .lemyox-image-thumb img {
        aspect-ratio: auto !important;
        filter: none !important;
        transform: none !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-select-check {
        height: 15px !important;
        left: 4px !important;
        top: 4px !important;
        width: 15px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-select-check input {
        border-radius: 4px !important;
        height: 15px !important;
        width: 15px !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card h3,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-date,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-card-actions {
        margin: 0 !important;
        min-width: 0 !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card h3 {
        color: #f8fafc !important;
        font-size: 13px !important;
        font-weight: 780 !important;
        letter-spacing: 0 !important;
        line-height: 1.25 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project,
    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-date {
        align-items: center !important;
        color: #b8c4d4 !important;
        display: flex !important;
        font-size: 12px !important;
        font-weight: 650 !important;
        line-height: 1.2 !important;
        min-height: 18px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project {
        color: #c9d7ee !important;
        font-weight: 760 !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-card-actions {
        display: flex !important;
        justify-content: center !important;
        min-height: 0 !important;
    }

    .lemyox-app[data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-library-more {
        align-items: center !important;
        background: #111a28 !important;
        border: 1px solid rgba(148, 163, 184, 0.14) !important;
        border-radius: 9px !important;
        display: inline-flex !important;
        height: 32px !important;
        justify-content: center !important;
        letter-spacing: 2px !important;
        width: 32px !important;
    }
}

@media (min-width: 901px) {
    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-list-head.is-visible,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-list-head.is-visible {
        background: #f8fafc !important;
        border-color: rgba(15, 23, 42, 0.10) !important;
        color: #1f2937 !important;
    }

    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view {
        background: #ffffff !important;
        border-color: rgba(15, 23, 42, 0.10) !important;
    }

    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card {
        border-bottom-color: rgba(15, 23, 42, 0.08) !important;
    }

    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card:nth-child(even),
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card:nth-child(even) {
        background: #fafbfc !important;
    }

    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card h3,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card h3 {
        color: #111827 !important;
    }

    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-date,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card .lemyox-image-meta,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-date {
        color: #475569 !important;
    }

    .lemyox-app[data-app-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project,
    .lemyox-app[data-project-theme="light"][data-current-view="library"] .lemyox-library-grid.is-list-view .lemyox-image-card > .lemyox-image-project {
        color: #334155 !important;
    }
}

@media (min-width: 901px) {
    .lemyox-app[data-current-view="projects"] .lemyox-project-list-head.is-visible {
        align-items: center !important;
        background: #0b121d !important;
        border: 1px solid rgba(148, 163, 184, 0.18) !important;
        border-bottom: 0 !important;
        border-radius: 10px 10px 0 0 !important;
        color: #dbe6f3 !important;
        display: grid !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        gap: 16px !important;
        grid-template-columns: 82px minmax(320px, 2.5fr) minmax(130px, .7fr) minmax(130px, .7fr) minmax(170px, .9fr) 70px !important;
        margin: 0 !important;
        min-height: 38px !important;
        padding: 0 12px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-project-list-head strong:first-child {
        grid-column: 1 / 3 !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view {
        background: #101822 !important;
        border: 1px solid rgba(148, 163, 184, 0.18) !important;
        border-radius: 0 0 10px 10px !important;
        border-top: 0 !important;
        display: block !important;
        gap: 0 !important;
        overflow: visible !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(148, 163, 184, 0.13) !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        display: grid !important;
        gap: 16px !important;
        grid-template-columns: 82px minmax(320px, 2.5fr) minmax(130px, .7fr) minmax(130px, .7fr) minmax(170px, .9fr) 70px !important;
        margin: 0 !important;
        min-height: 88px !important;
        overflow: visible !important;
        padding: 8px 12px !important;
        transform: none !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile:nth-child(even) {
        background: rgba(255, 255, 255, 0.015) !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile:last-child {
        border-bottom: 0 !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile:hover {
        background: rgba(255, 255, 255, 0.045) !important;
        border-color: rgba(148, 163, 184, 0.18) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-cover {
        aspect-ratio: 1 / 1 !important;
        border-radius: 7px !important;
        height: 72px !important;
        overflow: hidden !important;
        width: 72px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-cover img,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile:hover .lemyox-project-cover img {
        filter: none !important;
        height: 100% !important;
        object-fit: cover !important;
        transform: none !important;
        width: 100% !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-cover b {
        display: none !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-cover-placeholder {
        font-size: 11px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile-body {
        display: grid !important;
        gap: 5px !important;
        min-height: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile h3 {
        color: #f8fafc !important;
        font-size: 14px !important;
        font-weight: 820 !important;
        letter-spacing: 0 !important;
        line-height: 1.22 !important;
        margin: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile h3 a {
        color: inherit !important;
        text-decoration: none !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-meta {
        color: #8fa0b4 !important;
        display: flex !important;
        font-size: 11px !important;
        gap: 10px !important;
        line-height: 1.2 !important;
        min-width: 0 !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-updated {
        display: none !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-owner,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-type,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-modified,
    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-actions {
        align-items: center !important;
        color: #c9d4e3 !important;
        display: flex !important;
        font-size: 12px !important;
        font-weight: 650 !important;
        line-height: 1.2 !important;
        min-width: 0 !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-owner span {
        background: #0b121d !important;
        border: 1px solid rgba(148, 163, 184, 0.10) !important;
        border-radius: 10px !important;
        color: #8fa0b4 !important;
        font-size: 10px !important;
        padding: 3px 8px !important;
        white-space: nowrap !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-type {
        color: #eef4fb !important;
        font-weight: 760 !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-modified {
        color: #8fa0b4 !important;
        white-space: nowrap !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-actions {
        gap: 4px !important;
        justify-content: flex-end !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-actions button {
        align-items: center !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 8px !important;
        color: #f8fafc !important;
        cursor: pointer !important;
        display: inline-flex !important;
        font-size: 18px !important;
        height: 30px !important;
        justify-content: center !important;
        padding: 0 !important;
        width: 30px !important;
    }

    .lemyox-app[data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-actions button:hover {
        background: rgba(255, 255, 255, 0.07) !important;
    }
}

@media (min-width: 901px) {
    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-project-list-head.is-visible,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-project-list-head.is-visible {
        background: #f8fafc !important;
        border-color: rgba(15, 23, 42, 0.10) !important;
        color: #1f2937 !important;
    }

    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view {
        background: #ffffff !important;
        border-color: rgba(15, 23, 42, 0.10) !important;
    }

    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view .lemyox-project-tile,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile {
        border-bottom-color: rgba(15, 23, 42, 0.08) !important;
    }

    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view .lemyox-project-tile:nth-child(even),
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile:nth-child(even) {
        background: #fafbfc !important;
    }

    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view .lemyox-project-tile h3,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-tile h3 {
        color: #111827 !important;
    }

    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view .lemyox-project-list-type,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-type {
        color: #1f2937 !important;
    }

    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view .lemyox-project-meta,
    .lemyox-app[data-current-view="projects"][data-project-theme="light"] .lemyox-projects-grid.is-list-view .lemyox-project-list-modified,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-meta,
    .lemyox-app[data-app-theme="light"][data-current-view="projects"] .lemyox-projects-grid.is-list-view .lemyox-project-list-modified {
        color: #64748b !important;
    }
}