

:root{
  --pn-bg:#F8FAFF; --pn-bg2:#F2F6FA; --pn-accent:#EBEFFE;
  --pn-card:#FFFFFF; --pn-border:#F0F0F0; --pn-border2:#E4EAF3;
  --pn-text:#4A517D; --pn-bold:#21294D; --pn-gray:#B3B7C5; --pn-muted:#90A0B7; --pn-icon:#9AA6C0;
  --pn-primary:#3377e8; --pn-primary-600:#2b6fe0; --pn-primary-700:#2264d1;
  --pn-primary2:#134fcd; --pn-primary-100:#E3EEFE; --pn-primary-300:#A9C9FB;
  --pn-danger:#F43F67; --pn-success:#0ec98f; --pn-info:#0D43FF;
  --pn-purple:#8b5cf6; --pn-peach:#FDAC74; --pn-bronze:#C9803A;
  --pn-yellow:#eab308; --pn-accent-800:#2B345A;
  --pn-shadow:0 18px 50px -30px rgba(33,41,77,.28);
}

.panel-body{overflow:hidden;background:var(--pn-bg)}
.panel-body .chat-fab{display:none!important}
.panel-page{padding-block:clamp(28px,4.2vw,56px)}
.panel-shell{
  display:flex;align-items:stretch;background:var(--pn-card);
  height:100vh;height:100dvh;min-height:0;overflow:hidden;
}

.panel-side{
  width:244px;flex:none;display:flex;flex-direction:column;
  background:var(--pn-card);border-inline-end:1px solid var(--pn-border);
  overflow:hidden;transition:width .3s ease;
}

.ps-profile{display:flex;flex-direction:column;align-items:center;gap:4px;margin:20px 0 14px;padding:0 14px}
.ps-ring{position:relative;width:70px;height:70px;margin-bottom:6px}
.ps-ring svg{width:70px;height:70px}
.ps-ring .trail{fill:none;stroke:var(--pn-bg2);stroke-width:6}
.ps-ring .progress{fill:none;stroke:var(--pn-peach);stroke-width:6;stroke-dasharray:295.31;stroke-dashoffset:177.18;transition:stroke-dashoffset 1s ease}
.ps-avatar{
  position:absolute;inset:5px;border-radius:50%;display:grid;place-items:center;
  font-size:20px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);border:2px solid #fff;
}
.ps-name{font-size:15px;font-weight:800;color:var(--pn-text);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center}
.ps-balance{font-size:12px;font-weight:500;color:var(--pn-text);text-align:center}

.ps-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:14px;display:flex;flex-direction:column;gap:2px}
.ps-nav::-webkit-scrollbar{width:4px}
.ps-nav::-webkit-scrollbar-thumb{background:var(--pn-border2);border-radius:4px}
.ps-link{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  height:45px;padding:0 12px;border-radius:8px;flex:none;
  font-size:12.8px;font-weight:500;color:var(--pn-text);transition:background .15s;
}
.ps-link:hover{background:var(--pn-bg2)}
.ps-link.active{background:var(--pn-bg2)}
.ps-link .l{display:flex;align-items:center;gap:11px;min-width:0}
.ps-link .l svg{width:24px;height:24px;flex:none;color:var(--pn-primary-700);transition:color .15s}
.ps-link .tx{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight: bold;color: var(--pn-primary-700);}
.ps-link.active .l svg{color:#f7b900}
.ps-link.active .tx{color:#f7b900}
.ps-link .chev2{width:16px;height:16px;flex:none;color:var(--pn-icon)}

.ps-logout{
  display:flex;align-items:center;gap:11px;height:42px;padding:0 26px;flex:none;
  font-size:12.8px;font-weight:600;color:var(--pn-danger);transition:background .15s;
}
.ps-logout:hover{background:#fdeef2}
.ps-logout svg{width:20px;height:20px}

.pn-logout-card{border:1px solid #FBDDE6;background:linear-gradient(135deg,#fff 55%,#FFF6F8)}
.pn-logout{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pn-lg-ico{width:42px;height:42px;border-radius:12px;background:#FDEEF2;color:var(--pn-danger);display:grid;place-items:center;flex:none}
.pn-lg-ico svg{width:20px;height:20px}
.pn-lg-txt{flex:1;min-width:150px}
.pn-lg-txt b{display:block;font-size:13.5px;color:var(--pn-bold)}
.pn-lg-txt span{display:block;font-size:11.5px;color:var(--pn-muted);margin-top:3px}
.btn-logout{background:#fff;color:var(--pn-danger);border:1px solid #F6C7D2;flex:none}
.btn-logout:hover{background:var(--pn-danger);color:#fff;border-color:var(--pn-danger)}

.ps-foot{border-top:1px solid var(--pn-border);padding:8px 20px;display:flex;align-items:center;justify-content:space-between;flex:none}
.ps-foot .brand{width:35px;height:35px;border-radius:9px;overflow:hidden;flex:none;display:grid;place-items:center;background:var(--pn-primary-100)}
.ps-foot .brand img{width:35px;height:35px;object-fit:cover}
.ps-foot .soc{display:flex;gap:12px;justify-content:flex-end;align-items:center}
.ps-foot .soc a{width:20px;height:20px;display:grid;place-items:center;color:var(--pn-icon);transition:color .15s}
.ps-foot .soc a:hover{color:var(--pn-primary)}
.ps-foot .soc svg,.ps-foot .soc img{width:20px;height:20px;object-fit:contain;display:block}
.ps-foot .soc img{filter:grayscale(1) brightness(0) invert(.58);opacity:.9}
.ps-foot .soc a:hover img{opacity:1;filter:grayscale(1) brightness(0) invert(.35)}

.panel-shell.collapsed .panel-side{width:76px}
.panel-shell.collapsed .ps-name,
.panel-shell.collapsed .ps-balance,
.panel-shell.collapsed .ps-link .tx,
.panel-shell.collapsed .ps-link .chev2,
.panel-shell.collapsed .ps-logout span,
.panel-shell.collapsed .ps-foot .soc,
.panel-shell.collapsed .ps-foot .brand{display:none}
.panel-shell.collapsed .ps-link{justify-content:center;padding:0}
.panel-shell.collapsed .ps-link .l{margin:0 auto}
.panel-shell.collapsed .ps-logout{justify-content:center;padding:0}
.panel-shell.collapsed .ps-profile{padding:0}
.panel-shell.collapsed .ps-foot{justify-content:center;padding:8px 0}

.panel-main{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--pn-bg)}

.pn-topbar{
  flex:none;height:64px;background:var(--pn-card);border-bottom:1px solid var(--pn-border);
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 14px;
}
.pn-topbar .t-l{display:flex;align-items:center;gap:14px;min-width:0}
.pn-topbar h1{font-size:15px;font-weight:700;color:var(--pn-bold);white-space:nowrap}
.pn-burger{display:none;width:18px;height:18px;position:relative;cursor:pointer;flex:none}
.pn-burger i{position:absolute;left:0;height:2px;border-radius:2px;background:#1A1C20;transition:.15s}
.pn-burger i:nth-child(1){top:1px;width:12.5px;transform:rotate(45deg);transform-origin:top left}
.pn-burger i:nth-child(2){top:8px;width:18px;opacity:0}
.pn-burger i:nth-child(3){bottom:1px;width:12.5px;transform:rotate(-45deg);transform-origin:bottom left}
.panel-shell:not(.collapsed) .pn-burger i:nth-child(1){transform:rotate(0);width:18px}
.panel-shell:not(.collapsed) .pn-burger i:nth-child(2){opacity:1}
.panel-shell:not(.collapsed) .pn-burger i:nth-child(3){transform:rotate(0);width:18px}
.pn-topbar .t-r{display:flex;align-items:center;gap:12px;height:100%}
.pn-av{
  width:35px;height:35px;border-radius:8px;overflow:hidden;cursor:pointer;flex:none;
  display:grid;place-items:center;color:#fff;font-weight:800;font-size:15px;
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);
}
.pn-ico-btn{
  width:40px;height:40px;border-radius:8px;display:grid;place-items:center;
  color:var(--pn-icon);position:relative;cursor:pointer;transition:.15s;flex:none;
}
.pn-ico-btn:hover{background:rgba(33,41,77,.06);color:var(--pn-bold)}
.pn-ico-btn svg{width:24px;height:24px}
.pn-ico-btn .live{position:absolute;top:7px;inset-inline-end:6px;width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 2px #fff}
.pn-ico-btn .live::after{content:"";position:absolute;inset:0;border-radius:50%;background:#22c55e;animation:pnping 1.8s ease-out infinite}
.pn-badge-count{
  position:absolute;top:5px;inset-inline-end:3px;min-width:20px;height:20px;padding:0 5px;
  border-radius:999px;background:#ef4444;color:#fff;font-size:10.5px;font-weight:700;
  display:grid;place-items:center;border:2px solid #fff;
}
@keyframes pnping{0%{transform:scale(1);opacity:.85}70%,100%{transform:scale(2.7);opacity:0}}

.panel-content{
  flex:1;min-width:0;min-height:0;overflow-y:auto;overflow-x:hidden;background:var(--pn-bg);
  padding:16px 14px 150px;scrollbar-width:thin;scrollbar-color:#c9d8f2 transparent;
  display:flex;flex-direction:column;
}
.panel-content::-webkit-scrollbar{width:8px}
.panel-content::-webkit-scrollbar-track{background:transparent}
.panel-content::-webkit-scrollbar-thumb{background:#c9d8f2;border-radius:8px}
.pn-wrap{
  display:flex;flex-direction:column;gap:20px;max-width:1440px;
  margin:0 auto;width:100%;min-width:0;flex:1;
}

.pn-user-card{background:var(--pn-card);border-radius:12px;padding:16px}
.pn-user-grid{display:grid;gap:16px;align-items:stretch;min-height:220px}
.pn-user-col{display:flex;flex-direction:column;gap:16px;min-width:0;justify-content:center}
.pn-user-info{display:flex;align-items:flex-start;justify-content:center;gap:12px}
.pn-user-info b{display:block;font-size:16px;font-weight:800;color:var(--pn-text);text-align: center;}
.pn-user-info .ph{display:block;font-size:12px;font-weight:600;color:rgba(74,81,125,.7);direction:ltr;text-align:right;margin-top:3px}
.pn-user-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:20px 10px}

.pn-banner{
  position:relative;overflow:hidden;border-radius:12px;
  touch-action:pan-y;user-select:none;-webkit-user-select:none;
  background:var(--pn-bg2);
  height:100%;min-height:200px;max-height:320px;
}
.pn-banner .bn-track{display:flex;height:100%;transition:transform .5s ease;will-change:transform}
.pn-banner .bn-slide{min-width:100%;flex:none;display:flex;align-items:stretch;cursor:grab;touch-action:pan-y;width: fit-content;}
.pn-banner .bn-slide:active{cursor:grabbing}
.pn-banner .bn-slide a{
  display:flex;align-items:stretch;width:100%;
  -webkit-user-drag:none;user-drag:none;
}
.pn-banner .bn-slide img{
  width:100%;display:block;
  background:var(--pn-bg2);-webkit-user-drag:none;user-drag:none;user-select:none;
  height:auto;min-height:200px;max-height:320px;
}
.pn-action{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:12px 2px;border-radius:8px;cursor:pointer;transition:background .15s}
.pn-action:hover{background:var(--pn-bg2)}
.pn-action .a-ico{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;transition:background .15s}
.pn-action:hover .a-ico{background:var(--pn-primary-100)}
.pn-action .a-ico svg{width:32px;height:32px;fill:#0e3e8500}
.pn-action span{font-size:12px;font-weight:700;color:var(--pn-text)}

.pn-sec-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 2px;margin-bottom:10px}
.pn-sec-head h2{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--pn-text);min-width:0}
.pn-sec-head h2 svg{width:20px;height:20px;color:var(--pn-icon);flex:none}
.pn-sec-head a{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--pn-gray);transition:color .15s;flex:none}
.pn-sec-head a:hover{color:var(--pn-primary)}
.pn-sec-head a svg{width:18px;height:18px}
.pn-sec-head a:hover svg{color:var(--pn-primary)}

.pn-slider{
  display:flex;gap:14px;
  overflow-x:auto;overflow-y:hidden;
  padding:4px 2px 12px;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  cursor:grab;
  user-select:none;
  -webkit-user-select:none;
  -webkit-overflow-scrolling:touch;
}
.pn-slider::-webkit-scrollbar{display:none}
.pn-slider.dragging{cursor:grabbing;scroll-behavior:auto;scroll-snap-type:none}

.pn-svc{
  scroll-snap-align:start;
  flex:0 0 auto;
  width:clamp(180px,22vw,260px);
  background:var(--pn-card);
  border-radius:12px;
  overflow:hidden;
  border:1px solid var(--pn-border);
  transition:transform .2s ease,box-shadow .2s ease;
}
.pn-svc:hover{transform:translateY(-4px);box-shadow:0 16px 32px -12px rgba(33,41,77,.25)}
.pn-svc .svc-art{
  display:block;
  overflow:hidden;
  background:var(--pn-bg2);
  position:relative;
  aspect-ratio:16/9;
}
.pn-svc .svc-art img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
  transition:transform .4s ease;
  pointer-events:none;
  -webkit-user-drag:none;
  user-drag:none;
}
.pn-svc:hover .svc-art img{transform:scale(1.05)}

.pn-grid{display:grid;gap:16px}
.pn-card{background:var(--pn-card);border-radius:12px;padding:16px;min-width:0}
.pn-card .card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.pn-card .card-head h3{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:800;color:var(--pn-text);min-width:0}
.pn-card .card-head svg{width:20px;height:20px;color:var(--pn-icon);flex:none}
.pn-card .card-head a{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--pn-gray);transition:color .15s;flex:none}
.pn-card .card-head a:hover{color:var(--pn-primary)}

.pn-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:250px;text-align:center}
.pn-empty .mascot{opacity:.32;width:120px;height:120px;color:var(--pn-gray)}
.pn-empty .mascot svg{width:120px;height:120px}
.pn-empty p{font-size:14px;color:var(--pn-text);margin-top:12px}
.pn-empty .btn-cta{
  display:inline-flex;align-items:center;gap:6px;margin-top:10px;
  background:var(--pn-primary);color:#fff;font-size:12px;font-weight:700;
  padding:8px 20px;border-radius:6px;transition:background .15s;
}
.pn-empty .btn-cta:hover{background:var(--pn-primary-600)}

.pn-rate-head{
  display:flex;justify-content:space-between;align-items:center;
  border-bottom:1px solid var(--pn-border);height:32px;
  font-size:12px;font-weight:600;color:var(--pn-text);opacity:.75;
}
.pn-rate-head .rh-l{display:flex;gap:24px;padding-inline-start:8px}
.pn-rate-head .rh-r{display:flex;gap:24px}
.pn-rate-head .rh-r span{width:fit-content;text-align:center}
.pn-rates{display:flex;flex-direction:column;gap:22px;max-height:284px;overflow-y:auto;padding:10px 6px 4px 0;scrollbar-width:thin;scrollbar-color:#c9d8f2 transparent}
.pn-rates::-webkit-scrollbar{width:6px}
.pn-rates::-webkit-scrollbar-thumb{background:#c9d8f2;border-radius:6px}
.pn-rate-row{display:flex;justify-content:space-between;align-items:center;min-height:36px;gap:8px}
.pn-rate-row .r-coin{display:flex;align-items:center;gap:12px;min-width:0}
.pn-rate-row .ci{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;flex:none}
.pn-rate-row .ci svg{width:22px;height:22px}
.pn-rate-row b{font-size:12px;font-weight:700;color:var(--pn-bold);white-space:nowrap}
.pn-rate-row .r-nums{display:flex;align-items:center;gap:16px;flex:none}
.pn-rate-row .pill{width:70px;padding:3px 12px;border-radius:6px;font-size:11.5px;font-weight:700;text-align:center;direction:ltr}
.pill.buy{background:rgba(14,201,143,.15);color:var(--pn-success)}
.pill.sell{background:rgba(244,63,103,.15);color:var(--pn-danger)}

.pn-scrim{
  position:fixed;inset:0;background:rgba(12,18,38,.5);z-index:110;
  opacity:0;visibility:hidden;transition:.25s;backdrop-filter:blur(2px);
}
.pn-scrim.on{opacity:1;visibility:visible}
.pn-drawer{
  position:fixed;top:0;bottom:0;left:0;width:min(452px,100vw);background:var(--pn-card);
  z-index:120;transform:translateX(-104%);transition:transform .28s cubic-bezier(.22,.61,.36,1);
  display:flex;flex-direction:column;box-shadow:-24px 0 60px -24px rgba(16,24,40,.45);
}
.pn-drawer.open{transform:none}
.pn-drawer-head{height:68px;flex:none;display:flex;align-items:center;gap:16px;padding:0 16px;border-bottom:1px solid var(--pn-border)}
.pn-drawer-head .x{width:36px;height:36px;border-radius:8px;display:grid;place-items:center;color:var(--pn-gray);cursor:pointer;transition:.15s;flex:none}
.pn-drawer-head .x:hover{background:var(--pn-bg2)}
.pn-drawer-head .x svg{width:24px;height:24px}
.pn-drawer-head .ttl{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:700;color:var(--pn-text)}
.pn-drawer-head .ttl svg{width:24px;height:24px;color:var(--pn-icon)}
.pn-drawer-tabs{display:flex;flex:none;background:var(--pn-bg2)}
.pn-dtab{
  flex:1;height:56px;display:flex;align-items:center;justify-content:center;gap:8px;
  font-size:14px;font-weight:700;color:var(--pn-bold);cursor:pointer;position:relative;transition:color .15s;
}
.pn-dtab:hover{color:var(--pn-primary)}
.pn-dtab.active{color:var(--pn-primary)}
.pn-dtab.active::after{content:"";position:absolute;inset-inline:0;bottom:0;height:2px;background:var(--pn-primary)}
.pn-dtab .badge{
  min-width:24px;height:24px;padding:0 6px;border-radius:999px;
  background:rgba(244,63,103,.2);color:var(--pn-danger);font-size:12px;font-weight:700;
  display:grid;place-items:center;
}
.pn-drawer-body{flex:1;overflow-y:auto}
.pn-dpane{display:none}
.pn-dpane.active{display:block}

.pn-notif{display:flex;flex-direction:column;gap:10px;padding:26px 30px;border-bottom:1px solid rgba(240,240,240,.55);cursor:pointer;transition:background .2s}
.pn-notif:hover{background:var(--pn-bg)}
.pn-notif .n-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pn-notif .n-top .t{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:700;color:var(--pn-bold);min-width:0}
.pn-notif .n-top .t .dot{width:8px;height:8px;border-radius:50%;background:#f43f5e;position:relative;flex:none}
.pn-notif .n-top .t .dot::after{content:"";position:absolute;inset:0;border-radius:50%;background:#f43f5e;animation:pnping 1.7s ease-out infinite}
.pn-notif .n-top .t b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn-notif .n-top time{font-size:12px;font-weight:500;color:var(--pn-gray);direction:ltr;flex:none}
.pn-notif .n-body{font-size:12px;color:var(--pn-text);line-height:2.3;text-align:justify}

.pn-verify{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:16px;padding:18px 22px;background:var(--pn-bg);border-radius:12px;cursor:pointer;transition:background .15s}
.pn-verify:hover{background:var(--pn-bg2)}
.pn-verify .v-l{display:flex;align-items:center;gap:10px;min-width:0}
.pn-verify .v-l svg{width:20px;height:20px;color:var(--pn-icon);flex:none}
.pn-verify .v-l b{font-size:14px;font-weight:700;color:var(--pn-bold);white-space:nowrap}
.pn-verify .v-s{width:120px;flex:none;display:flex;justify-content:center}
.pn-status{
  display:flex;justify-content:center;align-items:center;padding:6px 10px;border-radius:8px;
  font-size:12px;font-weight:700;background:rgba(13,67,255,.2);color:var(--pn-info);width:100%;
}
.pn-status.warn{background:rgba(244,63,103,.15);color:var(--pn-danger)}
.pn-status.ok{background:rgba(14,201,143,.15);color:var(--pn-success)}

.pn-mobile-bottom{display:none;position:fixed;bottom:0;left:0;right:0;z-index:100}
.pn-copyline{background:var(--pn-card);text-align:center;font-size:12px;font-weight:400;color:rgba(74,81,125,.7);padding:10px 0 4px;border-top:1px solid var(--pn-border)}
.pn-mobile-nav{background:var(--pn-card);height:66px;box-shadow:0 -8px 26px -14px rgba(33,41,77,.25)}
.pn-mobile-nav .inner{position:relative;height:100%;display:flex;align-items:center;justify-content:space-between;max-width:620px;margin:0 auto;padding:0 24px}
.pn-m-item{display:flex;flex-direction:column;align-items:center;gap:4px;cursor:pointer;color:rgba(74,81,125,.8);transition:color .15s}
.pn-m-item svg{width:24px;height:24px}
.pn-m-item span{font-size:12px;font-weight:800}
.pn-m-item:hover,.pn-m-item.active{color:var(--pn-primary)}
.pn-m-item.fab-item{position:static}
.pn-m-item.fab-item .lbl{margin-top:18px}
.pn-m-fab{
  position:absolute;top:-22px;left:50%;transform:translateX(-50%);
  width:54px;height:54px;border-radius:50%;background:var(--pn-primary);
  display:grid;place-items:center;color:#fff;box-shadow:0 12px 22px -8px rgba(51,119,232,.7);
}
.pn-m-fab svg{width:24px;height:24px}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  font-family:inherit;font-weight:700;font-size:12.5px;border-radius:6px;
  padding:8px 20px;cursor:pointer;border:none;text-decoration:none;line-height:1.6;
  transition:background .15s,transform .15s,color .15s,border-color .15s;
}
.btn svg{width:15px;height:15px}
.btn-primary{background:var(--pn-primary);color:#fff}
.btn-primary:hover{background:var(--pn-primary-600)}
.btn-ghost{background:transparent;color:var(--pn-text);border:1px solid var(--pn-border2)}
.btn-ghost:hover{border-color:var(--pn-primary);color:var(--pn-primary)}
.btn-soft{background:var(--pn-bg2);color:var(--pn-primary-700)}
.btn-soft:hover{background:var(--pn-accent)}
.btn-white{background:#fff;color:var(--pn-primary-700);border:1px solid var(--pn-border2)}
.btn-white:hover{border-color:var(--pn-primary)}
.btn-sm{padding:5px 12px;font-size:12px}
.btn-md{padding:8px 18px;font-size:12.5px}
.btn-block{width:100%}

.pn-table-wrap{overflow-x:auto;border-radius:12px}
.pn-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:640px}
.pn-table thead th{
  text-align:right;padding:11px 14px;font-weight:700;color:var(--pn-gray);font-size:11.5px;
  border-bottom:1px solid var(--pn-border);white-space:nowrap;
}
.pn-table tbody td{padding:13px 14px;border-bottom:1px solid var(--pn-border);color:var(--pn-text);white-space:nowrap}
.pn-table tbody tr:last-child td{border-bottom:none}
.pn-table tbody tr:hover td{background:var(--pn-bg)}
.pn-table .latin{direction:ltr;text-align:right;font-family:inherit}

.pn-badge{
  display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;
  font-size:11.5px;font-weight:700;white-space:nowrap;
}
.pn-badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.pn-badge.b-blue{background:rgba(51,119,232,.12);color:var(--pn-primary-700)}
.pn-badge.b-green{background:rgba(14,201,143,.14);color:var(--pn-success)}
.pn-badge.b-gray{background:rgba(74,81,125,.1);color:var(--pn-gray)}
.pn-badge.b-red{background:rgba(244,63,103,.13);color:var(--pn-danger)}
.pn-badge.b-amber{background:rgba(232,150,12,.14);color:#c47a08}
.pn-badge.b-purple{background:rgba(139,92,246,.14);color:#7c3aed}

.pn-kv{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid #F3F6FC;font-size:12.5px}
.pn-kv span{color:var(--pn-gray)}
.pn-kv b{color:var(--pn-bold);font-weight:700}

.pn-timeline{position:relative;padding-inline-start:4px}
.pn-tl{display:flex;gap:12px;position:relative;padding-bottom:17px}
.pn-tl::before{content:"";position:absolute;inset-inline-start:10px;top:22px;bottom:0;width:2px;background:var(--pn-border2)}
.pn-tl:last-child::before{display:none}
.pn-tl .d{width:22px;height:22px;border-radius:50%;flex:none;display:grid;place-items:center;margin-top:2px;position:relative;z-index:1}
.pn-tl .d svg{width:11px;height:11px;color:#fff}
.pn-tl b{display:block;font-size:12.5px;font-weight:700;color:var(--pn-bold)}
.pn-tl p{font-size:11.5px;color:var(--pn-text);margin-top:2px}
.pn-tl time{font-size:10.5px;color:var(--pn-gray)}

.pn-chat{display:flex;flex-direction:column;gap:11px;max-height:320px;overflow-y:auto;padding:3px 2px}
.pn-msg{max-width:78%;padding:10px 15px;border-radius:15px;font-size:12.5px;line-height:1.9;overflow-wrap:anywhere}
.pn-msg.me{align-self:flex-start;background:var(--pn-primary);color:#fff;border-start-start-radius:5px}
.pn-msg.other{align-self:flex-end;background:var(--pn-bg2);color:var(--pn-bold);border:1px solid var(--pn-border);border-start-end-radius:5px}
.pn-msg .m-time{display:block;font-size:10px;opacity:.75;margin-top:4px}
.pn-msg.other .m-time{color:var(--pn-gray)}

.pn-field{margin-bottom:13px}
.pn-field label{display:block;font-size:12px;font-weight:700;color:var(--pn-bold);margin-bottom:6px}
.pn-field .req{color:var(--pn-danger)}
.pn-input,.pn-select,textarea.pn-input{
  width:100%;background:var(--pn-bg);border:1px solid var(--pn-border);border-radius:8px;
  padding:10px 14px;font-size:12.5px;color:var(--pn-bold);outline:none;transition:.15s;font:inherit;resize:vertical;
}
.pn-input:focus,.pn-select:focus,textarea.pn-input:focus{border-color:var(--pn-primary);box-shadow:0 0 0 3px rgba(51,119,232,.14);background:#fff}
.pn-input::placeholder{color:var(--pn-gray)}
.pn-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23B3B7C5' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center;padding-inline-end:34px;cursor:pointer}
.pn-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}

.pn-modal{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
  z-index:130;visibility:hidden;opacity:0;pointer-events:none;
  transition:opacity .2s,visibility .2s;padding:16px;
  overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;
}
.pn-modal.open{visibility:visible;opacity:1;pointer-events:auto}
.pn-modal .m-scrim{position:fixed;inset:0;background:rgba(12,18,38,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.pn-modal-card{
  position:relative;background:#fff;border-radius:14px;
  width:min(500px,100%);max-width:100%;
  max-height:min(88vh,calc(100dvh - 32px));
  overflow:hidden;margin:auto;flex:none;
  box-shadow:0 50px 110px -30px rgba(0,0,0,.55);
  transform:translateY(14px) scale(.98);
  transition:transform .22s cubic-bezier(.22,.61,.36,1);
  display:flex;flex-direction:column;min-width:0;
}
.pn-modal.open .pn-modal-card{transform:none}
.pn-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 20px;border-bottom:1px solid var(--pn-border);position:sticky;top:0;background:#fff;z-index:2;flex:none}
.pn-modal-head h3{font-size:14.5px;font-weight:800;color:var(--pn-bold);min-width:0;overflow-wrap:anywhere}
.pn-modal-head .x{width:34px;height:34px;border-radius:8px;display:grid;place-items:center;color:var(--pn-gray);transition:.15s;flex:none}
.pn-modal-head .x:hover{background:#fdeef2;color:var(--pn-danger)}
.pn-modal-head .x svg{width:17px;height:17px}
.pn-modal-body{padding:18px 20px;overflow-y:auto;min-height:0;flex:1;-webkit-overflow-scrolling:touch}
.pn-modal-foot{padding:14px 20px;border-top:1px solid var(--pn-border);display:flex;justify-content:flex-end;gap:10px;position:sticky;bottom:0;background:#fff;flex-wrap:wrap;flex:none}
body.pn-modal-open,body.pn-modal-open .panel-content{overflow:hidden}

.pn-switch{position:relative;display:inline-block;width:44px;height:24px;background:var(--pn-border2);border-radius:999px;transition:.2s;cursor:pointer;flex:none}
.pn-switch::after{content:"";position:absolute;top:3px;inset-inline-start:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.pn-switch.on{background:var(--pn-primary)}
.pn-switch.on::after{inset-inline-start:23px}
.pn-switch-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #F3F6FC}
.pn-switch-row:last-child{border-bottom:none}
.pn-switch-row b{font-size:12.5px;font-weight:700;color:var(--pn-bold)}
.pn-switch-row p{font-size:11px;color:var(--pn-gray)}

.g-blue{background:linear-gradient(135deg,#EAF1FE,#DFE8FD)}
.g-green{background:linear-gradient(135deg,#E6F7F0,#D8F1E8)}
.g-orange{background:linear-gradient(135deg,#FEF1E0,#FBE7CC)}
.g-purple{background:linear-gradient(135deg,#F1EAFF,#E9DEFB)}
.g-teal{background:linear-gradient(135deg,#E2F7F5,#D6F1EE)}
.g-gold{background:linear-gradient(168deg,#FDF7E3,#FBEEC9)}
.g-navy{background:linear-gradient(135deg,#E9EDF8,#DEE4F3)}
.g-red{background:linear-gradient(135deg,#FDEBEE,#FADDE3)}
.g-sky{background:linear-gradient(135deg,#E8F3FD,#DCEBFB)}

.pn-login{display:grid;place-items:center;min-height:100vh;min-height:100dvh;padding:2rem 16px;background:var(--pn-bg)}
.pn-login-card{width:min(400px,94vw);background:#fff;border:1px solid var(--pn-border);border-radius:14px;box-shadow:var(--pn-shadow);padding:32px 28px}
.pn-login-card .llogo{width:52px;height:52px;border-radius:14px;margin:0 auto 12px;background:var(--pn-primary);display:grid;place-items:center;color:#fff}
.pn-login-card .llogo svg{width:27px;height:27px}
.pn-login-card h2{text-align:center;font-size:20px;font-weight:800;color:var(--pn-bold)}
.pn-login-card .sub{text-align:center;font-size:14px;color:var(--pn-gray);margin-bottom:20px}

.toast-wrap{position:fixed;bottom:84px;inset-inline-start:20px;z-index:140;display:flex;flex-direction:column;gap:10px}
.toast{background:#fff;border:1px solid var(--pn-border);border-inline-start:4px solid var(--pn-success);border-radius:10px;padding:12px 16px;font-size:12.5px;color:var(--pn-bold);box-shadow:0 24px 60px -20px rgba(16,24,40,.4);display:flex;align-items:center;gap:10px;animation:toastIn .25s ease;max-width:330px;font-family:inherit}
.toast.warn{border-inline-start-color:#eab308}
.toast.err{border-inline-start-color:var(--pn-danger)}
.toast svg{width:18px;height:18px;color:var(--pn-success);flex:none}
.toast.warn svg{color:#eab308}
.toast.err svg{color:var(--pn-danger)}
@keyframes toastIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

@media (min-width:1024px){
  .pn-topbar{height:68px;padding:0 28px}
  .panel-content{padding:20px 24px 24px}
  .pn-wrap{margin-top:20px;width:97%}
  .pn-user-card{padding:20px}
  .pn-user-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:32px;align-items:stretch}
  .pn-user-info{padding:0 4px}
  .pn-grid{grid-template-columns:1fr 1fr}
  .pn-card{padding:20px}
  .pn-burger{display:block}

}

@media (max-width:1023px){
  .panel-side{display:none}
  .pn-mobile-bottom{display:block}
    .pn-topbar h1{display:none}
}
@media (max-width:560px){
  .pn-form-row{grid-template-columns:1fr}
  .panel-shell{height:100vh;height:100dvh}
  .pn-user-card{padding:14px}
  .pn-user-info b{font-size:15px;}
  .pn-action .a-ico{width:40px;height:40px}
  .pn-action .a-ico svg{width:26px;height:26px}
  .pn-action span{font-size:10px}
  .pn-verify{margin:12px;padding:14px 16px}
  .pn-verify .v-s{width:96px}
  .pn-modal{padding:0;align-items:flex-end;justify-content:center}
  .pn-modal-card,
  .of-notes-modal .pn-modal-card,
  .of-success-card,
  .of-pay-card{
    width:100%!important;max-width:100%;
    max-height:min(92dvh,92vh);
    border-radius:16px 16px 0 0;margin:0;align-self:stretch;
  }
  .pn-modal-head{padding:14px 16px}
  .pn-modal-body{padding:15px 16px}
  .pn-modal-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px))}
  .of-notes-text{max-height:none;overflow:visible;padding:0}
  .pn-modal-card .pn-form-row{grid-template-columns:1fr}
  .toast-wrap{bottom:120px;inset-inline-start:12px}
  .pn-slider{gap:10px;padding:4px 2px 10px}
  .pn-svc{width:clamp(140px,38vw,180px);border-radius:10px}
}

.pn-pagebar{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-bottom:14px}
.pn-pagebar:empty{display:none}

.pn-verify .v-ico{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--pn-bg2);color:var(--pn-text);flex:none}
.pn-verify .v-ico svg{width:19px;height:19px}
.pn-verify .v-t{min-width:0}
.pn-verify .v-t b{display:block;font-size:12.5px;font-weight:700;color:var(--pn-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn-verify .v-t span{font-size:11px;color:var(--pn-gray)}

.pn-card .pn-verify{margin:0;background:transparent;border-radius:8px;cursor:default;padding: 10px 8px;}
.pn-card .pn-verify:hover{background:transparent}
.pn-card .pn-verify .v-ico{background:var(--pn-bg2)}
.pn-card .pn-verify .v-l b{font-size:12.5px}

.pn-crumb{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--pn-text);margin-bottom:14px;flex:none}
.pn-crumb a{color:var(--pn-text);transition:color .15s}
.pn-crumb a:hover{color:var(--pn-primary)}
.pn-crumb span:last-child{color:rgba(74,81,125,.5)}

.pn-services{display:flex;border:1px solid var(--pn-accent);border-radius:12px;overflow:hidden;background:var(--pn-card);flex:1;min-height:0}
.svc-rail{width:70px;flex:none;background:var(--pn-bg2);display:flex;flex-direction:column;align-items:center;padding:14px 0;gap:4px;overflow-y:auto;scrollbar-width:none;cursor:grabbing}
.svc-rail.svc-dragging{cursor:grabbing;user-select:none;-webkit-user-select:none}
.svc-rail::-webkit-scrollbar{display:none}
.rail-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;border-radius:10px;font-size:10px;font-weight:600;color:var(--pn-text);width:62px}
.rail-item img,.rail-item svg{width:40px;height:40px;border-radius:10px;object-fit:cover;flex:none}
.rail-item:hover{background:var(--pn-accent)}
.rail-item.active{background:var(--pn-accent);color:var(--pn-primary-700)}

.svc-main{flex:1;min-width:0;padding:18px 20px;display:flex;flex-direction:column;gap:14px;min-height:0}
.svc-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;flex:none}
.svc-search{flex:1;min-width:180px;display:flex;align-items:center;gap:8px;background:var(--pn-bg);border:1px solid var(--pn-border);border-radius:8px;padding:0 12px;height:38px}
.svc-search svg{width:18px;height:18px;color:var(--pn-gray);flex:none}
.svc-search input{flex:1;border:none;outline:none;background:transparent;font-size:13px;font-weight:600;color:var(--pn-bold);font-family:inherit;min-width:0;width:100%}
.svc-search input::placeholder{color:var(--pn-gray);font-weight:500}

.svc-cat{position:relative;flex:none}
.svc-cat-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:170px;height:38px;padding:0 14px;background:var(--pn-bg);border:1px solid var(--pn-border);border-radius:8px;font-size:13px;font-weight:700;color:var(--pn-bold);font-family:inherit;cursor:pointer;transition:.15s}
.svc-cat-btn:hover{border-color:var(--pn-primary)}
.svc-cat-btn svg{width:14px;height:14px;color:var(--pn-gray);transition:transform .2s}
.svc-cat.open .svc-cat-btn svg{transform:rotate(180deg)}
.svc-cat-menu{position:absolute;top:calc(100% + 6px);inset-inline-start:0;z-index:60;min-width:210px;max-height:260px;overflow-y:auto;background:#fff;border:1px solid var(--pn-border);border-radius:10px;box-shadow:0 18px 40px -18px rgba(33,41,77,.35);padding:6px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s}
.svc-cat.open .svc-cat-menu{opacity:1;visibility:visible;transform:none}
.svc-cat-menu button{display:flex;align-items:center;width:100%;padding:8px 12px;border-radius:6px;font-size:13px;font-weight:500;color:var(--pn-text);font-family:inherit;text-align:start;transition:.12s}
.svc-cat-menu button:hover{background:var(--pn-primary-100);color:var(--pn-primary-700)}
.svc-cat-menu button.active{color:var(--pn-primary-700);font-weight:700}

.svc-scroll{overflow-y:auto;flex:1;min-height:0;padding-inline-end:4px;overflow-x:hidden}
.svc-scroll::-webkit-scrollbar{width:8px}
.svc-scroll::-webkit-scrollbar-thumb{background:#c9d8f2;border-radius:8px}
.svc-section{margin-bottom:32px}
.svc-title{font-size:14px;font-weight:700;color:var(--pn-text);display:flex;align-items:baseline;gap:8px}
.svc-title span{font-size:12px;color:var(--pn-gray);direction:ltr}
.svc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:16px}
.svc-card{display:block;min-width:0;text-decoration:none}
.svc-card img{width:100%;aspect-ratio:16/9;border-radius:8px;display:block;background:var(--pn-bg2);object-fit:cover;transition:transform .25s}
.svc-card:hover img{transform:scale(1.03)}
.svc-name{margin-top:auto;padding-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px;font-weight:600;color:var(--pn-text)}
.svc-card:hover .svc-name{color:var(--pn-bold)}

@media (min-width:640px){.svc-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:767px){
  .svc-rail{display:none}
  .pn-user-actions{gap:0}
  .pn-banner{max-height: 140px; min-height: 140px;}
  .pn-banner .bn-slide img{min-height: 140px;object-fit: cover;max-height: 140px;}
}
@media (max-width:560px){
  .svc-main{padding:14px}
  .svc-rail{width:60px}
  .rail-item{width:54px}
  .rail-item img,.rail-item svg{width:34px;height:34px}
  .svc-cat-btn{min-width:0}
  .svc-cat{width:100%}
  .svc-cat-btn{width:100%}
  .svc-cat-menu{min-width:100%;width:100%}
}

.pn-auth-step[hidden]{display:none}
.code-input{text-align:center;direction:ltr;letter-spacing:.4em;font-size:16px;font-weight:800}
.auth-phone-note{background:var(--pn-bg);border:1px dashed var(--pn-border2);border-radius:10px;padding:10px 12px;font-size:13.5px;color:var(--pn-text);margin-bottom:13px}
.dev-code{background:#eef6ff;border:1px solid #cfe3ff;color:var(--pn-primary-700);border-radius:10px;padding:9px 12px;font-size:12px;margin-bottom:13px;text-align:center}
.dev-code b{font-size:16px;letter-spacing:.25em;direction:ltr}
.auth-links{display:flex;justify-content:space-between;margin-top:12px}
.auth-link{background:none;color:var(--pn-primary);font-size:14.5px;font-weight:700;cursor:pointer;padding:6px 0}
.auth-link:hover{text-decoration:underline}
.auth-hint{text-align:center;font-size:13.5px;color:var(--pn-gray);margin-top:12px}
.auth-home{display:block;text-align:center;font-size:14.5px;color:var(--pn-primary);margin-top:18px;text-decoration:none;font-weight:700}
.auth-home:hover{color:var(--pn-primary)}

.pn-rate-row .ci-flag{background:none}
.pn-rate-row .ci-flag svg{width:26px;height:26px}
.pill.price{background:rgba(51,119,232,.12);color:var(--pn-primary-700);font-weight:800;font-size:12px}
.pill.up{background:rgba(14,201,143,.14);color:var(--pn-success);font-weight:800;font-size:11px}
.pill.down{background:rgba(244,63,103,.13);color:var(--pn-danger);font-weight:800;font-size:11px}
.pn-rate-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--pn-border);padding-top:12px;margin-top:6px;font-size:11px;color:var(--pn-gray)}
.pn-rate-foot a{color:var(--pn-primary);font-weight:700;font-size:11.5px}
.pn-rate-foot a:hover{text-decoration:underline}

.rt-head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.rt-title{font-size:16px;font-weight:800;color:var(--pn-bold)}
.rt-sub{font-size:12px;color:var(--pn-gray);margin-top:4px}
.rt-updated{font-size:11.5px;color:var(--pn-gray);background:var(--pn-card);border:1px solid var(--pn-border);border-radius:999px;padding:6px 14px}
.rt-grid{display:grid;gap:16px;grid-template-columns:280px minmax(0,1fr);align-items:start}
.rt-cards{display:flex;flex-direction:column;gap:10px}
.rt-card{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;text-align:right;background:var(--pn-card);border:1px solid var(--pn-border);border-radius:14px;padding:14px 16px;cursor:pointer;transition:.15s}
.rt-card:hover{border-color:var(--pn-primary)}
.rt-card.active{border-color:var(--pn-primary);box-shadow:0 10px 26px -16px rgba(51,119,232,.5)}
.rt-flag{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--pn-bg)}
.rt-flag svg{width:28px;height:28px;border-radius:6px}
.rt-meta{display:flex;flex-direction:column;min-width:0}
.rt-meta b{font-size:13.5px;font-weight:800;color:var(--pn-bold)}
.rt-meta small{font-size:10.5px;color:var(--pn-gray);direction:ltr;text-align:right}
.rt-price{font-size:13px;font-weight:800;color:var(--pn-text);direction:ltr}
.rt-change{font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:999px}
.rt-change.up{background:rgba(14,201,143,.14);color:var(--pn-success)}
.rt-change.down{background:rgba(244,63,103,.13);color:var(--pn-danger)}
.rt-chart-card{background:var(--pn-card);border:1px solid var(--pn-border);border-radius:14px;padding:18px 20px}
.rt-chart-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:8px}
.rt-chart-title{display:flex;align-items:center;gap:12px}
.rt-chart-title>span{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:var(--pn-bg)}
.rt-chart-title>span svg{width:30px;height:30px;border-radius:6px}
.rt-chart-title b{font-size:14.5px;font-weight:800;color:var(--pn-bold);display:block}
.rt-chart-title small{font-size:11px;color:var(--pn-gray);direction:ltr;display:block;text-align:right}
.rt-chart-price{display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.rt-chart-price b{font-size:18px;font-weight:800;color:var(--pn-primary-700);direction:ltr}
.rt-chg{font-size:12px;font-weight:800}
.rt-chg.up{color:var(--pn-success)}
.rt-chg.down{color:var(--pn-danger)}
.rt-chart{min-height:260px}
.rt-chart svg{display:block}
.rt-empty{display:grid;place-items:center;min-height:220px;color:var(--pn-gray);font-size:13px}
@media (max-width:900px){.rt-grid{grid-template-columns:1fr}.rt-cards{flex-direction:row;overflow-x:auto;padding-bottom:6px}.rt-card{min-width:220px}}

.pn-notif.read{opacity:.72}
.pn-notif.read .t b{color:var(--pn-text);font-weight:600}
.pn-dtab .badge[hidden]{display:none}
.pn-badge-count[hidden]{display:none}

.svc-card .svc-noimg{display:grid;place-items:center;width:100%;aspect-ratio:16/9;border-radius:8px;background:linear-gradient(135deg,var(--pn-primary-100),#dfe9fd);color:var(--pn-primary-700);font-size:28px;font-weight:800}

.of-form{width:100%;max-width:1040px;margin:0 auto}
.of-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:18px;align-items:start;margin-top:16px}
.of-main{min-width:0}
.of-card{background:var(--pn-card);border:1px solid var(--pn-border);border-radius:14px;padding:20px}
.of-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid var(--pn-border);padding-bottom:14px;margin-bottom:16px}
.of-card-head h4{font-size:15.5px;font-weight:800;color:var(--pn-bold)}
.of-head-ico{width:44px;height:44px;border-radius:50%;overflow:hidden;display:grid;place-items:center;flex:none;background:var(--pn-bg2)}
.of-head-ico img{width:100%;height:100%;object-fit:cover}
.of-head-ico span{font-size:17px;font-weight:800;color:var(--pn-primary-700)}
.of-short{font-size:12.5px;color:var(--pn-gray);margin-bottom:16px;line-height:2}

.of-field{margin-bottom:16px}
.of-field label{font-size:13px;font-weight:700;color:var(--pn-accent-800);margin-bottom:7px}
.of-field label .req{color:var(--pn-danger)}
.of-input{width:100%;height:44px;border:1px solid var(--pn-border2);border-radius:10px;background:#fff;padding:0 14px;font-size:13.5px;font-weight:600;color:var(--pn-bold);font-family:inherit;outline:none;transition:.15s}
textarea.of-input{height:auto;padding:12px 14px;resize:vertical;line-height:2}
.of-input:focus{border-color:var(--pn-primary);box-shadow:0 0 0 3px rgba(51,119,232,.14)}
.of-input::placeholder{color:var(--pn-gray);font-weight:500}
.of-input.latin{direction:ltr;text-align:left}
.of-input.of-invalid{border-color:var(--pn-danger);box-shadow:0 0 0 3px rgba(244,63,103,.12)}
.of-select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23B3B7C5' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center;padding-inline-end:38px;cursor:pointer}
.of-hint{font-size:11.5px;color:var(--pn-gray);margin-top:6px}
.of-hint b{color:var(--pn-primary-700);font-weight:800}

.of-toman{position:relative}
.of-toman input{padding-inline-end:74px}
.of-toman span{position:absolute;inset-inline-end:14px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:700;color:var(--pn-gray);pointer-events:none}

.of-cur{position:relative}
.of-cur-btn{width:100%;height:44px;display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--pn-primary-300);border-radius:10px;background:linear-gradient(180deg,#f7faff,#fff);padding:0 14px;font-size:13px;font-weight:800;color:var(--pn-primary-700);cursor:pointer;font-family:inherit;transition:.15s}
.of-cur-btn:hover{border-color:var(--pn-primary)}
.of-cur-btn svg{width:16px;height:16px;color:var(--pn-gray);transition:transform .2s;flex:none}
.of-cur.open .of-cur-btn svg{transform:rotate(180deg)}
.of-cur-menu{position:absolute;z-index:40;top:calc(100% + 6px);inset-inline-start:0;width:100%;background:#fff;border:1px solid var(--pn-border2);border-radius:12px;box-shadow:0 22px 50px -20px rgba(33,41,77,.4);padding:8px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.16s}
.of-cur.open .of-cur-menu{opacity:1;visibility:visible;transform:none}
.of-cur-search{display:flex;align-items:center;gap:8px;height:38px;border:1px solid var(--pn-border);border-radius:8px;padding:0 12px;margin-bottom:6px}
.of-cur-search svg{width:16px;height:16px;flex:none}
.of-cur-search input{border:none;outline:none;background:transparent;font-size:12.5px;font-weight:600;color:var(--pn-bold);font-family:inherit;width:100%}
.of-cur-list{max-height:230px;overflow-y:auto}
.of-cur-opt{display:block;width:100%;text-align:start;padding:9px 12px;border-radius:8px;font-size:12.5px;font-weight:700;color:var(--pn-text);background:transparent;cursor:pointer;font-family:inherit;transition:.12s}
.of-cur-opt:hover{background:var(--pn-primary-100)}
.of-cur-opt.active{background:var(--pn-primary-100);color:var(--pn-primary-700)}
.of-cur-opt em{font-style:normal;color:var(--pn-gray);font-weight:600;font-size:11px}
.of-cur-empty{padding:14px;text-align:center;font-size:12px;color:var(--pn-gray)}

.of-radios{display:flex;gap:10px;flex-wrap:wrap}
.of-radio{display:flex;align-items:center;gap:8px;border:1px solid var(--pn-border2);border-radius:10px;padding:9px 16px;font-size:13px;font-weight:600;color:var(--pn-text);cursor:pointer;transition:.15s}
.of-radio:hover{border-color:var(--pn-primary)}
.of-radio input{accent-color:var(--pn-primary);width:16px;height:16px}
.of-radio:has(input:checked){border-color:var(--pn-primary);background:var(--pn-primary-100);color:var(--pn-primary-700)}

.of-check{display:flex;align-items:flex-start;gap:10px;font-size:13px;font-weight:600;color:var(--pn-text);cursor:pointer;line-height:1.9}
.of-check input{accent-color:var(--pn-primary);width:17px;height:17px;margin-top:3px;flex:none}

.of-file{display:flex;align-items:center;gap:10px;border:1.5px dashed var(--pn-border2);border-radius:10px;padding:14px 16px;cursor:pointer;color:var(--pn-gray);font-size:12.5px;font-weight:600;transition:.15s}
.of-file:hover{border-color:var(--pn-primary);color:var(--pn-primary-700);background:var(--pn-primary-100)}
.of-file svg{width:20px;height:20px;flex:none}
.of-file input{display:none}
.of-file span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.of-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--pn-border)}
.of-submit{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(120deg,#2a7cff,#0161fb);color:#fff;font-size:14px;font-weight:800;font-family:inherit;border:none;border-radius:10px;padding:12px 30px;cursor:pointer;box-shadow:0 12px 26px -12px rgba(1,97,251,.7);transition:.18s}
.of-submit:hover{transform:translateY(-2px);box-shadow:0 18px 32px -12px rgba(1,97,251,.8)}
.of-submit:disabled{opacity:.65;cursor:wait;transform:none}
.of-submit svg{width:18px;height:18px}
.of-notes-btn{display:inline-flex;align-items:center;gap:7px;background:transparent;border:none;color:var(--pn-gray);font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;padding:10px 8px;transition:.15s}
.of-notes-btn:hover{color:var(--pn-primary)}
.of-notes-btn svg{width:17px;height:17px}

.of-side{position:sticky;top:14px}
.of-sum{background:var(--pn-card);border:1px solid var(--pn-border);border-radius:14px;padding:16px}
.of-sum-head{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--pn-border);margin-bottom:8px}
.of-sum-ico{width:46px;height:46px;border-radius:12px;flex:none;display:grid;place-items:center;background:var(--pn-primary-100);color:var(--pn-primary-700)}
.of-sum-ico svg{width:24px;height:24px}
.of-sum-head b{display:block;font-size:13px;font-weight:800;color:var(--pn-bold)}
.of-sum-cat{color:var(--pn-gray);font-size:11px;font-weight:600}
.of-sum-rows{display:flex;flex-direction:column}
.of-sum-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 2px;font-size:12.5px;color:var(--pn-text);border-bottom:1px dashed var(--pn-border)}
.of-sum-row[hidden]{display:none!important}
.of-sum-row b{font-weight:800;color:var(--pn-bold);font-size:12.5px}
.of-sum-row.total{border-bottom:none;padding-top:14px;margin-top:4px}
.of-sum-row.total b{font-size:15px;color:var(--pn-primary-700)}
.of-sum-note{font-size:10.5px;color:var(--pn-gray);line-height:2;margin-top:10px;text-align:justify}
.of-sum-row .of-disc-code{font-style:normal;color:var(--pn-primary-700);font-weight:800}
.of-disc{display:flex;align-items:center;gap:6px;margin-top:12px}
.of-disc-input{flex:1;min-width:0;background:var(--pn-bg);border:1px solid var(--pn-border);border-radius:9px;padding:9px 12px;font-size:12.5px;font-family:inherit;color:var(--pn-text);outline:none;transition:.16s}
.of-disc-input:focus{border-color:var(--pn-primary);box-shadow:0 0 0 3px var(--pn-primary-100)}
.of-disc-btn{background:var(--pn-primary-100);color:var(--pn-primary-700);border:none;border-radius:9px;padding:9px 14px;font-size:12.5px;font-weight:800;font-family:inherit;cursor:pointer;white-space:nowrap;transition:.16s}
.of-disc-btn:hover{background:var(--pn-primary);color:#fff}
.of-disc-remove{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:none;background:#fde9ed;color:#e5484d;border:none;border-radius:9px;padding:9px 14px;font-size:12.5px;font-weight:800;font-family:inherit;cursor:pointer;white-space:nowrap;transition:.16s}
.of-disc-remove:hover{background:#e5484d;color:#fff}
.of-disc-remove[hidden]{display:none!important}
.of-disc.applied .of-disc-input{display:none}
.of-disc.applied .of-disc-btn{display:none}
.of-disc.applied .of-disc-remove{width:100%}

.of-notes-modal .pn-modal-card{width:min(640px,100%)}
.of-notes-card{border-radius:18px}
.of-notes-text{max-height:46vh;overflow-y:auto;font-size:13.5px;line-height:2.3;color:var(--pn-text);padding:6px 8px 6px 2px;text-align:justify;overflow-wrap:anywhere;word-break:break-word}
.of-notes-accept{display:flex;align-items:center;justify-content:center;width:100%;background:linear-gradient(120deg,#2a7cff,#0161fb);color:#fff;border:none;border-radius:10px;padding:12px 20px;font-size:13.5px;font-weight:800;font-family:inherit;cursor:pointer;transition:.18s}
.of-notes-accept:hover{filter:brightness(1.06)}

.of-success-card{width:min(440px,100%);border-radius:18px}
.of-success-ico{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;margin:0 auto 16px;background:rgba(14,201,143,.14);color:var(--pn-success)}
.of-success-ico svg{width:38px;height:38px}
.of-success-card h3{font-size:16px;font-weight:800;color:var(--pn-bold);margin-bottom:8px}
.of-success-card p{font-size:13px;color:var(--pn-text);line-height:2}
.of-success-card p b{color:var(--pn-primary-700);font-size:14px}
.of-success-sub{color:var(--pn-gray)!important;font-size:12px!important}

@media (max-width:900px){
  .of-layout{grid-template-columns:1fr}
  .of-side{position:static}
}

.of-side .of-submit{width:100%;margin-top:16px;padding:13px}
.of-side .of-notes-btn{width:100%;justify-content:center;margin-top:4px}
.of-submit.loading{opacity:.7;pointer-events:none}

.of-pay-card{width:min(400px,100%);border-radius:20px}
.of-pay-ico{display:grid;place-items:center;width:78px;height:78px;border-radius:22px;margin:0 auto 18px;background:linear-gradient(135deg,rgba(42,124,255,.16),rgba(1,97,251,.1));color:var(--pn-primary-700);animation:ofpulse 1.6s ease-in-out infinite}
.of-pay-ico svg{width:38px;height:38px}
@keyframes ofpulse{0%,100%{box-shadow:0 0 0 0 rgba(1,97,251,.25)}50%{box-shadow:0 0 0 16px rgba(1,97,251,0)}}
.of-pay-card h3{font-size:16.5px;font-weight:800;color:var(--pn-bold);margin-bottom:8px}
.of-pay-spinner{display:flex;gap:7px;justify-content:center;margin:22px 0 8px}
.of-pay-spinner span{width:11px;height:11px;border-radius:50%;background:var(--pn-primary);animation:ofbounce 1.2s infinite ease-in-out}
.of-pay-spinner span:nth-child(2){animation-delay:.18s}
.of-pay-spinner span:nth-child(3){animation-delay:.36s}
@keyframes ofbounce{0%,80%,100%{transform:scale(.5);opacity:.4}40%{transform:scale(1);opacity:1}}
.of-pay-count{font-size:12px;color:var(--pn-gray);font-weight:700}

.pn-mini-list{display:flex;flex-direction:column;gap:2px}
.pn-mini-row{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:11px;background:var(--pn-bg);text-decoration:none;transition:background .15s,transform .15s;border:1px solid transparent}
.pn-mini-row:hover{background:var(--pn-primary-100,#E3EEFE);border-color:var(--pn-primary-300,#A9C9FB);transform:translateY(-1px)}
.pn-mini-row .pn-mini-name{flex:1;min-width:0;font-size:12.5px;font-weight:700;color:var(--pn-bold);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pn-mini-row .pn-mini-code{font-size:11px;color:var(--pn-gray);font-weight:600;white-space:nowrap}
.pn-mini-row .pn-mini-amount{font-size:12px;font-weight:800;color:var(--pn-primary-700);white-space:nowrap;min-width:90px;text-align:right}
.pn-mini-row .pn-badge{flex:none}
.bn-fallback{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:160px;background:linear-gradient(135deg,var(--pn-primary-100,#E3EEFE),var(--pn-bg2));border-radius:inherit;text-decoration:none;color:var(--pn-primary-700);font-weight:800;font-size:14px}

.kyc-state{display:flex;align-items:flex-start;gap:16px;padding:8px 4px}
.kyc-state-ico{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;flex:none;color:#fff}
.kyc-state-ico svg{width:26px;height:26px}
.kyc-state.success .kyc-state-ico{background:linear-gradient(135deg,#1fd7a4,#0aa87a)}
.kyc-state.pending .kyc-state-ico{background:linear-gradient(135deg,#ffb64d,#f09010)}
.kyc-state.rejected .kyc-state-ico{background:linear-gradient(135deg,#ff7a8c,#ef4444)}
.kyc-state b{display:block;font-size:15px;font-weight:800;color:var(--pn-bold);margin-bottom:6px}
.kyc-state p{font-size:13px;color:var(--pn-text);line-height:2;margin:0}
.kyc-state-meta{display:inline-block;margin-top:8px;font-size:11.5px;color:var(--pn-gray)}
.kyc-head-hint{font-size:12px;color:var(--pn-gray)}
.kyc-upload{border:1.5px dashed var(--pn-border);border-radius:12px;overflow:hidden;cursor:pointer;transition:.16s;background:var(--pn-bg)}
.kyc-upload:hover{border-color:var(--pn-primary);background:var(--pn-primary-100)}
.kyc-upload-ph{min-height:120px;display:grid;place-items:center;justify-items:center;gap:8px;color:var(--pn-gray);font-size:12px;font-weight:700;text-align:center;padding:14px}
.kyc-upload-ph svg{width:28px;height:28px}
.kyc-upload-ph.has{display:block;padding:0;position:relative}
.kyc-upload-ph.has img{width:100%;height:120px;object-fit:cover;display:block}
.kyc-upload-name{display:block;padding:8px 12px;font-size:11px;color:var(--pn-gray);background:var(--pn-card);border-top:1px solid var(--pn-border);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kyc-note{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--pn-gray);background:var(--pn-bg);border-radius:10px;padding:10px 14px;margin:4px 0 16px}
.kyc-note svg{width:16px;height:16px;color:var(--pn-primary);flex:none}

.pn-drawer-kyc-hint{font-size:12px;color:var(--pn-gray);line-height:2;margin:4px 18px 16px}
.pn-verify .pn-badge{font-size:11px}

.ps-link.kyc .l svg{color:#0aa87a}
.ps-link.kyc .tx{color:#0aa87a}
.ps-link.kyc.active .l svg{color:#0aa87a}
.ps-link.kyc.active .tx{color:#0aa87a}
.kyc-pend{font-style:normal;font-size:10px;font-weight:700;background:#fdf1da;color:#e8960c;border-radius:50px;padding:1px 8px;margin-inline-start:4px}

.pn-kyc-alert{display:flex;align-items:flex-start;gap:14px;background:#fff8ef;border:1px solid #f3d7a8;border-radius:14px;padding:16px 18px}
.pn-kyc-alert-ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#ffb64d,#f09010);color:#fff}
.pn-kyc-alert-ico svg{width:22px;height:22px}
.pn-kyc-alert-body{flex:1;min-width:0}
.pn-kyc-alert-body b{display:block;font-size:14px;font-weight:800;color:#7a4308;margin-bottom:4px}
.pn-kyc-alert-body p{font-size:12.5px;color:#8a6116;line-height:2;margin:0}
.pn-kyc-alert-meta{display:inline-block;margin-top:8px;font-size:11.5px;font-weight:700;color:#c47a08;background:#fff;border-radius:999px;padding:2px 10px}
.pn-kyc-alert .btn{flex:none;align-self:center}
@media (max-width:640px){
  .pn-kyc-alert{flex-wrap:wrap}
  .pn-kyc-alert .btn{width:100%}
}
@media (max-width:720px){
  .pn-modal{padding:0;align-items:flex-end;justify-content:stretch}
  .pn-modal-card,
  .of-notes-modal .pn-modal-card,
  .of-notes-card,
  .of-success-card,
  .of-pay-card{
    width:100%!important;max-width:100%;
    max-height:min(92dvh,92vh);
    border-radius:16px;margin:0;align-self:center;height: min-content;
  }
  .pn-modal.open{
    padding:1rem;
  }
  .pn-modal-head{padding:14px 16px}
  .pn-modal-body{padding:15px 20px}
  .pn-modal-foot{padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px)) !important}
  .of-notes-text{max-height:none;overflow:visible;padding:0}
  .pn-modal-card .pn-form-row{grid-template-columns:1fr}
  .mobile-d-none{display:none !important}
  .svc-name{font-size: 12px;}
  .pn-logout{justify-content: center;}

}

@media (min-width:721px){

  .desktop-d-none{display:none !important}
}

/* =========================================================
   بازطراحی‌های پنل کاربری (تبریک، تب افقی، قیمت‌ها، دکمه چت)
   ========================================================= */

/* ---- پروفایل سایدبار: حذف دایره پیشرفت، آواتار ساده + تاج ---- */
.ps-avatar-wrap{position:relative;width:64px;height:64px;margin-bottom:6px;flex:none}
.ps-avatar-wrap .ps-avatar{
  position:static;inset:auto;width:64px;height:64px;border-radius:50%;
  display:grid;place-items:center;font-size:24px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#8b5cf6,#6d28d9);
}
.ps-crown{
  position:absolute;top:-4px;inset-inline-start:-4px;width:26px;height:26px;border-radius:50%;
  background:linear-gradient(135deg,#fbbf24,#f59e0b);display:grid;place-items:center;
  box-shadow:0 3px 10px -2px rgba(245,158,11,.55);border:2px solid #fff;
}
.ps-crown svg{width:14px;height:14px;color:#fff}

/* ---- دکمه پشتیبانی: دسکتاپ → ps-foot، موبایل → topbar ---- */
.soc-support{
  width:22px;height:22px;border:0;background:none;cursor:pointer;padding:0;
  display:none;color:var(--pn-icon);transition:color .15s;
}
.soc-support svg{width:22px;height:22px}
.soc-support:hover{color:var(--pn-primary)}
@media (min-width:1024px){
  .pn-support-top{display:none !important}
  .soc-support{display:grid;place-items:center}
}

/* ---- تب‌های افقی خدمات (دسکتاپ): جایگزین ریل عمودی ---- */
@media (min-width:768px){
  .pn-services{flex-direction:column}
  .svc-rail{
    width:100%;flex-direction:row;align-items:center;justify-content:flex-start;
    padding:12px 16px;gap:10px;overflow-x:auto;overflow-y:hidden;
    border-bottom:1px solid var(--pn-border);
    -webkit-overflow-scrolling:touch;
  }
  .rail-item{
    flex-direction:row;gap:9px;width:auto;flex:0 0 auto;
    padding:9px 18px;border:1px solid var(--pn-border);background:var(--pn-card);
    border-radius:999px;font-size:12.5px;font-weight:700;
    box-shadow:0 1px 2px rgba(15,23,42,.04);
  }
  .rail-item img,.rail-item svg{width:26px;height:26px;border-radius:8px}
  .rail-item:hover{background:var(--pn-accent);border-color:var(--pn-accent);transform:translateY(-1px)}
  .rail-item.active{background:var(--pn-primary);border-color:var(--pn-primary);color:#fff;box-shadow:0 4px 14px -6px var(--pn-primary)}
  .rail-item.active svg{stroke:#fff}
}

/* ---- اسلایدر محبوب‌ترین‌ها: جایگزین بدون تصویر ---- */
.svc-art-fall{
  position:absolute;inset:0;display:grid;place-items:center;
  font-size:34px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#3b82f6,#0161fb 60%,#0a3f9e);
}

/* ---- قیمت ثابت در فرم سفارش ---- */
.of-fixed-price{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--pn-bg);border:1px solid var(--pn-border);border-radius:10px;padding:12px 14px;
}
.of-fixed-price b{font-size:17px;font-weight:800;color:var(--pn-bold)}
.of-fixed-price span{font-size:12px;color:var(--pn-gray)}

/* ---- انتخاب پلن در فرم سفارش ---- */
.of-plans{display:flex;flex-direction:column;gap:8px}
.of-plan{
  display:flex;align-items:center;gap:12px;padding:12px 14px;cursor:pointer;
  background:var(--pn-bg);border:1.5px solid var(--pn-border);border-radius:10px;transition:.15s;
}
.of-plan:hover{border-color:var(--pn-primary)}
.of-plan input{width:18px;height:18px;flex:none;accent-color:var(--pn-primary)}
.of-plan:has(input:checked){border-color:var(--pn-primary);background:var(--pn-primary-100)}
.of-plan.of-invalid{border-color:var(--pn-danger);box-shadow:0 0 0 3px rgba(244,63,103,.12)}
.of-plan-name{flex:1;font-size:13.5px;font-weight:700;color:var(--pn-bold)}
.of-plan-price{font-size:13px;font-weight:800;color:var(--pn-primary-700);white-space:nowrap}
.of-plan-price small{font-weight:600;color:var(--pn-gray);font-size:11px}

.mp-lead{font-size:12.5px;line-height:2;color:var(--pn-text);background:var(--pn-primary-100);border:1px solid rgba(42,124,255,.18);border-radius:12px;padding:10px 12px;margin-bottom:14px}
.mp-amount{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--pn-card);border:1px solid var(--pn-border);border-radius:12px;padding:12px 14px;margin-bottom:12px}
.mp-amount span{font-size:12px;font-weight:600;color:var(--pn-muted)}
.mp-amount b{font-size:16px;font-weight:800;color:var(--pn-primary-700)}
.mp-rows{display:flex;flex-direction:column;gap:8px}
.mp-row{display:flex;align-items:center;gap:10px;background:var(--pn-soft,#f6f8fc);border:1px solid var(--pn-border);border-radius:12px;padding:10px 12px}
.mp-row[hidden]{display:none!important}
.mp-row span{font-size:11.5px;font-weight:600;color:var(--pn-muted);flex:none;width:74px}
.mp-row b{flex:1;font-size:13px;font-weight:700;color:var(--pn-bold);letter-spacing:.5px;word-break:break-all}
.mp-note{font-size:11px;line-height:1.9;color:var(--pn-gray);margin-top:12px;text-align:justify}
