:root {
    --ink: #14231e;
    --ink-2: #30423b;
    --muted: #75827c;
    --line: #e5eae7;
    --soft: #f4f7f5;
    --paper: #ffffff;
    --lime: #b9f54a;
    --lime-dark: #94d929;
    --mint: #75dfbb;
    --mint-soft: #e9faf3;
    --orange: #ff8e55;
    --purple: #8c78e8;
    --danger: #e45757;
    --shadow: 0 20px 55px rgba(20, 35, 30, .09);
    --radius: 20px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: "Manrope", Arial, sans-serif; font-size: 14px; line-height: 1.55; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
img { display: block; max-width: 100%; }
h1, h2, h3, h4, p { margin-top: 0; }
h1, h2, h3 { line-height: 1.12; letter-spacing: -.035em; }
.container { width: min(1220px, calc(100% - 40px)); margin-inline: auto; }
.section { padding: 82px 0; }
.muted { color: var(--muted); }
.positive { color: #18a36b !important; }
.negative { color: var(--danger) !important; }

.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 0 20px; border: 1px solid transparent; border-radius: 12px; background: transparent; font-weight: 800; cursor: pointer; transition: .22s ease; }
.btn:hover { transform: translateY(-1px); }
.btn--primary { color: #fff; background: var(--ink); box-shadow: 0 10px 24px rgba(20,35,30,.16); }
.btn--primary:hover { background: #223a32; }
.btn--lime { color: var(--ink); background: var(--lime); }
.btn--lime:hover { background: #c8ff60; }
.btn--soft { background: var(--soft); border-color: var(--line); }
.btn--soft:hover { background: #ebf0ed; }
.btn--dark { color: #fff; background: var(--ink); }
.btn--large { min-height: 54px; padding-inline: 27px; border-radius: 14px; }
.btn--full { width: 100%; }
.btn--tiny { min-height: 32px; padding: 0 12px; font-size: 11px; border-radius: 8px; color: var(--ink); background: var(--lime); }
.btn--link { padding: 0 6px; border-bottom: 1px solid var(--ink); border-radius: 0; }
.btn--cart { width: 100%; min-height: 43px; margin-top: 15px; color: #fff; background: var(--ink); }
.btn--cart svg { width: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; }

.brand { display: inline-flex; flex-direction: column; align-items: flex-start; justify-content: center; flex: 0 0 auto; line-height: 1; }
.brand__word { color: #ef5b1b; font-size: 29px; font-weight: 800; letter-spacing: -.075em; white-space: nowrap; }
.brand__word span { display: inline-block; margin: 0 .04em 0 .01em; color: #ef5b1b; }
.brand__tagline { margin-top: 3px; color: #171d1a; font-size: 5.7px; font-weight: 800; line-height: 1.14; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.announcement { color: rgba(255,255,255,.78); background: var(--ink); font-size: 11px; }
.announcement__inner { display: flex; align-items: center; justify-content: space-between; height: 34px; }
.announcement__accent { color: var(--lime); }
.announcement a { border-bottom: 1px solid rgba(255,255,255,.32); }
.site-header { position: relative; z-index: 30; background: #fff; border-bottom: 1px solid var(--line); }
.header-main { display: flex; align-items: center; gap: 34px; height: 82px; }
.header-search { display: flex; align-items: center; flex: 1; height: 46px; padding-left: 15px; border: 1.5px solid #dce3df; border-radius: 13px; background: #f7f9f8; overflow: hidden; }
.header-search:focus-within { border-color: #8fcda9; box-shadow: 0 0 0 4px rgba(117,223,187,.12); }
.header-search svg { width: 20px; fill: none; stroke: #66736d; stroke-width: 1.8; }
.header-search input { flex: 1; min-width: 0; height: 100%; padding: 0 12px; border: 0; outline: 0; background: transparent; }
.header-search button { align-self: stretch; min-width: 82px; border: 0; color: #fff; background: var(--ink); font-weight: 800; cursor: pointer; }
.header-actions { display: flex; gap: 20px; }
.icon-action { position: relative; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 49px; padding: 0; border: 0; background: none; font-size: 10px; cursor: pointer; }
.icon-action svg { width: 23px; height: 23px; fill: none; stroke: var(--ink); stroke-width: 1.7; }
.icon-action b { position: absolute; top: -5px; right: 0; display: grid; place-items: center; min-width: 18px; height: 18px; padding: 0 4px; color: var(--ink); border: 2px solid #fff; border-radius: 20px; background: var(--lime); font-size: 9px; }
.favorite-count:empty { display: none; }
.main-nav { border-top: 1px solid #f0f2f1; }
.main-nav__inner { display: flex; align-items: center; gap: 30px; height: 50px; }
.main-nav a { position: relative; font-size: 12px; font-weight: 700; white-space: nowrap; }
.main-nav a:not(.catalog-link)::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -17px; height: 2px; background: var(--ink); transition: .2s; }
.main-nav a:hover::after, .main-nav a.is-active::after { right: 0; }
.catalog-link { display: inline-flex; align-items: center; align-self: stretch; gap: 8px; min-width: 130px; padding: 0 19px; margin-right: 2px; color: #fff; border-radius: 11px; background: var(--ink); }
.grid-icon { color: var(--lime); font-size: 21px; line-height: 1; transform: rotate(90deg); }
.nav-partner { color: #4d936f; }
.nav-partner span { padding: 2px 5px; margin-left: 3px; color: var(--ink); border-radius: 5px; background: var(--lime); font-size: 8px; text-transform: uppercase; }
.nav-admin { color: #826ee0; }
.mobile-menu-toggle { display: none; width: 42px; height: 42px; border: 0; border-radius: 10px; background: var(--soft); }
.mobile-menu-toggle span { display: block; width: 20px; height: 2px; margin: 4px auto; background: var(--ink); }

.toast { position: fixed; z-index: 1000; top: 22px; left: 50%; display: flex; align-items: center; gap: 20px; max-width: min(520px, calc(100% - 32px)); padding: 14px 17px 14px 20px; color: #fff; border-radius: 12px; background: var(--ink); box-shadow: 0 15px 45px rgba(0,0,0,.22); transform: translateX(-50%); animation: toast-in .35s ease; }
.toast--success { border-left: 4px solid var(--lime); }
.toast--error { border-left: 4px solid #ff7777; }
.toast button { padding: 0; border: 0; color: #fff; background: none; font-size: 22px; cursor: pointer; }
@keyframes toast-in { from { opacity: 0; transform: translate(-50%,-15px); } }

.hero { min-height: 660px; overflow: hidden; background: linear-gradient(120deg, #eef7f0 0%, #f9fbf8 60%, #f6f0e9 100%); }
.hero__grid { display: grid; grid-template-columns: .98fr 1.02fr; align-items: center; min-height: 660px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin-bottom: 21px; color: #56836e; font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.eyebrow span { width: 25px; height: 2px; background: #56836e; }
.hero h1 { max-width: 600px; margin-bottom: 24px; font-size: clamp(46px, 5vw, 76px); font-weight: 700; line-height: .98; }
.hero h1 em { color: #65a981; font-style: normal; }
.hero__copy > p { max-width: 550px; margin-bottom: 30px; color: #5f6d67; font-size: 16px; }
.hero__actions { display: flex; align-items: center; gap: 24px; }
.hero__trust { display: flex; gap: 36px; margin-top: 46px; }
.hero__trust div { padding-right: 34px; border-right: 1px solid #d3ddd7; }
.hero__trust div:last-child { border: 0; }
.hero__trust b, .hero__trust span { display: block; }
.hero__trust b { font-size: 18px; }
.hero__trust span { color: var(--muted); font-size: 10px; }
.hero__visual { position: relative; height: 580px; }
.hero-blob { position: absolute; top: 38px; right: -70px; width: 560px; height: 500px; border-radius: 46% 54% 62% 38% / 45% 39% 61% 55%; background: #d7eee1; transform: rotate(-7deg); }
.hero-product { position: absolute; overflow: hidden; border: 7px solid rgba(255,255,255,.76); background: #fff; box-shadow: var(--shadow); }
.hero-product img { width: 100%; height: 100%; object-fit: cover; }
.hero-product--main { top: 62px; right: 20px; width: 415px; height: 390px; border-radius: 48% 48% 31px 31px; transform: rotate(3deg); }
.hero-product--small { right: 390px; bottom: 38px; width: 180px; height: 185px; border-radius: 28px; transform: rotate(-7deg); }
.floating-tag { position: absolute; left: 18px; bottom: 18px; padding: 8px 13px; border-radius: 20px; background: var(--lime); font-size: 10px; font-weight: 800; }
.saving-card { position: absolute; z-index: 3; top: 74px; left: 10px; width: 135px; padding: 17px; border-radius: 18px; background: #fff; box-shadow: var(--shadow); transform: rotate(-5deg); }
.saving-card span, .saving-card small { display: block; color: var(--muted); font-size: 9px; }
.saving-card strong { display: block; margin: 2px 0; font-size: 24px; }
.delivery-pill { position: absolute; z-index: 3; right: 0; bottom: 68px; display: flex; align-items: center; gap: 10px; padding: 13px 18px; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.delivery-pill > span { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: var(--mint-soft); color: #35a477; font-weight: 900; }
.delivery-pill b, .delivery-pill small { display: block; }
.delivery-pill b { font-size: 10px; }.delivery-pill small { color: var(--muted); font-size: 8px; }

.category-strip { position: relative; margin-top: -26px; }
.category-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; padding: 8px; border-radius: 20px; background: #fff; box-shadow: var(--shadow); }
.category-grid a { display: flex; align-items: center; gap: 13px; min-height: 88px; padding: 13px 20px; border-radius: 15px; transition: .2s; }
.category-grid a:hover { background: var(--soft); transform: translateY(-2px); }
.category-grid > a > span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; background: #eef8f2; font-size: 25px; }
.category-grid b, .category-grid small { display: block; }.category-grid b { font-size: 13px; }.category-grid small { color: var(--muted); font-size: 10px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 30px; }
.section-heading.centered { justify-content: center; text-align: center; }
.section-kicker { display: block; margin-bottom: 8px; color: #5b9479; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.section-heading h2 { margin: 0; font-size: 35px; }
.section-heading > a, .section-heading > button { padding-bottom: 5px; border: 0; border-bottom: 1px solid var(--ink); background: none; font-weight: 800; }
.product-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.product-card { min-width: 0; border: 1px solid var(--line); border-radius: 18px; background: #fff; overflow: hidden; transition: .25s; }
.product-card:hover { border-color: #cad5cf; box-shadow: 0 18px 40px rgba(20,35,30,.09); transform: translateY(-4px); }
.product-card__media { position: relative; aspect-ratio: 1.12; overflow: hidden; background: var(--soft); }
.product-card__media > a, .product-card__media img { width: 100%; height: 100%; }
.product-card__media img { object-fit: cover; transition: .45s ease; }
.product-card:hover .product-card__media img { transform: scale(1.045); }
.product-badge { position: absolute; top: 13px; left: 13px; padding: 5px 9px; border-radius: 7px; color: var(--ink); background: var(--lime); font-size: 9px; font-weight: 900; }
.favorite-btn { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.9); box-shadow: 0 4px 15px rgba(0,0,0,.08); cursor: pointer; }
.product-card .favorite-btn { position: absolute; top: 12px; right: 12px; }
.favorite-btn svg { width: 18px; fill: none; stroke: var(--ink); stroke-width: 1.8; }
.favorite-btn.active svg { fill: #ff6969; stroke: #ff6969; }
.product-card__body { padding: 17px; }
.rating { margin-bottom: 8px; color: #334039; font-size: 10px; }.rating span { color: #f5a623; }.rating small { color: var(--muted); }
.product-card__title { display: block; min-height: 43px; margin-bottom: 11px; font-size: 14px; font-weight: 700; }
.price-row strong { font-size: 19px; }
.partner-price { display: flex; align-items: center; gap: 6px; margin-top: 4px; }
.partner-price span { padding: 3px 5px; border-radius: 4px; background: var(--mint-soft); color: #378363; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.partner-price b { color: #22845d; font-size: 12px; }.partner-price em { color: var(--muted); font-size: 9px; font-style: normal; }

.partner-banner { padding-top: 30px; }
.partner-banner__inner { display: grid; grid-template-columns: 1.08fr .92fr; min-height: 480px; border-radius: 30px; color: #fff; background: var(--ink); overflow: hidden; }
.partner-banner__copy { position: relative; padding: 62px; background: radial-gradient(circle at 15% 105%, rgba(117,223,187,.24), transparent 44%); }
.partner-label { display: inline-flex; padding: 6px 9px; margin-bottom: 20px; border-radius: 6px; color: var(--ink); background: var(--lime); font-size: 9px; font-weight: 900; letter-spacing: .12em; }
.partner-banner h2 { max-width: 590px; margin-bottom: 17px; font-size: 39px; }
.partner-banner__copy > p { max-width: 600px; color: rgba(255,255,255,.63); }
.partner-banner__price { display: flex; align-items: baseline; gap: 12px; margin: 28px 0; }.partner-banner__price strong { color: var(--lime); font-size: 30px; }.partner-banner__price span { color: rgba(255,255,255,.5); font-size: 10px; }
.partner-benefits { display: grid; grid-template-columns: 1fr 1fr; background: #20362f; }
.partner-benefits div { min-height: 240px; padding: 42px 34px; border: 1px solid rgba(255,255,255,.06); }
.partner-benefits span { display: block; margin-bottom: 28px; color: var(--lime); font-size: 11px; font-weight: 800; }.partner-benefits b { display: block; font-size: 16px; }.partner-benefits p { margin: 8px 0 0; color: rgba(255,255,255,.5); font-size: 11px; }
.steps-section { background: var(--soft); }
.steps-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 25px; margin-top: 45px; }
.steps-grid div { position: relative; padding: 36px; border-radius: 20px; background: #fff; box-shadow: 0 7px 20px rgba(20,35,30,.04); }
.steps-grid span { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 33px; border-radius: 50%; background: var(--lime); font-weight: 900; }.steps-grid h3 { font-size: 18px; }.steps-grid p { margin: 0; color: var(--muted); }
.dream-promo { padding-top: 0; background: var(--soft); }
.dream-promo__inner { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; padding: 35px 42px; border-radius: 22px; background: #dff3e9; }
.dream-promo__icon { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 20px; background: #fff; font-size: 33px; }.dream-promo h2 { margin: 2px 0 7px; font-size: 27px; }.dream-promo p { margin: 0; color: #60726a; }

.site-footer { padding-top: 64px; color: rgba(255,255,255,.7); background: #101e19; }
.site-footer .brand__tagline { color: #fff; }.footer-grid { display: grid; grid-template-columns: 1.6fr .8fr .8fr 1.1fr; gap: 60px; padding-bottom: 55px; }
.footer-brand p { max-width: 290px; margin: 18px 0 26px; font-size: 12px; }.site-footer h4 { margin-bottom: 18px; color: #fff; font-size: 13px; }.footer-grid > div:not(.footer-brand) > a { display: block; margin: 11px 0; font-size: 11px; }.socials { display: flex; gap: 8px; }.socials a { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.15); border-radius: 10px; font-size: 10px; font-weight: 800; }.footer-phone { color: var(--lime) !important; font-size: 16px !important; font-weight: 800; }.footer-contacts span { display: block; font-size: 9px; }.footer-contacts .btn { margin-top: 12px; color: #fff; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.09); }.footer-bottom { display: flex; align-items: center; justify-content: space-between; min-height: 68px; border-top: 1px solid rgba(255,255,255,.08); font-size: 9px; }.footer-bottom div { display: flex; gap: 25px; }

.breadcrumbs { display: flex; align-items: center; gap: 9px; margin-bottom: 25px; color: var(--muted); font-size: 10px; }.breadcrumbs b { color: var(--ink); font-weight: 600; }
.catalog-page, .cart-page, .product-page, .checkout-page { background: #fbfcfb; }
.catalog-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 30px; }.catalog-heading h1 { margin: 0; font-size: 38px; }.catalog-heading p { margin: 4px 0 0; color: var(--muted); }.filter-toggle { display: none; }
.catalog-layout { display: grid; grid-template-columns: 225px 1fr; gap: 28px; align-items: start; }.filters { padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: #fff; }.filter-head { display: flex; justify-content: space-between; padding-bottom: 17px; border-bottom: 1px solid var(--line); }.filter-head a { color: var(--muted); font-size: 9px; text-decoration: underline; }.filter-group { padding: 20px 0; border-bottom: 1px solid var(--line); }.filter-group:last-child { border: 0; }.filter-group h3 { margin-bottom: 14px; font-size: 12px; }.filter-group label { display: flex; gap: 8px; margin: 11px 0; color: #4e5d56; font-size: 11px; cursor: pointer; }.filter-group input[type="checkbox"], .filter-group input[type="radio"] { accent-color: var(--ink); }.price-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }.price-inputs input { width: 100%; height: 37px; padding: 0 9px; border: 1px solid var(--line); border-radius: 8px; outline: 0; }.range { width: 100%; margin-top: 14px; accent-color: #5db489; }.catalog-toolbar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }.chips { display: flex; flex-wrap: wrap; gap: 7px; }.chips a, .chips button { padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--muted); font-size: 10px; cursor: pointer; }.chips .active { color: #fff; border-color: var(--ink); background: var(--ink); }.catalog-toolbar select, .admin-content select { height: 38px; padding: 0 32px 0 12px; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--ink); font-size: 10px; }.product-grid--catalog { grid-template-columns: repeat(3,1fr); }
.empty-state { padding: 80px 30px; border: 1px dashed #cfd8d3; border-radius: 20px; background: #fff; text-align: center; }.empty-state > span { display: block; font-size: 48px; }.empty-state h2 { margin: 16px 0 8px; font-size: 24px; }.empty-state p { color: var(--muted); }

.product-detail { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; }.product-gallery { display: grid; grid-template-columns: 74px 1fr; gap: 13px; }.product-gallery__thumbs { display: flex; flex-direction: column; gap: 10px; }.product-gallery__thumbs button { width: 74px; height: 74px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: #fff; overflow: hidden; }.product-gallery__thumbs button.active { border: 2px solid var(--ink); }.product-gallery__thumbs img { width: 100%; height: 100%; border-radius: 8px; object-fit: cover; }.product-gallery__main { position: relative; min-height: 510px; border-radius: 22px; background: #edf1ef; overflow: hidden; }.product-gallery__main > img { width: 100%; height: 100%; object-fit: cover; }.product-info { padding-top: 7px; }.product-code { color: var(--muted); font-size: 9px; }.product-info h1 { margin: 10px 0 13px; font-size: 34px; }.product-rating { display: flex; gap: 16px; padding-bottom: 19px; border-bottom: 1px solid var(--line); font-size: 10px; }.product-rating span { color: #dc9d23; }.product-rating a { text-decoration: underline; }.product-rating b { color: #26835e; }.product-description { margin: 22px 0; color: #5f6d67; }.buy-box { padding: 23px; border-radius: 18px; background: #fff; box-shadow: 0 14px 35px rgba(20,35,30,.08); }.buy-box__prices { display: flex; align-items: flex-end; gap: 28px; }.buy-box__prices span, .buy-box__prices strong { display: block; }.buy-box__prices span { color: var(--muted); font-size: 9px; }.buy-box__prices strong { font-size: 29px; }.buy-box__prices .special strong { color: #209667; font-size: 20px; }.partner-hint { display: flex; align-items: center; gap: 9px; padding: 11px 13px; margin: 16px 0; border-radius: 10px; background: var(--mint-soft); }.partner-hint p { flex: 1; margin: 0; color: #4a6659; font-size: 9px; }.partner-hint a { font-size: 9px; font-weight: 800; text-decoration: underline; }.buy-actions { display: flex; gap: 9px; margin-top: 17px; }.buy-actions .btn { flex: 1; }.quantity { display: flex; align-items: center; height: 46px; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }.quantity button { width: 34px; height: 100%; border: 0; background: var(--soft); cursor: pointer; }.quantity input { width: 38px; height: 100%; padding: 0; border: 0; outline: 0; text-align: center; -moz-appearance: textfield; }.favorite-btn--large { position: static; width: 54px; height: 54px; border: 1px solid var(--line); box-shadow: none; font-size: 23px; }.product-perks { margin-top: 22px; }.product-perks > div { display: flex; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }.product-perks > div > span { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 10px; background: var(--soft); }.product-perks p, .product-perks b, .product-perks small { display: block; margin: 0; }.product-perks b { font-size: 10px; }.product-perks small { color: var(--muted); font-size: 8px; }.product-tabs { display: flex; gap: 40px; margin-top: 70px; border-bottom: 1px solid var(--line); }.product-tabs button { padding: 15px 0; border: 0; border-bottom: 2px solid transparent; background: none; font-weight: 800; cursor: pointer; }.product-tabs button.active { border-color: var(--ink); }.product-tab-content { display: grid; grid-template-columns: 1.2fr .8fr; gap: 70px; padding: 32px 0; }.product-tab-content p { color: var(--muted); }.product-tab-content dl { margin: 0; }.product-tab-content dl div { display: flex; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--line); }.product-tab-content dt { color: var(--muted); }.related { padding-top: 25px; }

.page-title-row h1 { font-size: 38px; }.page-title-row h1 small { color: var(--muted); font-size: 12px; font-weight: 500; }.cart-layout { display: grid; grid-template-columns: 1fr 340px; gap: 30px; align-items: start; }.cart-list { padding: 0 23px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }.cart-item { position: relative; display: grid; grid-template-columns: 95px 1fr auto 120px; align-items: center; gap: 18px; min-height: 142px; padding: 20px 35px 20px 0; border-bottom: 1px solid var(--line); }.cart-item > img { width: 95px; height: 95px; border-radius: 13px; object-fit: cover; }.cart-item__info span, .cart-item__info a, .cart-item__info small { display: block; }.cart-item__info span { color: #4c9875; font-size: 8px; text-transform: uppercase; }.cart-item__info a { margin: 5px 0; font-size: 13px; font-weight: 700; }.cart-item__info small { color: var(--muted); font-size: 8px; }.cart-item__price { text-align: right; }.cart-item__price strong, .cart-item__price span { display: block; }.cart-item__price strong { font-size: 16px; }.cart-item__price span { color: #269267; font-size: 8px; }.cart-remove { position: absolute; top: 18px; right: 0; border: 0; background: none; color: var(--muted); font-size: 21px; cursor: pointer; }.cart-membership { display: flex; align-items: center; gap: 13px; margin: 20px 0; padding: 16px; border-radius: 13px; background: var(--mint-soft); }.cart-membership > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: #fff; }.cart-membership div { flex: 1; }.cart-membership b, .cart-membership p { display: block; margin: 0; }.cart-membership b { font-size: 11px; }.cart-membership p { color: #627169; font-size: 8px; }.cart-membership a { font-size: 9px; font-weight: 800; }.order-summary { padding: 26px; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: 0 14px 35px rgba(20,35,30,.05); }.order-summary h2 { margin-bottom: 24px; font-size: 19px; }.order-summary > div:not(.promo):not(.checkout-product) { display: flex; justify-content: space-between; margin: 12px 0; color: #607068; font-size: 11px; }.order-summary .saving { color: #269267 !important; }.order-summary hr { height: 1px; margin: 20px 0; border: 0; background: var(--line); }.order-total strong { color: var(--ink); font-size: 23px; }.order-summary > small { display: block; margin: 10px 0; color: var(--muted); text-align: center; font-size: 8px; }.promo { display: flex; margin-top: 20px; }.promo input { min-width: 0; height: 41px; flex: 1; padding: 0 11px; border: 1px solid var(--line); border-radius: 9px 0 0 9px; }.promo button { border: 0; border-radius: 0 9px 9px 0; background: var(--soft); font-size: 9px; font-weight: 800; }.empty-state--cart { max-width: 650px; margin: 50px auto; }

.checkout-container { max-width: 1100px; }.checkout-container h1 { font-size: 36px; }.checkout-layout { display: grid; grid-template-columns: 1fr 340px; gap: 28px; align-items: start; }.checkout-main { display: grid; gap: 16px; }.checkout-card { display: grid; grid-template-columns: 38px 1fr; gap: 17px; padding: 27px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }.checkout-card__number { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 50%; background: var(--ink); color: #fff; font-weight: 800; }.checkout-card h2 { margin: 5px 0 20px; font-size: 20px; }.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.checkout-card label, .settings-form label, .admin-modal label { display: grid; gap: 6px; color: #58665f; font-size: 9px; font-weight: 700; }.checkout-card input, .checkout-card select, .settings-form input, .admin-modal input, .admin-modal textarea { width: 100%; height: 45px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; outline: 0; background: #fff; color: var(--ink); }.delivery-option { display: flex; align-items: center; gap: 12px; margin-top: 15px; padding: 13px; border: 1.5px solid #5cac84; border-radius: 11px; }.delivery-option div { flex: 1; }.delivery-option b, .delivery-option small { display: block; }.delivery-option small { color: var(--muted); font-size: 8px; }.payment-options { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; }.payment-options label { display: flex; align-items: center; gap: 8px; padding: 13px; border: 1px solid var(--line); border-radius: 10px; }.payment-options label:has(input:checked) { border-color: #59ad83; background: var(--mint-soft); }.payment-options input { width: auto; height: auto; accent-color: var(--ink); }.payment-options b, .payment-options small { display: block; }.payment-options small { color: var(--muted); font-size: 7px; }.checkout-summary { position: sticky; top: 20px; }.checkout-product { display: grid; grid-template-columns: 45px 1fr auto; align-items: center; gap: 9px; margin-bottom: 12px; }.checkout-product img { width: 45px; height: 45px; border-radius: 8px; object-fit: cover; }.checkout-product > span { font-size: 9px; }.checkout-product small { display: block; color: var(--muted); }.checkout-product b { font-size: 10px; }
.success-page { min-height: 570px; display: grid; place-items: center; background: var(--soft); }.success-card { max-width: 650px; margin: auto; padding: 60px; border-radius: 24px; background: #fff; box-shadow: var(--shadow); text-align: center; }.success-check { display: grid; place-items: center; width: 70px; height: 70px; margin: 0 auto 18px; border-radius: 50%; background: var(--lime); font-size: 32px; font-weight: 900; }.success-card > span { color: var(--muted); }.success-card h1 { margin: 8px 0; font-size: 35px; }.success-card p { color: var(--muted); }.success-card > div:last-child { display: flex; justify-content: center; gap: 10px; margin-top: 25px; }

.page-login .announcement, .page-login .site-header, .page-login .site-footer, .page-register .announcement, .page-register .site-header, .page-register .site-footer, .page-account .announcement, .page-account .site-header, .page-account .site-footer, .page-admin .announcement, .page-admin .site-header, .page-admin .site-footer { display: none; }
.auth-page { min-height: 100vh; padding: 22px; background: #edf3ef; }.auth-shell { display: grid; grid-template-columns: 1.05fr .95fr; width: min(1120px, 100%); min-height: calc(100vh - 44px); margin: auto; border-radius: 28px; background: #fff; box-shadow: var(--shadow); overflow: hidden; }.auth-panel { position: relative; display: flex; flex-direction: column; min-height: 700px; padding: 42px 52px; color: #fff; background: radial-gradient(circle at 75% 80%, rgba(185,245,74,.16), transparent 30%), linear-gradient(145deg, #10231c, #28483d); }.auth-panel::after { content: "Z"; position: absolute; right: -25px; bottom: -150px; color: rgba(255,255,255,.035); font-size: 520px; font-weight: 900; line-height: 1; }.auth-panel .brand { position: relative; z-index: 1; }.auth-panel .brand__text { color: #fff; }.auth-panel__top { display: flex; justify-content: space-between; align-items: center; }.auth-panel__top > a { color: rgba(255,255,255,.6); font-size: 9px; }.auth-panel__content { position: relative; z-index: 2; max-width: 450px; margin: auto 0; }.auth-panel__content h2 { margin: 0 0 20px; font-size: 42px; }.auth-panel__content > p { color: rgba(255,255,255,.59); font-size: 14px; }.auth-quote { display: flex; gap: 13px; margin-top: 60px; padding-top: 25px; border-top: 1px solid rgba(255,255,255,.12); }.auth-quote b, .auth-quote span { display: block; }.auth-quote b { max-width: 330px; font-size: 11px; }.auth-quote span { margin-top: 5px; color: rgba(255,255,255,.45); font-size: 8px; }.avatar { display: grid; place-items: center; flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; color: var(--ink); background: #dcebe3; font-size: 10px; font-weight: 900; }.avatar--large { width: 48px; height: 48px; font-size: 12px; }.auth-dots { position: relative; z-index: 2; display: flex; gap: 5px; }.auth-dots i { width: 6px; height: 6px; border-radius: 10px; background: rgba(255,255,255,.25); }.auth-dots i:first-child { width: 20px; background: var(--lime); }.auth-form-wrap { display: grid; place-items: center; padding: 45px; }.auth-form { width: min(410px,100%); }.auth-tabs { display: flex; margin-bottom: 38px; border-bottom: 1px solid var(--line); }.auth-tabs a { flex: 1; padding: 12px; color: var(--muted); border-bottom: 2px solid transparent; text-align: center; font-weight: 800; }.auth-tabs a.active { color: var(--ink); border-color: var(--ink); }.auth-form h1 { margin-bottom: 7px; font-size: 31px; }.auth-form > p { margin-bottom: 27px; color: var(--muted); }.auth-form form { display: grid; gap: 14px; }.auth-form label { display: grid; gap: 6px; color: #56645d; font-size: 9px; font-weight: 800; }.auth-form label small { color: var(--muted); font-weight: 500; }.auth-form input { width: 100%; height: 46px; padding: 0 13px; border: 1px solid var(--line); border-radius: 10px; outline: 0; }.auth-form input:focus { border-color: #6fb590; box-shadow: 0 0 0 3px rgba(117,223,187,.13); }.password-input { position: relative; }.password-toggle { position: absolute; top: 0; right: 0; height: 46px; padding: 0 12px; border: 0; background: none; color: #4e8e70; font-size: 8px; cursor: pointer; }.check-label { display: flex !important; grid-template-columns: auto 1fr; align-items: center; gap: 7px !important; }.check-label input { width: 15px; height: 15px; accent-color: var(--ink); }.form-between { display: flex; align-items: center; justify-content: space-between; }.form-between a { color: #3a8361; font-size: 9px; font-weight: 700; }.demo-access { display: flex; align-items: center; gap: 7px; padding: 10px; border-radius: 10px; background: var(--soft); }.demo-access b { margin-right: auto; font-size: 8px; }.demo-access button { padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; background: #fff; font-size: 8px; cursor: pointer; }

.info-page { min-height: 550px; background: linear-gradient(#f3f8f5,#fff); }.info-hero { max-width: 770px; padding: 55px 0; }.info-hero h1 { margin-bottom: 18px; font-size: 56px; }.info-hero p { color: var(--muted); font-size: 17px; }.info-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }.info-grid article { padding: 30px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }.info-grid article > span { font-size: 25px; }.info-grid h2 { margin: 25px 0 10px; }.info-grid p { margin: 0; color: var(--muted); }.error-page { min-height: 550px; background: var(--soft); text-align: center; }.error-code { color: #cae8d8; font-size: 150px; font-weight: 900; line-height: 1; }.error-page h1 { margin: -15px 0 10px; font-size: 38px; }.error-page p { color: var(--muted); }

/* Partner dashboard */
.page-account, .page-admin { background: #f3f6f4; }.dashboard-page { min-height: 100vh; }.dashboard-shell { display: grid; grid-template-columns: 238px 1fr; width: min(1500px,100%); min-height: 100vh; margin: 0; }.dashboard-sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; padding: 25px 18px; border-right: 1px solid var(--line); background: #fff; }.dashboard-sidebar > .brand { margin: 0 10px 26px; }.dashboard-profile { display: flex; align-items: center; gap: 10px; padding: 15px 10px; margin-bottom: 13px; border-radius: 13px; background: var(--soft); }.dashboard-profile b, .dashboard-profile span { display: block; }.dashboard-profile b { max-width: 125px; overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.dashboard-profile span { color: #4a9975; font-size: 8px; }.dashboard-nav { display: grid; gap: 3px; }.dashboard-nav button { position: relative; display: flex; align-items: center; gap: 11px; width: 100%; min-height: 43px; padding: 0 12px; border: 0; border-radius: 10px; background: transparent; color: #5b6862; font-size: 10px; font-weight: 700; text-align: left; cursor: pointer; }.dashboard-nav button:hover { background: var(--soft); }.dashboard-nav button.active { color: var(--ink); background: #eaf4ee; font-weight: 900; }.dashboard-nav button > span { width: 20px; color: #60756c; font-size: 17px; text-align: center; }.dashboard-nav button.active > span { color: #22825e; }.dashboard-nav button b { display: grid; place-items: center; width: 19px; height: 19px; margin-left: auto; border-radius: 50%; background: #e2e9e5; font-size: 8px; }.dashboard-nav button em { margin-left: auto; padding: 2px 5px; border-radius: 4px; background: var(--lime); font-size: 7px; font-style: normal; }.dashboard-nav button:disabled { opacity: .43; cursor: not-allowed; }.sidebar-help { margin-top: auto; padding: 14px; border-radius: 13px; background: #172a23; color: #fff; }.sidebar-help > span { display: grid; place-items: center; width: 27px; height: 27px; margin-bottom: 9px; border-radius: 50%; background: var(--lime); color: var(--ink); font-weight: 900; }.sidebar-help b { display: block; font-size: 10px; }.sidebar-help p { margin: 2px 0 9px; color: rgba(255,255,255,.5); font-size: 8px; }.sidebar-help button { padding: 0; border: 0; border-bottom: 1px solid var(--lime); color: var(--lime); background: none; font-size: 8px; cursor: pointer; }.logout-form button { width: 100%; padding: 14px 10px 0; border: 0; background: none; color: var(--muted); font-size: 9px; text-align: left; cursor: pointer; }.dashboard-content { min-width: 0; padding: 0 34px 55px; }.dashboard-topbar { display: flex; align-items: center; justify-content: space-between; min-height: 91px; margin-bottom: 22px; border-bottom: 1px solid var(--line); }.dashboard-topbar span { color: var(--muted); font-size: 8px; }.dashboard-topbar h1 { margin: 3px 0 0; font-size: 22px; }.dashboard-topbar__actions { display: flex; align-items: center; gap: 12px; }.dashboard-topbar__actions > a { font-size: 9px; font-weight: 800; }.notification-btn { position: relative; display: grid; place-items: center; width: 37px; height: 37px; border: 1px solid var(--line); border-radius: 10px; background: #fff; cursor: pointer; }.notification-btn i { position: absolute; top: 8px; right: 8px; width: 5px; height: 5px; border-radius: 50%; background: #ff685e; }.dashboard-panel { display: none; animation: panel-in .28s ease; }.dashboard-panel.active { display: block; } @keyframes panel-in { from { opacity: .3; transform: translateY(5px); } }
.activation-card { display: grid; grid-template-columns: 1fr auto; gap: 30px; padding: 30px; margin-bottom: 20px; border-radius: 19px; color: #fff; background: var(--ink); }.activation-card h2 { margin: 0 0 9px; font-size: 25px; }.activation-card p { color: rgba(255,255,255,.58); }.activation-card ul { display: flex; gap: 24px; padding: 0; margin: 18px 0 0; list-style: none; }.activation-card li { color: rgba(255,255,255,.72); font-size: 9px; }.activation-card li::before { content: "✓"; margin-right: 5px; color: var(--lime); }.activation-card form { display: flex; flex-direction: column; align-items: stretch; justify-content: center; min-width: 210px; padding-left: 30px; border-left: 1px solid rgba(255,255,255,.1); }.activation-card form div { margin-bottom: 15px; }.activation-card form span, .activation-card form strong, .activation-card form small { display: block; }.activation-card form span, .activation-card form small { color: rgba(255,255,255,.5); font-size: 8px; }.activation-card form strong { color: var(--lime); font-size: 25px; }
.dashboard-stat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }.dashboard-stat { position: relative; display: flex; align-items: flex-start; gap: 12px; min-height: 118px; padding: 20px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }.stat-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: #e9f6ef; color: #258260; font-size: 17px; font-weight: 900; }.dashboard-stat span, .dashboard-stat strong, .dashboard-stat small { display: block; }.dashboard-stat span { color: var(--muted); font-size: 8px; }.dashboard-stat strong { margin: 3px 0; font-size: 21px; }.dashboard-stat strong em { font-size: 10px; font-style: normal; }.dashboard-stat small { color: #31956d; font-size: 8px; }.dashboard-stat button { position: absolute; right: 12px; bottom: 12px; padding: 3px 7px; border: 0; border-radius: 5px; background: var(--lime); font-size: 7px; font-weight: 800; cursor: pointer; }.dashboard-main-grid { display: grid; grid-template-columns: 1.55fr .75fr; gap: 14px; margin-top: 14px; }.chart-card, .matrix-preview-card, .leader-card, .activity-card, .data-card { padding: 21px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }.card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }.card-head h2 { margin: 0; font-size: 15px; }.card-head p { margin: 3px 0 0; color: var(--muted); font-size: 8px; }.card-head > button, .card-head > a { padding: 0; border: 0; background: none; color: #438568; font-size: 8px; font-weight: 800; cursor: pointer; }.earnings-chart { position: relative; height: 245px; padding: 20px 5px 25px 34px; }.earnings-chart::before { content: ""; position: absolute; inset: 20px 5px 25px 34px; background: repeating-linear-gradient(to bottom, var(--line) 0 1px, transparent 1px 60px); }.earnings-chart svg { position: relative; width: 100%; height: 100%; overflow: visible; }.chart-area { fill: url(#chartFill); }.chart-line { fill: none; stroke: #3fb485; stroke-width: 3; vector-effect: non-scaling-stroke; }.chart-points circle { fill: #fff; stroke: #3fb485; stroke-width: 3; vector-effect: non-scaling-stroke; }.chart-y { position: absolute; top: 18px; bottom: 26px; left: 0; display: flex; flex-direction: column; justify-content: space-between; color: var(--muted); font-size: 7px; }.chart-x { position: absolute; left: 35px; right: 4px; bottom: 0; display: flex; justify-content: space-between; color: var(--muted); font-size: 7px; }.matrix-ring { --progress: 0; display: grid; place-items: center; width: 145px; height: 145px; margin: 24px auto 17px; border-radius: 50%; background: conic-gradient(#47bd8b calc(var(--progress)*1%), #e8efeb 0); }.matrix-ring::before { content: ""; position: absolute; width: 117px; height: 117px; border-radius: 50%; background: #fff; }.matrix-ring > div { position: relative; text-align: center; }.matrix-ring strong { display: block; font-size: 27px; }.matrix-ring strong small { color: var(--muted); font-size: 12px; }.matrix-ring span { color: var(--muted); font-size: 8px; }.matrix-mini-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.matrix-mini-stats div { padding: 10px; border-radius: 9px; background: var(--soft); }.matrix-mini-stats span, .matrix-mini-stats b { display: block; }.matrix-mini-stats span { color: var(--muted); font-size: 7px; }.matrix-mini-stats b { margin-top: 3px; font-size: 10px; }.dashboard-lower-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 14px; margin-top: 14px; }.countdown { padding: 6px 9px; border-radius: 7px; background: #fff4e8; color: #c17435 !important; font-weight: 800; }.pool-highlight { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 8px; margin: 15px 0; }.pool-highlight div { padding: 12px; border-radius: 9px; background: var(--soft); }.pool-highlight span, .pool-highlight strong { display: block; }.pool-highlight span { color: var(--muted); font-size: 7px; }.pool-highlight strong { margin-top: 2px; font-size: 13px; }.mini-leaderboard > div, .activity-list > div { display: flex; align-items: center; gap: 9px; min-height: 47px; border-top: 1px solid var(--line); }.mini-leaderboard > div > b { width: 15px; color: var(--muted); font-size: 8px; }.mini-leaderboard .avatar, .activity-list .activity-icon { width: 29px; height: 29px; }.mini-leaderboard p, .activity-list p { flex: 1; margin: 0; }.mini-leaderboard p strong, .mini-leaderboard p small, .activity-list p b, .activity-list p small { display: block; }.mini-leaderboard p strong, .activity-list p b { font-size: 9px; }.mini-leaderboard p small, .activity-list p small { color: var(--muted); font-size: 7px; }.mini-leaderboard em { color: #b0772b; font-size: 7px; font-style: normal; }.activity-icon { display: grid; place-items: center; border-radius: 8px; background: var(--mint-soft); color: #289268; }.activity-icon--withdrawal { background: #fff0ec; color: var(--danger); }.activity-list strong { font-size: 9px; }
.panel-heading { margin-bottom: 24px; }.panel-heading h2 { margin: 2px 0 5px; font-size: 27px; }.panel-heading p { margin: 0; color: var(--muted); }.panel-heading--between { display: flex; align-items: flex-end; justify-content: space-between; }.panel-heading--between > a { font-size: 9px; font-weight: 800; }.partner-status-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 28px; border-radius: 18px; color: #fff; background: linear-gradient(120deg,#142a22,#294c3e); }.partner-status-card__mark { display: grid; place-items: center; width: 70px; height: 70px; border: 1px solid rgba(185,245,74,.35); border-radius: 20px; background: rgba(185,245,74,.09); color: var(--lime); font-size: 29px; }.partner-status-card span { color: var(--lime); font-size: 7px; font-weight: 800; letter-spacing: .1em; }.partner-status-card h3 { margin: 6px 0 1px; font-size: 19px; }.partner-status-card p { margin: 0 0 8px; color: rgba(255,255,255,.5); font-size: 8px; }.partner-status-card > div:nth-child(2) > b { padding: 4px 7px; border-radius: 5px; background: rgba(255,255,255,.08); font-size: 8px; }.partner-status-card > div:last-child { min-width: 180px; padding-left: 25px; border-left: 1px solid rgba(255,255,255,.1); }.partner-status-card > div:last-child span, .partner-status-card > div:last-child strong, .partner-status-card > div:last-child a { display: block; }.partner-status-card > div:last-child strong { margin: 5px 0; font-size: 21px; }.partner-status-card > div:last-child a { color: var(--lime); font-size: 8px; }.referral-box { display: grid; grid-template-columns: 1fr auto; gap: 20px; margin: 16px 0; padding: 20px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }.referral-box > div > span { display: block; margin-bottom: 7px; font-size: 9px; font-weight: 800; }.referral-box > div > div { display: flex; }.referral-box input { min-width: 0; flex: 1; height: 42px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px 0 0 9px; background: var(--soft); color: var(--muted); font-size: 9px; }.referral-box button { padding: 0 15px; border: 0; border-radius: 0 9px 9px 0; background: var(--ink); color: #fff; font-size: 8px; font-weight: 800; }.referral-box small { display: block; margin-top: 7px; color: var(--muted); font-size: 7px; }.qr-placeholder { display: grid; place-items: center; width: 75px; height: 75px; border: 5px dotted var(--ink); text-align: center; }.qr-placeholder span { margin: 0 !important; font-weight: 900; line-height: 1; }.qr-placeholder small { margin: 0; }.benefit-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 14px; }.benefit-grid article { padding: 21px; border: 1px solid var(--line); border-radius: 14px; background: #fff; }.benefit-grid article > span { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 20px; border-radius: 11px; background: var(--mint-soft); color: #23805e; font-weight: 900; }.benefit-grid h3 { margin-bottom: 8px; font-size: 14px; }.benefit-grid p { min-height: 48px; color: var(--muted); font-size: 9px; }.benefit-grid article > b, .benefit-grid article > button { padding: 0; border: 0; background: none; color: #2e8d68; font-size: 8px; font-weight: 800; cursor: pointer; }
.matrix-legend { display: flex; gap: 12px; color: var(--muted); font-size: 8px; }.matrix-legend span { display: flex; align-items: center; gap: 5px; }.matrix-legend i { width: 9px; height: 9px; border: 1px solid #b8c5be; border-radius: 50%; }.matrix-legend i.filled { border-color: #43b985; background: #43b985; }.matrix-level-tabs { display: grid; grid-template-columns: repeat(4,1fr); gap: 11px; margin-bottom: 17px; }.matrix-level-tabs button { display: grid; gap: 3px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: #fff; text-align: left; cursor: pointer; }.matrix-level-tabs button.active { border-color: #4bab80; box-shadow: inset 0 0 0 1px #4bab80; }.matrix-level-tabs button.completed { border-color: #c5e7d7; background: #f3fbf7; }.matrix-level-tabs button.completed small { color: #2c8a62; font-weight: 800; }.matrix-level-tabs button.locked { opacity: .55; }.matrix-level-tabs span { color: #3c8b69; font-size: 7px; font-weight: 800; text-transform: uppercase; }.matrix-level-tabs b { font-size: 12px; }.matrix-level-tabs small { color: var(--muted); font-size: 7px; }.matrix-level-panel { display: none; }.matrix-level-panel.active { display: block; }.matrix-summary { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 10px; margin-bottom: 13px; }.matrix-summary > div { padding: 14px 17px; border: 1px solid var(--line); border-radius: 11px; background: #fff; }.matrix-summary span, .matrix-summary strong, .matrix-summary small { display: block; }.matrix-summary span { color: var(--muted); font-size: 7px; }.matrix-summary strong { margin: 3px 0; font-size: 13px; }.matrix-summary small { color: #529477; font-size: 7px; }.progress { height: 5px; margin-top: 8px; border-radius: 10px; background: #e7ede9; overflow: hidden; }.progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#7eddb8,#48b884); }.matrix-canvas { position: relative; min-height: 490px; padding: 35px 25px; border: 1px solid var(--line); border-radius: 16px; background: radial-gradient(circle at center,#fff 0,#f7faf8 80%); overflow: auto; }.matrix-row { position: relative; z-index: 2; display: flex; justify-content: space-around; min-width: 650px; margin-bottom: 28px; }.matrix-row:last-child { margin-bottom: 0; }.matrix-node { display: grid; justify-items: center; width: 69px; }.matrix-node > span { display: grid; place-items: center; width: 44px; height: 44px; border: 4px solid #fff; outline: 1px dashed #b8c6bf; border-radius: 50%; background: #fff; color: #91a099; box-shadow: 0 5px 12px rgba(20,35,30,.07); font-size: 9px; font-weight: 900; }.matrix-node.filled > span { outline: 2px solid #62c99e; background: #dff5eb; color: #217b5b; }.matrix-node.owner > span { width: 51px; height: 51px; outline: 3px solid var(--lime); background: var(--ink); color: #fff; }.matrix-node small { margin-top: 5px; color: var(--muted); font-size: 7px; white-space: nowrap; }.matrix-node.owner small { color: var(--ink); font-weight: 800; }.matrix-lines { position: absolute; inset: 0; opacity: .55; background: linear-gradient(90deg,transparent 49.9%,#b8c8c0 50%,transparent 50.1%) 50px 30px / calc(100% - 100px) 105px no-repeat; }.matrix-lines::before, .matrix-lines::after { content: ""; position: absolute; left: 25%; right: 25%; height: 1px; background: #b8c8c0; }.matrix-lines::before { top: 125px; }.matrix-lines::after { top: 233px; left: 12.5%; right: 12.5%; }.matrix-note { display: flex; gap: 10px; padding: 13px; margin-top: 12px; border-radius: 10px; background: #eef7f2; }.matrix-note > span { display: grid; place-items: center; flex: 0 0 auto; width: 22px; height: 22px; border-radius: 50%; background: #76cda6; color: #fff; font-weight: 800; }.matrix-note p { margin: 0; color: #5d6d65; font-size: 8px; }.locked-state { padding: 90px 25px; border: 1px dashed #cdd7d2; border-radius: 16px; background: #fff; text-align: center; }.locked-state > span { display: block; margin-bottom: 12px; font-size: 37px; }.locked-state h3 { margin-bottom: 8px; font-size: 20px; }.locked-state p { max-width: 440px; margin: 0 auto 20px; color: var(--muted); }
.team-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin-bottom: 14px; }.team-stats > div { padding: 20px; border: 1px solid var(--line); border-radius: 13px; background: #fff; }.team-stats span, .team-stats strong, .team-stats small { display: block; }.team-stats span { color: var(--muted); font-size: 8px; }.team-stats strong { font-size: 23px; }.team-stats small { color: #28916a; font-size: 8px; }.table-search { height: 36px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; outline: 0; font-size: 9px; }.table-wrap { width: 100%; overflow-x: auto; }table { width: 100%; border-collapse: collapse; }th { padding: 13px 11px; color: var(--muted); border-bottom: 1px solid var(--line); font-size: 7px; font-weight: 800; text-align: left; text-transform: uppercase; letter-spacing: .04em; }td { padding: 12px 11px; border-bottom: 1px solid #edf0ee; font-size: 9px; }td > small, td > b + small { display: block; color: var(--muted); font-size: 7px; }.user-cell { display: flex; align-items: center; gap: 8px; }.user-cell b, .user-cell small { display: block; }.user-cell b { font-size: 9px; }.user-cell small { color: var(--muted); font-size: 7px; }.status { display: inline-flex; align-items: center; padding: 4px 7px; border-radius: 6px; font-size: 7px; font-weight: 800; white-space: nowrap; }.status--success { color: #20815d; background: #e3f6ed; }.status--warning { color: #b26a29; background: #fff1df; }.status--muted { color: #6f7a75; background: #edf0ee; }.empty-cell { padding: 50px; color: var(--muted); text-align: center; }
.wallet-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 35px; padding: 30px; margin-bottom: 14px; border-radius: 17px; color: #fff; background: linear-gradient(120deg,#183329,#285445); }.wallet-hero > div span, .wallet-hero > div strong, .wallet-hero > div small { display: block; }.wallet-hero > div span, .wallet-hero > div small { color: rgba(255,255,255,.5); font-size: 8px; }.wallet-hero > div strong { color: var(--lime); font-size: 32px; }.wallet-hero form { display: flex; align-items: flex-end; gap: 9px; }.wallet-hero label { flex: 1; color: rgba(255,255,255,.6); font-size: 8px; }.wallet-hero input { display: block; width: 100%; height: 42px; margin-top: 5px; padding: 0 11px; border: 1px solid rgba(255,255,255,.15); border-radius: 9px; color: #fff; background: rgba(255,255,255,.08); }.orders-list { display: grid; gap: 12px; }.order-card { border: 1px solid var(--line); border-radius: 14px; background: #fff; }.order-card__head { display: flex; justify-content: space-between; padding: 15px 18px; border-bottom: 1px solid var(--line); }.order-card__head span, .order-card__head small { display: block; }.order-card__head > div > span { font-size: 11px; font-weight: 800; }.order-card__head small { color: var(--muted); font-size: 7px; }.order-card__body { display: grid; grid-template-columns: 1.1fr repeat(3,1fr) auto; align-items: center; gap: 15px; padding: 17px; }.order-thumbs { display: flex; }.order-thumbs img, .order-thumbs > span { width: 47px; height: 47px; margin-right: -8px; border: 3px solid #fff; border-radius: 10px; object-fit: cover; }.order-thumbs > span { display: grid; place-items: center; background: var(--soft); }.order-card__body > div > span, .order-card__body > div > strong, .order-card__body > div > b { display: block; }.order-card__body > div > span { color: var(--muted); font-size: 7px; }.order-card__body > div > strong, .order-card__body > div > b { max-width: 170px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.dream-editor-grid { display: grid; grid-template-columns: 1fr .8fr; gap: 17px; align-items: start; }.dream-form, .settings-form { padding: 24px; border: 1px solid var(--line); border-radius: 15px; background: #fff; }.dream-form { display: grid; gap: 16px; }.dream-form > label { display: grid; gap: 7px; color: #596860; font-size: 9px; font-weight: 800; }.dream-form input[type="text"], .dream-form textarea { width: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 9px; outline: 0; resize: vertical; }.dream-form label > small { color: var(--muted); text-align: right; font-size: 7px; }.emoji-options { display: flex; gap: 7px; }.emoji-options input { display: none; }.emoji-options span { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 9px; background: var(--soft); font-size: 20px; cursor: pointer; }.emoji-options label:has(input:checked) span { border-color: #4cac82; background: var(--mint-soft); }.dream-preview > span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 8px; }.dream-card { border: 1px solid var(--line); border-radius: 17px; background: #fff; overflow: hidden; }.dream-card__visual { position: relative; display: grid; place-items: center; height: 180px; background: linear-gradient(135deg,#dff6eb,#cfe7d9); }.dream-card__visual > span { font-size: 68px; filter: drop-shadow(0 10px 12px rgba(20,35,30,.14)); }.dream-card__visual em { position: absolute; top: 13px; right: 13px; display: grid; place-items: center; width: 33px; height: 33px; border-radius: 50%; color: #fff; background: var(--ink); font-size: 9px; font-style: normal; font-weight: 900; }.dream-card__visual > b { position: absolute; left: 12px; bottom: 12px; padding: 5px 8px; border-radius: 6px; background: var(--lime); font-size: 8px; }.dream-card__visual--2 { background: linear-gradient(135deg,#fbe7d7,#f8d2bc); }.dream-card__visual--3 { background: linear-gradient(135deg,#e9e1fb,#d8cef2); }.dream-card__visual--4 { background: linear-gradient(135deg,#dfeeff,#cbdff6); }.dream-card__body { padding: 18px; }.dream-card__body h3 { margin: 16px 0 8px; font-size: 16px; }.dream-card__body > p { min-height: 65px; color: var(--muted); font-size: 9px; }.dream-card__footer { display: flex; align-items: center; justify-content: space-between; padding-top: 13px; border-top: 1px solid var(--line); }.dream-card__footer button { padding: 6px 10px; border: 1px solid #dce3df; border-radius: 8px; background: #fff; font-size: 10px; cursor: pointer; }.dream-card__footer button.liked { color: #e65a68; border-color: #fac3ca; background: #fff2f4; }.dream-card__footer > span { color: var(--muted); font-size: 7px; }.profile-photo { display: flex; align-items: center; gap: 12px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--line); }.profile-photo b, .profile-photo small { display: block; }.profile-photo b { font-size: 10px; }.profile-photo small { color: var(--muted); font-size: 7px; }.profile-photo button { padding: 0; border: 0; background: none; color: #3b8967; font-size: 8px; font-weight: 800; }.settings-form .form-grid { margin-bottom: 18px; }.settings-form input:disabled { color: var(--muted); background: var(--soft); }

/* Dreams public */
.dreams-hero { color: #fff; background: radial-gradient(circle at 75% 20%,rgba(185,245,74,.15),transparent 26%),var(--ink); overflow: hidden; }.dreams-hero > .container { display: grid; grid-template-columns: 1fr 310px; align-items: center; min-height: 480px; }.dreams-hero h1 { margin: 6px 0 20px; font-size: 52px; }.dreams-hero h1 em { color: var(--lime); font-style: normal; }.dreams-hero p { max-width: 610px; color: rgba(255,255,255,.58); font-size: 15px; }.dreams-hero__actions { display: flex; align-items: center; gap: 20px; margin-top: 30px; }.dreams-hero__actions > span { color: rgba(255,255,255,.55); font-size: 9px; }.dreams-hero__actions b { color: #fff; }.dreams-hero__stat { position: relative; display: grid; place-items: center; align-content: center; width: 275px; height: 275px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; text-align: center; box-shadow: inset 0 0 0 25px rgba(255,255,255,.025); }.dreams-hero__stat > span, .dreams-hero__stat > strong, .dreams-hero__stat > small { display: block; }.dreams-hero__stat > span { color: rgba(255,255,255,.5); font-size: 9px; }.dreams-hero__stat > strong { color: var(--lime); font-size: 65px; line-height: 1; }.dreams-hero__stat > small { color: rgba(255,255,255,.55); font-size: 8px; }.dreams-hero__stat > div { position: absolute; right: -35px; bottom: 4px; display: flex; align-items: center; gap: 8px; padding: 12px 15px; border-radius: 13px; color: var(--ink); background: #fff; box-shadow: var(--shadow); }.dreams-hero__stat > div b { font-size: 22px; }.dreams-hero__stat > div span { color: var(--muted); font-size: 7px; text-align: left; }.dreams-toolbar { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 27px; }.dreams-toolbar h2 { margin-bottom: 4px; font-size: 32px; }.dreams-toolbar p { margin: 0; color: var(--muted); }.dream-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }.dream-rules { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin-top: 45px; padding: 28px; border-radius: 18px; background: var(--soft); }.dream-rules > div { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; }.dream-rules > div > span { grid-row: span 2; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: #fff; color: #3c9670; font-weight: 900; }.dream-rules h3 { margin: 2px 0; font-size: 12px; }.dream-rules p { margin: 0; color: var(--muted); font-size: 8px; }

/* Admin */
.admin-shell { display: grid; grid-template-columns: 220px 1fr; width: min(1600px,100%); min-height: 100vh; margin: 0; }.admin-sidebar { position: sticky; top: 0; display: flex; flex-direction: column; height: 100vh; color: rgba(255,255,255,.68); background: #11221c; }.admin-title { display: flex; align-items: center; gap: 10px; min-height: 76px; padding: 0 20px; border-bottom: 1px solid rgba(255,255,255,.07); }.admin-title > span { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; color: var(--ink); background: var(--lime); font-weight: 900; }.admin-title b, .admin-title small { display: block; }.admin-title b { color: #fff; font-size: 12px; }.admin-title small { font-size: 7px; }.admin-sidebar nav { display: grid; gap: 2px; padding: 16px 12px; }.admin-sidebar nav > small { padding: 17px 9px 7px; color: rgba(255,255,255,.28); font-size: 6px; font-weight: 800; letter-spacing: .13em; }.admin-sidebar nav a { display: flex; align-items: center; gap: 10px; min-height: 39px; padding: 0 10px; border-radius: 8px; font-size: 9px; font-weight: 700; }.admin-sidebar nav a > span { width: 19px; color: rgba(255,255,255,.45); font-size: 15px; text-align: center; }.admin-sidebar nav a > b { display: grid; place-items: center; min-width: 18px; height: 18px; margin-left: auto; border-radius: 10px; color: var(--ink); background: var(--lime); font-size: 7px; }.admin-sidebar nav a:hover, .admin-sidebar nav a.active { color: #fff; background: rgba(255,255,255,.08); }.admin-sidebar nav a.active > span { color: var(--lime); }.admin-sidebar__bottom { display: flex; align-items: center; gap: 8px; padding: 15px 17px; margin-top: auto; border-top: 1px solid rgba(255,255,255,.08); }.admin-sidebar__bottom div { min-width: 0; flex: 1; }.admin-sidebar__bottom b, .admin-sidebar__bottom small { display: block; }.admin-sidebar__bottom b { overflow: hidden; color: #fff; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.admin-sidebar__bottom small { font-size: 6px; }.admin-content { min-width: 0; padding: 0 30px 45px; }.admin-topbar { display: flex; align-items: center; justify-content: space-between; min-height: 77px; margin: 0 -30px 25px; padding: 0 30px; border-bottom: 1px solid var(--line); background: #fff; }.admin-topbar > div { display: flex; align-items: center; gap: 11px; }.admin-topbar span { color: var(--muted); font-size: 7px; }.admin-topbar h1 { margin: 1px 0 0; font-size: 19px; }.admin-topbar .avatar { width: 34px; height: 34px; }.admin-menu-toggle { display: none; }.admin-period, .admin-page-head { display: flex; align-items: center; justify-content: space-between; min-height: 42px; margin-bottom: 16px; }.admin-period span, .admin-page-head p { color: var(--muted); font-size: 8px; }.admin-period span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #4abe89; }.admin-stat-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 12px; }.admin-stat-grid.compact { margin-bottom: 16px; }.admin-stat-grid > article { display: flex; align-items: flex-start; gap: 11px; min-height: 100px; padding: 17px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }.admin-stat-icon { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 9px; font-weight: 900; }.admin-stat-icon.green { color: #278660; background: #e4f5ec; }.admin-stat-icon.blue { color: #457fc3; background: #e8f1fc; }.admin-stat-icon.purple { color: #7b62ca; background: #eeeafd; }.admin-stat-icon.orange { color: #c57639; background: #fff0e4; }.admin-stat-grid article > div > span, .admin-stat-grid article strong, .admin-stat-grid article small { display: block; }.admin-stat-grid article > div > span { color: var(--muted); font-size: 7px; }.admin-stat-grid article strong { margin: 3px 0; font-size: 18px; }.admin-stat-grid article small { color: var(--muted); font-size: 7px; }.admin-card { border: 1px solid var(--line); border-radius: 13px; background: #fff; }.admin-grid-main { display: grid; grid-template-columns: 1.55fr .65fr; gap: 12px; margin-bottom: 12px; }.revenue-card, .marketing-pool { padding: 19px; }.chart-legend { display: flex; gap: 10px; color: var(--muted); font-size: 7px; }.chart-legend span { display: flex; align-items: center; gap: 4px; }.chart-legend i { width: 7px; height: 7px; border-radius: 2px; background: #4fbd8d; }.chart-legend span:last-child i { background: #c0d8cc; }.admin-bars { position: relative; display: flex; align-items: flex-end; gap: 7%; height: 230px; padding: 25px 10px 20px 35px; background: repeating-linear-gradient(to bottom,transparent 0 55px,#edf0ee 55px 56px); }.bar-y { position: absolute; top: 20px; bottom: 25px; left: 0; display: flex; flex-direction: column; justify-content: space-between; color: var(--muted); font-size: 6px; }.bar-group { display: flex; flex-direction: column; justify-content: flex-end; width: 10%; height: 100%; }.bar-group > div { display: flex; align-items: flex-end; gap: 3px; height: 100%; }.bar-group i { flex: 1; border-radius: 4px 4px 0 0; background: #4dbc8d; }.bar-group i:last-child { background: #c4d9cf; }.bar-group > span { margin-top: 7px; color: var(--muted); font-size: 6px; white-space: nowrap; }.donut { display: grid; place-items: center; width: 135px; height: 135px; margin: 20px auto; border-radius: 50%; background: conic-gradient(#49ba8a 0 40%,#8c78e8 40% 100%); }.donut::before { content: ""; position: absolute; width: 101px; height: 101px; border-radius: 50%; background: #fff; }.donut > div { position: relative; text-align: center; }.donut strong, .donut span { display: block; }.donut strong { font-size: 11px; }.donut span { color: var(--muted); font-size: 6px; }.pool-lines > div { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 7px; margin: 9px 0; font-size: 7px; }.pool-lines i { width: 7px; height: 7px; border-radius: 2px; }.pool-lines i.green { background: #49ba8a; }.pool-lines i.purple { background: #8c78e8; }.pool-lines span { color: var(--muted); }.admin-grid-lower { display: grid; grid-template-columns: 1.2fr .8fr; gap: 12px; }.admin-grid-lower > article { padding: 19px; }.compact-orders > div { display: grid; grid-template-columns: 90px 1fr 80px 80px; align-items: center; min-height: 50px; border-bottom: 1px solid var(--line); font-size: 8px; }.compact-orders > div > span { color: #407d64; font-weight: 800; }.compact-orders b, .compact-orders small { display: block; }.compact-orders small { color: var(--muted); font-size: 6px; }.attention-list a { display: flex; align-items: center; gap: 9px; min-height: 61px; border-bottom: 1px solid var(--line); }.attention-list a > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px; }.attention-list span.orange { color: #bb7037; background: #fff1e4; }.attention-list span.green { color: #278660; background: #e4f5ec; }.attention-list span.purple { color: #7b62ca; background: #eeeafd; }.attention-list div { flex: 1; }.attention-list b, .attention-list small { display: block; }.attention-list b { font-size: 8px; }.attention-list small { color: var(--muted); font-size: 6px; }.attention-list > a > strong { font-size: 11px; }.admin-page-head .fund-badge { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 9px; color: #fff; background: var(--ink); }.fund-badge span { color: rgba(255,255,255,.5); font-size: 7px; }.fund-badge strong { color: var(--lime); }.admin-content .data-card { padding: 0; }.admin-content .data-card > .card-head, .table-toolbar { padding: 17px 19px; border-bottom: 1px solid var(--line); }.table-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }.table-toolbar .table-search { min-width: 230px; }.product-cell { display: flex; align-items: center; gap: 8px; }.product-cell img { width: 42px; height: 42px; border-radius: 8px; object-fit: cover; }.product-cell b, .product-cell small { display: block; }.product-cell b { font-size: 8px; }.product-cell small { color: var(--muted); font-size: 6px; }.stock { color: #278660; }.stock.low { color: #c27338; }.table-action { padding: 6px; border: 0; background: none; cursor: pointer; }.inline-status-form select { height: 31px; max-width: 105px; padding: 0 8px; }.admin-modal { width: min(720px,calc(100% - 30px)); padding: 0; border: 0; border-radius: 17px; box-shadow: 0 25px 80px rgba(0,0,0,.25); }.admin-modal::backdrop { background: rgba(11,22,18,.6); backdrop-filter: blur(3px); }.admin-modal form { padding: 25px; }.modal-head { display: flex; justify-content: space-between; margin-bottom: 23px; }.modal-head span { color: #438a6b; font-size: 8px; text-transform: uppercase; }.modal-head h2 { margin: 2px 0; }.modal-head button { border: 0; background: none; font-size: 24px; }.admin-modal textarea { height: auto; padding: 10px; }.admin-modal > form > label { margin-top: 14px; }.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }.matrix-level-chips { display: flex; gap: 5px; }.matrix-level-chips button { padding: 7px 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; font-size: 7px; }.matrix-level-chips button.active { color: #fff; background: var(--ink); }.table-progress { display: flex; align-items: center; gap: 6px; }.table-progress > div { width: 75px; height: 5px; border-radius: 5px; background: #e5ebe7; overflow: hidden; }.table-progress i { display: block; height: 100%; background: #54bd8e; }.table-progress span { color: var(--muted); font-size: 7px; }.dream-admin-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }.dream-admin-card { position: relative; padding: 18px; }.dream-rank { position: absolute; top: 12px; right: 12px; display: grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: var(--soft); font-size: 8px; font-weight: 900; }.dream-rank.top { background: var(--lime); }.dream-admin-emoji { display: grid; place-items: center; width: 100%; height: 105px; margin-bottom: 13px; border-radius: 11px; background: linear-gradient(135deg,#e5f6ed,#d1eadc); font-size: 45px; }.dream-admin-card h3 { margin: 15px 0 7px; font-size: 13px; }.dream-admin-card > p { min-height: 50px; color: var(--muted); font-size: 8px; }.dream-admin-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: 11px; border-top: 1px solid var(--line); }.dream-admin-bottom > strong { color: #e45f70; }.dream-admin-bottom form { display: flex; gap: 5px; }.dream-admin-bottom input { width: 78px; height: 30px; padding: 0 6px; border: 1px solid var(--line); border-radius: 7px; font-size: 7px; }.settings-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 14px; }.admin-content .settings-form { padding: 23px; }.admin-content .settings-form hr { height: 1px; margin: 25px 0; border: 0; background: var(--line); }.settings-side { padding: 23px; }.settings-side h2 { font-size: 16px; }.settings-side > div { display: flex; align-items: center; gap: 9px; padding: 11px 0; border-bottom: 1px solid var(--line); }.settings-side > div > span { display: grid; place-items: center; width: 31px; height: 31px; border-radius: 8px; color: #26825f; background: var(--mint-soft); font-weight: 900; }.settings-side p { flex: 1; margin: 0; }.settings-side b, .settings-side small { display: block; }.settings-side b { font-size: 9px; }.settings-side small { color: var(--muted); font-size: 7px; }.settings-side em { color: #408567; font-size: 7px; font-style: normal; }.settings-note { margin-top: 17px !important; padding: 11px; border-radius: 8px; color: var(--muted); background: var(--soft); font-size: 7px; }

.support-widget { position: fixed; z-index: 500; right: 22px; bottom: 22px; width: 320px; border-radius: 16px; background: #fff; box-shadow: 0 20px 70px rgba(0,0,0,.2); overflow: hidden; }.support-widget__head { display: flex; justify-content: space-between; padding: 15px; color: #fff; background: var(--ink); }.support-widget__head b, .support-widget__head span { display: block; }.support-widget__head b { font-size: 11px; }.support-widget__head span { color: rgba(255,255,255,.5); font-size: 7px; }.support-widget__head button { border: 0; color: #fff; background: none; font-size: 20px; }.support-widget__body { min-height: 150px; padding: 17px; background: var(--soft); }.support-widget__body p { display: inline-block; padding: 10px 12px; border-radius: 10px; background: #fff; font-size: 9px; }.support-widget__form { display: flex; padding: 10px; }.support-widget__form input { flex: 1; min-width: 0; border: 0; outline: 0; }.support-widget__form button { width: 35px; height: 35px; border: 0; border-radius: 9px; background: var(--lime); }

.auth-panel .brand__tagline { color: #fff; }

@media (max-width: 1100px) {
    .main-nav__inner { gap: 17px; overflow-x: auto; }.header-main { gap: 20px; }.hero__grid { grid-template-columns: 1fr 1fr; }.hero-product--main { width: 360px; }.product-grid { grid-template-columns: repeat(3,1fr); }.product-grid > article:nth-child(4) { display: none; }.partner-banner__copy { padding: 45px; }.dashboard-stat-grid { grid-template-columns: 1fr 1fr; }.benefit-grid { grid-template-columns: 1fr 1fr; }.admin-stat-grid { grid-template-columns: 1fr 1fr; }.admin-grid-main, .admin-grid-lower { grid-template-columns: 1fr; }.dream-admin-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 820px) {
    .dashboard-sidebar .brand__tagline { display: none; }
    .dashboard-sidebar .brand__word { font-size: 18px; }
    .container { width: min(100% - 28px,1220px); }.announcement__inner span:nth-child(2) { display: none; }.header-main { height: 68px; }.header-search { display: none; }.header-actions { margin-left: auto; }.icon-action:not(.cart-action) { display: none; }.mobile-menu-toggle { display: block; }.main-nav { position: fixed; inset: 68px 0 0; display: none; padding: 20px; background: #fff; }.menu-open .main-nav { display: block; }.main-nav__inner { display: grid; align-content: start; height: auto; overflow: visible; }.main-nav a { padding: 12px; }.catalog-link { min-height: 45px; }.hero { min-height: auto; }.hero__grid { grid-template-columns: 1fr; padding: 65px 0; }.hero__visual { display: none; }.hero h1 { font-size: 55px; }.category-strip { margin-top: 0; padding: 20px 0; }.category-grid { grid-template-columns: 1fr 1fr; }.product-grid, .product-grid--catalog { grid-template-columns: 1fr 1fr; }.partner-banner__inner { grid-template-columns: 1fr; }.partner-benefits div { min-height: 190px; }.steps-grid { grid-template-columns: 1fr; }.dream-promo__inner { grid-template-columns: auto 1fr; }.dream-promo__inner > a { grid-column: 2; justify-self: start; }.footer-grid { grid-template-columns: 1.3fr 1fr; }.catalog-layout { grid-template-columns: 1fr; }.filters { display: none; }.filters.open { display: block; }.filter-toggle { display: inline-flex; }.catalog-toolbar { align-items: flex-end; }.catalog-toolbar .chips { max-width: 70%; }.product-detail { grid-template-columns: 1fr; }.product-gallery__main { min-height: 430px; }.cart-layout, .checkout-layout { grid-template-columns: 1fr; }.order-summary { position: static; }.auth-shell { grid-template-columns: 1fr; }.auth-panel { display: none; }.auth-page { padding: 0; }.auth-form-wrap { min-height: 100vh; }.info-grid { grid-template-columns: 1fr; }.dashboard-shell { grid-template-columns: 78px 1fr; }.dashboard-sidebar { padding: 17px 10px; }.dashboard-sidebar .brand__text, .dashboard-profile > div:last-child, .dashboard-nav button:not(.active)::after, .dashboard-nav button { font-size: 0; }.dashboard-sidebar .brand { margin: 0 auto 20px; }.dashboard-profile { justify-content: center; padding: 8px; }.dashboard-nav button { justify-content: center; padding: 0; }.dashboard-nav button > span { font-size: 18px; }.dashboard-nav button b, .dashboard-nav button em, .sidebar-help, .logout-form { display: none; }.dashboard-content { padding-inline: 18px; }.dashboard-main-grid, .dashboard-lower-grid { grid-template-columns: 1fr; }.matrix-level-tabs { grid-template-columns: 1fr 1fr; }.matrix-summary { grid-template-columns: 1fr; }.benefit-grid, .team-stats { grid-template-columns: 1fr 1fr; }.order-card__body { grid-template-columns: 1fr 1fr; }.dream-editor-grid { grid-template-columns: 1fr; }.dreams-hero > .container { grid-template-columns: 1fr; padding: 60px 0; }.dreams-hero__stat { display: none; }.dream-grid { grid-template-columns: 1fr 1fr; }.dream-rules { grid-template-columns: 1fr; }.admin-shell { grid-template-columns: 76px 1fr; }.admin-title { padding: 0; justify-content: center; }.admin-title div, .admin-sidebar nav small, .admin-sidebar nav a:not(.active)::after, .admin-sidebar nav a { font-size: 0; }.admin-sidebar nav a { justify-content: center; padding: 0; }.admin-sidebar nav a > span { font-size: 16px; }.admin-sidebar nav a > b { position: absolute; transform: translate(12px,-10px); }.admin-sidebar__bottom div, .admin-sidebar__bottom a { display: none; }.admin-content { padding-inline: 18px; }.admin-topbar { margin-inline: -18px; padding-inline: 18px; }.admin-grid-main, .settings-grid { grid-template-columns: 1fr; }.admin-content .form-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
    .section { padding: 55px 0; }.hero__grid { padding: 48px 0; }.hero h1 { font-size: 42px; }.hero__trust { gap: 13px; }.hero__trust div { padding-right: 13px; }.category-grid { grid-template-columns: 1fr; }.product-grid, .product-grid--catalog { grid-template-columns: 1fr 1fr; gap: 10px; }.product-card__body { padding: 12px; }.product-card__media { aspect-ratio: 1; }.product-card__title { font-size: 11px; }.btn--cart { font-size: 10px; }.partner-banner__copy { padding: 30px 24px; }.partner-banner h2 { font-size: 29px; }.partner-benefits { grid-template-columns: 1fr; }.partner-benefits div { min-height: 150px; padding: 28px; }.dream-promo__inner { grid-template-columns: 1fr; text-align: center; }.dream-promo__icon { margin: auto; }.dream-promo__inner > a { grid-column: auto; justify-self: center; }.footer-grid { grid-template-columns: 1fr; gap: 25px; }.footer-bottom { flex-direction: column; justify-content: center; gap: 8px; }.footer-bottom div { gap: 10px; }.catalog-toolbar { display: grid; gap: 13px; }.catalog-toolbar .chips { max-width: 100%; }.product-gallery { grid-template-columns: 1fr; }.product-gallery__thumbs { order: 2; flex-direction: row; }.product-gallery__main { min-height: 330px; }.product-info h1 { font-size: 28px; }.buy-actions { flex-wrap: wrap; }.buy-actions .btn { flex-basis: 60%; }.product-tab-content { grid-template-columns: 1fr; gap: 20px; }.cart-item { grid-template-columns: 75px 1fr; padding: 15px 25px 15px 0; }.cart-item > img { width: 75px; height: 75px; }.cart-item .quantity { grid-column: 1; }.cart-item__price { text-align: left; }.cart-membership { align-items: flex-start; flex-wrap: wrap; }.form-grid, .payment-options { grid-template-columns: 1fr; }.success-card { padding: 38px 22px; }.success-card > div:last-child { flex-direction: column; }.auth-form-wrap { padding: 30px 20px; }.info-hero h1 { font-size: 42px; }.dashboard-shell { display: block; }.dashboard-sidebar { position: fixed; z-index: 100; top: auto; bottom: 0; left: 0; right: 0; display: block; width: 100%; height: 64px; padding: 6px; border: 0; border-top: 1px solid var(--line); }.dashboard-sidebar > .brand, .dashboard-profile, .sidebar-help, .logout-form, .dashboard-nav button:nth-child(4), .dashboard-nav button:nth-child(5), .dashboard-nav button:nth-child(8) { display: none; }.dashboard-nav { display: grid; grid-template-columns: repeat(5,1fr); }.dashboard-nav button { display: flex; min-height: 50px; }.dashboard-nav button::after { content: attr(data-dashboard-nav); display: block !important; font-size: 6px !important; }.dashboard-content { padding: 0 12px 85px; }.dashboard-topbar { min-height: 70px; }.dashboard-topbar__actions > a, .dashboard-topbar__actions .notification-btn { display: none; }.dashboard-stat-grid { grid-template-columns: 1fr 1fr; gap: 8px; }.dashboard-stat { min-height: 105px; padding: 13px; }.dashboard-stat .stat-icon { display: none; }.dashboard-stat strong { font-size: 17px; }.activation-card { grid-template-columns: 1fr; }.activation-card ul { flex-direction: column; gap: 5px; }.activation-card form { padding: 20px 0 0; border: 0; border-top: 1px solid rgba(255,255,255,.1); }.chart-card { padding: 14px; }.earnings-chart { height: 210px; }.pool-highlight { grid-template-columns: 1fr; }.panel-heading--between { align-items: flex-start; flex-direction: column; }.partner-status-card { grid-template-columns: auto 1fr; }.partner-status-card > div:last-child { grid-column: span 2; padding: 15px 0 0; border: 0; border-top: 1px solid rgba(255,255,255,.1); }.referral-box { grid-template-columns: 1fr; }.qr-placeholder { display: none; }.benefit-grid, .team-stats { grid-template-columns: 1fr; }.matrix-level-tabs { grid-template-columns: 1fr 1fr; }.matrix-canvas { padding-inline: 0; }.wallet-hero { grid-template-columns: 1fr; }.wallet-hero form { flex-direction: column; align-items: stretch; }.order-card__body { grid-template-columns: 1fr; }.dream-grid { grid-template-columns: 1fr; }.dreams-hero h1 { font-size: 39px; }.dreams-hero__actions { align-items: flex-start; flex-direction: column; }.dreams-toolbar { align-items: flex-start; flex-direction: column; gap: 14px; }.admin-shell { display: block; }.admin-sidebar { position: fixed; z-index: 90; top: auto; bottom: 0; width: 100%; height: 62px; }.admin-title, .admin-sidebar nav small, .admin-sidebar__bottom, .admin-sidebar nav a:nth-of-type(n+6) { display: none; }.admin-sidebar nav { grid-template-columns: repeat(5,1fr); padding: 6px; }.admin-sidebar nav a { display: flex; min-height: 48px; }.admin-content { padding: 0 10px 75px; }.admin-topbar { margin-inline: -10px; padding-inline: 12px; }.admin-topbar .btn { display: none; }.admin-stat-grid { grid-template-columns: 1fr 1fr; gap: 7px; }.admin-stat-grid > article { padding: 12px; }.admin-stat-icon { display: none; }.admin-stat-grid article strong { font-size: 15px; }.admin-bars { gap: 4%; }.table-toolbar { align-items: stretch; flex-direction: column; }.table-toolbar .table-search { min-width: 0; }.dream-admin-grid { grid-template-columns: 1fr; }.support-widget { right: 10px; bottom: 75px; width: calc(100% - 20px); }
}

/* UX fixes and functional states */
.product-tab-content:not(.active) { display: none; }
.product-tab-content.active { display: grid; }
[data-product-tab-panel] { grid-template-columns: 1fr; }
.period-badge { padding: 6px 9px; border-radius: 7px; color: var(--muted); background: var(--soft); font-size: 8px; font-weight: 800; }
.filters > .btn { margin-top: 16px; }
.btn:disabled { opacity: .48; cursor: not-allowed; transform: none; box-shadow: none; }
.order-card__details { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; padding: 15px 18px; border-top: 1px solid var(--line); background: var(--soft); }
.order-card__details div { padding: 10px; border-radius: 9px; background: #fff; }
.order-card__details span, .order-card__details b { display: block; }
.order-card__details span { color: var(--muted); font-size: 7px; }
.order-card__details b { margin-top: 3px; font-size: 9px; }
.dream-grid.is-new .dream-card__visual em, .dream-grid.is-new .dream-card__visual > b { display: none; }

@media (max-width: 1100px) {
    .product-grid > article:nth-child(4) { display: block; }
}

@media (max-width: 820px) {
    .main-nav { inset: 102px 0 0; }
    .main-nav a::after { display: none !important; }
}

@media (max-width: 560px) {
    .dashboard-sidebar, .admin-sidebar { height: 70px; }
    .dashboard-nav, .admin-sidebar nav { display: flex; grid-template-columns: none; gap: 2px; width: 100%; padding: 3px; overflow-x: auto; scrollbar-width: none; }
    .dashboard-nav::-webkit-scrollbar, .admin-sidebar nav::-webkit-scrollbar { display: none; }
    .dashboard-nav button, .admin-sidebar nav a, .dashboard-nav button:nth-child(4), .dashboard-nav button:nth-child(5), .dashboard-nav button:nth-child(8), .admin-sidebar nav a:nth-of-type(n+6) { display: flex; flex: 0 0 62px; flex-direction: column; justify-content: center; gap: 1px; min-height: 58px; padding: 2px; font-size: 0; }
    .dashboard-nav button::after, .admin-sidebar nav a::after { content: attr(data-label); display: block !important; color: currentColor; font-size: 6px !important; line-height: 1; white-space: nowrap; }
    .dashboard-nav button > span, .admin-sidebar nav a > span { width: auto; font-size: 16px; }
    .dashboard-nav button b, .dashboard-nav button em, .admin-sidebar nav a > b { display: none; }
    .dashboard-content, .admin-content { padding-bottom: 88px; }
    .order-card__details { grid-template-columns: 1fr; }
}