.p2p-page { --p2p-ink:#23324d; --p2p-muted:#63718a; --p2p-accent:#405ddd; --p2p-hover:#304bc5; --p2p-surface:#fff; --p2p-soft:#f6f8fe; --p2p-border:#dfe5f1; --p2p-tint:#edf1ff; color:var(--p2p-ink); background:#f8f9fd; }
.p2p-page [hidden] { display:none!important; }
.p2p-page :is(button,a,select,input,summary):focus-visible { outline:3px solid #829bff; outline-offset:4px; }
.p2p-skip { position:fixed; top:-100px; inset-inline-start:16px; z-index:200; padding:12px 18px; border-radius:8px; background:var(--p2p-surface); }
.p2p-skip:focus { top:12px; }
.p2p-main { max-width:1080px; margin:auto; padding:26px 24px 64px; }
.p2p-main :is(button,input,select) { font:inherit; }
.p2p-main a { color:var(--p2p-accent); }
.p2p-breadcrumb { display:flex; gap:12px; align-items:center; color:var(--p2p-muted); font-size:.82rem; margin-bottom:30px; }
.p2p-breadcrumb a { color:inherit; text-decoration:none; }
.p2p-breadcrumb a:hover { text-decoration:underline; }
.p2p-intro { max-width:700px; margin:0 auto 32px; text-align:center; }
.p2p-eyebrow { font-size:.7rem; letter-spacing:.13em; font-weight:750; color:var(--p2p-accent); }
.p2p-intro h1 { font-size:clamp(2rem,4.8vw,3.1rem); line-height:1.15; letter-spacing:-.025em; margin:12px 0 16px; color:var(--p2p-ink); }
.p2p-intro p { max-width:640px; margin:0 auto; color:var(--p2p-muted); font-size:1.03rem; line-height:1.75; }
.p2p-guide-link { display:inline-block; font-size:.8rem; text-underline-offset:4px; margin-top:14px; }
.p2p-tool { max-width:880px; margin:auto; padding:30px; background:var(--p2p-surface); border:1px solid var(--p2p-border); border-radius:18px; box-shadow:0 10px 36px #233c7210; }
.p2p-tool-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:24px; }
.p2p-tool-heading h2 { font-size:1.23rem; line-height:1.4; margin:0 0 5px; color:var(--p2p-ink); }
.p2p-tool-heading p { margin:0; color:var(--p2p-muted); font-size:.82rem; }
.p2p-private { display:inline-flex; align-items:center; gap:7px; flex-shrink:0; font-size:.7rem; color:#32745b; border:1px solid #cee7db; border-radius:20px; padding:7px 11px; background:#f3faf6; }
.p2p-dropzone { text-align:center; border:1.5px dashed #b9c6ee; padding:28px 20px 20px; border-radius:12px; background:var(--p2p-soft); transition:background .15s,border-color .15s; }
.p2p-dropzone.is-dragging,.p2p-dropzone[data-dragging="true"] { background:var(--p2p-tint); border-color:var(--p2p-accent); outline:3px solid #405ddd18; }
.p2p-upload-icon { color:#7188d9; display:block; margin:0 auto 12px; }
.p2p-dropzone h3 { font-size:1.1rem; margin:0 0 6px; color:var(--p2p-ink); }
.p2p-dropzone p { font-size:.83rem; color:var(--p2p-muted); margin:0 0 18px; }
.p2p-button { display:inline-flex; gap:10px; align-items:center; justify-content:center; min-height:46px; padding:11px 22px; border:1px solid transparent; border-radius:8px; font-size:.88rem!important; font-weight:650!important; line-height:1.45; cursor:pointer; text-decoration:none; }
.p2p-page .p2p-primary { color:#fff; background:var(--p2p-accent); }
.p2p-primary:hover:not(:disabled) { background:var(--p2p-hover); }
.p2p-secondary { color:var(--p2p-ink); background:var(--p2p-surface); border-color:var(--p2p-border); }
.p2p-secondary:hover:not(:disabled) { background:var(--p2p-soft); }
.p2p-page :is(button,select,input):disabled { opacity:.55; cursor:not-allowed; }
.p2p-dropzone .p2p-limit { margin:16px 0 0; font-size:.73rem; }
.p2p-list-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; padding:22px 0 12px; }
.p2p-list-heading > p { font-size:.84rem; font-weight:650; margin:0; }
.p2p-list-buttons { display:flex; gap:16px; }
.p2p-text-button { background:none; border:0; color:var(--p2p-accent); text-decoration:underline; text-underline-offset:3px; min-height:32px; font-size:.78rem!important; padding:3px 0; cursor:pointer; }
.p2p-empty { margin:0; font-size:.8rem; color:var(--p2p-muted); padding:16px; text-align:center; border:1px solid var(--p2p-border); border-radius:8px; }
.p2p-list { list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.p2p-item { display:flex; align-items:center; gap:16px; border:1px solid var(--p2p-border); background:var(--p2p-soft); border-radius:10px; padding:12px; min-width:0; }
.p2p-thumb { flex:0 0 76px; width:76px; height:86px; object-fit:contain; background:#fff; border:1px solid var(--p2p-border); border-radius:5px; overflow:hidden; display:grid; place-items:center; }
.p2p-thumb img { display:block; width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; }
.p2p-item-info { flex:1; min-width:0; font-size:.78rem; color:var(--p2p-muted); }
.p2p-item-info :is(strong,b) { display:block; color:var(--p2p-ink); overflow-wrap:anywhere; font-size:.85rem; margin-bottom:5px; line-height:1.5; }
.p2p-item-info p { margin:4px 0; font-size:.75rem; line-height:1.5; }
.p2p-item-actions { display:flex; gap:5px; flex-wrap:wrap; }
.p2p-icon-button { display:inline-flex; align-items:center; justify-content:center; gap:4px; min-width:36px; min-height:38px; border:1px solid var(--p2p-border); border-radius:7px; background:var(--p2p-surface); color:var(--p2p-ink); cursor:pointer; padding:5px 9px; font-size:.82rem!important; }
.p2p-icon-button:hover:not(:disabled) { border-color:var(--p2p-accent); background:var(--p2p-tint); }
.p2p-list-hint { font-size:.73rem; color:var(--p2p-muted); line-height:1.7; margin:12px 0 24px; }
.p2p-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; border-top:1px solid var(--p2p-border); padding-top:23px; }
.p2p-field { min-width:0; }
.p2p-field label { display:block; margin-bottom:8px; font-size:.8rem; font-weight:650; }
.p2p-field :is(select,input) { width:100%; min-height:44px; padding:9px 11px; font-size:.82rem; border:1px solid var(--p2p-border); border-radius:7px; color:var(--p2p-ink); background:var(--p2p-surface); }
.p2p-filename { grid-column:1/-1; max-width:400px; width:100%; }
.p2p-name-input { display:flex; direction:ltr; align-items:center; border:1px solid var(--p2p-border); border-radius:7px; overflow:hidden; }
.p2p-name-input input { border:0; border-radius:0; min-width:0; }
.p2p-name-input input:focus-visible { outline-offset:-3px; }
.p2p-name-input > span { font-size:.8rem; color:var(--p2p-muted); padding:10px 12px; background:var(--p2p-soft); align-self:stretch; display:flex; align-items:center; }
.p2p-field p { font-size:.72rem; color:var(--p2p-muted); margin:6px 0 0; }
.p2p-create-row { display:flex; gap:12px; margin-top:23px; }
#p2pCreate { flex:1; }
#p2pProgress { display:block; width:100%; height:8px; margin-top:18px; border:0; border-radius:8px; overflow:hidden; accent-color:var(--p2p-accent); background:var(--p2p-tint); }
#p2pProgress::-webkit-progress-bar { background:var(--p2p-tint); }
#p2pProgress::-webkit-progress-value { background:var(--p2p-accent); }
.p2p-status { color:var(--p2p-muted); font-size:.78rem; line-height:1.65; margin-top:12px; }
.p2p-error { border:1px solid #f0c8ce; border-radius:8px; color:#9d253a; background:#fff3f4; padding:13px 15px; font-size:.82rem; line-height:1.7; margin-top:15px; overflow-wrap:anywhere; white-space:pre-line; }
.p2p-result { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:18px; border:1px solid #cee7db; background:#f3faf6; border-radius:10px; padding:20px; margin-top:20px; }
.p2p-result h3 { margin:0 0 5px; font-size:1rem; color:var(--p2p-ink); }
.p2p-result p { font-size:.78rem; margin:0; color:var(--p2p-muted); }
.p2p-footnote { font-size:.7rem; color:var(--p2p-muted); text-align:center; line-height:1.8; margin:16px auto 0; max-width:600px; }
.p2p-benefits { display:flex; justify-content:center; gap:12px 24px; flex-wrap:wrap; margin:22px 0 0; font-size:.74rem; color:var(--p2p-muted); }
.p2p-benefits span { display:inline-flex; gap:8px; align-items:center; }
.p2p-quick { margin:55px auto; max-width:880px; }
.p2p-quick > h2,.p2p-faq > h2,.p2p-related > h2 { text-align:center; font-size:1.6rem; line-height:1.4; color:var(--p2p-ink); margin:0 0 28px; }
.p2p-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.p2p-steps article > span { display:inline-grid; place-items:center; width:36px; height:36px; border:1px solid var(--p2p-border); border-radius:10px; color:var(--p2p-accent); background:var(--p2p-surface); font-size:.8rem; font-weight:700; margin-bottom:15px; }
.p2p-steps h3 { font-size:.95rem; color:var(--p2p-ink); margin:0 0 8px; }
.p2p-steps p { font-size:.82rem; color:var(--p2p-muted); margin:0; line-height:1.8; }
.p2p-guide { max-width:880px; margin:0 auto; background:var(--p2p-surface); border:1px solid var(--p2p-border); border-radius:16px; padding:40px 44px; scroll-margin-top:100px; }
.p2p-guide-heading h2 { font-size:1.8rem; line-height:1.3; color:var(--p2p-ink); margin:12px 0 14px; }
.p2p-guide-heading > p { color:var(--p2p-muted); font-size:1rem; margin:0 0 24px; }
.p2p-contents { display:flex; gap:8px; flex-wrap:wrap; padding:0 0 22px; margin-bottom:8px; border-bottom:1px solid var(--p2p-border); }
.p2p-contents a { display:block; padding:6px 10px; border-radius:6px; background:var(--p2p-soft); font-size:.74rem; text-decoration:none; }
.p2p-contents a:hover { text-decoration:underline; }
.p2p-guide > h3 { font-size:1.14rem; line-height:1.5; margin:28px 0 10px; color:var(--p2p-ink); scroll-margin-top:100px; }
.p2p-guide > p { color:var(--p2p-muted); font-size:.95rem; line-height:1.9; margin:0; }
.p2p-faq { max-width:880px; margin:52px auto 0; }
.p2p-faq details { border-bottom:1px solid var(--p2p-border); padding:17px 4px; }
.p2p-faq summary { font-size:.93rem; font-weight:650; cursor:pointer; color:var(--p2p-ink); line-height:1.6; }
.p2p-faq details p { color:var(--p2p-muted); font-size:.87rem; line-height:1.9; margin:12px 0 0; }
.p2p-related { max-width:880px; margin:48px auto 0; }
.p2p-related > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
.p2p-related a { display:block; border:1px solid var(--p2p-border); border-radius:10px; background:var(--p2p-surface); padding:22px; text-decoration:none; }
.p2p-related a:hover { border-color:var(--p2p-accent); }
.p2p-related strong { display:block; font-size:.88rem; margin-bottom:8px; }
.p2p-related a > span { display:block; color:var(--p2p-muted); font-size:.79rem; line-height:1.8; }
.p2p-sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
[data-theme="dark"] .p2p-page { --p2p-ink:#e5eaf7; --p2p-muted:#a9b5ce; --p2p-accent:#a2b4ff; --p2p-hover:#b4c2ff; --p2p-surface:#182339; --p2p-soft:#141f32; --p2p-border:#34425e; --p2p-tint:#233352; background:#10192b; }
[data-theme="dark"] .p2p-page .p2p-primary { color:#142143; }
[data-theme="dark"] .p2p-error { background:#3c2330; border-color:#754053; color:#ffc1cb; }
[data-theme="dark"] :is(.p2p-private,.p2p-result) { color:#b4ddcb; background:#172d2c; border-color:#36584e; }
html[dir="rtl"] .p2p-eyebrow { letter-spacing:normal; }
html[dir="rtl"] .p2p-intro h1 { letter-spacing:normal; }
@media(max-width:700px) {
  .p2p-main { padding:22px 16px 45px; }
  .p2p-intro { margin-bottom:26px; }
  .p2p-intro p { font-size:.92rem; }
  .p2p-tool { padding:20px; border-radius:14px; }
  .p2p-tool-heading { align-items:flex-start; flex-direction:column; gap:12px; margin-bottom:20px; }
  .p2p-tool-heading h2 { font-size:1.1rem; }
  .p2p-private { font-size:.65rem; padding:5px 9px; }
  .p2p-dropzone { padding:24px 12px 20px; }
  .p2p-options { grid-template-columns:1fr; gap:18px; }
  .p2p-item { gap:12px; flex-wrap:wrap; }
  .p2p-thumb { flex-basis:62px; width:62px; height:72px; }
  .p2p-item-info { min-width:calc(100% - 88px); }
  .p2p-item-actions { margin-inline-start:auto; }
  .p2p-result { padding:16px; }
  .p2p-result .p2p-button { width:100%; }
  .p2p-quick { margin:40px auto; }
  .p2p-quick > h2,.p2p-faq > h2,.p2p-related > h2 { font-size:1.35rem; }
  .p2p-steps { grid-template-columns:1fr; gap:24px; }
  .p2p-steps article { position:relative; padding-inline-start:50px; }
  .p2p-steps article > span { position:absolute; inset-inline-start:0; top:0; }
  .p2p-guide { padding:25px 22px; }
  .p2p-guide-heading h2 { font-size:1.4rem; }
  .p2p-guide > p { font-size:.88rem; line-height:1.9; }
  .p2p-guide > h3 { font-size:1.04rem; }
  .p2p-related > div { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) { .p2p-page *, .p2p-page *::before, .p2p-page *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }