.css-design-tabs {
    position: sticky;
    z-index: 3;
    top: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.3rem;
    padding: 0.55rem;
    border-bottom: 1px solid rgba(95, 215, 238, 0.2);
    background: #091c2a;
}

.css-design-tabs button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    min-height: 36px;
    padding: 0.45rem 0.6rem;
    border: 1px solid transparent;
    border-radius: 9px;
    color: #9dbbc9;
    background: transparent;
    font: inherit;
    font-size: 0.72rem;
    font-weight: 800;
    cursor: pointer;
}

.css-design-tabs button.is-active {
    border-color: rgba(67, 218, 244, 0.45);
    color: #c9fbff;
    background: rgba(67, 218, 244, 0.13);
}

.css-design-tabs button:hover,
.css-design-tabs button:focus-visible { color: #effdff; border-color: #43daf4; }
[data-css-inspector-workspace] [data-css-design-view][hidden] { display: none !important; }

.css-design-structure { color: #e2f2f8; }
.css-design-structure__intro { padding: 0.9rem 0.8rem 0.4rem; }
.css-design-structure__intro strong { font-size: 0.8rem; }
.css-design-structure__intro p { margin: 0.4rem 0 0; color: #93afbf; font-size: 0.68rem; line-height: 1.55; }
.css-design-structure__toolbar { display: flex; flex-wrap: wrap; gap: 0.35rem; padding: 0.45rem 0.8rem 0.75rem; }
.css-design-structure__toolbar button,
.css-design-structure__footer button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 32px;
    padding: 0.38rem 0.5rem;
    border: 1px solid rgba(95, 215, 238, 0.28);
    border-radius: 8px;
    color: #d8edf4;
    background: #102e41;
    font: inherit;
    font-size: 0.63rem;
    font-weight: 750;
    cursor: pointer;
}
.css-design-structure__toolbar button:hover,
.css-design-structure__footer button:hover { border-color: #43daf4; color: #fff; }
.css-design-structure__status { margin: 0; padding: 0.7rem 0.8rem; color: #9fc0ce; font-size: 0.72rem; line-height: 1.5; }
.css-design-structure__tree { padding: 0 0.5rem 0.7rem; }
.css-design-structure__node { outline: none; }
.css-design-structure__line { display: flex; min-height: 37px; align-items: stretch; border: 1px solid transparent; border-radius: 8px; }
.css-design-structure__node.is-selected > .css-design-structure__line { border-color: rgba(67, 218, 244, 0.6); background: rgba(67, 218, 244, 0.14); }
.css-design-structure__node:focus-visible > .css-design-structure__line { outline: 2px solid #75e6bf; outline-offset: 1px; }
.css-design-structure__line:hover { background: rgba(67, 218, 244, 0.07); }
.css-design-structure__toggle,
.css-design-structure__select {
    border: 0;
    color: #c8e1ec;
    background: transparent;
    font: inherit;
    cursor: pointer;
}
.css-design-structure__toggle { flex: 0 0 28px; padding: 0.25rem; font-size: 0.65rem; }
.css-design-structure__toggle:disabled { visibility: hidden; }
.css-design-structure__select { display: flex; flex: 1; min-width: 0; align-items: center; gap: 0.45rem; padding: 0.45rem 0.4rem 0.45rem 0; text-align: left; font-size: 0.71rem; }
.css-design-structure__select i { flex: 0 0 15px; color: #75dbe9; font-size: 0.78rem; }
.css-design-structure__select span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.css-design-structure__children { margin-left: 0.8rem; padding-left: 0.3rem; border-left: 1px solid rgba(95, 215, 238, 0.18); }
.css-design-structure__children[hidden] { display: none !important; }
.css-design-structure__footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.65rem; padding: 0.8rem; border-top: 1px solid rgba(95, 215, 238, 0.18); }
.css-design-structure__footer > span { flex: 1 1 110px; min-width: 0; color: #9fbccb; font-size: 0.68rem; overflow-wrap: anywhere; }

.area-editor {
    --area-cyan: #43daf4;
    --area-mint: #75e6bf;
    --area-violet: #bfa4fa;
    --area-line: rgba(95, 215, 238, 0.18);
    min-height: 100%;
    color: #eefaff;
}

[data-css-inspector-workspace] [data-css-design-panel] { display: none; }
[data-css-inspector-workspace][data-design-area="general"] [data-css-design-panel="general"],
[data-css-inspector-workspace][data-design-area="home"] [data-css-design-panel="home"],
[data-css-inspector-workspace][data-design-area="masthead"] [data-css-design-panel="masthead"],
[data-css-inspector-workspace][data-design-area="menu"] [data-css-design-panel="menu"],
[data-css-inspector-workspace][data-design-area="about"] [data-css-design-panel="about"],
[data-css-inspector-workspace][data-design-area="images"] [data-css-design-panel="images"] { display: block; }

.area-editor__intro {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 0.75rem;
    padding: 1rem;
    border-bottom: 1px solid var(--area-line);
    background: linear-gradient(145deg, rgba(67, 218, 244, 0.08), rgba(122, 86, 225, 0.05) 70%, transparent);
}

.area-editor__icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(67, 218, 244, 0.36);
    border-radius: 13px;
    color: var(--area-cyan);
    background: linear-gradient(145deg, rgba(67, 218, 244, 0.16), rgba(122, 86, 225, 0.12));
}

.area-editor__intro span:not(.area-editor__icon),
.area-editor__section-heading > div > span,
.area-editor__collection-heading > div > span,
.home-panel-card__add-menu + span {
    display: block;
    color: var(--area-violet);
    font-size: 0.56rem;
    font-weight: 850;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.area-editor__intro h2,
.area-editor__intro p { margin: 0; }
.area-editor__intro h2 { margin-top: 0.14rem; font-size: 0.94rem; }
.area-editor__intro p { margin-top: 0.32rem; color: #8eacba; font-size: 0.68rem; line-height: 1.55; }

.area-editor__state {
    display: flex;
    min-height: 150px;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 1.2rem;
    color: #8eacba;
    font-size: 0.74rem;
    text-align: center;
}

.area-editor__state--error { color: #ffabb6; }
.area-editor__spinner {
    width: 20px; height: 20px; border: 2px solid rgba(67, 218, 244, 0.2);
    border-top-color: var(--area-cyan); border-radius: 50%; animation: css-area-spin 700ms linear infinite;
}

.home-area-editor__history {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    margin: 0.45rem 0.22rem 0;
    padding: 0.48rem 0.56rem;
    border: 1px solid rgba(95, 215, 238, 0.2);
    border-radius: 12px;
    background: rgba(5, 21, 33, 0.78);
}

.home-area-editor__draft-status {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: 0.38rem;
    color: #9ec3cf;
    font-size: 0.6rem;
    line-height: 1.35;
}

.home-area-editor__draft-status i { color: var(--area-mint); }
.home-area-editor__history-actions { display: inline-flex; flex: 0 0 auto; gap: 0.35rem; }
.home-area-editor__history-actions button {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    padding: 0.36rem 0.52rem;
    border: 1px solid rgba(95, 215, 238, 0.28);
    border-radius: 9px;
    color: #d8edf4;
    background: rgba(13, 43, 60, 0.92);
    font: inherit;
    font-size: 0.61rem;
    font-weight: 800;
    cursor: pointer;
}

.home-area-editor__history-actions button:hover:not(:disabled) {
    border-color: var(--area-cyan);
    color: #03161c;
    background: linear-gradient(135deg, var(--area-cyan), var(--area-mint));
}

.home-area-editor__history-actions button:disabled { opacity: 0.38; cursor: default; }

@media (max-width: 480px) {
    .home-area-editor__history { align-items: stretch; flex-direction: column; }
    .home-area-editor__history-actions button { flex: 1; }
}

.home-area-editor__settings,
.home-panel-card,
.about-editor-card,
.brand-image-card {
    margin: 0.78rem;
    overflow: hidden;
    border: 1px solid rgba(108, 193, 221, 0.2);
    border-radius: 16px;
    background: linear-gradient(145deg, rgba(13, 43, 60, 0.85), rgba(6, 24, 36, 0.94));
}

/* The Home editor nests a panel, its fields, the content collection, and the
   selected element editor. Keep those layers close to the panel edge so the
   controls retain useful width in the docked and floating inspectors. */
.home-area-editor .home-area-editor__settings,
.home-area-editor .home-panel-card {
    margin: 0.32rem 0.22rem;
}

/* A floating editor leaves the storefront as the primary canvas. Compact the
   editor cards so their controls use the smaller window more efficiently. */
[data-css-inspector-workspace].is-editor-floating .area-editor__intro {
    gap: 0.375rem;
    padding: 0.5rem;
}

[data-css-inspector-workspace].is-editor-floating .area-editor__section-heading,
[data-css-inspector-workspace].is-editor-floating .area-editor__collection-heading,
[data-css-inspector-workspace].is-editor-floating .home-area-editor__panel-heading {
    gap: 0.325rem;
    padding: 0.375rem 0.41rem;
}

[data-css-inspector-workspace].is-editor-floating .area-editor__field-grid {
    gap: 0.31rem;
    padding: 0.38rem;
}

[data-css-inspector-workspace].is-editor-floating .home-height-helper {
    gap: 0.24rem;
    padding: 0.35rem;
}

[data-css-inspector-workspace].is-editor-floating .home-panel-card__body,
[data-css-inspector-workspace].is-editor-floating .about-editor-card__body,
[data-css-inspector-workspace].is-editor-floating .brand-image-card__body {
    padding: 0.375rem;
}

[data-css-inspector-workspace].is-editor-floating .home-panel-card__body {
    padding: 0.09rem;
}

[data-css-inspector-workspace].is-editor-floating .home-panel-card__body > .area-editor__field-grid {
    gap: 0.2rem;
    padding: 0.1rem;
}

.area-editor__section-heading,
.area-editor__collection-heading,
.home-area-editor__panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    padding: 0.75rem 0.82rem;
    border-bottom: 1px solid rgba(95, 215, 238, 0.12);
}

.area-editor__collection-heading,
.home-area-editor__panel-heading { margin-top: 0.35rem; }
.area-editor__section-heading strong,
.area-editor__collection-heading strong,
.home-area-editor__panel-heading strong { display: block; margin-top: 0.12rem; font-size: 0.76rem; }
.area-editor__collection-heading > div > span,
.home-area-editor__panel-heading > div > span { display:block; color: var(--area-violet); font-size:.56rem; font-weight:850; letter-spacing:.14em; }

.area-editor__collection-heading button,
.home-area-editor__panel-heading button,
.home-panel-card__add-menu button,
.area-editor__actions button {
    display: inline-flex;
    min-height: 34px;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.42rem 0.6rem;
    border: 1px solid rgba(95, 215, 238, 0.25);
    border-radius: 10px;
    color: #d8edf4;
    background: rgba(13, 43, 60, 0.9);
    font: inherit;
    font-size: 0.63rem;
    font-weight: 800;
    cursor: pointer;
}

.area-editor__collection-heading button:hover,
.home-area-editor__panel-heading button:hover,
.area-editor__actions button:hover:not(:disabled) { border-color: var(--area-cyan); color: #03161c; background: linear-gradient(135deg, var(--area-cyan), var(--area-mint)); }

.area-editor__field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.62rem; padding: 0.76rem; }
.area-editor__field { display: grid; gap: 0.32rem; color: #a9c4cf; font-size: 0.62rem; font-weight: 750; }
.area-editor__field--wide { grid-column: 1 / -1; }
.area-editor__field > span small { color: #6f8e9b; font-weight: 500; }
.area-editor__field input,
.area-editor__field select,
.area-editor__field textarea {
    width: 100%; min-width: 0; padding: 0.5rem 0.62rem; border: 1px solid rgba(103, 190, 221, 0.24);
    border-radius: 10px; outline: none; color: #eaf8fd; background: rgba(5, 21, 33, 0.92); font: inherit; font-size: 0.72rem;
}
.area-editor__field input,.area-editor__field select { min-height: 38px; }
.area-editor__field textarea { resize: vertical; line-height: 1.5; }
.area-editor__field input:focus,.area-editor__field select:focus,.area-editor__field textarea:focus { border-color: var(--area-cyan); box-shadow: 0 0 0 3px rgba(67, 218, 244, 0.1); }
.area-editor__field select option { color: #eefaff; background: #0a2232; }

.home-height-helper {
    display: grid;
    gap: 0.48rem;
    padding: 0.7rem;
    border: 1px solid rgba(117, 230, 191, 0.2);
    border-radius: 12px;
    background: linear-gradient(145deg, rgba(20, 85, 74, 0.2), rgba(6, 24, 36, 0.7));
}

.home-height-helper__heading > span,
.home-height-helper__heading > small {
    display: block;
}

.home-height-helper__heading > span {
    color: #dffaf2;
    font-size: 0.66rem;
    font-weight: 800;
}

.home-height-helper__heading > small {
    margin-top: 0.16rem;
    color: #8eacba;
    font-size: 0.57rem;
    line-height: 1.4;
}

.home-height-helper__controls {
    display: grid;
    grid-template-columns: 86px minmax(0, 1fr) auto;
    gap: 0.4rem;
}

.home-height-helper__controls input,
.home-height-helper__controls select,
.home-height-helper__controls button,
.home-height-helper__presets button {
    min-width: 0;
    min-height: 34px;
    padding: 0.38rem 0.5rem;
    border: 1px solid rgba(103, 190, 221, 0.24);
    border-radius: 9px;
    color: #eaf8fd;
    background: rgba(5, 21, 33, 0.92);
    font: inherit;
    font-size: 0.61rem;
}

.home-height-helper__controls button {
    border-color: rgba(117, 230, 191, 0.42);
    color: #06231e;
    background: linear-gradient(135deg, var(--area-mint), var(--area-cyan));
    font-weight: 800;
    cursor: pointer;
}

.home-height-helper__presets {
    display: flex;
    flex-wrap: wrap;
    gap: 0.32rem;
}

.home-height-helper__presets button {
    min-height: 27px;
    padding: 0.25rem 0.42rem;
    color: #b8d8e2;
    cursor: pointer;
}

.home-height-helper__presets button:hover,
.home-height-helper__presets button:focus-visible {
    border-color: var(--area-cyan);
    color: #efffff;
    outline: none;
}

.home-area-editor__panels,
.about-area-editor__list,
.images-area-editor__list { padding-bottom: 0.2rem; }

.home-panel-card.is-selected,
.about-editor-card.is-selected,
.brand-image-card.is-selected { border-color: rgba(117, 230, 191, 0.58); box-shadow: 0 0 0 2px rgba(117, 230, 191, 0.08), 0 16px 42px rgba(0,0,0,.25); }

.home-panel-card__summary,
.about-editor-card__summary,
.brand-image-card__summary {
    display: grid; width: 100%; min-height: 62px; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 0.65rem;
    padding: 0.68rem 0.75rem; border: 0; color: #eefaff; background: transparent; text-align: left; cursor: pointer;
}
.home-area-editor .home-panel-card__summary { gap:.48rem; padding:.58rem .42rem; }
.home-panel-card__number,.about-editor-card__number,.brand-image-card__icon {
    display:grid; place-items:center; min-width:34px; height:34px; padding:0 .35rem; border:1px solid rgba(191,164,250,.4); border-radius:10px;
    color:#ded1ff; background:rgba(100,65,174,.22); font-size:.66rem; font-weight:900;
}
.home-panel-card__identity strong,.home-panel-card__identity small,
.about-editor-card__summary span strong,.about-editor-card__summary span small,
.brand-image-card__summary span strong,.brand-image-card__summary span small { display:block; }
.home-panel-card__identity strong,.about-editor-card__summary span strong,.brand-image-card__summary span strong { font-size:.76rem; }
.home-panel-card__identity small,.about-editor-card__summary span small,.brand-image-card__summary span small { margin-top:.14rem; color:#8eacba; font-size:.58rem; }
.home-panel-card__body,.about-editor-card__body,.brand-image-card__body { padding:.75rem; border-top:1px solid rgba(95,215,238,.13); }
.home-panel-card__body { padding:.18rem; }
.home-panel-card__body > .area-editor__field-grid { padding:.2rem; gap:.4rem; }

.home-panel-card__upload,.home-element-editor__upload,.about-editor-card__upload { display:grid; gap:.38rem; margin:.1rem 0 .75rem; color:#a9c4cf; font-size:.62rem; font-weight:750; }
.home-panel-card__upload { margin:.08rem .2rem .4rem; }
.home-panel-card__elements { margin-top:.4rem; overflow:hidden; border:1px solid rgba(95,215,238,.14); border-radius:13px; background:rgba(3,16,25,.46); }
.home-panel-card__elements > .area-editor__section-heading { padding:.58rem .45rem; }
.home-panel-card__add-menu { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.3rem; }
.home-panel-card__add-menu button { min-height:30px; padding:.34rem .48rem; font-size:.57rem; }
.home-panel-card__add-menu button:hover { border-color:var(--area-mint); color:#04191c; background:var(--area-mint); }
.home-element-row { display:grid; width:calc(100% - .5rem); grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:.48rem; margin:.25rem; padding:.5rem .52rem; border:1px solid rgba(95,215,238,.12); border-radius:10px; color:#d8edf4; background:rgba(10,35,50,.72); text-align:left; cursor:pointer; }
.home-element-row.is-active,.home-element-row:hover { border-color:rgba(67,218,244,.52); background:rgba(25,67,84,.72); }
.home-element-row > i:first-child { color:var(--area-cyan); }
.home-element-row span strong,.home-element-row span small { display:block; }
.home-element-row span strong { font-size:.68rem; }.home-element-row span small { color:#7897a5; font-size:.56rem; }
.home-element-editor { display:grid; gap:.42rem; margin:.25rem; padding:.4rem; border:1px solid rgba(191,164,250,.3); border-radius:13px; background:linear-gradient(145deg,rgba(55,39,98,.25),rgba(6,25,38,.92)); }
.home-panel-card:has(.home-rich-text-editor),
.home-panel-card__elements:has(.home-rich-text-editor) { overflow:visible; }
.home-rich-text-editor { position:relative; z-index:6; min-width:0; }
.home-rich-text-editor > span { display:block; margin-bottom:.3rem; color:#d8edf4; font-size:.64rem; font-weight:760; }
.home-rich-text-editor .e-richtexteditor { position:relative; z-index:1; }
body > .e-rte-dropdown-popup,
body > .e-rte-color-popup,
body > .e-dropdown-popup.e-popup,
body > .e-colorpicker-popup.e-popup { z-index:100050 !important; }
.home-element-editor__heading { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.home-element-editor__heading span,.home-element-editor__heading strong { display:block; }.home-element-editor__heading span { color:var(--area-violet);font-size:.54rem;font-weight:850;letter-spacing:.13em;}.home-element-editor__heading strong{font-size:.75rem;}
.home-element-editor__heading button { width:30px;height:30px;border:1px solid rgba(95,215,238,.2);border-radius:9px;color:#adcbd6;background:rgba(10,35,50,.8);cursor:pointer; }

.home-element-style-editor { overflow:hidden; border:1px solid rgba(95,215,238,.18); border-radius:12px; background:rgba(3,17,27,.58); }
.home-element-style-editor__header { display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem; padding:.58rem .62rem; border-bottom:1px solid rgba(95,215,238,.12); }
.home-element-style-editor__header span,.home-element-style-editor__header strong,.home-element-style-editor__header small { display:block; }
.home-element-style-editor__header > div > span { color:var(--area-violet);font-size:.5rem;font-weight:850;letter-spacing:.13em; }
.home-element-style-editor__header strong { margin-top:.1rem;color:#e9f8fc;font-size:.72rem; }
.home-element-style-editor__header small { margin-top:.15rem;color:#7899a7;font-size:.55rem;line-height:1.4; }
.home-element-style-editor__header .home-element-style-editor__count { flex:0 0 auto;padding:.22rem .38rem;border:1px solid rgba(117,230,191,.22);border-radius:999px;color:#a8ecd4;background:rgba(27,92,77,.18);font-size:.52rem;font-weight:850; }
.home-element-style-editor__profiles { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.3rem;padding:.48rem .55rem 0; }
.home-element-style-editor__profiles button { display:inline-flex;min-width:0;min-height:30px;align-items:center;justify-content:center;gap:.28rem;padding:.32rem .4rem;border:1px solid rgba(95,215,238,.16);border-radius:8px;color:#82a5b2;background:rgba(7,29,42,.78);font-size:.56rem;font-weight:800;cursor:pointer; }
.home-element-style-editor__profiles button.is-active { border-color:rgba(117,230,191,.5);color:#dffff5;background:linear-gradient(135deg,rgba(46,137,123,.45),rgba(42,112,145,.4));box-shadow:0 0 14px rgba(75,226,205,.1); }
.home-element-style-editor__search { position:relative;display:flex;align-items:center;margin:.45rem .55rem; }
.home-element-style-editor__search > i { position:absolute;left:.55rem;color:#6d9cac;font-size:.68rem;pointer-events:none; }
.home-element-style-editor__search input { width:100%;min-width:0;height:32px;padding:0 .55rem 0 1.7rem;border:1px solid rgba(95,215,238,.18);border-radius:9px;outline:none;color:#e7f6fb;background:rgba(3,18,29,.86);font-size:.61rem; }
.home-element-style-editor__search input:focus { border-color:var(--area-cyan);box-shadow:0 0 0 2px rgba(67,218,244,.08); }
.home-element-style-editor__groups { display:grid;gap:.34rem;padding:0 .55rem .52rem; }
.home-style-group { overflow:hidden;border:1px solid rgba(95,215,238,.13);border-radius:9px;background:rgba(7,29,42,.62); }
.home-style-group > summary { display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:.4rem;padding:.5rem .55rem;color:#d8edf4;cursor:pointer;list-style:none;font-size:.59rem;font-weight:820; }
.home-style-group > summary::-webkit-details-marker { display:none; }
.home-style-group > summary small { display:grid;place-items:center;min-width:20px;height:20px;border-radius:999px;color:#91b7c3;background:rgba(95,215,238,.09);font-size:.49rem; }
.home-style-group > summary i { color:#7ca6b5;font-size:.58rem;transition:transform 160ms ease; }
.home-style-group[open] > summary i { transform:rotate(180deg); }
.home-style-group__fields { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.38rem;padding:.42rem;border-top:1px solid rgba(95,215,238,.1); }
.home-style-property { display:grid;min-width:0;align-content:start;gap:.28rem;padding:.42rem;border:1px solid rgba(95,215,238,.1);border-radius:8px;background:rgba(3,17,27,.62); }
.home-style-property--wide { grid-column:1/-1; }
.home-style-property__heading { display:flex;min-width:0;align-items:center;justify-content:space-between;gap:.25rem;color:#cfe8ef;font-size:.54rem;font-weight:760; }
.home-style-property__heading > span:first-child { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.home-style-property__help { display:grid;flex:0 0 auto;width:16px;height:16px;place-items:center;border:1px solid rgba(191,164,250,.22);border-radius:50%;color:#bda9ed;font-size:.45rem;cursor:help; }
.home-style-property > input,.home-style-property > select,.home-style-property__color > input[type="text"] { width:100%;min-width:0;height:30px;padding:0 .42rem;border:1px solid rgba(103,190,221,.2);border-radius:7px;outline:none;color:#eaf8fd;background:rgba(5,21,33,.94);font:inherit;font-size:.56rem; }
.home-style-property > input:focus,.home-style-property > select:focus,.home-style-property__color > input[type="text"]:focus { border-color:var(--area-cyan);box-shadow:0 0 0 2px rgba(67,218,244,.08); }
.home-style-property > select option { color:#eefaff;background:#0a2232; }
.home-style-property__color { display:grid;grid-template-columns:30px minmax(0,1fr);gap:.28rem; }
.home-style-property__color > input[type="color"] { width:30px;height:30px;padding:2px;border:1px solid rgba(103,190,221,.2);border-radius:7px;background:rgba(5,21,33,.94);cursor:pointer; }
.home-element-style-editor__empty { display:flex;align-items:center;justify-content:center;gap:.35rem;margin:0 .55rem .52rem;padding:.7rem;border:1px dashed rgba(95,215,238,.18);border-radius:9px;color:#7f9eaa;font-size:.57rem;text-align:center; }
.home-element-style-editor__advanced { margin:0 .55rem .55rem;border-top:1px solid rgba(95,215,238,.11); }
.home-element-style-editor__advanced > summary { display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.48rem .1rem;color:#91b7c3;cursor:pointer;list-style:none;font-size:.57rem;font-weight:760; }
.home-element-style-editor__advanced > summary::-webkit-details-marker { display:none; }
.home-element-style-editor__advanced > summary span { display:inline-flex;align-items:center;gap:.3rem; }
.home-element-style-editor__advanced > summary small { color:var(--area-violet);font-size:.5rem; }
.home-element-style-editor__advanced .area-editor__field { padding:.15rem 0 .1rem; }

.area-editor__actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:.42rem; margin-top:.65rem; }
.area-editor__actions--panel { border-top:1px solid rgba(95,215,238,.12); padding-top:.7rem; }
.area-editor__actions .area-editor__primary { border-color:rgba(117,230,191,.42); color:#06231e; background:linear-gradient(135deg,var(--area-mint),var(--area-cyan)); }
.area-editor__actions .area-editor__danger { margin-right:auto; border-color:rgba(255,115,132,.28); color:#ffb6c0; background:rgba(89,31,45,.35); }
.area-editor__actions button:disabled { cursor:not-allowed; opacity:.42; }
.area-editor__draft-note { display:inline-flex; align-items:center; gap:.35rem; color:#83a2af; font-size:.58rem; }
.area-editor__draft-note i { color:var(--area-mint); }

.brand-image-card__body { padding:.85rem; }
.brand-image-card__meta { display:flex; gap:.42rem; margin-top:.65rem; color:#829fac; font-size:.6rem; line-height:1.5; }
.brand-image-card__meta i { color:var(--area-cyan); }

.area-editor__feedback { margin:.75rem; padding:.65rem .72rem; border:1px solid rgba(117,230,191,.25); border-radius:11px; color:#a9edd6; background:rgba(20,85,74,.18); font-size:.65rem; line-height:1.45; }
.area-editor__feedback.is-error { border-color:rgba(255,115,132,.28); color:#ffb4be; background:rgba(89,31,45,.24); }
.area-editor__empty { display:grid; place-items:center; gap:.35rem; margin:.8rem; padding:1.6rem 1rem; border:1px dashed rgba(95,215,238,.24); border-radius:15px; color:#8eacba; text-align:center; }
.area-editor__empty i { color:var(--area-violet); font-size:1.45rem; }.area-editor__empty strong { color:#eaf8fd;font-size:.78rem; }.area-editor__empty span { font-size:.62rem; }

@keyframes css-area-spin { to { transform:rotate(360deg); } }
@media (max-width:520px) { .area-editor__field-grid{grid-template-columns:1fr}.area-editor__field--wide{grid-column:auto}.home-panel-card__add-menu{justify-content:flex-start}.area-editor__section-heading{align-items:flex-start;flex-direction:column}.home-style-group__fields{grid-template-columns:1fr}.home-style-property--wide{grid-column:auto} }
.home-grid-editor,
.home-grid-editor__confirmation {
    display: grid;
    gap: .65rem;
    margin: .75rem .2rem;
    padding: .7rem;
    border: 1px solid rgba(95, 215, 238, .24);
    border-radius: 12px;
    background: rgba(3, 16, 25, .5);
}

.home-grid-editor .area-editor__section-heading {
    min-height: auto;
    padding: 0 0 .5rem;
    border-bottom: 1px solid rgba(95, 215, 238, .14);
    background: transparent;
}

.home-grid-editor > p {
    margin: 0;
    color: #9ebbc7;
    font-size: .66rem;
    line-height: 1.55;
}

.home-grid-editor button,
.home-grid-editor__confirmation button {
    display: inline-flex;
    width: fit-content;
    min-height: 30px;
    align-items: center;
    justify-content: center;
    gap: .32rem;
    padding: .32rem .52rem;
    border: 1px solid rgba(95, 215, 238, .28);
    border-radius: 8px;
    color: #d8edf4;
    background: rgba(13, 43, 60, .92);
    font: inherit;
    font-size: .6rem;
    font-weight: 800;
    line-height: 1.15;
    cursor: pointer;
    transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 160ms ease;
}

.home-grid-editor button:hover:not(:disabled),
.home-grid-editor__confirmation button:hover:not(:disabled) {
    border-color: var(--area-cyan);
    color: #eefcff;
    background: rgba(25, 67, 84, .92);
}

.home-grid-editor button:focus-visible,
.home-grid-editor__confirmation button:focus-visible {
    outline: 2px solid var(--area-mint);
    outline-offset: 2px;
}

.home-grid-editor button:disabled,
.home-grid-editor__confirmation button:disabled { opacity: .42; cursor: default; }

.home-grid-editor__primary {
    border-color: rgba(67, 218, 244, .65) !important;
    color: #03161c !important;
    background: linear-gradient(135deg, var(--area-cyan), var(--area-mint)) !important;
}

.home-grid-editor__primary:hover:not(:disabled) { transform: translateY(-1px); }
.home-grid-editor__add i { color: var(--area-mint); }
.home-grid-editor__remove { color: #f5b8c0 !important; border-color: rgba(255, 135, 151, .3) !important; }
.home-grid-editor__remove:hover:not(:disabled) { border-color: #ffabb6 !important; background: rgba(111, 37, 52, .72) !important; }

.home-grid-editor__row {
    display: grid;
    gap: .5rem;
    padding: .58rem;
    border: 1px solid rgba(95, 215, 238, .14);
    border-radius: 10px;
    background: rgba(8, 29, 43, .56);
}

.home-grid-editor__row .area-editor__section-heading { padding-bottom: .4rem; }
.home-grid-editor__row .area-editor__section-heading > strong { color: #e4f6fa; font-size: .67rem; }
.home-grid-editor__cells { display: grid; grid-template-columns: repeat(var(--home-grid-columns, 1), minmax(7rem, 1fr)); gap: .45rem; min-width: 0; max-width: 100%; overflow-x: auto; padding-bottom: .3rem; }

.home-grid-editor__cell {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: stretch;
    gap: .42rem;
    padding: .5rem;
    border: 1px dashed rgba(117, 230, 191, .45);
    border-radius: 9px;
    background: rgba(4, 21, 33, .68);
}

.home-grid-editor__cell[data-home-grid-drop-target] {
    border-color: var(--area-mint);
    background: rgba(117, 230, 191, .15);
    box-shadow: inset 0 0 0 1px rgba(117, 230, 191, .42);
}

.home-grid-editor__item[data-home-grid-dragging] { opacity: .55; }
.home-grid-editor__status { margin: 0; color: #ffb9c1; font-size: .62rem; line-height: 1.4; }
.home-grid-editor__status[hidden] { display: none !important; }

.home-grid-editor__cell-select {
    width: 100% !important;
    justify-content: flex-start !important;
    color: #bff6f9 !important;
    background: rgba(67, 218, 244, .1) !important;
}

.home-grid-editor__item {
    width: 100% !important;
    justify-content: flex-start !important;
    overflow: hidden;
    color: #e8f8fb !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: grab !important;
}

.home-grid-editor__item:active { cursor: grabbing !important; }
.home-grid-editor__cell small { color: #84a6b5; font-size: .56rem; }
.home-grid-editor__cell .home-grid-editor__remove { align-self: flex-start; margin-top: auto; }
.home-grid-color-control { display: flex; align-items: center; gap: .35rem; min-width: 0; }
.home-grid-color-control input[type="color"] { flex: none; width: 2.3rem; min-width: 2.3rem; height: 2rem; padding: .12rem; cursor: pointer; }
.home-grid-color-control input[type="text"] { flex: 1; min-width: 0; }
.home-grid-opacity-control { display: grid; gap: .2rem; width: 100%; }
.home-grid-opacity-control span { color: #9dbfcc; font-size: .59rem; }
.home-grid-opacity-control input[type="range"] { width: 100%; accent-color: var(--area-mint); }
.home-grid-editor__appearance { min-width: 0; padding: .25rem; border: 1px solid rgba(95,215,238,.16); border-radius: 8px; }
.home-grid-editor__appearance summary { color: #b9dce7; font-size: .58rem; cursor: pointer; }
.home-grid-editor__appearance label { display: grid; gap: .2rem; min-width: 0; margin-top: .4rem; color: #b9dce7; font-size: .56rem; }
.home-grid-editor__appearance input[type="text"] { width: 100%; min-width: 0; padding: .3rem; border: 1px solid rgba(95,215,238,.32); border-radius: 6px; color: #effaff; background: #092032; font-size: .58rem; }
.home-grid-editor__appearance input[type="range"] { width: 100%; accent-color: var(--area-mint); }

.home-grid-editor__confirmation {
    border-color: rgba(67, 218, 244, .52);
    background: linear-gradient(145deg, rgba(16, 55, 72, .92), rgba(6, 24, 36, .96));
}

.home-grid-editor__confirmation > strong { color: #d9faff; font-size: .7rem; }
.home-grid-editor__confirmation > p { margin: 0; color: #a8c5d0; font-size: .64rem; line-height: 1.45; }
.home-grid-editor__confirmation > .area-editor__field { max-width: 18rem; }
.home-grid-editor__cancel { border-color: rgba(169, 196, 207, .35) !important; color: #b8ced6 !important; background: transparent !important; }
.home-carousel-editor {
    display: grid;
    gap: .85rem;
    padding: .9rem;
    border: 1px solid #2b6076;
    border-radius: 14px;
    background: #0b2634;
}

.home-carousel-editor__heading,
.home-carousel-editor__slide-actions {
    display: flex;
    align-items: center;
    gap: .45rem;
}

.home-carousel-editor__heading { justify-content: space-between; }
.home-carousel-editor__heading small { color: #a9c4d1; }

.home-carousel-editor__slide {
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    gap: .75rem;
    padding: .65rem;
    border: 1px solid #31586b;
    border-radius: 12px;
    background: #103142;
}

.home-carousel-editor__slide > img {
    width: 82px;
    height: 82px;
    border-radius: 8px;
    object-fit: cover;
}

.home-carousel-editor__slide-content { display: grid; gap: .55rem; min-width: 0; }
.home-carousel-editor__slide-actions button {
    min-width: 2rem;
    min-height: 2rem;
    border: 1px solid #3a7085;
    border-radius: 8px;
    color: #e7f6fa;
    background: #173d50;
    cursor: pointer;
}
.home-carousel-editor__slide-actions button:disabled { opacity: .4; cursor: default; }
.home-carousel-editor__slide-actions button:last-child { color: #ffb8bb; }
.home-carousel-editor__upload { display: grid; gap: .4rem; }
.home-carousel-editor__autoplay { display: flex; align-items: center; gap: .5rem; }