/* PasTele FINAL UI — aligned with Settings visual system */
:root{
  --pf-bg:#f5f7fb;--pf-surface:#fff;--pf-soft:#f8fafc;--pf-border:#e5e7eb;
  --pf-border2:#d7dce5;--pf-text:#111827;--pf-softtext:#4b5563;--pf-muted:#6b7280;
  --pf-primary:#229ed9;--pf-primary-dark:#168ac1;--pf-primary-soft:#eaf7ff;
  --pf-shadow-sm:0 2px 8px rgba(15,23,42,.04);--pf-shadow:0 10px 30px rgba(15,23,42,.07);
  --pf-shadow-lg:0 20px 55px rgba(15,23,42,.12);
}
html[data-theme="dark"],html.theme-dark,body.theme-dark{
  --pf-bg:#0b1220;--pf-surface:#111827;--pf-soft:#172033;--pf-border:#263247;
  --pf-border2:#344158;--pf-text:#f8fafc;--pf-softtext:#cbd5e1;--pf-muted:#94a3b8;
  --pf-primary-soft:rgba(34,158,217,.12);--pf-shadow-sm:0 2px 8px rgba(0,0,0,.2);--pf-shadow:0 12px 35px rgba(0,0,0,.22);
}
.app-page{background:var(--pf-bg);color:var(--pf-text);overflow-x:hidden}
.app-page main,.app-page #main-content{min-width:0}
.app-page .container,.app-page .settings-container{width:min(1160px,calc(100% - 32px));max-width:1160px;margin-inline:auto}
.app-page .section{padding:32px 0 64px}
.app-page .card,.app-page .panel,.app-page .box,.app-page .product-card,.app-page .withdraw-box,.app-page .notification-item{
  border:1px solid var(--pf-border);border-radius:16px;background:var(--pf-surface);box-shadow:var(--pf-shadow-sm)
}
.app-page input,.app-page select,.app-page textarea{
  width:100%;min-height:44px;border:1px solid var(--pf-border2);border-radius:12px;background:var(--pf-surface);
  color:var(--pf-text);padding:10px 13px;outline:none
}
.app-page input:focus,.app-page select:focus,.app-page textarea:focus{border-color:var(--pf-primary);box-shadow:0 0 0 3px rgba(34,158,217,.14)}
.app-page .btn,.app-page button{
  -webkit-tap-highlight-color:transparent
}
.app-page .btn{min-height:44px;border-radius:12px;font-weight:750}
.app-page .primary,.app-page .btn.primary{background:linear-gradient(135deg,#229ed9,#168ac1);border-color:#229ed9;color:#fff}
.app-page .page-title,.app-page h1{letter-spacing:-.035em}
.app-page .content-grid,.app-page .products-grid,.app-page .market-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:16px}
.app-page img{max-width:100%;height:auto}
.marketplace-page,.dashboard-page,.product-page,.withdrawals-page,.profile-page,.create-page{padding-top:72px}
.marketplace-page .container,.dashboard-page .container,.product-page .container,.withdrawals-page .container,.profile-page .container,.create-page .container{width:min(1160px,calc(100% - 32px))}
.market-header,.withdraw-header,.dashboard-header,.page-header{gap:20px}
.marketplace-page .product-card{overflow:hidden;transition:.18s ease}
.marketplace-page .product-card:hover{transform:translateY(-2px);box-shadow:var(--pf-shadow)}
.marketplace-page .product-thumb{aspect-ratio:16/8;max-height:190px}
.marketplace-page .market-grid{max-width:1080px;margin-inline:auto}
.market-pagination,.profile-pagination,#purchasePagination,#marketPagination{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;margin:24px auto 0}
.market-pagination button,.profile-pagination button,#purchasePagination button,#marketPagination button{
  min-width:40px;height:40px;padding:0 11px;border:1px solid var(--pf-border);border-radius:10px;background:var(--pf-surface);color:var(--pf-text);font-weight:750
}
.market-pagination button.active,.profile-pagination button.active,#purchasePagination button.active,#marketPagination button.active{background:#229ed9;color:#fff;border-color:#229ed9}
.final-pager{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;margin:22px 0}
.final-pager button{min-width:40px;height:40px;border:1px solid var(--pf-border);border-radius:10px;background:var(--pf-surface);color:var(--pf-text);font-weight:750}
.final-pager button.active{background:#229ed9;color:#fff;border-color:#229ed9}
.final-pager button:disabled{opacity:.45}
.final-ticker{width:min(1080px,calc(100% - 32px));margin:18px auto 0;border:1px solid rgba(34,158,217,.18);border-radius:14px;background:var(--pf-primary-soft);overflow:hidden;box-shadow:var(--pf-shadow-sm)}
.final-ticker a{display:block;padding:10px 14px;color:var(--pf-primary);text-decoration:none;font-weight:700;white-space:nowrap;overflow:hidden}
.final-ticker span{display:inline-block;animation:pfTicker 18s linear infinite}
@keyframes pfTicker{from{transform:translateX(100%)}to{transform:translateX(-100%)}}
.final-read-more{border:0;background:transparent;color:var(--pf-primary);font-weight:750;cursor:pointer;padding:4px 0}
.final-read-more:hover{text-decoration:underline}
.final-modal{position:fixed;inset:0;z-index:9999;background:rgba(15,23,42,.52);display:grid;place-items:center;padding:16px}
.final-modal-card{width:min(620px,100%);max-height:85vh;overflow:auto;background:var(--pf-surface);color:var(--pf-text);border:1px solid var(--pf-border);border-radius:18px;padding:22px;box-shadow:var(--pf-shadow-lg)}
.final-modal-card header{display:flex;justify-content:space-between;align-items:center;gap:12px}
.final-modal-card .close{border:1px solid var(--pf-border);background:var(--pf-surface);border-radius:10px;width:40px;height:40px}
.manual-box.is-closed form,.manual-box.is-closed .saved-methods,.manual-box.is-closed .rule-info{opacity:.48;pointer-events:none;filter:grayscale(.2)}
.manual-box.is-closed input,.manual-box.is-closed select,.manual-box.is-closed button{pointer-events:none}
.product-detail,.product-card,.profile-card,.notification-card{max-width:1080px;margin-inline:auto}
.product-page #content{max-width:1080px;margin-inline:auto}
.product-engagement,.product-comments{border-radius:16px}
@media(max-width:700px){
  .app-page .container,.app-page .settings-container,.marketplace-page .container,.dashboard-page .container,.product-page .container,.withdrawals-page .container,.profile-page .container,.create-page .container{width:calc(100% - 20px)}
  .app-page .section{padding:22px 0 44px}
  .marketplace-page .market-header,.withdraw-header,.dashboard-header,.page-header{align-items:stretch;flex-direction:column}
  .marketplace-page .market-grid,.app-page .content-grid,.app-page .products-grid{grid-template-columns:1fr}
  .final-ticker{width:calc(100% - 20px)}
  .final-ticker a{font-size:12px}
  .final-modal{padding:10px}
}
@media(min-width:701px){.app-page .market-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.final-ticker span{animation:none}}

/* Notifications */
.final-notifications-wrap{max-width:900px;margin:0 auto;padding:32px 0 64px}
.final-notifications-wrap>header{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}
.final-notifications-wrap .badge{display:inline-flex;gap:8px;align-items:center;padding:7px 12px;border-radius:999px;background:var(--pf-primary-soft);border:1px solid rgba(34,158,217,.18);color:var(--pf-primary);font-size:11px;font-weight:800;letter-spacing:.08em}
.final-notifications-wrap h1{margin:12px 0 6px;font-size:clamp(28px,4vw,40px)}
.final-notifications-wrap>header p{margin:0;color:var(--pf-muted)}
.final-notification-list{display:grid;gap:10px}
.final-notification-list .notification-item{display:grid;grid-template-columns:46px minmax(0,1fr) 8px;gap:13px;padding:15px 16px;cursor:pointer}
.final-notif-icon{width:46px;height:46px;border-radius:13px;background:var(--pf-primary-soft);color:var(--pf-primary);display:grid;place-items:center;font-size:17px}
.final-notif-body{min-width:0}.final-notif-body strong{display:block;font-size:14px}.final-notif-body time{display:block;margin-top:3px;color:var(--pf-muted);font-size:11px}
.final-notif-text{margin:8px 0 0;color:var(--pf-softtext);font-size:13px;line-height:1.65;overflow-wrap:anywhere}
.final-notification-list .unread{border-color:rgba(34,158,217,.3);background:linear-gradient(180deg,var(--pf-surface),var(--pf-primary-soft))}
.final-unread-dot{width:8px;height:8px;border-radius:50%;background:var(--pf-primary);align-self:center;box-shadow:0 0 0 4px rgba(34,158,217,.12)}
.final-notification-list .read .final-unread-dot{background:transparent;box-shadow:none}
.final-notif-link{display:inline-flex;gap:6px;margin-top:9px;color:var(--pf-primary);font-weight:750;text-decoration:none;font-size:12px}
.final-empty{padding:55px 20px;text-align:center;border:1px dashed var(--pf-border2);border-radius:16px;color:var(--pf-muted);background:var(--pf-surface)}
.final-empty i{display:block;font-size:30px;margin-bottom:10px}
@media(max-width:700px){.final-notifications-wrap{padding:22px 10px 44px}.final-notifications-wrap>header{align-items:stretch;flex-direction:column}.final-notification-list .notification-item{grid-template-columns:40px minmax(0,1fr) 7px;padding:13px}.final-notif-icon{width:40px;height:40px}}
/* Create forms: compact Settings-like surface */
.create-detail-page main,.create-page main{padding-top:72px}
.create-detail-page .create-card,.create-detail-page .form-card,.create-detail-page form{max-width:820px;margin:0 auto}
.create-detail-page .create-card,.create-detail-page .form-card{background:var(--pf-surface);border:1px solid var(--pf-border);border-radius:18px;box-shadow:var(--pf-shadow-sm)}
.create-detail-page .loading{display:none!important}
.create-detail-page button[aria-busy="true"]{opacity:.8}