/* Focused layer for Overview, Pricing and Account Center. */
:root{--room-bg:#08070d;--room-card:#15111e;--room-raised:#1c1626;--room-accent:#b68af5;--room-hover:#c6a1ff;--room-text:#f5f1ff;--room-muted:#a99abb;--room-border:rgba(180,145,255,.12);--mint:var(--room-accent)}
:root[data-accent=iris]{--room-accent:#a59bff;--room-hover:#c2bbff}
:root[data-accent=rose]{--room-accent:#eca3ce;--room-hover:#f5c1df}
body{background:var(--room-bg);color:var(--room-text);font-family:Inter,Geist,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
#workspace aside,#workspace .main-shell>header{background:var(--room-bg);border-color:var(--room-border);backdrop-filter:none}
#workspace .main-shell>main{max-width:1440px;margin:auto;padding:40px clamp(22px,3vw,52px)}
#overview h1,#settings h1{color:var(--room-text);background:none;-webkit-text-fill-color:currentColor;font-size:clamp(28px,3vw,38px);font-weight:550;letter-spacing:-1.5px;line-height:1.2}
#overview .muted,#settings .muted{color:var(--room-muted);font-size:13px;line-height:1.8}
#overview .stats{gap:16px;margin:28px 0 22px;grid-template-columns:repeat(4,minmax(0,1fr))}
#overview .stats article,#overview .panel,#settings .panel{background:var(--room-card);border:1px solid var(--room-border);border-radius:14px;box-shadow:none}
#overview .stats article{min-height:145px;padding:22px}
#overview .stats strong{font-size:36px;letter-spacing:-1.5px;font-weight:550;line-height:1.5}
#overview .stat-label{font-size:10px;letter-spacing:.8px;color:var(--room-muted)}
#overview .stats small{color:var(--room-muted);font-size:11px}
#overview .stat-label .icon{width:18px;height:18px;color:var(--room-accent)}
#overview .overview-grid{grid-template-columns:1.15fr 1fr;gap:22px;align-items:stretch;margin:0}
#overview .panel{padding:24px;margin:0;min-width:0}
#overview h2,#settings h2{font-size:16px;font-weight:550;letter-spacing:-.3px;color:var(--room-text)}
.quick-actions{display:grid;margin-top:17px;gap:4px}.quick-action{display:flex;align-items:center;gap:13px;width:100%;padding:12px 10px;text-align:left;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--room-text)}
.quick-action:hover{background:var(--room-raised);border-color:var(--room-border)}
.quick-action>.icon{color:var(--room-accent);width:20px;height:20px;flex-shrink:0}.quick-action>span:first-of-type{flex:1;min-width:0}.quick-action b{display:block;font-size:12px;font-weight:500}.quick-action small{display:block;color:var(--room-muted);font-size:11px;margin-top:4px}.quick-action>span:last-child{color:var(--room-muted)}
.overview-lower{display:grid;grid-template-columns:1.15fr 1fr;gap:22px;margin-top:22px}.overview-lower .empty{padding:28px 0 14px;line-height:1.9}
#overview dl div,#settings dl div{border-color:var(--room-border);padding:15px 0;font-size:12px}#overview dt,#settings dt{color:var(--room-muted)}#overview dd,#settings dd{color:var(--room-text)}
#workspace .primary,.store-pricing .primary{background:var(--room-accent);color:#190e29;border-color:var(--room-accent);box-shadow:none}#workspace .primary:hover,.store-pricing .primary:hover{background:var(--room-hover);filter:none}
#workspace .text-button{color:var(--room-accent)}#workspace button:focus-visible,.storefront :focus-visible,dialog :focus-visible{outline:2px solid var(--room-accent);outline-offset:4px}
#workspace aside nav button{position:relative;border:1px solid transparent;transition:background .15s,color .15s}#workspace aside nav button.selected{color:var(--room-text);background:var(--room-raised);border-color:var(--room-border);box-shadow:none}#workspace aside nav button.selected:before{content:"";position:absolute;left:-1px;top:25%;height:50%;width:2px;background:var(--room-accent);border-radius:4px}
#sidebar-collapse{margin:24px 0 0;width:100%;font-size:11px;justify-content:center;background:transparent;color:var(--room-muted);border-color:var(--room-border)}
#workspace .profile-banner{margin:0 0 22px;background:var(--room-raised);border:1px solid var(--room-border);border-radius:14px;box-shadow:none}#workspace .profile-orbit{display:none}.profile-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.settings-tabs{display:flex;gap:24px;border-bottom:1px solid var(--room-border);margin:26px 0;overflow:auto}.settings-tabs button{background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:12px 0;color:var(--room-muted);font-size:13px}.settings-tabs button[aria-selected=true]{color:var(--room-accent);border-bottom-color:var(--room-accent)}
#settings .settings-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.settings-section{padding:28px;max-width:800px}.settings-section h2{margin:12px 0 20px}.settings-section form{max-width:460px}.settings-section form label{font-size:12px}.settings-section input,.settings-section select{background:var(--room-bg);border-color:var(--room-border);color:var(--room-text)}#settings-panel-security{display:grid;grid-template-columns:1fr 1fr;gap:22px}#settings-panel-security[hidden],.settings-tab-panel[hidden]{display:none}.dialog-actions{display:flex;gap:12px;align-items:center;margin-top:24px}.dialog-actions .primary{margin:0;width:auto}
#pricing{scroll-margin-top:30px}#pricing .store-section-title h2{font-size:clamp(34px,4vw,48px);font-weight:550;letter-spacing:-1.8px;color:var(--room-text)}#pricing .store-section-title p{color:var(--room-muted)}#pricing .store-plan{padding:32px;background:var(--room-card);border-color:var(--room-border);border-radius:16px;box-shadow:none;transition:border-color .18s,transform .18s}#pricing .store-plan:hover{border-color:var(--room-accent);transform:translateY(-3px)}#pricing .featured-plan{background:var(--room-raised);border-color:#b68af566}#pricing .plan-highlight{background:var(--room-accent);color:#190e29;font-size:9px;padding:6px 12px;border-radius:6px;letter-spacing:1px}#pricing .plan-price{font-size:60px;color:var(--room-text)}#pricing .plan-period{color:var(--room-text);font-size:18px}#pricing li{font-size:12px;color:#c6b9d7}#pricing li:before{color:var(--room-accent)}#pricing .plan-description,#pricing .plan-price>span{color:var(--room-muted)}#pricing button{border-radius:9px;font-size:12px}button:disabled{opacity:.55;cursor:not-allowed}.store-faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px}.store-faq summary:after{content:"+";color:var(--room-accent);font-size:18px}.store-faq details[open] summary:after{content:"−"}.store-faq summary::-webkit-details-marker{display:none}
:root[data-density=compact] #workspace .main-shell>main{padding-top:24px}:root[data-density=compact] #workspace .panel{padding:18px}:root[data-density=compact] #overview .stats article{padding:16px;min-height:120px}:root[data-density=compact] #workspace dl div{padding:10px 0}:root[data-density=compact] .quick-action{padding:8px 10px}
@media(min-width:701px){body.sidebar-collapsed #workspace aside{width:82px;padding:28px 12px}body.sidebar-collapsed .main-shell{margin-left:82px}body.sidebar-collapsed aside .brand>span:last-child,body.sidebar-collapsed aside .nav-label,body.sidebar-collapsed #sidebar-collapse span,body.sidebar-collapsed aside .aside-foot{display:none}body.sidebar-collapsed aside .brand{padding:0;justify-content:center}body.sidebar-collapsed aside nav button{font-size:0;justify-content:center;padding:14px 10px}body.sidebar-collapsed aside nav button>span{font-size:16px;margin:0}body.sidebar-collapsed #sidebar-collapse{font-size:20px}}
@media(max-width:1150px){#overview .stats{grid-template-columns:repeat(2,minmax(0,1fr))}#overview .overview-grid,.overview-lower{grid-template-columns:1fr 1fr}.quick-action small{line-height:1.5}.settings-section{max-width:none}}
@media(max-width:900px){#overview .overview-grid,.overview-lower,#settings-panel-security,#settings .settings-grid{grid-template-columns:1fr}#pricing .store-plan{padding:26px 20px}}
@media(max-width:700px){#sidebar-collapse{display:none}#workspace .main-shell>main{padding:28px 20px}#overview .stats{gap:10px}#overview .stats article{padding:16px;min-height:130px}#overview .stat-label{font-size:9px;letter-spacing:.3px}#overview .stats strong{font-size:32px}#overview .panel{padding:20px}.settings-tabs{gap:22px}.settings-section{padding:22px}.profile-banner{flex-wrap:wrap}.settings-tabs button{font-size:12px}#pricing .store-plan{padding:30px}#workspace .date-chip{display:block;font-size:10px;margin-top:10px}#overview .page-heading{align-items:start;flex-direction:column}#workspace .main-shell>header .header-right{flex-wrap:wrap}#workspace #account{max-width:150px}#workspace .main-shell>header{gap:10px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
:root[data-motion=reduced] *,:root[data-motion=reduced] *:before,:root[data-motion=reduced] *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}

/* Reference direction: vivid violet, dimensional graphite and colored icon tiles. */
:root{--room-card:#17171e;--room-raised:#20202a;--room-border:rgba(255,255,255,.10);--room-accent:#ad76ff;--room-hover:#c19bff;--room-muted:#aaa8b9;--room-bg:#0c0b12}
#workspace{min-height:100vh;background:radial-gradient(ellipse at 85% 40%,#7628bb0c,transparent 45%),#0c0b12}
#workspace aside{background:linear-gradient(170deg,#0d0c13 30%,#161020 80%,#101017);border-right:1px solid #ffffff0a}
#workspace aside .brandmark{background:linear-gradient(140deg,#d12ae8,#7639ff 65%,#4861f3);color:white;border:1px solid #d990ff44;box-shadow:0 5px 18px #9538ff45;border-radius:12px}
#workspace aside nav button.selected{background:linear-gradient(100deg,#57217735,#38348520);border:1px solid #a862ff35;box-shadow:0 4px 18px #8e31e912}
#workspace .main-shell>header{background:#0c0b12d9;border-color:#ffffff0b;min-height:78px}
#workspace .main-shell>main{padding-top:32px}
#overview>.eyebrow{color:#ac77e9;letter-spacing:2px}
#overview .page-heading h1{font-size:clamp(29px,3vw,40px);font-weight:650;letter-spacing:-1.3px}
#overview .stats{gap:20px;margin-top:28px}
#overview .stats article{position:relative;display:flex;flex-direction:column;min-height:192px;padding:24px;border-radius:17px;background:linear-gradient(130deg,#1a1a22,#17171d);border:1px solid #ffffff12;box-shadow:inset 0 1px 0 #ffffff04,0 6px 20px #0002}
#overview .stat-label{display:flex;flex-direction:column-reverse;align-items:flex-start;gap:17px;color:#b5b2c4;text-transform:none;font-size:11px;letter-spacing:.35px}
#overview .stat-label>span{display:grid;place-items:center;width:43px;height:43px;border-radius:12px;background:linear-gradient(135deg,#f331a0,#ff2867);box-shadow:0 5px 20px #fa28741a;color:white}
#overview .stats article:nth-child(2) .stat-label>span{background:linear-gradient(135deg,#b44fff,#8338f4);box-shadow:0 5px 20px #9d3df524}
#overview .stats article:nth-child(3) .stat-label>span{background:linear-gradient(135deg,#328dff,#00b7df);box-shadow:0 5px 20px #199eff20}
#overview .stats article:nth-child(4) .stat-label>span{background:linear-gradient(135deg,#a952fa,#7736ee);box-shadow:0 5px 20px #9d3df524}
#overview .stat-label .icon{width:22px;height:22px;color:white}
#overview .stats strong{font-size:34px;line-height:1.3;margin:9px 0 8px;letter-spacing:-1px;font-weight:650}
#overview .stats small{font-size:10px;color:#9490a4}
#overview .panel{background:linear-gradient(125deg,#1a1a22,#14141b);border-color:#ffffff12;border-radius:17px;box-shadow:inset 0 1px 0 #ffffff04}
#overview .panel-title h2{font-size:17px;font-weight:600}#overview .panel-title .muted{font-size:11px;margin:7px 0 0;color:#9692a6}
.performance-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,1fr);gap:22px;margin-bottom:22px}
#overview .performance-panel{padding:26px}.performance-panel .panel-title{align-items:center}.performance-panel .text-button{font-size:11px;white-space:nowrap;text-decoration:none}
.chart-legend{display:flex;gap:17px;align-items:center;color:#a9a5b8;font-size:10px;margin:23px 0 0;flex-wrap:wrap}.chart-legend>span{display:flex;align-items:center;gap:6px}.chart-legend>span:last-child{margin-left:auto;color:#777286}.chart-legend i{width:7px;height:7px;border-radius:50%;background:#f13f99}.chart-legend>span:nth-child(2) i{background:#a65bfa}.chart-legend>span:nth-child(3) i{background:#399dff}
.overview-performance{min-height:220px;margin-top:24px;border-bottom:1px solid #ffffff0d;background:repeating-linear-gradient(to top,transparent 0,transparent 54px,#ffffff05 55px,#ffffff05 56px)}
.performance-empty{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px}.performance-empty-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid #a15bff25;border-radius:12px;background:#a15bff0c;color:#b482ff;font-size:24px;margin-bottom:15px}.performance-empty b{font-size:13px;font-weight:500;color:#d4cee2}.performance-empty p{font-size:11px;color:#9990aa;max-width:330px;line-height:1.8;margin:9px 0 0}
.performance-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:22px;gap:14px}.performance-summary>div{min-width:0;border:1px solid #ffffff0c;background:#ffffff02;border-radius:11px;padding:16px 12px}.performance-summary span{font-size:10px;color:#a59db4;display:block;margin-bottom:9px}.performance-summary strong{font-size:19px;letter-spacing:-.5px;font-weight:600;overflow-wrap:anywhere}.performance-summary>div:first-child strong{color:#f17cb5}.performance-summary>div:nth-child(2) strong{color:#be98ff}.performance-summary>div:last-child strong{color:#7eb9ff}
.deal-volume-chart{height:220px;display:flex;align-items:stretch;justify-content:space-around;gap:9px;padding:10px 8px 28px}.volume-chart-item{display:flex;flex:1;position:relative;align-items:flex-end;justify-content:center;min-width:0;border-radius:5px}.volume-chart-item:focus-visible{outline:2px solid var(--room-accent)}.volume-bar{display:block;min-width:3px;width:min(100%,28px);border-radius:5px 5px 0 0;background:linear-gradient(to top,#c62d7870,#f13f99)}.volume-bar[data-kind=I2C]{background:linear-gradient(to top,#7434b770,#a65bfa)}.volume-bar[data-kind=MM]{background:linear-gradient(to top,#2465ba70,#399dff)}.volume-chart-item small{position:absolute;bottom:-20px;font-size:8px;color:#8d859f}
#overview .activity-panel{display:flex;flex-direction:column;padding:24px;background:radial-gradient(ellipse at 100% 40%,#bc329017,transparent 75%),linear-gradient(125deg,#1a1722,#14131a)}.activity-panel .panel-title>div{position:relative;padding-left:48px}.activity-icon{position:absolute;left:0;top:0;display:grid;place-items:center;width:36px;height:36px;background:linear-gradient(145deg,#d83cd4,#7939f2);border-radius:10px;color:white;font-size:25px;box-shadow:0 4px 18px #a939e92a}.activity-panel .panel-title h2{margin:0}.activity-panel #recent-activity{flex:1;padding:16px 0}.activity-panel .empty{border:1px solid #ffffff0a;border-radius:12px;background:#ffffff02;padding:24px 18px!important;margin:0;color:#b0a2b9;line-height:1.9}.activity-panel .list-row{border:1px solid #ffffff0a;background:#ffffff03;border-radius:12px;padding:16px;margin-bottom:10px}.activity-panel>.small{width:100%;justify-content:center;background:#ffffff05;border-color:#ffffff12;color:#d4c6e4}
#overview .quick-panel .quick-actions{gap:2px}.quick-action>.icon{padding:7px;width:34px;height:34px;background:#a764ff12;border-radius:9px}.quick-action:hover{background:#a764ff0a}.overview-lower{grid-template-columns:1fr}
/* Pricing references: a luminous backdrop and one bold violet plan. */
#pricing{position:relative;isolation:isolate;padding:75px 34px 40px;margin:30px 0 40px;border:1px solid #a66bff26;border-radius:24px;background:radial-gradient(ellipse at 80% 10%,#7328d926,transparent 45%),#0d0817;overflow:hidden;box-shadow:0 15px 70px #6821b011}
#pricing:before{content:"";z-index:-1;pointer-events:none;position:absolute;width:750px;height:95px;top:30px;right:-310px;transform:rotate(-43deg);background:linear-gradient(0deg,transparent,#a345ff20 15%,#a05cff80 42%,#c6acffaa 50%,#7659ff66 60%,transparent);filter:blur(17px)}
#pricing:after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background-image:linear-gradient(#b984ff05 1px,transparent 1px),linear-gradient(90deg,#b984ff05 1px,transparent 1px);background-size:55px 55px;mask-image:linear-gradient(135deg,transparent 20%,black 100%)}
#pricing .pricing-pill{display:inline-block;background:#b05fff12;border:1px solid #b05fff30;border-radius:30px;padding:7px 13px;letter-spacing:1.4px;color:#c8a5f5;font-size:9px}
#pricing .store-section-title{position:relative;margin-bottom:50px}#pricing .store-section-title h2{font-size:clamp(36px,4.2vw,54px);font-weight:600;line-height:1.1;letter-spacing:-2px;margin:20px 0 16px}#pricing .store-section-title p{font-size:12px;color:#aaa0bb}
#pricing .store-plans{gap:18px;align-items:stretch}#pricing .store-plan{background:linear-gradient(150deg,#21132b90,#110c1bbf);border:1px solid #b784ff20;border-radius:18px;padding:32px 26px;backdrop-filter:blur(4px)}
#pricing .store-plan:before{content:"✧";display:grid;place-items:center;width:33px;height:33px;border-radius:9px;background:#a35dff14;border:1px solid #c590ff20;color:#c494ff;margin-bottom:25px;font-size:20px}
#pricing .featured-plan{background:linear-gradient(145deg,#933dff,#7934f0 70%,#6c2be4);border-color:#bd83ff70;box-shadow:0 12px 40px #7735e82a;transform:translateY(-9px)}#pricing .featured-plan:hover{transform:translateY(-12px);border-color:#d1a5ff}
#pricing .featured-plan:before{color:white;background:#ffffff12;border-color:#ffffff20}#pricing .featured-plan .plan-highlight{top:18px;left:auto;right:14px;font-size:7px;letter-spacing:.5px;background:#2a104b80;color:#f4eaff;border:1px solid #ffffff16;border-radius:20px;padding:6px 8px}
#pricing .plan-period{font-size:21px;font-weight:550}#pricing .plan-description{font-size:11px;line-height:1.7;min-height:38px;margin-bottom:19px}#pricing .plan-price{font-size:56px;font-weight:600;letter-spacing:-2px}#pricing .plan-price>span{font-size:10px;letter-spacing:0}#pricing .store-plan ul{border-color:#c491ff16;margin-bottom:17px}#pricing .store-plan li{line-height:1.7;font-size:11px;margin-bottom:12px}#pricing .store-plan button{border-radius:24px;background:#2c1a414d;border-color:#b88ce33a;color:#e5d6f5;min-height:42px}#pricing .featured-plan .plan-period,#pricing .featured-plan .plan-price{color:white}#pricing .featured-plan .plan-description,#pricing .featured-plan .plan-price>span,#pricing .featured-plan li{color:#f0e3ff}#pricing .featured-plan li:before{color:white}#pricing .featured-plan button{background:white;color:#6424cd;border-color:white;box-shadow:0 3px 15px #27105c15}#pricing .featured-plan button:hover{background:#f1e7ff}
#pricing .store-pricing-note{font-size:10px;color:#a79ab7;max-width:650px;margin:27px auto 0}
@media(min-width:1500px){#workspace .main-shell>main{max-width:1440px}}
@media(max-width:1150px){#overview .stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}#overview .stats article{padding:18px}.performance-layout{grid-template-columns:minmax(0,1.5fr) minmax(230px,1fr)}#pricing{padding:60px 22px 30px}#pricing .store-plan{padding:28px 19px}}
@media(max-width:1000px){#overview .stats{grid-template-columns:repeat(2,minmax(0,1fr))}.performance-layout{grid-template-columns:1fr}.performance-panel .panel-title{flex-wrap:wrap}.activity-panel .empty{min-height:100px}.performance-summary strong{font-size:17px}}
@media(max-width:700px){#overview .stats article{min-height:175px;padding:18px}#overview .stat-label{font-size:9px;gap:13px}#overview .stat-label>span{width:36px;height:36px;border-radius:10px}#overview .stat-label .icon{width:19px;height:19px}#overview .stats strong{font-size:30px}#overview .stats small{font-size:9px}#overview .performance-panel,#overview .activity-panel{padding:20px}.performance-summary{gap:8px}.performance-summary>div{padding:12px 8px}.performance-summary span{font-size:9px}.performance-summary strong{font-size:16px}.chart-legend{gap:12px;font-size:9px}.chart-legend>span:last-child{margin-left:0}.volume-chart-item small{font-size:7px}.deal-volume-chart{gap:5px}.performance-empty{padding:24px 12px}#pricing{padding:45px 18px 25px;margin:20px -6px 35px;border-radius:20px}#pricing .store-section-title h2{font-size:37px}#pricing .store-section-title p{font-size:11px;line-height:1.8}#pricing .store-plans{gap:24px}#pricing .store-plan{padding:28px}#pricing .featured-plan,#pricing .featured-plan:hover{transform:none}#pricing .store-section-title{margin-bottom:35px}}
