*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#050914;color:#f7f8ff;font-family:Inter,Segoe UI,Arial,sans-serif}body{overflow-x:hidden}a{color:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:260px minmax(0,1fr);background:radial-gradient(circle at 65% 0,#0c1020 0,#050914 35%)}.sidebar{position:sticky;top:0;height:100vh;padding:24px 18px;border-right:1px solid #20263a;background:linear-gradient(180deg,#07101c,#050914);display:flex;flex-direction:column;z-index:20}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;padding:0 8px 22px}.brand img{width:54px;height:54px}.brand-copy{display:grid;gap:3px}.brand-copy b{font-size:25px;letter-spacing:.5px}.brand-copy small{font-size:11px;color:#aeb6ca}.side-nav{display:grid;gap:5px}.side-nav a{min-height:46px;padding:0 14px;border-radius:10px;display:flex;align-items:center;gap:12px;text-decoration:none;color:#dce1ef}.side-nav a:hover,.side-nav a.active{background:linear-gradient(90deg,#6d20df,#461392);box-shadow:0 0 24px #6c23e333}.nav-badge{margin-left:auto;background:#7626e7;border-radius:99px;padding:3px 8px}.sidebar-plan{margin-top:auto;border:1px solid #242c41;border-radius:14px;padding:17px;background:linear-gradient(160deg,#0b111e,#08101c)}.sidebar-plan small,.sidebar-plan b{display:block;color:#aeb6ca;margin:5px 0}.sidebar-plan strong{display:block;color:#a847ff;font-size:25px;margin:8px 0}.sidebar-plan a{color:#bd62ff;text-decoration:none;font-size:13px}.sidebar-plan hr{border:0;border-top:1px solid #222a3e;margin:16px 0}.sidebar-user{margin-top:14px;border:1px solid #242c41;border-radius:14px;padding:13px;display:flex;align-items:center;gap:10px}.sidebar-user>span{width:38px;height:38px;border-radius:50%;background:#4e1c93;display:grid;place-items:center}.sidebar-user div{display:grid;gap:3px}.sidebar-user small{color:#9ea7bb}.sidebar-user i{margin-left:auto}.workspace{width:100%;min-width:0;padding:24px 28px 28px}.page-top{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:22px}.page-top h1{font-size:31px;margin:0 0 8px}.page-top p{margin:0;color:#aeb6ca}.top-tools{display:flex;gap:10px}.top-tools button,.top-tools a,.primary{min-height:42px;border:1px solid #273049;background:#09101d;color:#fff;border-radius:10px;padding:0 14px;text-decoration:none;display:grid;place-items:center}.primary{background:linear-gradient(135deg,#7b2ee8,#5b19ca);border-color:#8e45f1;cursor:pointer}.avatar{background:#4d1b91!important}.hero{min-height:208px;border:1px solid #293049;border-radius:15px;padding:31px 34px;display:flex;justify-content:space-between;overflow:hidden;background:linear-gradient(105deg,#09101c 0,#101126 43%,#34105d 100%)}.hero small{color:#ca63ff}.hero h2{font-size:35px;margin:12px 0}.hero p{color:#b8c0d3}.hero h2 i{display:inline-block;width:13px;height:13px;border-radius:50%;background:#ff9e25}.hero h2 i.on{background:#38e77b}.hero-links{display:flex;gap:25px;align-items:center}.hero-links a{color:#c85eff;text-decoration:none}.hero-links span{color:#aeb6ca}.orbit-art{width:300px;position:relative;flex:0 0 300px}.orbit{position:absolute;border:1px solid #8c37e9;border-radius:50%;inset:30px 15px;transform:rotate(12deg)}.orbit.o2{transform:rotate(-18deg);inset:52px 0}.smark{position:absolute;left:112px;top:38px;width:94px;height:94px;border:2px solid #c977ff;transform:rotate(30deg);display:grid;place-items:center;font-size:48px;font-weight:900;box-shadow:0 0 35px #8a2eff}.smark::first-letter{transform:rotate(-30deg)}.ok{position:absolute;left:102px;bottom:18px;width:45px;height:45px;border:2px solid #00e875;border-radius:50%;display:grid;place-items:center;color:#00e875;font-size:25px;background:#07101c}.kpis{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:14px;margin:18px 0}.kpis article{min-height:136px;border:1px solid #252d42;border-radius:14px;background:#09101c;padding:20px;display:flex;gap:16px;align-items:flex-start}.kpis em{width:52px;height:52px;border-radius:14px;background:#2a105c;color:#aa4dff;display:grid;place-items:center;font-size:29px;font-style:normal;flex:0 0 auto}.kpis em.green{background:#0b3c28;color:#35ed7a}.kpis em.orange{background:#4b2c08;color:#ffac2c}.kpis em.blue{background:#0a2a56;color:#3ba4ff}.kpis article>div{display:grid;gap:6px}.kpis strong{font-size:29px}.kpis span,.kpis small{color:#aeb6ca}.greenText{color:#35eb78!important}.orangeText{color:#ff9d18!important}.blueText{color:#38a7ff!important}.health{justify-content:space-between}.spark{font-size:54px;color:#aa48ff;align-self:center}.dashboard-grid{display:grid;grid-template-columns:1.05fr 1.25fr 1.15fr;gap:14px}.panel{border:1px solid #252d42;border-radius:14px;background:#09101c;overflow:hidden}.panel h3{margin:0;padding:18px 20px;border-bottom:1px solid #252d42;font-size:17px}.panel h3 a{float:right;color:#b85dff;text-decoration:none;font-size:13px;font-weight:400}.actions>a,.feed{min-height:69px;margin:0 20px;padding:12px 0;border-bottom:1px solid #222a3d;display:flex;align-items:center;gap:13px;text-decoration:none}.actions b,.feed i{width:38px;height:38px;border-radius:9px;background:#291254;color:#c87bff;display:grid;place-items:center;font-style:normal}.actions span,.feed span{display:grid;gap:5px}.actions small,.feed small{color:#9ea7ba}.actions i,.feed time{margin-left:auto;color:#aeb6ca}.feed i{border:2px solid #2de977;background:transparent;color:#2de977;border-radius:50%}.feed.warn i{border-color:#ff9d18;color:#ff9d18}.muted{padding:20px;color:#929bad}.help-strip{margin-top:18px;min-height:116px;padding:20px 26px;border:1px solid #4c2088;border-radius:15px;background:linear-gradient(90deg,#1b0e37,#371361 50%,#21103e);display:flex;align-items:center;gap:18px}.chatIcon{width:58px;height:58px;border-radius:50%;background:#563099;display:grid;place-items:center;font-size:29px}.help-strip h3{margin:0 0 7px}.help-strip p{margin:0;color:#d2cce0}.help-strip a{margin-left:auto;padding:15px 18px;border:1px solid #6235a2;border-radius:10px;text-decoration:none;background:#5b279d44;white-space:nowrap}

/* Catalog */
.catalog-title{margin-bottom:14px}.hidden{display:none!important}.online-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#37e878;margin:0 6px}.catalog-kpis{margin-top:0}.catalog-toolbar{display:grid;grid-template-columns:minmax(240px,2fr) repeat(6,minmax(110px,.7fr)) 46px 46px;gap:10px;margin:14px 0}.catalog-toolbar select,.searchbox{height:46px;border:1px solid #273049;background:#09101d;color:#fff;border-radius:10px}.searchbox{display:flex;align-items:center;gap:10px;padding:0 14px;font-size:24px}.searchbox input{width:100%;border:0;outline:0;background:transparent;color:#fff}.catalog-toolbar select{padding:0 12px}.view-btn{border:1px solid #313a54;border-radius:10px;background:#0a1120;color:#fff;font-size:20px}.view-btn.active{background:linear-gradient(135deg,#7b2ee8,#5b19ca)}.bulkbar{min-height:54px;border:1px solid #273049;border-radius:11px;background:#09101d;padding:8px 14px;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.bulkbar div{display:flex;gap:9px}.bulkbar button{height:38px;border:1px solid #313a54;background:#0b1220;color:#fff;border-radius:8px;padding:0 16px}.bulkbar button:first-child{background:#30135b;border-color:#6f2ac2}.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.product-card{border:1px solid #2a3248;border-radius:13px;background:#09101c;overflow:hidden;min-width:0;transition:.18s transform,.18s border-color}.product-card:hover{transform:translateY(-2px);border-color:#7133bd}.product-img{height:185px;background:#f4f5f8;position:relative;overflow:hidden}.product-img img{width:100%;height:100%;object-fit:contain}.product-placeholder{height:100%;display:grid;place-items:center;color:#6e7482}.product-placeholder b{font-size:42px}.product-body{padding:12px}.product-top{display:flex;justify-content:space-between;gap:8px;align-items:center}.status,.store-chip,.category-chip{font-size:10px;border-radius:99px;padding:4px 8px;background:#161c2b;color:#b9c1d4}.status.optimized{background:#0d5b32;color:#e9fff2}.status.attention{background:#6b3d09;color:#fff1d5}.product-body h3{font-size:14px;line-height:1.35;margin:10px 0;height:38px;overflow:hidden}.product-meta{display:flex;justify-content:space-between;color:#7f899f;font-size:11px}.product-foot{display:flex;align-items:center;justify-content:space-between;margin-top:12px}.product-foot strong{font-size:18px}.score{width:50px;height:50px;border-radius:50%;border:3px solid #32e87a;display:grid;place-items:center;font-weight:700;font-size:12px}.card-actions{display:grid;grid-template-columns:1fr 1.25fr 38px;gap:7px;margin-top:10px}.card-actions a,.card-actions button{height:34px;border:1px solid #6730a5;border-radius:7px;background:#0a1120;color:#d98cff;text-decoration:none;display:grid;place-items:center}.catalog-footer{height:58px;margin-top:12px;border:1px solid #273049;border-radius:11px;background:#09101d;padding:0 16px;display:flex;align-items:center;justify-content:space-between;color:#aeb6ca}.catalog-footer div{display:flex;align-items:center;gap:10px}.catalog-footer button{width:36px;height:36px;border:1px solid #273049;background:#0c1423;color:#fff;border-radius:8px}.loading,.error{padding:15px}.hidden{display:none!important}.list-view{grid-template-columns:1fr}.list-view .product-card{display:grid}.list-view .product-main{display:grid;grid-template-columns:210px 1fr}.list-view .product-img{height:150px}

.product-card.is-plan-locked{opacity:.78;border-color:#3a3148}
.product-card.is-plan-locked:hover{border-color:#6b4a2a}
.plan-access-chip{display:inline-block;margin:0 0 8px;font-size:11px;border-radius:8px;padding:5px 9px;background:#3a2a12;color:#ffc46a}
.plan-upgrade-cta{background:linear-gradient(135deg,#a65b16,#7a3d0c)!important;border-color:#c47a2a!important;color:#fff7ea!important}
.product-card.is-plan-locked .card-actions{grid-template-columns:1fr 1.4fr}
/* Existing pages inherit the same full-width shell */
.workspace>header:not(.page-top){max-width:none}.card,.settings-card,.plan-card,.integration-card{border-color:#273049!important;background:#09101c!important}
@media(max-width:1500px){.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-toolbar{grid-template-columns:minmax(280px,2fr) repeat(3,1fr);}.catalog-toolbar .view-btn{display:none}.kpis{grid-template-columns:repeat(3,1fr)}.dashboard-grid{grid-template-columns:1fr 1fr}.dashboard-grid .panel:last-child{grid-column:1/-1}}
@media(max-width:1100px){.app-shell{grid-template-columns:210px minmax(0,1fr)}.workspace{padding:20px}.brand-copy b{font-size:20px}.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.kpis{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}.dashboard-grid .panel:last-child{grid-column:auto}.orbit-art{display:none}.help-strip{flex-wrap:wrap}.help-strip a{margin-left:0}}
@media(max-width:760px){.app-shell{display:block}.workspace{padding:15px}.page-top{align-items:flex-start}.top-tools{display:none}.hero{padding:22px}.kpis,.product-grid{grid-template-columns:1fr}.catalog-toolbar{grid-template-columns:1fr 1fr}.searchbox{grid-column:1/-1}.bulkbar{align-items:flex-start;gap:10px;flex-direction:column}.bulkbar div{flex-wrap:wrap}.help-strip{display:grid}.product-img{height:220px}}/* Sellora V1.5.9 unified UI */
.workspace{max-width:none;min-height:100vh}.workspace>header:not(.page-top){display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.workspace>header h2{font-size:31px;margin:0 0 8px}.workspace>header p{color:#aeb6ca;margin:0}.action-link,.secondary,.row-actions button,.store-actions button,.store-actions a,.provider-card button{border:1px solid #313a54;background:#0b1220;color:#fff;border-radius:9px;padding:11px 15px;text-decoration:none}.compact{grid-template-columns:repeat(4,1fr)}.compact article{min-height:116px}.feature-card,.autopilot-hero,.support-hero{border:1px solid #342653;border-radius:16px;background:linear-gradient(110deg,#09101c 0,#101126 48%,#32105a 100%);padding:28px 32px;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between;gap:30px}.feature-card small,.autopilot-hero small,.support-hero small,.panel-title small{color:#bd61ff;letter-spacing:.06em}.feature-card h2,.autopilot-hero h2,.support-hero h2,.panel-title h2{margin:8px 0;font-size:24px}.feature-card p,.autopilot-hero p,.support-hero p{color:#aeb6ca}.control-stack{display:flex;align-items:center;gap:10px}.control-stack select,.top-select,.form-grid select{height:44px;border:1px solid #303850;background:#0a1120;color:#fff;border-radius:9px;padding:0 13px}.toggle{display:flex;align-items:center;gap:8px}.toggle input{accent-color:#8c37e9}.panel{margin-bottom:18px}.panel-title{padding:18px 20px;border-bottom:1px solid #252d42;display:flex;align-items:center;justify-content:space-between;gap:18px}.panel-title h2{font-size:19px}.row-actions{display:flex;gap:9px}.queue.modern{padding:0 20px 20px}.queue-row{padding:13px 0;border-bottom:1px solid #222a3d;display:flex;justify-content:space-between;gap:16px}.queue-row span{color:#9ea7ba}.autopilot-hero h2{font-size:36px}.autopilot-hero h2 i{display:inline-block;width:13px;height:13px;border-radius:50%;background:#ff9e25}.autopilot-hero h2 i.on{background:#38e77b}.hero-pills{display:flex;gap:10px;flex-wrap:wrap}.hero-pills span,.count-pill{border:1px solid #3a3150;background:#151026;border-radius:99px;padding:8px 12px;color:#bfc5d5}.ai-orb{width:150px;height:150px;border:2px solid #a74cff;border-radius:36% 64% 60% 40%;display:grid;place-items:center;font-size:62px;font-weight:900;box-shadow:0 0 55px #812ee966;position:relative}.ai-orb span{position:absolute;right:0;bottom:0;width:42px;height:42px;border:2px solid #2de977;background:#07101c;border-radius:50%;display:grid;place-items:center;color:#2de977;font-size:22px}.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.metric{padding:22px;display:grid;gap:8px}.metric strong{font-size:25px}.metric span,.metric small{color:#aeb6ca}.rule-grid{padding:20px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.rule-grid div{border:1px solid #273049;border-radius:10px;padding:16px;color:#cfd4e1}.analytics-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:14px}.chart-panel{min-height:390px}.empty-chart{height:310px;display:grid;place-items:center;align-content:center;gap:10px;color:#929bad}.chart-line{font-size:100px;color:#a84cff}.health-ring{width:190px;height:190px;border:18px solid #25d66f;border-right-color:#7132c2;border-radius:50%;margin:32px auto 20px;display:grid;place-items:center;align-content:center}.health-ring strong{font-size:38px}.health-ring span{color:#aeb6ca}.legend{padding:0 25px 25px;display:grid;gap:12px}.legend span{display:flex;justify-content:space-between}.store-grid{padding:20px}.store-card{border:1px solid #2b3349;border-radius:14px;padding:20px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:center}.platform-logo{width:54px;height:54px;border-radius:14px;background:linear-gradient(135deg,#8e38ef,#4d16a7);display:grid;place-items:center;font-size:26px;font-weight:800}.store-card h3,.provider-card h3{margin:0 0 7px}.store-card p,.provider-card p{color:#9fa8bc}.connected{color:#35eb78}.store-actions{display:flex;gap:8px}.provider-grid{padding:20px;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.provider-card{border:1px solid #2b3349;border-radius:14px;padding:20px}.provider-card .platform-logo{margin-bottom:18px}.provider-card a,.provider-card button{display:inline-block;margin-top:12px}.support-hero{display:grid;grid-template-columns:1fr minmax(360px,.8fr)}.help-search{height:58px;border:1px solid #6736a1;background:#0a1120;border-radius:12px;display:flex;align-items:center;padding:0 18px;font-size:24px}.help-search input{width:100%;background:transparent;border:0;outline:0;color:#fff;padding-left:10px}.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.faq-item{border-bottom:1px solid #252d42;padding:0 20px}.faq-item summary{padding:17px 0;cursor:pointer;display:flex;justify-content:space-between;font-weight:600}.faq-item p{color:#b7bfd0;line-height:1.55}.faq-item small{display:block;color:#a959ff;margin-bottom:16px}.ai-help textarea{width:calc(100% - 40px);margin:0 20px 14px;min-height:92px;border:1px solid #303850;background:#070d18;color:#fff;border-radius:10px;padding:13px;resize:vertical}.support-chat{margin:20px;height:190px;overflow:auto;display:flex;flex-direction:column;gap:10px}.bot-msg,.user-msg{max-width:82%;padding:11px 13px;border-radius:12px;margin:0;background:#151c2b}.user-msg{align-self:flex-end;background:#431a78}.connect-actions{display:flex;gap:10px;padding:0 20px}.connect-actions button{min-height:42px;border:1px solid #313a54;background:#0b1220;color:#fff;border-radius:9px;padding:0 14px}.ticket{padding:16px 20px;border-bottom:1px solid #252d42}.ticket span{margin-left:10px;color:#35eb78}.ticket small{float:right;color:#929bad}.ticket p{color:#b5bdcf}.empty-state{padding:30px;color:#929bad}.settings-layout{display:grid;gap:14px}.settings-section{margin:0}.form-grid{padding:20px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.form-grid label{display:grid;gap:9px;color:#b8c0d3}.billing-row{padding:20px;display:grid;grid-template-columns:1fr 1fr auto;gap:20px;align-items:center}.billing-row div{display:grid;gap:6px}.billing-row span,.billing-row small{color:#9fa8bc}.billing-row strong{font-size:20px}.billing-row a,.panel-title a{color:#c361ff;text-decoration:none}.setting-lines{padding:0 20px}.setting-lines>div{padding:16px 0;border-bottom:1px solid #252d42;display:flex;justify-content:space-between;align-items:center}.setting-lines span{display:grid;gap:4px}.setting-lines small{color:#929bad}.settings-section:last-child .setting-lines>div:last-child{border-bottom:0}
@media(min-width:1600px){.workspace{padding-left:32px;padding-right:32px}.product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.compact,.provider-grid{grid-template-columns:repeat(2,1fr)}.analytics-grid,.support-grid{grid-template-columns:1fr}.support-hero{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.billing-row{grid-template-columns:1fr}.rule-grid{grid-template-columns:1fr}}
.brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.brand .sellora-logo {
    width: 59px;
    height: 59px;
    object-fit: contain;
    display: block;
    flex: 0 0 59px;
}

.brand-copy {
    display: flex;
    flex-direction: column;
}

.brand-copy b {
    line-height: 1;
}

.brand-copy small {
    margin-top: 5px;
    white-space: nowrap;
}

.add-store-btn{
    min-height:42px;
    border:1px solid #8b4cff;
    background:linear-gradient(135deg,#7b2ee8,#5b19ca);
    color:#fff;
    border-radius:10px;
    padding:0 16px;
    text-decoration:none;
    display:grid;
    place-items:center;
    font-weight:600;
    box-shadow:0 0 18px rgba(124,46,232,.25);
}
.add-store-btn:hover{
    box-shadow:0 0 28px rgba(124,46,232,.45);
}


/* V1.6.5 Optimization redesign — compact engine (v2) */
.ai-summary{
 display:block;
 margin:8px 0;
 background:transparent;
 border:none;
 border-radius:0;
 padding:0;
 min-height:unset;
}
.ai-summary.ap-engine-section.is-autopilot-on .ap-engine-card.is-active-run{
 border-color:rgba(167,139,250,.45);
 box-shadow:0 0 28px rgba(109,40,217,.14);
}
.ap-engine-card{
 border-radius:16px;
 border:1px solid #38215e;
 background:linear-gradient(145deg,rgba(17,21,43,.96),rgba(52,16,107,.28));
 padding:14px 16px 16px;
 transition:border-color .25s ease,box-shadow .25s ease;
}
.ap-engine-card.is-idle-run{
 background:linear-gradient(145deg,rgba(17,21,43,.92),rgba(30,20,55,.55));
}
.ap-engine-card.is-paused-run{
 border-color:rgba(251,191,36,.35);
 box-shadow:0 0 20px rgba(245,158,11,.08);
}
.ap-engine-head{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:14px;
 flex-wrap:wrap;
}
.ap-engine-head-main{
 display:flex;
 gap:12px;
 align-items:flex-start;
 min-width:0;
 flex:1 1 280px;
}
.ap-engine-badge{
 margin:0 0 6px;
}
.ap-engine-copy{
 min-width:0;
 flex:1;
}
.ap-engine-kicker{
 display:block;
 color:#c66cff;
 font-weight:700;
 font-size:11px;
 letter-spacing:.06em;
 margin-bottom:4px;
}
.ap-engine-title{
 margin:0 0 4px;
 font-size:18px;
 line-height:1.25;
}
.ap-engine-subtitle{
 margin:0;
 font-size:13px;
 line-height:1.45;
}
.ap-engine-product{
 margin:8px 0 0;
 font-size:13px;
 color:#cbd5e1;
 line-height:1.4;
 display:-webkit-box;
 -webkit-line-clamp:2;
 -webkit-box-orient:vertical;
 overflow:hidden;
}
.ap-engine-head-actions{
 display:flex;
 flex-wrap:wrap;
 gap:8px;
 align-items:center;
 justify-content:flex-end;
 flex:0 1 auto;
}
.ap-engine-head-actions .primary,
.ap-engine-head-actions .ghost,
.ap-engine-head-actions .btn-stop{
 min-height:40px;
 padding:8px 14px;
 font-size:13px;
 border-radius:10px;
}
.ap-engine-progress-block{
 margin-top:12px;
}
.ap-engine-progress{
 margin:0 0 6px;
 height:10px;
}
.ap-engine-progress span.is-animated{
 transition:width .45s ease;
}
.ap-engine-progress-meta{
 font-size:13px;
 font-weight:600;
 color:#cbd5e1;
 margin:0;
}
.ap-engine-kpis{
 display:grid;
 grid-template-columns:repeat(6,minmax(0,1fr));
 gap:8px;
 margin-top:12px;
}
.ap-engine-kpis.hidden{display:none}
.ap-kpi-chip{
 padding:10px 12px;
 border-radius:10px;
 border:1px solid #243047;
 background:rgba(15,23,42,.65);
 display:flex;
 flex-direction:column;
 gap:4px;
 min-height:64px;
 transition:background .2s ease,border-color .2s ease;
}
.ap-kpi-chip span{
 font-size:12px;
 color:#94a3b8;
 line-height:1.25;
}
.ap-kpi-chip strong{
 font-size:17px;
 color:#f8fafc;
 font-weight:700;
 font-variant-numeric:tabular-nums;
}
.ap-kpi-chip.tone-teal{border-color:rgba(52,211,153,.28)}
.ap-kpi-chip.tone-teal strong{color:#6ee7b7}
.ap-kpi-chip.tone-orange{border-color:rgba(251,191,36,.28)}
.ap-kpi-chip.tone-orange strong{color:#fcd34d}
.ap-kpi-chip.tone-violet{border-color:rgba(167,139,250,.28)}
.ap-kpi-chip.tone-violet strong{color:#ddd6fe}
.ap-kpi-chip.tone-green{border-color:rgba(74,222,128,.28)}
.ap-kpi-chip.tone-green strong{color:#6ee7b7}
.ap-kpi-chip.tone-red{border-color:rgba(248,113,113,.28)}
.ap-kpi-chip.tone-red strong{color:#fca5a5}
.ap-engine-body{
 margin-top:10px;
}
.ap-engine-state{
 padding-top:4px;
}
.ap-engine-state-actions{
 margin-top:0;
}
.ap-paused-note{
 margin:0 0 10px;
 font-size:13px;
}
.ap-manual-block{
 margin-top:8px;
 padding-top:12px;
 border-top:1px solid rgba(42,51,80,.65);
}
.ap-manual-title{
 margin:0 0 10px;
 font-size:15px;
}
.ap-mode-section{
 margin:8px 0 10px;
 padding:16px 18px 8px;
 overflow-x:clip;
}
.ap-mode-section.feature-card{
 /* denser than generic .feature-card — vertical only */
 padding:16px 18px 8px;
 margin-bottom:10px;
 gap:12px;
 align-items:stretch;
}
.ap-mode-layout{
 display:grid;
 grid-template-columns:minmax(200px,18%) minmax(0,1fr);
 gap:12px;
 align-items:start;
}
.ap-mode-intro{
 grid-column:1;
 min-width:0;
 max-width:none;
}
.ap-mode-intro h2{
 margin:4px 0 4px;
 font-size:18px;
}
.ap-mode-desc{
 margin:0;
 font-size:13px;
 line-height:1.45;
 max-width:42ch;
}
.ap-mode-controls{
 grid-column:2;
 min-width:0;
}
.ap-mode-controls-row{
 display:flex;
 align-items:flex-start;
 justify-content:flex-start;
 gap:14px;
}
.ap-mode-controls-primary{
 flex:1 1 auto;
 min-width:0;
 margin-top:0;
}
.ap-mode-info-panels{
 display:grid;
 grid-template-columns:300px 300px minmax(220px,240px);
 gap:12px;
 flex:0 0 auto;
 width:max-content;
 max-width:100%;
 min-width:0;
 margin-left:auto;
 margin-right:48px;
 align-self:stretch;
 align-items:stretch;
}
.ap-info-panel{
 min-width:0;
 width:100%;
 max-width:100%;
 height:100%;
 box-sizing:border-box;
 display:flex;
 flex-direction:column;
 padding:10px 12px;
 border-radius:12px;
 border:1px solid rgba(124,58,237,.28);
 background:rgba(8,12,24,.52);
}
.ap-info-panel.tone-violet{
 border-color:rgba(124,58,237,.28);
}
.ap-info-panel.tone-teal{
 border-color:rgba(52,211,153,.28);
}
.ap-info-panel.tone-blue{
 border-color:rgba(59,130,246,.32);
}
.ap-info-panel-title{
 margin:0 0 8px;
 padding:0;
 font-size:14px;
 font-weight:700;
 letter-spacing:.02em;
 line-height:1.3;
 flex:0 0 auto;
}
.ap-info-panel.tone-violet .ap-info-panel-title{color:#c4b5fd}
.ap-info-panel.tone-teal .ap-info-panel-title{color:#6ee7b7}
.ap-info-panel.tone-blue .ap-info-panel-title{color:#93c5fd}
.ap-info-panel-list{
 margin:0;
 padding:0;
 display:grid;
 grid-auto-rows:min-content;
 gap:6px;
 flex:1 1 auto;
 align-content:start;
}
.ap-info-panel-row{
 display:grid;
 grid-template-columns:minmax(0,0.4fr) minmax(0,0.6fr);
 column-gap:11px;
 align-items:start;
 font-size:13px;
 line-height:1.35;
 min-height:18px;
}
.ap-info-panel-row dt{
 margin:0;
 padding:0;
 color:#64748b;
 font-weight:500;
 text-align:left;
 white-space:normal;
 overflow-wrap:break-word;
 min-width:0;
}
.ap-info-panel-row dd{
 margin:0;
 padding:0;
 color:#e2e8f0;
 font-weight:600;
 text-align:right;
 justify-self:stretch;
 align-self:start;
 white-space:normal;
 overflow-wrap:break-word;
 word-break:break-word;
 font-variant-numeric:tabular-nums;
 display:block;
 min-width:0;
 max-width:100%;
}
.ap-info-panel-row dd .ap-cs-badge{
 display:inline-block;
 vertical-align:top;
 flex:0 0 auto;
 margin:0;
}
.ap-info-panel.tone-blue .ap-info-panel-row{
 column-gap:10px;
 grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
#ap-publish-panel{
 container-type:inline-size;
 container-name:ap-publish-panel;
 overflow:hidden;
}
#ap-publish-panel .ap-info-panel-row--publish-mode{
 display:flex;
 flex-wrap:wrap;
 align-items:flex-start;
 justify-content:space-between;
 gap:12px;
 grid-template-columns:unset;
 min-height:0;
}
#ap-publish-panel .ap-info-panel-row--publish-mode dt{
 flex:1 1 auto;
 min-width:0;
 max-width:calc(100% - 142px);
}
#ap-publish-panel .ap-info-panel-row--publish-mode dd{
 flex:0 1 130px;
 max-width:130px;
 min-width:0;
 margin-left:auto;
 text-align:right;
 justify-self:auto;
 overflow:hidden;
}
#ap-publish-panel .ap-info-panel-row--publish-mode dd .ap-cs-badge{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 max-width:130px;
 width:100%;
 min-width:0;
 padding:5px 10px;
 border-radius:999px;
 font-size:11px;
 font-weight:700;
 line-height:1.15;
 text-align:center;
 white-space:normal !important;
 overflow-wrap:break-word;
 word-break:normal;
 hyphens:auto;
 box-sizing:border-box;
}
@container ap-publish-panel (max-width:259px){
 #ap-publish-panel .ap-info-panel-row--publish-mode dt{
  max-width:100%;
  flex-basis:100%;
 }
 #ap-publish-panel .ap-info-panel-row--publish-mode dd{
  flex:0 1 130px;
  max-width:min(130px,100%);
  margin-left:auto;
 }
}
@container ap-publish-panel (min-width:260px){
 #ap-publish-panel .ap-info-panel-row--publish-mode dt{
  max-width:calc(100% - 142px);
 }
 #ap-publish-panel .ap-info-panel-row--publish-mode dd .ap-cs-badge.is-auto,
 #ap-publish-panel .ap-info-panel-row--publish-mode dd .ap-cs-badge.is-confirm{
  white-space:nowrap !important;
  overflow-wrap:normal;
  word-break:normal;
  width:auto;
  max-width:130px;
 }
}
.ap-info-panel-progress{
 margin-top:auto;
 padding-top:8px;
 flex:0 0 auto;
}
.ap-info-progress-bar{
 height:6px;
 background:#090d18;
 border-radius:999px;
 overflow:hidden;
 margin:0 0 4px;
}
.ap-info-progress-bar span{
 display:block;
 height:100%;
 width:0%;
 background:linear-gradient(90deg,#0d9488,#34d399);
 transition:width .35s ease;
}
.ap-info-progress-meta{
 display:block;
 font-size:12px;
 font-weight:600;
 color:#6ee7b7;
 text-align:right;
}
.ap-current-settings{
 /* alias kept for tests; layout via .ap-info-panel */
}
.ap-mode-section .mode-save-row{
 margin-top:8px;
}
.ap-cs-badge{
 display:inline-block;
 padding:2px 8px;
 border-radius:999px;
 font-size:11px;
 font-weight:600;
 line-height:1.35;
 white-space:nowrap;
}
.ap-cs-badge.is-on{
 color:#6ee7b7;
 background:rgba(16,185,129,.12);
 border:1px solid rgba(52,211,153,.28);
}
.ap-cs-badge.is-off{
 color:#94a3b8;
 background:rgba(51,65,85,.35);
 border:1px solid rgba(71,85,105,.45);
}
.ap-cs-badge.is-auto{
 color:#6ee7b7;
 background:rgba(16,185,129,.12);
 border:1px solid rgba(52,211,153,.28);
}
.ap-cs-badge.is-confirm{
 color:#fdba74;
 background:rgba(249,115,22,.14);
 border:1px solid rgba(251,146,60,.35);
}
.ap-mode-autopilot-hint{
 margin:8px 0 0;
 padding:8px 10px;
 border-radius:10px;
 border:1px solid rgba(124,58,237,.22);
 background:rgba(124,58,237,.08);
 color:#ddd6fe;
 font-size:13px;
 line-height:1.4;
}
.ap-smart-skip-flow{
 margin:8px 0 0;
 padding:8px 10px;
 border-radius:10px;
 border:1px solid rgba(59,130,246,.22);
 background:rgba(59,130,246,.06);
}
.ap-smart-skip-flow__title{
 margin:0 0 4px;
 font-size:13px;
 font-weight:600;
 color:#bfdbfe;
}
.ap-smart-skip-flow__steps{
 margin:0 0 4px;
 padding-left:16px;
 font-size:12px;
 line-height:1.4;
 color:#dbeafe;
}
.ap-smart-skip-flow__branch{
 list-style:none;
 margin-left:-16px;
 padding-left:0;
}
.ap-smart-skip-flow__branch .no{
 display:block;
 color:#93c5fd;
}
.ap-smart-skip-flow__branch .yes{
 display:block;
 margin-top:2px;
 color:#a5b4fc;
}
.ap-smart-skip-flow__note{
 margin:0;
 font-size:12px;
 line-height:1.35;
}
.ap-auto-publish-lock-note{
 margin:0;
 padding:10px 12px;
 border-radius:10px;
 border:1px solid rgba(52,211,153,.24);
 background:rgba(16,185,129,.08);
 color:#a7f3d0;
 font-size:12px;
 line-height:1.45;
}
.ap-toggle-row.is-locked .ap-toggle-ui{
 opacity:.85;
 box-shadow:inset 0 0 0 1px rgba(52,211,153,.35);
}
.ap-toggle-row.is-locked .ap-toggle-input:checked + .ap-toggle-ui{
 background:#059669;
 border-color:rgba(52,211,153,.55);
}
.ap-toggle-row.is-locked{
 opacity:1;
}
.ap-start-list--primary{
 margin-bottom:10px;
 padding-bottom:10px;
 border-bottom:1px solid rgba(148,163,184,.16);
}
.ap-start-list--secondary li strong{
 color:#cbd5e1;
 font-weight:600;
}
.ap-cs-badge.is-working{
 color:#ddd6fe;
 background:rgba(124,58,237,.18);
 border:1px solid rgba(167,139,250,.32);
}
.ap-cs-badge.is-paused{
 color:#fcd34d;
 background:rgba(245,158,11,.12);
 border:1px solid rgba(251,191,36,.28);
}
.ap-cs-badge.is-ready{
 color:#6ee7b7;
 background:rgba(16,185,129,.1);
 border:1px solid rgba(52,211,153,.22);
}
.ap-cs-badge.is-running{
 color:#6ee7b7;
 background:rgba(13,148,136,.14);
 border:1px solid rgba(52,211,153,.32);
}
.ap-cs-badge.is-done{
 color:#93c5fd;
 background:rgba(59,130,246,.12);
 border:1px solid rgba(96,165,250,.28);
}
.ap-cs-badge.is-error{
 color:#fca5a5;
 background:rgba(239,68,68,.12);
 border:1px solid rgba(248,113,113,.28);
}
.ap-cs-badge.is-idle{
 color:#94a3b8;
 background:rgba(51,65,85,.35);
 border:1px solid rgba(71,85,105,.45);
}
.ap-mode-section .mode-segment{
 grid-template-columns:repeat(3,minmax(190px,1fr));
 gap:10px;
 align-items:stretch;
}
.ap-mode-section .mode-option{
 min-height:68px;
 height:100%;
 padding:10px 12px;
 gap:8px;
}
.ap-mode-section .mode-option-icon{
 width:32px;
 height:32px;
 font-size:16px;
 border-radius:9px;
}
.ap-mode-section .mode-option-title{
 font-size:15px;
 line-height:1.2;
}
.ap-mode-section .mode-option-desc{
 font-size:12px;
 line-height:1.35;
}
.ap-mode-section .mode-option-body{
 gap:2px;
}
@media(min-width:1281px){
 .ap-mode-layout{
  grid-template-columns:minmax(210px,17%) minmax(0,1fr);
  gap:14px;
 }
 .ap-mode-controls-row{
  gap:14px;
 }
 .ap-mode-section .mode-segment{
  grid-template-columns:repeat(3,minmax(200px,1fr));
  gap:10px;
 }
 .ap-mode-section .mode-option{
  min-height:70px;
  padding:10px 12px;
 }
}
@media(min-width:1440px){
 .ap-mode-layout{
  grid-template-columns:minmax(220px,16%) minmax(0,1fr);
  gap:14px;
 }
 .ap-mode-controls-row{
  gap:14px;
 }
 .ap-mode-section .mode-segment{
  grid-template-columns:repeat(3,minmax(210px,1fr));
 }
}
@media(min-width:1920px){
 .ap-mode-layout{
  grid-template-columns:minmax(240px,14%) minmax(0,1fr);
  gap:16px;
 }
}
@media(max-width:1024px){
 .ap-mode-layout{
  display:flex;
  flex-direction:column;
  gap:12px;
 }
 .ap-mode-controls{
  display:block;
  width:100%;
 }
 .ap-mode-controls-row{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:12px;
 }
 .ap-mode-controls-primary{
  width:100%;
 }
 .ap-mode-info-panels{
  width:100%;
  max-width:none;
  margin-left:0;
  margin-right:0;
  grid-template-columns:repeat(3,minmax(0,1fr));
 }
 .ap-info-panel{
  min-width:0;
 }
 .ap-mode-section .mode-segment{
  grid-template-columns:repeat(3,minmax(0,1fr));
 }
}
@media(max-width:768px){
 .ap-mode-info-panels{
  grid-template-columns:repeat(2,minmax(0,1fr));
 }
 .ap-info-panel{
  min-width:0;
 }
}
@media(max-width:390px){
 .ap-mode-info-panels{
  grid-template-columns:1fr;
 }
 .ap-info-panel{
  min-width:0;
 }
}
#ap-settings-panel.ap-settings-panel{
 margin-top:10px;
 overflow:hidden;
 max-height:480px;
 opacity:1;
 transition:max-height .28s ease,opacity .22s ease,margin-top .22s ease,padding .22s ease;
}
#ap-settings-panel.ap-settings-panel.is-collapsed,
#ap-settings-panel.ap-settings-panel.hidden{
 max-height:0;
 opacity:0;
 margin-top:0;
 padding-top:0;
 padding-bottom:0;
 border-color:transparent;
 pointer-events:none;
}
#ap-settings-panel.ap-settings-panel:not(.is-collapsed):not(.hidden){
 animation:ap-settings-in .24s ease;
}
@keyframes ap-settings-in{
 from{opacity:0;transform:translateY(-4px)}
 to{opacity:1;transform:translateY(0)}
}
.ap-field-hint{
 display:block;
 font-size:11px;
 color:#64748b;
 margin-top:2px;
}
.ap-usage-row{
 display:flex;
 flex-direction:column;
 gap:4px;
 justify-content:center;
 padding:10px 12px;
 border-radius:10px;
 border:1px solid #243047;
 background:rgba(15,23,42,.55);
 font-size:13px;
}
.ap-usage-label{color:#94a3b8;font-size:12px}
.ap-usage-value{color:#e2e8f0;font-weight:600;font-variant-numeric:tabular-nums}
.ap-usage-free{color:#6ee7b7}
.ap-settings-foot{
 margin:10px 0 0;
 font-size:12px;
}
.ap-today-section{
 margin:14px 0;
 padding:14px 16px;
}
.ap-today-rows{
 display:grid;
 gap:10px;
}
.ap-today-grid-primary{
 grid-template-columns:repeat(5,minmax(0,1fr));
}
.ap-today-grid-seo{
 grid-template-columns:repeat(4,minmax(0,1fr));
}
.ap-today-grid-seo.is-empty{
 opacity:.72;
}
.ap-today-seo-empty{
 margin:0;
 padding:10px 12px;
 font-size:13px;
 border-radius:10px;
 border:1px dashed #334155;
 background:rgba(15,23,42,.35);
}
.ap-today-card.tone-teal{border-color:rgba(52,211,153,.22)}
.ap-today-card.tone-teal strong{color:#6ee7b7}
.ap-today-card.tone-orange{border-color:rgba(251,191,36,.22)}
.ap-today-card.tone-orange strong{color:#fcd34d}
.ap-today-card.tone-violet{border-color:rgba(167,139,250,.22)}
.ap-today-card.tone-violet strong{color:#ddd6fe}
.ap-today-card.tone-green{border-color:rgba(74,222,128,.22)}
.ap-today-card.tone-green strong{color:#6ee7b7}
.ap-today-card.tone-red{border-color:rgba(248,113,113,.22)}
.ap-today-card.tone-red strong{color:#fca5a5}
.ap-today-card{
 padding:10px 12px;
 min-height:58px;
}
.ap-today-card span{font-size:12px}
.ap-today-card strong{font-size:16px}
.ap-today-card.is-updated strong{
 animation:ap-today-value-pulse .55s ease;
}
@keyframes ap-today-value-pulse{
 0%{color:#f8fafc;transform:scale(1)}
 40%{color:#ddd6fe;transform:scale(1.06)}
 100%{color:#f8fafc;transform:scale(1)}
}
@media(max-width:1280px){
 .ap-engine-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1024px){
 .ap-today-grid-primary{grid-template-columns:repeat(3,minmax(0,1fr))}
 .ap-today-grid-seo{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:768px){
 .ap-engine-head{flex-direction:column}
 .ap-process-actions{width:100%;justify-content:flex-start}
 .ap-process-actions .action-button{flex:1 1 calc(50% - 4px);max-width:none}
 .ap-quick-actions{gap:10px}
 .ap-mode-actions-buttons{width:100%}
 .ap-mode-actions-buttons .action-button{flex:1 1 auto}
 .ap-engine-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ap-today-grid-primary,
 .ap-today-grid-seo{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mode-segment{grid-template-columns:1fr}
}
@media(max-width:390px){
 .ap-engine-card{padding:12px}
 .ap-engine-title{font-size:16px}
 .ap-process-actions{flex-direction:column;align-items:stretch}
 .ap-process-actions .action-button{flex:1 1 100%;width:100%;max-width:none}
 .ap-quick-actions{flex-direction:column;align-items:stretch;gap:10px}
 .ap-quick-actions .action-button{width:100%;max-width:none}
 .ap-mode-actions-buttons{flex-direction:column;align-items:stretch;gap:10px}
 .ap-mode-actions-buttons .action-button{width:100%;max-width:none}
 .ap-kpi-chip strong{font-size:15px}
 .ap-today-grid-primary,
 .ap-today-grid-seo{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.ai-progress small{color:#c66cff;font-weight:700}
.ai-progress h2{margin:8px 0}
.progress-bar{
 height:12px;
 background:#090d18;
 border-radius:20px;
 overflow:hidden;
 margin:18px 0;
}
.ap-engine-progress.progress-bar{margin:0 0 6px}
.progress-bar span{
 display:block;
 height:100%;
 width:0%;
 background:linear-gradient(90deg,#6d28d9,#c026d3);
 transition:width .35s ease;
}
.job-autopilot-indicator{
 display:inline-flex;
 align-items:center;
 gap:8px;
 margin:10px 0 4px;
 padding:6px 12px;
 border-radius:999px;
 background:rgba(16,185,129,.12);
 border:1px solid rgba(16,185,129,.35);
 color:#6ee7b7;
 font-size:13px;
 font-weight:600;
}
.job-autopilot-indicator.is-working{background:rgba(124,58,237,.18);border-color:rgba(167,139,250,.35);color:#ddd6fe}
.job-autopilot-indicator.is-paused{background:rgba(245,158,11,.12);border-color:rgba(251,191,36,.35);color:#fcd34d}
.job-autopilot-indicator.is-idle{background:rgba(16,185,129,.12);border-color:rgba(52,211,153,.35);color:#6ee7b7}
.job-autopilot-indicator.is-error{background:rgba(239,68,68,.12);border-color:rgba(248,113,113,.35);color:#fca5a5}
.job-autopilot-indicator.is-limit{background:rgba(245,158,11,.12);border-color:rgba(251,191,36,.35);color:#fcd34d}
.job-autopilot-indicator.is-stopping{background:rgba(245,158,11,.12);border-color:rgba(251,191,36,.35);color:#fcd34d}
.ap-poll-warning{
 margin:8px 0 0;
 padding:8px 12px;
 border-radius:10px;
 background:rgba(245,158,11,.12);
 border:1px solid rgba(251,191,36,.35);
 color:#fcd34d;
 font-size:13px;
 font-weight:600;
}
.ap-poll-warning.hidden{display:none}
.ap-start-free-note{display:block;margin-top:6px;color:#6ee7b7;font-weight:600}
#error-retry-btn[hidden],#ap-error-retry-btn[hidden]{display:none!important}
.job-autopilot-dot{
 width:8px;height:8px;border-radius:50%;
 background:#34d399;
 box-shadow:0 0 10px rgba(52,211,153,.8);
 animation:job-pulse 1.4s ease-in-out infinite;
}
.job-status-banner{
 margin:12px 0 6px;
 padding:10px 14px;
 border-radius:12px;
 font-size:14px;
 font-weight:600;
}
.job-status-banner.hidden{display:none}
.job-status-banner.is-running{background:rgba(124,58,237,.18);border:1px solid rgba(167,139,250,.35);color:#ddd6fe}
.job-status-banner.is-stopping{background:rgba(245,158,11,.12);border:1px solid rgba(251,191,36,.35);color:#fcd34d}
.job-status-banner.is-completed{background:rgba(16,185,129,.12);border:1px solid rgba(52,211,153,.35);color:#6ee7b7}
.job-status-banner.is-error{background:rgba(239,68,68,.12);border:1px solid rgba(248,113,113,.35);color:#fca5a5}
.job-progress-meta,.job-current-stage,.job-current-product{
 font-size:13px;
 color:#b8c0d4;
 margin:6px 0;
}
.job-progress-meta.hidden,.job-current-stage.hidden,.job-current-product.hidden{display:none}
.job-current-product{font-style:italic;color:#e2e8f0}
.job-actions-running{
 display:flex;
 flex-direction:column;
 gap:14px;
}
.job-actions-running.hidden{display:none}
.job-running-head{
 display:flex;
 align-items:center;
 gap:12px;
 font-weight:700;
 color:#ddd6fe;
}
.job-running-subtitle{
 margin:0;
 font-size:13px;
 color:#c4b5fd;
 font-weight:600;
}
.job-running-subtitle.hidden{display:none}
.job-spinner{
 width:18px;height:18px;
 border:2px solid rgba(167,139,250,.25);
 border-top-color:#c4b5fd;
 border-radius:50%;
 animation:job-spin .8s linear infinite;
 flex-shrink:0;
}
@keyframes job-spin{to{transform:rotate(360deg)}}
@keyframes job-pulse{0%,100%{opacity:1}50%{opacity:.45}}
.btn-stop{
 min-height:46px;
 max-height:48px;
 padding:0 18px;
 border-radius:10px;
 border:1px solid rgba(127,29,29,.75);
 background:linear-gradient(135deg,#4a1010,#6b1515);
 color:#fecaca;
 font-weight:600;
 font-size:14px;
 cursor:pointer;
 transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,color .2s ease;
 box-shadow:0 0 10px rgba(74,16,16,.28);
}
.btn-stop:hover:not(:disabled){
 transform:none;
 box-shadow:0 0 14px rgba(91,24,24,.36);
 background:linear-gradient(135deg,#5c1515,#7f1d1d);
 border-color:rgba(153,27,27,.85);
 color:#fee2e2;
}
.btn-stop:disabled{
 opacity:.55;
 cursor:not-allowed;
}
.job-actions-result{
 display:flex;
 flex-direction:column;
 gap:12px;
 margin-top:16px;
 align-items:flex-start;
}
.job-actions-result.hidden{display:none}
.job-result-text{
 margin:0;
 padding:10px 14px;
 border-radius:10px;
 border:1px solid rgba(42,51,80,.55);
 background:rgba(8,12,24,.42);
 font-size:14px;
 color:#94a3b8;
 line-height:1.5;
 text-align:left;
}
#job-idle-tagline.is-hidden{display:none}

/* Mode segmented control */
.mode-control-stack{
 flex-direction:column;
 align-items:stretch;
 gap:16px;
 min-width:min(100%,520px);
}
.mode-segment{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:10px;
}
.mode-option{
 display:flex;
 flex-direction:column;
 align-items:flex-start;
 gap:10px;
 min-height:112px;
 padding:14px 14px 16px;
 border-radius:14px;
 border:1px solid #2a3350;
 background:rgba(8,12,24,.72);
 color:#c8d0e0;
 text-align:left;
 cursor:pointer;
 transition:border-color .2s,box-shadow .2s,transform .2s,background .2s;
}
.mode-option:hover{
 border-color:#6d28d9;
 transform:translateY(-1px);
 box-shadow:0 0 18px rgba(109,40,217,.18);
}
.mode-option.active{
 border-color:#a855f7;
 background:linear-gradient(145deg,rgba(76,29,149,.35),rgba(109,40,217,.18));
 box-shadow:0 0 24px rgba(168,85,247,.28);
 color:#f3e8ff;
}
.mode-option-icon{
 display:grid;
 place-items:center;
 width:34px;height:34px;
 border-radius:10px;
 background:rgba(124,58,237,.18);
 font-size:16px;
}
.mode-option.active .mode-option-icon{
 background:rgba(168,85,247,.28);
 box-shadow:0 0 12px rgba(168,85,247,.35);
}
.mode-option-body{display:flex;flex-direction:column;gap:6px}
.mode-option-title{font-size:14px;font-weight:700;line-height:1.2}
.mode-option-desc{font-size:12px;line-height:1.45;color:#94a3b8;font-weight:400}
.mode-option.active .mode-option-desc{color:#ddd6fe}
.mode-save-row{
 display:flex;
 align-items:center;
 gap:14px;
 flex-wrap:wrap;
}
.ap-mode-actions-buttons{
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 gap:12px;
}
[data-sellora-page="optimization"] .action-button{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:6px;
 min-height:42px;
 height:auto;
 padding:0 16px;
 border-radius:10px;
 font-size:13px;
 font-weight:600;
 line-height:1.2;
 width:auto;
 max-width:280px;
 white-space:nowrap;
 flex:0 0 auto;
 cursor:pointer;
 border:1px solid transparent;
 transition:border-color .2s ease,background .2s ease,box-shadow .2s ease,transform .2s ease;
}
[data-sellora-page="optimization"] .action-button--primary{
 background:linear-gradient(135deg,#6d28d9,#a855f7);
 color:#fff;
 border-color:#a855f7;
 box-shadow:0 0 16px rgba(109,40,217,.22);
}
[data-sellora-page="optimization"] .action-button--primary:hover:not(:disabled){
 transform:translateY(-1px);
 box-shadow:0 0 22px rgba(168,85,247,.32);
}
[data-sellora-page="optimization"] .ap-start-btn.is-running[disabled],
[data-sellora-page="optimization"] .ap-start-btn.is-busy[disabled]{
 opacity:.88;
 cursor:default;
 pointer-events:none;
 transform:none;
 box-shadow:0 0 16px rgba(109,40,217,.22);
}
[data-sellora-page="optimization"] .action-button--secondary{
 background:rgba(109,40,217,.16);
 color:#ede9fe;
 border-color:rgba(167,139,250,.35);
}
[data-sellora-page="optimization"] .action-button--secondary:hover:not(:disabled){
 background:rgba(109,40,217,.24);
 border-color:rgba(167,139,250,.5);
}
[data-sellora-page="optimization"] .action-button--outline{
 background:transparent;
 color:#cbd5e1;
 border-color:#334155;
}
[data-sellora-page="optimization"] .action-button--outline:hover:not(:disabled){
 border-color:#6d28d9;
 color:#ede9fe;
 background:rgba(109,40,217,.1);
}
[data-sellora-page="optimization"] .action-button--check{
 background:rgba(16,185,129,.1);
 color:#6ee7b7;
 border-color:rgba(52,211,153,.35);
}
[data-sellora-page="optimization"] .action-button--check:hover:not(:disabled){
 background:rgba(16,185,129,.18);
 border-color:rgba(52,211,153,.55);
 box-shadow:0 0 16px rgba(16,185,129,.12);
}
[data-sellora-page="optimization"] .action-button--stop{
 min-height:46px;
 max-height:48px;
 background:linear-gradient(135deg,#4a1010,#6b1515);
 color:#fecaca;
 border-color:rgba(127,29,29,.75);
 box-shadow:0 0 10px rgba(74,16,16,.22);
}
[data-sellora-page="optimization"] .action-button--stop:hover:not(:disabled){
 transform:none;
 background:linear-gradient(135deg,#5c1515,#7f1d1d);
 border-color:rgba(153,27,27,.85);
 box-shadow:0 0 14px rgba(91,24,24,.32);
 color:#fee2e2;
}
[data-sellora-page="optimization"] .action-button:disabled{
 opacity:.45;
 cursor:not-allowed;
 transform:none;
 box-shadow:none;
}
.ap-quick-actions{
 display:flex;
 flex-wrap:wrap;
 align-items:center;
 justify-content:flex-start;
 gap:14px;
}
.ap-process-actions{
 display:flex;
 flex-wrap:wrap;
 gap:8px;
 align-items:center;
 justify-content:flex-end;
}
.ap-process-actions .action-button{
 min-height:40px;
 max-width:none;
}
.ap-save-btn:disabled{
 opacity:.45;
 cursor:not-allowed;
 box-shadow:none;
 transform:none;
}
.ap-save-status{
 font-size:13px;
 font-weight:600;
 color:#94a3b8;
 min-height:20px;
}
.ap-save-status.is-saving{color:#c4b5fd}
.ap-save-status.is-dirty{color:#c4b5fd}
.ap-save-status.is-success{color:#6ee7b7}
.ap-save-status.is-error{color:#fca5a5}
.job-running-status-dot{
 width:10px;height:10px;border-radius:50%;
 background:#a855f7;
 box-shadow:0 0 12px rgba(168,85,247,.75);
 animation:job-pulse 1.4s ease-in-out infinite;
 flex-shrink:0;
}
@media(max-width:900px){
 .mode-segment{grid-template-columns:1fr}
}
.ai-actions{
 display:flex;
 flex-direction:column;
 gap:12px;
 justify-content:center;
}
#job-actions-idle{
 display:flex;
 flex-direction:row;
 flex-wrap:wrap;
 gap:14px;
 align-items:center;
}
.queue.modern .queue-row{
 display:grid;
 grid-template-columns:1fr auto auto;
 align-items:center;
 gap:20px;
 padding:18px;
 margin-bottom:8px;
 background:#0b1120;
 border:1px solid #172238;
 border-radius:14px;
 transition:.2s;
}
.queue.modern .queue-row:hover{
 border-color:#7c3aed;
 transform:translateX(4px);
}
.queue-row b{font-size:15px}
.queue-row span{color:#7f8da8}
@media(max-width:900px){
 .queue.modern .queue-row{grid-template-columns:1fr}
}


/* V1.6.6 Optimization redesign */
.catalog-check{
  background:linear-gradient(135deg,#5d18ff,#a020f0);
  color:#fff;
  border:1px solid #b45cff;
  box-shadow:0 0 18px rgba(138,43,226,.45);
  padding:12px 22px;
  border-radius:12px;
  font-weight:700;
  cursor:pointer;
  transition:.25s;
}
.catalog-check:hover{transform:translateY(-2px);box-shadow:0 0 28px rgba(138,43,226,.7)}
.queue.modern{display:flex;flex-direction:column;gap:10px}
.queue-card{
 display:grid;
 grid-template-columns:1fr 150px 150px 160px 30px;
 align-items:center;
 gap:16px;
 padding:18px;
 background:linear-gradient(90deg,rgba(14,20,40,.95),rgba(20,12,45,.85));
 border:1px solid #182447;
 border-radius:16px;
 color:#fff;
 text-decoration:none;
 transition:.25s;
}
.queue-card:hover{border-color:#7c2cff;transform:translateX(4px)}
.product-main{display:flex;gap:16px;align-items:center}
.product-main b{display:block}
.product-main span{display:block;color:#8793b5;margin-top:8px;font-size:12px}
.product-thumb{width:52px;height:52px;border-radius:12px;background:#151d35;display:flex;align-items:center;justify-content:center;color:#9b4cff}
.seo-score small{display:block;color:#8995b7}
.seo-score strong{font-size:22px;color:#fff}
.queue-action{
background:#681cff;color:white;border:0;border-radius:10px;padding:10px 14px;cursor:pointer;
}

/* Sellora V1.6.8 premium product cards */
.product-premium-layout .panel,
.product-card,
.ai-panel {
    border-radius:22px;
    background:rgba(20,27,52,.88);
    border:1px solid rgba(139,92,246,.25);
    box-shadow:0 18px 45px rgba(0,0,0,.25);
}

.product-card .product-img img.product-card-img {
  opacity: 0;
  transition: opacity 170ms ease-out;
}

.product-card .product-img img.product-card-img.is-loaded,
.product-card .product-img img.product-card-img.is-loaded-fallback {
  opacity: 1;
}
.product-premium-layout .field {
    border-radius:14px;
    padding:16px;
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.08);
    margin-bottom:14px;
}
.product-image {
    width:96px;
    height:96px;
    border-radius:20px;
    object-fit:cover;
    background:#111827;
    border:1px solid rgba(139,92,246,.35);
}
.queue-card {
    display:flex;
    gap:18px;
    align-items:center;
    padding:18px;
    border-radius:20px;
    background:rgba(17,24,39,.8);
    border:1px solid rgba(139,92,246,.18);
}

/* Sellora V1.6.9 interaction polish */
button, .btn, a.btn, .action-button {
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease, background .25s ease;
}
button:hover, .btn:hover, a.btn:hover, .action-button:hover {
    transform: translateY(-2px);
    filter: brightness(1.12);
    box-shadow: 0 0 18px rgba(139,92,246,.65), 0 0 38px rgba(124,58,237,.35);
}

/* Sellora V1.8 queue polish — exclude optimization product table rows */
.queue.modern:not(.opt-table-list) > div,
.queue.modern .queue-item {
    position:relative;
    border-radius:18px;
    border:1px solid rgba(139,92,246,.22);
    background:linear-gradient(180deg,#11182b,#0d1425);
    padding:18px 22px;
    margin-bottom:12px;
    display:flex;
    align-items:center;
    gap:18px;
}
.queue.modern .status-ready,.status-ready {
    color:#22c55e;
    background:rgba(34,197,94,.15);
    border-color:rgba(34,197,94,.35);
}
.status-pending {
    color:#f59e0b;
    background:rgba(245,158,11,.15);
}
.status-error {
    color:#ef4444;
    background:rgba(239,68,68,.15);
}
.seo-score.good {color:#22c55e;}
.seo-score.medium {color:#f59e0b;}
.seo-score.low {color:#ef4444;}
.queue .optimize-button {
    margin-left:auto;
    box-shadow:0 0 0 rgba(139,92,246,0);
    transition:.25s;
}
.queue .optimize-button:hover {
    transform:translateY(-2px);
    box-shadow:0 0 22px rgba(139,92,246,.65);
}

/* ============================================================
   Sellora V1.8.1 — Premium SaaS Product Page Redesign
   ============================================================ */

:root {
    --sellora-bg: #050914;
    --sellora-bg-elevated: #0a1020;
    --sellora-card: #0c1222;
    --sellora-card-hover: #101828;
    --sellora-border: rgba(255,255,255,0.08);
    --sellora-border-accent: rgba(139,92,246,0.25);
    --sellora-text: #f7f8ff;
    --sellora-text-muted: #9ea7bb;
    --sellora-accent: #7b2ee8;
    --sellora-accent-blue: #3b82f6;
    --sellora-accent-glow: rgba(123,46,232,0.35);
    --sellora-radius: 16px;
    --sellora-transition: 200ms ease;
    --sellora-score-low: #ef4444;
    --sellora-score-medium: #f59e0b;
    --sellora-score-good: #22c55e;
    --sidebar-width: 260px;
}

/* --- Mobile sidebar toggle --- */
.sidebar-toggle {
    display: none;
    position: fixed;
    top: 14px;
    left: 14px;
    z-index: 100;
    width: 44px;
    height: 44px;
    border: 1px solid var(--sellora-border);
    border-radius: 12px;
    background: var(--sellora-card);
    color: var(--sellora-text);
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: background var(--sellora-transition), border-color var(--sellora-transition), transform var(--sellora-transition);
}
.sidebar-toggle:hover {
    background: var(--sellora-card-hover);
    border-color: var(--sellora-border-accent);
}
.sidebar-toggle:active {
    transform: scale(0.96);
}
.sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 90;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(4px);
    opacity: 0;
    transition: opacity var(--sellora-transition);
    pointer-events: none;
}
body.sidebar-open .sidebar-overlay {
    opacity: 1;
    pointer-events: auto;
}

/* --- Sidebar nav icons --- */
.nav-icon {
    width: 22px;
    text-align: center;
    flex-shrink: 0;
    font-size: 16px;
    opacity: 0.85;
}
.side-nav a.active .nav-icon,
.side-nav a:hover .nav-icon {
    opacity: 1;
}

/* --- Product page layout --- */
.product-premium-layout {
    max-width: 1400px;
    margin: 0 auto;
}

.product-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--sellora-text-muted);
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 20px;
    padding: 6px 0;
    transition: color var(--sellora-transition);
}
.product-back:hover {
    color: var(--sellora-accent);
}
.product-back:focus-visible {
    outline: 2px solid var(--sellora-accent);
    outline-offset: 4px;
    border-radius: 4px;
}

/* --- Product hero header --- */
.product-hero {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    align-items: start;
    margin-bottom: 24px;
}
.product-hero-info h1 {
    font-size: clamp(22px, 3vw, 32px);
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 14px;
    letter-spacing: -0.02em;
}
.product-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 99px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.02em;
    border: 1px solid var(--sellora-border);
}
.badge-id {
    background: rgba(255,255,255,0.04);
    color: var(--sellora-text-muted);
}
.badge-prom {
    background: rgba(59,130,246,0.12);
    border-color: rgba(59,130,246,0.3);
    color: #60a5fa;
}
.badge-status.status-active {
    background: rgba(34,197,94,0.12);
    border-color: rgba(34,197,94,0.3);
    color: #4ade80;
}
.badge-status.status-inactive {
    background: rgba(245,158,11,0.12);
    border-color: rgba(245,158,11,0.3);
    color: #fbbf24;
}

/* --- SEO Score card --- */
.seo-score-card {
    min-width: 200px;
    padding: 20px 24px;
    border-radius: var(--sellora-radius);
    background: var(--sellora-card);
    border: 1px solid var(--sellora-border);
    box-shadow: 0 8px 32px rgba(0,0,0,0.25);
    text-align: center;
}
.seo-score-label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sellora-text-muted);
    margin-bottom: 8px;
}
.seo-score-display {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 2px;
    margin-bottom: 14px;
}
.seo-score-display strong {
    font-size: 42px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.03em;
    transition: color var(--sellora-transition);
}
.seo-score-max {
    font-size: 18px;
    font-weight: 500;
    color: var(--sellora-text-muted);
}
.seo-progress-track {
    height: 6px;
    background: rgba(255,255,255,0.06);
    border-radius: 99px;
    overflow: hidden;
}
.seo-progress-fill {
    height: 100%;
    border-radius: 99px;
    background: var(--sellora-text-muted);
    transition: width 400ms ease, background var(--sellora-transition);
}
.seo-score-card.score-low .seo-score-display strong { color: var(--sellora-score-low); }
.seo-score-card.score-low .seo-progress-fill { background: var(--sellora-score-low); }
.seo-score-card.score-medium .seo-score-display strong { color: var(--sellora-score-medium); }
.seo-score-card.score-medium .seo-progress-fill { background: var(--sellora-score-medium); }
.seo-score-card.score-good .seo-score-display strong { color: var(--sellora-score-good); }
.seo-score-card.score-good .seo-progress-fill { background: var(--sellora-score-good); }

/* --- Actions bar --- */
.product-actions-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    padding: 18px 20px;
    margin-bottom: 24px;
    border-radius: var(--sellora-radius);
    background: var(--sellora-card);
    border: 1px solid var(--sellora-border);
    box-shadow: 0 4px 24px rgba(0,0,0,0.15);
}
.btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    padding: 0 24px;
    border: none;
    border-radius: 12px;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    background: linear-gradient(135deg, #7b2ee8 0%, #5b19ca 50%, #4338ca 100%);
    box-shadow: 0 4px 16px var(--sellora-accent-glow), inset 0 1px 0 rgba(255,255,255,0.12);
    transition: transform var(--sellora-transition), box-shadow var(--sellora-transition), filter var(--sellora-transition), opacity var(--sellora-transition);
}
.btn-primary:hover:not(:disabled) {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(123,46,232,0.45), inset 0 1px 0 rgba(255,255,255,0.15);
    filter: brightness(1.08);
}
.btn-primary:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
    box-shadow: 0 2px 8px var(--sellora-accent-glow);
}
.btn-primary:focus-visible {
    outline: 2px solid #a78bfa;
    outline-offset: 3px;
}
.btn-primary:disabled {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
    filter: none;
}
.btn-optimize {
    min-width: 220px;
    min-height: 52px;
    font-size: 16px;
}
.optimize-hint {
    flex: 1 1 100%;
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--sellora-text-muted, #9ea7bb);
    max-width: 420px;
}
.optimize-hint.hidden {
    display: none;
}
.btn-publish {
    margin-left: auto;
    min-height: 48px;
}
.btn-primary.loading .btn-label,
.btn-primary.loading .btn-icon {
    opacity: 0;
}
.btn-primary.loading .btn-spinner {
    display: block;
}
.btn-spinner {
    display: none;
    position: absolute;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255,255,255,0.3);
    border-top-color: #fff;
    border-radius: 50%;
    animation: sellora-spin 0.7s linear infinite;
}
.btn-primary {
    position: relative;
}
@keyframes sellora-spin {
    to { transform: rotate(360deg); }
}
.action-status {
    flex: 1;
    min-width: 140px;
    font-size: 14px;
    color: var(--sellora-text-muted);
    padding: 0 8px;
}

/* --- Segmented control (RU/UK) --- */
.segmented-control {
    display: inline-flex;
    padding: 4px;
    border-radius: 12px;
    background: rgba(255,255,255,0.04);
    border: 1px solid var(--sellora-border);
}
.segmented-control .segment {
    min-width: 52px;
    min-height: 40px;
    padding: 0 18px;
    border: none;
    border-radius: 9px;
    background: transparent;
    color: var(--sellora-text-muted);
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background var(--sellora-transition), color var(--sellora-transition), box-shadow var(--sellora-transition);
}
.segmented-control .segment:hover:not(.active) {
    color: var(--sellora-text);
    background: rgba(255,255,255,0.04);
}
.segmented-control .segment.active {
    background: linear-gradient(135deg, #7b2ee8, #5b19ca);
    color: #fff;
    box-shadow: 0 2px 8px var(--sellora-accent-glow);
}
.segmented-control .segment:focus-visible {
    outline: 2px solid #a78bfa;
    outline-offset: 1px;
}

/* --- Compare grid --- */
.product-premium-layout .compare-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 320px;
    gap: 20px;
    align-items: start;
}

/* --- Content cards --- */
.product-premium-layout .panel {
    border-radius: var(--sellora-radius);
    background: var(--sellora-card);
    border: 1px solid var(--sellora-border);
    box-shadow: 0 8px 32px rgba(0,0,0,0.2);
    overflow: hidden;
    margin-bottom: 0;
    transition: border-color var(--sellora-transition), box-shadow var(--sellora-transition);
}
.product-premium-layout .panel:hover {
    border-color: rgba(255,255,255,0.12);
}
.product-premium-layout .panel h3 {
    padding: 0;
    border: none;
    font-size: 16px;
    font-weight: 600;
    margin: 4px 0 0;
}
.card-header {
    padding: 20px 22px 16px;
    border-bottom: 1px solid var(--sellora-border);
}
.card-body {
    padding: 20px 22px 22px;
}
.eyebrow {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sellora-text-muted);
    margin-bottom: 4px;
}
.eyebrow-ai,
.eyebrow.purple {
    color: #a78bfa;
}

/* --- AI panel distinction --- */
.product-premium-layout .ai-panel {
    background: linear-gradient(165deg, rgba(17,24,48,0.95) 0%, rgba(30,20,60,0.6) 100%);
    border-color: rgba(139,92,246,0.3);
    box-shadow: 0 8px 40px rgba(123,46,232,0.12), 0 8px 32px rgba(0,0,0,0.2);
}
.product-premium-layout .ai-panel .card-header {
    border-bottom-color: rgba(139,92,246,0.2);
    background: rgba(123,46,232,0.06);
}

/* --- Content field cards --- */
.content-field-card {
    margin-bottom: 16px;
}
.content-field-card:last-child {
    margin-bottom: 0;
}
.content-field-card label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--sellora-text-muted);
    margin-bottom: 8px;
    letter-spacing: 0.02em;
}
.product-premium-layout .field {
    border-radius: 12px;
    padding: 14px 16px;
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--sellora-border);
    font-size: 14px;
    line-height: 1.55;
    margin-bottom: 0;
    transition: border-color var(--sellora-transition), background var(--sellora-transition);
}
.product-premium-layout .field.changed {
    background: rgba(123,46,232,0.08);
    border-color: rgba(139,92,246,0.25);
}
.product-premium-layout .field.prose {
    white-space: pre-wrap;
    word-break: break-word;
}
.diff-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px;
    background: linear-gradient(135deg, #7b2ee8, #5b19ca);
    color: #fff;
    vertical-align: middle;
    margin-left: 4px;
    letter-spacing: 0.04em;
}

/* --- Empty AI state --- */
.empty-ai {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 32px 20px;
    gap: 10px;
}
.empty-ai-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: rgba(123,46,232,0.15);
    border: 1px solid rgba(139,92,246,0.3);
    display: grid;
    place-items: center;
    font-size: 24px;
    color: #a78bfa;
    margin-bottom: 8px;
}
.empty-ai b {
    font-size: 16px;
    font-weight: 600;
}
.empty-ai span {
    font-size: 14px;
    color: var(--sellora-text-muted);
    max-width: 280px;
    line-height: 1.5;
}

/* --- Validation card --- */
.validation-card .card-body {
    text-align: center;
}
.validation-status-icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 16px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    transition: background var(--sellora-transition), color var(--sellora-transition);
}
.validation-card.val-waiting .validation-status-icon {
    background: rgba(158,167,187,0.12);
    color: var(--sellora-text-muted);
}
.validation-card.val-analyzing .validation-status-icon {
    background: rgba(59,130,246,0.12);
    color: #60a5fa;
    animation: sellora-pulse 1.5s ease infinite;
}
.validation-card.val-verified .validation-status-icon {
    background: rgba(34,197,94,0.12);
    color: #4ade80;
}
.validation-card.val-error .validation-status-icon {
    background: rgba(239,68,68,0.12);
    color: #f87171;
}
.validation-card.val-review .validation-status-icon {
    background: rgba(245,158,11,0.12);
    color: #fbbf24;
}
@keyframes sellora-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}
.validation-card #decision {
    font-size: 15px;
    font-weight: 600;
}
.validation-card #decision.pass {
    color: var(--sellora-score-good);
}
.validation-card #decision.review {
    color: var(--sellora-score-medium);
}
.product-premium-layout .health-ring {
    width: 100px;
    height: 100px;
    border-width: 6px;
    margin: 16px auto;
    font-size: 22px;
    font-weight: 700;
}
.validation-note {
    font-size: 13px;
    color: var(--sellora-text-muted);
    line-height: 1.5;
    margin: 0 0 12px;
    min-height: 20px;
}
.problem-list {
    text-align: left;
    font-size: 13px;
    color: var(--sellora-text-muted);
}
.problem-item {
    padding: 8px 12px;
    margin-bottom: 6px;
    border-radius: 8px;
    background: rgba(245,158,11,0.08);
    border: 1px solid rgba(245,158,11,0.15);
}
.problem-ok {
    padding: 10px;
    border-radius: 8px;
    background: rgba(34,197,94,0.1);
    color: var(--sellora-score-good);
    text-align: center;
    font-weight: 600;
}

/* --- Responsive: Desktop >= 1200px --- */
@media (min-width: 1200px) {
    .app-shell {
        grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
    }
    .product-premium-layout .compare-grid {
        grid-template-columns: 1fr 1fr 300px;
    }
}

/* --- Responsive: Tablet 768–1199px --- */
@media (max-width: 1199px) and (min-width: 768px) {
    .product-hero {
        grid-template-columns: 1fr;
    }
    .seo-score-card {
        max-width: 280px;
    }
    .product-premium-layout .compare-grid {
        grid-template-columns: 1fr 1fr;
    }
    .validation-card {
        grid-column: 1 / -1;
    }
    .btn-publish {
        margin-left: 0;
    }
    .product-actions-bar {
        gap: 12px;
    }
}

/* --- Responsive: Mobile <= 767px --- */
@media (max-width: 767px) {
    .sidebar-toggle {
        display: flex;
    }
    .sidebar-overlay {
        display: block;
    }
    .app-shell {
        display: block;
    }
    .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        width: var(--sidebar-width);
        height: 100vh;
        transform: translateX(-100%);
        transition: transform 250ms ease;
        z-index: 95;
        box-shadow: 4px 0 32px rgba(0,0,0,0.4);
    }
    body.sidebar-open .sidebar {
        transform: translateX(0);
    }
    .sidebar-plan,
    .sidebar-user {
        display: block;
    }
    .workspace {
        padding: 68px 16px 24px;
    }
    .product-hero {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .seo-score-card {
        width: 100%;
    }
    .product-actions-bar {
        flex-direction: column;
        align-items: stretch;
        padding: 16px;
        gap: 12px;
    }
    .btn-optimize,
    .btn-publish {
        width: 100%;
        min-height: 48px;
        margin-left: 0;
    }
    .segmented-control {
        width: 100%;
        justify-content: center;
    }
    .segmented-control .segment {
        flex: 1;
        min-height: 44px;
    }
    .action-status {
        text-align: center;
        padding: 4px 0;
    }
    .product-premium-layout .compare-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .card-header,
    .card-body {
        padding: 16px;
    }
    .product-hero-info h1 {
        font-size: 22px;
    }
}

/* Override global button hover for product page primary buttons */
.product-premium-layout .btn-primary:hover:not(:disabled) {
    transform: translateY(-2px);
}
.product-premium-layout .segmented-control .segment:hover:not(.active) {
    transform: none;
    box-shadow: none;
    filter: none;
}

/* ============================================================
   Product AI Workspace
   ============================================================ */

.product-workspace {
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.product-workspace .panel {
    border-radius: var(--sellora-radius, 14px);
    background: var(--sellora-card, #111827);
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    transition:
        border-color 200ms ease,
        box-shadow 200ms ease,
        transform 200ms ease;
}

@media (hover: hover) {
    .product-workspace .panel:not(.pw-col-original):not(.pw-col-ai):not(.pw-stats-panel):hover {
        border-color: rgba(255,255,255,0.15);
        box-shadow: 0 14px 40px rgba(0,0,0,0.24);
        transform: translateY(-2px);
    }

    .product-workspace .pw-stat-cell:hover {
        background: rgba(255, 255, 255, 0.03);
    }

    .product-workspace .pw-stat-cell:hover .pw-stat-to,
    .product-workspace .pw-stat-cell:hover .pw-stat-value {
        filter: brightness(1.1);
    }

    .product-workspace .pw-mini-stat:hover {
        border-color: rgba(255, 255, 255, 0.14);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.14);
    }

    .product-workspace .pw-stat-card:hover {
        border-color: rgba(255,255,255,0.16);
        box-shadow: 0 12px 36px rgba(0,0,0,0.24);
        transform: translateY(-2px);
    }

    .product-workspace .pw-stat-card:hover .pw-stat-to,
    .product-workspace .pw-stat-card:hover .pw-stat-value {
        filter: brightness(1.12);
    }

    .product-workspace .pw-insight-card:hover {
        transform: translateY(-2px);
        box-shadow: 0 8px 24px rgba(123, 46, 232, 0.12);
    }

    .pw-why-card:hover {
        transform: translateY(-2px);
        border-color: rgba(168, 85, 247, 0.28);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.06),
            0 12px 32px rgba(123, 46, 232, 0.14);
    }

    .pw-why-card:hover .pw-why-icon {
        color: #c4b5fd;
    }

    .pw-seo-row:hover {
        background: rgba(255, 255, 255, 0.02);
        border-radius: 10px;
    }

    .pw-seo-row:hover .pw-seo-row-val,
    .pw-seo-row:hover .pw-seo-row-fill {
        filter: brightness(1.1);
    }

    .pw-timeline li:hover {
        background: rgba(255, 255, 255, 0.02);
        border-radius: 10px;
    }

    .pw-timeline li:hover .pw-tl-label {
        color: var(--sellora-text, #f7f8ff);
    }

    .pw-timeline li:hover .pw-tl-marker {
        filter: brightness(1.15);
    }

    .pw-change-list li:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    }
}

.pw-breadcrumbs {
    margin: 0 0 14px;
    min-width: 0;
    overflow-x: clip;
}

.pw-breadcrumbs-list {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0;
    min-width: 0;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
    line-height: 1.35;
    white-space: nowrap;
}

.pw-bc-item {
    display: flex;
    align-items: center;
    min-width: 0;
    flex-shrink: 0;
}

.pw-bc-sep {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-inline: 8px;
    color: rgba(255, 255, 255, 0.22);
    opacity: 0.6;
    font-size: 13px;
    font-weight: 400;
    line-height: 1;
    pointer-events: none;
    user-select: none;
}

.pw-bc-item-current {
    flex-shrink: 1;
    min-width: 0;
    overflow: hidden;
}

.pw-bc-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.58);
    text-decoration: none;
    transition: color 200ms ease, opacity 200ms ease;
    white-space: nowrap;
}

.pw-bc-link:hover {
    color: rgba(255, 255, 255, 0.9);
}

.pw-bc-link:focus {
    outline: none;
}

.pw-bc-link:focus-visible {
    outline: 2px solid #a78bfa;
    outline-offset: 3px;
    border-radius: 4px;
}

.pw-bc-current {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    max-width: 100%;
    font-size: 13px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.82);
    cursor: default;
    text-decoration: none;
}

.pw-bc-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 13px;
    height: 13px;
    font-size: 12px;
    line-height: 1;
    flex-shrink: 0;
}

.pw-bc-text,
.pw-bc-text-current {
    min-width: 0;
}

.pw-bc-text-current {
    max-width: min(420px, 42vw);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pw-bc-label-short {
    display: none;
}

@media (max-width: 640px) {
    .pw-bc-label-full {
        display: none;
    }

    .pw-bc-label-short {
        display: inline;
    }

    .pw-bc-item-current .pw-bc-icon {
        display: none;
    }

    .pw-bc-text-current {
        max-width: min(220px, 38vw);
    }
}

@media (min-width: 641px) {
    .pw-bc-label-short {
        display: none;
    }
}

/* Hero */
.pw-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    padding: 24px 28px;
}

.pw-hero--primary {
    background: linear-gradient(165deg, rgba(8, 12, 22, 0.98) 0%, rgba(14, 18, 32, 0.96) 55%, rgba(20, 14, 38, 0.88) 100%);
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.pw-title {
    margin: 0 0 12px;
    font-size: clamp(22px, 3vw, 34px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

.pw-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.pw-chip {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,0.08);
}

.pw-chip-id {
    color: #6b7280;
    background: rgba(255,255,255,0.03);
}

.pw-chip-market {
    color: #60a5fa;
    background: rgba(59,130,246,0.08);
    border-color: rgba(59,130,246,0.18);
}

.pw-chip-cat {
    color: var(--sellora-text-muted);
    background: rgba(255,255,255,0.04);
}

.pw-hero-score {
    min-width: 240px;
    text-align: center;
}

.pw-score-eyebrow {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--sellora-text-muted);
    margin-bottom: 8px;
}

.pw-score-display {
    display: flex;
    align-items: baseline;
    justify-content: center;
    gap: 4px;
    margin-bottom: 4px;
    line-height: 1;
}

.pw-score-display.has-range {
    gap: 10px;
}

.pw-score-main,
.pw-score-from,
.pw-score-to {
    font-size: 44px;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.pw-hero-score.has-range .pw-score-from {
    color: var(--sellora-text-muted);
    opacity: 0.42;
    font-size: 32px;
    font-weight: 600;
}

.pw-hero-score.has-range .pw-score-to {
    font-size: 50px;
    font-weight: 800;
}

.pw-score-arrow {
    font-size: 28px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.32);
    opacity: 1;
    line-height: 1;
}

.pw-score-denom {
    font-size: 14px;
    font-weight: 500;
    color: var(--sellora-text-muted);
    opacity: 0.58;
}

.pw-score-deltas {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 6px;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 220ms ease, transform 220ms ease;
}

.pw-score-deltas.pw-delta-visible {
    opacity: 1;
    transform: translateY(0);
}

.pw-score-verdict {
    display: block;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 10px;
    opacity: 0;
    transform: translateY(4px);
    transition: opacity 220ms ease, transform 220ms ease;
}

.pw-score-verdict.pw-verdict-visible {
    opacity: 0.9;
    transform: translateY(0);
}

.pw-score-delta-line {
    font-size: 13px;
    font-weight: 700;
    color: #22c55e;
    letter-spacing: 0.01em;
}

.pw-score-delta-line.is-negative { color: #ef4444; }

.pw-score-delta {
    font-size: 12px;
    font-weight: 700;
    color: #22c55e;
}

.pw-score-delta.is-negative { color: #ef4444; }

.pw-score-verdict.tier-red { color: #ef4444; }
.pw-score-verdict.tier-orange { color: #f97316; }
.pw-score-verdict.tier-yellow { color: #eab308; }
.pw-score-verdict.tier-lgreen { color: #86efac; }
.pw-score-verdict.tier-green { color: #22c55e; }

.pw-score-track {
    height: 6px;
    border-radius: 999px;
    background: rgba(255,255,255,0.07);
    overflow: hidden;
    margin-bottom: 10px;
}

.pw-score-fill {
    height: 100%;
    border-radius: 999px;
    background: var(--sellora-text-muted);
    transition: width 250ms cubic-bezier(0.22, 1, 0.36, 1), background 220ms ease;
    will-change: width;
}

.pw-hero-score.tier-red .pw-score-main,
.pw-hero-score.tier-red .pw-score-to { color: #ef4444; }
.pw-hero-score.tier-red .pw-score-fill { background: #ef4444; }

.pw-hero-score.tier-orange .pw-score-main,
.pw-hero-score.tier-orange .pw-score-to { color: #f97316; }
.pw-hero-score.tier-orange .pw-score-fill { background: #f97316; }

.pw-hero-score.tier-yellow .pw-score-main,
.pw-hero-score.tier-yellow .pw-score-to { color: #eab308; }
.pw-hero-score.tier-yellow .pw-score-fill { background: #eab308; }

.pw-hero-score.tier-lgreen .pw-score-main,
.pw-hero-score.tier-lgreen .pw-score-to { color: #86efac; }
.pw-hero-score.tier-lgreen .pw-score-fill { background: #86efac; }

.pw-hero-score.tier-green .pw-score-main,
.pw-hero-score.tier-green .pw-score-to { color: #22c55e; }
.pw-hero-score.tier-green .pw-score-fill { background: #22c55e; }

.pw-hero-score.tier-muted .pw-score-main { color: var(--sellora-text-muted); }

.pw-validation-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    border: 1px solid rgba(255,255,255,0.08);
}

.pw-validation-pill.val-pass {
    color: #4ade80;
    background: rgba(34,197,94,0.08);
    border-color: rgba(34,197,94,0.22);
    box-shadow:
        0 0 0 1px rgba(34, 197, 94, 0.14),
        0 0 16px rgba(34, 197, 94, 0.1);
    transition: box-shadow 200ms ease, border-color 200ms ease;
}

.pw-validation-pill.val-pass:focus-visible {
    outline: 2px solid rgba(74, 222, 128, 0.55);
    outline-offset: 2px;
}

.pw-hero-meta {
    margin: 10px 0 0;
    font-size: 11px;
    font-weight: 500;
    color: var(--sellora-text-muted);
    letter-spacing: 0.01em;
    line-height: 1.4;
}

.pw-validation-pill.val-review {
    color: #fb923c;
    background: rgba(249,115,22,0.08);
    border-color: rgba(249,115,22,0.18);
}

.pw-validation-pill.val-waiting {
    color: var(--sellora-text-muted);
    background: rgba(255,255,255,0.04);
}

.pw-validation-pill.val-error {
    color: #f87171;
    background: rgba(239,68,68,0.08);
    border-color: rgba(239,68,68,0.18);
}

/* Compact results strip */
.pw-quick-results {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    padding: 0 6px;
}

.pw-quick-chip {
    display: inline-flex;
    align-items: center;
    font-size: 12px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: var(--sellora-text-muted);
}

.pw-quick-chip.is-up {
    color: #86efac;
    background: rgba(34, 197, 94, 0.08);
    border-color: rgba(34, 197, 94, 0.16);
}

.pw-quick-chip.is-neutral {
    color: var(--sellora-text-muted);
}

.pw-quick-chip.is-muted {
    color: #c4b5fd;
    background: rgba(123, 46, 232, 0.08);
    border-color: rgba(123, 46, 232, 0.14);
}

/* Stats — unified KPI panel */
.pw-stats-panel {
    padding: 0;
    overflow: hidden;
    background: linear-gradient(168deg, rgba(255, 255, 255, 0.028) 0%, rgba(255, 255, 255, 0.01) 52%, rgba(0, 0, 0, 0.06) 100%);
    border: 1px solid rgba(255, 255, 255, 0.09);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 10px 32px rgba(0, 0, 0, 0.16);
}

.pw-stats-panel:hover {
    transform: none !important;
}

.pw-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: stretch;
}

.pw-stat-cell {
    position: relative;
    min-height: 136px;
    transition: background 200ms ease;
}

.pw-stat-cell:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 18px;
    right: 0;
    bottom: 18px;
    width: 1px;
    background: rgba(255, 255, 255, 0.07);
    pointer-events: none;
}

.pw-stat-cell .pw-stat-body {
    min-height: 136px;
}

.pw-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;
}

.pw-stat-card {
    padding: 0;
    min-height: 136px;
    height: 100%;
    overflow: hidden;
    background: linear-gradient(168deg, rgba(255, 255, 255, 0.035) 0%, rgba(255, 255, 255, 0.012) 48%, rgba(0, 0, 0, 0.08) 100%);
    border: 1px solid rgba(255, 255, 255, 0.09);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 10px 32px rgba(0, 0, 0, 0.18);
    transition:
        border-color 220ms ease,
        box-shadow 220ms ease,
        transform 220ms ease;
}

.pw-stat-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    height: 100%;
    min-height: 136px;
    padding: 20px 22px;
    box-sizing: border-box;
}

.pw-stat-card.pw-stat-done {
    border-color: rgba(255, 255, 255, 0.12);
}

.pw-stat-card.pw-stat-neutral-anim.pw-stat-done {
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.04),
        0 10px 32px rgba(0, 0, 0, 0.18);
}

.pw-stat-card.pw-stat-neutral-anim.pw-stat-done .pw-stat-to,
.pw-stat-card.pw-stat-neutral-anim .pw-stat-sub.is-neutral {
    color: var(--sellora-text-muted);
}

.pw-stat-card.pw-stat-done .pw-stat-to {
    color: var(--sellora-text, #f7f8ff);
}

.pw-stat-anim {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    transition: color 220ms ease;
}

.pw-stat-label {
    display: block;
    margin: 0 0 14px;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.42);
    line-height: 1.2;
}

.pw-stat-value {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-height: 44px;
    margin: 0;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -0.04em;
    color: var(--sellora-text, #f7f8ff);
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.pw-stat-range {
    display: inline-flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.28em;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: 1.1;
}

.pw-stat-from {
    font-size: 0.78em;
    font-weight: 600;
    color: rgba(255, 255, 255, 0.38);
    letter-spacing: -0.02em;
}

.pw-stat-arrow {
    font-size: 0.72em;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.28);
    line-height: 1;
    user-select: none;
}

.pw-stat-to {
    font-size: 1em;
    font-weight: 800;
    color: var(--sellora-text, #f7f8ff);
    letter-spacing: -0.04em;
}

.pw-stat-sub {
    display: block;
    flex-shrink: 0;
    margin-top: auto;
    padding-top: 10px;
    min-height: 22px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
    line-height: 1.2;
    color: #4ade80;
    opacity: 0;
    transform: translateY(3px);
    transition: opacity 220ms ease, transform 220ms ease, color 220ms ease;
}

.pw-stat-sub.pw-sub-visible {
    opacity: 1;
    transform: translateY(0);
}

.pw-stat-sub.is-up {
    color: #4ade80;
}

.pw-stat-sub.is-neutral {
    color: rgba(255, 255, 255, 0.42);
    font-size: 13px;
    font-weight: 600;
}

.pw-stat-sub.is-fields {
    color: rgba(255, 255, 255, 0.46);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
    text-transform: none;
}

.pw-stat-sub.is-down {
    color: #f87171;
}

.pw-stat-card--fields .pw-stat-value,
.pw-stat-cell--fields .pw-stat-value {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -0.05em;
}

.pw-stat-card--fields.pw-stat-empty .pw-stat-value,
.pw-stat-card.pw-stat-empty .pw-stat-value {
    color: rgba(255, 255, 255, 0.35);
    font-weight: 700;
}

.pw-stat-card.pw-stat-flat .pw-stat-value {
    font-size: 32px;
}

.pw-time-slot {
    padding: 10px 16px;
    border-radius: 10px;
    background: rgba(123, 46, 232, 0.08);
    border: 1px solid rgba(123, 46, 232, 0.16);
    font-size: 13px;
    font-weight: 500;
    color: #d8b4fe;
}

/* Toolbar */
.pw-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    padding: 16px 20px;
}

.pw-state {
    flex: 1;
    min-width: 140px;
    font-size: 13px;
    color: var(--sellora-text-muted);
}

.product-workspace .btn-optimize.is-unnecessary {
    background: rgba(71,85,105,0.85) !important;
    box-shadow: none !important;
}

/* 3-column workspace */
.pw-columns {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 300px;
    gap: 20px;
    align-items: start;
}

.pw-col-head {
    padding: 20px 22px 16px;
    border-bottom: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    position: sticky;
    top: 0;
    z-index: 3;
    background: inherit;
    backdrop-filter: blur(8px);
}

.pw-col-head h3 {
    margin: 6px 0 0;
    font-size: 16px;
    font-weight: 600;
}

.pw-col-body {
    padding: 20px 22px 22px;
}

.pw-col-original {
    position: relative;
    overflow: hidden;
    background: linear-gradient(165deg, rgba(12, 16, 26, 0.97) 0%, rgba(18, 22, 34, 0.94) 100%);
    border-color: rgba(148, 163, 184, 0.16);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.045),
        inset 0 -1px 0 rgba(0, 0, 0, 0.14),
        0 0 0 1px rgba(100, 116, 139, 0.08),
        0 8px 32px rgba(0, 0, 0, 0.14);
    transition:
        border-color 200ms ease,
        background 200ms ease,
        box-shadow 200ms ease;
}

.pw-col-original::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 130% 70% at 50% -18%, rgba(148, 163, 184, 0.09) 0%, transparent 58%);
    pointer-events: none;
    z-index: 0;
}

.pw-col-original .pw-col-head,
.pw-col-original .pw-col-body {
    position: relative;
    z-index: 1;
}

.pw-col-original .pw-col-head {
    background: rgba(10, 14, 24, 0.94);
    border-bottom-color: rgba(148, 163, 184, 0.1);
    transition:
        background 200ms ease,
        border-bottom-color 200ms ease,
        box-shadow 200ms ease;
}

.pw-col-original .pw-col-head .eyebrow,
.pw-col-original .pw-col-head h3,
.pw-col-original .content-field-card label,
.pw-col-original .field,
.pw-col-original .pw-kw-tags {
    transition:
        color 200ms ease,
        border-color 200ms ease,
        box-shadow 200ms ease;
}

.pw-col-ai {
    position: relative;
    overflow: hidden;
    background: linear-gradient(165deg, rgba(12, 16, 26, 0.97) 0%, rgba(15, 18, 32, 0.95) 100%);
    border-color: rgba(139, 92, 246, 0.18);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.035),
        0 0 0 1px rgba(139, 92, 246, 0.06),
        0 8px 32px rgba(0, 0, 0, 0.14);
    transition:
        border-color 200ms ease,
        background 200ms ease,
        box-shadow 200ms ease;
}

.pw-col-ai .pw-col-head {
    border-bottom-color: rgba(139, 92, 246, 0.14);
    background: rgba(14, 12, 26, 0.94);
    transition:
        background 200ms ease,
        border-bottom-color 200ms ease;
}

.pw-col-ai .field {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.07);
}

.pw-col-ai .field.changed {
    border-color: rgba(139, 92, 246, 0.22);
    background: rgba(123, 46, 232, 0.035);
}

.pw-col-ai .kw-tag {
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.09);
    color: var(--sellora-text-muted);
}

.pw-col-ai .kw-tag-add {
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(34, 197, 94, 0.18);
    color: #86efac;
}

.pw-col-ai .pw-col-head h3,
.pw-col-ai .eyebrow-ai,
.pw-col-ai .content-field-card label,
.pw-col-ai .field,
.pw-col-ai .pw-kw-tags,
.pw-col-ai .kw-tag,
.pw-col-ai .diff-badge {
    transition:
        color 200ms ease,
        border-color 200ms ease,
        background 200ms ease,
        box-shadow 200ms ease;
}

/* Source card — neutral slate hover / focus-within (no transform) */
@media (hover: hover) {
    .product-workspace .pw-col-original:hover {
        border-color: rgba(148, 163, 184, 0.34);
        background: linear-gradient(165deg, rgba(14, 18, 30, 0.99) 0%, rgba(24, 30, 46, 0.96) 100%);
        box-shadow:
            0 0 0 1px rgba(148, 163, 184, 0.16),
            0 10px 40px rgba(15, 23, 42, 0.24),
            0 0 26px rgba(100, 116, 139, 0.09),
            inset 0 1px 0 rgba(255, 255, 255, 0.05),
            inset 0 0 0 1px rgba(148, 163, 184, 0.07);
    }

    .product-workspace .pw-col-original:hover .pw-col-head {
        background: rgba(16, 22, 36, 0.98);
        border-bottom-color: rgba(148, 163, 184, 0.2);
        box-shadow: inset 0 -1px 0 rgba(148, 163, 184, 0.06);
    }

    .product-workspace .pw-col-original:hover .pw-col-head .eyebrow {
        color: rgba(203, 213, 225, 0.88);
    }

    .product-workspace .pw-col-original:hover .pw-col-head h3 {
        color: rgba(248, 250, 252, 0.98);
    }

    .product-workspace .pw-col-original:hover .field {
        border-color: rgba(148, 163, 184, 0.18);
    }

    .product-workspace .pw-col-original:hover .pw-kw-tags {
        box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.14);
    }

    /* AI card — muted purple hover (no transform) */
    .product-workspace .pw-col-ai:hover {
        border-color: rgba(168, 85, 247, 0.28);
        background: linear-gradient(165deg, rgba(14, 16, 28, 0.98) 0%, rgba(18, 16, 34, 0.96) 100%);
        box-shadow:
            0 0 0 1px rgba(139, 92, 246, 0.12),
            0 10px 36px rgba(15, 23, 42, 0.2),
            0 0 18px rgba(123, 46, 232, 0.05);
    }

    .product-workspace .pw-col-ai:hover .pw-col-head {
        background: rgba(16, 14, 30, 0.96);
        border-bottom-color: rgba(168, 85, 247, 0.22);
    }

    .product-workspace .pw-col-ai:hover .eyebrow-ai {
        color: #b794f6;
    }

    .product-workspace .pw-col-ai:hover .diff-badge {
        background: linear-gradient(135deg, #7b35e8, #5a1fc4);
        box-shadow: 0 0 8px rgba(123, 46, 232, 0.18);
    }

    .product-workspace .pw-col-ai:hover .field {
        border-color: rgba(139, 92, 246, 0.16);
    }

    .product-workspace .pw-col-ai:hover .field.changed {
        border-color: rgba(168, 85, 247, 0.28);
        background: rgba(123, 46, 232, 0.05);
    }

    .product-workspace .pw-col-ai:hover .pw-kw-tags {
        box-shadow: inset 0 0 0 1px rgba(168, 85, 247, 0.12);
    }

    .product-workspace .pw-col-ai:hover .kw-tag {
        border-color: rgba(255, 255, 255, 0.11);
    }

    .product-workspace .pw-col-ai:hover .kw-tag-add {
        border-color: rgba(34, 197, 94, 0.24);
        color: #a7f3d0;
        background: rgba(34, 197, 94, 0.11);
    }
}

.product-workspace .pw-col-original:focus-within {
    border-color: rgba(148, 163, 184, 0.34);
    background: linear-gradient(165deg, rgba(14, 18, 30, 0.99) 0%, rgba(24, 30, 46, 0.96) 100%);
    box-shadow:
        0 0 0 1px rgba(148, 163, 184, 0.16),
        0 10px 40px rgba(15, 23, 42, 0.24),
        0 0 26px rgba(100, 116, 139, 0.09),
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        inset 0 0 0 1px rgba(148, 163, 184, 0.07);
}

.product-workspace .pw-col-original:focus-within .pw-col-head {
    background: rgba(16, 22, 36, 0.98);
    border-bottom-color: rgba(148, 163, 184, 0.2);
    box-shadow: inset 0 -1px 0 rgba(148, 163, 184, 0.06);
}

.product-workspace .pw-col-original:focus-within .pw-col-head .eyebrow {
    color: rgba(203, 213, 225, 0.88);
}

.product-workspace .pw-col-original:focus-within .pw-col-head h3 {
    color: rgba(248, 250, 252, 0.98);
}

.product-workspace .pw-col-original:focus-within .field {
    border-color: rgba(148, 163, 184, 0.18);
}

.product-workspace .pw-col-original:focus-within .pw-kw-tags {
    box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.14);
}

.product-workspace .pw-col-ai:focus-within {
    border-color: rgba(168, 85, 247, 0.28);
    background: linear-gradient(165deg, rgba(14, 16, 28, 0.98) 0%, rgba(18, 16, 34, 0.96) 100%);
    box-shadow:
        0 0 0 1px rgba(139, 92, 246, 0.12),
        0 10px 36px rgba(15, 23, 42, 0.2),
        0 0 18px rgba(123, 46, 232, 0.05);
}

.product-workspace .pw-col-ai:focus-within .pw-col-head {
    background: rgba(16, 14, 30, 0.96);
    border-bottom-color: rgba(168, 85, 247, 0.22);
}

.product-workspace .pw-col-ai:focus-within .pw-col-head h3 {
    color: rgba(247, 248, 255, 0.98);
}

.product-workspace .pw-col-ai:focus-within .eyebrow-ai {
    color: #c4b5fd;
}

.product-workspace .pw-col-ai:focus-within .diff-badge {
    background: linear-gradient(135deg, #8b45f0, #6a24db);
    box-shadow: 0 0 10px rgba(123, 46, 232, 0.28);
}

.product-workspace .pw-col-ai:focus-within .field {
    border-color: rgba(139, 92, 246, 0.22);
}

.product-workspace .pw-col-ai:focus-within .field.changed {
    border-color: rgba(168, 85, 247, 0.38);
    background: rgba(123, 46, 232, 0.06);
}

.product-workspace .pw-col-ai:focus-within .pw-kw-tags {
    box-shadow: inset 0 0 0 1px rgba(168, 85, 247, 0.18);
}

.product-workspace .pw-col-ai:focus-within .kw-tag {
    border-color: rgba(255, 255, 255, 0.14);
}

.product-workspace .pw-col-ai:focus-within .kw-tag-add {
    border-color: rgba(34, 197, 94, 0.3);
    color: #bbf7d0;
    background: rgba(34, 197, 94, 0.14);
}

.pw-panel-aux {
    background: rgba(12, 16, 28, 0.72);
    border-color: rgba(255, 255, 255, 0.07);
    box-shadow: 0 6px 28px rgba(0, 0, 0, 0.16);
}

.pw-col-changes {
    background: rgba(14, 18, 30, 0.65);
    border-color: rgba(255, 255, 255, 0.08);
}

.pw-diff-toggle {
    display: inline-flex;
    margin-top: 12px;
    padding: 3px;
    border-radius: 10px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    gap: 2px;
}

.pw-diff-btn {
    border: none;
    background: transparent;
    color: var(--sellora-text-muted);
    font-family: inherit;
    font-size: 11px;
    font-weight: 600;
    padding: 6px 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 180ms ease, color 180ms ease;
}

.pw-diff-btn.active {
    background: rgba(123, 46, 232, 0.28);
    color: #e9d5ff;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);
}

.pw-diff-btn:hover:not(.active) {
    color: var(--sellora-text);
    background: rgba(255,255,255,0.06);
}

.pw-diff-btn:focus-visible {
    outline: 2px solid rgba(168, 85, 247, 0.45);
    outline-offset: 1px;
}

.pw-col-body-compact {
    padding-top: 14px;
    padding-bottom: 16px;
}

.pw-empty-ai {
    display: none;
}

/* Unified empty states — Notion / Stripe style */
.pw-empty-state {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 32px 24px;
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.008) 100%);
    border: 1px dashed rgba(255, 255, 255, 0.1);
    overflow: hidden;
}

.pw-empty-state-glow {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(123, 46, 232, 0.1), transparent 70%);
    opacity: 0.85;
}

.pw-empty-state--purple .pw-empty-state-glow {
    background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(168, 85, 247, 0.14), transparent 70%);
}

.pw-empty-state--blue .pw-empty-state-glow {
    background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(59, 130, 246, 0.12), transparent 70%);
}

.pw-empty-state--green .pw-empty-state-glow {
    background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(34, 197, 94, 0.1), transparent 70%);
}

.pw-empty-state--neutral .pw-empty-state-glow {
    background: radial-gradient(ellipse 70% 55% at 50% 0%, rgba(255, 255, 255, 0.06), transparent 70%);
}

.pw-empty-state-icon {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    margin-bottom: 16px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: rgba(255, 255, 255, 0.04);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.pw-empty-state--purple .pw-empty-state-icon {
    color: #c4b5fd;
    background: rgba(123, 46, 232, 0.1);
    border-color: rgba(168, 85, 247, 0.22);
}

.pw-empty-state--blue .pw-empty-state-icon {
    color: #93c5fd;
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.2);
}

.pw-empty-state--green .pw-empty-state-icon {
    color: #86efac;
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(34, 197, 94, 0.18);
}

.pw-empty-state--neutral .pw-empty-state-icon {
    color: rgba(255, 255, 255, 0.55);
    background: rgba(255, 255, 255, 0.04);
    border-color: rgba(255, 255, 255, 0.1);
}

.pw-empty-state-title {
    position: relative;
    z-index: 1;
    display: block;
    margin: 0 0 8px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--sellora-text, #f7f8ff);
    line-height: 1.3;
}

.pw-empty-state-text {
    position: relative;
    z-index: 1;
    margin: 0;
    max-width: 300px;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.44);
}

.pw-empty-state--compact {
    padding: 24px 18px;
    min-height: 168px;
}

.pw-empty-state--compact .pw-empty-state-icon {
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
    border-radius: 12px;
}

.pw-empty-state--compact .pw-empty-state-icon svg {
    width: 22px;
    height: 22px;
}

.pw-empty-state--compact .pw-empty-state-title {
    font-size: 14px;
}

.pw-empty-state--compact .pw-empty-state-text {
    font-size: 12px;
    max-width: 240px;
}

.pw-empty-state--fill {
    width: 100%;
    min-height: 220px;
}

.pw-change-wrap.is-empty,
.pw-why-grid--empty {
    display: block;
}

.pw-change-wrap:not(.is-empty) {
    display: block;
}

.pw-timeline--empty {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pw-timeline--empty .pw-empty-state {
    width: 100%;
}

#empty-ai.pw-empty-state {
    min-height: 240px;
    margin: 4px 0;
}

/* Change mini-stat tiles */
.pw-change-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.pw-mini-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 14px 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    transition:
        border-color 200ms ease,
        box-shadow 200ms ease,
        background 200ms ease,
        opacity 220ms ease,
        transform 220ms ease;
    opacity: 1;
    transform: none;
}

.pw-results-live .pw-mini-stat:not(.pw-mini-visible) {
    opacity: 0;
    transform: translateY(6px);
}

.pw-mini-stat.pw-mini-visible {
    opacity: 1;
    transform: translateY(0);
}

.pw-mini-stat-icon {
    display: inline-flex;
    align-items: center;
    margin-bottom: 2px;
    color: var(--sellora-text-muted);
    opacity: 0.75;
}

.pw-mini-stat-icon svg {
    width: 14px;
    height: 14px;
}

.pw-mini-stat-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.42);
    line-height: 1.2;
}

.pw-mini-stat-delta {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.pw-mini-stat--up .pw-mini-stat-delta {
    color: #4ade80;
}

.pw-mini-stat--neutral .pw-mini-stat-delta {
    color: rgba(255, 255, 255, 0.72);
}

.pw-mini-stat-range {
    font-size: 12px;
    font-weight: 600;
    color: var(--sellora-text-muted);
    font-variant-numeric: tabular-nums;
}

.pw-mini-stat-caption {
    font-size: 11px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.38);
    line-height: 1.35;
    margin-top: 2px;
}

/* legacy change list — kept for compatibility */
.pw-change-list,
.pw-reason-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pw-change-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    background: rgba(34,197,94,0.06);
    border: 1px solid rgba(34,197,94,0.12);
    color: #a7f3c0;
    transition: background 180ms ease;
}

.pw-change-list li:hover {
    background: rgba(34,197,94,0.09);
}

.pw-change-list li.is-neutral {
    background: rgba(255, 255, 255, 0.03);
    border-color: rgba(255, 255, 255, 0.07);
    color: var(--sellora-text-muted);
}

.pw-change-list li.is-neutral:hover {
    background: rgba(255, 255, 255, 0.045);
}

.pw-change-list li.is-neutral .pw-change-val {
    color: var(--sellora-text);
}

.pw-change-body strong {
    display: block;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    opacity: 0.85;
}

.pw-change-val {
    display: block;
    margin-top: 2px;
    color: #86efac;
    font-weight: 600;
}

.pw-change-icon {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    margin-top: 1px;
    color: currentColor;
    opacity: 0.85;
}

.pw-change-icon svg {
    width: 14px;
    height: 14px;
}

/* legacy — removed plain-text empty li */
.pw-change-empty {
    display: none;
}

.pw-kw-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    max-width: 100%;
}

.kw-tag {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    max-width: 100%;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.3;
    word-break: break-word;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: var(--sellora-text-muted);
}

.kw-tag-add {
    background: rgba(34, 197, 94, 0.12);
    border-color: rgba(34, 197, 94, 0.22);
    color: #86efac;
}

.kw-tag-del {
    background: rgba(239, 68, 68, 0.1);
    border-color: rgba(239, 68, 68, 0.2);
    color: #fca5a5;
    text-decoration: line-through;
}

.kw-tag-mark {
    font-weight: 700;
    opacity: 0.85;
}

.pw-reasons-body {
    padding-top: 18px;
    padding-bottom: 22px;
}

/* Why Sellora AI — reason cards grid */
.pw-why-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    align-items: stretch;
}

.pw-why-grid--empty {
    display: block;
}

.pw-why-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 168px;
    height: 100%;
    padding: 20px 20px 18px;
    border-radius: 14px;
    background: linear-gradient(168deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.012) 52%, rgba(123, 46, 232, 0.04) 100%);
    border: 1px solid rgba(255, 255, 255, 0.09);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.05),
        0 8px 28px rgba(0, 0, 0, 0.14);
    transition:
        transform 220ms ease,
        border-color 220ms ease,
        box-shadow 220ms ease,
        background 220ms ease;
}

@media (hover: hover) {
    .pw-why-card:hover {
        transform: translateY(-3px);
        border-color: rgba(168, 85, 247, 0.32);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.07),
            0 0 0 1px rgba(168, 85, 247, 0.12),
            0 14px 40px rgba(123, 46, 232, 0.18),
            0 8px 24px rgba(0, 0, 0, 0.2);
    }
}

.pw-why-card--seo .pw-why-icon {
    color: #4ade80;
    background: rgba(34, 197, 94, 0.1);
    border-color: rgba(34, 197, 94, 0.18);
}

.pw-why-card--keywords .pw-why-icon {
    color: #93c5fd;
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.18);
}

.pw-why-card--desc .pw-why-icon {
    color: #c4b5fd;
    background: rgba(139, 92, 246, 0.1);
    border-color: rgba(139, 92, 246, 0.18);
}

.pw-why-card--repeats .pw-why-icon {
    color: #fdba74;
    background: rgba(249, 115, 22, 0.1);
    border-color: rgba(249, 115, 22, 0.16);
}

.pw-why-card--readability .pw-why-icon {
    color: #a5b4fc;
    background: rgba(99, 102, 241, 0.1);
    border-color: rgba(99, 102, 241, 0.16);
}

.pw-why-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 14px;
    border-radius: 11px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    flex-shrink: 0;
}

.pw-why-metric {
    font-size: 32px;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    margin-bottom: 8px;
    font-variant-numeric: tabular-nums;
    color: var(--sellora-text, #f7f8ff);
}

.pw-why-metric.is-up {
    color: #4ade80;
}

.pw-why-metric.is-neutral {
    color: rgba(255, 255, 255, 0.72);
}

.pw-why-title {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--sellora-text, #f7f8ff);
    line-height: 1.25;
}

.pw-why-desc {
    margin: 0;
    margin-top: auto;
    padding-top: 4px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.5;
    color: rgba(255, 255, 255, 0.46);
}

.pw-why-grid--empty .pw-empty-state {
    min-height: 220px;
}

.pw-reason-cards {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pw-insight-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 16px;
    border-radius: 12px;
    background: rgba(123, 46, 232, 0.06);
    border: 1px solid rgba(123, 46, 232, 0.12);
    transition: background 180ms ease, border-color 180ms ease;
}

.pw-insight-card:hover {
    background: rgba(123, 46, 232, 0.09);
    border-color: rgba(123, 46, 232, 0.18);
}

.pw-insight-metric {
    flex-shrink: 0;
    min-width: 48px;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--sellora-text);
}

.pw-insight-metric.is-up { color: #22c55e; }
.pw-insight-metric.is-neutral { color: var(--sellora-text-muted); }

.pw-insight-body strong {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #e9d5ff;
    margin-bottom: 4px;
    text-transform: lowercase;
}

.pw-insight-body p {
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--sellora-text-muted);
}

.pw-reason-card {
    display: flex;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(123, 46, 232, 0.06);
    border: 1px solid rgba(123, 46, 232, 0.12);
    transition: background 180ms ease, transform 180ms ease;
}

.pw-reason-card:hover {
    background: rgba(123, 46, 232, 0.09);
}

.pw-reason-card .pw-reason-icon {
    flex-shrink: 0;
    font-size: 16px;
    line-height: 1.2;
}

.pw-reason-card strong {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #e9d5ff;
    margin-bottom: 4px;
}

.pw-reason-card p {
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--sellora-text-muted);
}

.pw-reason-empty {
    margin: 0;
    font-size: 13px;
    color: var(--sellora-text-muted);
}

/* Diff — softer highlights */
.diff-add {
    background: rgba(34, 197, 94, 0.14);
    color: inherit;
    border-radius: 4px;
    padding: 1px 2px;
}

.diff-del {
    background: rgba(239, 68, 68, 0.12);
    color: inherit;
    text-decoration: line-through;
    border-radius: 4px;
    padding: 1px 2px;
    opacity: 0.88;
}

.diff-same { color: inherit; }

.diff-muted { color: var(--sellora-text-muted); }

.diff-inline {
    font-size: 13px;
    line-height: 1.65;
    white-space: pre-wrap;
    word-break: break-word;
}

.product-workspace .field.changed {
    border-color: rgba(139,92,246,0.25);
    background: rgba(123,46,232,0.04);
}

/* Insights row */
.pw-insights {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
}

.pw-seo-rows {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pw-seo-row {
    padding: 4px 6px;
    margin: 0 -6px;
    transition: background 200ms ease;
}

.pw-seo-row-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 600;
    gap: 12px;
}

.pw-seo-row-label {
    color: var(--sellora-text-muted);
    font-weight: 600;
}

.pw-seo-row-val {
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.pw-seo-row-head strong {
    font-size: 13px;
    font-weight: 700;
}

.pw-seo-row-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px;
}

.pw-seo-compare {
    font-size: 12px;
    font-weight: 600;
    color: var(--sellora-text-muted);
}

.pw-seo-diff {
    font-size: 11px;
    font-weight: 700;
}

.pw-seo-diff.up { color: #22c55e; }
.pw-seo-diff.down { color: #ef4444; }
.pw-seo-diff.neutral { color: var(--sellora-text-muted); font-weight: 600; }

.pw-seo-row-track {
    height: 5px;
    border-radius: 999px;
    background: rgba(255,255,255,0.06);
    overflow: hidden;
}

.pw-seo-row-fill {
    height: 100%;
    border-radius: 999px;
    background: #a855f7;
    transition: width 800ms cubic-bezier(0.22, 1, 0.36, 1);
    will-change: width;
    box-shadow: 0 0 10px rgba(168, 85, 247, 0.35);
}

.pw-seo-row.tier-red .pw-seo-row-fill,
.pw-seo-row.tier-red .pw-seo-row-head strong,
.pw-seo-row.tier-red .pw-seo-row-val { color: #ef4444; }
.pw-seo-row.tier-red .pw-seo-row-fill { background: #ef4444; box-shadow: 0 0 10px rgba(239, 68, 68, 0.35); }

.pw-seo-row.tier-orange .pw-seo-row-fill,
.pw-seo-row.tier-orange .pw-seo-row-head strong,
.pw-seo-row.tier-orange .pw-seo-row-val { color: #f97316; }
.pw-seo-row.tier-orange .pw-seo-row-fill { background: #f97316; box-shadow: 0 0 10px rgba(249, 115, 22, 0.3); }

.pw-seo-row.tier-yellow .pw-seo-row-fill,
.pw-seo-row.tier-yellow .pw-seo-row-head strong,
.pw-seo-row.tier-yellow .pw-seo-row-val { color: #eab308; }
.pw-seo-row.tier-yellow .pw-seo-row-fill { background: #eab308; box-shadow: 0 0 10px rgba(234, 179, 8, 0.28); }

.pw-seo-row.tier-lgreen .pw-seo-row-fill,
.pw-seo-row.tier-lgreen .pw-seo-row-head strong,
.pw-seo-row.tier-lgreen .pw-seo-row-val { color: #86efac; }
.pw-seo-row.tier-lgreen .pw-seo-row-fill { background: #86efac; box-shadow: 0 0 10px rgba(134, 239, 172, 0.28); }

.pw-seo-row.tier-green .pw-seo-row-fill,
.pw-seo-row.tier-green .pw-seo-row-head strong,
.pw-seo-row.tier-green .pw-seo-row-val { color: #22c55e; }
.pw-seo-row.tier-green .pw-seo-row-fill { background: #22c55e; box-shadow: 0 0 10px rgba(34, 197, 94, 0.32); }

.pw-muted {
    margin: 0;
    font-size: 13px;
    color: var(--sellora-text-muted);
}

/* Timeline */
.pw-timeline {
    list-style: none;
    margin: 0;
    padding: 4px 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pw-timeline li {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 14px 14px 50px;
    min-height: 60px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.06);
    transition: background 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
}

.pw-tl-marker {
    position: absolute;
    left: 14px;
    top: 14px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.14);
    color: var(--sellora-text-muted);
    z-index: 1;
    transition: background 200ms ease, border-color 200ms ease, box-shadow 200ms ease, color 200ms ease, filter 200ms ease;
}

.pw-timeline li.is-done .pw-tl-marker {
    background: rgba(34,197,94,0.12);
    border-color: rgba(74, 222, 128, 0.45);
    color: #4ade80;
    box-shadow: 0 0 0 3px rgba(34,197,94,0.1);
}

.pw-timeline li.is-warn .pw-tl-marker {
    background: rgba(249,115,22,0.12);
    border-color: rgba(251, 146, 60, 0.45);
    color: #fb923c;
    box-shadow: 0 0 0 3px rgba(249,115,22,0.1);
}

.pw-tl-label {
    font-size: 14px;
    font-weight: 600;
    color: var(--sellora-text, #f7f8ff);
    transition: color 200ms ease;
}

.pw-timeline li.is-current .pw-tl-marker {
    background: rgba(168, 85, 247, 0.14);
    border-color: rgba(192, 132, 252, 0.5);
    color: #c084fc;
    box-shadow: 0 0 0 3px rgba(168, 85, 247, 0.12);
}

.pw-timeline li.is-pending .pw-tl-marker {
    background: rgba(255,255,255,0.04);
    border-color: rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.35);
}

.pw-timeline li.is-pending .pw-tl-label {
    color: var(--sellora-text-muted);
}

.pw-timeline li.is-error .pw-tl-marker {
    background: rgba(239,68,68,0.12);
    border-color: rgba(248, 113, 113, 0.45);
    color: #f87171;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.pw-tl-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    padding-top: 2px;
}

.pw-tl-date {
    font-size: 11px;
    font-weight: 500;
    color: var(--sellora-text-muted);
    letter-spacing: 0.01em;
}

.pw-tl-line {
    position: absolute;
    left: 27px;
    top: 46px;
    width: 2px;
    height: calc(100% + 2px);
    background: rgba(255,255,255,0.08);
    border-radius: 1px;
}

.pw-timeline li.is-done .pw-tl-line {
    background: rgba(34,197,94,0.22);
}

.pw-timeline li.is-current .pw-tl-line {
    background: linear-gradient(180deg, rgba(168, 85, 247, 0.35) 0%, rgba(255,255,255,0.08) 100%);
}

.product-workspace .btn-publish {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-width: 0;
    padding-left: 20px;
    padding-right: 20px;
    overflow: hidden;
}

.product-workspace .btn-publish .btn-label {
    transition: transform 200ms ease;
}

.product-workspace .btn-publish .btn-arrow {
    display: inline-block;
    width: 0;
    opacity: 0;
    overflow: hidden;
    margin-left: 0;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    transition: width 200ms ease, opacity 200ms ease, margin 200ms ease;
}

.product-workspace .btn-publish.has-arrow .btn-arrow {
    width: 14px;
    opacity: 0;
    margin-left: 0;
}

.product-workspace .btn-publish.is-ready:not(:disabled) {
    background: linear-gradient(135deg, #16a34a 0%, #15803d 100%) !important;
    transition:
        box-shadow 200ms ease,
        border-color 200ms ease,
        filter 200ms ease,
        background 200ms ease;
    box-shadow:
        0 4px 16px rgba(34, 197, 94, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.product-workspace .btn-publish.is-ready:hover:not(:disabled) {
    transform: none;
    filter: brightness(1.06);
    box-shadow:
        0 6px 22px rgba(34, 197, 94, 0.38),
        0 0 18px rgba(34, 197, 94, 0.14),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.product-workspace .btn-publish.is-ready:hover:not(:disabled) .btn-arrow {
    width: 14px;
    opacity: 1;
    margin-left: 8px;
}

.product-workspace .btn-publish.is-ready:active:not(:disabled) {
    transform: none;
    filter: brightness(0.96);
    box-shadow:
        0 2px 10px rgba(34, 197, 94, 0.22),
        inset 0 1px 2px rgba(0, 0, 0, 0.12);
}

.product-workspace .btn-publish.is-ready:focus-visible {
    outline: 2px solid rgba(74, 222, 128, 0.55);
    outline-offset: 2px;
}

.product-workspace .btn-publish:disabled {
    box-shadow: none !important;
    filter: none;
}

.product-workspace .btn-publish:disabled .btn-arrow {
    display: none;
}

/* Language switch — product workspace */
.product-workspace .pw-lang-switch {
    padding: 3px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.08);
    gap: 2px;
}

.product-workspace .pw-lang-switch .segment {
    min-width: 56px;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: 0.04em;
    transition:
        color 200ms ease,
        background 200ms ease,
        box-shadow 200ms ease;
}

.product-workspace .pw-lang-switch .segment:hover:not(.active) {
    color: var(--sellora-text);
    background: rgba(255, 255, 255, 0.05);
}

.product-workspace .pw-lang-switch .segment.active {
    background: rgba(123, 46, 232, 0.28);
    color: #e9d5ff;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.08),
        0 1px 4px rgba(123, 46, 232, 0.12);
}

.product-workspace .pw-lang-switch .segment:focus-visible {
    outline: 2px solid rgba(168, 85, 247, 0.5);
    outline-offset: 1px;
}

.product-workspace .pw-lang-switch .segment:active:not(.active) {
    background: rgba(255, 255, 255, 0.07);
}

/* Result reveal animations */
.pw-results-live .pw-stat-cell:not(.pw-kpi-visible) {
    opacity: 0;
    transform: translateY(5px);
}

.pw-stat-cell.pw-kpi-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 220ms ease, transform 220ms ease;
}

.pw-validation-pill.val-pass:not(.pw-val-visible) {
    opacity: 0;
    transform: scale(0.92);
}

.pw-validation-pill.val-pass.pw-val-visible {
    opacity: 1;
    transform: scale(1);
    transition: opacity 220ms ease, transform 220ms ease;
}

.pw-validation-pill.val-pass.pw-val-visible .pw-val-icon {
    opacity: 1;
    transition: opacity 220ms ease;
}

.product-workspace .btn-primary:hover:not(:disabled):not(.btn-publish) {
    transform: translateY(-2px);
}

.product-workspace .btn-primary:active:not(:disabled) {
    transform: translateY(0) scale(0.98);
    transition-duration: 120ms;
}

.product-workspace .btn-primary:disabled {
    opacity: 0.42;
    cursor: not-allowed;
    transform: none;
    filter: grayscale(0.15);
}

.product-workspace .btn-primary.loading {
    pointer-events: none;
    opacity: 0.88;
}

.product-workspace .btn-optimize.is-unnecessary:disabled {
    opacity: 0.5;
    filter: none;
}

.product-workspace .btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0 18px;
    border-radius: 10px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.04);
    color: var(--sellora-text-muted);
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 220ms ease, border-color 220ms ease, color 220ms ease, transform 220ms ease;
}

@media (hover: hover) {
    .product-workspace .btn-secondary:hover {
        background: rgba(255, 255, 255, 0.07);
        border-color: rgba(255, 255, 255, 0.18);
        color: var(--sellora-text);
        transform: translateY(-1px);
    }
}

.product-workspace .btn-secondary:active {
    transform: translateY(0) scale(0.98);
}

/* Staggered reveal after AI analysis */
.pw-reveal {
    opacity: 0;
    transform: translateY(10px);
}

.pw-reveal.pw-revealed {
    animation: pwBlockReveal 240ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
    animation-delay: var(--pw-stagger, 0ms);
}

@keyframes pwBlockReveal {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.pw-results-live .pw-mini-stat {
    animation: pwBlockReveal 220ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.pw-results-live .pw-mini-stat:nth-child(1) { animation-delay: 60ms; }
.pw-results-live .pw-mini-stat:nth-child(2) { animation-delay: 130ms; }
.pw-results-live .pw-mini-stat:nth-child(3) { animation-delay: 200ms; }
.pw-results-live .pw-mini-stat:nth-child(4) { animation-delay: 270ms; }
.pw-results-live .pw-mini-stat:nth-child(5) { animation-delay: 340ms; }
.pw-results-live .pw-why-card {
    animation: pwBlockReveal 220ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.pw-results-live .pw-why-card:nth-child(1) { animation-delay: 80ms; }
.pw-results-live .pw-why-card:nth-child(2) { animation-delay: 110ms; }
.pw-results-live .pw-why-card:nth-child(3) { animation-delay: 140ms; }
.pw-results-live .pw-why-card:nth-child(4) { animation-delay: 170ms; }
.pw-results-live .pw-why-card:nth-child(5) { animation-delay: 200ms; }

.pw-results-live .pw-insight-card {
    animation: pwBlockReveal 220ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.pw-results-live .pw-insight-card:nth-child(1) { animation-delay: 80ms; }
.pw-results-live .pw-insight-card:nth-child(2) { animation-delay: 110ms; }
.pw-results-live .pw-insight-card:nth-child(3) { animation-delay: 140ms; }
.pw-results-live .pw-insight-card:nth-child(4) { animation-delay: 170ms; }

.pw-quick-results:not(.hidden) .pw-quick-chip {
    animation: pwBlockReveal 220ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}

.pw-quick-results:not(.hidden) .pw-quick-chip:nth-child(1) { animation-delay: 40ms; }
.pw-quick-results:not(.hidden) .pw-quick-chip:nth-child(2) { animation-delay: 70ms; }
.pw-quick-results:not(.hidden) .pw-quick-chip:nth-child(3) { animation-delay: 100ms; }
.pw-quick-results:not(.hidden) .pw-quick-chip:nth-child(4) { animation-delay: 130ms; }

@media (prefers-reduced-motion: reduce) {
    .product-workspace .panel,
    .product-workspace .pw-stat-card,
    .pw-score-fill,
    .pw-seo-row-fill,
    .pw-stat-sub,
    .pw-score-deltas,
    .pw-score-verdict,
    .product-workspace .btn-primary,
    .product-workspace .btn-secondary,
    .pw-timeline li,
    .pw-mini-stat,
    .pw-stat-cell,
    .pw-validation-pill.val-pass {
        transition: none !important;
        animation: none !important;
        transform: none !important;
        opacity: 1 !important;
    }

    .pw-results-live .pw-stat-cell,
    .pw-results-live .pw-mini-stat,
    .pw-validation-pill.val-pass:not(.pw-val-visible),
    .pw-validation-pill.val-pass.pw-val-visible {
        opacity: 1 !important;
        transform: none !important;
    }
    .product-workspace .pw-col-ai,
    .product-workspace .pw-col-original .pw-col-head,
    .product-workspace .pw-col-ai .pw-col-head,
    .product-workspace .pw-col-original .field,
    .product-workspace .pw-col-ai .field,
    .product-workspace .pw-col-original .pw-kw-tags,
    .product-workspace .pw-col-ai .pw-kw-tags,
    .product-workspace .pw-col-ai .kw-tag,
    .product-workspace .pw-col-ai .diff-badge {
        transition: none !important;
        animation: none !important;
        transform: none !important;
    }

    .pw-reveal,
    .pw-reveal.pw-revealed {
        opacity: 1;
        transform: none;
        animation: none !important;
    }

    .pw-stat-sub,
    .pw-score-deltas,
    .pw-score-verdict {
        opacity: 1;
    }
}

.product-foot .score {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 0 !important;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 12px;
  color: #e8fff2;
  background:
    radial-gradient(circle at center, #0a1120 0 62%, transparent 63%),
    conic-gradient(#32e87a calc(var(--seo-pct, 0) * 1%), rgba(50, 232, 122, 0.14) 0);
}

.product-foot .score.score-muted,
.product-foot .score.score-muted small {
  color: var(--sellora-text-muted);
  opacity: 0.9;
}

.product-foot .score.score-muted {
  background:
    radial-gradient(circle at center, #0a1120 0 62%, transparent 63%),
    conic-gradient(rgba(148, 163, 184, 0.35) 0%, rgba(148, 163, 184, 0.12) 0);
}

.product-workspace .content-field-card label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--sellora-text-muted);
    margin-bottom: 8px;
}

.product-workspace .field {
    padding: 12px 14px;
    border-radius: 10px;
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(255,255,255,0.06);
    font-size: 13px;
    line-height: 1.55;
    transition: border-color 200ms ease, background 200ms ease, box-shadow 200ms ease;
}

.product-workspace .field.prose {
    max-height: 360px;
    overflow: auto;
}

@media (max-width: 1199px) and (min-width: 768px) {
    .pw-hero { grid-template-columns: 1fr; }
    .pw-hero-score { justify-self: start; text-align: left; }
    .pw-score-display { justify-content: flex-start; }
    .pw-stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pw-stat-cell:nth-child(2)::after,
    .pw-stat-cell:nth-child(4)::after { display: none; }
    .pw-stat-cell:nth-child(1)::after,
    .pw-stat-cell:nth-child(3)::after { bottom: 0; height: 1px; top: auto; left: 18px; right: 18px; width: auto; }
    .pw-columns { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .pw-col-changes { grid-column: 1 / -1; }
    .pw-insights { grid-template-columns: 1fr; }
    .pw-change-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .pw-hero { grid-template-columns: 1fr; padding: 20px; }
    .pw-hero-score { min-width: 0; max-width: 100%; }
    .pw-hero-meta { text-align: center; word-break: break-word; }
    .pw-stats-grid { grid-template-columns: 1fr 1fr; }
    .pw-stat-cell:nth-child(2)::after,
    .pw-stat-cell:nth-child(4)::after { display: none; }
    .pw-stat-cell:nth-child(1)::after,
    .pw-stat-cell:nth-child(3)::after {
        bottom: 0;
        top: auto;
        left: 18px;
        right: 18px;
        width: auto;
        height: 1px;
    }
    .pw-columns {
        grid-template-columns: 1fr;
    }
    .pw-col-ai { order: 1; }
    .pw-col-original { order: 2; }
    .pw-col-changes { order: 3; }
    .pw-insights { grid-template-columns: 1fr; }
    .pw-why-grid { grid-template-columns: 1fr; }
    .pw-toolbar { flex-direction: column; align-items: stretch; }
    .pw-toolbar .btn-publish { margin-left: 0; width: 100%; }
    .pw-score-main,
    .pw-score-from,
    .pw-score-to { font-size: 36px; }
    .pw-hero-score.has-range .pw-score-from { font-size: 28px; }
    .pw-hero-score.has-range .pw-score-to { font-size: 40px; }
    .pw-score-display.has-range {
        flex-direction: column;
        align-items: center;
        gap: 2px;
    }
    .pw-score-display.has-range .pw-score-arrow {
        transform: rotate(90deg);
        font-size: 24px;
        margin: 2px 0;
    }
}

/* Retry optimization confirm modal */
body.pw-modal-open { overflow: hidden; }

.pw-retry-modal[hidden],
.pw-retry-modal.hidden { display: none !important; }

.pw-retry-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    opacity: 0;
    transition: opacity 180ms ease;
}

.pw-retry-modal.is-open {
    opacity: 1;
}

.pw-retry-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(5, 8, 20, 0.72);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.pw-retry-dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 460px);
    padding: 32px 28px 28px;
    border-radius: 18px;
    background: linear-gradient(165deg, #121a2e 0%, #0d1220 100%);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow:
        0 24px 64px rgba(0, 0, 0, 0.55),
        0 0 0 1px rgba(168, 85, 247, 0.08),
        0 0 48px rgba(168, 85, 247, 0.1);
    text-align: center;
    opacity: 0;
    transform: scale(0.96);
    transition: transform 180ms ease, opacity 180ms ease;
}

.pw-retry-modal.is-open .pw-retry-dialog {
    opacity: 1;
    transform: scale(1);
}

.pw-retry-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(251, 146, 60, 0.18);
    border: 1px solid rgba(251, 146, 60, 0.35);
    box-shadow:
        0 0 24px rgba(251, 146, 60, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.pw-retry-icon__glyph {
    font-size: 28px;
    line-height: 1;
}

.pw-retry-dialog h2 {
    margin: 0 0 16px;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
    color: #f8fafc;
}

.pw-retry-text {
    margin: 0 0 18px;
    text-align: left;
}

.pw-retry-text p {
    margin: 0 0 10px;
    font-size: 15px;
    line-height: 1.55;
    color: #94a3b8;
}

.pw-retry-text p:last-child {
    margin-bottom: 0;
}

.pw-retry-question {
    margin-top: 14px !important;
    font-weight: 600;
    color: #e2e8f0 !important;
}

.pw-retry-notice {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 22px;
    padding: 12px 14px;
    border-radius: 12px;
    background: rgba(251, 191, 36, 0.1);
    border: 1px solid rgba(251, 191, 36, 0.22);
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    color: #fde68a;
}

.pw-retry-notice__dot {
    flex-shrink: 0;
    font-size: 12px;
    line-height: 1;
}

.pw-retry-actions {
    display: flex;
    align-items: stretch;
    gap: 14px;
}

.pw-retry-actions .btn-secondary,
.pw-retry-actions .btn-primary {
    flex: 1 1 0;
    min-width: 0;
    width: 100%;
}

.pw-retry-modal .btn-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 44px;
    min-height: 44px;
    padding: 0 20px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(255, 255, 255, 0.82);
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    transition:
        background 200ms ease,
        border-color 200ms ease,
        color 200ms ease,
        transform 200ms ease,
        box-shadow 200ms ease;
}

@media (hover: hover) {
    .pw-retry-modal .btn-secondary:hover {
        background: rgba(255, 255, 255, 0.06);
        border-color: rgba(255, 255, 255, 0.16);
        color: rgba(255, 255, 255, 0.92);
        transform: translateY(-1px);
        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, 0.06),
            0 6px 20px rgba(0, 0, 0, 0.22),
            0 0 0 1px rgba(255, 255, 255, 0.05);
    }
}

.pw-retry-modal .btn-secondary:active {
    transform: translateY(0);
    background: rgba(255, 255, 255, 0.04);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.18);
}

.pw-retry-modal .btn-secondary:focus {
    outline: none;
}

.pw-retry-modal .btn-secondary:focus-visible {
    outline: 2px solid #a78bfa;
    outline-offset: 3px;
}

.pw-retry-modal .btn-primary {
    height: 44px;
    min-height: 44px;
    padding: 0 20px;
    border-radius: 12px;
    font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
    .pw-retry-modal,
    .pw-retry-dialog {
        transition: none;
    }

    .pw-retry-modal .btn-secondary,
    .pw-retry-modal .btn-primary {
        transition: none;
    }

    .pw-retry-modal .btn-secondary:hover {
        transform: none;
    }
}

/* ============================================================
   Sellora V1.8.1 — Optimization product table
   ============================================================ */

.opt-products-panel {
    overflow: hidden;
}

.opt-table-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 0 20px 16px;
    border-bottom: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
}

.opt-count {
    font-size: 13px;
    color: var(--sellora-text-muted, #9ea7bb);
    font-weight: 500;
}

.opt-table-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    flex: 1;
    justify-content: flex-end;
}

.opt-search {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 220px;
    flex: 1;
    max-width: 360px;
    height: 42px;
    padding: 0 14px;
    border-radius: 10px;
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    background: rgba(255,255,255,0.03);
    color: var(--sellora-text-muted, #9ea7bb);
    transition: border-color 200ms ease;
}

.opt-search:focus-within {
    border-color: rgba(139,92,246,0.4);
}

.opt-search input {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--sellora-text, #f7f8ff);
    font-family: inherit;
    font-size: 14px;
}

.opt-filters {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.opt-filter {
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    border-radius: 99px;
    background: transparent;
    color: var(--sellora-text-muted, #9ea7bb);
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}

.opt-filter:hover {
    color: var(--sellora-text, #f7f8ff);
    border-color: rgba(139,92,246,0.3);
}

.opt-filter.active {
    background: linear-gradient(135deg, #7b2ee8, #5b19ca);
    border-color: transparent;
    color: #fff;
}

/* --- Desktop product table (reference layout) --- */
@media (min-width: 768px) {
.opt-table-wrap {
    width: 100%;
    padding: 0;
    box-sizing: border-box;
}

.opt-table-shell {
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    border-radius: 14px;
    background: var(--sellora-card, #0c1222);
    overflow: hidden;
}

.opt-table-list {
    display: block;
    width: 100%;
}

.opt-table-body {
    display: block;
    width: 100%;
}

/* 6-column grid: # | product | seo | status | date | action */
.product-row {
    display: grid;
    grid-template-columns:
        36px
        minmax(0, 1fr)
        168px
        max-content
        156px
        176px;
    column-gap: 16px;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    padding: 0 16px;
}

.product-row-header {
    min-height: 42px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--sellora-text-muted, #9ea7bb);
    background: rgba(255,255,255,0.02);
}

.opt-table-body .product-row {
    min-height: 72px;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    transition: background-color 180ms ease;
}

.opt-table-body .product-row:hover {
    background: rgba(255, 255, 255, 0.04);
}

.opt-table-body .product-row:last-child {
    border-bottom: none;
}

.product-number {
    font-size: 13px;
    color: var(--sellora-text-muted, #9ea7bb);
    text-align: center;
    min-width: 0;
}

.product-cell {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    overflow: hidden;
}

.product-image-box {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 8px;
    border: 1px solid rgba(139,92,246,0.22);
    background: #121a32;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px;
    overflow: hidden;
    box-sizing: border-box;
}

.product-info {
    min-width: 0;
    flex: 1;
    overflow: hidden;
}

.product-status {
    width: auto;
    max-width: none;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: visible;
}

.product-seo {
    width: 168px;
    max-width: 168px;
    min-width: 168px;
    overflow: visible;
}

.product-updated {
    width: 156px;
    max-width: 156px;
    min-width: 156px;
    overflow: hidden;
    font-size: 13px;
    color: var(--sellora-text-muted, #9ea7bb);
    white-space: nowrap;
    text-overflow: ellipsis;
}

.product-action {
    width: 176px;
    max-width: 176px;
    min-width: 176px;
    overflow: hidden;
}

.opt-table-body .opt-empty,
.opt-table-list > .opt-empty {
    padding: 32px 20px;
    text-align: center;
    color: var(--sellora-text-muted, #9ea7bb);
}

.opt-thumb-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    text-decoration: none;
}

.opt-product-link {
    display: block;
    text-decoration: none;
    color: inherit;
    min-width: 0;
    overflow: hidden;
}

.product-image-box .opt-thumb {
    width: 100%;
    height: 100%;
    max-width: 52px;
    max-height: 52px;
    border-radius: 6px;
    object-fit: contain;
    background: transparent;
    border: none;
    display: block;
}

.product-image-box .opt-thumb-ph {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 6px;
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 18px;
    color: #a855f7;
    background: transparent;
}

.opt-product-name {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 14px;
    font-weight: 600;
    color: var(--sellora-text, #f7f8ff);
    line-height: 1.35;
    word-break: break-word;
}

.opt-product-id {
    display: block;
    margin-top: 3px;
    font-size: 11px;
    font-weight: 500;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-action .btn-opt-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 176px;
    max-width: 176px;
    min-height: 40px;
    box-sizing: border-box;
}

.product-seo .opt-seo-score {
    width: 100%;
    max-width: 168px;
}

.product-seo .opt-seo-track {
    width: 100%;
    max-width: 168px;
}

.product-seo .opt-seo-num {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.03em;
}

.product-status .opt-status-badge {
    max-width: none;
    overflow: visible;
}
} /* end desktop table */

/* Shared thumb fallback (mobile) */
.opt-thumb {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    object-fit: cover;
    background: #121a32;
    border: 1px solid rgba(139,92,246,0.2);
    display: block;
}

.opt-thumb-ph {
    display: grid;
    place-items: center;
    font-weight: 700;
    font-size: 18px;
    color: #a855f7;
    background: #111a33;
}

/* --- Status badges --- */
.opt-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 0 14px;
    min-height: 32px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    white-space: nowrap;
    box-sizing: border-box;
    overflow: visible;
    vertical-align: middle;
    width: auto;
    max-width: none;
}

/* Override catalog .status chip styles when used on queue badges */
.opt-status-badge.status {
    font-size: 12px;
    font-weight: 600;
    padding: 0 14px;
    min-height: 32px;
    line-height: 1.35;
    letter-spacing: normal;
}

.opt-status-badge .badge-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}

.opt-status-badge .badge-text {
    line-height: 1.35;
}

.opt-status-badge .opt-spinner-sm {
    flex-shrink: 0;
}

.opt-mobile-status {
    display: flex;
    align-items: center;
    overflow: visible;
}

.badge-ready {
    background: rgba(34, 197, 94, 0.07);
    border: 1px solid rgba(34, 197, 94, 0.16);
    color: #6ee7a0;
}

.badge-published {
    background: rgba(59, 130, 246, 0.08);
    border: 1px solid rgba(59, 130, 246, 0.18);
    color: #93c5fd;
}

.badge-queued {
    background: rgba(245, 158, 11, 0.07);
    border: 1px solid rgba(245, 158, 11, 0.16);
    color: #f5c76a;
}

.badge-needs-opt {
    background: rgba(249, 115, 22, 0.07);
    border: 1px solid rgba(249, 115, 22, 0.16);
    color: #f0a060;
}

.badge-unprocessed,
.badge-new,
.badge-error {
    background: rgba(239, 68, 68, 0.07);
    border: 1px solid rgba(239, 68, 68, 0.16);
    color: #f09595;
}

.badge-processing {
    background: rgba(99, 102, 241, 0.07);
    border: 1px solid rgba(99, 102, 241, 0.16);
    color: #9aa3f0;
}

.badge-attention {
    background: rgba(245, 158, 11, 0.07);
    border: 1px solid rgba(245, 158, 11, 0.16);
    color: #f5c76a;
}

.opt-spinner-sm {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 2px solid rgba(129,140,248,0.3);
    border-top-color: #818cf8;
    border-radius: 50%;
    animation: sellora-spin 0.7s linear infinite;
}

/* --- SEO Score column --- */
.opt-seo-score {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
    width: 100%;
}

.opt-seo-head {
    line-height: 1;
}

.opt-seo-num {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.opt-seo-denom {
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0;
    opacity: 0.58;
}

.opt-seo-track {
    height: 6px;
    background: rgba(255, 255, 255, 0.07);
    border-radius: 999px;
    overflow: hidden;
}

.opt-seo-fill {
    height: 100%;
    min-width: 0;
    border-radius: 999px;
    transition: width 280ms ease;
}

.opt-seo-source {
    display: block;
    font-size: 10px;
    font-weight: 500;
    color: var(--sellora-text-muted, #8b93a7);
    line-height: 1.25;
    letter-spacing: 0.01em;
}

/* Reserved for future SEO forecast (e.g. 71 → 94, ▲ +23) */
.opt-seo-forecast {
    display: none;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--sellora-text-muted, #9ea7bb);
}

.opt-seo-forecast:not([hidden]) {
    display: block;
}

.seo-tier-red .opt-seo-num { color: #ef4444; }
.seo-tier-red .opt-seo-denom { color: #ef4444; }
.seo-tier-red .opt-seo-fill { background: #ef4444; }

.seo-tier-orange .opt-seo-num { color: #f97316; }
.seo-tier-orange .opt-seo-denom { color: #f97316; }
.seo-tier-orange .opt-seo-fill { background: #f97316; }

.seo-tier-yellow .opt-seo-num { color: #eab308; }
.seo-tier-yellow .opt-seo-denom { color: #eab308; }
.seo-tier-yellow .opt-seo-fill { background: #eab308; }

.seo-tier-lgreen .opt-seo-num { color: #86efac; }
.seo-tier-lgreen .opt-seo-denom { color: #86efac; }
.seo-tier-lgreen .opt-seo-fill { background: #86efac; }

.seo-tier-green .opt-seo-num { color: #22c55e; }
.seo-tier-green .opt-seo-denom { color: #22c55e; }
.seo-tier-green .opt-seo-fill { background: #22c55e; }

.seo-empty .opt-seo-num { color: #64748b; }
.seo-empty .opt-seo-denom { color: #64748b; }
.seo-empty .opt-seo-fill { background: transparent; }
.seo-empty .opt-seo-source { color: #64748b; }

/* --- Optimize button --- */
.btn-opt-row {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 40px;
    padding: 0 16px;
    border: none;
    border-radius: 10px;
    background: linear-gradient(135deg, #7b2ee8, #5b19ca);
    color: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 2px 12px rgba(123,46,232,0.3);
    transition: transform 200ms ease, box-shadow 200ms ease, filter 200ms ease;
    cursor: pointer;
}

.btn-opt-row:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(123,46,232,0.45);
    filter: brightness(1.08);
}

.btn-opt-row:active {
    transform: translateY(0) scale(0.98);
}

.btn-opt-row:focus-visible {
    outline: 2px solid #a78bfa;
    outline-offset: 2px;
}

.btn-opt-row.is-disabled,
.btn-opt-row[aria-disabled="true"] {
    opacity: 0.72;
    cursor: not-allowed;
    pointer-events: none;
    background: #475569;
    box-shadow: none;
    filter: none;
    transform: none;
}

.btn-opt-unnecessary {
    background: rgba(34, 197, 94, 0.1) !important;
    border: 1px solid rgba(34, 197, 94, 0.18);
    color: #7dd3a0 !important;
    font-size: 12px;
    line-height: 1.25;
    white-space: normal;
    text-align: center;
    padding: 0 12px;
    gap: 5px;
}

.btn-opt-icon {
    flex-shrink: 0;
    font-size: 13px;
    line-height: 1;
}

.btn-opt-row.is-disabled:hover,
.btn-opt-row[aria-disabled="true"]:hover {
    transform: none;
    box-shadow: none;
    filter: none;
}

/* --- Empty / error --- */
.opt-empty {
    padding: 32px 20px;
    text-align: center;
    color: var(--sellora-text-muted, #9ea7bb);
    font-size: 14px;
}

.opt-error {
    color: #f87171;
}

/* --- Pagination --- */
.opt-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    padding: 16px 4px 0;
    border-top: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    margin-top: 4px;
}

.opt-range {
    font-size: 13px;
    color: var(--sellora-text-muted, #9ea7bb);
    white-space: nowrap;
    justify-self: start;
}

.opt-pages {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    justify-self: center;
}

.opt-per-page {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--sellora-text-muted, #9ea7bb);
    justify-self: end;
}

.opt-page-btn.opt-page-nav {
    min-width: auto;
    padding: 0 12px;
}

.opt-per-page select {
    height: 36px;
    padding: 0 10px;
    border-radius: 8px;
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    background: rgba(255,255,255,0.03);
    color: var(--sellora-text, #f7f8ff);
    font-family: inherit;
    font-size: 13px;
}

.opt-pages {
    display: flex;
    align-items: center;
    gap: 4px;
}

.opt-page-btn {
    min-width: 36px;
    height: 36px;
    padding: 0 8px;
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    border-radius: 8px;
    background: transparent;
    color: var(--sellora-text-muted, #9ea7bb);
    font-family: inherit;
    font-size: 13px;
    cursor: pointer;
    transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}

.opt-page-btn:hover:not(:disabled) {
    border-color: rgba(139,92,246,0.35);
    color: var(--sellora-text, #f7f8ff);
}

.opt-page-btn.active {
    background: linear-gradient(135deg, #7b2ee8, #5b19ca);
    border-color: transparent;
    color: #fff;
}

.opt-page-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.opt-page-dots {
    padding: 0 4px;
    color: var(--sellora-text-muted, #9ea7bb);
    font-size: 13px;
}

/* mobile pagination stacks — desktop uses grid above */
@media (max-width: 767px) {
    .opt-pagination {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: 14px 16px;
        gap: 10px;
    }
    .opt-range,
    .opt-pages,
    .opt-per-page {
        justify-self: auto;
    }
    .opt-pages {
        justify-content: center;
    }
}

/* removed duplicate opt-range block */

/* --- Mobile cards (hidden on desktop) --- */
.opt-mobile-list {
    display: none;
    flex-direction: column;
    gap: 12px;
    padding: 12px 16px 16px;
}

.opt-mobile-card {
    padding: 16px;
    border-radius: 12px;
    border: 1px solid var(--sellora-border, rgba(255,255,255,0.08));
    background: var(--sellora-card, #0c1222);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.opt-mobile-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.opt-mobile-top .opt-product-link {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
}

.opt-mobile-top .opt-mobile-status {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

.opt-mobile-top .opt-thumb,
.opt-mobile-top .opt-thumb-ph {
    width: 48px;
    height: 48px;
}

.opt-mobile-seo-title,
.opt-mobile-date-label {
    display: block;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--sellora-text-muted, #9ea7bb);
    margin-bottom: 6px;
}

.opt-mobile-date span:last-child {
    font-size: 13px;
    color: var(--sellora-text-muted, #9ea7bb);
}

.btn-opt-row-full {
    width: 100%;
    min-height: 44px;
}

/* --- Tablet table --- */
@media (max-width: 1199px) and (min-width: 768px) {
    .product-row {
        grid-template-columns:
            32px
            minmax(0, 1fr)
            148px
            max-content
            130px
            160px;
        column-gap: 12px;
        padding: 0 12px;
    }

    .product-status { width: auto; max-width: none; min-width: 0; }
    .product-seo { width: 148px; max-width: 148px; min-width: 148px; }
    .product-seo .opt-seo-score,
    .product-seo .opt-seo-track { max-width: 148px; }
    .product-updated { width: 130px; max-width: 130px; min-width: 130px; font-size: 12px; }
    .product-action { width: 160px; max-width: 160px; min-width: 160px; }
    .product-action .btn-opt-row { width: 160px; max-width: 160px; padding: 0 10px; font-size: 12px; }
    .product-image-box { width: 52px; height: 52px; flex: 0 0 52px; }
    .opt-seo-label { display: none; }
}

/* --- Mobile --- */
@media (max-width: 767px) {
    .opt-table-wrap {
        display: none;
    }

    .opt-mobile-list {
        display: flex;
    }

    .opt-table-toolbar {
        flex-direction: column;
        align-items: stretch;
        padding: 0 16px 14px;
    }

    .opt-table-controls {
        flex-direction: column;
        align-items: stretch;
    }

    .opt-search {
        max-width: none;
    }

    .opt-filters {
        justify-content: flex-start;
    }

    .opt-pagination {
        flex-direction: column;
        align-items: stretch;
        padding: 14px 16px;
        gap: 10px;
    }

    .opt-pages {
        justify-content: center;
        flex-wrap: wrap;
    }

    .opt-range {
        text-align: center;
    }
}

/* Sellora Orders module */
.orders-toolbar{
 display:grid;
 grid-template-columns:minmax(280px,2fr) repeat(3,minmax(140px,1fr));
 gap:10px;
 margin:14px 0;
}
.orders-search{grid-column:span 1}
.orders-toolbar .orders-filter{
 box-sizing:border-box;
 width:100%;
 height:46px;
 min-height:46px;
 padding:0 36px 0 14px;
 border:1px solid #342653;
 border-radius:11px;
 background-color:#09101d;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23c084fc' d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E");
 background-repeat:no-repeat;
 background-position:right 14px center;
 color:#f3f4f6;
 font-size:14px;
 font-family:inherit;
 line-height:1.2;
 cursor:pointer;
 transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;
 appearance:none;
 -webkit-appearance:none;
 -moz-appearance:none;
}
.orders-toolbar .orders-filter:hover{
 border-color:#7c3aed;
 background-color:#0d1424;
 box-shadow:0 0 0 1px rgba(109,40,217,.22),0 0 18px rgba(124,58,237,.16);
}
.orders-toolbar .orders-filter:focus{
 outline:none;
}
.orders-toolbar .orders-filter:focus-visible{
 outline:2px solid rgba(196,181,253,.92);
 outline-offset:2px;
 border-color:#8b5cf6;
 box-shadow:0 0 0 3px rgba(124,58,237,.24);
}
.orders-toolbar .orders-filter:disabled{
 opacity:.65;
 cursor:not-allowed;
}
.orders-toolbar .orders-filter option{
 background:#0b1120;
 color:#f3f4f6;
}
.orders-table-wrap{
 border:1px solid #252d42;
 border-radius:14px;
 background:#09101c;
 overflow:hidden;
 margin-bottom:12px;
}
.orders-table-shell{overflow-x:auto}
.orders-table-head,.orders-row{
 display:grid;
 grid-template-columns:110px 1.2fr .8fr .9fr .9fr .9fr 130px 90px;
 gap:12px;
 align-items:center;
 padding:14px 18px;
}
.orders-table-head{
 border-bottom:1px solid #252d42;
 color:#9ea7ba;
 font-size:12px;
 font-weight:600;
 text-transform:uppercase;
 letter-spacing:.04em;
}
.orders-row{
 border-bottom:1px solid #1e2538;
 transition:.18s border-color,.18s background;
}
.orders-row:hover{
 background:#0d1424;
 border-color:#3a3150;
}
.orders-row:last-child{border-bottom:0}
.orders-cell-id strong{color:#fff}

@keyframes orders-btn-spin{
 to{transform:rotate(360deg)}
}

.orders-sync-btn{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 min-height:44px;
 height:44px;
 padding:0 18px;
 border-radius:11px;
 border:1px solid #9d4dff;
 background:linear-gradient(135deg,#8b3cf0 0%,#6d28d9 48%,#5b21b6 100%);
 box-shadow:
  inset 0 1px 0 rgba(255,255,255,.18),
  0 4px 18px rgba(109,40,217,.35),
  0 0 24px rgba(124,58,237,.18);
 color:#fff;
 font-size:14px;
 font-weight:700;
 letter-spacing:.01em;
 line-height:1;
 cursor:pointer;
 transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease;
 white-space:nowrap;
}
.orders-sync-btn:hover:not(:disabled){
 filter:brightness(1.08);
 transform:translateY(-1px);
 box-shadow:
  inset 0 1px 0 rgba(255,255,255,.22),
  0 6px 22px rgba(109,40,217,.45),
  0 0 32px rgba(124,58,237,.28);
}
.orders-sync-btn:active:not(:disabled){
 transform:translateY(1px);
 filter:brightness(.98);
 box-shadow:
  inset 0 2px 6px rgba(0,0,0,.22),
  0 2px 10px rgba(109,40,217,.28);
}
.orders-sync-btn:focus-visible{
 outline:2px solid rgba(196,181,253,.95);
 outline-offset:2px;
}
.orders-sync-btn:disabled{
 opacity:.88;
 cursor:not-allowed;
 transform:none;
 filter:none;
 box-shadow:
  inset 0 1px 0 rgba(255,255,255,.12),
  0 2px 10px rgba(109,40,217,.22);
}
.orders-sync-btn:disabled::before{
 content:'';
 width:14px;
 height:14px;
 flex-shrink:0;
 border:2px solid rgba(255,255,255,.28);
 border-top-color:#fff;
 border-radius:50%;
 animation:orders-btn-spin .65s linear infinite;
}

.orders-open-btn{
 box-sizing:border-box;
 display:inline-flex;
 align-items:center;
 justify-content:center;
 width:100%;
 min-width:84px;
 max-width:100%;
 height:36px;
 padding:0 10px;
 border-radius:8px;
 border:1px solid rgba(139,92,246,.55);
 background:linear-gradient(180deg,#12101f 0%,#0b0f1c 100%);
 box-shadow:0 0 0 rgba(139,92,246,0);
 color:#c084fc;
 font-size:12px;
 font-weight:700;
 letter-spacing:.02em;
 text-decoration:none;
 cursor:pointer;
 transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,color .18s ease;
}
.orders-open-btn::after{
 content:' →';
 font-size:12px;
 line-height:1;
}
.orders-open-btn:hover{
 text-decoration:none;
 color:#ddd6fe;
 background:linear-gradient(180deg,#1a1530 0%,#101528 100%);
 border-color:rgba(167,139,250,.75);
 box-shadow:0 0 16px rgba(139,92,246,.35);
 transform:translateY(-1px);
}
.orders-open-btn:active{
 transform:translateY(0);
 background:#0a0e18;
 box-shadow:0 0 8px rgba(139,92,246,.22);
}
.orders-open-btn:focus-visible{
 outline:2px solid rgba(196,181,253,.85);
 outline-offset:2px;
}
.orders-row > span:last-child{
 display:flex;
 align-items:center;
}
.orders-empty-row,.orders-empty{
 padding:24px 18px;
 color:#929bad;
}
.order-status-badge{
 display:inline-flex;
 align-items:center;
 padding:5px 10px;
 border-radius:999px;
 font-size:12px;
 font-weight:700;
 border:1px solid transparent;
}
.order-status-badge.status-new{background:rgba(59,130,246,.15);color:#93c5fd;border-color:rgba(59,130,246,.35)}
.order-status-badge.status-accepted{background:rgba(124,58,237,.15);color:#c4b5fd;border-color:rgba(124,58,237,.35)}
.order-status-badge.status-processing{background:rgba(245,158,11,.12);color:#fcd34d;border-color:rgba(245,158,11,.35)}
.order-status-badge.status-shipped{background:rgba(56,189,248,.12);color:#7dd3fc;border-color:rgba(56,189,248,.35)}
.order-status-badge.status-completed{background:rgba(16,185,129,.12);color:#6ee7b7;border-color:rgba(16,185,129,.35)}
.order-status-badge.status-cancelled{background:rgba(239,68,68,.12);color:#fca5a5;border-color:rgba(239,68,68,.35)}
.orders-notifications{
 display:grid;
 gap:8px;
 margin:0 0 14px;
}
.orders-notifications.hidden{display:none!important}
.orders-notification{
 display:flex;
 align-items:center;
 gap:12px;
 flex-wrap:wrap;
 padding:12px 16px;
 border:1px solid #3a3150;
 border-radius:12px;
 background:linear-gradient(90deg,#151026,#1a1230);
}
.orders-notification strong{color:#fff}
.orders-notification span{color:#aeb6ca}
.orders-notification a{
 margin-left:auto;
 color:#c361ff;
 text-decoration:none;
 font-weight:600;
}
.orders-back-link{
 display:inline-block;
 margin-bottom:8px;
 color:#c361ff;
 text-decoration:none;
 font-size:14px;
}
.order-actions-top{
 display:flex;
 gap:10px;
 flex-wrap:wrap;
}
.orders-detail-grid{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:14px;
 margin-bottom:18px;
}
.orders-detail-card h3{
 margin:0;
 padding:18px 20px;
 border-bottom:1px solid #252d42;
 font-size:17px;
}
.orders-detail-lines{
 padding:16px 20px 20px;
 display:grid;
 gap:12px;
}
.orders-detail-lines div{
 display:flex;
 justify-content:space-between;
 gap:16px;
 align-items:flex-start;
}
.orders-detail-lines span{color:#9ea7ba;font-size:13px}
.orders-detail-lines strong{
 color:#fff;
 text-align:right;
 max-width:62%;
 word-break:break-word;
}
.orders-items-card,.orders-history-card{grid-column:1/-1}
.orders-items-list{display:grid;gap:10px;padding:16px 20px 0}
.orders-item-row{
 display:grid;
 grid-template-columns:52px 1fr auto auto auto;
 gap:12px;
 align-items:center;
 padding:12px 0;
 border-bottom:1px solid #1e2538;
}
.orders-item-row:last-child{border-bottom:0}
.orders-item-thumb{
 width:52px;height:52px;border-radius:10px;
 background:#0b1120;border:1px solid #273049;
 display:grid;place-items:center;overflow:hidden;
}
.orders-item-thumb img{width:100%;height:100%;object-fit:cover}
.orders-item-body{display:grid;gap:4px}
.orders-item-body small{color:#9ea7ba}
.orders-item-qty,.orders-item-price,.orders-item-total{color:#dce1ef;font-weight:600}
.orders-grand-total{
 display:flex;justify-content:space-between;align-items:center;
 padding:16px 20px 20px;border-top:1px solid #252d42;margin-top:8px;
}
.orders-grand-total strong{font-size:22px;color:#fff}
.orders-history{padding:16px 20px 20px;display:grid;gap:12px}
.orders-history-row{
 display:grid;grid-template-columns:160px 1fr;gap:12px;
 padding-bottom:12px;border-bottom:1px solid #1e2538;
}
.orders-history-row:last-child{border-bottom:0;padding-bottom:0}
.orders-history-row time{color:#9ea7ba;font-size:13px}
.orders-history-row p{margin:0;color:#e5e7eb}
.orders-history-row small{color:#9ea7ba}
.orders-pagination{margin-top:8px}

/* Order detail page */
.order-detail-header{
 display:flex;
 justify-content:space-between;
 align-items:flex-start;
 gap:20px;
 flex-wrap:wrap;
 margin-bottom:22px;
}
.order-detail-header-main{display:grid;gap:8px;min-width:0}
.order-detail-header h1{
 margin:0;
 font-size:28px;
 line-height:1.2;
 color:#fff;
}
.order-detail-meta{
 display:flex;
 align-items:center;
 flex-wrap:wrap;
 gap:8px;
 font-size:14px;
}
.order-detail-meta-sep{color:#5c6680}
.order-detail-meta-date{color:#9caac5}
.order-chip{
 display:inline-flex;
 align-items:center;
 padding:4px 10px;
 border-radius:999px;
 font-size:12px;
 font-weight:600;
 border:1px solid #3a3150;
 background:#12182a;
 color:#dce1ef;
}
.order-chip-market{color:#c9d2e8}
.order-status-badge{
 display:inline-flex;
 align-items:center;
 padding:4px 10px;
 border-radius:999px;
 font-size:12px;
 font-weight:600;
 border:1px solid transparent;
}
.order-status-badge.status-new{color:#c9d2e8;background:#1a2238;border-color:#2f3a55}
.order-status-badge.status-accepted{color:#d9b8ff;background:rgba(124,58,237,.15);border-color:rgba(195,97,255,.35)}
.order-status-badge.status-processing{color:#fbbf24;background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.28)}
.order-status-badge.status-shipped{color:#93c5fd;background:rgba(59,130,246,.14);border-color:rgba(59,130,246,.32)}
.order-status-badge.status-completed{color:#86efac;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28)}
.order-status-badge.status-cancelled{color:#fca5a5;background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.28)}
.order-status-badge.payment-pending{color:#fbbf24;background:rgba(251,191,36,.12);border-color:rgba(251,191,36,.28)}
.order-status-badge.payment-paid{color:#86efac;background:rgba(34,197,94,.12);border-color:rgba(34,197,94,.28)}
.order-status-badge.payment-cancelled{color:#fca5a5;background:rgba(239,68,68,.12);border-color:rgba(239,68,68,.28)}
.order-detail-actions{
 display:flex;
 align-items:center;
 gap:10px;
 flex-wrap:wrap;
}
.order-action-primary{
 min-height:42px;
 padding:0 18px;
 border-radius:10px;
 border:1px solid rgba(195,97,255,.45);
 background:linear-gradient(180deg,#7c3aed,#6d28d9);
 color:#fff;
 font-weight:600;
 cursor:pointer;
 transition:transform .15s ease,opacity .15s ease,box-shadow .15s ease;
}
.order-action-primary:hover:not(:disabled){
 transform:translateY(-1px);
 box-shadow:0 8px 24px rgba(124,58,237,.28);
}
.order-action-primary:active:not(:disabled){transform:translateY(0)}
.order-action-primary:disabled{opacity:.55;cursor:not-allowed}
.order-actions-menu-wrap{position:relative;flex-shrink:0;overflow:visible}
.order-actions-menu-panel{
 position:absolute;
 right:0;
 top:calc(100% + 8px);
 width:250px;
 padding:6px;
 border-radius:12px;
 border:1px solid #2a3348;
 background:#0a101c;
 box-shadow:0 12px 32px rgba(0,0,0,.45);
 z-index:40;
 opacity:0;
 transform:translateY(4px);
 pointer-events:none;
 transition:opacity 140ms ease,transform 140ms ease;
 overflow:visible;
}
.order-actions-trigger{
 box-sizing:border-box;
 display:inline-flex!important;
 flex-direction:row;
 align-items:center;
 justify-content:center;
 gap:8px;
 height:40px;
 min-height:40px;
 max-height:40px;
 margin:0;
 padding:0 14px;
 border-radius:10px;
 border:1px solid #2a3348;
 background:#0a101c;
 color:#e8ebf5;
 font:inherit;
 font-size:13px;
 font-weight:600;
 line-height:1;
 cursor:pointer;
 white-space:nowrap;
 transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
}
.order-actions-trigger:hover,
.order-actions-menu-wrap.is-open .order-actions-trigger{
 border-color:#7b3cf0;
 background:#0d1424;
 box-shadow:0 0 0 1px rgba(123,60,240,.16);
}
.order-actions-trigger-icon{
 flex-shrink:0;
 font-size:16px;
 line-height:1;
 letter-spacing:-2px;
}
.order-actions-trigger-label{flex-shrink:0}
.order-actions-trigger-chevron{
 flex-shrink:0;
 font-size:11px;
 color:#9ea7bb;
 line-height:1;
}
.order-actions-menu-wrap.is-open .order-actions-menu-panel{
 opacity:1;
 transform:translateY(0);
 pointer-events:auto;
}
.order-menu-item-btn{
 box-sizing:border-box;
 width:100%;
 height:38px;
 min-height:38px;
 margin:0;
 padding:0 12px;
 border:0;
 border-radius:8px;
 background:transparent;
 color:#e8ebf5;
 font:inherit;
 font-size:13px;
 font-weight:500;
 line-height:1;
 cursor:pointer;
 display:flex;
 align-items:center;
 gap:10px;
 text-align:left;
 transition:background .15s ease,color .15s ease;
}
.order-menu-item-btn:hover:not(:disabled){
 background:rgba(123,60,240,.12);
 color:#dcc4ff;
}
.order-menu-item-btn:disabled{
 opacity:.45;
 cursor:not-allowed;
}
.order-menu-item-icon{
 flex:0 0 18px;
 width:18px;
 text-align:center;
 font-size:14px;
 line-height:1;
}
.order-menu-item-label{flex:1;min-width:0}
.order-menu-item-chevron{
 flex-shrink:0;
 color:#7f899f;
 font-size:14px;
 line-height:1;
}
.order-menu-separator{
 height:1px;
 margin:6px 4px;
 background:#232a3d;
}
.order-menu-item{position:relative}
.order-menu-item-has-sub .order-menu-sub-trigger{cursor:pointer}
.status-menu-item{position:relative}
.order-menu-submenu{
 position:absolute;
 right:100%;
 margin-right:-4px;
 top:0;
 width:210px;
 padding:6px;
 border-radius:10px;
 border:1px solid #2a3348;
 background:#0a101c;
 box-shadow:0 10px 28px rgba(0,0,0,.42);
 opacity:0;
 transform:translateY(4px);
 pointer-events:none;
 transition:opacity 140ms ease,transform 140ms ease;
 z-index:50;
}
.order-menu-item-has-sub.is-sub-open .order-menu-submenu,
.status-menu-item.is-sub-open .order-menu-submenu{
 opacity:1;
 transform:translateY(0);
 pointer-events:auto;
}
.order-menu-item-has-sub:hover .order-menu-submenu,
.status-menu-item:hover .order-menu-submenu{
 opacity:1;
 transform:translateY(0);
 pointer-events:auto;
}
.order-menu-subitem-btn .order-menu-item-icon{font-size:10px;color:#7f899f}
.order-menu-item-danger{color:#fca5a5!important}
.order-menu-item-danger .order-menu-item-icon{color:#f87171}
.order-menu-item-danger:hover:not(:disabled){
 background:rgba(239,68,68,.12)!important;
 color:#fecaca!important;
}
.order-actions-toast{
 position:fixed;
 bottom:24px;
 left:50%;
 transform:translateX(-50%) translateY(12px);
 padding:10px 16px;
 border-radius:10px;
 border:1px solid #2a3348;
 background:#0d1424;
 color:#e8ebf5;
 font-size:13px;
 box-shadow:0 8px 24px rgba(0,0,0,.4);
 opacity:0;
 pointer-events:none;
 transition:opacity .15s ease,transform .15s ease;
 z-index:300;
}
.order-actions-toast.is-visible{
 opacity:1;
 transform:translateX(-50%) translateY(0);
}
.order-highlight-flash{
 animation:orderHighlightFlash 1.2s ease;
}
@keyframes orderHighlightFlash{
 0%,100%{box-shadow:none}
 30%{box-shadow:0 0 0 2px rgba(123,60,240,.45)}
}
body.order-cancel-modal-open{overflow:hidden}
.order-cancel-modal[hidden]{display:none}
.order-cancel-modal{
 position:fixed;
 inset:0;
 z-index:250;
 display:grid;
 place-items:center;
 padding:20px;
}
.order-cancel-modal-backdrop{
 position:absolute;
 inset:0;
 background:rgba(3,6,14,.72);
 backdrop-filter:blur(4px);
}
.order-cancel-modal-dialog{
 position:relative;
 width:min(420px,100%);
 padding:24px 24px 20px;
 border:1px solid #2a3348;
 border-radius:14px;
 background:linear-gradient(165deg,#0a101c 0%,#0d1424 100%);
 box-shadow:0 20px 56px rgba(0,0,0,.5);
}
.order-cancel-modal-dialog h2{
 margin:0 0 10px;
 font-size:20px;
 color:#fff;
}
.order-cancel-modal-text{
 margin:0 0 20px;
 color:#9ea7bb;
 font-size:14px;
 line-height:1.5;
}
.order-cancel-modal-actions{
 display:flex;
 justify-content:flex-end;
 gap:10px;
}
.order-cancel-confirm-btn{
 border-color:rgba(239,68,68,.45)!important;
 background:linear-gradient(180deg,#dc2626,#b91c1c)!important;
}
.order-detail-top-grid{
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:16px;
}
.order-detail-col{display:grid;gap:16px;align-content:start}
.order-detail-card{
 border-radius:15px!important;
 border:1px solid #273049!important;
 background:#09101c!important;
 overflow:hidden;
}
.order-detail-card h3{
 font-size:16px;
 font-weight:700;
 letter-spacing:.02em;
 color:#fff;
}
.order-kv-list{
 padding:16px 20px 20px;
 display:grid;
 gap:14px;
}
.order-kv-row{
 display:grid;
 grid-template-columns:120px 1fr;
 gap:12px;
 align-items:start;
}
.order-kv-label{
 color:#9caac5;
 font-size:13px;
 line-height:1.4;
}
.order-kv-value{
 color:#fff;
 font-size:14px;
 line-height:1.45;
 word-break:break-word;
}
.order-text-upper{letter-spacing:.06em;font-size:12px;color:#c9d2e8}
.order-muted{color:#9caac5;font-size:14px}
.order-buyer-block{
 padding:16px 20px 20px;
 display:grid;
 gap:10px;
}
.order-buyer-name{
 font-size:18px;
 font-weight:700;
 color:#fff;
}
.order-buyer-phone{
 display:inline-flex;
 align-items:center;
 gap:8px;
 font-size:16px;
 font-weight:600;
 color:#c361ff;
 text-decoration:none;
}
.order-buyer-phone:hover{color:#d9b8ff}
.order-buyer-email a{color:#dce1ef;text-decoration:none}
.order-buyer-email a:hover{color:#fff}
.order-shipping-block,.order-shipping-section{padding:0}
.order-shipping-block{
 padding:16px 20px 20px;
 display:grid;
 gap:14px;
}
.order-shipping-method{
 font-size:16px;
 font-weight:700;
 color:#fff;
}
.order-shipping-text{
 color:#dce1ef;
 font-size:14px;
 line-height:1.5;
}
.order-tracking-row{
 display:flex;
 align-items:center;
 gap:10px;
 flex-wrap:wrap;
 margin-top:4px;
}
.order-tracking-code{
 padding:6px 10px;
 border-radius:8px;
 background:#0b1120;
 border:1px solid #273049;
 color:#fff;
 font-size:13px;
}
.order-copy-btn{
 min-height:32px;
 padding:0 12px;
 border-radius:8px;
 border:1px solid #313a54;
 background:#0b1220;
 color:#dce1ef;
 cursor:pointer;
 font-size:13px;
}
.order-copy-btn:hover{background:#151c2e;color:#fff}
.order-pay-total{font-size:18px;color:#fff}
.orders-items-list{padding:16px 20px 0}
.order-item-row{
 grid-template-columns:56px minmax(0,1fr) auto;
 align-items:start;
}
.order-item-thumb{width:56px;height:56px;border-radius:12px}
.order-item-title{
 display:block;
 font-size:15px;
 line-height:1.35;
 color:#fff;
 margin-bottom:4px;
}
.order-item-meta{color:#9caac5!important;font-size:12px}
.order-item-metrics{
 display:grid;
 grid-template-columns:repeat(3,minmax(72px,auto));
 gap:14px;
 text-align:right;
}
.order-item-metric{display:grid;gap:4px}
.order-item-metric .order-kv-label{font-size:11px}
.order-item-metric strong{color:#fff;font-size:14px}
.order-summary-block{
 padding:0 20px 20px;
}
.order-summary-inner{
 margin-top:12px;
 padding:16px 18px;
 border-radius:12px;
 border:1px solid #273049;
 background:linear-gradient(180deg,#0b1120,#0a0f1a);
 display:grid;
 gap:10px;
}
.order-summary-title{
 font-size:14px;
 font-weight:700;
 color:#fff;
 margin-bottom:4px;
}
.order-summary-row{
 display:flex;
 justify-content:space-between;
 gap:16px;
 color:#9caac5;
 font-size:14px;
}
.order-summary-row strong{color:#fff;font-weight:600}
.order-summary-grand{
 margin-top:6px;
 padding-top:12px;
 border-top:1px solid #273049;
 color:#fff;
}
.order-summary-grand strong{font-size:22px;color:#fff}
.order-history-timeline{
 padding:18px 20px 22px;
 display:grid;
 gap:0;
}
.order-history-item{
 display:grid;
 grid-template-columns:14px 1fr;
 gap:14px;
 position:relative;
 padding-bottom:18px;
}
.order-history-item:last-child{padding-bottom:0}
.order-history-item:not(:last-child)::before{
 content:"";
 position:absolute;
 left:6px;
 top:14px;
 bottom:0;
 width:2px;
 background:linear-gradient(180deg,#4c1d95,#273049);
}
.order-history-dot{
 width:12px;height:12px;
 margin-top:4px;
 border-radius:50%;
 background:#7c3aed;
 box-shadow:0 0 0 4px rgba(124,58,237,.18);
}
.order-history-body time{
 display:block;
 color:#9caac5;
 font-size:13px;
 margin-bottom:4px;
}
.order-history-body p{
 margin:0;
 color:#fff;
 font-size:14px;
 line-height:1.45;
}
.order-history-body small{
 display:block;
 margin-top:4px;
 color:#9caac5;
 font-size:12px;
}
@media(max-width:1100px){
 .orders-toolbar{grid-template-columns:1fr 1fr}
 .orders-search{grid-column:1/-1}
 .orders-sync-btn{
  min-height:44px;
  height:44px;
  width:100%;
  max-width:100%;
 }
 .orders-open-btn{
  min-height:38px;
  height:38px;
 }
 .orders-toolbar .orders-filter{
  min-height:44px;
  height:46px;
  width:100%;
 }
 .orders-table-head,.orders-row{
  grid-template-columns:1fr 1fr;
  gap:8px;
 }
 .orders-table-head span:nth-child(n+3),
 .orders-row span:nth-child(n+3){display:none}
 .orders-detail-grid{grid-template-columns:1fr}
 .order-detail-header{align-items:stretch}
 .order-detail-actions{width:100%}
 .order-detail-actions .order-action-primary,
 .order-detail-actions .order-actions-menu-wrap,
 .order-detail-actions .order-actions-trigger{width:100%}
 .order-item-row{grid-template-columns:56px minmax(0,1fr);gap:12px}
 .order-item-metrics{
  grid-column:1/-1;
  grid-template-columns:repeat(3,minmax(0,1fr));
  text-align:left;
 }
 .order-kv-row{grid-template-columns:1fr;gap:4px}
}

/* Plans page */
.plans-page-header{margin-bottom:24px}
.plans-page-header h1{margin:0 0 8px;font-size:31px;color:#fff}
.plans-page-header p{margin:0;color:#9caac5;font-size:15px}
.plans-grid{
 display:grid;
 grid-template-columns:repeat(3,minmax(0,1fr));
 gap:18px;
 margin-bottom:20px;
 align-items:stretch;
}
.plans-card{
 position:relative;
 display:flex;
 flex-direction:column;
 min-height:100%;
 padding:22px 22px 20px;
 border-radius:16px!important;
 border:1px solid #273049!important;
 background:#09101c!important;
 transition:border-color .2s ease,box-shadow .2s ease;
}
.plans-card-popular{
 border-color:rgba(195,97,255,.55)!important;
 box-shadow:0 0 0 1px rgba(124,58,237,.18),0 16px 40px rgba(88,28,135,.22);
 background:linear-gradient(180deg,#0d1020 0%,#10132a 100%)!important;
}
.plans-card-current{
 border-color:rgba(124,58,237,.35)!important;
}
.plans-badge{
 position:absolute;
 top:16px;
 right:16px;
 padding:5px 10px;
 border-radius:999px;
 font-size:10px;
 font-weight:700;
 letter-spacing:.06em;
}
.plans-badge-popular{
 color:#e9d5ff;
 background:rgba(124,58,237,.22);
 border:1px solid rgba(195,97,255,.35);
}
.plans-badge-current{
 color:#c4b5fd;
 background:rgba(99,102,241,.16);
 border:1px solid rgba(129,140,248,.28);
}
.plans-card-body{flex:1;display:grid;gap:16px;padding-top:8px}
.plans-card-name{
 margin:0;
 font-size:15px;
 font-weight:700;
 letter-spacing:.08em;
 color:#9caac5;
}
.plans-card-price{
 display:flex;
 align-items:baseline;
 gap:6px;
 flex-wrap:wrap;
}
.plans-price-value{
 font-size:34px;
 font-weight:700;
 line-height:1;
 color:#fff;
}
.plans-price-period{
 font-size:14px;
 color:#9caac5;
}
.plans-features{
 list-style:none;
 margin:0;
 padding:0;
 display:grid;
 gap:10px;
}
.plans-features li{
 display:flex;
 align-items:flex-start;
 gap:10px;
 color:#dce1ef;
 font-size:14px;
 line-height:1.45;
}
.plans-check{
 color:#a855f7;
 font-weight:700;
 flex-shrink:0;
 margin-top:1px;
}
.plans-card-action{margin-top:20px}
.plans-select-btn{
 width:100%;
 min-height:44px;
 padding:0 16px;
 border-radius:10px;
 border:1px solid #313a54;
 background:#0b1220;
 color:#fff;
 font-weight:600;
 font-size:14px;
 cursor:pointer;
 transition:background .15s ease,border-color .15s ease,transform .15s ease;
}
.plans-select-btn:hover:not(:disabled){
 background:#151c2e;
 border-color:#4c1d95;
}
.plans-card-popular .plans-select-btn{
 border-color:rgba(195,97,255,.45);
 background:linear-gradient(180deg,#7c3aed,#6d28d9);
}
.plans-card-popular .plans-select-btn:hover:not(:disabled){
 box-shadow:0 8px 24px rgba(124,58,237,.28);
 transform:translateY(-1px);
}
.plans-select-btn:disabled{
 opacity:.65;
 cursor:not-allowed;
}
.plans-footnote{
 margin:0 0 22px;
 color:#9caac5;
 font-size:13px;
 line-height:1.6;
}
.plans-usage-card{
 padding:22px 24px 24px;
 border-radius:16px!important;
 margin-bottom:18px;
}
.plans-usage-card h3{
 margin:0 0 8px;
 font-size:18px;
 color:#fff;
}
.plans-usage-plan-label{
 margin:0 0 18px;
 color:#9caac5;
 font-size:14px;
}
.plans-usage-plan-label strong{color:#fff}
.plans-usage-list{display:grid;gap:18px}
.plans-usage-head{
 display:flex;
 justify-content:space-between;
 gap:12px;
 margin-bottom:8px;
 color:#dce1ef;
 font-size:14px;
}
.plans-usage-head strong{color:#fff;font-weight:600}
.plans-usage-bar{
 height:8px;
 border-radius:999px;
 background:#151c2e;
 overflow:hidden;
 border:1px solid #273049;
}
.plans-usage-bar span{
 display:block;
 height:100%;
 border-radius:999px;
 background:linear-gradient(90deg,#6d28d9,#a855f7);
}
.plans-usage-row small{
 display:block;
 margin-top:6px;
 color:#9caac5;
 font-size:12px;
}
@media(max-width:1100px){
 .plans-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
 .plans-grid{grid-template-columns:1fr}
 .plans-price-value{font-size:30px}
 .plans-select-btn{min-height:48px}
}

/* UI theme tokens + accent */
html {
  color-scheme: dark;
  --accent: #7c3aed;
  --accent-hover: #6d28d9;
  --accent-soft: rgba(124, 58, 237, 0.18);
  --accent-border: rgba(195, 97, 255, 0.35);
  --accent-glow: rgba(124, 58, 237, 0.28);
  --bg-primary: #050914;
  --bg-secondary: #0a1020;
  --bg-card: #09101c;
  --bg-input: #0a1120;
  --text-primary: #f7f8ff;
  --text-secondary: #dce1ef;
  --text-muted: #aeb6ca;
  --border-color: #252d42;
  --sidebar-bg: linear-gradient(180deg, #07101c, #050914);
  --sidebar-text: #dce1ef;
  --input-bg: #0a1120;
  --input-text: #ffffff;
}
html[data-theme-resolved="light"] {
  color-scheme: light;
  --bg-primary: #eef1f8;
  --bg-secondary: #e4e9f2;
  --bg-card: #ffffff;
  --bg-input: #ffffff;
  --text-primary: #0f172a;
  --text-secondary: #334155;
  --text-muted: #64748b;
  --border-color: #cbd5e1;
  --sidebar-bg: linear-gradient(180deg, #ffffff, #eef1f8);
  --sidebar-text: #1e293b;
  --input-bg: #ffffff;
  --input-text: #0f172a;
}
html[data-accent="blue"] {
  --accent: #3b82f6;
  --accent-hover: #2563eb;
  --accent-soft: rgba(59, 130, 246, 0.18);
  --accent-border: rgba(96, 165, 250, 0.35);
  --accent-glow: rgba(59, 130, 246, 0.28);
}
html[data-accent="green"] {
  --accent: #22c55e;
  --accent-hover: #16a34a;
  --accent-soft: rgba(34, 197, 94, 0.18);
  --accent-border: rgba(74, 222, 128, 0.35);
  --accent-glow: rgba(34, 197, 94, 0.28);
}
html[data-accent="orange"] {
  --accent: #f97316;
  --accent-hover: #ea580c;
  --accent-soft: rgba(249, 115, 22, 0.18);
  --accent-border: rgba(251, 146, 60, 0.35);
  --accent-glow: rgba(249, 115, 22, 0.28);
}
html[data-accent="rose"] {
  --accent: #f43f5e;
  --accent-hover: #e11d48;
  --accent-soft: rgba(244, 63, 94, 0.18);
  --accent-border: rgba(251, 113, 133, 0.35);
  --accent-glow: rgba(244, 63, 94, 0.28);
}
html[data-accent] .primary,
html[data-accent] button.primary,
html[data-accent] .orders-sync-btn,
html[data-accent] .order-action-primary,
html[data-accent] .plans-card-popular .plans-select-btn,
html[data-accent] .view-btn.active {
  background: linear-gradient(180deg, var(--accent), var(--accent-hover)) !important;
  border-color: var(--accent-border) !important;
}
html[data-accent] .panel-title small,
html[data-accent] .feature-card small,
html[data-accent] .orders-back-link,
html[data-accent] .product-back:hover,
html[data-accent] .orders-notification a,
html[data-accent] .sidebar-plan strong {
  color: var(--accent) !important;
}
html[data-accent] .order-status-badge.status-accepted,
html[data-accent] .plans-badge-popular,
html[data-accent] .nav-badge {
  background: var(--accent-soft) !important;
  border-color: var(--accent-border) !important;
}
html[data-accent] .plans-usage-bar span,
html[data-accent] .order-history-dot {
  background: linear-gradient(90deg, var(--accent-hover), var(--accent)) !important;
}
html[data-accent] .orders-open-btn:hover,
html[data-accent] .order-copy-btn:hover,
html[data-accent] a.order-buyer-phone {
  color: var(--accent) !important;
}
html[data-accent] .primary:hover,
html[data-accent] button.primary:hover {
  box-shadow: 0 8px 24px var(--accent-glow) !important;
}
html[data-theme-resolved="dark"][data-accent] .side-nav a.active,
html[data-theme-resolved="dark"][data-accent] .side-nav a:hover,
html[data-theme="dark"][data-accent] .side-nav a.active,
html[data-theme="dark"][data-accent] .side-nav a:hover {
  background: linear-gradient(90deg, var(--accent-soft), rgba(255,255,255,0.02)) !important;
  color: #fff !important;
}
html[data-theme-resolved="light"][data-accent] .side-nav a.active,
html[data-theme-resolved="light"][data-accent] .side-nav a:hover {
  background: var(--accent-soft) !important;
  color: var(--accent) !important;
  box-shadow: inset 0 0 0 1px var(--accent-border);
}

/* Settings — notifications, sync, security */
/* Inset matches .form-grid / .billing-row / .setting-lines (20px) */
.settings-section > .settings-switch-row,
.settings-section > .settings-switch-group,
.settings-section > .settings-subsection,
.settings-section > .settings-actions {
  padding-left: 20px;
  padding-right: 20px;
}
.settings-section > .settings-switch-row-master {
  padding-top: 20px;
}
.settings-section > .settings-subsection:last-child,
.settings-section > .settings-actions {
  padding-bottom: 20px;
}
.settings-section > .settings-security {
  padding: 20px;
}
.settings-section > .settings-danger-zone {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
}
.settings-switch-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid #1e2638;
}
.settings-switch-row:last-child {
  border-bottom: none;
}
.settings-switch-row-master {
  padding-top: 4px;
  margin-bottom: 4px;
  border-bottom: 1px solid #273049;
}
.settings-switch-copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.settings-switch-copy strong {
  font-size: 14px;
  font-weight: 600;
}
.settings-switch-copy small {
  color: #9caac5;
  font-size: 12px;
  line-height: 1.45;
}
.settings-switch {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  cursor: pointer;
}
.settings-switch input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.settings-switch-ui {
  width: 46px;
  height: 26px;
  border-radius: 999px;
  background: #1a2235;
  border: 1px solid #313a54;
  position: relative;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.settings-switch-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #dce1ef;
  transition: transform 0.2s ease, background 0.2s ease;
}
.settings-switch input:checked + .settings-switch-ui {
  background: linear-gradient(180deg, var(--accent, #7c3aed), var(--accent-hover, #6d28d9));
  border-color: var(--accent-border, rgba(195, 97, 255, 0.35));
}
.settings-switch input:checked + .settings-switch-ui::after {
  transform: translateX(20px);
  background: #fff;
}
.settings-switch input:focus-visible + .settings-switch-ui {
  box-shadow: 0 0 0 3px var(--accent-soft, rgba(124, 58, 237, 0.18));
}
.settings-switch-group.is-disabled,
.settings-subsection.is-disabled {
  opacity: 0.45;
  pointer-events: none;
  user-select: none;
}
.settings-subsection {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #1e2638;
}
.settings-subsection h3 {
  margin: 0 0 12px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #bd61ff;
}
.settings-thresholds {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.settings-threshold {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid #313a54;
  background: #0b1220;
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
}
.settings-threshold input {
  accent-color: var(--accent, #7c3aed);
}
.settings-threshold:has(input:checked) {
  border-color: var(--accent-border, rgba(195, 97, 255, 0.35));
  background: var(--accent-soft, rgba(124, 58, 237, 0.12));
  color: #fff;
}
.settings-hint {
  display: block;
  margin-top: 10px;
  color: #9caac5;
  font-size: 12px;
}
.settings-inline-select select {
  min-width: 180px;
  margin-top: 4px;
}
.settings-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid #1e2638;
}
.settings-security {
  display: grid;
  gap: 10px;
}
.settings-security .secondary {
  justify-self: start;
}
.settings-soon[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}
.settings-switch-row-disabled {
  opacity: 0.55;
}

/* Light theme — effective via data-theme-resolved only */
html[data-theme-resolved="light"] body {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .app-shell {
  background: radial-gradient(circle at 65% 0, #e8ecf5 0, var(--bg-primary) 35%) !important;
}
html[data-theme-resolved="light"] .sidebar {
  background: var(--sidebar-bg) !important;
  border-right-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .brand-copy b,
html[data-theme-resolved="light"] .brand-copy small,
html[data-theme-resolved="light"] .side-nav a {
  color: var(--sidebar-text) !important;
}
html[data-theme-resolved="light"] .side-nav a.active {
  color: var(--accent) !important;
}
html[data-theme-resolved="light"] .sidebar-plan {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .sidebar-plan small,
html[data-theme-resolved="light"] .sidebar-plan b,
html[data-theme-resolved="light"] .sidebar-user small {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .sidebar-plan hr {
  border-top-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .sidebar-user {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .page-top h1,
html[data-theme-resolved="light"] .workspace>header h2,
html[data-theme-resolved="light"] .plans-page-header h1,
html[data-theme-resolved="light"] .order-detail-header h1 {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .page-top p,
html[data-theme-resolved="light"] .workspace>header p,
html[data-theme-resolved="light"] .plans-page-header p,
html[data-theme-resolved="light"] .feature-card p,
html[data-theme-resolved="light"] .autopilot-hero p {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .panel,
html[data-theme-resolved="light"] .orders-table-wrap,
html[data-theme-resolved="light"] .card,
html[data-theme-resolved="light"] .settings-card,
html[data-theme-resolved="light"] .plan-card,
html[data-theme-resolved="light"] .integration-card,
html[data-theme-resolved="light"] .kpis article,
html[data-theme-resolved="light"] .product-card,
html[data-theme-resolved="light"] .catalog-footer,
html[data-theme-resolved="light"] .bulkbar {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .panel-title,
html[data-theme-resolved="light"] .panel h3,
html[data-theme-resolved="light"] .orders-table-head,
html[data-theme-resolved="light"] .setting-lines>div,
html[data-theme-resolved="light"] .settings-switch-row,
html[data-theme-resolved="light"] .settings-subsection,
html[data-theme-resolved="light"] .settings-actions,
html[data-theme-resolved="light"] .faq-item,
html[data-theme-resolved="light"] .ticket {
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .panel-title h2,
html[data-theme-resolved="light"] .panel h3,
html[data-theme-resolved="light"] .setting-lines b,
html[data-theme-resolved="light"] .billing-row strong,
html[data-theme-resolved="light"] .kpis strong,
html[data-theme-resolved="light"] .metric strong {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .form-grid label,
html[data-theme-resolved="light"] .billing-row span,
html[data-theme-resolved="light"] .billing-row small,
html[data-theme-resolved="light"] .setting-lines small,
html[data-theme-resolved="light"] .setting-lines span,
html[data-theme-resolved="light"] .muted,
html[data-theme-resolved="light"] .queue-row span,
html[data-theme-resolved="light"] .metric span,
html[data-theme-resolved="light"] .metric small,
html[data-theme-resolved="light"] .kpis span,
html[data-theme-resolved="light"] .kpis small,
html[data-theme-resolved="light"] .settings-switch-copy small,
html[data-theme-resolved="light"] .settings-hint,
html[data-theme-resolved="light"] .order-detail-meta-date {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .settings-switch-copy strong {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .form-grid select,
html[data-theme-resolved="light"] .top-select,
html[data-theme-resolved="light"] .control-stack select,
html[data-theme-resolved="light"] .catalog-toolbar select,
html[data-theme-resolved="light"] .searchbox,
html[data-theme-resolved="light"] .orders-toolbar .orders-filter,
html[data-theme-resolved="light"] .orders-search,
html[data-theme-resolved="light"] .help-search,
html[data-theme-resolved="light"] .ai-help textarea,
html[data-theme-resolved="light"] .connect-actions button,
html[data-theme-resolved="light"] .top-tools button,
html[data-theme-resolved="light"] .top-tools a:not(.primary),
html[data-theme-resolved="light"] .secondary,
html[data-theme-resolved="light"] .action-link,
html[data-theme-resolved="light"] .view-btn,
html[data-theme-resolved="light"] .catalog-footer button,
html[data-theme-resolved="light"] .bulkbar button,
html[data-theme-resolved="light"] .plans-select-btn,
html[data-theme-resolved="light"] .settings-threshold,
html[data-theme-resolved="light"] .settings-inline-select select {
  background: var(--input-bg) !important;
  border-color: var(--border-color) !important;
  color: var(--input-text) !important;
}
html[data-theme-resolved="light"] .searchbox input,
html[data-theme-resolved="light"] .help-search input {
  color: var(--input-text) !important;
}
html[data-theme-resolved="light"] .orders-toolbar .orders-filter option,
html[data-theme-resolved="light"] select option {
  background: #ffffff !important;
  color: #0f172a !important;
}
html[data-theme-resolved="light"] .orders-table-head {
  color: var(--text-muted) !important;
  background: var(--bg-secondary) !important;
}
html[data-theme-resolved="light"] .orders-row {
  border-bottom-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .orders-row:hover {
  background: #f1f5f9 !important;
}
html[data-theme-resolved="light"] .orders-cell-id strong,
html[data-theme-resolved="light"] .orders-notification strong {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .orders-notification span {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .orders-open-btn {
  background: var(--bg-input) !important;
  border-color: var(--border-color) !important;
  color: var(--text-secondary) !important;
}
html[data-theme-resolved="light"] .plans-card {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .plans-card-popular {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  box-shadow: 0 0 0 1px var(--accent-border), 0 12px 32px rgba(15, 23, 42, 0.08) !important;
}
html[data-theme-resolved="light"] .plans-card-name,
html[data-theme-resolved="light"] .plans-price-period {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .plans-price-value,
html[data-theme-resolved="light"] .plans-features li {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .plans-select-btn:hover:not(:disabled) {
  background: #f1f5f9 !important;
  border-color: var(--accent-border) !important;
}
html[data-theme-resolved="light"] .hero,
html[data-theme-resolved="light"] .feature-card,
html[data-theme-resolved="light"] .autopilot-hero,
html[data-theme-resolved="light"] .support-hero {
  background: linear-gradient(110deg, #ffffff 0, #f8fafc 48%, #ede9fe 100%) !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .hero p,
html[data-theme-resolved="light"] .hero-links span {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .settings-threshold:has(input:checked) {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .settings-switch-ui {
  background: #e2e8f0 !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .settings-switch-ui::after {
  background: #ffffff !important;
}
html[data-theme-resolved="light"] .product-body h3,
html[data-theme-resolved="light"] .product-foot strong {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .product-meta,
html[data-theme-resolved="light"] .empty-state,
html[data-theme-resolved="light"] .empty-chart {
  color: var(--text-muted) !important;
}
html[data-theme-resolved="light"] .rule-grid div,
html[data-theme-resolved="light"] .provider-card,
html[data-theme-resolved="light"] .store-card {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-secondary) !important;
}
html[data-theme-resolved="light"] .faq-item p,
html[data-theme-resolved="light"] .ticket p {
  color: var(--text-secondary) !important;
}
html[data-theme-resolved="light"] .bot-msg {
  background: #f1f5f9 !important;
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .user-msg {
  color: #fff !important;
}
html[data-theme-resolved="light"] .queue-card,
html[data-theme-resolved="light"] .queue.modern:not(.opt-table-list) > div,
html[data-theme-resolved="light"] .queue.modern .queue-item {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}
html[data-theme-resolved="light"] .queue-row b,
html[data-theme-resolved="light"] .queue-card b {
  color: var(--text-primary) !important;
}
html[data-theme-resolved="light"] .queue-row span,
html[data-theme-resolved="light"] .queue.modern .queue-row span {
  color: var(--text-muted) !important;
}

/* Settings — sync interval custom dropdown */
.panel.settings-section.sync-dropdown-open {
  overflow: visible;
  position: relative;
  z-index: 30;
}
.settings-sync-dropdown {
  position: relative;
  display: inline-flex;
  justify-content: flex-end;
  max-width: 100%;
  overflow: visible;
}
.settings-sync-dropdown.is-open {
  z-index: 50;
}
.settings-sync-dropdown-native {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.settings-sync-dropdown-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  height: 40px;
  padding: 0 14px;
  border-radius: 10px;
  border: 1px solid rgba(124, 58, 237, 0.35);
  background: var(--input-bg, #0a1120);
  color: var(--input-text, #fff);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.settings-sync-dropdown-btn:hover,
.settings-sync-dropdown.is-open .settings-sync-dropdown-btn {
  border-color: var(--accent-border, rgba(195, 97, 255, 0.45));
  box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.18), 0 0 18px var(--accent-glow, rgba(124, 58, 237, 0.22));
}
.settings-sync-dropdown-icon {
  font-size: 15px;
  line-height: 1;
  opacity: 0.92;
}
.settings-sync-dropdown-label {
  line-height: 1.2;
}
.settings-sync-dropdown-chevron {
  margin-left: 2px;
  font-size: 12px;
  color: var(--text-muted, #aeb6ca);
  transition: transform 0.18s ease;
}
.settings-sync-dropdown.is-open .settings-sync-dropdown-chevron {
  transform: rotate(180deg);
}
.settings-sync-dropdown-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  left: auto;
  width: 100%;
  min-width: 220px;
  max-width: min(280px, calc(100vw - 24px));
  margin: 0;
  padding: 6px;
  list-style: none;
  border-radius: 12px;
  border: 1px solid var(--border-color, #313a54);
  background: var(--bg-card, #0b1220);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
  z-index: 200;
  display: grid;
  gap: 4px;
  overflow: visible;
  max-height: none;
}
.settings-sync-dropdown.opens-up .settings-sync-dropdown-menu {
  top: auto;
  bottom: calc(100% + 8px);
}
.settings-sync-dropdown-menu[hidden] {
  display: none !important;
}
.settings-sync-dropdown-menu li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 38px;
  padding: 0 12px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-primary, #f7f8ff);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.settings-sync-dropdown-menu li:hover {
  background: var(--accent-soft, rgba(124, 58, 237, 0.18));
  color: var(--text-primary, #fff);
}
.settings-sync-dropdown-menu li.is-selected {
  background: var(--accent-soft, rgba(124, 58, 237, 0.14));
  color: var(--accent, #a855f7);
  font-weight: 600;
}
.settings-sync-dropdown-menu li.is-selected::after {
  content: "✓";
  font-size: 13px;
  color: var(--accent, #a855f7);
  font-weight: 700;
}
html[data-theme="light"] .settings-sync-dropdown-menu,
html[data-theme-resolved="light"] .settings-sync-dropdown-menu {
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
}
html[data-theme="light"] .settings-sync-dropdown-menu li,
html[data-theme-resolved="light"] .settings-sync-dropdown-menu li {
  color: var(--text-primary);
}
html[data-theme="light"] .settings-sync-dropdown-menu li.is-selected,
html[data-theme-resolved="light"] .settings-sync-dropdown-menu li.is-selected {
  color: var(--accent);
}

/* Auth pages */
@keyframes auth-card-enter {
  from {
    opacity: 0;
    transform: translateY(14px) scale(0.985);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
.auth-page-body {
  min-height: 100vh;
  background: #050914;
}
.auth-page-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 32px 20px;
  background:
    radial-gradient(ellipse 80% 55% at 70% -10%, rgba(124, 58, 237, 0.18), transparent 55%),
    radial-gradient(circle at 65% 0, #0c1020 0, #050914 38%);
}
.auth-card {
  width: min(100%, 440px);
  padding: 36px 36px 32px;
  border-radius: 18px;
  border: 1px solid rgba(139, 92, 246, 0.16);
  background: linear-gradient(180deg, rgba(17, 24, 39, 0.92) 0%, rgba(9, 16, 28, 0.96) 100%);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.03) inset,
    0 24px 64px rgba(0, 0, 0, 0.45);
  animation: auth-card-enter 0.55s cubic-bezier(0.22, 1, 0.36, 1) both;
  transition: border-color 0.2s ease, box-shadow 0.25s ease, transform 0.25s ease;
}
.auth-card:hover {
  border-color: rgba(139, 92, 246, 0.28);
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04) inset,
    0 28px 72px rgba(0, 0, 0, 0.5),
    0 0 40px rgba(124, 58, 237, 0.08);
}
.auth-card-brand {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 28px;
}
.auth-card-brand img,
.auth-card-brand .brand-logo--auth {
  width: 65px;
  height: 65px;
  transition: transform 0.25s ease, filter 0.25s ease;
}
.auth-card-brand:hover img,
.auth-card-brand:hover .brand-logo--auth {
  transform: translateY(-1px) scale(1.03);
  filter: drop-shadow(0 0 16px rgba(124, 58, 237, 0.35));
}
.auth-card-brand b {
  display: block;
  font-size: 22px;
  letter-spacing: 0.4px;
}
.auth-card-brand small {
  color: #aeb6ca;
  font-size: 11px;
}
.auth-title {
  margin: 0 0 12px;
  font-size: 28px;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #f7f8ff;
  line-height: 1.2;
}
.auth-subtitle,
.auth-muted {
  margin: 0 0 22px;
  color: #aeb6ca;
  font-size: 15px;
  line-height: 1.55;
}
.auth-forgot {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 100%;
  overflow-x: hidden;
}
.auth-reset {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 100%;
  overflow-x: hidden;
}
.auth-forgot__lead {
  margin-bottom: 24px;
  color: #c5cddd;
  font-size: 15.5px;
  line-height: 1.65;
  word-break: break-word;
}
.auth-forgot__lead-secondary {
  display: block;
  margin-top: 8px;
  color: #9fa8bc;
  font-size: 14.5px;
  line-height: 1.6;
}
.auth-forgot__note {
  display: grid;
  gap: 12px;
  margin: 0 0 28px;
  padding: 16px 18px;
  border-radius: 12px;
  border: 1px solid rgba(139, 92, 246, 0.14);
  background: rgba(124, 58, 237, 0.06);
}
.auth-forgot__note p {
  margin: 0;
  color: #b8c0d3;
  font-size: 14px;
  line-height: 1.6;
}
.auth-forgot__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  align-self: flex-start;
  margin-top: 22px;
  padding: 10px 2px;
  font-size: 14px;
  font-weight: 500;
  color: #c361ff;
  text-decoration: none;
  transition: color 0.18s ease, transform 0.18s ease, opacity 0.18s ease;
}
.auth-forgot__back:hover {
  color: #e9d5ff;
  text-decoration: none;
  transform: translateX(-2px);
}
.auth-forgot__back-arrow {
  display: inline-block;
  transition: transform 0.18s ease;
}
.auth-forgot__back:hover .auth-forgot__back-arrow {
  transform: translateX(-3px);
}
.auth-success {
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(52, 211, 153, 0.35);
  background: rgba(16, 185, 129, 0.12);
  color: #a7f3d0;
  font-size: 14px;
  line-height: 1.5;
  word-break: break-word;
}
.auth-hint {
  color: #8b93a7;
  font-size: 12px;
  line-height: 1.4;
}
.auth-password-field {
  display: flex;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.auth-password-field input {
  flex: 1 1 auto;
  min-width: 0;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}
.auth-password-toggle {
  flex: 0 0 auto;
  border: 1px solid #303850;
  border-left: none;
  background: #0a1120;
  color: #aeb6ca;
  border-radius: 0 10px 10px 0;
  padding: 0 12px;
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  white-space: nowrap;
}
.auth-password-toggle:hover {
  color: #fff;
}
.auth-reset__done {
  margin: 8px 0 0;
}
.auth-reset__login-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-sizing: border-box;
  width: 100%;
}
@media (max-width: 480px) {
  .auth-page-shell {
    padding: 20px 14px;
    align-items: stretch;
  }
  .auth-card {
    width: 100%;
    max-width: 100%;
    padding: 28px 22px 26px;
    border-radius: 16px;
    box-sizing: border-box;
  }
  .auth-card-brand {
    margin-bottom: 22px;
    gap: 12px;
  }
  .auth-card-brand img,
  .auth-card-brand .brand-logo--auth {
    width: 58px;
    height: 58px;
  }
  .auth-title {
    font-size: 24px;
  }
  .auth-forgot__lead {
    font-size: 15px;
  }
  .auth-forgot__note {
    padding: 14px 14px;
    margin-bottom: 24px;
  }
  .auth-password-toggle {
    padding: 0 10px;
    font-size: 12px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .auth-card {
    animation: none;
  }
  .auth-card-brand img,
  .auth-card-brand .brand-logo--auth,
  .auth-forgot__back,
  .auth-forgot__back-arrow {
    transition: none;
  }
}
.auth-error {
  margin: 0 0 14px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(239, 68, 68, 0.35);
  background: rgba(239, 68, 68, 0.12);
  color: #fecaca;
  font-size: 14px;
  word-break: break-word;
}
.auth-form {
  display: grid;
  gap: 14px;
  max-width: 100%;
  min-width: 0;
}
.auth-form label {
  display: grid;
  gap: 8px;
  color: #b8c0d3;
  font-size: 14px;
  min-width: 0;
}
.auth-form input[type="email"],
.auth-form input[type="password"],
.auth-form input[type="text"] {
  height: 44px;
  border: 1px solid #303850;
  border-radius: 10px;
  background: #0a1120;
  color: #fff;
  padding: 0 13px;
  font: inherit;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.auth-form input:focus {
  outline: 2px solid rgba(124, 58, 237, 0.35);
  border-color: #7c3aed;
}
.auth-field-error {
  color: #fca5a5;
  font-size: 12px;
}
.auth-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.auth-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #aeb6ca;
  font-size: 13px;
}
.auth-link {
  color: #c361ff;
  text-decoration: none;
  font-size: 13px;
  transition: color 0.18s ease, opacity 0.18s ease;
}
.auth-link:hover {
  color: #e9d5ff;
  text-decoration: none;
}
.auth-submit {
  width: 100%;
  min-height: 44px;
  margin-top: 4px;
  cursor: pointer;
}
.auth-footer {
  margin: 18px 0 0;
  color: #9fa8bc;
  font-size: 14px;
  text-align: center;
}
.auth-legal-links {
  margin: 10px 0 0;
  text-align: center;
  font-size: 12px;
  line-height: 1.5;
}
.auth-legal-links-bottom {
  margin-top: 24px;
}
.auth-muted-link {
  color: #7a849c !important;
}
.auth-muted-link:hover {
  color: #c361ff !important;
}
.auth-legal-sep {
  color: #5c6478;
  margin: 0 6px;
}
.auth-check-custom {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  min-height: 20px;
}
.auth-check-terms {
  align-items: flex-start;
  line-height: 1.45;
}
.auth-checkbox-input {
  position: absolute;
  opacity: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  left: 0;
  top: 0;
  cursor: pointer;
  z-index: 1;
}
.auth-checkbox-box {
  width: 20px;
  height: 20px;
  border-radius: 6px;
  border: 1.5px solid rgba(124, 58, 237, 0.7);
  background: #0a1120;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
  margin-top: 1px;
}
.auth-checkbox-label {
  color: #aeb6ca;
  font-size: 13px;
}
.auth-inline-link {
  font-size: inherit;
}
.auth-check-custom:hover .auth-checkbox-box {
  border-color: #9333ea;
  box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.2);
}
.auth-checkbox-input:focus-visible + .auth-checkbox-box {
  outline: 2px solid rgba(124, 58, 237, 0.55);
  outline-offset: 2px;
}
.auth-checkbox-input:checked + .auth-checkbox-box {
  border-color: #a855f7;
  background: linear-gradient(135deg, #7c3aed 0%, #9333ea 100%);
  box-shadow: 0 0 14px rgba(124, 58, 237, 0.45);
}
.auth-checkbox-input:checked + .auth-checkbox-box::after {
  content: "";
  display: block;
  width: 5px;
  height: 10px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  margin-top: -2px;
}
.auth-page-shell-legal {
  align-items: flex-start;
  padding-top: 32px;
  padding-bottom: 32px;
}
.auth-card-legal {
  width: min(100%, 720px);
  max-height: none;
}
.auth-legal-back-row {
  margin: 0 0 12px;
}
.auth-legal-updated {
  margin: 0 0 20px;
  color: #7a849c;
  font-size: 13px;
}
.auth-legal-body {
  display: grid;
  gap: 20px;
  color: #c5cddd;
  font-size: 14px;
  line-height: 1.6;
}
.auth-legal-body h2 {
  margin: 0 0 8px;
  font-size: 16px;
  color: #eef1f7;
}
.auth-legal-body p,
.auth-legal-body ul {
  margin: 0;
}
.auth-legal-body ul {
  padding-left: 1.2rem;
  display: grid;
  gap: 6px;
}
.auth-legal-body code {
  font-size: 12px;
  color: #d8b4fe;
}
.settings-danger-zone {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(239, 68, 68, 0.25);
  display: grid;
  gap: 14px;
}
.settings-danger-zone h3 {
  margin: 0;
  font-size: 15px;
  color: #fecaca;
}
.settings-delete-form {
  display: grid;
  gap: 12px;
  max-width: 420px;
}
.settings-delete-label {
  display: grid;
  gap: 8px;
  color: #b8c0d3;
  font-size: 14px;
}
.settings-delete-label input {
  height: 40px;
  border: 1px solid #303850;
  border-radius: 10px;
  background: #0a1120;
  color: #fff;
  padding: 0 12px;
  font: inherit;
}
.settings-delete-error {
  margin-bottom: 4px;
}
.settings-btn-danger {
  justify-self: start;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 10px;
  border: 1px solid rgba(239, 68, 68, 0.45);
  background: rgba(127, 29, 29, 0.35);
  color: #fecaca;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.settings-btn-danger:hover {
  background: rgba(185, 28, 28, 0.45);
  border-color: rgba(248, 113, 113, 0.55);
  box-shadow: 0 0 16px rgba(239, 68, 68, 0.2);
}
.settings-btn-danger:focus-visible {
  outline: 2px solid rgba(248, 113, 113, 0.45);
  outline-offset: 2px;
}

/* Sidebar: compact nav + bottom cards (auth user menu keeps separate rules below) */
.side-nav {
  flex-shrink: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  align-content: start;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #313a54 transparent;
}
.sidebar-plan,
.sidebar-user.sidebar-user-menu,
.sidebar-user-login {
  flex-shrink: 0;
}
.sidebar:has(.sidebar-user-menu.is-open) {
  overflow: visible;
}

/* Sidebar user menu */
.sidebar-user.sidebar-user-menu {
  position: relative;
  margin-top: 14px;
  border: 0;
  padding: 0;
  background: transparent;
  display: block;
  flex-shrink: 0;
}
.sidebar-user-trigger {
  width: 100%;
  margin: 0;
  border: 1px solid #242c41;
  border-radius: 14px;
  padding: 13px;
  background: transparent;
  color: inherit;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  text-align: left;
  font: inherit;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.sidebar-user-trigger:hover,
.sidebar-user-menu.is-open .sidebar-user-trigger {
  border-color: rgba(124, 58, 237, 0.55);
  background: rgba(124, 58, 237, 0.08);
  box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.12);
}
.sidebar-user-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #4e1c93;
  display: grid;
  place-items: center;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}
.sidebar-user-copy {
  display: grid;
  gap: 3px;
  min-width: 0;
}
.sidebar-user-copy b,
.sidebar-user-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-user-copy small {
  color: #9ea7bb;
}
.sidebar-user-chevron {
  margin-left: auto;
  font-style: normal;
  opacity: 0.85;
  transition: transform 0.18s ease;
}
.sidebar-user-menu.is-open .sidebar-user-chevron {
  transform: rotate(180deg);
}
.sidebar-user-dropdown {
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(100% + 8px);
  padding: 6px;
  border-radius: 12px;
  border: 1px solid rgba(124, 58, 237, 0.35);
  background: #0b1220;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(124, 58, 237, 0.1);
  z-index: 60;
  display: grid;
  gap: 4px;
}
.sidebar-user-dropdown[hidden] {
  display: none !important;
}
.sidebar-user-dropdown-item {
  display: flex;
  align-items: center;
  min-height: 38px;
  padding: 0 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #f7f8ff;
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  width: 100%;
  text-align: left;
  transition: background 0.15s ease, color 0.15s ease;
}
.sidebar-user-dropdown-item:hover {
  background: rgba(124, 58, 237, 0.18);
  color: #fff;
}
.sidebar-user-dropdown-divider {
  margin: 2px 0;
  border: 0;
  border-top: 1px solid #313a54;
}
.sidebar-user-dropdown-logout-form {
  margin: 0;
}
.sidebar-user-dropdown-logout {
  color: #fca5a5;
}
.sidebar-user-dropdown-logout:hover {
  color: #fecaca;
  background: rgba(239, 68, 68, 0.16);
}
.sidebar-user-login {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 14px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid #242c41;
  border-radius: 14px;
  background: transparent;
  color: #f7f8ff;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  flex-shrink: 0;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}
.sidebar-user-login:hover {
  border-color: rgba(124, 58, 237, 0.55);
  background: rgba(124, 58, 237, 0.08);
  box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.12);
}
.sidebar.is-compact .sidebar-user-copy,
.sidebar.is-compact .sidebar-user-chevron {
  display: none;
}
.sidebar.is-compact .sidebar-user-trigger {
  justify-content: center;
  padding: 10px;
}
.sidebar.is-compact .sidebar-user-login {
  min-height: 44px;
  padding: 0 10px;
  font-size: 13px;
}
html[data-theme-resolved="light"] .sidebar-user-login {
  background: var(--bg-card, #fff) !important;
  border-color: var(--border-color, #d8deea) !important;
  color: var(--text-primary, #0f172a) !important;
}
html[data-theme-resolved="light"] .sidebar-user-trigger {
  background: var(--bg-card, #fff) !important;
  border-color: var(--border-color, #d8deea) !important;
}
html[data-theme-resolved="light"] .sidebar-user-copy small {
  color: var(--text-muted, #64748b) !important;
}
html[data-theme-resolved="light"] .sidebar-user-dropdown {
  background: var(--bg-card, #fff) !important;
  border-color: var(--border-color, #d8deea) !important;
}
html[data-theme-resolved="light"] .sidebar-user-dropdown-item {
  color: var(--text-primary, #0f172a) !important;
}
html[data-theme-resolved="light"] .sidebar-user-dropdown-divider {
  border-top-color: var(--border-color, #d8deea) !important;
}

/* Header tools — language + add store (dashboard) */
#header-tools.top-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

#header-tools .header-lang {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
}

/* Override global .top-tools button { display:grid; min-height:42px } */
#header-tools .header-lang-trigger,
#header-tools .header-add-store-btn {
  box-sizing: border-box;
  display: inline-flex !important;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  margin: 0;
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1 !important;
  border-width: 1px;
  border-style: solid;
  border-radius: 10px;
  white-space: nowrap;
  place-items: unset;
  flex-shrink: 0;
  font-size: 13px;
  cursor: pointer;
}

#header-tools .header-lang-trigger {
  gap: 6px;
  padding-left: 14px !important;
  padding-right: 14px !important;
  border-color: #2a3348;
  background: #0a101c;
  color: #e8ebf5;
  font-weight: 500;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

#header-tools .header-lang-trigger:hover,
#header-tools .header-lang.is-open .header-lang-trigger {
  border-color: #7b3cf0;
  box-shadow: 0 0 0 1px rgba(123, 60, 240, 0.18);
  background: #0d1424;
}

#header-tools .header-lang-icon,
#header-tools .header-lang-label,
#header-tools .header-lang-chevron,
#header-tools .header-add-store-icon,
#header-tools .header-add-store-text {
  margin: 0;
  padding: 0;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

#header-tools .header-lang-icon {
  width: 14px;
  height: 14px;
  font-size: 14px;
}

#header-tools .header-lang-chevron {
  font-size: 10px;
  color: #9ea7bb;
}

#header-tools .header-add-store-btn {
  gap: 6px;
  padding-left: 16px !important;
  padding-right: 16px !important;
  border-color: rgba(123, 60, 240, 0.5);
  background: rgba(123, 60, 240, 0.1);
  color: #ece4ff;
  font-weight: 600;
  box-shadow: none;
  transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
}

#header-tools .header-add-store-btn:hover {
  border-color: rgba(155, 92, 255, 0.75);
  background: rgba(123, 60, 240, 0.18);
  box-shadow: 0 0 14px rgba(123, 60, 240, 0.16);
}

#header-tools .header-add-store-btn:active {
  transform: translateY(1px);
}

#header-tools .header-add-store-icon {
  width: 14px;
  height: 14px;
  opacity: 0.95;
}

.header-lang-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 176px;
  margin: 0;
  padding: 6px;
  list-style: none;
  border: 1px solid #2a3348;
  border-radius: 11px;
  background: #0a101c;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.42);
  z-index: 60;
}

.header-lang-menu[hidden] {
  display: none;
}

.header-lang-menu li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border-radius: 8px;
  font-size: 13px;
  color: #dce1ef;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.header-lang-option-check {
  flex: 0 0 14px;
  width: 14px;
  font-size: 12px;
  font-weight: 700;
  color: transparent;
  text-align: center;
  line-height: 1;
}

.header-lang-menu li.is-selected .header-lang-option-check {
  color: #b366ff;
}

.header-lang-menu li:hover {
  background: rgba(123, 60, 240, 0.1);
  color: #e8dcff;
}

.header-lang-menu li.is-selected {
  background: rgba(123, 60, 240, 0.16);
  color: #d8b4ff;
}

/* Add store modal */
body.store-modal-open {
  overflow: hidden;
}

.store-modal[hidden] {
  display: none;
}

.store-modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: grid;
  place-items: center;
  padding: 20px;
}

.store-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 6, 14, 0.72);
  backdrop-filter: blur(4px);
}

.store-modal-dialog {
  position: relative;
  width: min(560px, 100%);
  max-height: min(88vh, 720px);
  overflow: auto;
  padding: 28px 28px 24px;
  border: 1px solid #2a3348;
  border-radius: 16px;
  background: linear-gradient(165deg, #0a101c 0%, #0d1424 100%);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);
}

.store-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border: 1px solid #2a3348;
  border-radius: 8px;
  background: #0b1220;
  color: #aeb6ca;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease;
}

.store-modal-close:hover {
  border-color: #7b3cf0;
  color: #fff;
}

.store-modal-title {
  margin: 0 0 8px;
  font-size: 22px;
  font-weight: 700;
}

.store-modal-subtitle {
  margin: 0 0 22px;
  color: #9ea7bb;
  font-size: 14px;
  line-height: 1.45;
}

.store-modal-cards {
  display: grid;
  gap: 12px;
}

.store-modal-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid #2a3348;
  border-radius: 12px;
  background: #0b1220;
}

.store-modal-card-active {
  border-color: rgba(123, 60, 240, 0.45);
}

.store-modal-card-disabled {
  opacity: 0.55;
}

.store-modal-card-logo {
  width: 44px;
  height: 44px;
  border-radius: 11px;
  background: transparent;
  display: grid;
  place-items: center;
  font-size: 20px;
  font-weight: 800;
}

.store-modal-card-logo-muted {
  background: #1a2236;
  color: #7f899f;
  font-size: 18px;
}

.store-modal-card-body h3 {
  margin: 0 0 4px;
  font-size: 15px;
}

.store-modal-card-body p {
  margin: 0;
  color: #9ea7bb;
  font-size: 13px;
}

.store-modal-card-btn {
  min-height: 38px;
  padding: 0 14px;
  white-space: nowrap;
}

.store-modal-form {
  display: grid;
  gap: 14px;
}

.store-modal-field {
  display: grid;
  gap: 8px;
  color: #b8c0d3;
  font-size: 13px;
}

.store-modal-field input {
  height: 44px;
  border: 1px solid #2a3348;
  border-radius: 10px;
  background: #070d18;
  color: #fff;
  padding: 0 14px;
  font: inherit;
  outline: none;
  transition: border-color 0.15s ease;
}

.store-modal-field input:focus {
  border-color: #7b3cf0;
}

.store-modal-hint {
  margin: 0;
  font-size: 12px;
  color: #8b94a8;
  line-height: 1.5;
}

.store-modal-hint a {
  color: #c361ff;
  text-decoration: none;
}

.store-modal-hint a:hover {
  text-decoration: underline;
}

.store-modal-error {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid rgba(239, 68, 68, 0.35);
  border-radius: 8px;
  background: rgba(239, 68, 68, 0.08);
  color: #fca5a5;
  font-size: 13px;
}

.store-modal-error[hidden] {
  display: none;
}

.store-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 4px;
}

.store-modal-step-success {
  text-align: center;
  padding-top: 8px;
}

.store-modal-success-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  border-radius: 50%;
  border: 2px solid #35eb78;
  color: #35eb78;
  display: grid;
  place-items: center;
  font-size: 28px;
  font-weight: 700;
}

.store-modal-step-success .primary {
  margin-top: 8px;
  min-width: 140px;
}

@media (max-width: 760px) {
  #header-tools.top-tools {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 8px;
  }

  #header-tools .header-lang-label,
  #header-tools .header-lang-chevron {
    display: none;
  }

  #header-tools .header-lang-trigger {
    width: 40px;
    min-width: 40px;
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #header-tools .header-add-store-text {
    display: none;
  }

  #header-tools .header-add-store-btn {
    height: 40px !important;
    min-height: 40px !important;
    max-height: 40px !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  #header-tools .header-add-store-btn::after {
    content: "Магазин";
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
  }

  .store-modal-dialog {
    padding: 22px 18px 18px;
  }

  .store-modal-card {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
  }

  .store-modal-card-btn,
  .store-modal-card .secondary {
    grid-column: 1 / -1;
    justify-self: stretch;
  }
}

/* Integrations hub */
.integrations-page-header .integrations-add-store-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 16px;
  border: 1px solid rgba(123, 60, 240, 0.5);
  border-radius: 10px;
  background: rgba(123, 60, 240, 0.1);
  color: #ece4ff;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.integrations-store-grid{padding:20px}
.integrations-store-body{display:grid;gap:6px;min-width:0}
.integrations-store-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.integrations-store-meta,.integrations-store-sync,.integrations-store-token-hint{margin:0;color:#9ea7bb;font-size:13px}
.marketplace-chip{font-size:10px;padding:3px 8px;border-radius:999px;border:1px solid #3a3150;background:#151026;color:#c9d2e8}
.marketplace-badge-prom{background:transparent}
.marketplace-badge-rozetka{background:transparent}
.marketplace-badge-shopify,.marketplace-badge-woocommerce,.marketplace-badge-etsy{background:transparent}
.provider-card-rozetka .platform-logo{color:#fff}
.marketplace-logo{width:48px;height:48px;flex-shrink:0;position:relative;display:grid;place-items:center}
.marketplace-logo-img{width:48px;height:48px;object-fit:contain;display:block;border-radius:8px;background:transparent}
.marketplace-logo-fallback{display:none;width:48px;height:48px;border-radius:8px;place-items:center;font-size:18px;font-weight:800;color:#fff}
.marketplace-logo.is-fallback .marketplace-logo-img{display:none}
.marketplace-logo.is-fallback .marketplace-logo-fallback{display:grid}
.marketplace-logo-prom .marketplace-logo-fallback{background:linear-gradient(135deg,#ffd400,#e6b800);color:#6b2c91}
.marketplace-logo-rozetka .marketplace-logo-fallback,.store-modal-card-logo-rozetka.marketplace-logo.is-fallback .marketplace-logo-fallback{background:linear-gradient(135deg,#00a046,#007a36)}
.marketplace-logo-shopify .marketplace-logo-fallback{background:linear-gradient(135deg,#95bf47,#5e8e3e)}
.marketplace-logo-woocommerce .marketplace-logo-fallback{background:linear-gradient(135deg,#7f54b3,#5b3a8d)}
.marketplace-logo-etsy .marketplace-logo-fallback{background:linear-gradient(135deg,#f56400,#d45100)}
.store-modal-card-logo.marketplace-logo,.store-modal-card .marketplace-logo{width:48px;height:48px}
.store-modal-card-logo.marketplace-logo .marketplace-logo-img,.store-modal-card .marketplace-logo .marketplace-logo-img{width:48px;height:48px;object-fit:contain;display:block;border-radius:11px}
.store-modal-card-logo-muted.marketplace-logo.is-fallback .marketplace-logo-fallback{background:#1a2236;color:#7f899f}
.store-modal-password-wrap{display:flex;align-items:stretch;gap:0}
.store-modal-password-wrap input{flex:1;border-top-right-radius:0;border-bottom-right-radius:0}
.store-modal-password-toggle{flex:0 0 auto;border:1px solid #313a54;border-left:none;background:#0b1220;color:#aeb6ca;border-radius:0 9px 9px 0;padding:0 12px;cursor:pointer}
.store-modal-password-toggle:hover{color:#fff}
.store-modal-rozetka-lead{margin:0;font-size:15px;line-height:1.5;color:#e5e7eb}
.store-status-warn{color:#fbbf24}
.store-status-error{color:#fca5a5}
.store-status-muted{color:#9ea7bb}
.integrations-empty{padding:28px 20px 32px;display:grid;gap:14px;color:#9ea7bb}
.store-modal-success-inline{margin:0;color:#86efac;font-size:13px}
.store-modal-connection-status{margin:0 0 8px;font-size:13px;color:#9ea7bb}
.store-modal-connection-status[data-state="checking"]{color:#c4b5fd}
.store-modal-connection-status[data-state="verified"]{color:#86efac}
.store-modal-connection-status[data-state="error"]{color:#fca5a5}
.store-modal-connect-btn:disabled,.store-modal-connect-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed;filter:saturate(.65);box-shadow:none;transform:none}
.store-modal-connect-btn:disabled:hover,.store-modal-connect-btn[aria-disabled="true"]:hover{box-shadow:none;filter:saturate(.65)}
.store-modal-connect-btn.is-ready:not(:disabled){opacity:1;cursor:pointer}
.sellora-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(12px);z-index:400;padding:12px 18px;border-radius:10px;border:1px solid #2a3348;background:#101828;color:#fff;font-size:14px;box-shadow:0 12px 32px rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease}
.sellora-toast.is-visible{opacity:1;transform:translateX(-50%) translateY(0)}
.sellora-toast.is-error{border-color:rgba(248,113,113,.45);background:#1a0f14;color:#fecaca;box-shadow:0 12px 32px rgba(127,29,29,.35)}
html[data-theme-resolved="light"] .sellora-toast.is-error{background:#fef2f2;color:#991b1b;border-color:#fecaca}
.support-chat{display:flex;flex-direction:column;gap:10px;max-height:340px;overflow-y:auto;padding:4px 2px 8px;margin-bottom:12px}
.support-msg{display:flex;gap:10px;align-items:flex-start;max-width:100%}
.support-msg-user{flex-direction:row-reverse;margin-left:18%}
.support-msg-bot{margin-right:12%}
.support-msg-icon{flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;background:linear-gradient(135deg,#8e38ef,#4d16a7);color:#fff}
.support-msg-bubble{padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.45;word-break:break-word}
.support-msg-bot .support-msg-bubble{background:#151026;border:1px solid #342653;color:#e8ecf5;border-top-left-radius:4px}
.support-msg-user .support-msg-bubble{background:linear-gradient(135deg,#2a1850,#1a1038);border:1px solid #4d16a7;color:#f3f0ff;border-top-right-radius:4px}
.support-suggested-actions{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
.support-action-btn{display:inline-flex;align-items:center;padding:7px 12px;border-radius:999px;border:1px solid #4d16a7;background:#120a24;color:#d8c4ff;font-size:12px;text-decoration:none}
.support-action-btn:hover{background:#1c0f38;color:#fff}
.ai-help textarea:disabled{opacity:.65}
.provider-card-disabled{opacity:.55}
.integrations-store-actions{flex-wrap:wrap}
.integrations-store-actions a,
.integrations-store-actions .integrations-sync-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:transform 150ms ease,border-color 150ms ease,background-color 150ms ease,box-shadow 150ms ease,color 150ms ease;
}
.integrations-store-actions a:hover,
.integrations-store-actions .integrations-sync-btn:hover:not(:disabled){
  transform:translateY(-1px);
}
.integrations-store-actions a:hover{
  background:#121a2c;
  border-color:var(--accent-border,rgba(195,97,255,.45));
  box-shadow:0 0 0 1px rgba(124,58,237,.14),0 0 14px var(--accent-glow,rgba(124,58,237,.18));
  color:#fff;
}
.integrations-store-actions .integrations-sync-btn:hover:not(:disabled){
  background:#121a2c;
  border-color:#3d4660;
  box-shadow:0 4px 14px rgba(0,0,0,.22);
}
.integrations-store-actions a:focus-visible,
.integrations-store-actions .integrations-sync-btn:focus-visible{
  outline:none;
  border-color:var(--accent,#7c3aed);
  box-shadow:0 0 0 3px var(--accent-soft,rgba(124,58,237,.18)),0 0 12px var(--accent-glow,rgba(124,58,237,.16));
}
.integrations-store-actions a:active,
.integrations-store-actions .integrations-sync-btn:active:not(:disabled){
  transform:translateY(0) scale(.98);
}
.integrations-store-actions a:active{
  filter:brightness(.94);
}
html[data-theme-resolved="light"] .integrations-store-actions a:hover{
  background:#f3f4f8;
  border-color:var(--accent-border,rgba(124,58,237,.35));
  box-shadow:0 0 0 1px rgba(124,58,237,.1),0 0 12px var(--accent-glow,rgba(124,58,237,.12));
  color:var(--text-primary,#111827);
}
html[data-theme-resolved="light"] .integrations-store-actions .integrations-sync-btn:hover:not(:disabled){
  background:#eef1f6;
  border-color:#c7cfdd;
  box-shadow:0 4px 12px rgba(15,23,42,.08);
}
html[data-theme-resolved="light"] .integrations-store-actions a:focus-visible,
html[data-theme-resolved="light"] .integrations-store-actions .integrations-sync-btn:focus-visible{
  border-color:var(--accent,#7c3aed);
  box-shadow:0 0 0 3px var(--accent-soft,rgba(124,58,237,.14)),0 0 10px var(--accent-glow,rgba(124,58,237,.1));
}
html[data-theme-resolved="light"] .integrations-store-actions a:active{
  filter:brightness(.97);
}

/* Optimization page KPI row */
.kpis.opt-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 24px;
  margin: 18px 0;
  align-items: stretch;
}

.kpis.opt-kpis .kpi-card {
  min-width: 0;
  min-height: 116px;
  height: 100%;
  align-items: center;
}

.kpis.opt-kpis em.violet {
  background: #2a105c;
  color: #aa4dff;
}

@media (min-width: 1440px) {
  .kpis.opt-kpis {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

@media (max-width: 1439px) and (min-width: 1024px) {
  .kpis.opt-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1023px) and (min-width: 768px) {
  .kpis.opt-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  .kpis.opt-kpis {
    grid-template-columns: 1fr;
  }
}

/* Page transitions — content area only (sidebar stays stable) */
.route-content {
  position: relative;
  opacity: 1;
  transform: translateY(0);
}

.route-content.is-route-skeleton {
  opacity: 1;
}

.route-content.is-route-leaving {
  display: none;
}

.route-content.is-route-entering {
  opacity: 0;
  transform: translateY(4px);
}

.route-content.is-route-ready {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 190ms ease-out,
    transform 190ms ease-out;
}

.route-content.is-route-entering .route-stagger-item {
  opacity: 0;
  transform: translateY(4px);
}

.route-content.is-route-ready .route-stagger-item {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 190ms ease-out,
    transform 190ms ease-out;
  transition-delay: calc(var(--stagger-i, 0) * 20ms);
}

.route-error-state {
  max-width: 480px;
  margin: 48px auto;
  padding: 32px;
  text-align: center;
}

.route-error-state h2 {
  margin: 0 0 12px;
}

.route-error-state .route-error-retry {
  margin-top: 20px;
}

/* Sidebar active item — per-link background (stable on MPA reloads) */
.side-nav {
  position: relative;
}

.side-nav-indicator {
  display: none !important;
}

.side-nav a {
  position: relative;
  z-index: 1;
  border: 1px solid transparent;
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.side-nav.is-initializing a {
  transition: none !important;
}

.side-nav a.active {
  background: linear-gradient(90deg, rgba(123, 46, 232, 0.34), rgba(91, 25, 202, 0.2));
  border-color: rgba(139, 92, 246, 0.28);
  color: #f7f8ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.side-nav a:hover:not(.active) {
  background: rgba(255, 255, 255, 0.04);
}

.side-nav a.active .nav-icon {
  opacity: 1;
  transition: opacity 180ms ease, color 180ms ease;
}

/* Sellora page skeleton system */
.sellora-page {
  position: relative;
}

.sellora-page.is-loading .sellora-skeleton {
  display: block;
}

.sellora-page.is-loading .sellora-page-content {
  display: none;
}

.sellora-page.is-ready .sellora-skeleton {
  display: none !important;
}

.sellora-page.is-ready .sellora-page-content {
  display: block;
}

.sellora-skeleton {
  display: none;
}

.sellora-shimmer {
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.sellora-page.skeleton-exit .sellora-skeleton {
  opacity: 0;
  transition: opacity 180ms ease;
}

.sellora-page.anim-fade .sellora-page-content {
  animation: analytics-content-fade 220ms ease both;
}

.sellora-skeleton-dashboard {
  display: grid;
  gap: 18px;
}

.sellora-skeleton-hero {
  height: 132px;
  border-radius: 16px;
}

.sellora-skeleton-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.sellora-skeleton-kpi {
  height: 116px;
  border-radius: 14px;
}

.sellora-skeleton-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.sellora-skeleton-panel {
  height: 220px;
  border-radius: 14px;
}

.sellora-skeleton-products .sellora-skeleton-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 14px;
}

.sellora-skeleton-toolbar {
  height: 46px;
  border-radius: 10px;
  margin-bottom: 14px;
}

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

.sellora-skeleton-product-card {
  height: 320px;
  border-radius: 14px;
}

.sellora-skeleton-opt .sellora-skeleton-kpis {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  margin-bottom: 14px;
}

.sellora-skeleton-feature {
  height: 120px;
  border-radius: 16px;
  margin-bottom: 14px;
}

.sellora-skeleton-queue {
  height: 360px;
  border-radius: 14px;
}

.sellora-skeleton-settings {
  display: grid;
  gap: 14px;
}

.sellora-skeleton-settings-card {
  height: 180px;
  border-radius: 14px;
}

.sellora-skeleton-autopilot {
  display: grid;
  gap: 18px;
}

.sellora-skeleton-kpi-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.sellora-skeleton-kpi-row .sellora-shimmer {
  height: 116px;
  border-radius: 14px;
}

@media (max-width: 1100px) {
  .sellora-skeleton-kpis,
  .sellora-skeleton-products .sellora-skeleton-kpis,
  .sellora-skeleton-opt .sellora-skeleton-kpis,
  .sellora-skeleton-kpi-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .sellora-skeleton-grid {
    grid-template-columns: 1fr;
  }

  .sellora-skeleton-product-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .sellora-skeleton-product-grid {
    grid-template-columns: 1fr;
  }

  .sellora-skeleton-kpi-row {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .route-content.is-route-leaving {
    transition: none;
    opacity: 1;
  }

  .route-content.is-route-entering {
    transform: none;
  }

  .route-content.is-route-ready {
    transform: none;
    transition: opacity 120ms ease;
  }

  .route-content.is-route-entering .route-stagger-item,
  .route-content.is-route-ready .route-stagger-item {
    transform: none;
    transition: opacity 120ms ease;
    transition-delay: calc(var(--stagger-i, 0) * 12ms);
  }

  .side-nav a {
    transition: none;
  }

  .sellora-page.anim-fade .sellora-page-content {
    animation: none;
  }

  .sellora-page.skeleton-exit .sellora-skeleton {
    transition: none;
  }
}

/* Analytics page */
.analytics-page {
  max-width: 1680px;
  margin: 0 auto;
  --analytics-space-xs: 8px;
  --analytics-space-sm: 12px;
  --analytics-space-md: 16px;
  --analytics-space-lg: 20px;
  --analytics-space-xl: 24px;
}

.analytics-page .panel .panel-title {
  padding: 18px var(--analytics-space-xl) var(--analytics-space-md);
  margin: 0;
}

.analytics-page .analytics-panel-head.panel-title {
  padding-top: var(--analytics-space-lg);
  padding-bottom: var(--analytics-space-md);
}

.analytics-page.is-loading .analytics-kpi-value,
.analytics-page.is-loading .analytics-donut-number {
  color: transparent;
  background: linear-gradient(90deg, #1a2238 25%, #242d48 50%, #1a2238 75%);
  background-size: 200% 100%;
  border-radius: 6px;
  min-width: 48px;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-page.is-loading .analytics-timeline-body,
.analytics-page.is-loading .analytics-impact-grid,
.analytics-page.is-loading .analytics-table-wrap {
  pointer-events: none;
}

.analytics-page.is-loading .analytics-seo-body > :not(.analytics-skeleton-seo) {
  visibility: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  pointer-events: none;
}

@keyframes analytics-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.analytics-kpis .analytics-kpi {
  display: flex;
  align-items: flex-start;
  gap: var(--analytics-space-md);
  min-height: 116px;
  --analytics-accent: rgba(139, 92, 246, 0.4);
  border: 1px solid #242d48;
  border-radius: 14px;
  background: linear-gradient(160deg, #0b1220 0%, #0e1628 100%);
  padding: var(--analytics-space-lg);
  transition:
    border-color 200ms ease,
    background-color 200ms ease,
    box-shadow 200ms ease,
    transform 200ms ease;
}

.analytics-kpi[data-kpi="total"] { --analytics-accent: rgba(139, 92, 246, 0.42); }
.analytics-kpi[data-kpi="published"] { --analytics-accent: rgba(62, 207, 142, 0.42); }
.analytics-kpi[data-kpi="ready"] { --analytics-accent: rgba(96, 165, 250, 0.42); }
.analytics-kpi[data-kpi="queue"] { --analytics-accent: rgba(240, 160, 64, 0.42); }

.analytics-kpi em {
  transition: filter 180ms ease, opacity 180ms ease;
}

.analytics-kpi-value {
  transition: color 180ms ease;
  display: inline-block;
  transform-origin: left center;
}

.analytics-kpis .analytics-kpi > div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.analytics-kpi-delta {
  font-size: 12px;
  color: #8b93a8;
  line-height: 1.3;
}

.analytics-kpi-delta.positive {
  color: #3ecf8e;
}

.analytics-kpi-delta.queue-tone {
  color: #f0a040;
}

.analytics-kpi-value.is-muted {
  font-size: 15px;
  color: #8b93a8;
  font-weight: 500;
}

.analytics-kpi-scope {
  font-size: 11px;
  color: #6b7388;
  line-height: 1.3;
}

.analytics-kpi-scope.hidden {
  display: none;
}

.analytics-event-filters-wrap {
  padding: var(--analytics-space-sm) var(--analytics-space-md);
  margin-bottom: var(--analytics-space-sm);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-bottom: 1px solid #1e2638;
}

.analytics-event-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--analytics-space-xs);
  min-width: min-content;
}

.analytics-event-filter {
  border: 1px solid #2a3348;
  background: #0b1220;
  color: #aeb6ca;
  border-radius: 999px;
  min-height: 30px;
  padding: 6px 12px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 12px;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

.analytics-event-filter:hover {
  border-color: #3a4568;
  background: #101828;
}

.analytics-event-filter.is-active {
  border-color: rgba(139, 92, 246, 0.45);
  background: rgba(139, 92, 246, 0.1);
  color: #f7f8ff;
  box-shadow:
    0 0 0 1px rgba(139, 92, 246, 0.22),
    0 4px 14px rgba(139, 92, 246, 0.18);
}

.analytics-event-filter:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 2px;
}

.analytics-filter-count {
  opacity: 0.75;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.analytics-grid {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  gap: 18px;
  margin-bottom: 18px;
}

.analytics-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
}

.analytics-all-events {
  flex-shrink: 0;
  font-size: 13px;
  padding: 8px 12px;
}

.analytics-timeline-body {
  min-height: 200px;
  padding: 0 var(--analytics-space-lg) var(--analytics-space-xl);
  transition: opacity 200ms ease;
}

.analytics-timeline-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.analytics-timeline-feed {
  position: relative;
  padding-left: 4px;
}

.analytics-timeline-feed::before {
  content: '';
  position: absolute;
  left: 88px;
  top: 18px;
  bottom: 18px;
  width: 1px;
  background: #2a3348;
}

.analytics-timeline-entry {
  list-style: none;
}

.analytics-timeline-item {
  display: grid;
  grid-template-columns: 56px 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--analytics-space-md);
  min-height: 56px;
  padding: var(--analytics-space-sm) 0;
  border-radius: 10px;
  border: 1px solid transparent;
  --timeline-accent: rgba(139, 92, 246, 0.35);
  --timeline-glow: rgba(120, 80, 255, 0.25);
  transition:
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease;
}

a.analytics-timeline-item {
  text-decoration: none;
  color: inherit;
  width: 100%;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

a.analytics-timeline-item:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 1px;
}

.analytics-page .top-select:focus-visible,
.analytics-page #analyticsRetry:focus-visible,
.analytics-page .analytics-all-events:focus-visible,
.analytics-page .analytics-empty-cta:focus-visible,
.analytics-page .analytics-donut:focus-visible,
.analytics-page .analytics-product-link:focus-visible,
.analytics-page .analytics-col-product a:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 2px;
}

.analytics-col-product a:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 2px;
  border-radius: 4px;
}

.analytics-timeline-item.tone-green { --timeline-accent: rgba(62, 207, 142, 0.38); --timeline-glow: rgba(62, 207, 142, 0.28); }
.analytics-timeline-item.tone-violet { --timeline-accent: rgba(139, 92, 246, 0.38); --timeline-glow: rgba(120, 80, 255, 0.25); }
.analytics-timeline-item.tone-error { --timeline-accent: rgba(255, 92, 92, 0.38); --timeline-glow: rgba(255, 92, 92, 0.28); }
.analytics-timeline-item.tone-warn { --timeline-accent: rgba(240, 160, 64, 0.38); --timeline-glow: rgba(240, 160, 64, 0.28); }
.analytics-timeline-item.tone-neutral { --timeline-accent: rgba(139, 147, 168, 0.3); --timeline-glow: rgba(139, 147, 168, 0.22); }

.analytics-timeline-dot {
  transition: box-shadow 180ms ease, transform 180ms ease, background 180ms ease;
}

.analytics-timeline-main b {
  transition: color 180ms ease;
}

.analytics-timeline-product {
  font-size: 13px;
  color: #aeb6ca;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 180ms ease;
}

.analytics-timeline-meta .analytics-badge {
  transition:
    background 180ms ease,
    border-color 180ms ease,
    box-shadow 180ms ease,
    filter 180ms ease;
}

.analytics-timeline-rail {
  position: relative;
  display: grid;
  place-items: center;
  height: 100%;
  z-index: 1;
}

.analytics-timeline-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 12px;
  border: 2px solid #0b1220;
  box-shadow: 0 0 0 1px #2a3348;
}

.analytics-timeline-dot.violet {
  background: rgba(170, 77, 255, 0.18);
  color: #bd61ff;
}

.analytics-timeline-dot.green {
  background: rgba(62, 207, 142, 0.18);
  color: #3ecf8e;
}

.analytics-timeline-dot.warn {
  background: rgba(240, 160, 64, 0.18);
  color: #f0a040;
}

.analytics-timeline-dot.error {
  background: rgba(255, 92, 92, 0.18);
  color: #ff5c5c;
}

.analytics-timeline-dot.neutral {
  background: #141c2e;
  color: #8b93a8;
}

.analytics-timeline-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 88px;
  padding-right: 2px;
}

.analytics-timeline-list {
  display: grid;
  gap: 0;
}

.analytics-timeline-entry:last-child .analytics-timeline-item {
  border-bottom: none;
}

.analytics-timeline-time {
  font-size: 13px;
  color: rgba(255, 255, 255, 0.45);
  font-variant-numeric: tabular-nums;
}

.analytics-timeline-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 14px;
  flex-shrink: 0;
}

.analytics-timeline-icon.violet {
  background: rgba(170, 77, 255, 0.15);
  color: #bd61ff;
}

.analytics-timeline-icon.green {
  background: rgba(62, 207, 142, 0.15);
  color: #3ecf8e;
}

.analytics-timeline-icon.warn {
  background: rgba(240, 160, 64, 0.15);
  color: #f0a040;
}

.analytics-timeline-icon.error {
  background: rgba(255, 92, 92, 0.15);
  color: #ff5c5c;
}

.analytics-timeline-icon.neutral {
  background: #141c2e;
  color: #8b93a8;
}

.analytics-timeline-main {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.analytics-timeline-main b {
  font-size: 14px;
  font-weight: 600;
}

.analytics-timeline-status {
  font-size: 12px;
  color: #8b93a8;
  white-space: nowrap;
}

.analytics-health-caption {
  margin: 0;
  text-align: center;
  font-size: 15px;
  font-weight: 600;
  color: #e2e8f0;
  line-height: 1.4;
}

.analytics-health-caption.hidden {
  display: none;
}

.analytics-health-summary {
  display: grid;
  gap: 6px;
  text-align: center;
}

.analytics-health-summary.hidden {
  display: none;
}

.analytics-health-coverage {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: #94a3b8;
}

.analytics-health-coverage.hidden {
  display: none;
}

.analytics-seo-metric.is-scope {
  border-bottom: 1px solid #242d48;
  padding-bottom: 12px;
  margin-bottom: 2px;
}

.analytics-seo-metric.is-scope span {
  font-size: 12px;
  color: #8b93a8;
  font-style: normal;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.analytics-impact-scope {
  margin: 4px 0 0;
  font-size: 12px;
}

.analytics-impact-grid.is-compact {
  grid-template-columns: repeat(auto-fill, minmax(200px, 260px));
  justify-content: flex-start;
  max-width: 560px;
}

.analytics-impact-panel .panel-title {
  margin-bottom: var(--analytics-space-xs);
}

.analytics-product-link {
  display: grid;
  gap: 2px;
  text-decoration: none;
  color: inherit;
  min-width: 0;
  cursor: pointer;
}

.analytics-product-link:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 2px;
  border-radius: 6px;
}

.analytics-product-name {
  color: #dce1ef;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: color 160ms ease;
}

.analytics-product-link:hover .analytics-product-name {
  color: #bd61ff;
}

.analytics-product-id {
  font-size: 11px;
  color: #6b7388;
}

.analytics-store-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  background: rgba(170, 77, 255, 0.1);
  color: #bd61ff;
  border: 1px solid rgba(170, 77, 255, 0.2);
}

.analytics-badge.violet {
  background: rgba(170, 77, 255, 0.12);
  color: #bd61ff;
  border-color: rgba(170, 77, 255, 0.15);
}

.analytics-badge.error {
  background: rgba(255, 92, 92, 0.12);
  color: #ff5c5c;
  border-color: rgba(255, 92, 92, 0.15);
}

.analytics-badge.warn {
  background: rgba(240, 160, 64, 0.12);
  color: #f0a040;
  border-color: rgba(240, 160, 64, 0.15);
}

.analytics-badge.neutral {
  background: rgba(139, 147, 168, 0.12);
  color: #aeb6ca;
  border-color: rgba(139, 147, 168, 0.15);
}

.analytics-empty {
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 8px;
  padding: 28px 16px;
  min-height: 180px;
  align-content: center;
}

.analytics-empty-icon {
  color: #bd61ff;
  opacity: 0.7;
  margin-bottom: 4px;
}

.analytics-empty b {
  font-size: 15px;
}

.analytics-empty span {
  font-size: 13px;
  color: #8b93a8;
  max-width: 320px;
  line-height: 1.45;
}

.analytics-empty-cta {
  margin-top: var(--analytics-space-sm);
  cursor: pointer;
}

.analytics-mobile-title {
  cursor: pointer;
}

.analytics-seo-body {
  display: grid;
  gap: 24px;
  padding: 0 var(--analytics-space-xl) var(--analytics-space-xl);
  position: relative;
  justify-items: center;
}

.analytics-page.is-loading .analytics-seo-body,
.analytics-page:not(.is-ready) .analytics-seo-body {
  min-height: 420px;
}

.analytics-donut-wrap {
  position: relative;
  width: 196px;
  height: 196px;
  margin: 0 auto;
}

.analytics-donut-wrap.has-value {
  cursor: pointer;
}

.analytics-donut-tooltip {
  position: absolute;
  z-index: 5;
  pointer-events: none;
  transform: translate(-50%, calc(-100% - 10px));
  min-width: 148px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(140, 90, 255, 0.22);
  background: rgba(11, 18, 32, 0.96);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
  display: grid;
  gap: 2px;
  text-align: center;
  white-space: nowrap;
}

.analytics-donut-tooltip[hidden] {
  display: none;
}

.analytics-donut-tooltip-title {
  font-size: 12px;
  color: #dce1ef;
}

.analytics-donut-tooltip strong {
  font-size: 14px;
  font-weight: 600;
  color: #f7f8ff;
}

.analytics-donut-tooltip em {
  font-style: normal;
  font-size: 12px;
  color: #8b93a8;
}

.analytics-donut {
  position: relative;
  width: 196px;
  height: 196px;
  margin: 0 auto;
  border-radius: 50%;
  outline: none;
  transition: filter 220ms ease, transform 220ms ease;
}

.analytics-donut-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.analytics-donut-track {
  stroke: #1a2238;
  stroke-width: 19;
}

.analytics-donut-progress {
  stroke-width: 19;
  filter: url(#analyticsDonutGlow);
  transition: stroke-dashoffset 900ms ease-out;
}

.analytics-donut.is-drawn .analytics-donut-progress {
  transition: stroke-dashoffset 900ms ease-out;
}

.analytics-page.is-loading .analytics-donut:not(.has-value) .analytics-donut-svg,
.analytics-page:not(.is-ready) .analytics-donut:not(.has-value) .analytics-donut-svg {
  opacity: 0.35;
}

.analytics-page.is-loading .analytics-donut:not(.has-value) .analytics-donut-track,
.analytics-page:not(.is-ready) .analytics-donut:not(.has-value) .analytics-donut-track {
  stroke: #141c2e;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-donut-center {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 28px;
  text-align: center;
  pointer-events: none;
}

.analytics-donut-value {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 2px;
  max-width: 100%;
}

.analytics-donut-number {
  font-size: 40px;
  font-weight: 800;
  line-height: 1;
  color: #f8fafc;
  font-variant-numeric: tabular-nums;
  transition: color 180ms ease, opacity 220ms ease;
}

.analytics-donut-suffix {
  font-size: 40px;
  font-weight: 800;
  line-height: 1;
  color: #f8fafc;
}

.analytics-donut-label {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #94a3b8;
  max-width: 9.5em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.analytics-donut:not(.is-drawn) .analytics-donut-number:not(.skeleton-text),
.analytics-donut:not(.is-drawn) .analytics-donut-suffix {
  opacity: 0.92;
}

.analytics-seo-metrics-card {
  width: 100%;
  border: 1px solid #242d48;
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(11, 18, 32, 0.92) 0%, rgba(16, 24, 40, 0.88) 100%);
  padding: 16px 18px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.analytics-seo-metrics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0;
}

.analytics-seo-metric {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--analytics-space-sm);
  padding: 12px 4px;
  margin: 0;
  border-bottom: 1px solid #1a2238;
  border-radius: 8px;
  font-size: 13px;
  transition: background 160ms ease;
}

.analytics-seo-metric:last-child {
  border-bottom: none;
}

.analytics-seo-metric span {
  color: #aeb6ca;
}

.analytics-seo-metric b {
  font-variant-numeric: tabular-nums;
}

.analytics-seo-metric.tone-green b {
  color: #3ecf8e;
}

.analytics-seo-metric.tone-red b {
  color: #ff5c5c;
}

.analytics-seo-metric.tone-warn b {
  color: #f0a040;
}

.analytics-impact-panel {
  margin-bottom: 18px;
}

.analytics-impact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--analytics-space-md);
  padding: 0 var(--analytics-space-xl) var(--analytics-space-xl);
  transition: opacity 200ms ease;
}

.analytics-impact-card {
  border: 1px solid #242d48;
  border-radius: 14px;
  background: linear-gradient(160deg, #0b1220 0%, #101828 100%);
  padding: var(--analytics-space-md);
  display: grid;
  gap: 4px;
  min-height: 120px;
  --impact-accent: rgba(139, 92, 246, 0.35);
  transition:
    border-color 200ms ease,
    background-color 200ms ease,
    box-shadow 200ms ease,
    transform 200ms ease;
}

.analytics-impact-card.tone-green { --impact-accent: rgba(62, 207, 142, 0.4); }
.analytics-impact-card.tone-violet { --impact-accent: rgba(139, 92, 246, 0.4); }
.analytics-impact-card.tone-red { --impact-accent: rgba(255, 92, 92, 0.4); }
.analytics-impact-card.tone-warn { --impact-accent: rgba(240, 160, 64, 0.4); }
.analytics-impact-card.tone-neutral { --impact-accent: rgba(139, 147, 168, 0.35); }

.analytics-impact-card strong {
  transition: color 180ms ease;
}

.analytics-impact-card em {
  font-style: normal;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  font-size: 14px;
  margin-bottom: 4px;
  transition: box-shadow 180ms ease, background 180ms ease;
}

.analytics-impact-card.tone-green em {
  background: rgba(62, 207, 142, 0.15);
  color: #3ecf8e;
}

.analytics-impact-card.tone-violet em {
  background: rgba(170, 77, 255, 0.15);
  color: #bd61ff;
}

.analytics-impact-card.tone-red em {
  background: rgba(255, 92, 92, 0.15);
  color: #ff5c5c;
}

.analytics-impact-card.tone-warn em {
  background: rgba(240, 160, 64, 0.15);
  color: #f0a040;
}

.analytics-impact-card.tone-neutral em {
  background: #141c2e;
  color: #aeb6ca;
}

.analytics-impact-card strong {
  font-size: 26px;
  line-height: 1.1;
}

.analytics-impact-label {
  font-size: 13px;
  font-weight: 600;
}

.analytics-impact-card small {
  font-size: 12px;
  color: #8b93a8;
  line-height: 1.35;
}

.analytics-impact-empty {
  padding: var(--analytics-space-md) var(--analytics-space-xl) var(--analytics-space-xl);
  margin: 0;
}

.analytics-tables-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin-bottom: 24px;
}

.analytics-table-wrap {
  overflow-x: auto;
  padding-bottom: var(--analytics-space-xl);
  transition: opacity 200ms ease;
}

.analytics-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.analytics-table th {
  text-align: left;
  padding: 13px var(--analytics-space-md);
  color: #8b93a8;
  font-weight: 500;
  border-bottom: 1px solid #1e2638;
  white-space: nowrap;
}

.analytics-table td {
  padding: 15px var(--analytics-space-md);
  border-bottom: 1px solid #141c2e;
  vertical-align: middle;
}

.analytics-table th:first-child,
.analytics-table td:first-child {
  padding-left: var(--analytics-space-xl);
}

.analytics-table th:last-child,
.analytics-table td:last-child {
  padding-right: var(--analytics-space-xl);
}

.analytics-table tr:last-child td {
  border-bottom: none;
}

.analytics-col-product a {
  color: #dce1ef;
  text-decoration: none;
  display: block;
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  cursor: pointer;
  transition: color 160ms ease;
}

.analytics-col-product a:hover {
  color: rgba(255, 255, 255, 0.96);
}

.analytics-col-product a:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 2px;
  border-radius: 4px;
}

.analytics-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  border: 1px solid transparent;
  transition:
    background 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    filter 160ms ease;
}

.analytics-badge.pass {
  background: rgba(62, 207, 142, 0.12);
  color: #3ecf8e;
  border-color: rgba(62, 207, 142, 0.15);
}

.analytics-badge.published {
  background: rgba(170, 77, 255, 0.12);
  color: #bd61ff;
  border-color: rgba(170, 77, 255, 0.15);
}

.analytics-table tbody tr.analytics-table-row {
  transition: background 160ms ease;
}

.analytics-table-empty {
  padding: var(--analytics-space-lg) var(--analytics-space-xl) var(--analytics-space-xl);
  margin: 0;
}

.analytics-mobile-cards {
  display: none;
}

.analytics-error {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 18px 20px;
  margin-bottom: 18px;
  border: 1px solid #4a2030;
  border-radius: 14px;
  background: linear-gradient(135deg, #1a0e18 0%, #120a14 100%);
}

.analytics-error.hidden {
  display: none;
}

.analytics-error-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: rgba(255, 92, 92, 0.15);
  color: #ff5c5c;
  display: grid;
  place-items: center;
  font-weight: 700;
  flex-shrink: 0;
}

.analytics-error b {
  display: block;
  margin-bottom: 4px;
}

.analytics-error p {
  margin: 0 0 12px;
  color: #aeb6ca;
  font-size: 13px;
}

.analytics-skeleton-list,
.analytics-skeleton-table,
.analytics-skeleton-cards,
.analytics-skeleton-filters,
.analytics-skeleton-seo {
  display: none;
}

.analytics-page.is-loading .analytics-skeleton-list,
.analytics-page:not(.is-ready) .analytics-skeleton-list {
  display: grid;
  gap: 10px;
}

.analytics-page.is-loading .analytics-event-filters,
.analytics-page:not(.is-ready) .analytics-event-filters {
  display: none;
}

.analytics-page.is-loading .analytics-skeleton-filters,
.analytics-page:not(.is-ready) .analytics-skeleton-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--analytics-space-xs);
}

.analytics-skeleton-pill {
  width: 88px;
  height: 30px;
  border-radius: 999px;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-skeleton-pill:nth-child(2) { width: 104px; }
.analytics-skeleton-pill:nth-child(3) { width: 96px; }
.analytics-skeleton-pill:nth-child(4) { width: 92px; }

.analytics-page.is-loading .analytics-skeleton-seo,
.analytics-page:not(.is-ready) .analytics-skeleton-seo {
  display: grid;
  gap: var(--analytics-space-md);
  justify-items: center;
  width: 100%;
}

.analytics-skeleton-donut {
  width: 196px;
  height: 196px;
  border-radius: 50%;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-skeleton-line {
  width: min(240px, 100%);
  height: 12px;
  border-radius: 6px;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-skeleton-line.is-short {
  width: min(180px, 80%);
}

.analytics-skeleton-metrics {
  width: 100%;
  display: grid;
  gap: 8px;
}

.analytics-skeleton-metric {
  height: 36px;
  border-radius: 8px;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-page.is-loading .analytics-skeleton-table,
.analytics-page:not(.is-ready) .analytics-skeleton-table {
  display: block;
  height: 220px;
  margin: 0 var(--analytics-space-xl) var(--analytics-space-xl);
  border-radius: 12px;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-page.is-loading .analytics-skeleton-cards,
.analytics-page:not(.is-ready) .analytics-skeleton-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--analytics-space-md);
  padding: 0 var(--analytics-space-xl) var(--analytics-space-xl);
}

.analytics-page.is-loading .analytics-skeleton-cards .skeleton-card,
.analytics-page:not(.is-ready) .analytics-skeleton-cards .skeleton-card {
  min-height: 120px;
  border-radius: 14px;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-page.is-loading .analytics-table-wrap > :not(.analytics-skeleton-table),
.analytics-page:not(.is-ready) .analytics-table-wrap > :not(.analytics-skeleton-table) {
  display: none;
}

.analytics-page.is-loading .analytics-impact-grid > :not(.analytics-skeleton-cards),
.analytics-page:not(.is-ready) .analytics-impact-grid > :not(.analytics-skeleton-cards) {
  display: none;
}

.analytics-page.is-loading .analytics-timeline-body > :not(.analytics-skeleton-list),
.analytics-page:not(.is-ready) .analytics-timeline-body > :not(.analytics-skeleton-list) {
  display: none;
}

.analytics-page.is-ready .analytics-skeleton-list,
.analytics-page.is-ready .analytics-skeleton-table,
.analytics-page.is-ready .analytics-skeleton-cards,
.analytics-page.is-ready .analytics-skeleton-filters,
.analytics-page.is-ready .analytics-skeleton-seo {
  display: none !important;
}

.analytics-page.skeleton-exit .analytics-skeleton-list,
.analytics-page.skeleton-exit .analytics-skeleton-table,
.analytics-page.skeleton-exit .analytics-skeleton-cards,
.analytics-page.skeleton-exit .analytics-skeleton-filters,
.analytics-page.skeleton-exit .analytics-skeleton-seo,
.analytics-page.skeleton-exit .analytics-kpi-value.skeleton-text,
.analytics-page.skeleton-exit .analytics-donut-number.skeleton-text {
  opacity: 0;
  transition: opacity 180ms ease;
  pointer-events: none;
}

.analytics-skeleton-row {
  height: 56px;
  border-radius: 10px;
  background: linear-gradient(90deg, #141c2e 25%, #1e2638 50%, #141c2e 75%);
  background-size: 200% 100%;
  animation: analytics-shimmer 1.2s ease infinite;
}

.analytics-page.anim-enter .analytics-reveal {
  opacity: 0;
  animation: analytics-reveal-in 240ms ease-out both;
  animation-delay: calc(var(--reveal-i, 0) * 40ms);
}

.analytics-page.anim-enter .analytics-kpi:nth-child(1) .analytics-kpi-value:not(.is-muted) {
  --kpi-i: 0;
}

.analytics-page.anim-enter .analytics-kpi:nth-child(2) .analytics-kpi-value:not(.is-muted) {
  --kpi-i: 1;
}

.analytics-page.anim-enter .analytics-kpi:nth-child(3) .analytics-kpi-value:not(.is-muted) {
  --kpi-i: 2;
}

.analytics-page.anim-enter .analytics-kpi:nth-child(4) .analytics-kpi-value:not(.is-muted) {
  --kpi-i: 3;
}

.analytics-page.anim-enter .analytics-kpi-value:not(.is-muted) {
  animation: analytics-kpi-value-in 240ms ease-out both;
  animation-delay: calc(var(--reveal-i, 0) * 40ms + 60ms + var(--kpi-i, 0) * 30ms);
}

.analytics-page.anim-enter .analytics-timeline-entry {
  opacity: 0;
  animation: analytics-timeline-enter 240ms ease-out both;
  animation-delay: calc(var(--reveal-i, 1) * 40ms + 240ms + var(--anim-i, 0) * 20ms);
}

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

@keyframes analytics-kpi-value-in {
  from {
    opacity: 0;
    transform: scale(0.98);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes analytics-timeline-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.analytics-page.anim-fade .analytics-kpis,
.analytics-page.anim-fade .analytics-grid,
.analytics-page.anim-fade .analytics-impact-panel,
.analytics-page.anim-fade .analytics-tables-grid {
  animation: analytics-content-fade 220ms ease both;
}

@keyframes analytics-fade-up {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes analytics-content-fade {
  from { opacity: 0.55; }
  to { opacity: 1; }
}

/* Analytics panels — shared card hover */
.analytics-page .analytics-timeline-panel.panel,
.analytics-page .analytics-seo-panel.panel,
.analytics-page .analytics-impact-panel.panel,
.analytics-page .analytics-table-panel.panel {
  transition:
    border-color 180ms ease,
    background-color 180ms ease,
    box-shadow 180ms ease,
    transform 180ms ease;
}

@media (hover: hover) {
  .analytics-kpi:hover {
    border-color: rgba(140, 90, 255, 0.25);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    transform: translateY(-2px);
  }

  .analytics-kpi:hover em {
    filter: brightness(1.15);
  }

  .analytics-kpi:hover .analytics-kpi-value:not(.is-muted) {
    color: #f7f8ff;
  }

  .analytics-page .analytics-timeline-panel.panel:hover,
  .analytics-page .analytics-seo-panel.panel:hover,
  .analytics-page .analytics-impact-panel.panel:hover,
  .analytics-page .analytics-table-panel.panel:hover {
    border-color: rgba(139, 92, 246, 0.22);
    box-shadow:
      0 10px 30px rgba(0, 0, 0, 0.18),
      inset 0 1px 0 rgba(255, 255, 255, 0.025);
    transform: translateY(-1px);
  }

  .analytics-timeline-item:hover {
    background: rgba(255, 255, 255, 0.025);
    border-color: rgba(120, 80, 255, 0.25);
  }

  .analytics-timeline-item:hover .analytics-timeline-dot {
    transform: scale(1.06);
    box-shadow: 0 0 18px var(--timeline-glow);
  }

  .analytics-timeline-item:hover .analytics-timeline-main b {
    color: #f7f8ff;
  }

  .analytics-timeline-item:hover .analytics-timeline-product {
    color: rgba(255, 255, 255, 0.96);
  }

  .analytics-timeline-item:hover .analytics-timeline-meta .analytics-badge {
    filter: saturate(1.28) brightness(1.08);
    border-color: color-mix(in srgb, var(--timeline-accent) 65%, transparent);
    background: color-mix(in srgb, var(--timeline-accent) 18%, transparent);
    box-shadow: 0 0 14px color-mix(in srgb, var(--timeline-glow) 60%, transparent);
  }

  .analytics-event-filter:hover {
    border-color: rgba(139, 92, 246, 0.28);
    background: rgba(255, 255, 255, 0.04);
    color: #f7f8ff;
  }

  .analytics-seo-panel:hover .analytics-donut.has-value {
    filter: drop-shadow(0 0 16px rgba(139, 92, 246, 0.18)) drop-shadow(0 0 12px rgba(52, 211, 153, 0.12));
    transform: translateY(-2px);
  }

  .analytics-seo-panel:hover .analytics-donut.has-value .analytics-donut-number,
  .analytics-seo-panel:hover .analytics-donut.has-value .analytics-donut-suffix {
    color: #f7f8ff;
  }

  .analytics-seo-metric:not(.is-scope):hover {
    background: rgba(255, 255, 255, 0.018);
  }

  .analytics-impact-card:hover {
    border-color: var(--impact-accent);
    box-shadow:
      0 12px 32px rgba(0, 0, 0, 0.22),
      0 0 20px color-mix(in srgb, var(--impact-accent) 22%, transparent);
    transform: translateY(-2px);
  }

  .analytics-impact-card:hover em {
    filter: brightness(1.18);
    box-shadow: 0 0 16px color-mix(in srgb, var(--impact-accent) 40%, transparent);
  }

  .analytics-impact-card:hover strong {
    color: #f7f8ff;
  }

  .analytics-table tbody tr.analytics-table-row:hover {
    background: rgba(255, 255, 255, 0.02);
  }

  .analytics-table tbody tr.analytics-table-row:hover .analytics-product-name {
    color: rgba(255, 255, 255, 0.96);
  }

  .analytics-table tbody tr.analytics-table-row:hover .analytics-badge {
    filter: saturate(1.2) brightness(1.06);
    border-color: rgba(255, 255, 255, 0.16);
    box-shadow: 0 0 10px rgba(140, 90, 255, 0.12);
  }

  .analytics-mobile-row:hover {
    border-color: rgba(139, 92, 246, 0.22);
    background: rgba(255, 255, 255, 0.02);
  }

  .analytics-mobile-row:hover .analytics-mobile-title {
    color: rgba(255, 255, 255, 0.96);
  }
}

.analytics-all-events {
  transition:
    border-color 180ms ease,
    background 180ms ease,
    color 180ms ease;
}

.analytics-all-events:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 2px;
}

.analytics-all-events {
  cursor: pointer;
}

@media (hover: hover) {
  .analytics-all-events:hover {
    border-color: rgba(139, 92, 246, 0.28);
    background: rgba(255, 255, 255, 0.04);
  }
}

@media (min-width: 1440px) {
  .analytics-impact-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1100px) {
  .analytics-grid {
    grid-template-columns: 1fr;
  }

  .analytics-tables-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .analytics-page {
    --analytics-space-lg: 16px;
    --analytics-space-xl: 16px;
  }

  .analytics-event-filters-wrap {
    padding-inline: var(--analytics-space-sm);
  }

  .analytics-event-filters {
    flex-wrap: nowrap;
    gap: 6px;
  }

  .analytics-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .analytics-timeline-feed::before {
    left: 76px;
  }

  .analytics-timeline-item {
    grid-template-columns: 48px 28px minmax(0, 1fr);
    grid-template-rows: auto auto;
  }

  .analytics-timeline-meta {
    grid-column: 3;
    justify-self: start;
    min-width: 0;
  }

  .analytics-table {
    display: none;
  }

  .analytics-mobile-cards {
    display: grid;
    gap: var(--analytics-space-sm);
    padding: 0 var(--analytics-space-xl);
  }

  .analytics-mobile-row {
    border: 1px solid #242d48;
    border-radius: 12px;
    padding: var(--analytics-space-md);
    display: grid;
    gap: 6px;
    background: #0b1220;
  }

  .analytics-mobile-title {
    color: #dce1ef;
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .analytics-mobile-title:hover {
    color: #bd61ff;
  }

  .analytics-impact-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 480px) {
  .analytics-kpis {
    grid-template-columns: 1fr !important;
  }

  .analytics-impact-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .analytics-page.is-loading .analytics-kpi-value,
  .analytics-skeleton-row {
    animation: none;
  }

  .analytics-page.anim-enter .analytics-reveal,
  .analytics-page.anim-enter .analytics-kpi-value,
  .analytics-page.anim-enter .analytics-timeline-entry,
  .analytics-page.anim-fade .analytics-kpis,
  .analytics-page.anim-fade .analytics-grid,
  .analytics-page.anim-fade .analytics-impact-panel,
  .analytics-page.anim-fade .analytics-tables-grid,
  .analytics-page.anim-fade .analytics-reveal {
    animation: none;
  }

  .analytics-impact-card.anim-in {
    animation: none;
  }

  .analytics-donut-progress {
    transition: none;
  }

  .analytics-donut {
    transition: none;
    filter: none !important;
    transform: none !important;
  }

  .analytics-kpi,
  .analytics-page .panel,
  .analytics-timeline-item,
  .analytics-timeline-dot,
  .analytics-timeline-main b,
  .analytics-impact-card,
  .analytics-impact-card em,
  .analytics-impact-card strong,
  .analytics-seo-metric,
  .analytics-col-product a,
  .analytics-product-name,
  .analytics-badge,
  .analytics-event-filter,
  .analytics-table tbody tr.analytics-table-row,
  .analytics-all-events {
    transition: none;
  }

  .analytics-kpi:hover,
  .analytics-page .panel:hover,
  .analytics-impact-card:hover,
  .analytics-timeline-item:hover {
    transform: none;
    box-shadow: none;
  }
}

/* Sellora AI autopilot UX */
body.ap-modal-open { overflow: hidden; }
.sellora-modal[hidden] { display: none; }
.sellora-modal {
  position: fixed;
  inset: 0;
  z-index: 220;
  display: grid;
  place-items: center;
  padding: 16px;
}
.sellora-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(3, 6, 14, 0.72);
  backdrop-filter: blur(4px);
}
.sellora-modal-dialog {
  position: relative;
  width: min(560px, 100%);
  max-height: min(90vh, 760px);
  overflow: auto;
  padding: 28px 24px 22px;
  border: 1px solid #2a3348;
  border-radius: 16px;
  background: linear-gradient(165deg, #0a101c 0%, #0d1424 100%);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);
}
.ap-journal-dialog { width: min(720px, 100%); }
.sellora-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border: 1px solid #2a3348;
  border-radius: 8px;
  background: #0b1220;
  color: #aeb6ca;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.sellora-modal-title { margin: 0 0 8px; font-size: 22px; font-weight: 700; }
.sellora-modal-subtitle { margin: 0 0 18px; color: #9ea7bb; font-size: 14px; line-height: 1.45; }
.ap-start-list { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 8px; }
.ap-start-list li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid #243047;
  font-size: 13px;
}
.ap-start-list span { color: #94a3b8; }
.ap-start-warning {
  margin: 0 0 12px;
  padding: 10px 12px;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 600;
}
.ap-start-warning.is-ai-on {
  background: rgba(245, 158, 11, 0.12);
  border: 1px solid rgba(251, 191, 36, 0.35);
  color: #fcd34d;
}
.ap-start-warning.is-ai-off {
  background: rgba(16, 185, 129, 0.12);
  border: 1px solid rgba(52, 211, 153, 0.35);
  color: #6ee7b7;
}
.ap-start-error {
  margin: 0 0 12px;
  color: #fca5a5;
  font-size: 13px;
  font-weight: 600;
}
.ap-start-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.ap-settings-panel {
  margin-top: 12px;
  padding: 14px;
  border-radius: 14px;
  border: 1px solid #2a3350;
  background: rgba(8, 12, 24, 0.72);
}
.ap-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.ap-field-row,
.ap-toggle-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: #94a3b8;
}
.ap-field-row input[type="number"] {
  min-height: 40px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid #2a3350;
  background: #0b1220;
  color: #e2e8f0;
  font-size: 14px;
}
.ap-toggle-row {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
.ap-toggle-input { position: absolute; opacity: 0; pointer-events: none; }
.ap-toggle-ui {
  width: 44px;
  height: 24px;
  border-radius: 999px;
  background: #334155;
  position: relative;
  flex-shrink: 0;
}
.ap-toggle-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  transition: transform 0.2s ease;
}
.ap-toggle-input:checked + .ap-toggle-ui {
  background: linear-gradient(135deg, #6d28d9, #a855f7);
}
.ap-toggle-input:checked + .ap-toggle-ui::after { transform: translateX(20px); }
.ap-limits-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}
.ap-limits-chips.hidden { display: none; }
.ap-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #334155;
  background: rgba(15, 23, 42, 0.8);
  font-size: 12px;
  color: #cbd5e1;
}
.ap-today-section {
  margin: 18px 0;
  padding: 18px;
  border-radius: 16px;
  border: 1px solid #2a3350;
  background: rgba(8, 12, 24, 0.55);
}
.ap-today-section.hidden { display: none; }
.ap-today-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: baseline;
  margin-bottom: 14px;
}
.ap-today-head h2 { margin: 0; font-size: 18px; }
.ap-today-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.ap-today-card {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid #243047;
  background: rgba(15, 23, 42, 0.65);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ap-today-card span { font-size: 12px; color: #94a3b8; }
.ap-today-card strong { font-size: 18px; color: #f8fafc; }
.ap-sellora-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ap-sellora-panel.hidden { display: none; }
.ap-sellora-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ap-sellora-actions .primary,
.ap-sellora-actions .ghost,
.ap-sellora-actions .btn-stop {
  min-height: 44px;
}
.ap-active-dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 16px;
  margin: 0;
}
.ap-active-dl div {
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.65);
  border: 1px solid #243047;
}
.ap-active-dl dt { font-size: 11px; color: #94a3b8; margin: 0 0 4px; }
.ap-active-dl dd { margin: 0; font-size: 14px; color: #e2e8f0; font-weight: 600; }
.ap-journal-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.ap-journal-filter {
  min-height: 36px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid #334155;
  background: #0b1220;
  color: #cbd5e1;
  cursor: pointer;
  font-size: 13px;
}
.ap-journal-filter.active {
  border-color: #a855f7;
  background: rgba(109, 40, 217, 0.22);
  color: #f3e8ff;
}
.ap-journal-count {
  margin-left: 4px;
  font-size: 12px;
  opacity: 0.85;
  font-variant-numeric: tabular-nums;
}
.ap-journal-poll-status {
  margin: 0 0 8px;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(251, 191, 36, 0.12);
  color: #fcd34d;
  font-size: 12px;
}
.ap-journal-new-events {
  display: block;
  width: 100%;
  margin: 0 0 10px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid #7c3aed;
  background: rgba(109, 40, 217, 0.18);
  color: #ede9fe;
  font-size: 13px;
  cursor: pointer;
}
.ap-journal-list { display: grid; gap: 10px; max-height: 52vh; overflow: auto; }
.ap-journal-item {
  padding: 12px;
  border-radius: 12px;
  border: 1px solid #243047;
  background: rgba(15, 23, 42, 0.65);
}
.ap-journal-item header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
  font-size: 12px;
  color: #94a3b8;
}
.ap-journal-op {
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(109, 40, 217, 0.18);
  color: #ddd6fe;
}
.ap-journal-product { margin: 0 0 4px; font-weight: 600; color: #e2e8f0; }
.ap-journal-result { margin: 0; font-size: 13px; color: #cbd5e1; }
.ap-journal-error { margin: 6px 0 0; font-size: 12px; color: #fca5a5; }
.ap-journal-empty {
  padding: 24px 12px;
  text-align: center;
  color: #94a3b8;
  font-size: 14px;
}
@media (max-width: 1024px) {
  .ap-today-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ap-settings-grid { grid-template-columns: 1fr; }
  .ap-engine-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .ap-today-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ap-engine-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 390px) {
  .sellora-modal { padding: 10px; }
  .sellora-modal-dialog { padding: 22px 16px 18px; }
  .ap-today-grid-primary,
  .ap-today-grid-seo { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ap-field-row input[type="number"] { width: 100%; min-width: 0; }
}

/* History events page */
.history-page {
  display: grid;
  gap: 18px;
  max-width: 100%;
  overflow-x: hidden;
}
.history-page.is-loading .history-list,
.history-page.is-loading .history-pagination {
  opacity: 0.35;
  pointer-events: none;
}
.history-page-top {
  align-items: flex-start;
  gap: 16px;
}
.history-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}
.history-back-link {
  text-decoration: none;
  white-space: nowrap;
}
.history-stats {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.history-stat {
  min-height: 96px;
}
.history-stat em.red { color: #ff5c5c; }
.history-panel {
  padding: 0;
  overflow: hidden;
}
.history-toolbar {
  display: grid;
  gap: 14px;
  padding: 18px 20px;
  border-bottom: 1px solid #273049;
  background: rgba(9, 16, 28, 0.65);
}
.history-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.history-filter {
  border: 1px solid #313a54;
  background: #0b1220;
  color: #dce1ef;
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 13px;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease;
}
.history-filter:hover {
  border-color: #4a5575;
  color: #fff;
}
.history-filter.is-active {
  border-color: rgba(189, 97, 255, 0.55);
  background: rgba(120, 80, 255, 0.12);
  color: #e9d5ff;
}
.history-filter:focus-visible {
  outline: 2px solid rgba(189, 97, 255, 0.75);
  outline-offset: 2px;
}
.history-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.history-search {
  flex: 1 1 220px;
  min-width: 0;
}
.history-search input {
  width: 100%;
  border: 1px solid #313a54;
  background: #0b1220;
  color: #f7f8ff;
  border-radius: 10px;
  padding: 11px 14px;
  font: inherit;
}
.history-search input:focus-visible {
  outline: 2px solid rgba(189, 97, 255, 0.75);
  outline-offset: 1px;
  border-color: rgba(189, 97, 255, 0.45);
}
.history-period {
  flex: 0 0 auto;
  min-width: 140px;
}
.history-list-wrap {
  padding: 8px 12px 16px;
}
.history-skeleton {
  display: grid;
  gap: 10px;
  padding: 8px;
}
.history-skeleton-row {
  height: 88px;
  border-radius: 12px;
  background: linear-gradient(90deg, #111827 0%, #1a2236 50%, #111827 100%);
  background-size: 200% 100%;
  animation: history-shimmer 1.2s ease-in-out infinite;
}
.history-skeleton.hidden { display: none; }
@keyframes history-shimmer {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}
.history-list {
  display: grid;
  gap: 18px;
}
.history-day-group {
  display: grid;
  gap: 8px;
}
.history-day-label {
  margin: 8px 8px 4px;
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8b93a8;
  font-weight: 600;
}
.history-day-list {
  display: grid;
  gap: 8px;
}
.history-card {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid #273049;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(11, 18, 32, 0.95), rgba(9, 16, 28, 0.88));
  min-width: 0;
}
.history-card-left {
  display: flex;
  align-items: stretch;
  gap: 10px;
}
.history-card-bar {
  width: 3px;
  border-radius: 999px;
  align-self: stretch;
  min-height: 44px;
  background: rgba(139, 147, 168, 0.45);
}
.history-card-bar.tone-success { background: rgba(62, 207, 142, 0.65); }
.history-card-bar.tone-error { background: rgba(255, 92, 92, 0.65); }
.history-card-bar.tone-processing,
.history-card-bar.tone-ai { background: rgba(139, 92, 246, 0.65); }
.history-card-bar.tone-queue { background: rgba(240, 160, 64, 0.65); }
.history-card-bar.tone-publish { background: rgba(96, 165, 250, 0.65); }
.history-card-bar.tone-check { background: rgba(45, 212, 191, 0.65); }
.history-card-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 14px;
  border: 1px solid #2a3348;
  flex-shrink: 0;
}
.history-card-icon.tone-success { background: rgba(62, 207, 142, 0.12); color: #3ecf8e; }
.history-card-icon.tone-error { background: rgba(255, 92, 92, 0.12); color: #ff5c5c; }
.history-card-icon.tone-processing,
.history-card-icon.tone-ai { background: rgba(139, 92, 246, 0.12); color: #bd61ff; }
.history-card-icon.tone-queue { background: rgba(240, 160, 64, 0.12); color: #f0a040; }
.history-card-icon.tone-publish { background: rgba(96, 165, 250, 0.12); color: #60a5fa; }
.history-card-icon.tone-check { background: rgba(45, 212, 191, 0.12); color: #2dd4bf; }
.history-card-icon.tone-neutral { background: #141c2e; color: #8b93a8; }
.history-card-body {
  min-width: 0;
  display: grid;
  gap: 4px;
}
.history-card-title {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.history-card-meta {
  margin: 0;
  font-size: 13px;
  color: #8b93a8;
  overflow-wrap: anywhere;
}
.history-card-desc {
  margin: 0;
  font-size: 14px;
  color: #c4cad9;
}
.history-card-time {
  font-size: 13px;
  color: #7f8da8;
  font-variant-numeric: tabular-nums;
}
.history-card-error {
  margin: 4px 0 0;
  font-size: 13px;
  color: #ff8a8a;
  display: none;
  overflow-wrap: anywhere;
}
.history-card.has-error .history-card-error {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.history-card.has-error.is-expanded .history-card-error {
  display: block;
  -webkit-line-clamp: unset;
}
.history-card-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  flex-shrink: 0;
}
.history-badge {
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid transparent;
  white-space: nowrap;
}
.history-badge.tone-success {
  color: #3ecf8e;
  background: rgba(62, 207, 142, 0.1);
  border-color: rgba(62, 207, 142, 0.28);
}
.history-badge.tone-error {
  color: #ff5c5c;
  background: rgba(255, 92, 92, 0.1);
  border-color: rgba(255, 92, 92, 0.28);
}
.history-badge.tone-processing,
.history-badge.tone-ai {
  color: #bd61ff;
  background: rgba(139, 92, 246, 0.1);
  border-color: rgba(139, 92, 246, 0.28);
}
.history-badge.tone-queue {
  color: #f0a040;
  background: rgba(240, 160, 64, 0.1);
  border-color: rgba(240, 160, 64, 0.28);
}
.history-badge.tone-publish {
  color: #60a5fa;
  background: rgba(96, 165, 250, 0.1);
  border-color: rgba(96, 165, 250, 0.28);
}
.history-badge.tone-check {
  color: #2dd4bf;
  background: rgba(45, 212, 191, 0.1);
  border-color: rgba(45, 212, 191, 0.28);
}
.history-badge.tone-neutral {
  color: #aeb6ca;
  background: rgba(139, 147, 168, 0.1);
  border-color: rgba(139, 147, 168, 0.24);
}
.history-open-link,
.history-error-toggle {
  border: 1px solid #313a54;
  background: #0b1220;
  color: #fff;
  border-radius: 9px;
  padding: 8px 12px;
  font-size: 13px;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
}
.history-open-link:focus-visible,
.history-error-toggle:focus-visible,
.history-back-link:focus-visible,
#historyRefresh:focus-visible {
  outline: 2px solid rgba(189, 97, 255, 0.75);
  outline-offset: 2px;
}
.history-pagination {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 12px 16px;
  padding: 14px 20px 18px;
  border-top: 1px solid #273049;
}
.history-pagination-meta {
  grid-area: 1 / 1;
  justify-self: start;
  z-index: 1;
  font-size: 13px;
  color: #8b93a8;
  min-width: 0;
}
.history-pagination-nav {
  grid-area: 1 / 1;
  justify-self: center;
  z-index: 0;
  display: flex;
  min-width: 0;
}
.history-pagination-nav.is-single-page {
  display: none;
}
.history-pagination-desktop {
  display: flex;
  align-items: center;
  gap: 6px;
}
.history-pagination-mobile {
  display: none;
  align-items: center;
  gap: 10px;
}
.history-page-arrow {
  border: 1px solid #313a54;
  background: #0b1220;
  color: #dce1ef;
  border-radius: 9px;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.history-page-arrow:hover:not(:disabled) {
  border-color: #4a5575;
  color: #fff;
}
.history-page-arrow:disabled {
  opacity: 0.38;
  cursor: not-allowed;
}
.history-page-arrow:focus-visible {
  outline: 2px solid rgba(189, 97, 255, 0.75);
  outline-offset: 2px;
}
.history-page-numbers {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: center;
}
.history-page-num {
  border: 1px solid #313a54;
  background: #0b1220;
  color: #dce1ef;
  border-radius: 9px;
  min-width: 36px;
  height: 36px;
  padding: 0 8px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}
.history-page-num:hover:not(.is-active) {
  border-color: #4a5575;
  color: #fff;
}
.history-page-num.is-active {
  border-color: rgba(189, 97, 255, 0.55);
  background: rgba(120, 80, 255, 0.18);
  color: #e9d5ff;
  cursor: default;
}
.history-page-num:focus-visible {
  outline: 2px solid rgba(189, 97, 255, 0.75);
  outline-offset: 2px;
}
.history-page-ellipsis {
  color: #8b93a8;
  padding: 0 4px;
  user-select: none;
  font-size: 14px;
  line-height: 36px;
}
.history-pagination-mobile-meta {
  font-size: 13px;
  color: #c4cad9;
  font-variant-numeric: tabular-nums;
  min-width: 3.5em;
  text-align: center;
}
.history-empty {
  display: grid;
  justify-items: center;
  gap: 10px;
  padding: 48px 24px;
  text-align: center;
  border: 1px dashed #313a54;
  border-radius: 16px;
  background: rgba(9, 16, 28, 0.5);
}
.history-empty.hidden { display: none; }
.history-empty-icon { color: #8b93a8; }
.history-empty p {
  margin: 0;
  color: #8b93a8;
  max-width: 420px;
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
@media (max-width: 1280px) {
  .history-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
  .history-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .history-card { grid-template-columns: auto 1fr; }
  .history-card-actions {
    grid-column: 1 / -1;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    padding-left: 49px;
  }
}
@media (max-width: 768px) {
  .history-page-top {
    flex-direction: column;
    align-items: stretch;
  }
  .history-page-actions {
    justify-content: flex-start;
  }
  .history-stats { grid-template-columns: 1fr 1fr; }
  .history-toolbar-row { flex-direction: column; align-items: stretch; }
  .history-period { width: 100%; }
  .history-pagination {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  .history-pagination-meta {
    grid-area: unset;
    justify-self: unset;
  }
  .history-pagination-nav {
    grid-area: unset;
    justify-self: unset;
    justify-content: center;
  }
  .history-pagination-desktop {
    display: none;
  }
  .history-pagination-mobile {
    display: flex;
    justify-content: center;
    width: 100%;
  }
}
@media (max-width: 390px) {
  .history-page { overflow-x: hidden; }
  .history-stats { grid-template-columns: 1fr; }
  .history-card {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .history-card-actions {
    padding-left: 0;
    flex-direction: column;
    align-items: stretch;
  }
  .history-open-link,
  .history-error-toggle { width: 100%; text-align: center; }
  .history-card-left { align-items: center; }
}
html[data-theme-resolved="light"] .history-toolbar {
  background: rgba(255, 255, 255, 0.72);
  border-bottom-color: #d8dee9;
}
html[data-theme-resolved="light"] .history-card {
  background: #fff;
  border-color: #d8dee9;
}
html[data-theme-resolved="light"] .history-filter,
html[data-theme-resolved="light"] .history-search input,
html[data-theme-resolved="light"] .history-open-link,
html[data-theme-resolved="light"] .history-error-toggle,
html[data-theme-resolved="light"] .history-page-arrow,
html[data-theme-resolved="light"] .history-page-num {
  background: #f8fafc;
  border-color: #d8dee9;
  color: #0f172a;
}
html[data-theme-resolved="light"] .history-page-num.is-active {
  background: rgba(120, 80, 255, 0.12);
  border-color: rgba(139, 92, 246, 0.45);
  color: #6d28d9;
}
html[data-theme-resolved="light"] .history-card-desc { color: #334155; }
html[data-theme-resolved="light"] .history-card-meta,
html[data-theme-resolved="light"] .history-card-time,
html[data-theme-resolved="light"] .history-day-label { color: #64748b; }

/* Dashboard premium UI — scoped to dashboard page only */
[data-sellora-page="dashboard"] {
  --dash-radius: 16px;
  --dash-radius-sm: 12px;
  --dash-gap: 20px;
  --dash-border: 1px solid rgba(148, 163, 184, 0.12);
  --dash-shadow: 0 8px 32px rgba(0, 0, 0, 0.28);
  --dash-shadow-soft: 0 2px 12px rgba(0, 0, 0, 0.18);
  --dash-glow-violet: 0 0 40px rgba(168, 85, 247, 0.22);
  --dash-surface: rgba(9, 16, 28, 0.92);
}
[data-sellora-page="dashboard"] .sellora-page-content {
  display: flex;
  flex-direction: column;
  gap: var(--dash-gap);
}
[data-sellora-page="dashboard"] .page-top { margin-bottom: 4px; }
[data-sellora-page="dashboard"] .page-top h1 { letter-spacing: -0.02em; }
[data-sellora-page="dashboard"] .hero {
  min-height: 248px;
  padding: 54px 58px 54px 56px;
  margin: 0;
  border: var(--dash-border);
  border-radius: var(--dash-radius);
  background:
    radial-gradient(ellipse 52% 88% at 92% 42%, rgba(139, 92, 246, 0.2) 0%, transparent 58%),
    radial-gradient(ellipse 38% 72% at 58% 48%, rgba(124, 58, 237, 0.07) 0%, transparent 62%),
    radial-gradient(ellipse 60% 80% at 0% 100%, rgba(59, 130, 246, 0.06) 0%, transparent 50%),
    linear-gradient(118deg, #060b16 0%, #0c1224 36%, #1a0a32 68%, #12082a 100%);
  box-shadow: var(--dash-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  align-items: center;
  gap: 32px;
  position: relative;
  overflow: hidden;
}
[data-sellora-page="dashboard"] .hero > div:first-child {
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
}
[data-sellora-page="dashboard"] .hero small {
  display: inline-block;
  color: #d8b4fe;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0 0 10px;
}
[data-sellora-page="dashboard"] .hero h2,
[data-sellora-page="dashboard"] .hero .hero-product-title {
  font-size: 42px;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.15;
  margin: 0 0 16px;
  color: #f5f3ff;
}
[data-sellora-page="dashboard"] .hero p {
  color: #d1d9e6;
  font-size: 15px;
  line-height: 1.7;
  max-width: 52ch;
  margin: 0 0 14px;
}
[data-sellora-page="dashboard"] .hero-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  margin: 0 0 18px;
  padding: 7px 14px 7px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
  border: 1px solid rgba(251, 146, 60, 0.28);
  background: rgba(251, 146, 60, 0.1);
  color: #fdba74;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
[data-sellora-page="dashboard"] .hero-status-badge:has(#autoDot.on) {
  border-color: rgba(52, 211, 153, 0.32);
  background: rgba(16, 185, 129, 0.1);
  color: #6ee7b7;
}
[data-sellora-page="dashboard"] .hero-status-badge #autoDot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: 0;
  border-radius: 50%;
  flex-shrink: 0;
  background: #fb923c;
  box-shadow: 0 0 10px rgba(251, 146, 60, 0.5);
}
[data-sellora-page="dashboard"] .hero-status-badge #autoDot.on {
  background: #34d399;
  box-shadow: 0 0 10px rgba(52, 211, 153, 0.55);
}
[data-sellora-page="dashboard"] .hero-status-badge #autoDot.off {
  background: #fb923c;
  box-shadow: 0 0 10px rgba(251, 146, 60, 0.5);
}
[data-sellora-page="dashboard"] .hero-status-prefix {
  color: inherit;
  opacity: 0.92;
}
[data-sellora-page="dashboard"] .hero-status-badge #autoState {
  color: inherit;
  font-weight: 600;
}
[data-sellora-page="dashboard"] .hero-links {
  margin-top: 0;
  gap: 22px;
  align-items: center;
}
[data-sellora-page="dashboard"] .hero-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 24px;
  border-radius: var(--dash-radius-sm);
  font-size: 14px;
  font-weight: 600;
  color: #faf5ff !important;
  text-decoration: none;
  background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 22%, #7c3aed 52%, #6d28d9 78%, #5b21b6 100%);
  border: 1px solid rgba(251, 146, 60, 0.38);
  box-shadow:
    0 4px 22px rgba(124, 58, 237, 0.42),
    0 0 28px rgba(251, 146, 60, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
  transition: transform 0.26s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.26s ease, filter 0.26s ease, border-color 0.26s ease;
}
[data-sellora-page="dashboard"] .hero:has(#autoDot.on) .hero-links a {
  border-color: rgba(52, 211, 153, 0.38);
  box-shadow:
    0 4px 22px rgba(124, 58, 237, 0.42),
    0 0 28px rgba(52, 211, 153, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
[data-sellora-page="dashboard"] .hero-links a:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow:
    0 10px 32px rgba(124, 58, 237, 0.52),
    0 0 48px rgba(167, 139, 250, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  filter: brightness(1.08);
}
[data-sellora-page="dashboard"] .hero-links span {
  font-size: 14px;
  color: #94a3b8;
  line-height: 1.45;
}
[data-sellora-page="dashboard"] .orbit-art {
  width: 390px;
  flex: 0 0 390px;
  min-height: 200px;
  margin-right: 6px;
  position: relative;
  z-index: 1;
}
[data-sellora-page="dashboard"] .orbit {
  border-color: rgba(168, 85, 247, 0.42);
  opacity: 0.88;
  box-shadow: 0 0 24px rgba(124, 58, 237, 0.12);
}
[data-sellora-page="dashboard"] .smark {
  left: 138px;
  top: 44px;
  width: 118px;
  height: 118px;
  transform: none;
  border: 0;
  font-size: 0;
  line-height: 0;
  color: transparent;
  box-shadow: none;
  background: none;
  display: grid;
  place-items: center;
}
[data-sellora-page="dashboard"] .smark img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.autopilot-hero .ai-orb {
  font-size: 0;
  color: transparent;
  display: grid;
  place-items: center;
}
.autopilot-hero .ai-orb img {
  width: 72%;
  height: 72%;
  object-fit: contain;
  display: block;
}
[data-sellora-page="dashboard"] .orbit-art .ok {
  filter: drop-shadow(0 0 10px rgba(52, 211, 153, 0.55));
}
@property --dash-seo-deg {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

[data-sellora-page="dashboard"] .kpis { gap: 18px; margin: 0; }
[data-sellora-page="dashboard"] .kpis article {
  position: relative;
  overflow: hidden;
  min-height: 146px;
  padding: 30px 28px;
  border-radius: var(--dash-radius);
  border: var(--dash-border);
  background: var(--dash-surface);
  box-shadow: var(--dash-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
[data-sellora-page="dashboard"] .kpis article::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  opacity: 0.72;
  pointer-events: none;
}
[data-sellora-page="dashboard"] .kpis article:nth-child(1)::after {
  background: linear-gradient(90deg, rgba(124, 58, 237, 0.55) 0%, rgba(168, 85, 247, 0.85) 100%);
}
[data-sellora-page="dashboard"] .kpis article:nth-child(2)::after {
  background: linear-gradient(90deg, rgba(5, 150, 105, 0.5) 0%, rgba(52, 211, 153, 0.82) 100%);
}
[data-sellora-page="dashboard"] .kpis article:nth-child(3)::after {
  background: linear-gradient(90deg, rgba(234, 88, 12, 0.5) 0%, rgba(251, 146, 60, 0.82) 100%);
}
[data-sellora-page="dashboard"] .kpis article:nth-child(4)::after {
  background: linear-gradient(90deg, rgba(37, 99, 235, 0.5) 0%, rgba(96, 165, 250, 0.82) 100%);
}
[data-sellora-page="dashboard"] .kpis article:nth-child(5)::after {
  background: linear-gradient(90deg, rgba(109, 40, 217, 0.55) 0%, rgba(192, 132, 252, 0.85) 100%);
}
[data-sellora-page="dashboard"] .kpis article:hover {
  transform: translateY(-3px);
  border-color: rgba(167, 139, 250, 0.34);
  box-shadow:
    var(--dash-shadow),
    0 0 28px rgba(168, 85, 247, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
[data-sellora-page="dashboard"] .kpis em {
  width: 58px;
  height: 58px;
  border-radius: var(--dash-radius-sm);
  font-size: 30px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 14px rgba(168, 85, 247, 0.1),
    0 0 10px rgba(148, 163, 184, 0.08);
}
[data-sellora-page="dashboard"] .kpis em.green {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 16px rgba(52, 211, 153, 0.14),
    0 0 12px rgba(52, 211, 153, 0.12);
}
[data-sellora-page="dashboard"] .kpis em.orange {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 16px rgba(251, 146, 60, 0.14),
    0 0 12px rgba(251, 146, 60, 0.12);
}
[data-sellora-page="dashboard"] .kpis em.blue {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 16px rgba(96, 165, 250, 0.14),
    0 0 12px rgba(96, 165, 250, 0.12);
}
[data-sellora-page="dashboard"] .kpis strong {
  font-size: 38px;
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
  color: #f8fafc;
}
[data-sellora-page="dashboard"] .kpis span {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.01em;
  color: #64748b;
  line-height: 1.35;
}
[data-sellora-page="dashboard"] .kpis small {
  font-size: 12px;
  margin-top: 2px;
  color: #78859a;
}
[data-sellora-page="dashboard"] .kpis article.health {
  --dash-seo-deg: 0deg;
  border-color: rgba(168, 85, 247, 0.38);
  background:
    radial-gradient(ellipse 100% 80% at 100% 0%, rgba(168, 85, 247, 0.18) 0%, transparent 60%),
    var(--dash-surface);
  box-shadow:
    var(--dash-shadow-soft),
    0 0 32px rgba(168, 85, 247, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
[data-sellora-page="dashboard"] .kpis article.health:hover {
  border-color: rgba(196, 181, 253, 0.45);
  box-shadow:
    var(--dash-shadow),
    0 0 44px rgba(168, 85, 247, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
[data-sellora-page="dashboard"] .kpis article.health > div:first-child > span:first-of-type {
  color: #94a3b8;
  font-weight: 500;
  font-size: 12px;
  line-height: 1.35;
}
[data-sellora-page="dashboard"] .kpis article.health strong.dash-seo-ring {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: clamp(72px, 5vw, 82px);
  height: clamp(72px, 5vw, 82px);
  margin-top: 6px;
  padding: 0;
  border-radius: 50%;
  font-size: 0;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0;
  color: #fff;
  overflow: visible;
  background: conic-gradient(
    from -90deg,
    #a855f7 0deg,
    #a855f7 var(--dash-seo-deg),
    rgba(148, 163, 184, 0.14) var(--dash-seo-deg),
    rgba(148, 163, 184, 0.14) 360deg
  );
  box-shadow:
    0 0 18px rgba(168, 85, 247, 0.28),
    0 0 32px rgba(168, 85, 247, 0.14);
  transition: --dash-seo-deg 220ms ease, box-shadow 200ms ease;
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-full strong.dash-seo-ring {
  background: conic-gradient(
    from -90deg,
    #9333ea 0deg,
    #a855f7 120deg,
    #c084fc 240deg,
    #a855f7 360deg
  );
  box-shadow:
    0 0 20px rgba(168, 85, 247, 0.38),
    0 0 40px rgba(168, 85, 247, 0.2);
}
[data-sellora-page="dashboard"] .kpis article.health strong.dash-seo-ring::before {
  content: '';
  position: absolute;
  inset: 5px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 38%, rgba(168, 85, 247, 0.14) 0%, transparent 62%),
    var(--dash-surface);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
[data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__value {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: baseline;
  justify-content: center;
  transform: translate(-50%, -50%);
  white-space: nowrap;
  line-height: 1;
  max-width: none;
  pointer-events: none;
}
[data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__num,
[data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__pct {
  display: inline-block;
  flex: 0 0 auto;
  white-space: nowrap;
  line-height: 1;
  letter-spacing: -0.02em;
}
[data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__num {
  font-size: clamp(18px, 2.2vw, 28px);
  font-weight: 800;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
[data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__pct {
  font-size: clamp(11px, 1.2vw, 15px);
  font-weight: 700;
  color: #fff;
  margin-left: 1px;
  align-self: baseline;
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-triple .dash-seo-ring__num {
  font-size: clamp(17px, 2vw, 24px);
  letter-spacing: -0.03em;
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-triple .dash-seo-ring__pct {
  font-size: clamp(10px, 1.1vw, 13px);
  margin-left: 1px;
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-medium .dash-seo-ring__num {
  font-size: clamp(18px, 2.1vw, 26px);
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-medium .dash-seo-ring__pct {
  font-size: clamp(11px, 1.25vw, 14px);
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-wide .dash-seo-ring__num {
  font-size: clamp(15px, 1.8vw, 21px);
}
[data-sellora-page="dashboard"] .kpis article.health.is-seo-wide .dash-seo-ring__pct {
  font-size: clamp(10px, 1.1vw, 12px);
  margin-left: 1px;
}
[data-sellora-page="dashboard"] .kpis article.health:not(.has-seo-value) strong.dash-seo-ring {
  background: conic-gradient(from -90deg, rgba(148, 163, 184, 0.12) 0deg, rgba(148, 163, 184, 0.12) 360deg);
  box-shadow: none;
}
[data-sellora-page="dashboard"] .kpis article.health:not(.has-seo-value) .dash-seo-ring__num {
  color: #64748b;
  font-size: clamp(18px, 2vw, 22px);
  font-weight: 700;
}
[data-sellora-page="dashboard"] .kpis article.health:not(.has-seo-value) .dash-seo-ring__pct {
  color: #64748b;
}
@media (max-width: 960px) {
  [data-sellora-page="dashboard"] .kpis article.health strong.dash-seo-ring {
    width: clamp(62px, 16vw, 70px);
    height: clamp(62px, 16vw, 70px);
  }
  [data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__num {
    font-size: clamp(18px, 4.5vw, 26px);
  }
  [data-sellora-page="dashboard"] .kpis article.health .dash-seo-ring__pct {
    font-size: clamp(11px, 2.8vw, 14px);
  }
}
[data-sellora-page="dashboard"] .kpis article.health .spark {
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  width: 74px;
  height: 74px;
  margin: 0;
  padding: 0;
  font-size: 0;
  line-height: 0;
  color: transparent;
  pointer-events: none;
  opacity: 0;
}
[data-sellora-page="dashboard"] .dashboard-grid { gap: var(--dash-gap); margin: 0; }
[data-sellora-page="dashboard"] .panel {
  border: var(--dash-border); border-radius: var(--dash-radius); background: var(--dash-surface);
  box-shadow: var(--dash-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.03);
}
[data-sellora-page="dashboard"] .panel h3 {
  padding: 22px 24px; font-size: 18px; font-weight: 700; letter-spacing: -0.01em;
  border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}
[data-sellora-page="dashboard"] .panel h3 a { font-size: 13px; font-weight: 500; opacity: 0.85; transition: opacity 0.2s ease; }
[data-sellora-page="dashboard"] .panel h3 a:hover { opacity: 1; }
[data-sellora-page="dashboard"] .panel.actions > a {
  min-height: 76px; margin: 0 16px; padding: 14px 8px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08); border-radius: var(--dash-radius-sm);
  transition: background 0.22s ease, transform 0.22s ease, border-color 0.22s ease;
}
[data-sellora-page="dashboard"] .panel.actions > a:last-child { margin-bottom: 12px; }
[data-sellora-page="dashboard"] .panel.actions > a:hover {
  background: rgba(124, 58, 237, 0.1); transform: translateX(4px);
}
[data-sellora-page="dashboard"] .panel.actions > a b {
  width: 42px; height: 42px; border-radius: 11px; font-size: 18px;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}
[data-sellora-page="dashboard"] .panel.actions > a:hover b {
  transform: scale(1.05); box-shadow: 0 4px 14px rgba(124, 58, 237, 0.25);
}
[data-sellora-page="dashboard"] .panel.actions > a span span:first-child { font-weight: 600; font-size: 14px; }
[data-sellora-page="dashboard"] .panel.actions > a i {
  margin-left: auto; font-size: 20px; font-style: normal; color: #a78bfa;
  opacity: 0; transform: translateX(-6px); transition: opacity 0.25s ease, transform 0.25s ease;
}
[data-sellora-page="dashboard"] .panel.actions > a:hover i { opacity: 1; transform: translateX(0); }
[data-sellora-page="dashboard"] .feed {
  min-height: 76px; margin: 0 16px; padding: 16px 8px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08); gap: 14px; transition: background 0.2s ease;
}
[data-sellora-page="dashboard"] .feed:last-child { margin-bottom: 12px; }
[data-sellora-page="dashboard"] .feed:hover { background: rgba(255, 255, 255, 0.02); }
[data-sellora-page="dashboard"] .feed i { width: 40px; height: 40px; border-radius: 11px; flex-shrink: 0; }
[data-sellora-page="dashboard"] .feed span b { font-size: 14px; font-weight: 600; line-height: 1.35; }
[data-sellora-page="dashboard"] .feed span small { font-size: 13px; line-height: 1.45; color: #94a3b8; }
[data-sellora-page="dashboard"] .feed time { font-size: 12px; color: #64748b; white-space: nowrap; }
[data-sellora-page="dashboard"] .feed.warn i { background: rgba(245, 158, 11, 0.15); color: #fbbf24; }
[data-sellora-page="dashboard"] #eventList,
[data-sellora-page="dashboard"] #noticeList { padding-top: 4px; }
[data-sellora-page="dashboard"] #eventList .muted,
[data-sellora-page="dashboard"] #noticeList .muted { padding: 20px 24px; }
[data-sellora-page="dashboard"] .help-strip {
  margin: 0; min-height: auto; padding: 28px 32px;
  border: 1px solid rgba(167, 139, 250, 0.22); border-radius: var(--dash-radius);
  background:
    radial-gradient(ellipse 70% 100% at 0% 50%, rgba(109, 40, 217, 0.2) 0%, transparent 55%),
    linear-gradient(95deg, rgba(15, 10, 32, 0.95) 0%, rgba(28, 14, 52, 0.92) 50%, rgba(18, 12, 36, 0.95) 100%);
  box-shadow: var(--dash-shadow-soft), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  gap: 22px; align-items: center;
}
[data-sellora-page="dashboard"] .help-strip .chatIcon {
  width: 56px; height: 56px; flex-shrink: 0; border-radius: 14px;
  background: rgba(124, 58, 237, 0.35); border: 1px solid rgba(167, 139, 250, 0.25);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
[data-sellora-page="dashboard"] .help-strip h3 { font-size: 17px; font-weight: 700; margin: 0 0 6px; }
[data-sellora-page="dashboard"] .help-strip p { font-size: 14px; line-height: 1.5; color: #b8c0d4; }
[data-sellora-page="dashboard"] .help-strip a {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 0 18px; margin-left: 0 !important;
  border-radius: var(--dash-radius-sm); border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(8, 12, 24, 0.55); font-size: 13px; font-weight: 600;
  text-decoration: none; white-space: nowrap;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
[data-sellora-page="dashboard"] .help-strip a:hover {
  background: rgba(124, 58, 237, 0.18); border-color: rgba(167, 139, 250, 0.35); transform: translateY(-1px);
}
@media(max-width:1100px){
 [data-sellora-page="dashboard"] .orbit-art{display:none}
}
@media(max-width:760px){
 [data-sellora-page="dashboard"] .hero{padding:22px;min-height:auto}
 [data-sellora-page="dashboard"] .hero h2{font-size:30px}
 [data-sellora-page="dashboard"] .help-strip{flex-wrap:wrap}
}

/* Products — category filter custom dropdown */
.catalog-toolbar.category-dropdown-open {
  position: relative;
  z-index: 40;
}
.catalog-category-dropdown {
  position: relative;
  min-width: 0;
}
.catalog-category-dropdown-native {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0 12px;
  color: transparent;
  background: transparent;
  border: none;
  pointer-events: none;
  z-index: 2;
  cursor: default;
}
.catalog-category-dropdown-btn {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  width: 100%;
  height: 46px;
  padding: 0 12px;
  border: 1px solid #273049;
  border-radius: 10px;
  background: #09101d;
  color: #fff;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.catalog-category-dropdown-btn:hover,
.catalog-category-dropdown.is-open .catalog-category-dropdown-btn {
  border-color: rgba(124, 58, 237, 0.42);
  box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.14), 0 0 16px rgba(124, 58, 237, 0.12);
}
.catalog-category-dropdown-label {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex: 1;
  line-height: 1.25;
  text-align: left;
}
.catalog-category-dropdown-label .cat-btn-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  color: #f7f8ff;
}
.catalog-category-dropdown-label .cat-btn-count {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
  font-variant-numeric: tabular-nums;
}
.catalog-category-dropdown-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  margin: 0;
  padding: 6px;
  list-style: none;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.14);
  background: #0b1220;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  z-index: 200;
  display: grid;
  gap: 2px;
  max-height: min(360px, 52vh);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.catalog-category-dropdown.opens-up .catalog-category-dropdown-menu {
  top: auto;
  bottom: calc(100% + 6px);
}
.catalog-category-dropdown-menu[hidden] {
  display: none !important;
}
.catalog-category-dropdown-menu li {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 12px;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease;
}
.catalog-category-dropdown-menu li:hover {
  background: rgba(124, 58, 237, 0.16);
}
.catalog-category-dropdown-menu li.is-selected {
  background: rgba(124, 58, 237, 0.12);
}
.catalog-category-dropdown-menu li.is-selected .cat-option-name {
  color: #c4b5fd;
  font-weight: 600;
}
.catalog-category-dropdown-menu li.is-selected::after {
  content: '✓';
  flex-shrink: 0;
  margin-left: auto;
  font-size: 12px;
  color: #a855f7;
  opacity: 0.95;
}
.catalog-category-dropdown-menu li[data-value="all"].is-selected::after {
  content: none;
}
.cat-option-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 14px;
  font-weight: 500;
  color: #e2e8f0;
  line-height: 1.3;
}
.cat-option-count {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 500;
  color: #64748b;
  font-variant-numeric: tabular-nums;
}
html[data-theme-resolved="light"] .catalog-category-dropdown-btn {
  background: var(--input-bg, #fff);
  border-color: var(--border-color, #d8dee9);
  color: var(--text-primary, #0f172a);
}
html[data-theme-resolved="light"] .catalog-category-dropdown-native {
  background: transparent;
  border: none;
  color: transparent;
}
html[data-theme-resolved="light"] .catalog-category-dropdown-menu {
  background: var(--bg-card, #fff);
  border-color: var(--border-color, #d8dee9);
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);
}
html[data-theme-resolved="light"] .cat-option-name {
  color: var(--text-primary, #0f172a);
}
html[data-theme-resolved="light"] .cat-option-count,
html[data-theme-resolved="light"] .catalog-category-dropdown-label .cat-btn-count {
  color: #64748b;
}
html[data-theme-resolved="light"] .catalog-category-dropdown-menu li.is-selected .cat-option-name {
  color: #7c3aed;
}

/* --- Optimization / SEO AI UX polish (v1.8.1) --- */
.ap-engine-card {
  padding: 12px 14px 14px;
}
.ap-engine-head {
  gap: 10px;
}
.ap-engine-progress-block {
  margin-top: 8px;
}
.ap-engine-progress-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.ap-engine-progress-main {
  flex: 1 1 auto;
  min-width: 0;
}
.ap-engine-progress-ring-wrap {
  flex: 0 0 auto;
}
.ap-engine-progress-ring {
  --ap-engine-pct: 0;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background:
    radial-gradient(farthest-side, rgba(8, 12, 24, 0.96) 64%, transparent 65%),
    conic-gradient(#a855f7 calc(var(--ap-engine-pct) * 1%), rgba(148, 163, 184, 0.18) 0);
  box-shadow: inset 0 0 0 1px rgba(167, 139, 250, 0.22);
}
.ap-engine-progress-ring-value {
  font-size: 12px;
  font-weight: 700;
  color: #ede9fe;
  font-variant-numeric: tabular-nums;
}
.ap-engine-progress-meta {
  font-size: 14px;
  font-weight: 700;
  color: #e2e8f0;
}
.ap-engine-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 8px;
  font-size: 12px;
  font-weight: 600;
  color: #94a3b8;
}
.ap-engine-metrics span {
  font-variant-numeric: tabular-nums;
}
.ap-engine-body {
  margin-top: 6px;
}
.ap-manual-block {
  margin-top: 4px;
  padding-top: 10px;
}
.ap-engine-kpis {
  gap: 6px;
  margin-top: 8px;
}
.ap-kpi-chip {
  min-height: 56px;
  padding: 8px 10px;
}
.ap-info-panel.tone-violet {
  border-top: 2px solid rgba(167, 139, 250, 0.5);
  box-shadow: inset 0 1px 0 rgba(167, 139, 250, 0.08), 0 0 18px rgba(109, 40, 217, 0.07);
}
.ap-info-panel.tone-teal {
  border-top: 2px solid rgba(52, 211, 153, 0.45);
  box-shadow: inset 0 1px 0 rgba(52, 211, 153, 0.08), 0 0 18px rgba(16, 185, 129, 0.06);
}
.ap-info-panel.tone-blue {
  border-top: 2px solid rgba(59, 130, 246, 0.48);
  box-shadow: inset 0 1px 0 rgba(59, 130, 246, 0.08), 0 0 18px rgba(37, 99, 235, 0.06);
}
.ap-today-section {
  padding: 16px;
}
.ap-today-card {
  position: relative;
  padding: 14px 14px 12px 42px;
  min-height: 72px;
  border-radius: 12px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.ap-today-card:hover {
  border-color: rgba(148, 163, 184, 0.28);
  box-shadow: 0 0 16px rgba(109, 40, 217, 0.08);
  background: rgba(15, 23, 42, 0.78);
}
.ap-today-card-icon {
  position: absolute;
  left: 12px;
  top: 14px;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  background: rgba(148, 163, 184, 0.1);
  color: #cbd5e1;
}
.ap-today-card.tone-teal .ap-today-card-icon { color: #6ee7b7; background: rgba(52, 211, 153, 0.12); }
.ap-today-card.tone-orange .ap-today-card-icon { color: #fcd34d; background: rgba(251, 191, 36, 0.12); }
.ap-today-card.tone-violet .ap-today-card-icon { color: #ddd6fe; background: rgba(167, 139, 250, 0.12); }
.ap-today-card.tone-green .ap-today-card-icon { color: #6ee7b7; background: rgba(74, 222, 128, 0.12); }
.ap-today-card.tone-red .ap-today-card-icon { color: #fca5a5; background: rgba(248, 113, 113, 0.12); }
.ap-today-card span {
  font-size: 11px;
  letter-spacing: 0.02em;
  color: #94a3b8;
}
.ap-today-card strong {
  font-size: 24px;
  line-height: 1.1;
  font-weight: 700;
  color: #f8fafc;
}
html[data-theme-resolved="dark"] .side-nav a,
html[data-theme="dark"] .side-nav a {
  transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
  border: 1px solid transparent;
}
html[data-theme-resolved="dark"] .side-nav a:hover,
html[data-theme="dark"] .side-nav a:hover {
  background: rgba(109, 40, 217, 0.14);
  border-color: rgba(167, 139, 250, 0.18);
}
html[data-theme-resolved="dark"] .side-nav a.active,
html[data-theme="dark"] .side-nav a.active {
  border-color: rgba(168, 85, 247, 0.42);
  box-shadow: inset 0 0 0 1px rgba(168, 85, 247, 0.18), 0 0 18px rgba(109, 40, 217, 0.16);
}
@media (max-width: 768px) {
  .ap-engine-progress-row {
    flex-wrap: wrap;
  }
  .ap-engine-progress-ring {
    width: 48px;
    height: 48px;
  }
  .ap-today-card strong {
    font-size: 20px;
  }
}

/* ============================================================
   Autopilot page — control center (spacing polish)
   ============================================================ */
[data-sellora-page="autopilot"] {
  --ap-space-section: 24px;
  --ap-space-after-hero: 32px;
  --ap-space-title: 22px;
  --ap-card-padding: 24px;
  --ap-prose-width: 700px;
}

[data-sellora-page="autopilot"] .ap-page-content {
  display: flex;
  flex-direction: column;
  gap: var(--ap-space-section);
  padding-bottom: 128px;
}

[data-sellora-page="autopilot"] .ap-page-top {
  margin-bottom: 0;
}

[data-sellora-page="autopilot"] .ap-page-top p {
  max-width: var(--ap-prose-width);
  line-height: 1.7;
}

[data-sellora-page="autopilot"] .panel,
[data-sellora-page="autopilot"] .ap-kpi-card {
  padding: var(--ap-card-padding);
}

[data-sellora-page="autopilot"] .panel .panel-title {
  padding: 0;
  margin: 0 0 var(--ap-space-title);
}

[data-sellora-page="autopilot"] .ap-hero {
  align-items: stretch;
  gap: 24px;
  margin-bottom: calc(var(--ap-space-after-hero) - var(--ap-space-section));
}

[data-sellora-page="autopilot"] .ap-hero__main {
  flex: 1;
  min-width: 0;
}

[data-sellora-page="autopilot"] .ap-hero h2 {
  font-size: clamp(26px, 3vw, 34px);
  margin: 8px 0 12px;
}

[data-sellora-page="autopilot"] .ap-hero p {
  max-width: var(--ap-prose-width);
  line-height: 1.7;
  color: #aeb6ca;
}

[data-sellora-page="autopilot"] .ap-hero.is-running {
  border-color: rgba(52, 211, 153, 0.35);
  box-shadow: 0 0 40px rgba(52, 211, 153, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

[data-sellora-page="autopilot"] .ap-hero.is-paused {
  border-color: rgba(251, 191, 36, 0.35);
}

[data-sellora-page="autopilot"] .ap-hero__status {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin: 20px 0 16px;
  font-size: 13px;
  color: #94a3b8;
}

[data-sellora-page="autopilot"] .ap-status-dot.is-on { color: #34d399; }
[data-sellora-page="autopilot"] .ap-status-dot.is-off { color: #64748b; }
[data-sellora-page="autopilot"] .ap-status-dot.is-paused { color: #fbbf24; }
[data-sellora-page="autopilot"] .ap-status-sep { opacity: 0.45; }

[data-sellora-page="autopilot"] .ap-hero__active {
  margin-bottom: 18px;
  padding: 12px 16px;
  border-radius: 12px;
  background: rgba(124, 58, 237, 0.12);
  border: 1px solid rgba(167, 139, 250, 0.22);
  font-size: 13px;
  color: #c4b5fd;
}

[data-sellora-page="autopilot"] .ap-hero__active strong { color: #ede9fe; }

[data-sellora-page="autopilot"] .ap-active-id {
  margin-left: 6px;
  opacity: 0.7;
  font-variant-numeric: tabular-nums;
}

[data-sellora-page="autopilot"] .ap-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 4px;
}

[data-sellora-page="autopilot"] .ap-hero__actions .primary.is-pause {
  background: linear-gradient(135deg, #b45309, #d97706);
  border-color: rgba(251, 191, 36, 0.4);
}

/* Pipeline — vertical list of rows */
[data-sellora-page="autopilot"] .ap-pipeline-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 0;
}

[data-sellora-page="autopilot"] .ap-pipeline-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 14px;
  border: 1px solid rgba(148, 163, 184, 0.12);
  background: rgba(15, 23, 42, 0.55);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

[data-sellora-page="autopilot"] .ap-pipeline-card:hover {
  border-color: rgba(167, 139, 250, 0.28);
  box-shadow: 0 6px 20px rgba(109, 40, 217, 0.08);
}

[data-sellora-page="autopilot"] .ap-pipeline-icon {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  font-size: 20px;
  margin: 0;
  border-radius: 10px;
  background: rgba(124, 58, 237, 0.1);
}

[data-sellora-page="autopilot"] .ap-pipeline-card strong {
  display: block;
  font-size: 14px;
  margin: 0 0 2px;
  min-width: 140px;
  flex-shrink: 0;
}

[data-sellora-page="autopilot"] .ap-pipeline-card small {
  color: #94a3b8;
  line-height: 1.7;
  max-width: var(--ap-prose-width);
  flex: 1;
  min-width: 0;
}

[data-sellora-page="autopilot"] .ap-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--ap-space-section);
  margin: 0;
}

[data-sellora-page="autopilot"] .ap-kpi-card strong {
  font-size: 28px;
}

[data-sellora-page="autopilot"] .ap-kpi-card span {
  line-height: 1.7;
}

[data-sellora-page="autopilot"] .ap-kpi-status.is-on { color: #34d399; }
[data-sellora-page="autopilot"] .ap-kpi-status.is-off { color: #94a3b8; }
[data-sellora-page="autopilot"] .ap-kpi-status.is-paused { color: #fbbf24; }
[data-sellora-page="autopilot"] .ap-kpi-muted { color: #64748b; }

[data-sellora-page="autopilot"] .ap-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

[data-sellora-page="autopilot"] .ap-panel-link {
  font-size: 13px;
  font-weight: 500;
  color: #a78bfa;
  text-decoration: none;
  white-space: nowrap;
  padding-top: 4px;
}

[data-sellora-page="autopilot"] .ap-panel-link:hover { color: #c4b5fd; }

[data-sellora-page="autopilot"] .ap-queue-body {
  padding: 0;
  display: grid;
  gap: 12px;
}

[data-sellora-page="autopilot"] .ap-queue-row {
  display: grid;
  grid-template-columns: 44px 1fr auto auto;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.1);
  background: rgba(15, 23, 42, 0.45);
  text-decoration: none;
  color: inherit;
  transition: background 0.2s ease, border-color 0.2s ease;
}

[data-sellora-page="autopilot"] .ap-queue-row:hover {
  background: rgba(124, 58, 237, 0.1);
  border-color: rgba(167, 139, 250, 0.22);
}

[data-sellora-page="autopilot"] .ap-queue-thumb img,
[data-sellora-page="autopilot"] .ap-queue-ph {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  object-fit: cover;
  background: rgba(148, 163, 184, 0.12);
  display: grid;
  place-items: center;
  font-weight: 700;
  color: #64748b;
}

[data-sellora-page="autopilot"] .ap-queue-main strong {
  display: block;
  font-size: 14px;
  line-height: 1.45;
}

[data-sellora-page="autopilot"] .ap-queue-main small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}

[data-sellora-page="autopilot"] .ap-queue-seo {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #a78bfa;
}

[data-sellora-page="autopilot"] .ap-queue-badge {
  font-size: 11px;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(148, 163, 184, 0.12);
  color: #cbd5e1;
  white-space: nowrap;
}

[data-sellora-page="autopilot"] .ap-queue-empty {
  text-align: center;
  padding: 32px 24px;
  color: #94a3b8;
  line-height: 1.7;
}

[data-sellora-page="autopilot"] .ap-queue-empty span {
  display: inline-grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: rgba(52, 211, 153, 0.12);
  color: #34d399;
  font-size: 22px;
  margin-bottom: 12px;
}

[data-sellora-page="autopilot"] .ap-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--ap-space-section);
  margin: 0;
}

[data-sellora-page="autopilot"] .ap-meta-list {
  margin: 0 0 20px;
  padding: 0;
}

[data-sellora-page="autopilot"] .ap-meta-row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08);
  font-size: 14px;
  line-height: 1.6;
}

[data-sellora-page="autopilot"] .ap-meta-row:first-child {
  padding-top: 0;
}

[data-sellora-page="autopilot"] .ap-meta-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

[data-sellora-page="autopilot"] .ap-meta-row dt {
  color: #94a3b8;
  font-weight: 500;
}

[data-sellora-page="autopilot"] .ap-meta-row dd {
  margin: 0;
  text-align: right;
  color: #e2e8f0;
  font-weight: 600;
}

[data-sellora-page="autopilot"] .ap-schedule-btn {
  display: inline-flex;
  margin: 0;
}

[data-sellora-page="autopilot"] .ap-activity-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

[data-sellora-page="autopilot"] .ap-activity-item {
  display: grid;
  grid-template-columns: 10px 1fr auto;
  gap: 12px 14px;
  align-items: start;
  padding: 14px 0;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08);
}

[data-sellora-page="autopilot"] .ap-activity-item:first-child {
  padding-top: 0;
}

[data-sellora-page="autopilot"] .ap-activity-item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

[data-sellora-page="autopilot"] .ap-activity-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #a855f7;
  margin-top: 7px;
}

[data-sellora-page="autopilot"] .ap-activity-item strong {
  display: block;
  font-size: 14px;
  line-height: 1.45;
}

[data-sellora-page="autopilot"] .ap-activity-item small {
  color: #64748b;
  font-size: 12px;
  line-height: 1.6;
}

[data-sellora-page="autopilot"] .ap-activity-item time {
  font-size: 11px;
  color: #64748b;
  white-space: nowrap;
  padding-top: 2px;
}

[data-sellora-page="autopilot"] .ap-security-banner {
  margin: 0 0 18px;
  padding: 14px 16px;
  border-radius: 12px;
  background: rgba(52, 211, 153, 0.08);
  border: 1px solid rgba(52, 211, 153, 0.22);
  color: #6ee7b7;
  font-size: 13px;
  line-height: 1.7;
  max-width: var(--ap-prose-width);
}

[data-sellora-page="autopilot"] .ap-security-grid {
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 0;
}

[data-sellora-page="autopilot"] .ap-security-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.1);
  background: rgba(15, 23, 42, 0.45);
  transition: border-color 0.2s ease;
}

[data-sellora-page="autopilot"] .ap-security-card:hover {
  border-color: rgba(167, 139, 250, 0.22);
}

[data-sellora-page="autopilot"] .ap-security-card span {
  color: #34d399;
  font-weight: 700;
  flex-shrink: 0;
  width: 20px;
  text-align: center;
}

[data-sellora-page="autopilot"] .ap-security-card p {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: #cbd5e1;
  max-width: var(--ap-prose-width);
}

[data-sellora-page="autopilot"] .ap-sticky-bar {
  position: fixed;
  left: 260px;
  right: 0;
  bottom: 0;
  z-index: 90;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 24px;
  background: rgba(5, 8, 20, 0.94);
  border-top: 1px solid rgba(148, 163, 184, 0.12);
  backdrop-filter: blur(12px);
}

[data-sellora-page="autopilot"] .ap-sticky-bar__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 12px;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
}

[data-sellora-page="autopilot"] .ap-sticky-bar__grid .ap-action-btn {
  width: auto;
  flex: 0 0 auto;
  white-space: nowrap;
}

[data-sellora-page="autopilot"] .ap-action-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease, opacity 180ms ease;
}

[data-sellora-page="autopilot"] .ap-action-btn__label {
  position: relative;
  z-index: 1;
}

[data-sellora-page="autopilot"] .ap-action-btn__spinner {
  display: none;
  position: absolute;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(255, 255, 255, 0.28);
  border-top-color: #fff;
  border-radius: 50%;
  animation: sellora-spin 0.7s linear infinite;
}

[data-sellora-page="autopilot"] .ap-action-btn.is-loading .ap-action-btn__label {
  opacity: 0;
}

[data-sellora-page="autopilot"] .ap-action-btn.is-loading .ap-action-btn__spinner {
  display: block;
}

[data-sellora-page="autopilot"] .ap-action-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

[data-sellora-page="autopilot"] .ap-action-btn.secondary {
  border: 1px solid rgba(167, 139, 250, 0.32);
  background: #0b1220;
  color: #f1f5f9;
}

[data-sellora-page="autopilot"] .ap-action-btn.secondary:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: rgba(167, 139, 250, 0.52);
  box-shadow: 0 0 18px rgba(124, 58, 237, 0.22);
  background: rgba(15, 23, 42, 0.95);
}

[data-sellora-page="autopilot"] .ap-action-btn.secondary:active:not(:disabled) {
  transform: scale(0.98) translateY(0);
}

[data-sellora-page="autopilot"] .ap-action-btn--ghost,
[data-sellora-page="autopilot"] a.ap-action-btn.ap-action-btn--ghost {
  border: 1px solid rgba(148, 163, 184, 0.22);
  background: transparent;
  color: #cbd5e1;
}

[data-sellora-page="autopilot"] .ap-action-btn--ghost:hover {
  border-color: rgba(167, 139, 250, 0.35);
  color: #f1f5f9;
  background: rgba(124, 58, 237, 0.08);
  transform: translateY(-1px);
}

[data-sellora-page="autopilot"] .ap-sticky-bar .primary {
  border: none;
  color: #fff;
}

[data-sellora-page="autopilot"] .ap-sticky-bar .primary:hover:not(:disabled) {
  transform: translateY(-1px);
}

[data-sellora-page="autopilot"] .ap-sticky-bar .primary:active:not(:disabled) {
  transform: scale(0.98);
}

[data-sellora-page="autopilot"] .ap-sticky-bar .primary.is-pause {
  background: linear-gradient(135deg, #b45309, #d97706);
}

[data-sellora-page="autopilot"] .ap-sched-form-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding-top: 8px;
}

[data-sellora-page="autopilot"] .ap-sched-form-actions .ap-action-btn {
  width: 100%;
}

[data-sellora-page="autopilot"] .ap-page-start-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

[data-sellora-page="autopilot"] .ap-page-start-actions .ap-action-btn {
  width: 100%;
}

[data-sellora-page="autopilot"] .ap-schedule-view-foot {
  margin-top: 8px;
  padding-top: 4px;
}

[data-sellora-page="autopilot"] .ap-schedule-btn {
  margin: 0;
}

[data-sellora-page="autopilot"] .ap-schedule-editor {
  display: grid;
  gap: 16px;
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 200ms ease, opacity 200ms ease;
}

[data-sellora-page="autopilot"] .ap-schedule-editor.is-open {
  max-height: 1200px;
  opacity: 1;
}

[data-sellora-page="autopilot"] .ap-schedule-form {
  display: grid;
  gap: 16px;
}

[data-sellora-page="autopilot"] .ap-sched-fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

[data-sellora-page="autopilot"] .ap-sched-legend {
  font-size: 12px;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0;
}

[data-sellora-page="autopilot"] .ap-sched-segment {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

[data-sellora-page="autopilot"] .ap-sched-segment-opt,
[data-sellora-page="autopilot"] .ap-sched-type-card {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.16);
  background: rgba(15, 23, 42, 0.45);
  cursor: pointer;
  font-size: 14px;
  transition: border-color 0.2s ease, background 0.2s ease;
}

[data-sellora-page="autopilot"] .ap-sched-segment-opt:has(input:checked),
[data-sellora-page="autopilot"] .ap-sched-type-card:has(input:checked) {
  border-color: rgba(167, 139, 250, 0.42);
  background: rgba(124, 58, 237, 0.12);
}

[data-sellora-page="autopilot"] .ap-sched-type-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

[data-sellora-page="autopilot"] .ap-sched-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

[data-sellora-page="autopilot"] .ap-sched-field {
  display: grid;
  gap: 8px;
}

[data-sellora-page="autopilot"] .ap-sched-field label,
[data-sellora-page="autopilot"] .ap-sched-label {
  font-size: 13px;
  font-weight: 500;
  color: #cbd5e1;
}

[data-sellora-page="autopilot"] .ap-sched-input {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(148, 163, 184, 0.18);
  background: rgba(9, 16, 29, 0.85);
  color: #f8fafc;
  font-size: 14px;
}

[data-sellora-page="autopilot"] .ap-sched-input:focus {
  outline: none;
  border-color: rgba(167, 139, 250, 0.45);
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15);
}

[data-sellora-page="autopilot"] .ap-sched-hint {
  font-size: 12px;
  color: #64748b;
}

[data-sellora-page="autopilot"] .ap-sched-weekdays {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

[data-sellora-page="autopilot"] .ap-sched-weekdays label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid rgba(148, 163, 184, 0.12);
  font-size: 13px;
  cursor: pointer;
}

[data-sellora-page="autopilot"] .ap-sched-weekdays label:has(input:checked) {
  border-color: rgba(167, 139, 250, 0.35);
  background: rgba(124, 58, 237, 0.1);
}

[data-sellora-page="autopilot"] .ap-sched-toggles {
  display: grid;
  gap: 12px;
}

[data-sellora-page="autopilot"] .ap-sched-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.1);
  background: rgba(15, 23, 42, 0.4);
  cursor: pointer;
  font-size: 14px;
}

[data-sellora-page="autopilot"] .ap-sched-form-actions .ghost,
[data-sellora-page="autopilot"] .ap-sched-form-actions .primary {
  flex: 1 1 0;
}

[data-sellora-page="autopilot"] .ap-sched-error {
  margin: 0;
  font-size: 12px;
  color: #fca5a5;
}

[data-sellora-page="autopilot"] .ap-sched-error-global {
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(248, 113, 113, 0.08);
  border: 1px solid rgba(248, 113, 113, 0.22);
}

[data-sellora-page="autopilot"] .ap-schedule-loading {
  padding: 16px 0;
  color: #94a3b8;
  font-size: 14px;
}

@media (max-width: 960px) {
  [data-sellora-page="autopilot"] .ap-sched-type-grid,
  [data-sellora-page="autopilot"] .ap-sched-form-grid {
    grid-template-columns: 1fr;
  }
}
.ap-page-start-modal .ap-page-start-dialog {
  max-width: 460px;
  text-align: center;
}
.ap-page-start-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 16px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 28px;
  background: rgba(168, 85, 247, 0.16);
  border: 1px solid rgba(167, 139, 250, 0.3);
}
.ap-page-start-facts {
  list-style: none;
  margin: 0 0 20px;
  padding: 0;
  text-align: left;
  border: 1px solid rgba(148, 163, 184, 0.12);
  border-radius: 12px;
  overflow: hidden;
}
.ap-page-start-facts li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-bottom: 1px solid rgba(148, 163, 184, 0.08);
  font-size: 14px;
}
.ap-page-start-facts li:last-child { border-bottom: 0; }
.ap-page-start-facts span { color: #94a3b8; }
.ap-page-start-actions {
  display: flex;
  gap: 14px;
}
.ap-page-start-actions .ghost,
.ap-page-start-actions .primary {
  flex: 1 1 0;
}
.ap-page-start-modal.is-open .sellora-modal-dialog {
  animation: apPageModalIn 180ms ease;
}
@keyframes apPageModalIn {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}
@media (max-width: 1200px) {
  [data-sellora-page="autopilot"] .ap-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 960px) {
  [data-sellora-page="autopilot"] .ap-sticky-bar {
    left: 0;
  }
  [data-sellora-page="autopilot"] .ap-sticky-bar__grid .ap-action-btn {
    flex: 1 1 calc(50% - 6px);
    max-width: calc(50% - 6px);
  }
  [data-sellora-page="autopilot"] .ap-two-col {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  [data-sellora-page="autopilot"] {
    --ap-card-padding: 20px;
  }
  [data-sellora-page="autopilot"] .ap-kpi-grid {
    grid-template-columns: 1fr;
  }
  [data-sellora-page="autopilot"] .ap-pipeline-card {
    display: grid;
    grid-template-columns: 40px 1fr;
    grid-template-rows: auto auto;
    column-gap: 12px;
    row-gap: 4px;
    align-items: center;
    padding: 14px 16px;
  }
  [data-sellora-page="autopilot"] .ap-pipeline-icon {
    grid-row: 1 / span 2;
  }
  [data-sellora-page="autopilot"] .ap-pipeline-card strong {
    min-width: 0;
    margin: 0;
  }
  [data-sellora-page="autopilot"] .ap-pipeline-card small {
    margin: 0;
  }
  [data-sellora-page="autopilot"] .ap-queue-row {
    grid-template-columns: 40px 1fr;
    grid-template-rows: auto auto;
    padding: 14px;
  }
  [data-sellora-page="autopilot"] .ap-queue-seo,
  [data-sellora-page="autopilot"] .ap-queue-badge {
    grid-column: 2;
  }
  [data-sellora-page="autopilot"] .ap-sticky-bar__grid {
    gap: 10px;
  }
  [data-sellora-page="autopilot"] .ap-sticky-bar__grid .ap-action-btn {
    flex: 1 1 100%;
    max-width: 100%;
    width: 100%;
  }
  [data-sellora-page="autopilot"] .ap-sched-form-actions,
  [data-sellora-page="autopilot"] .ap-page-start-actions {
    grid-template-columns: 1fr;
  }
  [data-sellora-page="autopilot"] .ap-sticky-bar {
    padding: 24px 16px;
  }
}

/* Settings — Тариф и оплата (PLUS hero) */
.settings-billing {
  display: grid;
  gap: 16px;
  padding: 20px;
}

.settings-billing-plan {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(124, 58, 237, 0.34);
  border-radius: 18px;
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease;
}

.settings-billing-plan--hero {
  padding: 36px;
  background:
    radial-gradient(circle at 78% 12%, rgba(124, 58, 237, 0.28) 0%, transparent 46%),
    radial-gradient(circle at 18% 88%, rgba(124, 58, 237, 0.12) 0%, transparent 40%),
    linear-gradient(105deg, #131827 0%, #1a1430 52%, #2c184b 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    inset 0 0 48px rgba(124, 58, 237, 0.08),
    0 16px 48px rgba(8, 10, 24, 0.55);
}

.settings-billing-plan--hero:hover {
  transform: translateY(-2px);
  border-color: rgba(167, 139, 250, 0.48);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.07),
    inset 0 0 56px rgba(124, 58, 237, 0.12),
    0 22px 56px rgba(44, 24, 75, 0.45),
    0 0 32px rgba(124, 58, 237, 0.18);
}

.settings-billing-plan__watermark {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 80px;
  height: 80px;
  object-fit: contain;
  opacity: 0.15;
  pointer-events: none;
  user-select: none;
  filter: saturate(1.1);
}

.settings-billing-plan__layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(220px, 0.75fr);
  gap: 28px 32px;
  align-items: stretch;
}

.settings-billing-plan__main {
  display: grid;
  gap: 14px;
  align-content: start;
}

.settings-billing-plan__brand {
  display: flex;
  align-items: center;
  gap: 12px;
}

.settings-billing-plan__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: linear-gradient(135deg, #c084fc, #7c3aed);
  box-shadow: 0 0 16px rgba(168, 85, 247, 0.85);
  flex-shrink: 0;
}

.settings-billing-plan__name {
  font-size: 36px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #f3e8ff;
  text-shadow: 0 0 24px rgba(192, 132, 252, 0.35);
}

.settings-billing-plan__status {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  color: #b8c5d9;
}

.settings-billing-feature-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-top: 6px;
}

.settings-billing-feature-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.12);
  background: rgba(255, 255, 255, 0.04);
  color: #dbe4f0;
  font-size: 13px;
  line-height: 1.45;
  font-weight: 500;
  transition: transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease, background 220ms ease;
}

.settings-billing-feature-card__icon {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 11px;
  font-weight: 800;
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.16);
  border: 1px solid rgba(52, 211, 153, 0.35);
}

.settings-billing-feature-card:hover {
  transform: translateY(-2px);
  border-color: rgba(167, 139, 250, 0.32);
  background: rgba(124, 58, 237, 0.1);
  box-shadow: 0 8px 22px rgba(124, 58, 237, 0.14);
}

.settings-billing-plan__aside {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  min-height: 100%;
}

.settings-billing-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(74, 222, 128, 0.45);
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.28) 0%, rgba(5, 150, 105, 0.22) 100%);
  color: #ecfdf5;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  white-space: nowrap;
  box-shadow: 0 0 20px rgba(16, 185, 129, 0.18);
}

.settings-billing-badge__icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 10px;
  font-weight: 800;
  color: #064e3b;
  background: linear-gradient(135deg, #6ee7b7, #34d399);
}

.settings-billing-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  width: 100%;
  margin: 0;
}

.settings-billing-stat {
  margin: 0;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid rgba(148, 163, 184, 0.1);
  background: rgba(8, 12, 24, 0.42);
  backdrop-filter: blur(6px);
}

.settings-billing-stat--wide {
  grid-column: 1 / -1;
}

.settings-billing-stat dt {
  margin: 0 0 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #94a3b8;
}

.settings-billing-stat dd {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  color: #f8fafc;
}

.settings-billing-stat dd span {
  font-size: 13px;
  font-weight: 500;
  color: #94a3b8;
}

.settings-billing-payment {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  border: 1px solid #273049;
  border-radius: 14px;
  padding: 18px 20px;
  background: #0a101c;
}

.settings-billing-payment__icon {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display: grid;
  place-items: center;
  font-size: 20px;
  background: rgba(124, 58, 237, 0.12);
  border: 1px solid rgba(124, 58, 237, 0.22);
  flex-shrink: 0;
}

.settings-billing-payment__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.settings-billing-payment__label {
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #9fa8bc;
}

.settings-billing-payment__value {
  font-size: 16px;
  font-weight: 600;
  color: #f1f5f9;
}

.settings-billing-payment__hint {
  font-size: 13px;
  line-height: 1.45;
  color: #94a3b8;
}

@media (max-width: 960px) {
  .settings-billing-plan--hero {
    padding: 28px;
  }

  .settings-billing-plan__layout {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }

  .settings-billing-plan__aside {
    align-items: stretch;
  }

  .settings-billing-badge {
    align-self: flex-end;
  }
}

@media (max-width: 760px) {
  .settings-billing-plan--hero {
    padding: 24px;
  }

  .settings-billing-plan__layout {
    grid-template-columns: 1fr;
  }

  .settings-billing-plan__aside {
    align-items: stretch;
  }

  .settings-billing-badge {
    align-self: flex-start;
  }

  .settings-billing-feature-grid,
  .settings-billing-stats {
    grid-template-columns: 1fr;
  }

  .settings-billing-stat--wide {
    grid-column: auto;
  }

  .settings-billing-plan__watermark {
    width: 64px;
    height: 64px;
    top: 14px;
    right: 14px;
  }
}

html[data-theme-resolved="light"] .settings-billing-plan--hero {
  border-color: rgba(124, 58, 237, 0.24);
  background:
    radial-gradient(circle at 78% 12%, rgba(124, 58, 237, 0.14) 0%, transparent 46%),
    linear-gradient(105deg, #f8f7ff 0%, #f3efff 52%, #ebe4ff 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    inset 0 0 40px rgba(124, 58, 237, 0.06),
    0 12px 32px rgba(124, 58, 237, 0.1);
}

html[data-theme-resolved="light"] .settings-billing-plan--hero:hover {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    inset 0 0 44px rgba(124, 58, 237, 0.08),
    0 16px 40px rgba(124, 58, 237, 0.14);
}

html[data-theme-resolved="light"] .settings-billing-plan__name {
  color: #6d28d9;
  text-shadow: none;
}

html[data-theme-resolved="light"] .settings-billing-plan__status {
  color: var(--text-muted);
}

html[data-theme-resolved="light"] .settings-billing-feature-card {
  background: rgba(255, 255, 255, 0.72);
  border-color: rgba(124, 58, 237, 0.12);
  color: var(--text-primary);
}

html[data-theme-resolved="light"] .settings-billing-stat {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(124, 58, 237, 0.1);
}

html[data-theme-resolved="light"] .settings-billing-stat dd,
html[data-theme-resolved="light"] .settings-billing-payment__value {
  color: var(--text-primary);
}

html[data-theme-resolved="light"] .settings-billing-stat dt,
html[data-theme-resolved="light"] .settings-billing-stat dd span,
html[data-theme-resolved="light"] .settings-billing-payment__hint {
  color: var(--text-muted);
}

html[data-theme-resolved="light"] .settings-billing-payment {
  background: var(--surface-elevated, #fff);
  border-color: var(--border-color);
}

html[data-theme-resolved="light"] .settings-billing-payment__label {
  color: var(--text-muted);
}

html[data-theme-resolved="light"] .analytics-seo-metrics-card {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 245, 255, 0.92) 100%);
  border-color: var(--border-color);
}

html[data-theme-resolved="light"] .analytics-donut-number,
html[data-theme-resolved="light"] .analytics-donut-suffix {
  color: var(--text-primary);
}

html[data-theme-resolved="light"] .analytics-donut-label,
html[data-theme-resolved="light"] .analytics-health-coverage {
  color: var(--text-muted);
}

html[data-theme-resolved="light"] .analytics-health-caption {
  color: var(--text-primary);
}

@media (max-width: 760px) {
  .analytics-donut-wrap,
  .analytics-donut {
    width: 172px;
    height: 172px;
  }

  .analytics-skeleton-donut {
    width: 172px;
    height: 172px;
  }

  .analytics-donut-number,
  .analytics-donut-suffix {
    font-size: 34px;
  }

  .analytics-donut-center {
    padding: 22px;
  }

  .analytics-donut-label {
    font-size: 13px;
    max-width: 8.5em;
  }
}

/* Settings — autopilot control panel */
.settings-section#autopilot-rules {
  scroll-margin-top: 24px;
}

.settings-section#autopilot-rules.is-focused {
  border-color: rgba(167, 139, 250, 0.55);
  box-shadow:
    0 0 0 1px rgba(124, 58, 237, 0.28),
    0 0 28px rgba(124, 58, 237, 0.16);
  transition: box-shadow 320ms ease, border-color 320ms ease;
}

.settings-section#autopilot-rules > .panel-title {
  padding-bottom: 8px;
}

.settings-advanced-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(124, 58, 237, 0.28);
  border-radius: 10px;
  background: rgba(124, 58, 237, 0.08);
  color: #d8b4fe;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 10px 14px;
  white-space: nowrap;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.settings-advanced-toggle:hover {
  background: rgba(124, 58, 237, 0.14);
  border-color: rgba(167, 139, 250, 0.45);
  color: #f3e8ff;
}

.settings-advanced-toggle:focus-visible {
  outline: 2px solid rgba(130, 90, 255, 0.45);
  outline-offset: 3px;
}

.settings-advanced-toggle__chevron {
  width: 10px;
  height: 10px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.settings-advanced-toggle.is-open .settings-advanced-toggle__chevron {
  transform: rotate(-135deg) translateY(2px);
}

#autopilot-rules .ap-settings-panel {
  display: grid;
  gap: 16px;
  padding: 0 20px 24px;
  margin-top: 0;
  overflow: visible;
  max-height: none;
  opacity: 1;
  transition: none;
  animation: none;
}

#autopilot-rules.panel.settings-section.autopilot-advanced-open {
  overflow: visible;
}

.ap-settings-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.ap-settings-card {
  border: 1px solid #273049;
  border-radius: 14px;
  background: linear-gradient(160deg, rgba(11, 18, 32, 0.96) 0%, rgba(15, 23, 42, 0.88) 100%);
  padding: 26px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  height: 100%;
  display: flex;
  flex-direction: column;
}

.ap-settings-card__title {
  margin: 0 0 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #a78bfa;
}

.ap-settings-rows {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
  flex: 1;
}

.ap-settings-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 72px;
  padding: 12px 14px;
  border: 1px solid transparent;
  border-radius: 12px;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.ap-settings-row:hover {
  background: rgba(124, 58, 237, 0.08);
  border-color: rgba(167, 139, 250, 0.22);
}

.ap-settings-row__icon {
  width: 40px;
  height: 40px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  background: rgba(124, 58, 237, 0.12);
  border: 1px solid rgba(124, 58, 237, 0.2);
  color: #c4b5fd;
  flex-shrink: 0;
}

.ap-settings-row__icon svg {
  width: 18px;
  height: 18px;
}

.ap-settings-row__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.ap-settings-row__copy strong {
  font-size: 14px;
  font-weight: 600;
  color: #f1f5f9;
  line-height: 1.25;
}

.ap-settings-row__copy small {
  font-size: 12px;
  line-height: 1.35;
  color: #94a3b8;
}

.ap-settings-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
  white-space: nowrap;
  flex-shrink: 0;
  box-sizing: border-box;
}

.ap-settings-badge--green {
  color: #6ee7b7;
  background: rgba(16, 185, 129, 0.14);
  border-color: rgba(52, 211, 153, 0.35);
}

.ap-settings-badge--orange {
  color: #fdba74;
  background: rgba(249, 115, 22, 0.14);
  border-color: rgba(251, 146, 60, 0.35);
}

.ap-settings-badge--violet {
  color: #e9d5ff;
  background: rgba(124, 58, 237, 0.2);
  border-color: rgba(167, 139, 250, 0.4);
  text-transform: uppercase;
}

.ap-settings-badge--blue {
  color: #93c5fd;
  background: rgba(59, 130, 246, 0.14);
  border-color: rgba(96, 165, 250, 0.35);
}

.ap-settings-badge--neutral {
  color: #cbd5e1;
  background: rgba(148, 163, 184, 0.12);
  border-color: rgba(148, 163, 184, 0.24);
  font-variant-numeric: tabular-nums;
}

.ap-settings-badge--confirm {
  color: #fdba74;
  background: rgba(249, 115, 22, 0.14);
  border-color: rgba(251, 146, 60, 0.35);
}

.ap-settings-notice {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid transparent;
}

.ap-settings-notice--success {
  background: rgba(16, 185, 129, 0.1);
  border-color: rgba(52, 211, 153, 0.28);
  color: #a7f3d0;
}

.ap-settings-notice__icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(16, 185, 129, 0.18);
  color: #6ee7b7;
  font-size: 13px;
  font-weight: 700;
}

.ap-settings-notice__copy {
  display: grid;
  gap: 4px;
  min-width: 0;
  font-size: 13px;
  line-height: 1.45;
}

.ap-settings-notice__copy strong {
  color: #6ee7b7;
  font-weight: 600;
}

.settings-autopilot-advanced.ap-settings-advanced {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transform: translateY(-8px);
  transition:
    max-height 0.28s ease,
    opacity 0.28s ease,
    transform 0.28s ease;
}

.settings-autopilot-advanced.ap-settings-advanced.is-open {
  opacity: 1;
  transform: translateY(0);
}

.settings-autopilot-advanced.ap-settings-advanced.is-open.is-expanded {
  overflow: visible;
}

.ap-settings-advanced__inner {
  min-height: 0;
}

.settings-autopilot-advanced[hidden] {
  display: none !important;
  max-height: 0 !important;
  overflow: hidden !important;
}

@media (prefers-reduced-motion: reduce) {
  .settings-autopilot-advanced.ap-settings-advanced {
    transition: none;
    transform: none;
  }
}

html[data-theme-resolved="light"] .ap-settings-notice--success {
  background: rgba(16, 185, 129, 0.08);
  border-color: rgba(5, 150, 105, 0.22);
  color: #047857;
}

html[data-theme-resolved="light"] .ap-settings-notice__copy strong {
  color: #047857;
}

html[data-theme-resolved="light"] .ap-settings-card {
  background: linear-gradient(160deg, #ffffff 0%, #f8f7ff 100%);
  border-color: var(--border-color);
}

html[data-theme-resolved="light"] .ap-settings-row:hover {
  background: rgba(124, 58, 237, 0.06);
  border-color: rgba(124, 58, 237, 0.18);
}

html[data-theme-resolved="light"] .ap-settings-row__copy strong {
  color: var(--text-primary);
}

html[data-theme-resolved="light"] .ap-settings-row__copy small {
  color: var(--text-muted);
}

@media (max-width: 960px) {
  .ap-settings-card-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .settings-section .panel-title {
    flex-wrap: wrap;
    gap: 10px;
  }

  .settings-advanced-toggle {
    width: 100%;
    justify-content: center;
    white-space: normal;
  }

  .ap-settings-panel {
    padding: 0 16px 20px;
  }

  .ap-settings-card {
    padding: 20px;
  }

  .ap-settings-row {
    grid-template-columns: 36px minmax(0, 1fr);
    grid-template-rows: auto auto;
    min-height: 68px;
    padding: 12px;
  }

  .ap-settings-badge {
    grid-column: 2;
    justify-self: start;
    margin-top: 2px;
  }
}

/* Nexorvi product images — catalog cards + AI workflow thumbs */
.product-card .product-img {
  background: #0f172a;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.product-image,
.product-card-image,
.product-card .product-img img.product-card-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: contain;
  background: #0f172a;
}

.product-thumb,
.product-image-box .opt-thumb,
.opt-thumb.product-thumb {
  width: 48px;
  height: 48px;
  object-fit: contain;
  background: #0f172a;
  border-radius: 8px;
}

.ap-queue-thumb img.product-thumb,
.ap-queue-thumb img.sellora-product-image {
  width: 48px;
  height: 48px;
  object-fit: contain;
  background: #0f172a;
  border-radius: 8px;
}

img.sellora-product-image.is-placeholder,
.product-card-img.is-placeholder {
  object-fit: contain;
  padding: 12px;
  box-sizing: border-box;
}