/* Calm mint/sage look, matching her achievement file.
   Shape rule: cards 14px, controls (inputs, buttons) 10px, chips full pill. */
:root{
  --ink:#4f7564; --deep:#34503f; --tint:#a9c5b7; --wash:#edf3ef; --beige:#c9b99a; --brown:#6d5f38;
  --bg:#f3f6f4; --card:#fcfdfc; --fg:#1f2b25; --muted:#56665e; --line:#d3dfd8; --field:#ffffff;
  --accent:#4f7564; --accent-fg:#ffffff; --accent-soft:#e3ece7; --danger:#a3283d; --danger-soft:#f8e9ec;
  --shadow:0 1px 2px rgba(52,80,63,.06),0 6px 18px rgba(52,80,63,.07);
  --font-head:"El Messiri","IBM Plex Sans Arabic","Segoe UI",Tahoma,sans-serif;
  --font-body:"IBM Plex Sans Arabic","Segoe UI",Tahoma,sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#121815; --card:#1a221e; --fg:#e4ece7; --muted:#a2b3aa; --line:#2d3a33; --field:#121815;
    --accent:#a9c5b7; --accent-fg:#13201a; --accent-soft:#22302a; --danger:#f0959f; --danger-soft:#3a2328;
    --shadow:0 1px 2px rgba(0,0,0,.3); color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#121815; --card:#1a221e; --fg:#e4ece7; --muted:#a2b3aa; --line:#2d3a33; --field:#121815;
  --accent:#a9c5b7; --accent-fg:#13201a; --accent-soft:#22302a; --danger:#f0959f; --danger-soft:#3a2328;
  --shadow:0 1px 2px rgba(0,0,0,.3); color-scheme:dark;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 var(--font-body);min-height:100dvh}
[hidden]{display:none!important}
img{max-width:100%}
button,input,textarea,select{font:inherit;color:inherit}
h1,h2,h3{font-family:var(--font-head);line-height:1.35;margin:0}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ico{width:20px;height:20px;flex:none;stroke:currentColor;stroke-width:1.75;fill:none;stroke-linecap:round;stroke-linejoin:round}

/* ---------- top bar ---------- */
.top{position:sticky;top:0;z-index:10;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);-webkit-backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top)}
.top-in{max-width:880px;margin:0 auto;padding:10px 16px 8px;display:flex;align-items:center;gap:12px}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-mark{width:34px;height:34px;border-radius:10px;background:var(--ink);color:var(--wash);flex:none;display:grid;place-items:center}
.brand-mark .ico{width:21px;height:21px}
.brand-txt{min-width:0}
.brand-name{font-family:var(--font-head);font-weight:700;font-size:18px;color:var(--fg);line-height:1.3}
.brand-sub{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tabs{max-width:880px;margin:0 auto;padding:0 16px 10px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.tabs a{display:flex;align-items:center;justify-content:center;min-height:42px;border-radius:10px;text-decoration:none;color:var(--muted);font-weight:600;font-size:15px;background:transparent;border:1px solid var(--line);transition:background .15s,color .15s}
.tabs a[aria-current="page"]{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}

/* ---------- layout ---------- */
.view{max-width:880px;margin:0 auto;padding:18px 16px calc(40px + env(safe-area-inset-bottom))}
.view.has-bar{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
.head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.head h1{font-size:22px;font-weight:700;color:var(--fg)}
.lead{margin:-6px 0 16px;color:var(--muted);font-size:15px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}
.card h2,.card h3{font-size:17px;font-weight:700;color:var(--fg);margin-bottom:12px}
.help{margin:-6px 0 12px;font-size:14px;color:var(--muted)}
.loading{padding:40px 0;text-align:center;color:var(--muted)}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--fg);font-weight:600;font-size:15px;cursor:pointer;white-space:nowrap;text-decoration:none;transition:background .15s,border-color .15s,transform .08s}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.55;cursor:default;transform:none}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.btn.soft{background:var(--accent-soft);border-color:transparent;color:var(--fg)}
.btn.ghost{background:transparent;border-color:transparent;padding:0 8px;color:var(--fg)}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn.small{min-height:40px;padding:0 12px;font-size:14px}
@media (hover:hover){
  .btn:hover:not(:disabled){border-color:var(--tint)}
  .btn.primary:hover:not(:disabled){filter:brightness(1.06)}
}
.icon-btn{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:10px;border:0;background:transparent;color:var(--muted);cursor:pointer}
.icon-btn:active{background:var(--accent-soft)}
.icon-btn.del:hover{color:var(--danger)}

/* ---------- forms ---------- */
.fld{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.fld:last-child{margin-bottom:0}
.fld>span{font-size:14px;font-weight:600;color:var(--fg)}
.fld small{font-size:13px;color:var(--muted)}
input[type=text],input[type=password],textarea{width:100%;min-height:46px;border:1px solid var(--line);border-radius:10px;background:var(--field);padding:10px 12px;font-size:16px;line-height:1.5;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;min-height:96px;overflow:hidden}
input::placeholder,textarea::placeholder{color:color-mix(in srgb,var(--muted) 85%,transparent)}
input:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.grid2{display:grid;grid-template-columns:1fr;gap:0 14px}
@media (min-width:640px){ .grid2{grid-template-columns:1fr 1fr} .grid2 .fld:nth-last-child(2):nth-child(odd){margin-bottom:0} }

/* ---------- report list ---------- */
.reps{display:grid;gap:10px}
.rep{background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden}
.rep-open{display:block;width:100%;text-align:start;background:none;border:0;padding:14px 16px 10px;cursor:pointer}
.rep-title{display:block;font-family:var(--font-head);font-weight:700;font-size:17px;line-height:1.4;color:var(--fg)}
.rep-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin-top:6px;font-size:13.5px;color:var(--muted)}
.chip{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:999px;background:var(--accent-soft);color:var(--fg);font-size:13px;font-weight:600}
.rep-acts{display:flex;gap:4px;padding:0 8px 8px;flex-wrap:wrap}
.rep-acts .btn{min-height:40px;font-size:14px;padding:0 10px;border-color:transparent;background:transparent;color:var(--muted)}
.rep-acts .btn:hover{color:var(--fg)}
.rep-acts .btn.del:hover{color:var(--danger)}
.empty{text-align:center;padding:36px 20px;border:1px dashed var(--tint);border-radius:14px;background:var(--card)}
.empty p{margin:0 0 14px;color:var(--muted)}

/* ---------- templates ---------- */
.tpls{display:grid;grid-template-columns:1fr;gap:10px}
@media (min-width:600px){ .tpls{grid-template-columns:1fr 1fr} }
.tpl{text-decoration:none;color:inherit;display:flex;gap:12px;align-items:flex-start;text-align:start;width:100%;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;cursor:pointer;box-shadow:var(--shadow);transition:border-color .15s,transform .08s}
.tpl:active{transform:scale(.99)}
@media (hover:hover){ .tpl:hover{border-color:var(--tint)} }
.tpl-ico{width:40px;height:40px;border-radius:10px;background:var(--accent-soft);color:var(--ink);display:grid;place-items:center;flex:none}
:root[data-theme="dark"] .tpl-ico{color:var(--tint)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .tpl-ico{color:var(--tint)} }
.tpl-t{display:block;font-family:var(--font-head);font-weight:700;font-size:16.5px;line-height:1.4}
.tpl-d{display:block;font-size:14px;color:var(--muted);margin-top:2px;line-height:1.55}

/* ---------- editor ---------- */
.crumbs{display:flex;align-items:center;gap:6px;margin:-6px 0 12px;min-width:0}
.crumbs .btn.ghost{color:var(--muted);flex:none}
.crumbs .ctitle{font-family:var(--font-head);font-weight:700;font-size:18px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.notice{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;background:var(--accent-soft);border-radius:14px;padding:12px 14px;margin-bottom:14px;font-size:14.5px}
.notice a{color:var(--fg);font-weight:700}

.photos{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
@media (min-width:640px){ .photos{grid-template-columns:repeat(4,1fr)} }
.ph{position:relative;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:var(--wash);border:1px solid var(--line)}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph .icon-btn{position:absolute;top:4px;inset-inline-end:4px;width:40px;height:40px;background:rgba(20,30,25,.62);color:#fff;border-radius:10px}
.ph.busy{display:grid;place-items:center;font-size:14px;color:var(--deep)}
.ph-add{aspect-ratio:4/3;border-radius:12px;border:1.5px dashed var(--tint);background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;font-weight:600;font-size:14px}
.ph-add .ico{width:26px;height:26px}
.signs-note{font-size:14px;color:var(--muted);margin:4px 2px 0}

/* bottom action bar */
.actbar{position:fixed;inset-inline:0;bottom:0;z-index:9;background:color-mix(in srgb,var(--card) 94%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);padding:10px 16px calc(10px + env(safe-area-inset-bottom))}
.actbar-in{max-width:880px;margin:0 auto;display:flex;align-items:center;gap:8px}
.state{flex:1;min-width:0;font-size:13.5px;color:var(--muted);line-height:1.35}
.state.dirty{color:var(--brown);font-weight:600}
:root[data-theme="dark"] .state.dirty{color:var(--beige)}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .state.dirty{color:var(--beige)} }
.actbar .btn{padding:0 14px}

/* ---------- preview ---------- */
.pv-acts{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}
.pv-acts .row{display:flex;gap:8px;flex-wrap:wrap}
.pv-hint{margin:0;font-size:13.5px;color:var(--muted)}
.sheet-wrap{position:relative;overflow:hidden}
.sheet-wrap .sheet{position:absolute;top:0;right:0;transform-origin:top right;box-shadow:0 2px 6px rgba(30,45,38,.12),0 12px 32px rgba(30,45,38,.12)}

/* ---------- dialogs ---------- */
.dlg{border:1px solid var(--line);border-radius:16px;background:var(--card);color:var(--fg);padding:22px 20px 18px;width:min(360px,calc(100vw - 32px));direction:rtl;box-shadow:0 18px 50px rgba(0,0,0,.28)}
.dlg::backdrop{background:rgba(18,28,23,.5)}
.dlg form{display:flex;flex-direction:column;gap:12px;margin:0}
.dlg h2{font-size:19px;font-weight:700}
.dlg p{margin:0;font-size:15px;color:var(--muted);line-height:1.65}
#pinIn{height:52px;font-size:24px;letter-spacing:.35em;text-align:center;direction:ltr}
.dlg-err{min-height:1.5em;font-size:14.5px;color:var(--danger);font-weight:600}
.dlg-row{display:flex;gap:8px;flex-wrap:wrap}
.dlg-row .btn{flex:1 1 auto}

.toast{position:fixed;inset-inline:16px;bottom:calc(84px + env(safe-area-inset-bottom));z-index:20;max-width:440px;margin:0 auto;background:var(--deep);color:#fff;border-radius:12px;padding:12px 16px;font-size:15px;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.toast.err{background:var(--danger);color:#fff}
:root[data-theme="dark"] .toast.err{color:#2a1013}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .toast.err{color:#2a1013} }

@media (prefers-reduced-motion: reduce){ *{transition:none!important} }

/* =====================================================================
   The printed report (A4). Always paper colours, in both themes.
   ===================================================================== */
/* Three designs, picked per report (r.design): d-green, d-blue (coloured header band with waves, bottom wave)
   and d-mint (white header, double page frame). Each design only sets the colour variables below. */
.sheet{position:relative;width:210mm;min-height:297mm;padding:14mm 15mm;background:#fff;color:#1d2621;font:10pt/1.55 var(--font-body);direction:rtl;-webkit-print-color-adjust:exact;print-color-adjust:exact;
  --c1:#4f7564; --c2:#34503f; --c3:#7fa593; --acc:#c9b99a; --num:#f1e6c8; --tint:#f2f7f4; --tint2:#edf3ef; --line:#a9c5b7; --line2:#d7e4dd; --ttl:#6d5f38}
.sheet.d-green{--c1:#0f5e4a; --c2:#0a4536; --c3:#2b8a6c; --acc:#c9a24a; --num:#f3d98b; --tint:#f1f7f4; --tint2:#e6f1ec; --line:#a8cdbd; --line2:#d3e6dd; --ttl:#0a4536}
.sheet.d-blue{--c1:#14537d; --c2:#0d2f57; --c3:#1f86a3; --acc:#7cc6e8; --num:#a9e0f7; --tint:#f0f5fa; --tint2:#e5eef6; --line:#b3cde0; --line2:#d6e4ef; --ttl:#0d2f57}
.sheet.d-band{padding:17mm 15mm 18mm}
.sheet *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
/* The content sits in a one-cell table whose empty header and footer rows repeat on every printed page:
   each page gets the same top and bottom space (the page margin is 0 so frames and waves can reach the paper). */
.sh-pg{position:relative;z-index:1;width:100%;border-collapse:collapse;border-spacing:0}
.sh-pg td{padding:0;vertical-align:top}
.sh-gap{height:0}

/* mint: page frame (outer line, inner beige line, corner diamonds, two soft blobs) */
.sh-frame{position:absolute;inset:7mm;z-index:0;border:.8mm solid var(--c1);border-radius:1.5mm;pointer-events:none}
.sh-frame::before{content:"";position:absolute;inset:1.5mm;border:.3mm solid var(--acc);border-radius:.8mm}
.sh-c{position:absolute;width:3.6mm;height:3.6mm;background:var(--acc);border:.5mm solid var(--c1);transform:rotate(45deg)}
.sh-c.tl{top:-2.2mm;left:-2.2mm}.sh-c.tr{top:-2.2mm;right:-2.2mm}.sh-c.bl{bottom:-2.2mm;left:-2.2mm}.sh-c.br{bottom:-2.2mm;right:-2.2mm}
.sh-blob{position:absolute;display:block;border-radius:46% 54% 42% 58% / 52% 44% 56% 48%}
.sh-blob.b1{top:3mm;left:3mm;width:44mm;height:30mm;background:#edf3ef;opacity:.9}
.sh-blob.b2{bottom:3mm;right:3mm;width:34mm;height:13mm;background:#f3ecdc;opacity:.7}

/* green / blue: thin top wave + bottom wave on every page, big header band on the first page */
.sh-fix{position:absolute;inset:0;z-index:0;pointer-events:none}
.sh-fix svg{position:absolute;left:0;width:100%;display:block}
.sh-top{top:0;height:11mm}
.sh-bot{bottom:0;height:15mm}
.w1{fill:var(--c3)} .w2{fill:var(--c2)} .w3{fill:var(--c1)} .wa{fill:none;stroke:var(--acc);stroke-width:.7}
.sh-band{position:relative;margin:-17mm -15mm 0;height:47mm}
.sh-band>svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.sh-band-in{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:8mm;padding:8mm 15mm 0}
.sh-band .sh-org{color:#fff}
.sh-band .sh-logos{background:#fff;border-radius:2.5mm;padding:1.6mm 3mm;box-shadow:0 .4mm 1.2mm rgba(0,0,0,.18)}
.sh-band .sh-logos img{height:14mm}

/* mint header */
.sh-head{display:flex;align-items:center;justify-content:space-between;gap:8mm;padding-bottom:3mm;border-bottom:.6mm solid var(--c1)}
.sh-org{font-family:var(--font-head);font-weight:700;font-size:10.5pt;line-height:1.6;color:var(--c2)}
.sh-logos{display:flex;align-items:center;gap:5mm;flex:none}
.sh-logos img{display:block;height:15mm;width:auto;max-width:none}
.sh-rule{height:.5mm;background:var(--acc);margin-top:.8mm}

.sh-title{text-align:center;font-family:var(--font-head);font-weight:700;font-size:18pt;line-height:1.35;color:var(--ttl);margin:3.5mm 0 3mm;padding:1.6mm 6mm 1.8mm;background:var(--tint2);border-radius:2.5mm;border-bottom:.8mm solid var(--c1);position:relative}
.d-band .sh-title{margin-top:1mm}
.sh-title::before,.sh-title::after{content:"";position:absolute;top:50%;width:2.4mm;height:2.4mm;background:var(--acc);transform:translateY(-50%) rotate(45deg)}
.sh-title::before{right:5mm}.sh-title::after{left:5mm}
.sh-meta{display:grid;grid-template-columns:1fr 1fr;border:.3mm solid var(--line);border-radius:2mm;overflow:hidden;margin-bottom:3.5mm}
.sh-meta div{display:flex;gap:2mm;padding:1.8mm 3mm;border-bottom:.3mm solid var(--line2);background:var(--tint)}
.sh-meta div:nth-child(odd){border-left:.3mm solid var(--line2)}
.sh-meta div:nth-last-child(-n+2){border-bottom:0}
.sh-meta div:nth-child(2):nth-last-child(2){border-bottom:.3mm solid var(--line2)}
.sh-meta div:last-child:nth-child(odd){grid-column:1/-1;border-left:0}
.sh-meta b{color:var(--c1);font-weight:700;white-space:nowrap}
.sh-sec{margin-bottom:3mm}
/* section title: a coloured pill with a small dot */
.sh-h{display:flex;align-items:center;gap:2mm;width:fit-content;min-width:40mm;font-family:var(--font-head);font-weight:700;font-size:11pt;color:#fff;background:var(--c1);border-radius:99mm;margin:0 0 1.2mm;padding:.45mm 5mm .45mm 6mm;line-height:1.5;break-after:avoid;page-break-after:avoid}
.sh-h::before{content:"";width:2.2mm;height:2.2mm;border-radius:50%;background:var(--acc);flex:none}
.sh-count{display:flex;align-items:center;justify-content:space-between;gap:6mm;padding:1.8mm 5mm;border-radius:2.5mm;background:var(--c1);border-inline-start:1.6mm solid var(--acc);break-inside:avoid}
.sh-count span{font-family:var(--font-head);font-weight:700;font-size:12pt;color:#fff}
.sh-count b{font-family:var(--font-head);font-weight:700;font-size:20pt;line-height:1.2;color:var(--num);min-width:16mm;text-align:center}
.sh-txt{white-space:pre-wrap;background:var(--tint);border:.3mm solid var(--line2);border-inline-start:1mm solid var(--line);border-radius:2mm;padding:1.6mm 3mm;break-inside:avoid-page}
.sh-kv{width:100%;border-collapse:collapse;font-size:10.5pt}
.sh-kv th,.sh-kv td{border:.3mm solid var(--line);padding:1.8mm 3mm;text-align:start;vertical-align:top}
.sh-kv th{width:42mm;background:var(--tint2);color:var(--c2);font-weight:700;font-family:var(--font-head)}
.sh-kv tr{break-inside:avoid}
.sh-photos{display:grid;grid-template-columns:1fr 1fr;gap:4mm}
.sh-photos figure{margin:0;height:44mm;border:.3mm solid var(--line);border-radius:2mm;background:var(--tint2);overflow:hidden;break-inside:avoid;page-break-inside:avoid;display:flex;align-items:center;justify-content:center}
.sh-photos figure:only-child{grid-column:1/-1;height:48mm}
.sh-photos img{width:100%;height:100%;object-fit:contain;display:block}
.sh-sign{display:grid;grid-template-columns:1fr 1fr;gap:12mm;margin-top:6mm;break-inside:avoid;page-break-inside:avoid}
.sh-sign div{line-height:2.1}
.sh-sign b{font-family:var(--font-head);color:var(--c2)}
.sh-sign .line{display:inline-block;min-width:38mm;border-bottom:.3mm dotted var(--c1);transform:translateY(-1mm)}
.sh-sign div:last-child{text-align:left}
.sh-empty{color:#7a877f;text-align:center;padding:10mm 0}

@page{size:A4;margin:0}
@media print{
  html,body{background:#fff!important;min-height:0}
  .no-print,.top,.toast,.actbar,.dlg{display:none!important}
  .view{max-width:none;margin:0;padding:0!important}
  .sheet-wrap{height:auto!important;overflow:visible}
  .sheet-wrap .sheet{position:static;transform:none!important;box-shadow:none;width:auto;min-height:0;padding:0 15mm}
  .sh-gap{height:14mm}
  .d-band .sh-gap{height:17mm}
  .d-band tfoot .sh-gap{height:18mm}
  /* fixed = drawn on every printed page */
  .sh-frame{position:fixed;inset:7mm}
  .sh-fix{position:fixed;inset:0}
}

/* design picker in the editor */
.designs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dz{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px 8px;border:1.5px solid var(--line);border-radius:12px;cursor:pointer;background:var(--card);font-size:14px;font-weight:600;text-align:center}
.dz input{position:absolute;opacity:0;pointer-events:none}
.dz:has(input:checked){border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 22%,transparent)}
.dz:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.dz-pg{width:46px;height:60px;border-radius:4px;background:#fff;border:1px solid #d5ddd9;overflow:hidden;position:relative;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.dz-pg i{position:absolute;display:block}
.dz-pg .bd{inset:0 0 auto 0;height:15px;border-radius:0 0 50% 40% / 0 0 6px 5px}
.dz-pg .ln{left:7px;right:7px;height:4px;border-radius:9px}
.dz-pg .l1{top:22px}.dz-pg .l2{top:32px;right:16px}.dz-pg .l3{top:42px}
.dz-pg .ft{inset:auto 0 0 0;height:5px;border-radius:50% 40% 0 0 / 4px 5px 0 0}
.dz-pg.fr{outline:2px solid #4f7564;outline-offset:-5px}