/* ================================================================
   Bliss Pearl Hunt 2026 - launch button, challenge page, upload drawer
   Visual language follows "Bliss_Pearl_Hunt_2026_Dashboard.pdf" and
   "Bliss Pearl Hunt 2026 - Team Briefing.pdf".
   ================================================================ */

/* ---------- Topbar: search + launch button ---------- */

#pearlHuntLaunch{
  --pl-gold:#e6cf93;
  position:relative;isolation:isolate;flex:0 0 auto;display:inline-flex;align-items:center;gap:10px;
  height:42px;padding:0 14px 0 7px;border:0;border-radius:999px;cursor:pointer;overflow:hidden;
  color:#f4efe0;font:600 12.5px/1 Manrope,system-ui,sans-serif;letter-spacing:.01em;
  background:
    radial-gradient(120% 140% at 0% 0%,rgba(255,255,255,.14),transparent 46%),
    linear-gradient(118deg,#071a2c 0%,#0a3046 46%,#0b5654 100%);
  box-shadow:inset 0 0 0 1px rgba(230,207,147,.38),inset 0 1px 0 rgba(255,255,255,.12),0 6px 18px -6px rgba(3,30,45,.65);
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,filter .35s ease;
}
#pearlHuntLaunch[hidden]{display:none!important}
#pearlHuntLaunch::before{ /* travelling light sweep */
  content:'';position:absolute;top:-30%;bottom:-30%;left:-40%;width:32%;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,244,214,.28),transparent);
  transform:skewX(-18deg);animation:pl-sweep 5.5s cubic-bezier(.45,0,.2,1) infinite 1.2s;
}
#pearlHuntLaunch::after{ /* soft gold rim glow */
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:radial-gradient(60% 120% at 18% 50%,rgba(230,207,147,.22),transparent 70%);opacity:.0;transition:opacity .35s;
}
#pearlHuntLaunch:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px rgba(230,207,147,.7),inset 0 1px 0 rgba(255,255,255,.16),0 10px 26px -8px rgba(11,86,84,.75),0 0 0 4px rgba(230,207,147,.08)}
#pearlHuntLaunch:hover::after{opacity:1}
#pearlHuntLaunch:active{transform:translateY(0) scale(.98)}
#pearlHuntLaunch:focus-visible{outline:2px solid var(--pl-gold);outline-offset:3px}
#pearlHuntLaunch .pl-orb{position:relative;width:30px;height:30px;flex:none;display:grid;place-items:center}
#pearlHuntLaunch .pl-pearl{
  position:relative;width:24px;height:24px;border-radius:50%;overflow:hidden;
  background:
    radial-gradient(circle at 34% 28%,#fff 0 9%,rgba(255,255,255,.85) 14%,rgba(255,255,255,0) 34%),
    radial-gradient(circle at 70% 78%,rgba(196,180,150,.55),transparent 55%),
    radial-gradient(circle at 50% 50%,#fbf8f0 0%,#ebe5d6 52%,#c9c1ae 82%,#a69e8b 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.25),0 0 12px 2px rgba(235,222,190,.38),inset -2px -3px 5px rgba(120,108,86,.35);
  animation:pl-float 3.6s ease-in-out infinite;
}
#pearlHuntLaunch .pl-pearl::before{ /* iridescent nacre — exactly the pearl's circle, so the spin can never show a corner even where a browser skips the parent's rounded clip on animated layers */
  content:'';position:absolute;inset:0;border-radius:50%;mix-blend-mode:soft-light;opacity:.85;
  background:conic-gradient(from 0deg,#ffd9f1,#d5f2ff,#d8ffe8,#fff1c9,#ffd9f1);
  animation:pl-spin 6s linear infinite;
}
#pearlHuntLaunch .pl-pearl::after{ /* moving glint */
  content:'';position:absolute;left:18%;top:14%;width:34%;height:22%;border-radius:50%;
  background:radial-gradient(closest-side,rgba(255,255,255,.95),rgba(255,255,255,0));
  filter:blur(.3px);animation:pl-glint 3.6s ease-in-out infinite;
}
#pearlHuntLaunch .pl-sparks{position:absolute;inset:-6px;width:42px;height:42px;pointer-events:none;overflow:visible}
#pearlHuntLaunch .pl-sparks path{fill:#fff6da;transform-box:fill-box;transform-origin:center;opacity:0;animation:pl-twinkle 2.8s ease-in-out infinite}
#pearlHuntLaunch .pl-sparks path:nth-child(2){animation-delay:.9s;fill:#e6cf93}
#pearlHuntLaunch .pl-sparks path:nth-child(3){animation-delay:1.7s}
#pearlHuntLaunch .pl-text{display:flex;align-items:baseline;gap:5px;white-space:nowrap}
#pearlHuntLaunch .pl-bliss{font-weight:500;opacity:.82}
#pearlHuntLaunch .pl-title{font-weight:650}
#pearlHuntLaunch .pl-year{font-weight:600;font-size:11px;color:var(--pl-gold);letter-spacing:.06em}
#pearlHuntLaunch .pl-arrow{width:16px;height:16px;flex:none;opacity:.75;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s}
#pearlHuntLaunch:hover .pl-arrow{transform:translateX(3px);opacity:1}
#pearlHuntLaunch:hover .pl-pearl::before{animation-duration:2.2s}
#pearlHuntLaunch:hover .pl-sparks path{animation-duration:1.4s}
#pearlHuntLaunch.is-arriving{animation:pl-arrive .9s cubic-bezier(.2,.9,.25,1.2) both}
@keyframes pl-sweep{0%,55%{left:-40%}100%{left:130%}}
@keyframes pl-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
@keyframes pl-spin{to{transform:rotate(360deg)}}
@keyframes pl-glint{0%,100%{transform:translate(0,0);opacity:.95}50%{transform:translate(2px,1px);opacity:.6}}
@keyframes pl-twinkle{0%,100%{opacity:0;transform:scale(.2) rotate(0)}12%{opacity:1;transform:scale(1) rotate(45deg)}30%{opacity:0;transform:scale(.3) rotate(90deg)}}
@keyframes pl-arrive{from{opacity:0;transform:translateY(-6px) scale(.9)}to{opacity:1;transform:none}}

/* ---------- Overlay shell ---------- */
.pearl-overlay{
  --ph-bg:#f2f0e7;--ph-paper:#faf9f4;--ph-paper2:#f6f4ec;--ph-line:#dedbd0;--ph-line2:#e9e6dc;
  --ph-navy:#04182b;--ph-navy2:#0a2740;--ph-teal:#0a4c47;--ph-teal2:#0f6c66;--ph-cyan:#2797ad;--ph-cyan2:#4fb9c7;
  --ph-ink:#0a1f33;--ph-ink2:#1b3246;--ph-muted:#56626a;--ph-muted2:#78838a;
  --ph-gold:#b9973f;--ph-gold2:#e2c983;--ph-silver:#8e9aa3;--ph-bronze:#a9693f;
  --ph-serif:'Cormorant Garamond','Cormorant',Georgia,'Times New Roman',serif;
  --ph-sans:'Jost',Manrope,system-ui,-apple-system,'Segoe UI',sans-serif;
  --ph-script:'Pinyon Script','Snell Roundhand',cursive;
  --ph-ease:cubic-bezier(.2,.75,.2,1);
  position:fixed;inset:0;z-index:15000;display:none;overflow:auto;overscroll-behavior:contain;scroll-behavior:smooth;
  background:var(--ph-bg);color:var(--ph-ink);font:400 14px/1.55 var(--ph-sans);text-rendering:optimizeLegibility;
}
.pearl-overlay.is-open{display:block;animation:ph-reveal .8s cubic-bezier(.75,0,.2,1) backwards}
.pearl-overlay.is-closing{animation:ph-unreveal .42s cubic-bezier(.6,0,.8,.3) forwards}
@keyframes ph-reveal{from{clip-path:circle(18px at var(--ox,50%) var(--oy,0px))}to{clip-path:circle(160vmax at var(--ox,50%) var(--oy,0px))}}
@keyframes ph-unreveal{from{clip-path:circle(160vmax at var(--ox,50%) var(--oy,0px))}to{clip-path:circle(18px at var(--ox,50%) var(--oy,0px));opacity:.6}}
/* Opening choreography: everything settles with no transform left behind (fill: backwards) */
.pearl-overlay.is-opening .ph-topbar-in>*{animation:ph-drop .7s var(--ph-ease) .35s backwards}
.pearl-overlay.is-opening .ph-topbar-in>*:nth-child(2){animation-delay:.42s}
.pearl-overlay.is-opening .ph-topbar-in>*:nth-child(3){animation-delay:.49s}
.pearl-overlay.is-opening .ph-head-row{animation:ph-up .8s var(--ph-ease) .4s backwards}
.pearl-overlay.is-opening .ph-motto{animation:ph-up .8s var(--ph-ease) .48s backwards}
.pearl-overlay.is-opening .ph-hero h1{animation:ph-focus 1s var(--ph-ease) .54s backwards}
.pearl-overlay.is-opening .ph-stats>div{animation:ph-up .8s var(--ph-ease) backwards}
.pearl-overlay.is-opening .ph-stats>div:nth-child(1){animation-delay:.66s}
.pearl-overlay.is-opening .ph-stats>div:nth-child(2){animation-delay:.72s}
.pearl-overlay.is-opening .ph-stats>div:nth-child(3){animation-delay:.78s}
.pearl-overlay.is-opening .ph-stats>div:nth-child(4){animation-delay:.84s}
.pearl-overlay.is-opening .ph-teambar{animation:ph-up .9s var(--ph-ease) .8s backwards}
.pearl-overlay.is-opening #pearlDashboardView .ph-section:first-of-type{animation:ph-up .9s var(--ph-ease) .95s backwards}
.pearl-overlay.is-opening .ph-slide-cover .ph-cover-text{animation:ph-up .9s var(--ph-ease) .5s backwards}
.pearl-overlay.is-opening .ph-cover-moon{animation:ph-focus 1.2s var(--ph-ease) .4s backwards}
@keyframes ph-up{from{opacity:0;transform:translateY(22px)}}
@keyframes ph-drop{from{opacity:0;transform:translateY(-12px)}}
@keyframes ph-focus{from{opacity:0;filter:blur(10px);transform:translateY(12px)}}
.pearl-overlay *,.pearl-overlay *::before,.pearl-overlay *::after{box-sizing:border-box}
.pearl-overlay button{font-family:inherit;cursor:pointer}
.pearl-overlay h1,.pearl-overlay h2,.pearl-overlay h3{font-family:var(--ph-serif);font-weight:500;margin:0;letter-spacing:-.005em}
.pearl-overlay .num{font-variant-numeric:tabular-nums lining-nums}

/* Top bar */
.ph-topbar{position:sticky;top:0;z-index:20;background:rgba(242,240,231,.82);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,background .3s,box-shadow .3s}
.pearl-overlay.is-scrolled .ph-topbar{border-bottom-color:var(--ph-line);box-shadow:0 8px 24px -18px rgba(4,24,43,.4)}
.pearl-overlay.is-brief:not(.is-scrolled) .ph-topbar{background:rgba(4,24,43,.0);border-bottom-color:transparent}
.pearl-overlay.is-brief:not(.is-scrolled) .ph-topbar .ph-logo{opacity:0}
.pearl-overlay.is-brief:not(.is-scrolled) .ph-tabs{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.pearl-overlay.is-brief:not(.is-scrolled) .ph-tabs button{color:#cfd9de}
.pearl-overlay.is-brief:not(.is-scrolled) .ph-tabs button[aria-selected=true]{color:var(--ph-navy)}
.pearl-overlay.is-brief:not(.is-scrolled) .ph-close{background:rgba(255,255,255,.08);color:#eef2f0;border-color:rgba(255,255,255,.18)}
.ph-topbar-in{max-width:1240px;margin:0 auto;padding:12px clamp(18px,4vw,48px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px}
.ph-logo{display:block;width:118px;height:auto;transition:opacity .3s}
.ph-logo-light{filter:brightness(0) invert(1);opacity:.78}
.ph-tabs{position:relative;display:flex;gap:2px;padding:4px;border-radius:999px;background:rgba(4,24,43,.05);box-shadow:inset 0 0 0 1px rgba(4,24,43,.06);transition:background .3s}
.ph-tabs button{position:relative;z-index:1;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 16px;border:0;border-radius:999px;background:none;color:var(--ph-muted);font:500 13px var(--ph-sans);letter-spacing:.01em;transition:color .3s}
.ph-tabs button[aria-selected=true]{color:var(--ph-ink)}
.ph-tabs button:focus-visible{outline:2px solid var(--ph-cyan);outline-offset:2px}
.ph-tabs-ink{position:absolute;z-index:0;top:4px;bottom:4px;left:4px;width:calc(50% - 5px);border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(4,24,43,.08),0 4px 14px -6px rgba(4,24,43,.25);transition:transform .45s var(--ph-ease)}
.ph-tabs[data-active=briefing] .ph-tabs-ink{transform:translateX(calc(100% + 2px))}
.ph-topbar-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.ph-close{width:40px;height:40px;display:grid;place-items:center;border:1px solid var(--ph-line);border-radius:50%;background:var(--ph-paper);color:var(--ph-ink);transition:transform .3s var(--ph-ease),background .2s,border-color .2s}
.ph-close:hover{transform:rotate(90deg);background:#fff;border-color:#cfcabb}
.ph-close:focus-visible{outline:2px solid var(--ph-cyan);outline-offset:2px}

.pearl-overlay [hidden]{display:none!important}

/* Buttons */
.ph-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border:0;border-radius:999px;font:500 13px var(--ph-sans);letter-spacing:.02em;text-decoration:none;white-space:nowrap;transition:transform .25s var(--ph-ease),box-shadow .25s,background .25s,opacity .2s}
.ph-btn:hover{transform:translateY(-1px)}
.ph-btn:active{transform:translateY(0) scale(.98)}
.ph-btn:disabled{opacity:.55;cursor:default;transform:none}
.ph-btn:focus-visible{outline:2px solid var(--ph-cyan);outline-offset:2px}
.ph-btn-gold{color:#1c1606;background:linear-gradient(135deg,#f0dca4,#c9a75a 60%,#b48f3c);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 6px 16px -8px rgba(150,112,30,.8)}
.ph-btn-gold:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 22px -8px rgba(150,112,30,.85)}
.ph-btn-navy{color:#f4f1e6;background:linear-gradient(135deg,#0a2740,#04182b);box-shadow:0 6px 16px -8px rgba(4,24,43,.7)}
.ph-btn-ghost-light{color:#e9efec;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.ph-btn-ghost-light:hover{background:rgba(255,255,255,.12)}
.ph-btn-wide{width:100%;height:46px;font-size:14px}
.ph-btn.is-busy{position:relative;color:transparent}
.ph-btn.is-busy::after{content:'';position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid rgba(28,22,6,.25);border-top-color:#1c1606;animation:pl-spin .8s linear infinite}
.ph-link{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:4px 0;color:var(--ph-cyan);font:500 13px var(--ph-sans);text-decoration:none}
.ph-link:hover{color:var(--ph-teal)}

/* Reveal */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ph-ease),transform .8s var(--ph-ease)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal].is-done{transition:none}
.ph-view.is-entering{animation:ph-view-in .5s var(--ph-ease) backwards}
@keyframes ph-view-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* ---------- Dashboard ---------- */
.ph-page{max-width:1240px;margin:0 auto;padding:10px clamp(18px,4vw,48px) 56px}
.ph-head{padding:18px 0 28px}
.ph-head-row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:18px;border-bottom:1px solid var(--ph-line)}
.ph-kicker{font:500 10.5px var(--ph-sans);letter-spacing:.28em;text-transform:uppercase;color:var(--ph-ink2)}
.ph-updated{font:400 12px var(--ph-sans);color:var(--ph-muted)}
.ph-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding-top:30px;flex-wrap:wrap}
.ph-motto{font:500 22px/1 var(--ph-serif);font-style:italic;color:var(--ph-cyan);margin-bottom:10px;letter-spacing:.01em}
.ph-hero h1{font-size:clamp(40px,5.2vw,68px);line-height:.98;color:var(--ph-ink);letter-spacing:-.015em}
.ph-stats{display:grid;grid-template-columns:repeat(4,auto);gap:0;margin:0 0 6px}
.ph-stats>div{padding:0 clamp(16px,2.2vw,30px);border-left:1px solid var(--ph-line)}
.ph-stats>div:first-child{border-left:0;padding-left:0}
.ph-stats dt{font:500 10.5px var(--ph-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ph-muted);margin-bottom:8px}
.ph-stats dd{margin:0;font:600 26px/1 var(--ph-serif);color:var(--ph-ink);white-space:nowrap;font-variant-numeric:lining-nums}

/* Team bar */
.ph-teambar{position:relative;min-height:96px;border-radius:6px;overflow:hidden;background:linear-gradient(90deg,#04182b,#061f36);color:#f3f0e4;box-shadow:0 18px 40px -26px rgba(4,24,43,.75)}
.ph-teambar::before{content:'';position:absolute;inset:0;background:radial-gradient(70% 160% at 100% 0%,rgba(39,151,173,.18),transparent 60%);pointer-events:none}
.ph-teambar-fill{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,#063f3f 0%,#0b6b68 70%,#1c8f8b 100%);transition:width 1.6s var(--ph-ease);overflow:hidden}
.ph-teambar-glint{position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.14) 45%,transparent 70%);background-size:220% 100%;animation:ph-glint 4.5s ease-in-out infinite}
@keyframes ph-glint{0%{background-position:120% 0}60%,100%{background-position:-120% 0}}
.ph-teambar-pearl{position:absolute;top:50%;left:0;z-index:2;transform:translate(-50%,-50%) scale(.4);opacity:0;transition:left 1.6s var(--ph-ease),opacity .6s .9s,transform .6s .9s var(--ph-ease)}
.ph-teambar-pearl.is-visible{opacity:1;transform:translate(-50%,-50%) scale(1)}
.ph-teambar-in{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 56px 22px clamp(20px,3vw,32px);min-height:96px}
.ph-teambar-total span{display:block;font:400 clamp(34px,4vw,46px)/1 var(--ph-serif);font-variant-numeric:lining-nums tabular-nums;letter-spacing:-.01em}
.ph-teambar-total small{display:block;margin-top:6px;font:400 11.5px var(--ph-sans);color:#9fbcc4;letter-spacing:.03em}
.ph-teambar-goal{font:400 11px var(--ph-sans);letter-spacing:.16em;color:#c9d6d9;text-align:right;text-transform:uppercase}
.ph-teambar-goal b{display:block;font:500 30px/1.1 var(--ph-serif);letter-spacing:0;color:#fff;margin-top:4px;text-transform:none}

/* Sections */
.ph-section{margin-top:64px}
.ph-sec-head{display:flex;justify-content:space-between;align-items:flex-start;gap:28px;margin-bottom:24px}
.ph-sec-head h2{font-size:clamp(28px,3vw,36px);line-height:1.05;color:var(--ph-ink);white-space:nowrap}
.ph-sec-head p{margin:4px 0 0;max-width:470px;font:400 13px/1.65 var(--ph-sans);color:var(--ph-muted)}
.ph-sec-head p b{color:var(--ph-ink);font-weight:600}

/* Prizes */
.ph-prizes{display:grid;grid-template-columns:repeat(3,1fr);background:var(--ph-paper);border:1px solid var(--ph-line);border-radius:4px;overflow:hidden}
.ph-prize{position:relative;padding:34px 26px 28px;border-left:1px solid var(--ph-line);transition:background .4s}
.ph-prize:first-child{border-left:0}
.ph-prize::before{content:'';position:absolute;left:0;right:0;top:0;height:2px;background:var(--medal);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ph-ease)}
.ph-prize:hover{background:#fff}
.ph-prize:hover::before{transform:scaleX(1)}
.ph-prize[data-place="1"]{--medal:var(--ph-gold)}.ph-prize[data-place="2"]{--medal:var(--ph-silver)}.ph-prize[data-place="3"]{--medal:var(--ph-bronze)}
.ph-prize-art{height:132px;display:grid;place-items:center;margin-bottom:26px}
.ph-prize-art svg{height:122px;width:auto;max-width:100%;filter:drop-shadow(0 14px 14px rgba(4,24,43,.13));transition:transform .6s var(--ph-ease)}
.ph-prize:hover .ph-prize-art svg{transform:translateY(-6px) scale(1.03)}
.ph-prize-label{display:flex;align-items:center;gap:10px;font:500 10px var(--ph-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ph-ink2)}
.ph-prize-label b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--medal);color:#fff;font:500 12px var(--ph-sans);letter-spacing:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.ph-prize h3{font-size:24px;line-height:1.2;margin:14px 0 8px;color:var(--ph-ink)}
.ph-prize p{margin:0;font:400 12.5px/1.6 var(--ph-sans);color:var(--ph-muted);max-width:300px}

/* Pearl sphere (shared) */
.ph-pearl{--size:46px;position:relative;display:block;width:var(--size);height:var(--size);border-radius:50%;
  background:
    radial-gradient(circle at 33% 27%,#fff 0 7%,rgba(255,255,255,.8) 13%,rgba(255,255,255,0) 32%),
    radial-gradient(circle at 72% 80%,rgba(190,176,146,.55),transparent 55%),
    radial-gradient(circle at 50% 50%,#fdfbf5 0%,#efeadd 48%,#d6cfbd 78%,#b2aa96 100%);
  box-shadow:inset -4px -6px 10px rgba(118,106,84,.28),0 10px 18px -8px rgba(4,24,43,.45),0 0 22px rgba(255,248,226,.35);overflow:hidden;isolation:isolate}
.ph-pearl::before{content:'';position:absolute;inset:0;border-radius:50%;mix-blend-mode:soft-light;opacity:.75;background:conic-gradient(from 30deg,#ffd6ee,#d2efff,#d6ffe7,#fff0c4,#ffd6ee);animation:pl-spin 9s linear infinite}
.ph-pearl i{position:absolute;left:20%;top:15%;width:30%;height:20%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.95),transparent);z-index:1}
.ph-pearl.is-xs{--size:16px}.ph-pearl.is-sm{--size:26px}.ph-pearl.is-xl{--size:clamp(120px,15vw,190px)}
.ph-pearl.is-sm{box-shadow:inset -2px -3px 5px rgba(118,106,84,.3),0 0 0 3px rgba(255,255,255,.14),0 0 18px rgba(255,248,226,.55)}

/* Podium */
.ph-podium-sec{background:var(--ph-paper2);border:1px solid var(--ph-line2);border-radius:4px;padding:36px clamp(18px,3vw,36px) 0;overflow:hidden}
.ph-podium{display:grid;grid-template-columns:repeat(3,minmax(0,220px));justify-content:center;align-items:end;gap:clamp(12px,2.4vw,28px);padding-top:20px}
.ph-podium-col{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.ph-podium-pearl{--size:40px;margin-bottom:16px;animation:ph-bob 4.5s ease-in-out infinite}
.ph-podium-col[data-place="1"] .ph-podium-pearl{--size:56px;animation-delay:-.8s}
.ph-podium-col[data-place="3"] .ph-podium-pearl{--size:36px;animation-delay:-2s}
@keyframes ph-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.ph-podium-name{font:italic 500 21px/1.15 var(--ph-serif);color:var(--ph-muted);min-height:24px;overflow-wrap:anywhere;padding:0 4px;transition:color .4s}
.ph-podium-col.is-taken .ph-podium-name{font-style:normal;font-weight:500;color:var(--ph-ink)}
.ph-podium-value{font:500 13px var(--ph-sans);color:var(--ph-teal2);margin:6px 0 10px;font-variant-numeric:tabular-nums;min-height:18px}
.ph-podium-col:not(.is-taken) .ph-podium-value{color:var(--ph-muted2)}
.ph-podium-prize{font:500 10px var(--ph-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ph-ink2);margin-bottom:10px;white-space:nowrap}
.ph-podium-step{position:relative;width:100%;display:grid;place-items:center;background:linear-gradient(180deg,#0a2740,#04182b);border-top:3px solid var(--medal);color:#f1eee2;border-radius:2px 2px 0 0;height:var(--h);transform-origin:bottom;animation:ph-rise 1.1s var(--ph-ease) both;animation-delay:var(--dl);overflow:hidden}
.ph-podium-step::after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.07) 50%,transparent 70%)}
.ph-podium-step{place-items:center;padding:0}
.ph-podium-step span{position:relative;z-index:1;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;
  border:1px solid color-mix(in srgb,var(--medal) 75%,transparent);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--medal) 10%,transparent),inset 0 0 14px color-mix(in srgb,var(--medal) 18%,transparent);
  font:600 42px/1 var(--ph-serif);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1;
  --mt:color-mix(in srgb,var(--medal) 72%,#fff);background:linear-gradient(105deg,var(--mt) 0%,var(--mt) 30%,#fffdf6 45%,#ffffff 50%,#fffdf6 55%,var(--mt) 70%,var(--mt) 100%);background-size:300% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;animation:ph-medal-sheen 4.8s ease-in-out infinite;animation-delay:var(--md,0s)}
.ph-podium-step span::before{content:'';position:absolute;inset:-1px;border-radius:50%;padding:1.5px;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0 62%,color-mix(in srgb,var(--medal) 60%,#fff) 74%,#fff 80%,transparent 92%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:pl-spin 4.8s linear infinite;animation-delay:var(--md,0s)}
.ph-podium-step span::after{content:'';position:absolute;inset:-7px;border-radius:50%;pointer-events:none;
  background:radial-gradient(closest-side,transparent 78%,color-mix(in srgb,var(--medal) 28%,transparent) 92%,transparent);
  animation:ph-medal-glow 4.8s ease-in-out infinite;animation-delay:var(--md,0s);opacity:.4}
@keyframes ph-medal-sheen{0%,15%{background-position:100% 0}60%,100%{background-position:0% 0}}
@keyframes ph-medal-glow{0%,100%{opacity:.25}50%{opacity:.9}}
.ph-podium-col[data-place="1"]{--md:0s}.ph-podium-col[data-place="2"]{--md:-1.6s}.ph-podium-col[data-place="3"]{--md:-3.2s}
.ph-podium-col[data-place="1"]{--medal:var(--ph-gold);--h:170px;--dl:.25s}
.ph-podium-col[data-place="2"]{--medal:#c9d1d6;--h:118px;--dl:.1s}
.ph-podium-col[data-place="3"]{--medal:var(--ph-bronze);--h:88px;--dl:.4s}
.ph-podium-sec:not(.is-in) .ph-podium-step{animation-play-state:paused}
@keyframes ph-rise{from{transform:scaleY(.15);opacity:.2}to{transform:none;opacity:1}}
.ph-podium-col.is-pop .ph-podium-name{animation:ph-pop .7s var(--ph-ease)}
@keyframes ph-pop{0%{opacity:0;transform:translateY(8px)}100%{opacity:1;transform:none}}
.ph-podium-col.is-reached .ph-podium-pearl{box-shadow:inset -4px -6px 10px rgba(118,106,84,.28),0 0 0 3px rgba(226,201,131,.45),0 0 30px rgba(226,201,131,.6)}

/* Jars */
.ph-jars{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:34px 14px}
.ph-jar-card{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0;padding:10px 6px 12px;border-radius:6px;transition:background .3s,transform .4s var(--ph-ease)}
.ph-jar-card:hover{background:rgba(255,255,255,.55);transform:translateY(-3px)}
.ph-jar{position:relative;width:64px;height:112px}
.ph-jar-glass{position:absolute;inset:0;border-radius:10px 10px 30px 30px;border:1.5px solid #c9c7bb;background:linear-gradient(90deg,#eceae1,#f7f6f0 30%,#f3f2eb 70%,#e6e4da);overflow:hidden;box-shadow:inset 0 -6px 12px rgba(4,24,43,.05),0 8px 16px -12px rgba(4,24,43,.35)}
.ph-jar-glass::before{content:'';position:absolute;left:0;right:0;top:0;height:7px;background:linear-gradient(180deg,rgba(4,24,43,.06),transparent);z-index:3}
.ph-jar-fill{position:absolute;left:0;right:0;bottom:0;height:var(--fill,0%);transition:height 1.6s var(--ph-ease);
  background:
    radial-gradient(circle at 30% 30%,rgba(255,255,255,.5) 0 1.3px,transparent 2.3px) 0 0/13px 14px,
    radial-gradient(circle at 70% 60%,rgba(255,255,255,.28) 0 1px,transparent 2px) 5px 6px/15px 12px,
    linear-gradient(180deg,#7fd0d3 0%,#2a9aa4 28%,#0c6c74 70%,#064a53 100%)}
.ph-jar-card:nth-child(n){transition-delay:calc(var(--i,0)*30ms)}
.ph-wave{position:absolute;left:0;top:-7px;width:200%;height:9px;fill:#7fd0d3;animation:ph-wave 3.2s linear infinite}
@keyframes ph-wave{to{transform:translateX(-50%)}}
.ph-jar-card.is-empty .ph-wave{display:none}
.ph-bubble{position:absolute;bottom:4px;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#e9f6f4 50%,rgba(255,255,255,.4));opacity:0;animation:ph-bubble 4.8s ease-in infinite}
.ph-bubble:nth-of-type(1){left:28%;animation-delay:.4s}.ph-bubble:nth-of-type(2){left:58%;animation-delay:2.1s;width:4px;height:4px}.ph-bubble:nth-of-type(3){left:42%;animation-delay:3.4s}
@keyframes ph-bubble{0%{transform:translateY(0);opacity:0}15%{opacity:.9}90%{opacity:.6}100%{transform:translateY(-70px);opacity:0}}
.ph-jar-card.is-empty .ph-bubble{display:none}
.ph-jar-shine{position:absolute;left:9px;top:12px;bottom:22px;width:6px;border-radius:6px;background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.15));z-index:4;pointer-events:none}
.ph-jar-crown{position:absolute;left:50%;top:-12px;transform:translate(-50%,6px) scale(.4);opacity:0;transition:all .7s var(--ph-ease);z-index:5}
.ph-jar-card.is-full .ph-jar-crown{opacity:1;transform:translate(-50%,0) scale(1)}
.ph-jar-card.is-full .ph-jar-glass{border-color:var(--ph-gold);box-shadow:0 0 0 3px rgba(226,201,131,.25),0 10px 22px -10px rgba(185,151,63,.7)}
.ph-jar-name{margin-top:16px;font:500 11.5px/1.35 var(--ph-sans);color:var(--ph-ink);min-height:31px;display:flex;align-items:center;justify-content:center}
.ph-jar-amount{font:600 21px/1.2 var(--ph-serif);color:var(--ph-ink);margin:4px 0 4px;font-variant-numeric:lining-nums tabular-nums}
.ph-jar-pct{font:400 11.5px var(--ph-sans);color:var(--ph-muted)}
.ph-jar-deals{font:500 10px var(--ph-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ph-muted2);margin-top:5px}
.ph-jar-card.is-me{background:#fff;box-shadow:0 0 0 1px rgba(39,151,173,.35),0 12px 26px -18px rgba(4,24,43,.5)}
.ph-jar-card.is-me .ph-jar-name::after{content:'You';margin-left:6px;padding:1px 6px;border-radius:999px;background:var(--ph-cyan);color:#fff;font:600 8.5px/1.6 var(--ph-sans);letter-spacing:.12em;text-transform:uppercase}

/* Table */
.ph-table-card{background:var(--ph-paper);border:1px solid var(--ph-line);border-radius:4px;padding:26px clamp(14px,2.4vw,28px) 10px}
.ph-sec-head-in{margin-bottom:12px}
.ph-table-scroll{overflow-x:auto;margin:0 -4px}
.ph-table{width:100%;min-width:760px;border-collapse:collapse;font:400 12.5px var(--ph-sans);color:var(--ph-ink)}
.ph-table th{font:500 10.5px var(--ph-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ph-muted);text-align:left;padding:12px 10px;border-bottom:1px solid var(--ph-line)}
.ph-table td{padding:13px 10px;border-bottom:1px solid var(--ph-line2);vertical-align:middle}
.ph-table .r{text-align:right}.ph-table .c{text-align:center;width:64px}
.ph-table tbody tr{transition:background .25s}
.ph-table tbody tr:hover{background:#fff}
.ph-table tbody tr.is-me{background:rgba(39,151,173,.07)}
.ph-table tbody tr.is-me .ph-tname::after{content:'You';margin-left:8px;padding:1px 6px;border-radius:999px;background:var(--ph-cyan);color:#fff;font:600 8.5px/1.6 var(--ph-sans);letter-spacing:.12em;text-transform:uppercase;vertical-align:1px}
.ph-tname{font-weight:500;white-space:nowrap}
.ph-ttotal{font:600 15px var(--ph-serif)!important;font-size:16px!important}
.ph-place{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:50%;color:var(--ph-muted2);font:500 12px var(--ph-sans)}
.ph-place.is-p1,.ph-place.is-p2,.ph-place.is-p3{color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.ph-place.is-p1{background:var(--ph-gold)}.ph-place.is-p2{background:var(--ph-silver)}.ph-place.is-p3{background:var(--ph-bronze)}
.ph-meter{min-width:170px}
.ph-meter span{display:block;font:400 11.5px var(--ph-sans);color:var(--ph-muted);margin-bottom:5px;white-space:nowrap}
.ph-meter i{display:block;height:4px;border-radius:4px;background:#e2e0d4;overflow:hidden}
.ph-meter b{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,#0b6b68,#2797ad);transition:width 1.2s var(--ph-ease)}
.ph-table tr.is-full .ph-meter b{background:linear-gradient(90deg,#b9973f,#e2c983)}
.ph-table tr.is-full .ph-meter span{color:var(--ph-gold);font-weight:600}
.ph-table tfoot td{font-weight:600;border-bottom:0;padding-top:16px;padding-bottom:16px}

/* Neutralise the dashboard's global table styles inside the overlay */
.pearl-overlay table{min-width:0;border-spacing:0;background:transparent}
.pearl-overlay th,.pearl-overlay td{position:static!important;width:auto;min-width:0;white-space:normal;border-radius:0!important;background:transparent!important;letter-spacing:inherit;text-transform:none;color:inherit}
.pearl-overlay tbody tr:nth-child(even){background:transparent}
.pearl-overlay .ph-table{min-width:760px}
.pearl-overlay .ph-table th{font:500 10.5px var(--ph-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--ph-muted);padding:12px 10px}
.pearl-overlay .ph-table td{font-size:12.5px;padding:13px 10px;color:var(--ph-ink)}
.pearl-overlay .ph-table th.r,.pearl-overlay .ph-table td.r{text-align:right}
.pearl-overlay .ph-table th:last-child,.pearl-overlay .ph-table td:last-child{text-align:left;width:200px}
.pearl-overlay .ph-table tbody tr:hover td{background:#fff!important}
.pearl-overlay .ph-table tbody tr.is-me td{background:rgba(39,151,173,.07)!important}
.pearl-overlay .ph-rules th{background:#e5e3da!important;color:var(--ph-ink);font-size:13px;letter-spacing:0;text-transform:none;padding:13px 18px}
.pearl-overlay .ph-rules td{font-size:14px;padding:15px 18px;color:#2c3b46}
.pearl-overlay .ph-rules td:first-child{color:var(--ph-ink)}
.pearl-overlay .ph-rules td:last-child,.pearl-overlay .ph-rules th:last-child{text-align:left;white-space:normal}

/* Footer */
.ph-foot{margin-top:56px;padding-top:26px;border-top:1px solid var(--ph-line);display:flex;align-items:center;gap:18px;flex-wrap:wrap;font:400 12px var(--ph-sans);color:var(--ph-muted)}
.ph-foot .ph-link{margin-left:auto}
.ph-script{font-family:var(--ph-script);font-size:26px;line-height:1;color:var(--ph-cyan);letter-spacing:0}

/* ---------- Briefing ---------- */
.ph-brief{margin-top:-65px}
.ph-slide{position:relative;overflow:hidden}
.ph-slide-in{max-width:1240px;margin:0 auto;padding:clamp(64px,9vw,120px) clamp(22px,5vw,64px)}
.ph-narrow{max-width:980px}
.ph-slide-cream{background:var(--ph-bg)}
.ph-slide-alt{background:#efede3}
.ph-slide-navy{background:var(--ph-navy);color:#eef0ea}
.ph-slide-teal{background:linear-gradient(135deg,#064a46,#0a5650);color:#eef3ee}
.ph-slide-cover{background:radial-gradient(90% 120% at 100% 100%,#0a4a46 0%,rgba(10,74,70,0) 55%),linear-gradient(160deg,#04182b 0%,#051d33 60%,#06283a 100%);color:#f1eee2;min-height:min(92vh,760px);display:flex;align-items:center}
.ph-slide-cover .ph-slide-in{width:100%;position:relative;padding-top:120px}
.ph-slide-cover .ph-logo-light{width:150px;position:absolute;top:96px}
.ph-cover-moon{position:absolute;right:clamp(22px,8vw,120px);top:110px;display:grid;place-items:center;width:clamp(170px,21vw,260px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(79,185,199,.35)}
.ph-cover-moon::before{content:'';position:absolute;inset:-26px;border-radius:50%;border:1px solid rgba(79,185,199,.12);animation:ph-pulse 5s ease-in-out infinite}
@keyframes ph-pulse{0%,100%{transform:scale(1);opacity:.6}50%{transform:scale(1.05);opacity:1}}
.ph-cover-moon .ph-pearl{animation:ph-bob 6s ease-in-out infinite;box-shadow:inset -10px -14px 26px rgba(118,106,84,.32),0 30px 60px -20px rgba(0,0,0,.6),0 0 60px rgba(255,248,226,.18)}
.ph-cover-text{margin-top:clamp(170px,22vw,240px)}
.ph-script-lg{font-size:clamp(28px,3.4vw,40px);color:#7ec9d4;margin-bottom:12px}
.ph-cover-text h1{font-size:clamp(46px,7.6vw,96px);line-height:.95;color:#f2eee1;font-weight:400}
.ph-cover-text p{margin:18px 0 28px;font:400 14px var(--ph-sans);color:#b9c8cc;letter-spacing:.02em}
.ph-eyebrow{font:600 10.5px var(--ph-sans);letter-spacing:.28em;text-transform:uppercase;color:var(--ph-cyan);margin-bottom:16px}
.ph-eyebrow-light{color:#6fc6d2}
.ph-slide h2{font-size:clamp(32px,4vw,48px);line-height:1.08;color:var(--ph-ink)}
.ph-slide h2.ph-light{color:#f1eee2}
.ph-quote{font-size:clamp(34px,4.6vw,56px)!important}
.ph-lead{margin:28px 0 0;max-width:720px;font:400 17px/1.75 var(--ph-sans);color:#3d4c56}
.ph-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:48px}
.ph-steps article{background:var(--ph-paper);border:1px solid var(--ph-line);border-radius:4px;padding:30px 26px 32px;transition:transform .5s var(--ph-ease),box-shadow .5s}
.ph-steps article:hover{transform:translateY(-4px);box-shadow:0 22px 40px -28px rgba(4,24,43,.45)}
.ph-steps span{font:500 34px/1 var(--ph-serif);color:var(--ph-cyan)}
.ph-steps h3{font-size:24px;margin:18px 0 10px;color:var(--ph-ink)}
.ph-steps p{margin:0;font:400 14px/1.65 var(--ph-sans);color:#56636b}
.ph-big{font:400 clamp(84px,14vw,180px)/.9 var(--ph-serif);color:#efeadb;letter-spacing:-.02em;font-variant-numeric:lining-nums}
.ph-big-sub{margin:26px 0 0;max-width:720px;font:italic 500 clamp(22px,2.4vw,30px)/1.35 var(--ph-serif);color:#e6ece5}
.ph-small-light{margin:22px 0 0;font:400 13px var(--ph-sans);color:#9fc2bf}
.ph-prize-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
.ph-prize-cards article{background:linear-gradient(180deg,#0b2943,#0a2338);border-top:2px solid var(--medal);padding:26px 24px 30px;min-height:190px;transition:transform .5s var(--ph-ease)}
.ph-prize-cards article:hover{transform:translateY(-4px)}
.ph-prize-cards article[data-place="1"]{--medal:var(--ph-gold2)}.ph-prize-cards article[data-place="2"]{--medal:#c7cfd5}.ph-prize-cards article[data-place="3"]{--medal:#d08b5c}
.ph-prize-cards span{font:600 10px var(--ph-sans);letter-spacing:.26em;text-transform:uppercase;color:var(--medal)}
.ph-prize-cards h3{font-size:clamp(24px,2.4vw,30px);line-height:1.15;margin:12px 0 14px;color:#f1eee2}
.ph-prize-cards p{margin:0;font:400 13px/1.6 var(--ph-sans);color:#a9bac3}
.ph-rules{width:100%;margin-top:48px;border-collapse:collapse;font:400 14px/1.5 var(--ph-sans);background:var(--ph-paper);border:1px solid var(--ph-line)}
.ph-rules th{background:#e5e3da;text-align:left;font-weight:600;font-size:13px;padding:13px 18px;color:var(--ph-ink)}
.ph-rules td{padding:15px 18px;border-top:1px solid var(--ph-line2);color:#2c3b46}
.ph-rules td:first-child{width:30%;color:var(--ph-ink);font-weight:500}
.ph-tracking{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:40px}
.ph-bullets{margin:30px 0 34px;padding:0;list-style:none}
.ph-bullets li{position:relative;padding-left:20px;margin:10px 0;font:400 15px/1.6 var(--ph-sans);color:#384853}
.ph-bullets li::before{content:'';position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#d8d2c2)}
.ph-mini-jars{display:flex;justify-content:center;gap:clamp(14px,3vw,30px)}
.ph-mini-jar{margin:0;text-align:center}
.ph-mini-jar .ph-jar{width:clamp(70px,8vw,96px);height:clamp(150px,17vw,200px)}
.ph-mini-jar .ph-jar-glass{border-radius:4px}
.ph-mini-jar .ph-jar-fill{background:linear-gradient(180deg,#8fd6d8 0%,#2a9aa4 30%,#0c6c74 72%,#064a53 100%)}
.ph-mini-jar figcaption{margin-top:12px;font:400 12px var(--ph-sans);color:var(--ph-muted)}
.ph-slide-outro{min-height:auto;text-align:center}
.ph-slide-outro .ph-slide-in{padding:clamp(90px,12vw,150px) 24px}
.ph-script-xl{font-size:clamp(40px,5.4vw,64px);color:#6fc6d2;margin-bottom:18px}
.ph-slide-outro h2{max-width:760px;margin:0 auto 46px}
.ph-slide-outro .ph-logo-light{position:static;margin:0 auto;width:170px}

/* ---------- Drawer ---------- */
.ph-drawer-scrim{position:fixed;inset:0;z-index:40;background:rgba(4,24,43,.32);backdrop-filter:blur(3px);opacity:0;transition:opacity .3s}
.ph-drawer-scrim.is-on{opacity:1}
.ph-drawer{position:fixed;top:0;right:0;bottom:0;z-index:41;width:min(480px,100vw);background:var(--ph-bg);box-shadow:none;transform:translateX(104%);visibility:hidden;transition:transform .45s var(--ph-ease),visibility 0s .45s,box-shadow .45s;display:flex;flex-direction:column}
.ph-drawer.is-open{transform:none;visibility:visible;transition:transform .45s var(--ph-ease),visibility 0s,box-shadow .45s;box-shadow:-30px 0 60px -30px rgba(4,24,43,.5)}
.ph-drawer-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:26px 26px 18px;border-bottom:1px solid var(--ph-line)}
.ph-drawer-head .ph-eyebrow{margin-bottom:6px}
.ph-drawer-head h2{font-size:30px;line-height:1}
.ph-drawer-body{flex:1;overflow:auto;padding:20px 22px 40px;display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-content:start}
.ph-card{background:var(--ph-paper);border:1px solid var(--ph-line);border-radius:8px;padding:20px}
.ph-card[hidden]{display:none}
.ph-card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.ph-card-head h3{display:flex;align-items:center;gap:8px;font:600 14px var(--ph-sans);color:var(--ph-ink)}
.ph-howto{margin:0 0 16px;padding:0 0 0 18px;font:400 12.5px/1.6 var(--ph-sans);color:#46545d}
.ph-howto li{margin:4px 0}.ph-howto b{color:var(--ph-ink);font-weight:600}
.ph-template{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:8px;background:#fff;border:1px solid var(--ph-line);color:var(--ph-ink);text-decoration:none;transition:border-color .2s,transform .3s var(--ph-ease),box-shadow .3s}
.ph-template:hover{border-color:#bcd9d4;transform:translateY(-1px);box-shadow:0 10px 22px -16px rgba(4,24,43,.4)}
.ph-template>svg:first-child{color:#167a4a;flex:none}
.ph-template>svg:last-child{color:var(--ph-cyan);margin-left:auto;flex:none}
.ph-template span{display:flex;flex-direction:column;min-width:0}
.ph-template b{font:600 12.5px var(--ph-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-template small{font:400 11px var(--ph-sans);color:var(--ph-muted)}
.ph-drop{margin-top:14px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px 16px;border:1.5px dashed #c4c0b0;border-radius:10px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.6) 0 10px,rgba(255,255,255,.3) 10px 20px);cursor:pointer;text-align:center;transition:border-color .25s,background .25s,transform .3s var(--ph-ease)}
.ph-drop:hover,.ph-drop:focus-visible,.ph-drop.is-over{border-color:var(--ph-cyan);background:rgba(39,151,173,.06);outline:none}
.ph-drop.is-over{transform:scale(1.015)}
.ph-drop-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:#fff;color:var(--ph-cyan);box-shadow:0 8px 18px -12px rgba(4,24,43,.5);transition:transform .4s var(--ph-ease)}
.ph-drop:hover .ph-drop-icon,.ph-drop.is-over .ph-drop-icon{transform:translateY(-3px)}
.ph-drop-title{font:500 20px var(--ph-serif);color:var(--ph-ink);margin-top:6px}
.ph-drop-sub{font:400 12px var(--ph-sans);color:var(--ph-muted)}
.ph-drop-sub u{color:var(--ph-cyan);text-underline-offset:3px}
.ph-drop.is-loaded{display:none}
.ph-preview{margin-top:14px;animation:ph-view-in .45s var(--ph-ease) backwards}
.ph-preview-loading{display:flex;align-items:center;gap:10px;font:400 13px var(--ph-sans);color:var(--ph-muted);padding:10px 2px}
.ph-spinner{width:16px;height:16px;border-radius:50%;border:2px solid rgba(39,151,173,.25);border-top-color:var(--ph-cyan);animation:pl-spin .8s linear infinite}
.ph-preview-error{display:flex;gap:10px;padding:14px;border-radius:8px;background:#fbefea;border:1px solid #efcfc3;color:#8a3a1d}
.ph-preview-error svg{flex:none;margin-top:1px}
.ph-preview-error b{display:block;font:600 13px var(--ph-sans);margin-bottom:3px}
.ph-preview-error span{font:400 12.5px/1.5 var(--ph-sans)}
.ph-preview-file{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:8px;background:#fff;border:1px solid var(--ph-line);font:500 12.5px var(--ph-sans)}
.ph-preview-file svg{color:#167a4a;flex:none}
.ph-preview-file b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.ph-preview-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin:12px 0;background:var(--ph-line);border:1px solid var(--ph-line);border-radius:8px;overflow:hidden}
.ph-preview-stats div{background:#fff;padding:10px 10px 9px}
.ph-preview-stats small{display:block;font:500 9px var(--ph-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ph-muted);margin-bottom:4px}
.ph-preview-stats b{font:500 17px var(--ph-serif);color:var(--ph-ink);white-space:nowrap}
.ph-preview-note{font:400 12px/1.55 var(--ph-sans);color:#46545d}
.ph-preview-warn{display:flex;gap:8px;margin-top:10px;padding:10px 12px;border-radius:8px;background:#fdf6e4;border:1px solid #efdfb3;color:#7a5a12;font:400 12px/1.5 var(--ph-sans)}
.ph-preview-warn svg{flex:none;margin-top:1px}
.ph-diff{list-style:none;margin:12px 0 16px;padding:0;border:1px solid var(--ph-line);border-radius:8px;background:#fff;max-height:300px;overflow:auto}
.ph-diff li{display:grid;grid-template-columns:1fr auto 92px;gap:10px;align-items:center;padding:8px 12px;border-top:1px solid var(--ph-line2);font:400 12.5px var(--ph-sans)}
.ph-diff li:first-child{border-top:0}
.ph-diff .ph-delta{text-align:right;font-size:11.5px}
.ph-diff .is-up .ph-delta{color:#11795f;font-weight:600}
.ph-diff .is-down{background:#fffaf0}.ph-diff .is-down .ph-delta{color:#b0571f;font-weight:600}
.ph-diff .is-same{color:var(--ph-muted)}.ph-diff .is-same .ph-delta{color:var(--ph-muted2)}
.ph-history{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ph-history li{display:flex;align-items:center;gap:10px;padding:9px 6px;border-radius:6px;color:var(--ph-ink)}
.ph-history li>svg{color:var(--ph-muted2);flex:none}
.ph-history li div{flex:1;min-width:0}
.ph-history b{display:block;font:500 12.5px var(--ph-sans);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ph-history small{font:400 11px var(--ph-sans);color:var(--ph-muted)}
.ph-history em{font:600 9px var(--ph-sans);letter-spacing:.14em;text-transform:uppercase;font-style:normal;color:#11795f;background:#e2f3ec;padding:3px 7px;border-radius:999px}
.ph-history li.is-current{background:#fff}
.ph-history li.is-empty{color:var(--ph-muted);font-size:12.5px}
.ph-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ph-form label{display:flex;flex-direction:column;gap:6px;font:500 11px var(--ph-sans);letter-spacing:.04em;color:var(--ph-muted)}
.ph-form label:nth-child(3){grid-column:1/-1}
.ph-form label{min-width:0}
.ph-form input{width:100%;min-width:0;max-width:100%;margin:0;box-sizing:border-box;-moz-appearance:textfield;appearance:textfield;height:40px;border:1px solid var(--ph-line);border-radius:8px;padding:0 12px;background:#fff;color:var(--ph-ink);font:500 14px var(--ph-sans);outline:none;transition:border-color .2s,box-shadow .2s}
.ph-form input:focus{border-color:var(--ph-cyan);box-shadow:0 0 0 3px rgba(39,151,173,.14)}
.ph-form .ph-btn{grid-column:1/-1;justify-self:start}
.ph-form input::-webkit-outer-spin-button,.ph-form input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ph-switch{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer}
.ph-switch span{display:flex;flex-direction:column;gap:3px}
.ph-switch b{font:600 13.5px var(--ph-sans);color:var(--ph-ink)}
.ph-switch small{font:400 12px/1.5 var(--ph-sans);color:var(--ph-muted)}
.ph-switch input{position:absolute;opacity:0;pointer-events:none}
.ph-switch i{position:relative;flex:none;width:44px;height:26px;border-radius:999px;background:#cfccbf;transition:background .3s}
.ph-switch i::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 2px 5px rgba(0,0,0,.2);transition:transform .35s var(--ph-ease)}
.ph-switch input:checked+i{background:var(--ph-teal2)}
.ph-switch input:checked+i::after{transform:translateX(18px)}
.ph-switch input:focus-visible+i{outline:2px solid var(--ph-cyan);outline-offset:2px}

/* Toast & confetti */
.ph-toast{position:fixed;left:50%;bottom:28px;z-index:60;max-width:min(560px,calc(100vw - 32px));padding:12px 18px;border-radius:999px;background:#0a2740;color:#f1eee2;font:500 13px var(--ph-sans);box-shadow:0 18px 40px -16px rgba(4,24,43,.6);transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:transform .45s var(--ph-ease),opacity .3s}
.ph-toast.is-on{transform:translate(-50%,0);opacity:1}
.ph-toast.is-error{background:#7c2d12;border-radius:12px}
.ph-confetti{position:fixed;inset:0;z-index:55;pointer-events:none;overflow:hidden}
.ph-confetti i{position:absolute;top:-20px;left:var(--x);width:var(--s);height:var(--s);border-radius:50%;
  background:radial-gradient(circle at 33% 28%,#fff 0 12%,#f1ecdf 40%,#cfc6b1 100%);box-shadow:0 0 8px rgba(255,248,226,.6);
  animation:ph-fall 2.3s cubic-bezier(.3,.6,.4,1) var(--d) forwards}
@keyframes ph-fall{to{transform:translate(var(--r),105vh);opacity:.2}}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
  .ph-stats{grid-template-columns:repeat(2,auto);row-gap:18px}
  .ph-stats>div:nth-child(3){border-left:0;padding-left:0}
}
@media(max-width:860px){
  .ph-topbar-in{grid-template-columns:auto 1fr auto}
  .ph-tabs{justify-self:center}
  .ph-sec-head{flex-direction:column;gap:8px}
  .ph-sec-head h2{white-space:normal}
  .ph-prizes{grid-template-columns:1fr}
  .ph-prize{border-left:0;border-top:1px solid var(--ph-line);display:grid;grid-template-columns:120px 1fr;column-gap:20px;align-items:center;padding:22px}
  .ph-prize:first-child{border-top:0}
  .ph-prize-art{grid-row:1/span 3;height:100px;margin:0}
  .ph-prize-art svg{height:92px}
  .ph-prize h3{margin:8px 0 4px}
  .ph-steps,.ph-prize-cards{grid-template-columns:1fr}
  .ph-tracking{grid-template-columns:1fr}
  .ph-cover-moon{right:22px;top:150px;width:140px}
  .ph-pearl.is-xl{--size:100px}
}
@media(max-width:640px){
  /* two rows: logo + actions, then full-width tabs (three in one row pushed Close off-screen) */
  .ph-topbar-in{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"logo actions" "tabs tabs";row-gap:10px;padding:10px 16px}
  .ph-topbar-in>.ph-logo{grid-area:logo}
  .ph-topbar-in>.ph-tabs{grid-area:tabs;justify-self:stretch}
  .ph-topbar-in>.ph-topbar-actions{grid-area:actions}
  .ph-tabs button{flex:1 1 0;justify-content:center}
  .ph-logo{width:92px}
  .ph-tabs button{padding:0 11px;font-size:13px}
  .ph-topbar-actions .ph-btn span{display:none}
  .ph-topbar-actions .ph-btn{width:40px;padding:0}
  .ph-head-row{flex-direction:column;align-items:flex-start;gap:6px}
  .ph-teambar-in{flex-direction:column;align-items:flex-start}
  .ph-teambar-goal{text-align:left}
  .ph-podium{grid-template-columns:repeat(3,1fr);gap:8px}
  .ph-podium-name{font-size:16px}
  .ph-podium-prize{font-size:8px;letter-spacing:.1em;white-space:normal}
  .ph-podium-col[data-place="1"]{--h:130px}.ph-podium-col[data-place="2"]{--h:96px}.ph-podium-col[data-place="3"]{--h:72px}
  .ph-podium-step span{width:50px;height:50px;font-size:30px}
  .ph-jars{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:22px 8px}
  .ph-preview-stats{grid-template-columns:repeat(2,1fr)}
  .ph-form{grid-template-columns:1fr}
  .ph-cover-text{margin-top:200px}
}
@media(prefers-reduced-motion:reduce){
  #pearlHuntLaunch,#pearlHuntLaunch *,#pearlHuntLaunch::before,.pearl-overlay *,.pearl-overlay *::before,.pearl-overlay *::after{animation:none!important;transition:none!important}
  .pearl-overlay{scroll-behavior:auto}
  [data-reveal]{opacity:1;transform:none}
}

/* ---------- Admin settings tab (Dashboard → Settings → Pearl Hunt) ---------- */
.pearl-settings{font:500 13px Manrope,sans-serif;color:#213f51;display:grid;gap:23px}
.pearl-settings button{font-family:inherit;cursor:pointer}
.pearl-settings input,.pearl-settings select{height:39px;min-width:0;width:100%;border:1px solid #cdd6d2;border-radius:8px;padding:8px 11px;background:white;color:#103342;outline:none;font:500 13px Manrope,sans-serif}
.pearl-settings input:focus{border-color:#0a9e9f;box-shadow:0 0 0 3px rgba(24,155,155,.12)}
.pearl-settings-block{background:#fffefa;border:1px solid var(--border,#dcdcdc);border-radius:12px;padding:20px}
.pearl-settings-block h3{margin:0 0 8px;font:700 16px Manrope,sans-serif;color:#152537}
.pearl-settings-block p{margin:0 0 17px;font:500 12px/1.6 Manrope,sans-serif;color:#71808b}
.pearl-admin-switch{display:flex;gap:15px;align-items:center;justify-content:space-between}
.pearl-admin-switch input[type=checkbox]{width:43px;height:23px;accent-color:#068d8b;cursor:pointer;flex:none}

/* ---------- Personal access list (drawer + Settings tab) ---------- */
.pearl-access{font-family:'Jost',Manrope,system-ui,sans-serif;color:#0a1f33}
.pearl-access .pa-search{width:100%;height:38px;box-sizing:border-box;border:1px solid #dedbd0;border-radius:8px;padding:0 12px;background:#fff;font-size:13px;font-weight:400;font-family:inherit;color:#0a1f33;outline:none;margin:0 0 8px}
.pearl-access .pa-search:focus{border-color:#2797ad;box-shadow:0 0 0 3px rgba(39,151,173,.14)}
.pearl-access .pa-list{list-style:none;margin:0;padding:0;max-height:340px;overflow:auto;border:1px solid #e9e6dc;border-radius:8px;background:#fff}
.pearl-access .pa-list li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-top:1px solid #efece3}
.pearl-access .pa-list li:first-child{border-top:0}
.pearl-access .pa-who{min-width:0;display:flex;flex-direction:column}
.pearl-access .pa-who b{font-weight:500;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pearl-access .pa-who small{font-size:11px;color:#6b767c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pearl-access .pa-chips{display:flex;gap:6px;flex:none}
.pearl-access .pa-chip{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 11px;border-radius:999px;border:1px solid #d6d2c4;background:#faf9f4;color:#56626a;font-size:12px;font-weight:500;line-height:1;font-family:inherit;cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.pearl-access button.pa-chip:hover{border-color:#2797ad;color:#0a1f33;transform:translateY(-1px)}
.pearl-access .pa-chip.is-on{background:#0f6c66;border-color:#0f6c66;color:#fff}
.pearl-access .pa-chip.is-locked{cursor:default;background:#e5efed;border-color:#cfe1de;color:#0b5a55}
.pearl-access .pa-chip small{font-size:10px;opacity:.75}
.pearl-access .pa-chip.is-busy{opacity:.5}
.pearl-access .pa-empty{padding:14px 12px;color:#6b767c;font-size:12.5px;justify-content:flex-start}
.ph-card-note{margin:-4px 0 12px;font:400 12.5px/1.5 var(--ph-sans);color:var(--ph-muted)}

/* ================================================================
   Own jar highlight, "+" on hover, add-figures form and calendar
   ================================================================ */
.ph-jar-card{position:relative}
.ph-jar-card.is-me{background:linear-gradient(180deg,#fff,#fbfaf5);box-shadow:0 0 0 1.5px rgba(39,151,173,.55),0 0 0 6px rgba(39,151,173,.08),0 18px 34px -20px rgba(4,24,43,.55)}
.ph-jar-card.is-me::before{content:'';position:absolute;inset:-1.5px;border-radius:7px;pointer-events:none;
  background:conic-gradient(from var(--ph-spin,0deg),transparent 0 70%,rgba(226,201,131,.95) 82%,rgba(79,185,199,.9) 90%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1.5px;
  animation:ph-me-spin 5s linear infinite}
@property --ph-spin{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes ph-me-spin{to{--ph-spin:360deg}}
.ph-jar-card.is-me .ph-jar-glass{border-color:#5fb6c4;box-shadow:inset 0 -6px 12px rgba(4,24,43,.05),0 0 0 3px rgba(79,185,199,.18),0 10px 20px -12px rgba(15,108,102,.6)}
.ph-jar-card.is-me .ph-jar-name{font-weight:600}
.ph-jar-card.is-me .ph-jar-name::after{content:'Your jar';background:linear-gradient(135deg,#2797ad,#0f6c66)}
.ph-jar-card.is-me:hover{background:#fff}

.ph-jar-add{position:absolute;inset:0;z-index:6;display:grid;place-items:center;padding:0;border:0;background:none;cursor:pointer;border-radius:10px 10px 30px 30px;-webkit-tap-highlight-color:transparent}
.ph-jar-add>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;color:#1c1606;
  background:linear-gradient(135deg,#f6e6b6,#d4b265 60%,#b8923f);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 0 0 4px rgba(255,255,255,.65),0 10px 22px -8px rgba(120,88,20,.75);
  opacity:0;transform:scale(.4) rotate(-90deg);transition:opacity .25s ease,transform .45s cubic-bezier(.3,1.5,.5,1)}
.ph-jar-card.is-addable:hover .ph-jar-add>span,.ph-jar-add:focus-visible>span{opacity:1;transform:scale(1) rotate(0)}
.ph-jar-add:hover>span{transform:scale(1.08) rotate(0)!important}
.ph-jar-add:active>span{transform:scale(.94)!important}
.ph-jar-add:focus-visible{outline:2px solid var(--ph-cyan);outline-offset:3px}
.ph-jar-card.is-addable{cursor:default}
.ph-jar-card.is-addable:hover .ph-jar-glass{filter:saturate(1.05) brightness(1.02)}
@media (hover:none){.ph-jar-card.is-addable .ph-jar-add>span{opacity:.92;transform:scale(.78)}}
.ph-jar-card.is-added .ph-jar-glass{animation:ph-added 1.1s var(--ph-ease)}
@keyframes ph-added{0%{box-shadow:0 0 0 0 rgba(226,201,131,.9)}60%{box-shadow:0 0 0 14px rgba(226,201,131,0)}100%{box-shadow:0 0 0 0 rgba(226,201,131,0)}}

/* Modal */
.ph-modal-scrim{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:20px;background:rgba(4,24,43,.38);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:0;transition:opacity .25s ease;overflow:auto}
.ph-modal-scrim.is-on{opacity:1}
.ph-modal{position:relative;width:min(460px,100%);border-radius:22px;background:var(--ph-paper);color:var(--ph-ink);
  box-shadow:0 0 0 1px rgba(255,255,255,.6) inset,0 40px 80px -30px rgba(4,24,43,.65),0 0 0 1px rgba(4,24,43,.06);
  transform:translate(var(--from-x,0),var(--from-y,0)) scale(.6);opacity:0;transition:transform .42s cubic-bezier(.2,.9,.25,1.05),opacity .25s ease}
.ph-modal-scrim.is-on .ph-modal{transform:none;opacity:1}
.ph-modal-head{position:relative;display:flex;align-items:center;gap:14px;padding:22px 22px 18px;border-radius:22px 22px 0 0;color:#f3efe2;
  background:radial-gradient(120% 160% at 0% 0%,rgba(255,255,255,.14),transparent 50%),linear-gradient(120deg,#071a2c,#0a3046 50%,#0b5654);overflow:hidden}
.ph-modal-head::after{content:'';position:absolute;right:-40px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(226,201,131,.28),transparent 65%);pointer-events:none}
.ph-modal-head>div{flex:1;min-width:0}
.ph-modal-head .ph-eyebrow{color:#e2c983;margin:0 0 2px}
.ph-modal-head h2{margin:0;font:500 26px/1.15 var(--ph-serif);color:#fbf8ee;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-modal-head .ph-close{flex:none;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);color:#eef2f0;position:relative;z-index:1}
.ph-modal-head .ph-close:hover{background:rgba(255,255,255,.16)}
.ph-modal-pearl{flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(226,201,131,.35)}

.ph-entry{display:flex;flex-direction:column;gap:16px;padding:22px}
.ph-field{display:flex;flex-direction:column;gap:7px;min-width:0;position:relative}
.ph-field-label{font:600 10.5px var(--ph-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ph-muted)}
.ph-field-label em{font-style:normal;font-weight:400;letter-spacing:.04em;text-transform:none;color:var(--ph-muted2);margin-left:4px}
.ph-field small{font:400 11.5px/1.4 var(--ph-sans);color:var(--ph-muted2)}
.ph-money{display:flex;align-items:center;height:62px;padding:0 16px;border:1px solid var(--ph-line);border-radius:14px;background:#fff;transition:border-color .2s,box-shadow .2s}
.ph-money:focus-within{border-color:var(--ph-cyan);box-shadow:0 0 0 4px rgba(39,151,173,.13)}
.ph-money i{font:500 30px/1 var(--ph-serif);font-style:normal;color:var(--ph-gold);margin-right:6px}
.ph-money input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;padding:0;font:600 30px/1 var(--ph-serif);color:var(--ph-ink);font-variant-numeric:lining-nums tabular-nums}
.ph-money input::placeholder{color:#c9c6ba}
.ph-money em{font:600 10.5px var(--ph-sans);letter-spacing:.16em;color:var(--ph-muted2);font-style:normal}
.ph-entry-row{display:grid;grid-template-columns:132px 1fr;gap:14px;align-items:start}
.ph-stepper{display:flex;align-items:center;height:46px;border:1px solid var(--ph-line);border-radius:12px;background:#fff;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.ph-stepper:focus-within{border-color:var(--ph-cyan);box-shadow:0 0 0 4px rgba(39,151,173,.13)}
.ph-stepper input{flex:1;min-width:0;width:100%;height:100%;border:0;outline:0;background:none;text-align:center;font:600 16px var(--ph-sans);color:var(--ph-ink);padding:0}
.ph-stepper input::placeholder{color:#c3c0b4;font-weight:400}
.ph-stepper button{flex:none;width:34px;height:100%;border:0;background:#f6f4ec;color:var(--ph-ink2);font:400 18px/1 var(--ph-sans);cursor:pointer;transition:background .15s}
.ph-stepper button:hover{background:#ebe8dd}
.ph-datefield{display:flex;gap:8px}
.ph-date-btn{flex:1;min-width:0;display:flex;align-items:center;gap:9px;height:46px;padding:0 12px;border:1px solid var(--ph-line);border-radius:12px;background:#fff;color:var(--ph-ink);cursor:pointer;text-align:left;transition:border-color .2s,box-shadow .2s}
.ph-date-btn svg:first-child{flex:none;color:var(--ph-teal2)}
.ph-date-btn svg:last-child{flex:none;margin-left:auto;color:var(--ph-muted2);transition:transform .25s}
.ph-date-btn[aria-expanded="true"]{border-color:var(--ph-cyan);box-shadow:0 0 0 4px rgba(39,151,173,.13)}
.ph-date-btn[aria-expanded="true"] svg:last-child{transform:rotate(180deg)}
.ph-date-btn b{font:500 13.5px var(--ph-sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-date-btn.is-empty b{color:var(--ph-muted2);font-weight:400}
.ph-date-btn.is-flash{animation:ph-date-flash .7s ease}
@keyframes ph-date-flash{0%{background:#fff6dc}100%{background:#fff}}
.ph-today{flex:none;height:46px;padding:0 15px;border:1px solid rgba(15,108,102,.3);border-radius:12px;background:#e9f3f1;color:#0b5a55;font:600 12.5px var(--ph-sans);letter-spacing:.02em;cursor:pointer;transition:background .2s,transform .2s}
.ph-today:hover{background:#dcece9;transform:translateY(-1px)}
.ph-today:active{transform:scale(.97)}

.ph-cal{position:absolute;right:0;top:calc(100% + 8px);z-index:5;width:292px;padding:14px;border-radius:16px;background:#fff;
  box-shadow:0 0 0 1px rgba(4,24,43,.07),0 24px 50px -18px rgba(4,24,43,.5);transform-origin:top right;transform:translateY(-6px) scale(.96);opacity:0;transition:transform .22s var(--ph-ease),opacity .18s}
.ph-cal.is-on{transform:none;opacity:1}
.ph-cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.ph-cal-head b{font:600 19px var(--ph-serif);color:var(--ph-ink)}
.ph-cal-head button{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:#f4f2ea;color:var(--ph-ink2);cursor:pointer;transition:background .15s}
.ph-cal-head button:hover:not(:disabled){background:#e8e5da}
.ph-cal-head button:disabled{opacity:.3;cursor:default}
.ph-cal-week,.ph-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.ph-cal-week span{text-align:center;font:600 9.5px/26px var(--ph-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ph-muted2)}
.ph-cal-grid.is-next{animation:ph-cal-in-r .25s var(--ph-ease)}
.ph-cal-grid.is-prev{animation:ph-cal-in-l .25s var(--ph-ease)}
@keyframes ph-cal-in-r{from{opacity:0;transform:translateX(14px)}}
@keyframes ph-cal-in-l{from{opacity:0;transform:translateX(-14px)}}
.ph-cal-grid button{position:relative;height:36px;border:0;border-radius:10px;background:none;color:var(--ph-ink);font:500 13px var(--ph-sans);font-variant-numeric:tabular-nums;cursor:pointer;transition:background .15s,color .15s}
.ph-cal-grid button:hover:not(:disabled){background:#eef5f4}
.ph-cal-grid button:focus-visible{outline:2px solid var(--ph-cyan);outline-offset:-2px}
.ph-cal-grid button.is-today{box-shadow:inset 0 0 0 1.5px var(--ph-gold2);font-weight:700}
.ph-cal-grid button.is-sel{background:linear-gradient(135deg,#0f6c66,#0a4c47);color:#fff;font-weight:600;box-shadow:0 6px 14px -8px rgba(10,76,71,.9)}
.ph-cal-grid button:disabled{color:#cfccc2;cursor:default}
.ph-cal-foot{display:flex;align-items:center;justify-content:space-between;margin-top:10px;padding-top:10px;border-top:1px solid #efece3;font:400 11px var(--ph-sans);color:var(--ph-muted2)}
.ph-cal-foot button{border:0;background:none;color:var(--ph-teal2);font:600 12px var(--ph-sans);cursor:pointer;padding:4px 6px;border-radius:6px}
.ph-cal-foot button:hover{background:#eef5f4}

.ph-note{display:flex;align-items:flex-start;gap:9px;padding:10px 12px;border-radius:11px;font:400 12.5px/1.45 var(--ph-sans);transition:opacity .25s,max-height .3s,padding .3s,margin .3s;max-height:80px;overflow:hidden}
.ph-note svg{flex:none;margin-top:1px}
.ph-note.is-warn{background:#fbf3dd;color:#6b5418;box-shadow:inset 0 0 0 1px rgba(185,151,63,.25)}
.ph-note.is-warn svg{color:#b9973f}
.ph-note.is-hidden{opacity:0;max-height:0;padding-top:0;padding-bottom:0;margin-top:-16px}
.ph-note.is-error{background:#fbe9e5;color:#8a2b1c;box-shadow:inset 0 0 0 1px rgba(176,64,40,.22)}
.ph-entry-foot{display:flex;justify-content:flex-end;gap:10px;margin-top:2px}
.ph-btn-quiet{background:transparent;color:var(--ph-muted);box-shadow:inset 0 0 0 1px var(--ph-line)}
.ph-btn-quiet:hover{background:#f1efe6;color:var(--ph-ink)}
.ph-entry-foot .ph-btn-gold{min-width:160px;height:44px}

.ph-entry-log{padding:0 22px 20px}
.ph-entry-log h3{margin:0 0 8px;padding-top:16px;border-top:1px solid var(--ph-line2);font:600 10.5px var(--ph-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--ph-muted)}
.ph-entry-log ul{list-style:none;margin:0;padding:0;max-height:190px;overflow:auto}
.ph-entry-log li{display:grid;grid-template-columns:62px 1fr auto 70px;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px dashed #e7e3d8;font:400 12.5px var(--ph-sans)}
.ph-entry-log li:last-child{border-bottom:0}
.ph-log-day{color:var(--ph-muted)}
.ph-entry-log li b{font:600 16px var(--ph-serif);color:var(--ph-ink)}
.ph-log-deals{color:var(--ph-muted2);font-size:11.5px}
.ph-log-deals em{font-style:normal;margin-left:4px;padding:0 5px;border-radius:999px;background:#f4ecd5;color:#7a601d;font-size:9.5px;letter-spacing:.06em;text-transform:uppercase}
.ph-log-del{justify-self:end;display:grid;place-items:center;height:28px;min-width:28px;padding:0 6px;border:0;border-radius:8px;background:none;color:var(--ph-muted2);font:600 11px var(--ph-sans);cursor:pointer;transition:background .15s,color .15s}
.ph-log-del:hover{background:#fbe9e5;color:#a33a24}
.ph-log-del.is-confirm{background:#a33a24;color:#fff;padding:0 10px}

@media (max-width:520px){
  .ph-modal-scrim{place-items:end center;padding:0}
  .ph-modal{width:100%;border-radius:22px 22px 0 0;transform:translateY(100%)}
  .ph-entry-row{grid-template-columns:1fr}
  .ph-cal{left:0;right:auto;width:100%;box-sizing:border-box}
  .ph-entry-foot .ph-btn{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .ph-jar-card.is-me::before{animation:none}
  .ph-modal,.ph-cal,.ph-jar-add>span{transition:none}
}

/* Jar picker in the access list */
.pearl-access .pa-list li{flex-wrap:wrap}
.pearl-access .pa-chips{flex-wrap:wrap;justify-content:flex-end}
.pearl-access .pa-jar{position:relative;display:inline-flex;align-items:center;height:28px;border-radius:999px;border:1px solid #d6d2c4;background:#faf9f4;padding:0 0 0 10px;transition:border-color .2s,background .2s}
.pearl-access .pa-jar:hover{border-color:#2797ad}
.pearl-access .pa-jar.is-set{background:#fbf5e3;border-color:#e2c983}
.pearl-access .pa-jar-dot{width:9px;height:9px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#fff,#e7e2d2 55%,#b9b19a)}
.pearl-access .pa-jar.is-set .pa-jar-dot{box-shadow:0 0 0 2px rgba(226,201,131,.45)}
.pearl-access .pa-jar select{appearance:none;-webkit-appearance:none;border:0;outline:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2356626a' stroke-width='2.4'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
  height:26px;max-width:190px;padding:0 26px 0 7px;font:500 12px 'Jost',Manrope,system-ui,sans-serif;color:#0a1f33;cursor:pointer;text-overflow:ellipsis}
.ph-modal-scrim{grid-template-columns:minmax(0,1fr);justify-items:center}
.ph-modal{min-width:0;box-sizing:border-box}
.ph-jar-card.is-me .ph-jar-name::after{position:absolute;top:-10px;left:50%;transform:translateX(-50%);margin:0;padding:2px 9px;white-space:nowrap;box-shadow:0 4px 10px -4px rgba(15,108,102,.7);z-index:7}
@media (max-width:520px){
  .ph-cal{position:relative;top:auto;right:auto;margin-top:8px;transform-origin:top center}
  .ph-modal{max-height:calc(100dvh - 24px);overflow:auto}
}
.pearl-access .pa-list li.is-saving .pa-chips{opacity:.6;pointer-events:none}
.pearl-access .pa-list li.is-saving .pa-who b::after{content:'';display:inline-block;width:10px;height:10px;margin-left:7px;border-radius:50%;border:2px solid #cfe1de;border-top-color:#0f6c66;animation:pl-spin .7s linear infinite;vertical-align:-1px}

/* Booking numbers in the add-figures form */
.ph-refs{display:flex;flex-direction:column;gap:7px}
.ph-ref{display:flex;align-items:center;gap:0;height:44px;border:1px solid var(--ph-line);border-radius:12px;background:#fff;overflow:hidden;transition:border-color .2s,box-shadow .2s;animation:ph-ref-in .25s var(--ph-ease)}
@keyframes ph-ref-in{from{opacity:0;transform:translateY(-4px)}}
.ph-ref:focus-within{border-color:var(--ph-cyan);box-shadow:0 0 0 4px rgba(39,151,173,.13)}
.ph-ref-n{flex:none;display:grid;place-items:center;width:38px;height:100%;background:#f6f4ec;color:var(--ph-muted);font:600 12px var(--ph-sans);border-right:1px solid var(--ph-line2)}
.ph-ref input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;padding:0 12px;font:500 14px var(--ph-sans);color:var(--ph-ink);letter-spacing:.02em}
.ph-ref input::placeholder{color:#c3c0b4;font-weight:400}
.ph-ref-del{flex:none;display:grid;place-items:center;width:36px;height:100%;border:0;background:none;color:var(--ph-muted2);cursor:pointer;transition:color .15s,background .15s}
.ph-ref-del:hover{color:#a33a24;background:#fbe9e5}
.ph-refs .ph-ref:only-child .ph-ref-del{visibility:hidden}
.ph-ref-add{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px 0 9px;border:1px dashed rgba(15,108,102,.45);border-radius:999px;background:#f2f8f7;color:#0b5a55;font:600 12px var(--ph-sans);cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.ph-ref-add:hover{background:#e3f0ee;border-style:solid}
.ph-ref-add:active{transform:scale(.97)}
.ph-ref-add[hidden]{display:none}

/* Booking chips (entry log + reviewer list) */
.ph-refchips,.ph-mrow-refs{display:inline-flex;flex-wrap:wrap;gap:4px;min-width:0}
.ph-refchips i,.ph-mrow-refs i{font-style:normal;font:600 10.5px/1 var(--ph-sans);letter-spacing:.03em;padding:4px 7px;border-radius:6px;background:#eef3f2;color:#30625e;white-space:nowrap}
.ph-refchips i.more{background:#f1efe6;color:var(--ph-muted)}
.ph-mrow-refs i.hit{background:#fbe8b0;color:#5c4510}
.ph-entry-log li{grid-template-columns:56px minmax(0,1fr) auto 70px}
.ph-log-main{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:wrap}

/* "Added by managers" card in the settings drawer */
.ph-card-count{font:600 11.5px var(--ph-sans);color:var(--ph-muted);background:#f1efe6;padding:3px 9px;border-radius:999px}
.ph-manual-tools{display:flex;gap:8px;margin-bottom:10px}
.ph-manual-tools select,.ph-manual-tools input{height:36px;border:1px solid var(--ph-line);border-radius:9px;background:#fff;padding:0 10px;font:500 12.5px var(--ph-sans);color:var(--ph-ink);outline:none;min-width:0}
.ph-manual-tools select{flex:0 1 48%}
.ph-manual-tools input{flex:1}
.ph-manual-tools select:focus,.ph-manual-tools input:focus{border-color:var(--ph-cyan);box-shadow:0 0 0 3px rgba(39,151,173,.14)}
.ph-manual{list-style:none;margin:0;padding:0;max-height:420px;overflow:auto;border:1px solid var(--ph-line2);border-radius:12px;background:#fff}
.ph-manual li.is-empty{padding:16px;color:var(--ph-muted);font:400 12.5px var(--ph-sans);text-align:center}
.ph-mrow{padding:10px 12px;border-top:1px solid #f0ede4;display:flex;flex-direction:column;gap:5px}
.ph-mrow:first-child{border-top:0}
.ph-mrow-top{display:flex;align-items:center;gap:10px;min-width:0}
.ph-mrow-amt{font:600 17px var(--ph-serif);color:var(--ph-ink)}
.ph-mrow-who{flex:1;min-width:0;font:500 12.5px var(--ph-sans);color:var(--ph-ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph-mrow-day{font:500 11.5px var(--ph-sans);color:var(--ph-muted)}
.ph-mrow .ph-log-del{height:26px}
.ph-mrow-refs em{font:italic 400 11.5px var(--ph-sans);color:#a05a2c}
.ph-mrow-meta{font:400 11px var(--ph-sans);color:var(--ph-muted2)}
.ph-manual-more{margin-top:8px}
.pearl-access .pa-list li{flex-wrap:wrap;row-gap:8px}
.pearl-access .pa-chips{flex:1 1 auto;flex-wrap:wrap;justify-content:flex-end;min-width:0}
.ph-drawer .pearl-access .pa-chips{flex-basis:100%;justify-content:flex-start}

/* Launcher collapses to the pearl orb on phones */
@media(max-width:760px){#pearlHuntLaunch{padding:0 7px}#pearlHuntLaunch .pl-text,#pearlHuntLaunch .pl-arrow{display:none}}