/* S.T.A.L.K.E.R. 2 Wiki — Card Exchange — ATB Style */
*{margin:0;padding:0;box-sizing:border-box;}
.ce-body{min-height:100vh;width:100%;max-width:100vw;background:#0c0905;font-family:'Rubik','Segoe UI',sans-serif;color:#e8dcc8;scrollbar-color:rgba(200,120,32,.3) rgba(15,10,4,.5);scrollbar-width:thin;}
/* Custom scrollbar — Webkit (Chrome, Safari, Edge) */
.ce-body::-webkit-scrollbar{width:8px;}
.ce-body::-webkit-scrollbar-track{background:rgba(15,10,4,.5);}
.ce-body::-webkit-scrollbar-thumb{background:rgba(200,120,32,.3);border-radius:4px;}
.ce-body::-webkit-scrollbar-thumb:hover{background:rgba(200,120,32,.5);}

/* Scrollbar for selects and overflow elements */
.ce-select::-webkit-scrollbar{width:6px;}
.ce-select::-webkit-scrollbar-track{background:rgba(15,10,4,.8);}
.ce-select::-webkit-scrollbar-thumb{background:rgba(200,120,32,.3);border-radius:3px;}

/* Cross-browser resets */
.ce-body select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c87820' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;}
.ce-body input[type="checkbox"]{width:16px;height:16px;cursor:pointer;}

/* Selection color */
.ce-body ::selection{background:rgba(200,120,32,.3);color:#fff;}
.ce-body ::-moz-selection{background:rgba(200,120,32,.3);color:#fff;}

/* ═══ HERO ═══ */
.ce-hero{position:relative;height:700px;overflow:hidden;}
.ce-hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;}
.ce-hero-sign{position:absolute;right:12%;top:15%;width:650px;height:650px;animation:signPulse 6s ease-in-out infinite;z-index:1;}
@keyframes signPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.03);}}
.ce-hero-person{position:absolute;right:36%;bottom:-75px;max-height:700px;z-index:2;transition:transform .15s ease-out;will-change:transform;}
.ce-hero-flowers{position:absolute;z-index:3;pointer-events:none;will-change:transform;transform-origin:center bottom;}
.ce-hero-flowers--left{bottom:-12px;left:-20px;width:480px;transition:transform .35s cubic-bezier(0.22,1,0.36,1);}
.ce-hero-flowers--center{bottom:-30px;right:50%;z-index:1;transition:transform .18s cubic-bezier(0.34,1.56,0.64,1);}
.ce-hero-flowers--right{bottom:-8px;right:-24px;width:400px;z-index:1;transition:transform .55s cubic-bezier(0.22,1,0.36,1);}
.ce-hero-fade{position:absolute;bottom:0;left:0;right:0;height:200px;background:linear-gradient(to top,#0c0905,transparent);z-index:4;}
.ce-hero-content{position:relative;z-index:5;max-width:1100px;margin:0 auto;padding:46px 24px 0;}

.ce-back{display:inline-flex;align-items:center;gap:6px;color:#e8dcc8;text-decoration:none;font-size:14px;font-weight:400;letter-spacing:1.5px;text-transform:uppercase;transition:color .2s;}

/* Hero top row: back button + user widget */
.ce-hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;flex-wrap:wrap;}
.ce-hero-user{display:inline-flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;background:rgba(0,0,0,.45);backdrop-filter:blur(12px);border:1px solid rgba(232,160,48,.18);border-radius:30px;text-decoration:none;color:inherit;transition:all .25s;position:relative;overflow:hidden;}
.ce-hero-user::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#ffa20c,transparent);}
.ce-hero-user:hover{border-color:rgba(232,160,48,.4);background:rgba(0,0,0,.6);transform:translateY(-1px);}
.ce-hero-user-avatar{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid rgba(232,160,48,.25);flex-shrink:0;}
.ce-hero-user-info{display:flex;flex-direction:column;line-height:1.2;}
.ce-hero-user-name{font-family:'Oswald',sans-serif;font-size:13px;font-weight:700;color:#e8dcc8;letter-spacing:.5px;text-transform:uppercase;}
.ce-hero-user-login{font-family:'Rubik',sans-serif;font-size:11px;}

/* Група юзер-віджет + кнопка виходу */
.ce-hero-user-group{display:inline-flex;align-items:center;gap:8px;}
.ce-hero-logout-btn{display:inline-flex;align-items:center;justify-content:center;width:50px;height:50px;background:rgba(0,0,0,.45);backdrop-filter:blur(12px);border:1px solid rgba(232,160,48,.18);border-radius:50%;text-decoration:none;transition:all .25s;position:relative;overflow:hidden;flex-shrink:0;}
.ce-hero-logout-btn::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#ffa20c,transparent);}
.ce-hero-logout-ic{width:24px;height:24px;transition:filter .25s;}
.ce-back:hover{color:#e8a030;}
.ce-hero-label{font-family:'Oswald',sans-serif;font-size:16px;font-weight:400;letter-spacing:5px;text-transform:uppercase;margin-top:100px;filter: drop-shadow(5px 0 10px rgba(0, 0, 0, 0.4));}
.ce-hero-dates{font-family:'Oswald',sans-serif;font-size:16px;font-weight:500;color:#ffa20c;margin-top:0;filter: drop-shadow(5px 0 10px rgba(0, 0, 0, 0.4));}
.ce-hero-title{font-family:'Oswald',sans-serif;font-size:58px;line-height:.95;text-transform:uppercase;letter-spacing:3px;margin:10px 0 16px;text-shadow:0 4px 30px rgba(0,0,0,.5);}
.ce-hero-desc{font-size:15px;line-height:1.7;max-width:420px;}

/* Stats */
.ce-stats{display:flex;gap:10px;margin-top:50px;filter:drop-shadow(-15px 0 40px rgba(0,0,0,0.4));}
.ce-stat{display:flex;flex-direction:column;align-items:center;background:rgba(0,0,0,.4);backdrop-filter:blur(12px);border-radius:12px;padding:14px 22px;text-align:center;min-width:95px;position:relative;overflow:hidden;}
.ce-stat::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.5),transparent);}

/* Order button */
.ce-stat-order{display:flex;align-items:center;gap:10px;background:#ffa20c;backdrop-filter:blur(12px);border-radius:12px;padding:14px 22px;border:1px solid rgba(232,160,48,.4);text-decoration:none;transition:all .2s;color:#232323;cursor:pointer;}
.ce-stat-order:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(200,120,32,.3);}
.ce-stat-order-icon{width:28px;height:28px;flex-shrink:0;}
.ce-stat-order-text{display:flex;flex-direction:column;font-family:'Oswald',sans-serif;font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:1px;line-height:1.1;}
.ce-stat-order-text small{font-family:'Rubik',sans-serif;font-size:9px;font-weight:400;text-transform:none;letter-spacing:.5px;opacity:.7;margin-top:3px;}
.ce-stat-value{font-family:'Oswald',sans-serif;font-size:30px;font-weight:800;color:#ffa20c;line-height:1;display:block;}
.ce-stat-label{font-size:10px;text-transform:uppercase;letter-spacing:2px;margin-top:8px;display:block;}

/* ═══ MAIN ═══ */
.ce-main{max-width:1100px;margin:0 auto;padding:0 24px 60px;}

/* Tabs */
.ce-tabs{display:flex;gap:8px;justify-content:center;margin:32px 0;flex-wrap:wrap;}
.ce-tab-content{min-height:300px;}
.ce-tab{font-family:'Oswald',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.3px;padding:11px 24px;border-radius:10px;cursor:pointer;border:1px solid rgba(200,120,32,.1);background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(0,0,0,.15));color:#6a5a40;transition:all .25s;position:relative;overflow:hidden;}
.ce-tab:hover{border-color:rgba(200,120,32,.25);color:#c8a060;}
.ce-tab--active{background:linear-gradient(180deg,rgba(200,120,32,.18),rgba(200,120,32,.05));border-color:#ffa20c;color:#ffa20c;box-shadow:0 0 16px rgba(232,160,48,.15),inset 0 1px 0 rgba(232,160,48,.2);}

/* Filter */
.ce-select{font-family:'Rubik',sans-serif;font-size:13px;padding:10px 16px;background:rgba(200,120,32,.04);border:1px solid rgba(200,120,32,.1);border-radius:8px;color:#ffa20c;min-width:160px;outline:none;appearance:none;-webkit-appearance:none;cursor:pointer;transition:border-color .3s;}
.ce-select:focus{border-color:#c87820;}
.ce-select option{background:#0f0a04;color:#e8dcc8;}
.ce-btn-accent{font-family:'Oswald',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:10px 28px;background:#ffa20c;border:none;border-radius:8px;color:#0f0a04;cursor:pointer;transition:background .2s;text-decoration:none;display:inline-block;}
.ce-btn-accent:hover{background:#e8a030;}

/* Grid */
.ce-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:18px;}
.ce-grid--s{max-width:440px;margin:0 auto;}

/* Card */
.ce-card{background:linear-gradient(135deg,rgba(200,120,32,.03),rgba(0,0,0,.2));border:1px solid rgba(200,120,32,.08);border-radius:16px;padding:24px 14px 14px;position:relative;overflow:visible;transition:border-color .3s,transform .25s,box-shadow .3s;}
.ce-card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.4),transparent);border-radius:16px 16px 0 0;}
.ce-card::after{content:'';position:absolute;inset:-1px;border-radius:16px;padding:1px;background:linear-gradient(135deg,rgba(200,120,32,.15),transparent 30%,transparent 70%,rgba(200,120,32,.08));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .3s;pointer-events:none;}
.ce-card:hover{border-color:rgba(200,120,32,.18);transform:translateY(-3px);box-shadow:0 12px 32px rgba(0,0,0,.3);}
.ce-card:hover::after{opacity:1;}
.ce-card--match{border-color:rgba(232,160,48,.25);background:linear-gradient(135deg,rgba(232,160,48,.05),rgba(0,0,0,.2));}
.ce-card--match::before{background:linear-gradient(90deg,transparent,rgba(232,160,48,.6),transparent);}

.ce-card-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.ce-card-av{width:38px;height:38px;border-radius:50%;object-fit:cover;}
.ce-card-av-ph{width:38px;height:38px;border-radius:50%;background:rgba(200,120,32,.08);display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-size:15px;color:#c87820;border:2px solid rgba(200,120,32,.12);}
.ce-card-name{font-family:'Oswald',sans-serif;font-size:16px;font-weight:500;color:#e8dcc8 !important;text-decoration:none;transition:color .2s;}
.ce-card-name:hover{color:#e8a030;}
.ce-card-user{flex:1;min-width:0;}
.ce-card-meta{font-size:11px;color:#6a5a40;display:flex;gap:6px;align-items:center;margin-top:0;flex-wrap:wrap;}
.ce-card-city{color:#c87820;}

.ce-badge-np{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.4px;background:rgba(200,120,32,.1);color:#c87820;padding:2px 6px;border-radius:4px;}
.ce-badge-np-icon{width:10px;height:10px;object-fit:contain;}
.ce-match-badge{position:absolute;top:14px;right:14px;font-family:'Oswald',sans-serif;font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#e8a030;background:rgba(200,120,32,.1);padding:4px 12px;border-radius:6px;}

.ce-card-sec{margin-bottom:12px;}
.ce-card-lbl{font-family:'Oswald',sans-serif;font-size:13px;font-weight:500;text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;}
.ce-card-nums{display:flex;flex-wrap:wrap;gap:3px;}

.ce-num{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:24px;padding:0 6px;font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;border-radius:5px;}
.ce-num--have{background:rgba(34,197,94,.1);color:#4ade80;border:1px solid rgba(34,197,94,.12);}
.ce-num--want{background:rgba(239,68,68,.08);color:#f87171;border:1px solid rgba(239,68,68,.1);}
.ce-num--match{background:rgba(232,160,48,.12);color:#e8a030;border:1px solid rgba(232,160,48,.2);animation:matchGlow 2.5s ease-in-out infinite;}

/* Підсвічування карток які збігаються з твоїм оголошенням */
.ce-num--match-hl{position:relative;font-weight:800;z-index:1;}
.ce-num--match-hl::after{content:'';position:absolute;top:2px;left:2px;width:6px;height:6px;border-radius:50%;animation:matchPulse 2s ease-in-out infinite;}

/* Вони мають → я отримую (зелено-золотий — апсайд для мене) */
.ce-num--match-have{box-shadow:0 0 0 1px #4CAF50, 0 0 14px rgb(76 175 80 / 54%);}
.ce-num--match-have::after{background:#4CAF50;box-shadow:0 0 6px #4CAF50;}

/* Вони шукають → я даю (фіолетовий — допомога іншому) */
.ce-num--match-want{box-shadow:0 0 0 1px #F44336,0 0 14px #F44336;}
.ce-num--match-want::after{background:#F44336;box-shadow:0 0 6px #F44336;}

@keyframes matchPulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.3);opacity:.7;}}

/* Підсвічування картки з фільтра пошуку */
.ce-num.ce-num--filter-hl{position:relative;box-shadow:0 0 0 2px rgba(99,179,237,.6),0 0 16px rgba(99,179,237,.5)!important;font-weight:800!important;z-index:2;background:rgba(99,179,237,.2)!important;color:#63b3ed!important;border:1px solid rgba(99,179,237,.5)!important;transform:scale(1.08);}
.ce-num.ce-num--filter-hl::before{content:'';position:absolute;inset:-4px;border-radius:8px;border:1px solid rgba(99,179,237,.5);animation:filterRing 1.5s ease-in-out infinite;pointer-events:none;}
@keyframes filterRing{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.15);opacity:.4;}}
@keyframes matchGlow{0%,100%{box-shadow:0 0 0 0 rgba(232,160,48,0);}50%{box-shadow:0 0 8px 0 rgba(232,160,48,.12);}}

/* Comment as chat bubble */
.ce-bubble-wrap{margin:14px 0;padding-left:36px;}
.ce-bubble{position:relative;background:#23180b;border-radius:4px 14px 14px 14px;padding:8px 12px 10px;font-size:12px;color:#d4c8b0;line-height:1.45;max-width:100%;word-wrap:break-word;}
.ce-bubble::before{content:'';position:absolute;left:-15px;top:-7px;rotate: 28deg;width:24px;height:22px;background:#23180b;-webkit-clip-path:polygon(100% 0,100% 100%,0 0);clip-path:polygon(100% 0,100% 100%,0 0);}
.ce-bubble-author{display:block;font-family:'Oswald',sans-serif;font-size:10px;font-weight:700;color:#c87820;text-transform:uppercase;letter-spacing:1px;margin-bottom:3px;}
.ce-card-contact{margin-top:10px;padding-top:10px;}
.ce-card-tg{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:#1B92D1;text-decoration:none;transition:opacity .2s;}
.ce-card-tg:hover{opacity:.8;}
.ce-card-tg-icon{width:16px;height:16px;flex-shrink:0;}

/* Expiry timer */
/* Expiry — floating badge on top border */
.ce-expiry{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);font-family:'Oswald',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:#c87820;background:#1a1108;padding:4px 14px;border-radius:20px;border:1px solid rgba(232,160,48,.35);white-space:nowrap;z-index:3;box-shadow:0 2px 8px rgba(0,0,0,.4),0 0 12px rgba(232,160,48,.15);display:inline-flex;align-items:center;gap:5px;}
.ce-expiry-icon{width:11px;height:11px;flex-shrink:0;opacity:.85;}
.ce-expiry--urgent{color:#fbbf24;border-color:rgba(251,191,36,.5);box-shadow:0 2px 8px rgba(0,0,0,.4),0 0 14px rgba(251,191,36,.3);animation:expiryUrgent 2s ease-in-out infinite;}
.ce-expiry--expired{color:#f87171;border-color:rgba(248,113,113,.5);opacity:.85;}
@keyframes expiryUrgent{0%,100%{box-shadow:0 2px 8px rgba(0,0,0,.4),0 0 14px rgba(251,191,36,.3);}50%{box-shadow:0 2px 8px rgba(0,0,0,.4),0 0 20px rgba(251,191,36,.5);}}
.ce-card-act{margin-top:12px;display:flex;gap:6px;}

.ce-btn-sm{font-family:'Oswald',sans-serif;font-size:12px;font-weight: 500;text-transform:uppercase;letter-spacing:.5px;padding:6px 14px;border-radius:6px;border:none;cursor:pointer;transition:all .2s;}
.ce-btn-ghost{background:#ffa20c;color:#232323;}
.ce-btn-danger{background:rgba(239,68,68,.06);color:#f87171;}
.ce-btn-danger:hover{background:rgba(239,68,68,.12);}

/* Catalog */
.ce-cat-group{margin-bottom:28px;}
.ce-cat-title{font-family:'Oswald',sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:3px;color:#c87820;margin-bottom:14px;padding-bottom:10px;position:relative;}
.ce-cat-title::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,rgba(232,160,48,.4),rgba(232,160,48,.1) 50%,transparent);}
.ce-cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(143px,1fr));gap:10px;}
.ce-cat-card{overflow:hidden;transition:transform .25s,border-color .3s,box-shadow .3s;position:relative;}
.ce-cat-card::after{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.3),transparent);opacity:0;transition:opacity .3s;}
.ce-cat-card:hover{border-color:rgba(232,160,48,.25);transform:translateY(-4px);box-shadow:0 12px 24px rgba(0,0,0,.4);}
.ce-cat-card:hover::after{opacity:1;}
.ce-cat-card-img{width:100%;aspect-ratio:2/3;object-fit:cover;display:block;}

/* Form */
.ce-form{max-width:1100px;margin:0 auto;}
.ce-form-title{font-family:'Oswald',sans-serif;font-size:24px;font-weight:800;text-transform:uppercase;letter-spacing:2px;text-align:center;margin-bottom:28px;background:linear-gradient(180deg, #6a5a40 20%, #e8dcc8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}

/* Two-column layout */
.ce-form-layout{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:start;}
.ce-form-sidebar{position:sticky;top:20px;align-self:start;}
.ce-form-sidebar-inner{background:linear-gradient(135deg,rgba(200,120,32,.04),rgba(0,0,0,.25));border:1px solid rgba(200,120,32,.1);border-radius:16px;padding:20px;position:relative;overflow:hidden;}
.ce-form-sidebar-inner::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.4),transparent);}
.ce-form-cards{min-width:0;}

/* Listings sidebar layout */
.ce-listings-layout{display:grid;grid-template-columns:280px 1fr;gap:24px;align-items:start;}
.ce-listings-sidebar{position:sticky;top:20px;align-self:start;}
.ce-listings-sidebar-inner{background:linear-gradient(135deg,rgba(200,120,32,.04),rgba(232,160,48,.02));border:1px solid rgba(200,120,32,.1);border-radius:16px;padding:20px;position:relative;overflow:hidden;}
.ce-listings-sidebar-inner::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.4),transparent);}
.ce-listings-content{min-width:0;}

/* Support block under filter */
.ce-support{margin-top:14px;background:linear-gradient(135deg,rgba(200,120,32,.04),rgba(232,160,48,.02));border:1px solid rgba(200,120,32,.1);border-radius:16px;padding:18px;position:relative;overflow:hidden;}
.ce-support::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.4),transparent);}
.ce-support-title{font-family:'Oswald',sans-serif;font-size:18px;font-weight:700;text-transform:uppercase;letter-spacing:2px;background:linear-gradient(180deg, #6a5a40 20%, #e8dcc8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:6px;text-align:center;}
.ce-support-text{font-size:13px;color:#6a5a40;line-height:1.5;text-align:center;margin-bottom:14px;}
.ce-support-links{display:flex;flex-direction:column;gap:6px;}
.ce-support-link{display:flex;align-items:center;gap:10px;padding:10px 12px;background:rgba(0,0,0,.25);border:1px solid rgba(200,120,32,.06);border-radius:10px;text-decoration:none;font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:#8a7a60;transition:all .25s;position:relative;overflow:hidden;}
.ce-support-link::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent);transform:translateX(-100%);transition:transform .5s;}
.ce-support-link:hover::before{transform:translateX(100%);}
.ce-support-link img{width:20px;height:20px;flex-shrink:0;object-fit:contain;}
.ce-support-link span{flex:1;}
.ce-support-link--tg:hover{background:rgba(27,146,209,.12);border-color:rgba(27,146,209,.4);color:#1B92D1;}
.ce-support-link--ds:hover{background:rgba(88,101,242,.12);border-color:rgba(88,101,242,.4);color:#5865F2;}
.ce-support-link--mono:hover{background:rgba(200,120,32,.12);border-color:rgba(232,160,48,.5);color:#e8a030;}

/* Tooltips on support links */
.ce-support-link[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(4px);white-space:nowrap;background:#1a1108;border:1px solid rgba(200,120,32,.2);color:#e8dcc8;font-family:'Rubik',sans-serif;font-size:11px;font-weight:400;text-transform:none;letter-spacing:0;padding:6px 12px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 4px 16px rgba(0,0,0,.4);z-index:100;}
.ce-support-link[data-tip]:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}
.ce-btn-reset{margin-top:8px;font-family:'Oswald',sans-serif;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:10px;background:rgba(255,255,255,.04);color:#6a5a40;border:1px solid rgba(200,120,32,.1);border-radius:8px;cursor:pointer;transition:all .2s;width:100%;display:block;}
.ce-btn-reset:hover{background:rgba(255,255,255,.08);color:#c8a060;border-color:rgba(200,120,32,.2);}
.ce-form-grp{margin-bottom:10px;}
.ce-form-lbl{font-family:'Oswald',sans-serif;font-size:18px;font-weight:500;background: linear-gradient(180deg, #6a5a40 20%, #e8dcc8 100%);text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;display:block;-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;}
.ce-form-hint{color:#6a5a40;font-weight:400;text-transform:none;letter-spacing:0;font-family:'Rubik',sans-serif;font-size:11px;}
.ce-input{font-family:'Rubik',sans-serif;font-size:13px;padding:12px 16px;background:rgba(200,120,32,.04);border:1px solid rgba(200,120,32,.06);border-radius:10px;color:#e8dcc8;outline:none;width:100%;transition:border-color .3s;}
.ce-input:focus{border-color:#c87820;}
.ce-input::placeholder{color:#6a5a40;}
.ce-textarea{font-family:'Rubik',sans-serif;font-size:13px;padding:6px 8px;background:rgba(200,120,32,.04);border:1px solid rgba(200,120,32,.06);border-radius:10px;color:#e8dcc8;outline:none;width:100%;min-height:120px;resize:none;transition:border-color .3s;}
.ce-textarea:focus{border-color:#c87820;}
.ce-chk{display:flex;align-items:center;gap:8px;font-size:13px;color:#e8dcc8;cursor:pointer;margin-bottom:16px;}
.ce-chk input{accent-color:#c87820;}

/* Picker */
.ce-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;}
.ce-pick{position:relative;border-radius:10px;overflow:hidden;border:1px solid #242321;transition:all .25s;user-select:none;display:flex;flex-direction:column;background:linear-gradient(135deg,rgba(200,120,32,.04),rgba(0,0,0,.25));}
.ce-pick:hover{border-color:#4f4d49;}
.ce-pick-img-wrap{cursor:pointer;display:block;position:relative;}

/* Number badge — top-left, circular, animated */
.ce-pick-badge{position:absolute;top:20px;left:23px;width:23px;height:23px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Oswald',sans-serif;font-size:11px;font-weight:800;background:#e8a030;box-shadow:0 2px 8px rgba(0,0,0,.5),0 0 0 2px rgba(15,10,4,.6);opacity:0;transform:scale(0) rotate(-180deg);transition:opacity .25s,transform .35s cubic-bezier(0.34,1.56,0.64,1);pointer-events:none;z-index:2;}
.ce-pick--have .ce-pick-badge{opacity:1;transform:scale(1) rotate(0deg);background:#49433c;animation:ceBadgePulse 2s ease-in-out infinite;}
.ce-pick--want .ce-pick-badge{opacity:1;transform:scale(1) rotate(0deg);background:#f87171;animation:ceBadgePulse 2s ease-in-out infinite;}
@keyframes ceBadgePulse{0%,100%{box-shadow:0 2px 8px rgba(0,0,0,.5),0 0 0 2px rgba(15,10,4,.6),0 0 0 0 rgba(232,160,48,.4);}50%{box-shadow:0 2px 8px rgba(0,0,0,.5),0 0 0 2px rgba(15,10,4,.6),0 0 0 6px rgba(232,160,48,0);}}
.ce-pick-img{width:100%;display:block;filter:brightness(.55) saturate(.4);transition:filter .2s;}

/* Quantity controls — full width below image */
.ce-pick-controls{display:flex;align-items:center;justify-content:space-between;padding:2px 8px 8px 8px;gap:6px;}
.ce-pick-qty-val{flex:1;text-align:center;font-family:'Oswald',sans-serif;font-size:14px;font-weight:500;color:#413f3b;min-width:20px;}
.ce-pick-btn{width:26px;height:26px;border:none;border-radius:6px;background:#242321;color:#e8dcc8;font-size:24px;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s;padding:0;line-height:1;flex-shrink:0;}
.ce-pick-btn:hover{background:rgba(200,120,32,.3);}
.ce-pick--have .ce-pick-btn{background:rgba(34,197,94,.15);color:#e8dcc8;}
.ce-pick--have .ce-pick-btn:hover{background:rgba(34,197,94,.3);}
.ce-pick--have .ce-pick-qty-val{color:#4CAF50;}

/* Num with quantity */
.ce-num small{font-size:10px;opacity:.6;margin-left:4px;margin-top: -6px;}

/* Meetup badge */
.ce-badge-meetup{font-size:9px;font-weight:500;text-transform:uppercase;letter-spacing:.4px;background:rgba(99,179,237,.1);color:#63b3ed;padding:2px 6px;border-radius:4px;}

/* Badge tooltip */
.ce-badge-tip{position:relative;cursor:default;}
.ce-badge-tip::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);white-space:nowrap;background:#1a1108;border:1px solid rgba(200,120,32,.2);color:#e8dcc8;font-family:'Rubik',sans-serif;font-size:11px;font-weight:400;text-transform:none;letter-spacing:0;padding:6px 12px;border-radius:8px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;box-shadow:0 4px 16px rgba(0,0,0,.4);z-index:100;}
.ce-badge-tip::before{content:'';position:absolute;bottom:calc(100% + 2px);left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:rgba(200,120,32,.2);opacity:0;pointer-events:none;transition:opacity .2s;z-index:100;}
.ce-badge-tip:hover::after{opacity:1;transform:translateX(-50%) translateY(0);}
.ce-badge-tip:hover::before{opacity:1;}

/* Pick states */
.ce-pick--have{border-color:#4caf50;}
.ce-pick--have .ce-pick-img{filter:brightness(1) saturate(1);}
.ce-pick--want{border-color:rgba(239,68,68,.4);cursor:pointer;}
.ce-pick--want .ce-pick-img{filter:brightness(1) saturate(1);}

.ce-btn-primary{font-family:'Oswald',sans-serif;font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:2px;padding:14px 28px;background:#e8dcc8;border:none;border-radius:12px;color:#0f0a04;cursor:pointer;transition:background .2s,transform .1s;display:block;margin:20px 0 0;width:100%;}
.ce-btn-primary:hover{background:#e8a030;transform:translateY(-1px);}
.ce-btn-primary:disabled{opacity:.4;cursor:not-allowed;transform:none;}

/* Auth */
.ce-auth{text-align:center;padding:60px 20px;background:linear-gradient(135deg,rgba(200,120,32,.04),transparent);border:1px solid rgba(200,120,32,.08);border-radius:16px;position:relative;overflow:hidden;}
.ce-auth::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.4),transparent);}
.ce-auth-text{font-size:14px;color:#6a5a40;margin-bottom:16px;}

/* Empty / Loader */
.ce-empty{text-align:center;padding:60px 20px;color:#6a5a40;font-size:14px;}
.ce-loader{text-align:center;padding:40px;}
.ce-loader span{display:inline-block;width:8px;height:8px;border-radius:50%;background:#c87820;margin:0 4px;animation:ceL 1.4s ease-in-out infinite;}
.ce-loader span:nth-child(2){animation-delay:.2s;}
.ce-loader span:nth-child(3){animation-delay:.4s;}
@keyframes ceL{0%,80%,100%{transform:scale(.4);opacity:.3;}40%{transform:scale(1);opacity:1;}}

/* Pagination */
.ce-pagination{display:flex;justify-content:center;gap:4px;margin-top:24px;}
.ce-pg-btn{font-family:'Oswald',sans-serif;font-size:13px;min-width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid rgba(200,120,32,.06);background:transparent;color:#6a5a40;cursor:pointer;transition:all .2s;}
.ce-pg-btn:hover:not(:disabled){border-color:rgba(200,120,32,.25);color:#c8a060;}
.ce-pg-btn--act{background:rgba(200,120,32,.15);border-color:rgba(200,120,32,.3);color:#e8a030;}
.ce-pg-btn:disabled{opacity:.3;cursor:not-allowed;}
.ce-pg-nav{font-size:16px;}
.ce-pg-btn:hover{border-color:rgba(200,120,32,.2);color:#c8a060;}
.ce-pg-btn--act{background:rgba(200,120,32,.1);border-color:#c87820;color:#e8a030;}

/* Footer */
.ce-footer{text-align:center;padding:30px 20px;font-size:12px;color:#6a5a40;opacity:.5;border-top:1px solid rgba(200,120,32,.04);}

/* ═══ AUTH MODALS (login/register/forgot) ═══ */
.ce-auth-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px;}
.ce-auth-modal--show{display:flex;animation:ceAuthFade .25s ease-out;}
.ce-auth-overlay{position:absolute;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);}
.ce-auth-box{position:relative;background:#0c0905;border:1px solid rgba(200,120,32,.25);border-radius:20px;max-width:880px;width:100%;max-height:calc(100vh - 40px);overflow:hidden;box-shadow:0 20px 80px rgba(0,0,0,.8),0 0 80px rgba(200,120,32,.15);animation:ceAuthSlide .35s cubic-bezier(0.34,1.56,0.64,1);display:flex;}
.ce-auth-box::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.6),transparent);z-index:10;}
.ce-auth-close{position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:50%;background:rgba(0,0,0,.6);backdrop-filter:blur(8px);border:none;color:#e8dcc8;font-size:24px;line-height:1;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;padding:0;z-index:20;}

/* Decorative side (hero-style) */
.ce-auth-deco{flex:0 0 380px;position:relative;overflow:hidden;background:#0c0905;display:flex;align-items:flex-end;}
.ce-auth-deco-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.ce-auth-deco-sign{position:absolute;width:320px;height:320px;right:14px;top:80px;}
.ce-auth-deco-person{position:absolute;left:22px;bottom:-60px;height:100%;max-height:480px;}
.ce-auth-deco-flowers{position:absolute;left:-30px;bottom:-20px;width:240px;opacity:.85;}
.ce-auth-deco-overlay{position:absolute;inset:0;background:none;}
.ce-auth-deco-text{position:relative;z-index:2;padding:36px 28px 36px;display:flex;flex-direction:column;gap:8px;}
.ce-auth-deco-label{font-family:'Oswald',sans-serif;font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;text-shadow:1px 1px 2px rgba(0,0,0,.8);}
.ce-auth-deco-title{font-family:'Oswald',sans-serif;font-size:38px;font-weight:800;line-height:.95;letter-spacing:1px;text-transform:uppercase;color:#e8dcc8;text-shadow:2px 2px 8px rgba(0,0,0,.9);margin:8px 0;}
.ce-auth-deco-sub{font-family:'Rubik',sans-serif;font-size:13px;line-height:1.5;text-shadow:1px 1px 2px rgba(0,0,0,.8);max-width:280px;}
@keyframes ceSignPulse{0%,100%{opacity:.5;}50%{opacity:.75;}}

/* Content side */
.ce-auth-content{flex:1;padding:40px 36px;background:linear-gradient(180deg,#1a1108,#0f0a04);overflow-y:auto;display:flex;flex-direction:column;}
.ce-auth-head{margin-bottom:10px;}
.ce-auth-h{font-family:'Oswald',sans-serif;font-size:24px;font-weight:800;text-transform:uppercase;letter-spacing:2px;color:#e8dcc8;margin-bottom:6px;}
.ce-auth-sub{font-family:'Rubik',sans-serif;font-size:12px;color:#8a7a60;line-height:1.5;}
.ce-auth-sub a{color:#e8a030;text-decoration:none;}
.ce-auth-sub a:hover{color:#fbbf24;text-decoration:underline;}
.ce-auth-form{display:flex;flex-direction:column;gap:10px;flex:1;}
.ce-auth-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.ce-auth-grp{display:flex;flex-direction:column;gap:5px;}
.ce-auth-lbl{font-family:'Oswald',sans-serif;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:#c87820;}
.ce-auth-input{font-family:'Rubik',sans-serif;font-size:13px;padding:11px 14px;background:rgba(200,120,32,.04);border:1px solid rgba(200,120,32,.12);border-radius:8px;color:#e8dcc8;outline:none;transition:border-color .2s,background .2s,box-shadow .2s;width:100%;}
.ce-auth-input:focus{border-color:rgba(232,160,48,.5);background:rgba(200,120,32,.08);box-shadow:0 0 0 3px rgba(232,160,48,.08);}
.ce-auth-select{cursor:pointer;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c87820' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px;}
.ce-auth-select option{background:#1a1108;color:#e8dcc8;}
.ce-auth-check{display:flex;align-items:center;gap:8px;font-family:'Rubik',sans-serif;font-size:12px;color:#a09080;cursor:pointer;user-select:none;}
.ce-auth-check input{width:16px;height:16px;cursor:pointer;accent-color:#c87820;flex-shrink:0;}
.ce-auth-check a{color:#e8a030;text-decoration:none;}
.ce-auth-check a:hover{text-decoration:underline;}
.ce-auth-hint{font-family:'Rubik',sans-serif;font-size:11px;color:#6a5a40;line-height:1.4;margin-top:4px;}

/* Wrapper для input з кнопкою перевірки нікнейма */
.ce-auth-input-wrap{position:relative;display:flex;align-items:center;}
.ce-auth-input-wrap .ce-auth-input{padding-right:42px;}
.ce-auth-nick-check{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:rgba(200,120,32,.1);border:1px solid rgba(200,120,32,.25);color:#c87820;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:all .2s;}
.ce-auth-nick-check:hover{background:rgba(200,120,32,.2);border-color:rgba(232,160,48,.5);color:#e8a030;}
.ce-auth-nick-check--checking{animation:ceNickSpin .8s linear infinite;border-color:rgba(232,160,48,.5);}
.ce-auth-nick-check--ok{background:rgba(74,222,128,.18)!important;border-color:rgba(74,222,128,.5)!important;color:#4ade80!important;}
.ce-auth-nick-check--bad{background:rgba(239,68,68,.18)!important;border-color:rgba(239,68,68,.5)!important;color:#f87171!important;}
@keyframes ceNickSpin{from{transform:translateY(-50%) rotate(0deg);}to{transform:translateY(-50%) rotate(360deg);}}

/* Readonly input — посилання на профіль */
.ce-auth-input--readonly{opacity:.75;cursor:default;color:#c87820;font-family:'Rubik',sans-serif;}
.ce-auth-input--readonly:focus{border-color:rgba(200,120,32,.12);background:rgba(200,120,32,.04);box-shadow:none;}

/* Індикатор сили пароля */
.ce-auth-pwd-bar{height:3px;background:rgba(200,120,32,.08);border-radius:2px;margin-top:6px;overflow:hidden;}
.ce-auth-pwd-bar-fill{height:100%;width:0;background:#ff4444;border-radius:2px;transition:width .3s ease,background .3s ease;}

.ce-auth-btn{font-family:'Oswald',sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:2px;padding:14px 24px;background:linear-gradient(180deg,#e8a030,#c87820);border:none;border-radius:10px;color:#0f0a04;cursor:pointer;transition:all .2s;margin-top:6px;box-shadow:0 4px 14px rgba(200,120,32,.3);position:relative;overflow:hidden;}
.ce-auth-btn::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent);transform:translateX(-100%);transition:transform .6s;}
.ce-auth-btn:hover{box-shadow:0 6px 20px rgba(232,160,48,.5);transform:translateY(-1px);}
.ce-auth-btn:hover::before{transform:translateX(100%);}
.ce-auth-btn:disabled{opacity:.5;cursor:not-allowed;}
.ce-auth-links{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-top:10px;padding-top:14px;border-top:1px solid rgba(200,120,32,.08);font-size:13px;flex-wrap:wrap;}
.ce-auth-links a{color:#8a7a60;text-decoration:none;transition:color .2s;}
.ce-auth-links a:hover{color:#e8a030;}
.ce-auth-links a strong{color:#e8a030;font-weight:700;text-transform:uppercase;letter-spacing:1px;font-size:12px;}
.ce-auth-links a:hover strong{color:#fbbf24;}

/* Login button in hero (для незалогінених) */
.ce-hero-login-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 18px;background:rgba(0,0,0,.45);backdrop-filter:blur(12px);border:1px solid rgba(232,160,48,.25);border-radius:30px;color:#e8dcc8;font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:1.2px;cursor:pointer;transition:all .25s;position:relative;overflow:hidden;}
.ce-hero-login-btn::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(232,160,48,.5),transparent);}
.ce-hero-login-btn:hover{background:rgba(232,160,48,.15);border-color:rgba(232,160,48,.5);color:#e8a030;transform:translateY(-1px);}
.ce-hero-login-ic{flex-shrink:0;}

@keyframes ceAuthFade{from{opacity:0;}to{opacity:1;}}
@keyframes ceAuthSlide{from{opacity:0;transform:translateY(-30px) scale(.94);}to{opacity:1;transform:translateY(0) scale(1);}}

/* Mobile-only support icons (показуються лише на ≤430px) */
.ce-support-mobile{display:none;justify-content:center;align-items:center;gap:14px;padding:20px 0;}
.ce-support-mobile-link{display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;background:rgba(0,0,0,.4);border:1px solid rgba(200,120,32,.18);text-decoration:none;transition:all .25s;position:relative;overflow:hidden;}
.ce-support-mobile-link::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(232,160,48,.15),transparent 70%);opacity:0;transition:opacity .25s;}
.ce-support-mobile-link:hover{border-color:rgba(232,160,48,.4);transform:translateY(-2px);}
.ce-support-mobile-link:hover::before{opacity:1;}
.ce-support-mobile-link img{width:22px;height:22px;object-fit:contain;position:relative;z-index:1;}

/* Confirm modal */
.ce-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(6px);z-index:9999;display:flex;align-items:center;justify-content:center;animation:ceModalIn .2s ease-out;}
@keyframes ceModalIn{from{opacity:0;}to{opacity:1;}}
.ce-modal{background:#1a1108;border:1px solid rgba(200,120,32,.15);border-radius:16px;padding:32px;max-width:380px;width:90%;text-align:center;animation:ceModalSlide .25s ease-out;}
@keyframes ceModalSlide{from{transform:translateY(20px);opacity:0;}to{transform:translateY(0);opacity:1;}}
.ce-modal-title{font-family:'Oswald',sans-serif;font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#e8dcc8;margin-bottom:8px;}
.ce-modal-text{font-size:13px;color:#6a5a40;line-height:1.5;margin-bottom:24px;}
.ce-modal-actions{display:flex;gap:8px;justify-content:center;}
.ce-modal-btn{font-family:'Oswald',sans-serif;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:1px;padding:10px 24px;border-radius:8px;border:none;cursor:pointer;transition:all .2s;}
.ce-modal-btn--cancel{background:rgba(255,255,255,.05);color:#6a5a40;border:1px solid rgba(200,120,32,.1);}
.ce-modal-btn--cancel:hover{background:rgba(255,255,255,.08);color:#c8a060;}
.ce-modal-btn--confirm{background:rgba(239,68,68,.15);color:#f87171;}
.ce-modal-btn--confirm:hover{background:rgba(239,68,68,.25);}
.ce-footer a{color:#c87820;text-decoration:none;}
.ce-footer a:hover{text-decoration:underline;}
.ce-footer-sep{margin:0 8px;opacity:.3;}

/* Tooltip */
.ce-tooltip{position:absolute;z-index:9999;pointer-events:none;background:#474037;border-radius:10px;padding:4px;opacity:0;transform:translateX(-50%) translateY(4px);transition:opacity .15s,transform .15s;box-shadow:0 8px 24px rgba(0,0,0,.5);display:flex;flex-direction:column;align-items:center;}
.ce-tooltip--show{opacity:1;transform:translateX(-50%) translateY(0);}
.ce-tooltip--below.ce-tooltip{transform:translateX(-50%) translateY(-4px);}
.ce-tooltip--below.ce-tooltip--show{transform:translateX(-50%) translateY(0);}
.ce-tooltip-img{width:150px;border-radius:7px;display:block;}

/* Tooltip hint message */
.ce-tooltip--with-hint{padding:6px;}
.ce-tooltip-hint{margin-top:4px;padding:6px 8px;border-radius:6px;font-family:'Rubik',sans-serif;font-size:13px;font-weight:500;line-height:1.3;text-align:center;max-width:150px;}
.ce-tooltip-hint--have{color:#E8DCC8;}
.ce-tooltip-hint--want{color:#E8DCC8;}

/* Catalog tooltip — text only with #number and name */
.ce-tooltip--cat{padding:8px 14px;text-align:center;}
.ce-tooltip-cat-num{font-family:'Oswald',sans-serif;font-size:11px;font-weight:700;color:#c87820;letter-spacing:1px;}
.ce-tooltip-cat-name{font-family:'Rubik',sans-serif;font-size:13px;color:#e8dcc8;margin-top:2px;white-space:nowrap;}

/* Form counter — fixed bottom bar */
.ce-form-counter{display:none;}
/* Counter in sidebar */
.ce-form-counter{margin-top:16px;padding-top:16px;border-top:1px solid rgba(200,120,32,.08);display:none;flex-direction:column;gap:8px;}
.ce-form-counter--show{display:flex;}
.ce-counter-row{display:flex;justify-content:space-between;align-items:center;font-family:'Oswald',sans-serif;font-size:12px;}
.ce-counter-have{font-weight:700;text-transform:uppercase;letter-spacing:1px;}
.ce-counter-want{font-weight:700;text-transform:uppercase;letter-spacing:1px;}
.ce-counter-val{color:#e8dcc8;font-size:13px;font-family:'Rubik',sans-serif;font-weight:400;}
.ce-counter-reset{margin-top:6px;font-family:'Oswald',sans-serif;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;padding:8px;background:rgba(239,68,68,.1);color:#f87171;border:none;border-radius:8px;cursor:pointer;transition:background .2s;}
.ce-counter-reset:hover{background:rgba(239,68,68,.18);}

/* Required marker */
.ce-form-req{color:#f87171;font-size:12px;}

/* Form select */
.ce-select--form{width:100%;padding:12px 16px;background:rgba(200,120,32,.04);border:1px solid rgba(200,120,32,.06);border-radius:10px;font-size:13px;}

/* Error toast */
.ce-toast{position:fixed;top:20px;right:20px;z-index:10000;padding:14px 20px;border-radius:12px;font-family:'Rubik',sans-serif;font-size:13px;line-height:1.5;display:flex;align-items:flex-start;gap:12px;transform:translateX(120%);transition:transform .3s ease;max-width:360px;}
.ce-toast--show{transform:translateX(0);}
.ce-toast--error{background:rgba(239,68,68,.15);border:1px solid rgba(239,68,68,.25);color:#f87171;backdrop-filter:blur(12px);}
.ce-toast--success{background:rgba(74,222,128,.15);border:1px solid rgba(74,222,128,.3);color:#4ade80;backdrop-filter:blur(12px);}
.ce-toast--warning{background:rgba(251,191,36,.15);border:1px solid rgba(251,191,36,.3);color:#fbbf24;backdrop-filter:blur(12px);}
.ce-toast-close{background:none;border:none;color:#f87171;cursor:pointer;font-size:16px;padding:0;opacity:.6;transition:opacity .2s;flex-shrink:0;}
.ce-toast-close:hover{opacity:1;}

/* Catalog animation */
.ce-cat-card{opacity:0;transform:translateY(12px);animation:ceCatIn .4s ease-out forwards;}
@keyframes ceCatIn{to{opacity:1;transform:translateY(0);}}
.ce-cat-card:nth-child(1){animation-delay:.02s;}
.ce-cat-card:nth-child(2){animation-delay:.04s;}
.ce-cat-card:nth-child(3){animation-delay:.06s;}
.ce-cat-card:nth-child(4){animation-delay:.08s;}
.ce-cat-card:nth-child(5){animation-delay:.1s;}
.ce-cat-card:nth-child(6){animation-delay:.12s;}
.ce-cat-card:nth-child(7){animation-delay:.14s;}
.ce-cat-card:nth-child(8){animation-delay:.16s;}
.ce-cat-card:nth-child(9){animation-delay:.18s;}
.ce-cat-card:nth-child(10){animation-delay:.2s;}
.ce-cat-card:nth-child(11){animation-delay:.22s;}
.ce-cat-card:nth-child(12){animation-delay:.24s;}
.ce-cat-card:nth-child(13){animation-delay:.26s;}
.ce-cat-card:nth-child(14){animation-delay:.28s;}
.ce-cat-card:nth-child(15){animation-delay:.3s;}
.ce-cat-card:nth-child(16){animation-delay:.32s;}
.ce-cat-card:nth-child(17){animation-delay:.34s;}
.ce-cat-card:nth-child(18){animation-delay:.36s;}

/* ═══ Mobile ═══ */
/* ═══ Tablet ═══ */
@media(max-width:1024px){
  .ce-hero{height:480px;}
  .ce-hero-content{padding:36px 20px 0;}
  .ce-hero-label{font-size:14px;letter-spacing:3px;margin-top:60px;}
  .ce-hero-dates{font-size:14px;}
  .ce-hero-title{font-size:44px;}
  .ce-hero-person{max-height:540px;right:32%;}
  .ce-hero-sign{width:480px;height:480px;right:4%;top: 6%;}
  .ce-hero-flowers--left{width:380px;}
  .ce-hero-flowers--center{width:180px;}
  .ce-hero-flowers--right{width:220px;}
  .ce-hero-desc{max-width:360px;font-size:13px;}
  .ce-stats{gap:8px;margin-top:30px;flex-wrap:wrap;}
  .ce-stat{min-width:85px;padding:12px 18px;}
  .ce-stat-value{font-size:24px;}
  .ce-stat-order{padding:12px 18px;}
  .ce-main{padding:0 20px 50px;}
  /* Списки оголошень — 1 колонка щоб картки не злипались */
  .ce-cat-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));}
  .ce-picker{grid-template-columns:repeat(5,1fr);}
  .ce-form-layout{grid-template-columns:240px 1fr;}
  .ce-listings-layout{grid-template-columns:240px 1fr;}
}

/* ═══ Mobile ═══ */
@media(max-width:768px){
  html,body,.ce-body{overflow-x:hidden;}
  .ce-hero{height:auto;min-height:480px;}
  .ce-hero-content{padding:14px 14px 0;text-shadow: 1px 1px 2px #232323;}
  .ce-hero-label{font-size:12px;letter-spacing:2px;margin-top:30px;}
  .ce-hero-dates{font-size:13px;}
  .ce-hero-title{font-size:38px;letter-spacing:2px;filter: drop-shadow(5px 0 10px rgba(0, 0, 0, 0.4));text-shadow: 1px 1px 2px #232323;}
  .ce-hero-person{max-height:422px;right:166px;bottom: 20px;}
  .ce-hero-sign{width:360px;height:360px;right:-16%;top:12%;opacity: 0.8;}
  .ce-hero-flowers--left{width:300px;}
  .ce-hero-flowers--right{display:none;}
  .ce-hero-flowers--center{display:none;}
  .ce-hero-desc{font-size:13px;filter: drop-shadow(5px 0 10px rgba(0, 0, 0, 0.4));}
  .ce-stats{flex-wrap:wrap;justify-content:center;}
  .ce-stat{min-width:80px;padding:10px 14px;}
  .ce-stat-value{font-size:22px;}
  /* Кнопка Замовити — тільки іконка на мобільному */
  .ce-stat-order{padding:14px;gap:0;}
  .ce-stat-order-text{display:none;}
  .ce-stat-order-icon{width:28px;height:28px;}
  .ce-main{padding:0 14px 40px;}
  .ce-tabs{gap:6px;flex-wrap:wrap;justify-content:center;}
  .ce-tab{padding:8px 6px;font-size:11px;}
  /* Приховати "Каталог карток" таб на мобільному */
  .ce-tab--mobile-hide{display:none;}
  .ce-hero-top{justify-content:space-between;}
  .ce-back-text{display:none;}
  .ce-back{padding:8px;border-radius:50%;background:rgba(0,0,0,.45);backdrop-filter:blur(12px);border:1px solid rgba(232,160,48,.18);width:36px;height:36px;justify-content:center;}
  .ce-hero-user{padding:5px 10px 5px 5px;}

  .ce-hero-user-name{font-size:12px;}
  .ce-hero-user-login{font-size:11px;}

  .ce-hero-logout-ic{width:16px;height:16px;}
  .ce-grid{grid-template-columns:1fr;}
  .ce-form-layout{grid-template-columns:1fr;}
  .ce-form-sidebar{position:static;}
  .ce-listings-layout{grid-template-columns:1fr;}
  .ce-listings-sidebar{position:static;}
  .ce-select{min-width:auto;}
  .ce-picker{grid-template-columns:repeat(4,1fr);}
  .ce-cat-grid{grid-template-columns:repeat(3,1fr);gap:8px;}
  /* Підтримка: ховаємо великий блок з сайдбара, показуємо іконки внизу */
  .ce-support{display:none;}
  .ce-support-mobile{display:flex;}

  /* Картки оголошень */
  .ce-card{padding:24px 12px 12px;}
  .ce-card-av,.ce-card-av-ph{width:32px;height:32px;}
  .ce-card-av-ph{font-size:13px;}
  .ce-card-name{font-size:14px;}
  .ce-card-meta{font-size:10px;gap:5px;}
  .ce-card-lbl{font-size:11px;letter-spacing:1.5px;margin-bottom:6px;}
  .ce-num{min-width:24px;height:22px;font-size:11px;padding:0 5px;}
  .ce-num small{font-size:9px;}

  /* Бейдж активності */
  .ce-expiry{font-size:9px;padding:3px 10px;letter-spacing:1px;}
  .ce-expiry-icon{width:10px;height:10px;}

  /* Bubble коментар */
  .ce-bubble-wrap{padding-left:12px;}
  .ce-bubble{font-size:11px;padding:7px 10px 8px;}

  /* Форма */
  .ce-form-title{font-size:20px;letter-spacing:1.5px;margin-bottom:20px;}
  .ce-form-sidebar-inner,.ce-listings-sidebar-inner{padding:14px;}
  .ce-form-grp{margin-bottom:14px;}
  .ce-form-lbl{font-size:11px;}
  .ce-input,.ce-textarea,.ce-select--form{font-size:12px;padding:10px 12px;}
  .ce-textarea{min-height:80px;}
  .ce-btn-primary{font-size:13px;padding:12px 20px;letter-spacing:1.5px;}

  /* Прибираємо бейдж номера на пікері (просили) */
  .ce-pick-badge{display:none;}
  .ce-pick-controls{padding:2px 6px 6px;gap:4px;}

  /* Pagination */
  .ce-pg-btn{min-width:32px;height:32px;font-size:12px;}

  /* Counter в сайдбарі */
  .ce-counter-row{font-size:11px;}
  .ce-counter-val{font-size:12px;}

  /* Toast */
  .ce-toast{top:10px;right:10px;left:10px;max-width:none;font-size:12px;padding:12px 16px;}

  /* Modal */
  .ce-modal{padding:24px 18px;max-width:95%;}

  /* Footer */
  .ce-footer{padding:20px 14px;font-size:11px;}

  /* Auth modals — на мобільному вертикальний layout */
  .ce-auth-modal{padding:10px;}
  .ce-auth-box{flex-direction:column;border-radius:14px;max-height:calc(100vh - 20px);max-width:100%;}
  .ce-auth-deco{flex:0 0 140px;height:140px;}
  .ce-auth-deco-sign{width:160px;height:160px;right:0;top:4px;}
  .ce-auth-deco-person{height:140%;max-height:200px;right:84px;left: unset;}
  .ce-auth-deco-flowers{width:140px;left:-20px;bottom:-30px;}
  .ce-auth-deco-text{padding:18px 20px;}
  .ce-auth-deco-label{font-size:10px;letter-spacing:2px;}
  .ce-auth-deco-title{font-size:24px;margin:4px 0;}
  .ce-auth-deco-sub{font-size:11px;max-width:200px;}
  .ce-auth-content{padding:16px 20px 20px 20px;}
  .ce-auth-h{font-size:18px;letter-spacing:1.5px;}
  .ce-auth-sub{font-size:11px;}
  .ce-auth-row{grid-template-columns:1fr;gap:14px;}
  .ce-auth-input{font-size:12px;padding:10px 12px;}
  .ce-auth-btn{font-size:13px;padding:12px 20px;letter-spacing:1.5px;}
  .ce-auth-close{top:28px;right:10px;width:32px;height:32px;font-size:20px;}

  /* Hero login button */
  .ce-hero-login-btn{padding:6px 14px;font-size:12px;}
}

/* ═══ Small Mobile ═══ */
@media(max-width:430px){
  .ce-hero-label{font-size:14px;letter-spacing:1.5px;text-align: right;margin-right: 30px;}
  .ce-hero-dates{font-size:14px;text-align: right;margin-right: 30px;}
  .ce-hero-title{font-size:38px;color: #825330;text-align: right;text-shadow: none;filter: none;margin: 30px 0 40px 0;}
  .ce-stats{justify-content: space-around;}
  .ce-stat{min-width:72px;padding:8px 10px;}
  .ce-stat-value{font-size:20px;}
  .ce-stat-order{padding:10px;}
  .ce-stat-order-icon{width:24px;height:24px;}

  .ce-picker{grid-template-columns:repeat(3,1fr);}
  .ce-cat-grid{grid-template-columns:repeat(2,1fr);}
}
