/* ProfPass 3.0 — Apple/Linear restrained finish */
:root{--bg:#F5F5F7;--surface:#fff;--raised:#EEEFF2;--ink:#1D1B1E;--muted:#7D7980;--line:#E6E3E7;--accent:#8B0E2E;--soft:#F7E9EE;--good:#2A825E;--edge:#fff;--status-bg:#F5F5F7;--ease:cubic-bezier(.22,1,.36,1)}
:root[data-theme=dark]{--bg:#1A0F14;--surface:#251C23;--raised:#30252D;--ink:#F5F5F7;--muted:#A99BA5;--line:#49343F;--accent:#ED7795;--soft:#492634;--good:#79C7A0;--edge:#ffffff16;--status-bg:#1A0F14;--shadow:0 10px 30px #05020529}
body{background:var(--bg);color:var(--ink)}
.brand img{object-fit:cover}
.topbar{background:color-mix(in srgb,var(--bg) 91%,transparent);-webkit-backdrop-filter:blur(23px) saturate(1.25);backdrop-filter:blur(23px) saturate(1.25)}
.nav-thumb{will-change:transform}
:root[data-theme=dark] .nav-thumb{background:linear-gradient(155deg,#4A2939,#2C222B);box-shadow:inset 0 1px 1px #ffffff18,0 5px 15px #0004}
:root[data-theme=dark] .sidebar{background:color-mix(in srgb,#251c23 88%,transparent);border-color:#ffffff16}
:root[data-theme=dark] .sidebar .nav button.active{color:#FFC3D0}
:root[data-theme=dark] .primary{background:linear-gradient(115deg,#BB234B,#850D2E);color:white;border-color:#EE6D8730}
:root[data-theme=dark] .eyebrow{color:#D8A2B7}
:root[data-theme=dark] .status-dot{box-shadow:0 0 0 2px #251c23}
:root[data-theme=dark] dialog{background:#261D24;color:#f5f5f7}
:root[data-theme=dark] input,:root[data-theme=dark] textarea,:root[data-theme=dark] select{color:#f5f5f7}
:root[data-theme=dark] .toast{background:#30252D}
button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
button:active{transform:scale(.985)}
button:focus-visible{outline:2px solid #E03B64;outline-offset:3px}
.pp-identity-area{min-width:0;width:100%;position:relative}
.pp-pass{display:block;position:relative;width:100%;aspect-ratio:1.85/1;padding:0;margin:0;color:white!important;border:0!important;border-radius:22px;background:transparent;perspective:1300px;-webkit-perspective:1300px;text-align:left;cursor:pointer;transform:none!important;isolation:isolate}
.pp-pass-rotor{display:block;position:relative;width:100%;height:100%;transform-style:preserve-3d;-webkit-transform-style:preserve-3d;transition:transform .56s cubic-bezier(.2,.7,.15,1)}
.pp-pass.is-flipped .pp-pass-rotor{transform:rotateY(180deg);-webkit-transform:rotateY(180deg)}
.pp-pass-face{position:absolute;inset:0;display:block;overflow:hidden;border-radius:22px;padding:22px 25px;background:radial-gradient(ellipse at 90% 80%,#7B2844 0%,transparent 62%),linear-gradient(132deg,#350E1F 0%,#59152E 55%,#210D19 100%);box-shadow:inset 0 1px 1px #ffffff44,inset 0 -1px 0 #d7465e35,0 15px 35px #3a112344;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(1px);-webkit-transform:translateZ(1px);border:1px solid #F38BAB27}
.pp-face-back{transform:rotateY(180deg) translateZ(1px);-webkit-transform:rotateY(180deg) translateZ(1px);background:radial-gradient(ellipse at 12% 120%,#8B0E2E 0%,transparent 59%),linear-gradient(140deg,#220C17,#431427 68%,#1F1019)}
.pp-card-pattern{pointer-events:none;position:absolute;inset:0;background:repeating-linear-gradient(142deg,transparent,transparent 38px,#ffffff04 39px,transparent 40px);opacity:.6}
.pp-card-pattern:after{content:"";position:absolute;width:78%;height:70%;border:1px solid #ffffff12;border-radius:100%;transform:rotate(-18deg);right:-40%;bottom:-38%;box-shadow:0 0 0 26px #ffffff04,0 0 0 48px #ffffff04}
.pp-pass-brand{position:relative;display:flex;align-items:center;gap:9px;z-index:2;color:#fff;white-space:nowrap;max-width:100%}
.pp-monogram{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:31px;height:31px;border-radius:9px;font-size:19px;line-height:1;font-weight:800;letter-spacing:-4px;background:#fff;box-shadow:0 1px 2px #1a0f1466;color:#8B0E2E;padding-right:3px;font-style:normal}
.pp-monogram span{font-size:12px;letter-spacing:-2px;transform:translate(-1px,3px)}
.pp-pass-brand strong{font-size:1rem;letter-spacing:-.6px;font-weight:760}
.pp-pass-org{font-size:.55rem;letter-spacing:.06em;margin-left:auto;color:#F5DCE4;max-width:35%;overflow:hidden;text-overflow:ellipsis}
.pp-pass-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;position:absolute;top:32%;left:25px;right:33%;font-weight:750;font-size:clamp(1.1rem,2.2vw,1.53rem);line-height:1.12;letter-spacing:-.045em;z-index:2}
.pp-pass-balance-caption{position:absolute;bottom:31%;left:25px;font-size:.54rem;letter-spacing:.13em;color:#F1C5D5;z-index:2}
.pp-pass-balance{position:absolute;bottom:14%;left:25px;display:flex;align-items:center;gap:8px;z-index:2}
.pp-pass-balance b{font-size:clamp(1.7rem,3.4vw,2.45rem);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.04em}
.pp-pass-balance small{font-size:.66rem;color:#F7D4DF;font-weight:640;align-self:flex-end;padding-bottom:3px}
.pp-coin-symbol{display:inline-block;width:19px;height:19px;vertical-align:middle;flex-shrink:0;object-fit:contain}
.pp-pass-balance .pp-coin-symbol{width:24px;height:24px}
.pp-card-shark{position:absolute;bottom:-3px;right:1%;height:82%;max-width:37%;object-fit:contain;object-position:center bottom;image-rendering:pixelated;z-index:1;filter:drop-shadow(1px 5px 5px #140a14aa);pointer-events:none}
.pp-flip-hint{display:flex;align-items:center;gap:4px;position:absolute;right:18px;top:54px;font-size:.54rem;color:#FFE5EDc5;z-index:3}
.pp-flip-hint .icon{width:13px;height:13px}
.pp-face-back .pp-flip-hint{top:auto;bottom:14px;right:20px}
.pp-pass-data{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;position:absolute;left:25px;right:25px;top:32%;z-index:2}
.pp-pass-data>span{min-width:0;display:flex;flex-direction:column;gap:3px}
.pp-pass-data small{font-size:.51rem;letter-spacing:.11em;color:#D8A9BA}
.pp-pass-data strong{font-size:.79rem;font-weight:700;line-height:1.3;overflow-wrap:anywhere}
.pp-pass-data .pp-wide{grid-column:1/-1;max-width:83%}
.pp-back-watermark{position:absolute;right:-12px;bottom:-35px;font-size:10rem;font-weight:900;letter-spacing:-.19em;color:#ffffff09;pointer-events:none}
.pp-pass-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 3px 3px;font-size:.65rem;color:var(--muted)}
.pp-pass-footer span,.pp-pass-footer button{display:inline-flex;align-items:center;gap:6px}
.pp-pass-footer button{border:0;background:none;padding:5px 0;color:var(--accent);font-size:inherit;font-weight:650}
.pp-pass-footer .icon{height:15px;width:15px}
.pp-community-balance{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:9px;padding:12px 13px;border-radius:13px;border:1px solid var(--line);background:var(--surface)}
.pp-community-balance>span{display:flex;gap:8px;align-items:center;font-size:.7rem;color:var(--muted)}
.pp-community-balance .icon{width:18px;height:18px}
.pp-community-balance strong{font-size:.9rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.pp-community-balance small{font-size:.6rem;font-weight:500}
.event-reward .pp-coin-symbol,.event-meta .pp-coin-symbol{width:14px;height:14px;margin-right:4px}
.transaction-icon{flex-shrink:0}
.transaction-icon .pp-coin-symbol{width:19px;height:19px}
.pp-small-coin{display:inline-flex;align-items:center;gap:3px}
.pp-small-coin .pp-coin-symbol{width:12px;height:12px}
.pp-shark-station{position:relative;display:block;clear:both;max-width:100%;margin:29px 0 15px;padding:11px 16px 14px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,color-mix(in srgb,var(--surface) 98%,var(--soft)),var(--surface));box-shadow:var(--shadow);overflow:hidden}
.pp-shark-stage{display:flex;align-items:center;gap:11px;min-height:72px}
.pp-shark-avatar{border:0;background:transparent;display:block;width:71px;height:77px;flex:0 0 71px;padding:0;position:relative;transform:none!important;--shark-drift:0px}
.pp-shark-sprite{position:relative;display:block;width:70.56px;height:74.48px;background-repeat:no-repeat;image-rendering:pixelated;transform:translateX(var(--shark-drift));transition:transform .15s linear;filter:drop-shadow(0 3px 3px #18091824)}
.pp-shark-station-name{display:flex;flex-direction:column;flex:1;gap:4px;min-width:0}
.pp-shark-station-name b{font-size:1rem;letter-spacing:-.025em}
.pp-shark-station-name small{color:var(--muted);font-size:.65rem}
.pp-shark-trigger{display:flex;align-items:center;gap:5px;border:1px solid var(--line);background:var(--raised);color:var(--ink);border-radius:16px;padding:9px 10px;font-size:.67rem;font-weight:650;white-space:nowrap}
.pp-shark-trigger .icon{width:13px;height:13px;transform:rotate(90deg)}
.pp-shark-message{margin-top:10px;padding:18px;border-radius:15px;background:color-mix(in srgb,var(--raised) 53%,var(--surface));border:1px solid var(--edge);animation:pp-in .25s var(--ease) both}
.pp-guide-eyebrow{font-size:.55rem;letter-spacing:.16em;color:var(--accent);font-weight:730}
.pp-shark-message h3{font-size:1.04rem;letter-spacing:-.025em;line-height:1.3;margin:10px 0 8px}
.pp-shark-message p{font-size:.77rem;line-height:1.6;color:var(--muted);max-width:520px}
.pp-shark-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px}
.pp-guide-primary,.pp-guide-neutral{min-height:35px;padding:8px 13px;border-radius:12px;font-size:.71rem;font-weight:700;border:1px solid transparent;display:inline-flex;align-items:center;gap:8px}
.pp-guide-primary{color:white;background:#A51B42}
.pp-guide-primary .icon{width:14px;height:14px}
.pp-guide-neutral{color:var(--muted);background:transparent;border-color:var(--line)}
.pp-mascot-preference{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:15px;padding:13px 16px;margin-bottom:14px;background:var(--surface)}
.pp-mascot-preference span{display:flex;flex-direction:column;gap:3px}
.pp-mascot-preference b{font-size:.84rem}
.pp-mascot-preference small{font-size:.65rem;color:var(--muted)}
.pp-mascot-preference button{border:1px solid var(--line);border-radius:14px;background:var(--raised);color:var(--accent);font-size:.69rem;white-space:nowrap;padding:9px 12px}
@keyframes pp-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.view-home>.home-greeting,.dashboard-top,.dashboard-bottom,.event-card,.request-card{animation:pp-in .35s var(--ease) both}
.dashboard-bottom{animation-delay:.06s}
@media(min-width:761px){.pp-pass{aspect-ratio:1.88/1}.pp-pass-face{padding:25px 28px}.pp-pass-name{left:28px;right:31%}.pp-pass-balance,.pp-pass-balance-caption{left:28px}.pp-pass-data{left:28px;right:28px}.pp-shark-station{max-width:650px}.pp-mascot-preference{max-width:720px}}
@media(max-width:760px){.pp-pass{aspect-ratio:1.69/1;border-radius:20px}.pp-pass-face{padding:17px 18px;border-radius:20px}.pp-pass-brand strong{font-size:.87rem}.pp-pass-org{font-size:.47rem;max-width:36%}.pp-monogram{width:28px;height:28px;font-size:16px}.pp-pass-name{top:33%;left:18px;right:30%;font-size:clamp(.99rem,3.9vw,1.24rem)}.pp-pass-balance-caption{left:18px;bottom:29%;font-size:.46rem}.pp-pass-balance{left:18px;bottom:12%}.pp-pass-balance b{font-size:clamp(1.5rem,7vw,2rem)}.pp-card-shark{height:74%;right:-3px;max-width:38%}.pp-flip-hint{top:52px;right:12px;font-size:.46rem}.pp-pass-data{left:18px;right:18px;top:33%;gap:8px}.pp-pass-data small{font-size:.43rem}.pp-pass-data strong{font-size:.7rem}.pp-pass-footer{padding:10px 2px 0;font-size:.59rem}.pp-shark-station{margin-top:21px}.pp-community-balance{font-size:.62rem}.sidebar{border-radius:29px}.nav button{border-radius:26px}}
@media(max-width:380px){.pp-pass-org{display:none}.pp-pass-name{font-size:.98rem}.pp-pass-balance b{font-size:1.53rem}.pp-pass-balance .pp-coin-symbol{width:20px;height:20px}.pp-shark-station{padding:8px 10px}.pp-shark-message{padding:14px}.pp-shark-trigger{padding:9px 8px}.pp-pass-data strong{font-size:.65rem}}
:root[data-motion=reduced] .pp-pass-rotor,:root[data-motion=reduced] .pp-shark-sprite{transition:none!important}
@media(prefers-reduced-motion:reduce){.pp-pass-rotor,.pp-shark-sprite{transition:none!important}.view-home>.home-greeting,.dashboard-top,.dashboard-bottom,.event-card,.request-card,.pp-shark-message{animation:none!important}}

/* Confirm only a real, observed positive balance change. */
.pp-coin-award{position:fixed;top:calc(75px + env(safe-area-inset-top));right:20px;z-index:1500;pointer-events:none;display:flex;align-items:center;gap:8px;background:#25101b;color:#fff;border:1px solid #ed6c9177;box-shadow:0 12px 35px #17031055;border-radius:16px;padding:12px 15px;font-size:.9rem;font-weight:750;animation:pp-award 2.4s ease both}
.pp-coin-award img{height:25px;width:25px}
@keyframes pp-award{0%{opacity:0;transform:translateY(-12px) scale(.94)}12%,80%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-7px) scale(.98)}}
dialog[open]{animation:pp-dialog-in .25s var(--ease) both}
@keyframes pp-dialog-in{from{opacity:0;transform:translateY(15px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.pp-coin-award,dialog[open]{animation:none!important}}
:root[data-motion=reduced] .pp-coin-award,:root[data-motion=reduced] dialog[open]{animation:none!important}