.pe{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#0f172a;padding:var(--cb-nav-h,76px) 16px 56px;background:#fff;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
.pe *,.pe *::before,.pe *::after{box-sizing:border-box}
.pe svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.pe [hidden]{display:none!important}
.pe-wrap{max-width:1180px;margin:0 auto}
.pe button,.pe input,.pe select,.pe textarea{font-family:inherit}

/* hero */
.pe-hero{text-align:center;padding:38px 0 8px}
.pe-hero h1{font-size:clamp(27px,4.2vw,43px);font-weight:800;line-height:1.15;letter-spacing:-.025em;margin:0 auto 14px;max-width:900px;color:#0f172a}
.pe-hero p{max-width:740px;margin:0 auto;color:#64748b;font-size:17px;line-height:1.65}
.pe-badges{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:20px}
.pe-badge{display:inline-flex;align-items:center;gap:7px;background:#f1f6ff;color:#0b4fc4;border:1px solid #d6e5ff;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600}
.pe-badge svg{width:16px;height:16px}

/* filter bar */
.pe-bar{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:26px 0 20px}
.pe-chips{display:flex;gap:8px;flex-wrap:wrap}
.pe-chip{border:1px solid #e2e8f0;background:#fff;border-radius:999px;padding:9px 17px;font-weight:600;font-size:14px;cursor:pointer;color:#334155;transition:.15s}
.pe-chip:hover{border-color:#94a3b8}
.pe-chip.on{background:#0f172a;color:#fff;border-color:#0f172a}
.pe-search{display:flex;align-items:center;gap:8px;border:1px solid #e2e8f0;border-radius:999px;padding:0 16px;background:#fff;min-width:230px}
.pe-search:focus-within{border-color:#0066ff;box-shadow:0 0 0 3px rgba(0,102,255,.12)}
.pe-search svg{width:17px;height:17px;color:#64748b;flex:none}
.pe-search input{border:0;outline:0;background:transparent;padding:10px 0;font-size:14px;width:100%;color:#0f172a}

/* grid */
.pe-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pe-card{display:block;background:#fff;border:1px solid #e5eaf0;border-radius:16px;padding:22px 22px 20px;text-decoration:none;color:inherit;min-height:176px;transition:box-shadow .18s,transform .18s,border-color .18s}
.pe-card:hover{border-color:#b9cdf5;box-shadow:0 10px 28px -14px rgba(15,23,42,.3);transform:translateY(-2px)}
.pe-card:focus-visible{outline:2px solid #0066ff;outline-offset:2px}
.pe-card h3{font-size:18px;font-weight:700;margin:14px 0 6px;color:#0f172a;letter-spacing:-.01em}
.pe-card p{margin:0;font-size:13.5px;line-height:1.55;color:#64748b}
.pe-ico{display:inline-flex;width:46px;height:46px;flex:none}
.pe-ico svg{width:100%;height:100%;stroke:none}
.pe-txt{font-size:15px;font-weight:800;letter-spacing:-.02em;font-style:normal}.pe-txt.sm{font-size:11.5px}
.pe-empty{text-align:center;color:#64748b;padding:30px 0}

/* workspace */
.pe-crumb{margin:22px 0 6px}
.pe-crumb a{display:inline-flex;align-items:center;gap:4px;color:#0066ff;font-weight:600;font-size:14px;text-decoration:none}
.pe-crumb svg{width:16px;height:16px}
.pe-whead{display:flex;gap:16px;align-items:center;margin:10px 0 22px}
.pe-whead h2{font-size:clamp(22px,3vw,30px);font-weight:800;margin:0;letter-spacing:-.02em}
.pe-whead p{margin:4px 0 0;color:#64748b;font-size:15px}
.pe-whead .pe-ico{width:56px;height:56px}

.pe-drop{border:2px dashed #b8c7e0;background:#f8fbff;border-radius:18px;padding:54px 20px;text-align:center;transition:.15s}
.pe-drop.over{border-color:#0066ff;background:#eef5ff}
.pe-drop svg{width:44px;height:44px;color:#0066ff;margin-bottom:6px}
.pe-drop h3{margin:6px 0 4px;font-size:19px;font-weight:700}
.pe-drop p{margin:0 0 18px;color:#64748b;font-size:14px}
.pe-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;background:#0066ff;color:#fff;font-weight:700;font-size:15px;padding:13px 26px;cursor:pointer;transition:.15s;text-decoration:none}
.pe-btn:hover{filter:brightness(.93)}
.pe-btn:disabled{opacity:.5;cursor:not-allowed}
.pe-btn.sec{background:#fff;color:#0f172a;border:1px solid #cbd5e1}
.pe-btn.sec:hover{background:#f1f5f9;filter:none}
.pe-btn.sm{padding:8px 14px;font-size:13px;border-radius:8px}
.pe-btn.red{background:#dc2626}
.pe-btn svg{width:18px;height:18px}
.pe-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pe-row.end{justify-content:flex-end}
.pe-note{font-size:13px;color:#64748b;margin:10px 0 0}
.pe-warn{background:#fff8e6;border:1px solid #fde4a1;color:#7a5200;border-radius:10px;padding:10px 14px;font-size:13.5px;margin:12px 0}
.pe-err{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;border-radius:10px;padding:12px 14px;font-size:14px;margin:12px 0}

.pe-panel{border:1px solid #e5eaf0;border-radius:16px;padding:20px;background:#fff;margin-top:18px}
.pe-panel h4{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#0f172a;display:flex;align-items:center;gap:8px}
.pe-panel h4::before{content:'';width:3px;height:13px;background:#0066ff;border-radius:1px}
.pe-files{display:flex;flex-direction:column;gap:8px}
.pe-file{display:flex;align-items:center;gap:12px;border:1px solid #e5eaf0;border-radius:12px;padding:10px 12px;background:#fff}
.pe-file.drag{opacity:.4}
.pe-file canvas,.pe-file img{width:40px;height:52px;object-fit:cover;border:1px solid #e2e8f0;border-radius:4px;background:#f1f5f9;flex:none}
.pe-file .nm{flex:1;min-width:0}
.pe-file .nm b{display:block;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe-file .nm span{font-size:12px;color:#64748b}
.pe-ib{border:1px solid #e2e8f0;background:#fff;border-radius:8px;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:#475569;flex:none}
.pe-ib:hover{background:#f1f5f9}
.pe-ib:disabled{opacity:.35;cursor:default}
.pe-ib svg{width:16px;height:16px}

.pe-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px 18px}
.pe-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.pe-f>label,.pe-f>.lb{font-size:13px;font-weight:600;color:#334155}
.pe-f input[type=text],.pe-f input[type=number],.pe-f input[type=password],.pe-f select,.pe-f textarea{border:1px solid #cbd5e1;border-radius:9px;padding:10px 12px;font-size:14px;background:#fff;color:#0f172a;width:100%;min-width:0}
.pe-f textarea{min-height:140px;resize:vertical;font-family:ui-monospace,Menlo,monospace;font-size:13px}
.pe-f input:focus,.pe-f select:focus,.pe-f textarea:focus{outline:0;border-color:#0066ff;box-shadow:0 0 0 3px rgba(0,102,255,.12)}
.pe-f input[type=color]{width:100%;height:42px;border:1px solid #cbd5e1;border-radius:9px;padding:3px;background:#fff}
.pe-f input[type=range]{width:100%}
.pe-f .hint{font-size:12px;color:#64748b}
.pe-ck{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:500;cursor:pointer;padding-top:22px}
.pe-ck input{width:18px;height:18px;accent-color:#0066ff}
.pe-act{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.pe-prog{height:8px;background:#e5eaf0;border-radius:99px;overflow:hidden;margin-top:16px}
.pe-prog i{display:block;height:100%;width:0;background:#0066ff;transition:width .2s}
.pe-pt{font-size:13px;color:#475569;margin-top:8px}

.pe-res{border:1px solid #bbf7d0;background:#f0fdf4;border-radius:16px;padding:22px;margin-top:18px}
.pe-res h3{margin:0 0 4px;font-size:20px;color:#14532d}
.pe-res .sub{color:#166534;font-size:14px;margin-bottom:14px}
.pe-out{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #dcfce7;border-radius:12px;padding:10px 12px;margin-top:8px}
.pe-out .nm{flex:1;min-width:0;font-size:14px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pe-out .nm span{display:block;font-weight:400;color:#64748b;font-size:12px}
.pe-prev{margin-top:14px;max-width:100%;overflow:auto}
.pe-prev canvas{max-width:240px;border:1px solid #e2e8f0;border-radius:6px;box-shadow:0 4px 14px -6px rgba(0,0,0,.25);background:#fff}

/* thumbnails */
.pe-thgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:14px}
.pe-th{position:relative;border:2px solid transparent;border-radius:10px;padding:8px;background:#f8fafc;text-align:center;cursor:pointer;user-select:none;transition:.12s}
.pe-th:hover{background:#eef4ff}
.pe-th.sel{border-color:#0066ff;background:#eaf2ff}
.pe-th.del{border-color:#dc2626;background:#fef2f2}
.pe-th.del canvas{opacity:.35}
.pe-th .cv{display:flex;justify-content:center;align-items:center;min-height:120px}
.pe-th canvas{max-width:100%;height:auto;background:#fff;box-shadow:0 2px 8px -3px rgba(0,0,0,.3);transition:transform .2s}
.pe-th .num{display:block;font-size:12px;color:#475569;margin-top:6px;font-weight:600}
.pe-th .tb{display:flex;justify-content:center;gap:4px;margin-top:6px}
.pe-th .tb .pe-ib{width:28px;height:28px;border-radius:6px}
.pe-th.dg{opacity:.35}
.pe-th.dov{border-color:#0066ff;border-style:dashed}
.pe-th .tick{position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:50%;background:#0066ff;color:#fff;display:none;align-items:center;justify-content:center}
.pe-th.sel .tick{display:flex}.pe-th.del .tick{display:flex;background:#dc2626}
.pe-th .tick svg{width:13px;height:13px;stroke-width:3}

/* viewer */
.pe-vtool{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:10px;border:1px solid #e5eaf0;border-radius:12px;background:#f8fafc;margin-bottom:12px}
.pe-vtool .sep{width:1px;height:26px;background:#d7dee8;margin:0 4px}
.pe-tb{border:1px solid #e2e8f0;background:#fff;border-radius:8px;padding:7px 11px;font-size:13px;font-weight:600;cursor:pointer;color:#334155;display:inline-flex;gap:6px;align-items:center}
.pe-tb:hover{background:#eef4ff}
.pe-tb.on{background:#0066ff;color:#fff;border-color:#0066ff}
.pe-tb svg{width:15px;height:15px}
.pe-vtool input[type=color]{width:34px;height:32px;border:1px solid #cbd5e1;border-radius:8px;padding:2px;background:#fff}
.pe-vtool input[type=number],.pe-vtool select{border:1px solid #cbd5e1;border-radius:8px;padding:6px 8px;font-size:13px;width:auto;background:#fff}
.pe-vtool input[type=number]{width:64px}
.pe-vwrap{overflow:auto;background:#e8edf4;border-radius:12px;padding:16px;text-align:center;max-height:78vh}
.pe-stage{position:relative;display:inline-block;background:#fff;box-shadow:0 6px 24px -8px rgba(0,0,0,.35);line-height:0;touch-action:none;max-width:100%}
.pe-stage canvas{display:block;max-width:100%;height:auto}
.pe-stage .ov{position:absolute;left:0;top:0;width:100%;height:100%;cursor:crosshair}
.pe-pager{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600}
.pe-split{display:grid;grid-template-columns:260px 1fr;gap:16px;align-items:start}
.pe-side{border:1px solid #e5eaf0;border-radius:14px;padding:14px;background:#fff;display:flex;flex-direction:column;gap:12px}
.pe-side h5{margin:0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#0f172a}
.pe-list{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.pe-li{display:flex;align-items:center;justify-content:space-between;gap:8px;border:1px solid #e5eaf0;border-radius:8px;padding:6px 8px;font-size:13px}
.pe-sigpad{border:1px solid #cbd5e1;border-radius:10px;background:#fff;touch-action:none;cursor:crosshair;width:100%;height:160px;display:block}
.pe-tabs{display:flex;gap:6px;margin-bottom:10px}
.pe-cam{width:100%;max-height:60vh;border-radius:12px;background:#0f172a;display:block}

/* compare */
.pe-cmp{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-top:10px}
.pe-cmp canvas{width:100%;height:auto;border:1px solid #e2e8f0;background:#fff}
.pe-cmp .cap{font-size:12px;color:#64748b;text-align:center;margin-bottom:4px;font-weight:600}
.pe-diff{border:1px solid #e5eaf0;border-radius:12px;padding:14px;margin-top:10px;font-size:14px;line-height:1.7;white-space:pre-wrap;word-break:break-word}
.pe-diff ins{background:#bbf7d0;text-decoration:none;border-radius:3px}
.pe-diff del{background:#fecaca;border-radius:3px}
.pe-stat{display:inline-block;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700}
.pe-stat.ok{background:#dcfce7;color:#166534}.pe-stat.ch{background:#fee2e2;color:#991b1b}

/* modal + toast */
.pe-modal{position:fixed;inset:0;background:rgba(15,23,42,.55);display:flex;align-items:center;justify-content:center;z-index:100000;padding:16px}
.pe-mbox{background:#fff;border-radius:16px;padding:24px;width:100%;max-width:420px;box-shadow:0 30px 70px -20px rgba(0,0,0,.5)}
.pe-mbox h3{margin:0 0 6px;font-size:19px}.pe-mbox p{margin:0 0 14px;color:#64748b;font-size:14px}
.pe-mbox input{width:100%;border:1px solid #cbd5e1;border-radius:9px;padding:11px 12px;font-size:15px;margin-bottom:14px}
.pe-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:#0f172a;color:#fff;padding:12px 20px;border-radius:12px;font-size:14px;font-weight:500;z-index:100001;max-width:90vw;box-shadow:0 14px 30px -10px rgba(0,0,0,.5)}

/* SEO content */
.pe-seo{max-width:960px;margin:64px auto 0;padding-top:30px;border-top:1px solid #e5eaf0}
.pe-seo h2{font-size:24px;font-weight:800;margin:34px 0 12px;letter-spacing:-.015em}
.pe-seo p,.pe-seo li{color:#475569;line-height:1.75;font-size:15.5px}
.pe-how{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px 36px}
.pe-how h3{font-size:16px;margin:14px 0 6px;color:#0f172a}
.pe-how ul{margin:0;padding-left:18px}
.pe-how li{margin-bottom:6px;font-size:14.5px;line-height:1.6}
.pe-how a{color:#0066ff;text-decoration:none}.pe-how a:hover{text-decoration:underline}
.pe-steps{padding-left:22px}
.pe-faq details{border:1px solid #e5eaf0;border-radius:12px;padding:14px 18px;margin-bottom:10px;background:#fff}
.pe-faq summary{cursor:pointer;font-weight:700;color:#0f172a;font-size:15.5px}
.pe-faq details p{margin:10px 0 0}
.pe-related a{color:#0066ff;font-weight:600}
.pe-noscript{background:#fff8e6;border:1px solid #fde4a1;border-radius:10px;padding:12px 16px}

@media(max-width:1000px){.pe-grid{grid-template-columns:repeat(3,1fr)}.pe-split{grid-template-columns:1fr}}
@media(max-width:740px){.pe-grid{grid-template-columns:repeat(2,1fr);gap:12px}.pe-card{padding:16px;min-height:0}.pe-card p{display:none}.pe-card h3{font-size:16px;margin-top:12px}.pe-search{width:100%}.pe-cmp{grid-template-columns:1fr}.pe-drop{padding:38px 14px}.pe-hero p{font-size:15.5px}.pe-thgrid{grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}}

/* view toggle + one-row layout */
.pe-view{display:inline-flex;border:1px solid #e2e8f0;border-radius:999px;padding:3px;background:#fff}
.pe-vb{display:inline-flex;align-items:center;gap:6px;border:0;background:transparent;border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;color:#475569;cursor:pointer}
.pe-vb svg{width:15px;height:15px}
.pe-vb.on{background:#0f172a;color:#fff}
.pe-rowview{display:none;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px 16px;border:1px solid #e5eaf0;border-radius:16px;padding:22px 22px 14px;background:#fff}
.pe[data-view=row] .pe-rowview{display:grid}.pe[data-view=row] .pe-grid{display:none}
.pe-rcol h3{margin:0 0 12px;font-size:12px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#6b7280}
.pe-rcol ul{list-style:none;margin:0;padding:0}
.pe-rcol li{margin:0 0 4px}
.pe-rcol a{display:flex;align-items:center;gap:10px;padding:6px 8px;margin:0 -8px;border-radius:8px;color:#1f2937;font-size:14px;font-weight:500;text-decoration:none;white-space:nowrap}
.pe-rcol a:hover{background:#f1f6ff;color:#0057d9}
.pe-rcol .pe-ico{width:24px;height:24px}
.pe-rcol[hidden]{display:none}
@media(max-width:1100px){.pe-rowview{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.pe-rowview{grid-template-columns:repeat(2,minmax(0,1fr));padding:16px}.pe-view{order:3}}

/* ═════ Upload start screen (big red button) ═════ */
.pe-drop{border:0;background:transparent;border-radius:18px;padding:64px 16px 72px;text-align:center;transition:background .15s;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.pe-drop.over{background:#f4f5fa;outline:2px dashed #e5322d;outline-offset:-10px}
.pe-bigbtn{display:inline-flex;align-items:center;justify-content:center;border:0;cursor:pointer;background:#e5322d;color:#fff;font-weight:700;font-size:clamp(20px,2.4vw,26px);line-height:1.2;min-width:min(100%,340px);height:100px;padding:0 48px;border-radius:14px;box-shadow:0 4px 12px -2px rgba(15,23,42,.28);transition:background .15s,transform .15s}
.pe-bigbtn:hover{background:#cf2823}
.pe-bigbtn:active{transform:translateY(1px)}
.pe-bigbtn:focus-visible{outline:3px solid #0f172a;outline-offset:3px}
.pe-drop .pe-dropt{margin:16px 0 0;color:#47474f;font-size:15px}

/* ═════ Workbench: file cards (left) + options sidebar (right) ═════ */
.pe-wb{display:grid;grid-template-columns:minmax(0,1fr) 360px;border:1px solid #e5eaf0;border-radius:16px;overflow:hidden;background:#fff;min-height:560px}
.pe-wl{position:relative;background:#f5f5fa;padding:36px 96px 36px 36px}
.pe-fc{display:flex;flex-wrap:wrap;gap:12px;align-content:flex-start}
.pe-fcard{position:relative;width:200px;background:#fbfbfd;border-radius:12px;box-shadow:0 1px 4px rgba(15,23,42,.1);padding:14px 10px 12px;text-align:center;cursor:default;transition:box-shadow .15s,transform .15s}
.pe-fcard[draggable=true]{cursor:grab}
.pe-fcard:hover{box-shadow:0 6px 18px -6px rgba(15,23,42,.3)}
.pe-fcard.dg{opacity:.4}
.pe-fcard.dov{outline:2px dashed #e5322d;outline-offset:2px}
.pe-fcv{height:190px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.pe-fcv canvas,.pe-fcv img{max-width:100%;max-height:176px;width:auto;height:auto;background:#fff;box-shadow:0 2px 8px -2px rgba(0,0,0,.35)}
.pe-fcv img{object-fit:contain}
.pe-fext{display:inline-flex;align-items:center;justify-content:center;width:110px;height:140px;border-radius:6px;background:#fff;box-shadow:0 2px 8px -2px rgba(0,0,0,.3);font-weight:800;color:#e5322d;font-size:20px}
.pe-fnm{margin-top:10px;font-size:13.5px;color:#33333b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe-fsub{font-size:11.5px;color:#8a8a96;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pe-ftb{position:absolute;top:6px;right:6px;display:flex;gap:4px;opacity:0;transition:opacity .15s}
.pe-fcard:hover .pe-ftb,.pe-fcard:focus-within .pe-ftb{opacity:1}
@media(hover:none){.pe-ftb{opacity:1}}
.pe-fb{width:28px;height:28px;border-radius:50%;border:0;background:#fff;color:#33333b;box-shadow:0 1px 4px rgba(15,23,42,.3);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.pe-fb:hover{background:#e5322d;color:#fff}
.pe-fb:disabled{opacity:.35;cursor:default;background:#fff;color:#33333b}
.pe-fb svg{width:14px;height:14px}
.pe-fab{position:absolute;top:32px;right:24px;display:flex;flex-direction:column;align-items:center;gap:12px}
.pe-fabw{position:relative}
.pe-fabb{width:64px;height:64px;border-radius:50%;border:0;background:#e5322d;color:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 3px 10px -2px rgba(15,23,42,.4);padding:0;transition:background .15s}
.pe-fabb:hover{background:#cf2823}
.pe-fabb svg{width:30px;height:30px;stroke-width:2.4}
.pe-fabn{position:absolute;top:-6px;left:-6px;min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:#0f172a;color:#fff;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid #f5f5fa}
.pe-sort{width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:#33333b;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 6px -1px rgba(15,23,42,.3);padding:0}
.pe-sort:hover{color:#e5322d}
.pe-sort:disabled{opacity:.4;cursor:default;color:#33333b}
.pe-sort svg{width:26px;height:26px}
.pe-sort text{fill:currentColor;stroke:none;font:700 8.5px Inter,Arial,sans-serif}

.pe-ws{display:flex;flex-direction:column;border-left:1px solid #e5eaf0;background:#fff;min-width:0}
.pe-wst{margin:0;padding:22px 20px 18px;text-align:center;font-size:22px;font-weight:700;color:#33333b;border-bottom:1px solid #e5eaf0;letter-spacing:-.01em}
.pe-wsb{flex:1;padding:6px 20px 16px;overflow:auto}
.pe-wsf{padding:16px 20px 20px;position:sticky;bottom:0;background:#fff}
.pe-go{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;height:64px;border:0;border-radius:12px;background:#e5322d;color:#fff;font-size:22px;font-weight:700;cursor:pointer;box-shadow:0 3px 10px -3px rgba(229,50,45,.6);transition:background .15s}
.pe-go:hover{background:#cf2823}
.pe-go:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.pe-goi{display:inline-flex}.pe-goi svg{width:34px;height:34px;stroke-width:1.8}
.pe-ws .pe-panel{border:0;border-radius:0;padding:0;margin:0}
.pe-ws .pe-panel h4{display:none}
.pe-ws .pe-opts{grid-template-columns:1fr;gap:18px}
.pe-ws .pe-f{gap:10px}
.pe-ws .pe-f>label,.pe-ws .pe-f>.lb{font-size:17px;font-weight:600;color:#33333b}
.pe-ws .pe-f select{height:52px;font-size:17px;border-radius:6px;border:1px solid #33333b;padding:0 14px;color:#33333b}
.pe-ws .pe-f input[type=text],.pe-ws .pe-f input[type=number],.pe-ws .pe-f input[type=password]{height:46px;border-radius:6px}
.pe-ws .pe-f .hint{font-size:12.5px}
.pe-ws .pe-ck{padding-top:6px;font-size:17px;gap:14px;color:#33333b}
.pe-ws .pe-ck input{appearance:none;-webkit-appearance:none;width:34px;height:34px;flex:none;margin:0;border:1px solid #d3d3da;border-radius:6px;background:#fff;display:inline-grid;place-content:center;cursor:pointer}
.pe-ws .pe-ck input:checked{border-color:#2fbf71}
.pe-ws .pe-ck input::after{content:'';width:18px;height:10px;border-left:4px solid #2fbf71;border-bottom:4px solid #2fbf71;transform:translateY(-2px) rotate(-45deg) scale(0);transition:transform .1s}
.pe-ws .pe-ck input:checked::after{transform:translateY(-2px) rotate(-45deg) scale(1)}
.pe-ws .pe-note{font-size:13px;line-height:1.55;margin:16px 0 0}
.pe-tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pe-tiles.c3{grid-template-columns:repeat(3,1fr);gap:8px}
.pe-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:82px;padding:10px 6px;border:1px solid #e1e1e8;border-radius:8px;background:#fff;color:#5b5b66;font-size:16px;font-weight:500;cursor:pointer;transition:.12s}
.pe-tile:hover{background:#f6f6fa}
.pe-tile.on{background:#ececf2;border-color:#33333b;color:#33333b;font-weight:600}
.pe-tile .ti{display:inline-flex}.pe-tile .ti svg{width:44px;height:44px;stroke-width:2;color:#33333b}
.pe-tiles.c3 .pe-tile{font-size:14px;white-space:nowrap;padding:10px 2px}

@media(max-width:900px){
  .pe-wb{grid-template-columns:1fr}
  .pe-ws{border-left:0;border-top:1px solid #e5eaf0}
  .pe-wl{padding:20px 16px 20px 16px;min-height:300px}
  .pe-fab{position:static;flex-direction:row;justify-content:flex-end;margin-bottom:14px;order:-1}
  .pe-wl{display:flex;flex-direction:column}
  .pe-fc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .pe-fcard{width:auto}
  .pe-fabb{width:52px;height:52px}
  .pe-wsf{position:static}
}