:root{font-family:Inter,-apple-system,BlinkMacSystemFont,"Noto Sans TC","Microsoft JhengHei",Arial,sans-serif;color:#fffafc;background:#121024;--pink:#ff5e9b;--pink-soft:#ff98b8;--purple:#9962ee;--mint:#75e5cb;--dark:#1b172e;--muted:#bcb4cf;--white:#fffbff;font-synthesis:none;-webkit-tap-highlight-color:transparent}
*{box-sizing:border-box}html{min-height:100%;scrollbar-color:#634362 #171024}body{min-height:100dvh;margin:0;overflow-x:hidden;background:radial-gradient(circle at 4% 29%,#342045 0,transparent 38%),radial-gradient(circle at 95% 94%,#2b244f 0,transparent 45%),#121024}button{font:inherit;cursor:pointer}button:focus-visible{outline:3px solid #fff;outline-offset:3px}button:disabled{opacity:.6;cursor:default}.hidden{display:none!important}.ambient{position:fixed;z-index:0;width:480px;height:480px;border-radius:50%;filter:blur(115px);pointer-events:none;opacity:.18}.ambient-a{left:-220px;top:-200px;background:#fe61a0}.ambient-b{right:-180px;bottom:-240px;background:#745ae6}.desktop-layout{position:relative;z-index:1;min-height:100dvh;display:flex;align-items:center;justify-content:center;gap:clamp(40px,7vw,120px);padding:34px 26px}.desktop-intro{max-width:520px;align-self:center}.desktop-kicker{display:inline-flex;align-items:center;gap:10px;color:#e8d5f1;letter-spacing:2.2px;font-size:12px;font-weight:800}.live-dot{width:8px;height:8px;background:#fc6ba6;border-radius:50%;box-shadow:0 0 0 6px #fc6ba621}.desktop-intro h1{font-size:clamp(60px,7.5vw,112px);letter-spacing:-.085em;line-height:.92;font-weight:1000;margin:36px 0 27px}.desktop-intro h1 span{color:#ff679e}.desktop-intro>p{font-size:20px;line-height:2;color:#e9ddec;font-weight:600}.desktop-detail{margin:20px 0;display:flex;gap:16px;color:#e1d5e6;font-size:14px;font-weight:600}.desktop-detail span{font-size:11px;letter-spacing:1px;color:#ff7baa;border:1px solid #b759876e;border-radius:7px;padding:5px 7px;line-height:1;height:min-content}.desktop-intro small{display:block;line-height:1.8;color:#9b8fab;margin-top:40px}.app{width:min(100%,435px);flex:0 0 auto;background:linear-gradient(180deg,#221b35 0%,#171327 100%);border:1px solid #ffffff24;box-shadow:0 22px 92px #04010a8c;min-height:760px;border-radius:30px;overflow:hidden;display:flex;flex-direction:column}.app-header{display:flex;align-items:center;justify-content:space-between;gap:8px;height:64px;padding:0 24px;border-bottom:1px solid #ffffff14;flex:0 0 auto}.app-brand{display:flex;gap:8px;align-items:center;font-size:15px;font-weight:800;letter-spacing:-.55px;white-space:nowrap}.app-brand strong{color:#ff80ac}.brand-heart{width:27px;height:27px;border-radius:9px;background:linear-gradient(135deg,#ff8aa9,#fa397b);display:grid;place-items:center;color:white;font-size:20px;box-shadow:0 3px 12px #ff37755a}.header-pill{font-size:9px;letter-spacing:1.2px;border:1px solid #ffffff2e;border-radius:99px;padding:6px 9px;color:#c6bbd9;white-space:nowrap;font-weight:900}.screen{flex:1;min-width:0}.screen-welcome{padding:20px 28px 28px;text-align:center}.welcome-art{height:260px;position:relative;max-width:340px;margin:auto}.welcome-portrait{position:absolute;left:calc(50% - 104px);top:0;width:208px;height:250px;border:7px solid #faf0f6;border-radius:24px;overflow:hidden;transform:rotate(-5deg);box-shadow:0 17px 35px #08051490}.welcome-portrait img{width:100%;height:100%;object-fit:cover}.welcome-decoration{position:absolute;top:17px;width:172px;height:210px;border-radius:23px;background:#db7aa2;border:5px solid #ffe7f1;opacity:.78}.deco-one{left:23px;transform:rotate(-18deg)}.deco-two{right:23px;transform:rotate(15deg);background:#b18bd9}.welcome-sticker{position:absolute;z-index:2;font-size:20px;font-weight:1000;padding:8px 12px;border-radius:9px;letter-spacing:2px}.sticker-no{left:-4px;top:45px;color:#ff789b;border:4px solid #ff789b;transform:rotate(-23deg)}.sticker-love{right:-6px;bottom:40px;color:#82f1d4;border:4px solid #82f1d4;transform:rotate(13deg)}.welcome-bubble{position:absolute;bottom:2px;left:50%;transform:translateX(-50%) rotate(-4deg);padding:8px 13px;border-radius:10px;background:#fff;color:#fa407d;font-weight:950;font-size:12px;box-shadow:0 4px 12px #11071b63;white-space:nowrap;z-index:3}.welcome-copy{margin-top:12px}.eyebrow{font-weight:900;font-size:10px;color:#ff9fbc;letter-spacing:2.1px}.welcome-copy h2{margin:13px 0;font-size:clamp(32px,8vw,39px);font-weight:1000;line-height:1.22;letter-spacing:-1px}.welcome-copy h2 em{font-style:normal;color:#ff79a3}.welcome-copy p{font-size:13px;line-height:1.9;color:#cfc3da;margin:13px 0 20px}.rules-line{display:flex;align-items:center;justify-content:center;gap:19px;flex-wrap:wrap;font-size:12px;color:#d9c7db;margin-bottom:18px}.rules-line b{font-size:22px;line-height:1;color:#ef83a9;vertical-align:middle}.rules-line span:last-child b{color:#74e6c4}.primary-button{width:100%;background:linear-gradient(110deg,#ff5592,#f5327a);box-shadow:0 8px 24px #fe3e7a5c;color:#fff;border:0;border-radius:14px;min-height:54px;font-size:16px;font-weight:900;letter-spacing:.4px;display:flex;align-items:center;justify-content:center;gap:12px;transition:filter .2s,transform .2s}.primary-button:hover{filter:brightness(1.08)}.primary-button:active{transform:scale(.98)}.primary-button span{font-size:23px}.welcome-bottom{font-size:11px;color:#b8aac4;margin-top:14px}.welcome-bottom strong{color:#ff9cb8}.app-footer{display:flex;justify-content:space-between;align-items:center;color:#726681;letter-spacing:1px;font-size:9px;font-weight:800;padding:14px 25px;border-top:1px solid #ffffff11;flex:0 0 auto}
/* Game */
.screen-game{padding:12px 17px 6px}.hud-top{display:grid;grid-template-columns:1.25fr 1fr .8fr;align-items:center;gap:13px;padding:0 10px 10px}.tiny-label{font-size:9px;font-weight:900;letter-spacing:1.7px;color:#ac9ebd}.timer-value{font-size:37px;line-height:1.14;font-weight:1000;letter-spacing:-1.6px;font-variant-numeric:tabular-nums}.timer-value small{font-size:14px;margin-left:3px;color:#ff82ae}.timer-value.danger{color:#ff6b93;animation:timer-pulse .6s infinite alternate}.score-value{font-size:34px;font-weight:1000;line-height:1.16;display:flex;align-items:center;gap:7px;font-variant-numeric:tabular-nums}.heart-small{font-size:17px;color:#ff6699}.best-value{font-size:33px;color:#d7c5e7;font-weight:900;font-variant-numeric:tabular-nums}.timer-track{height:5px;background:#ffffff1d;border-radius:99px;overflow:hidden;margin:0 9px}.timer-fill{background:linear-gradient(90deg,#ffb0c7,#ff4d91);height:100%;width:100%;border-radius:99px;transform-origin:left}.stage-line{display:flex;align-items:center;justify-content:space-between;margin:12px 1px 9px;gap:8px;min-height:27px}.stage-line>div{display:flex;align-items:center;gap:8px}.stage-line strong{font-size:11px;color:#e5dbe7}.stage-pill{font-size:9px;white-space:nowrap;color:#ffbdd5;border:1px solid #f96fa85c;padding:5px 8px;border-radius:6px;background:#d5338133;font-weight:900;letter-spacing:.6px}.combo-chip{font-weight:950;color:#87f4dc;font-size:12px}.card-area{position:relative;width:100%;max-width:390px;margin:0 auto;padding:0 4px 9px;perspective:1000px;isolation:isolate}.stack-card{position:absolute;inset:0 5px 9px;border-radius:20px;border:1px solid #ffffff26;background:linear-gradient(140deg,#685179,#302746);box-shadow:0 14px 28px #0b061da0}.stack-back{transform:translateY(9px) scale(.96);opacity:.48}.stack-mid{transform:translateY(5px) scale(.985);opacity:.69}.swipe-card{position:relative;z-index:2;background:#fcf8fb;color:#251d2a;border-radius:18px;overflow:hidden;box-shadow:0 12px 28px #07041370;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab;will-change:transform;transform:translate3d(0,0,0)}.swipe-card.dragging{cursor:grabbing}.swipe-card.animating{transition:transform .23s cubic-bezier(.15,.8,.4,1),opacity .23s ease}.profile-photo{position:relative;width:100%;aspect-ratio:600/545;overflow:hidden;background:#bba3c8}.profile-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 28%;pointer-events:none}.photo-gradient{position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#180d23 120%);pointer-events:none}.profile-photo-label{position:absolute;bottom:12px;left:15px;color:#f9f4f7d4;font-size:10px;font-weight:950;letter-spacing:1.7px}.swipe-stamp{position:absolute;z-index:3;top:22px;font-size:28px;font-weight:1000;letter-spacing:2px;padding:7px 12px;border:5px solid;border-radius:10px;opacity:0;pointer-events:none}.like-stamp{color:#62f5cb;border-color:#62f5cb;left:18px;transform:rotate(-15deg)}.nope-stamp{color:#ff7e9c;border-color:#ff7e9c;right:18px;transform:rotate(15deg)}.profile-details{min-height:104px;padding:12px 17px 14px}.identity-line{display:flex;align-items:center;gap:8px}.identity-line h3{font-size:22px;line-height:1.1;font-weight:1000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.4px;margin:0;max-width:calc(100% - 22px)}.identity-line h3 span{font-size:19px;font-weight:500;color:#5d4f64}.verified{width:19px;height:19px;border-radius:50%;display:grid;place-items:center;background:#66c5e6;color:white;font-size:12px;flex:0 0 auto}.profile-details p{font-size:12px;color:#66566b;margin:7px 0 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.distance-row{color:#9e90a2;font-size:10px;font-weight:700}.dot-separator{padding:0 4px}.actions{display:flex;align-items:center;justify-content:center;gap:37px;margin:4px 0 0}.swipe-action{width:61px;height:61px;border:1px solid #ffffff29;border-radius:50%;background:#ffffff0e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;box-shadow:0 5px 16px #08020e52;transition:background .15s,transform .15s}.swipe-action:active{transform:scale(.91)}.swipe-action>span{font-size:31px;font-weight:700;line-height:1.12}.swipe-action small{font-size:8px;font-weight:900;letter-spacing:1px}.nope-action{color:#ff7b9b}.like-action{color:#76e5c6}.action-instruction{font-size:10px;color:#aa9bba;text-align:center;line-height:1.55;font-weight:650}.game-footnote{text-align:center;font-size:10px;color:#aa96ba;margin:12px 0 1px}
/* Results */
.screen-result{padding:20px 24px 24px;text-align:center}.result-emoji{font-size:37px;line-height:1.3}.result-eyebrow{letter-spacing:2.6px;font-size:11px;font-weight:1000;color:#ff93b2;margin:8px 0 9px}.result-title{font-size:35px;line-height:1.02;letter-spacing:-1.2px;font-weight:1000;color:#ff84a8;margin:0}.result-subtitle{color:#e2d8e4;font-size:12px;letter-spacing:1px;font-weight:900;margin:10px 0 20px}.evidence-panel{margin:-3px auto 15px;width:min(100%,270px)}.evidence-heading{font-size:11px;color:#c2b4ca;margin-bottom:7px}.evidence-photo{position:relative;margin:auto;max-width:218px;height:190px;overflow:hidden;border-radius:12px;border:3px solid #ff699d;box-shadow:0 6px 24px #ed397a33}.evidence-photo img{width:100%;height:100%;object-fit:cover;display:block}.evidence-spot{position:absolute;width:78px;height:78px;border:4px dashed #fb3947;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 2000px #11111115,0 0 15px #ffe4e7;animation:spotbeat 1.2s infinite alternate;pointer-events:none}.evidence-spot.spot-direct{width:105px;height:105px}.evidence-spot.spot-small{width:60px;height:60px}.evidence-identity{margin:8px 0 2px;font-size:13px;color:white;font-weight:900}.evidence-identity mark{background:#ff557f;color:#fff;border-radius:3px;padding:1px 3px}.evidence-reason{font-size:12px;color:#ffa6c3;font-weight:900;margin:7px 0 0}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);padding:15px 4px;margin:12px auto 16px;border:1px solid #ffffff21;border-radius:14px;background:#ffffff08}.result-stats>div+div{border-left:1px solid #ffffff20}.result-stats small{display:block;color:#b8a9c9;font-size:8px;font-weight:900;letter-spacing:.7px}.result-stats strong{font-size:28px;line-height:1.3;font-weight:1000;font-variant-numeric:tabular-nums}.record-message{font-size:12px;letter-spacing:1.2px;color:#ffe29a;font-weight:950;margin-bottom:13px}.secondary-button{width:100%;min-height:44px;margin-top:11px;border:1px solid #ffffff36;color:#efe2f1;background:#ffffff0b;border-radius:13px;font-weight:800;font-size:13px}.result-notice{font-size:10px;color:#998aa9;margin:16px 0 0}
@keyframes timer-pulse{from{opacity:1}to{opacity:.58}}@keyframes spotbeat{from{border-color:#ff264c}to{border-color:#fff}}
@media(max-width:840px){.desktop-layout{padding:0;display:block;min-height:100dvh}.desktop-intro{display:none}.app{width:100%;max-width:470px;min-height:100dvh;margin:auto;border:0;border-radius:0;box-shadow:none}.screen-welcome{display:flex;flex-direction:column;justify-content:center}.app-header{height:58px}.app-footer{padding-top:9px;padding-bottom:max(9px,env(safe-area-inset-bottom))}.screen-game{display:flex;flex-direction:column;justify-content:center}.card-area{max-width:430px}.profile-photo{aspect-ratio:600/560}}
@media(max-height:740px) and (max-width:840px){.screen-welcome{justify-content:flex-start;padding-top:10px}.welcome-art{height:208px}.welcome-portrait{height:203px;width:170px;left:calc(50% - 85px)}.welcome-decoration{width:140px;height:170px}.welcome-copy h2{font-size:29px;margin:8px 0}.welcome-copy p{margin:8px 0 13px}.rules-line{margin-bottom:10px}.screen-game{justify-content:flex-start;padding-top:8px}.hud-top{padding-bottom:5px}.timer-value{font-size:31px}.score-value,.best-value{font-size:28px}.stage-line{margin:8px 1px 6px}.profile-photo{aspect-ratio:600/450}.profile-details{min-height:91px;padding:10px 15px}.actions{gap:32px}.swipe-action{height:53px;width:53px}.game-footnote{margin:7px 0}.screen-result{padding-top:10px}.result-emoji{font-size:27px}.result-title{font-size:30px}.result-subtitle{margin:8px 0 14px}.evidence-photo{height:155px;max-width:190px}.evidence-panel{margin-bottom:8px}.result-stats{margin:10px auto}.result-stats strong{font-size:24px}}
@media(max-height:640px) and (max-width:840px){.welcome-art{height:155px}.welcome-portrait{height:150px;width:140px;left:calc(50% - 70px)}.welcome-decoration{width:110px;height:135px}.welcome-bubble{font-size:9px}.welcome-sticker{font-size:13px}.welcome-copy h2{font-size:26px}.welcome-copy p{font-size:11px}.profile-photo{aspect-ratio:600/355}.profile-details{min-height:78px}.profile-details p{margin:4px 0}.swipe-action{height:46px;width:46px}.swipe-action>span{font-size:25px}.actions{margin:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* v0.1.2: exact same component for the front and the rear card.
   Only its layer position and subtle depth scaling differ. */
.swipe-card.prepared-card{
  position:absolute;
  z-index:1;
  inset:0 4px 9px;
  width:auto;
  height:fit-content;
  pointer-events:none;
  cursor:default;
  transform:translate3d(0,5px,0) scale(.976);
  transform-origin:center bottom;
  will-change:auto;
}

/* v0.3 photographic deck — retain entire face and original photo boundaries. */
.profile-photo { aspect-ratio: 3 / 4; background: #19172a; }
.profile-photo img { object-fit: contain; object-position: center center; }
.evidence-photo { width: min(76vw,230px); height: auto; max-width: 100%; aspect-ratio: 2 / 3; background:#171124; }
.evidence-photo img { object-fit: fill; }
.evidence-spot.spot-small { width: 42px; height: 42px; border-width: 3px; }
.evidence-spot.spot-direct { width: 74px; height: 74px; }
@media (max-width:840px) { .profile-photo { aspect-ratio: 3 / 4; } }
/* In a short viewport keep the controls accessible but don't crop MOM out. */
@media (max-height:740px) and (max-width:840px) { .profile-photo { aspect-ratio: 4 / 4; } }
@media (max-height:640px) and (max-width:840px) { .profile-photo { aspect-ratio: 5 / 4; } }

/* v0.4 failure reveal: never stretch the photo, or the face coordinates drift. */
.evidence-panel { width:min(100%,330px); }
.evidence-photo { position:relative; width:min(80vw,300px); max-width:100%; height:auto; aspect-ratio:auto!important; display:block; overflow:hidden; }
.evidence-photo img { display:block; width:100%; height:auto; object-fit:contain; object-position:center; }
.evidence-spot,.evidence-spot.spot-small,.evidence-spot.spot-direct {
  width:16%; height:auto; aspect-ratio:1/1; box-sizing:border-box;
  border:3px dashed #fff0f4; outline:2px solid #f72b71;
  box-shadow: 0 0 0 2px #2c0e2599, 0 0 12px #fa357ca8;
  transform:translate(-50%,-50%);
  animation: spotbeat 1.2s infinite alternate;
}

.profile-photo { background:#252030; }
.profile-photo img { object-fit:contain; object-position:center center; }


/* v0.5.0 — accessible, tap-friendly leaderboard and sound/vibration controls. */
.header-controls{display:flex;align-items:center;gap:5px;min-width:0}
.icon-toggle{width:31px;height:31px;flex:0 0 31px;border:1px solid #ffffff2b;border-radius:10px;
  background:#ffffff0d;color:#fff;font-size:16px;display:grid;place-items:center;padding:0}
.icon-toggle[aria-pressed="false"]{opacity:.55}
.leaderboard-link{width:100%;background:#ffffff0b;border:1px solid #ff83b44d;color:#ffe0ed;
  border-radius:14px;font-weight:800;padding:13px 14px;margin:10px 0 0;font-size:14px;letter-spacing:.1px}
.leaderboard-link:hover,.board-tabs button:hover{background:#ffffff18}
.score-submit{text-align:left;margin:16px auto;padding:14px;background:#ffffff0c;border:1px solid #ffffff26;
  border-radius:15px;width:100%;max-width:350px}
.score-submit label{display:block;color:#ffe2f0;font-size:14px;font-weight:850;margin:0 0 9px}
.submit-row{display:flex;gap:7px;align-items:stretch}
.submit-row input{min-width:0;flex:1;border-radius:9px;border:1px solid #ffffff50;background:#100f1f;
  color:#fff;font-size:16px;padding:11px 10px}
.submit-row button{background:#fd478b;border:0;color:white;padding:0 14px;border-radius:9px;font-weight:850;font-size:14px}
.score-submit-status{min-height:15px;margin:9px 0 0;color:#dbc9db;line-height:1.55;font-size:12px}
.screen-leaderboard{padding:24px 18px 28px;min-height:650px;display:flex;flex-direction:column}
.screen-leaderboard h2{margin:9px 0 0;text-align:center;font-size:29px;font-weight:950;color:#fff}
.board-kicker{font-size:11px;letter-spacing:2px;font-weight:900;text-align:center;color:#fe91b6}
.board-intro{text-align:center;color:#cdbdd8;font-size:12px;line-height:1.65;margin:12px auto 20px}
.board-tabs{display:flex;gap:6px;margin:0 0 9px}
.board-tabs button{flex:1;min-width:0;padding:11px 7px;background:#ffffff0c;color:#d2c1dd;
  border:1px solid #ffffff26;border-radius:9px;font-weight:800;font-size:12px}
.board-tabs button[aria-pressed="true"]{background:#ff478b28;color:#ffb1ca;border-color:#ff559279}
.board-tabs .board-refresh{flex:0 0 44px;font-size:21px;padding:0}
.board-status{font-size:12px;text-align:center;color:#bba9c4;line-height:1.65;margin:8px 0 16px}
.board-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.board-row{display:grid;grid-template-columns:45px minmax(0,1fr) auto;align-items:center;gap:8px;
  border-radius:11px;background:#ffffff0b;padding:10px 11px;min-height:49px;border:1px solid #ffffff13}
.board-row.top-three{background:#ffaac216;border-color:#ff8eb12b}
.board-rank{font-weight:950;color:#ffe2f0;font-size:14px}
.board-name{font-weight:800;color:#fff;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-extra{font-size:12px;color:#92f5d5;font-weight:900;white-space:nowrap}
.board-footnote{font-size:11px;text-align:center;color:#a898b6;line-height:1.6;margin:22px 0 14px}
.board-back{margin-top:auto;width:100%}
@media(max-width:440px){.header-controls .header-pill{display:none}}
@media(max-width:350px){.app-brand{font-size:13px}.app-header{padding:0 13px}}


/* v0.5.2 — compact native-app-style layout for mobile and PWA installs. */
@media(max-width:840px){
  html,body{height:100%;height:100dvh;min-height:0;max-height:100dvh;overflow:hidden;overscroll-behavior:none;}
  html{-webkit-text-size-adjust:100%;touch-action:manipulation}
  body{position:fixed;inset:0;width:100%;touch-action:manipulation;}
  .desktop-layout{height:100%;height:100dvh;min-height:0;max-height:100dvh;display:flex;flex-direction:column;
    padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px);overflow:hidden;}
  .app{display:flex;flex-direction:column;height:100%;min-height:0;max-height:100%;overflow:hidden;
    flex:1 1 auto;width:100%;max-width:none;border:0;border-radius:0;}
  .app-header{flex:0 0 48px;height:48px;min-height:48px;padding:0 14px;position:relative;z-index:10;}
  .app-brand{font-size:clamp(12px,3.5vw,15px)}
  .header-controls{gap:8px}
  .icon-toggle{min-height:36px;min-width:36px;width:36px;height:36px;flex-basis:36px;
    touch-action:manipulation;}
  .app-footer{display:none}
  .screen{flex:1 1 auto;min-height:0;height:auto;overflow:hidden}
  .screen-welcome{padding:8px 20px 10px;justify-content:center;gap:0;}
  .welcome-art{height:min(25dvh,220px);flex:0 1 auto;min-height:95px;max-height:220px;width:100%;}
  .welcome-portrait{height:94%;width:auto;aspect-ratio:208/250;left:50%;transform:translateX(-50%) rotate(-5deg)}
  .welcome-decoration{height:77%;width:38%;top:8%}
  .deco-one{left:16%}.deco-two{right:16%}
  .welcome-sticker{font-size:clamp(11px,3vw,17px);padding:5px 7px}
  .welcome-copy{margin-top:4px}
  .welcome-copy h2{font-size:clamp(25px,6.6vw,34px);margin:6px 0}
  .welcome-copy p{margin:7px 0 10px;font-size:clamp(11px,3vw,13px);line-height:1.55}
  .rules-line{font-size:11px;gap:10px;margin-bottom:9px;}
  .primary-button{min-height:45px;font-size:14px;border-radius:12px}
  .leaderboard-link{margin-top:7px;padding:9px;font-size:12px;min-height:40px}
  .welcome-bottom{margin-top:8px;font-size:10px}

  .screen-game{display:flex;flex-direction:column;justify-content:stretch;gap:0;padding:7px 12px 8px;min-height:0}
  .hud-top{flex:0 0 auto;padding:0 8px 5px;gap:7px}
  .tiny-label{font-size:9px}.timer-value{font-size:clamp(27px,8.3vw,35px)}
  .score-value{font-size:clamp(26px,7.8vw,33px)}.best-value{font-size:clamp(25px,7.4vw,32px)}
  .timer-track{flex:0 0 5px}
  .stage-line{flex:0 0 auto;margin:8px 0 7px;min-height:25px}
  .stage-line strong{font-size:11px}.combo-chip{font-size:11px}
  .card-area{flex:1 1 auto;min-height:0;max-height:none;width:100%;padding:0 4px 8px;
    display:flex;flex-direction:column;align-items:stretch;justify-content:center;}
  .swipe-card{display:flex;flex-direction:column;height:100%;width:100%;max-height:100%;min-height:0;
    border-radius:17px;flex:1 1 auto;}
  .profile-photo,.profile-photo:not(foo){aspect-ratio:auto!important;flex:1 1 auto;min-height:0;height:auto;background:#252030;}
  .profile-photo img{width:100%;height:100%;object-position:center center}
  .profile-details{flex:0 0 auto;min-height:0;padding:9px 15px 10px}
  .identity-line h3{font-size:21px}.identity-line h3 span{font-size:18px}
  .profile-details p{font-size:11px;margin:5px 0}.distance-row{font-size:9px}
  .swipe-card.prepared-card{height:calc(100% - 8px);max-height:calc(100% - 8px);min-height:0;
    position:absolute;inset:0 4px 8px;display:flex;flex-direction:column;width:auto}
  .swipe-card.prepared-card .profile-photo{flex:1 1 auto;height:auto;aspect-ratio:auto!important}
  .actions{flex:0 0 58px;gap:clamp(23px,10vw,38px);margin:2px 0 0}
  .swipe-action{height:52px;width:52px}.swipe-action>span{font-size:27px}
  .game-footnote{flex:0 0 auto;font-size:9px;margin:3px 0 0;line-height:1.2}

  /* Both success and failure results fit without a page-length scroll. */
  .screen-result{display:flex;flex-direction:column;align-items:stretch;justify-content:center;
    padding:5px 14px 8px;gap:0;min-height:0;overflow:hidden}
  .result-emoji{font-size:22px;line-height:1.1;flex-shrink:0}
  .result-eyebrow{font-size:9px;letter-spacing:2px;margin:4px 0 4px;flex-shrink:0}
  .result-title{font-size:clamp(24px,6.6vw,32px);line-height:1.02;letter-spacing:-.6px;flex-shrink:0}
  .result-subtitle{font-size:11px;margin:5px 0 7px;letter-spacing:.3px;flex-shrink:0}
  .evidence-panel{flex:0 1 auto;min-height:0;margin:0 auto 4px;width:100%;max-width:310px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;}
  .evidence-heading{font-size:10px;margin:0 0 4px;flex:0 0 auto}
  .evidence-photo{aspect-ratio:var(--evidence-aspect,2/3)!important;height:min(36dvh, calc(100dvh - 505px), 342px)!important;
    min-height:120px;max-height:100%;width:auto!important;max-width:100%;flex:0 1 auto;
    margin:0 auto;overflow:hidden;border-radius:11px;border-width:3px}
  .evidence-photo img{height:100%!important;width:100%!important;object-fit:contain}
  .evidence-identity{font-size:12px;margin:4px 0 1px;flex-shrink:0}
  .evidence-reason{font-size:11px;line-height:1.2;margin:2px 0;flex-shrink:0}
  .result-stats{flex:0 0 auto;margin:5px 0;padding:7px 3px;border-radius:10px}
  .result-stats small{font-size:8px;letter-spacing:.2px}.result-stats strong{font-size:23px;line-height:1.12}
  .record-message{flex:0 0 auto;font-size:10px;letter-spacing:.7px;margin:4px 0}
  .score-submit{flex:0 0 auto;width:100%;max-width:none;margin:5px 0;padding:8px 10px;border-radius:10px;}
  .score-submit label{font-size:12px;margin:0 0 5px}
  .submit-row input{font-size:16px;min-height:38px;padding:8px}
  .submit-row button{font-size:13px}
  .score-submit-status{font-size:10px;min-height:0;line-height:1.35;margin:4px 0 0}
  .result-actions{display:flex;flex-direction:column;gap:6px;margin:4px 0 0;flex:0 0 auto}
  .result-action-row{display:grid;grid-template-columns:1.35fr 1fr;gap:7px}
  .result-action-row button{width:100%;margin:0;padding:5px 7px;min-height:42px;
    border-radius:10px;font-size:12px;line-height:1.15;letter-spacing:0}
  .result-action-row .primary-button{font-size:14px}
  .result-action-row .primary-button span{font-size:18px}
  .result-action-secondary{grid-template-columns:1fr 1.16fr}
  .result-action-secondary button{min-height:38px;font-size:11px}
  .home-button{color:#f6dfed;background:#ffffff0b}
  .result-notice{display:none}

  /* Long ranking lists scroll only inside the list, not the game shell. */
  .screen-leaderboard{display:flex;flex-direction:column;min-height:0;padding:12px 14px 9px;}
  .screen-leaderboard h2{font-size:25px;margin:5px 0 0}
  .board-intro{font-size:11px;margin:5px 0 12px}
  .board-tabs{margin:0 0 6px;flex:0 0 auto}
  .board-status{margin:5px 0 6px;flex:0 0 auto}
  .board-list{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;
    overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;}
  .board-footnote{font-size:10px;margin:6px 0 6px;line-height:1.35;flex:0 0 auto}
  .board-back{min-height:40px;margin:0;flex:0 0 auto}
  html.keyboard-open .screen-result{overflow-y:auto;justify-content:flex-start;-webkit-overflow-scrolling:touch;}
}
/* iOS installed web app: the black-translucent status bar overlays the document.
   Reserve an explicit status-bar band even on versions that report zero safe inset. */
@media(max-width:840px) and (display-mode:standalone){
  .desktop-layout{padding-top:env(safe-area-inset-top,0px);
    padding-bottom:max(8px,env(safe-area-inset-bottom,0px));}
}
@media(max-width:840px){
  html.pwa-standalone .desktop-layout{padding-top:max(59px,env(safe-area-inset-top,0px));
    padding-bottom:max(8px,env(safe-area-inset-bottom,0px));}
}
@media(max-width:840px) and (max-height:735px){
  .screen-welcome{padding-top:3px;padding-bottom:3px}
  .welcome-art{height:19dvh;min-height:80px}
  .welcome-copy h2{font-size:25px}.welcome-copy p{font-size:11px;margin:5px 0 7px}
  .rules-line{margin-bottom:6px}.welcome-bottom{display:none}
  .stage-line{margin:4px 0 5px}.actions{flex-basis:53px}.swipe-action{width:48px;height:48px}
  .screen-result{padding:3px 10px 4px}
  .result-emoji{display:none}.result-eyebrow{margin:0 0 3px}
  .result-title{font-size:23px}.result-subtitle{margin:3px 0 5px}
  .evidence-photo{height:min(30dvh, calc(100dvh - 440px))!important;min-height:92px}
  .result-stats strong{font-size:20px}.result-stats{padding:5px 2px;margin:4px 0}
  .result-actions{gap:4px;margin-top:3px}.result-action-row button{min-height:37px}
  .result-action-secondary button{min-height:33px}.score-submit{padding:6px 8px;margin:4px 0}
}


/* v0.5.3 — reclaim vertical space + show complete profile portraits.
   No more cover-cropping of the top of the head or the feet. */
.profile-photo{isolation:isolate;--portrait-background:none;background-color:#251f34}
.profile-photo::before{
  content:"";position:absolute;inset:-18px;z-index:0;pointer-events:none;
  background-image:var(--portrait-background);background-size:cover;background-position:center;
  filter:blur(18px) brightness(.64);transform:scale(1.06);
}
.profile-photo img{
  position:relative;z-index:1;object-fit:contain!important;object-position:center center!important;
  width:100%;height:100%;
}
.profile-photo .photo-gradient{z-index:2;inset:58% 0 0;background:linear-gradient(transparent,rgba(20,12,30,.55))}
.profile-photo .profile-photo-label{z-index:3}
.profile-photo .swipe-stamp{z-index:4}

@media(max-width:840px){
  /* Grid gives the card every pixel not used by the HUD and thumb controls. */
  .screen-game{
    display:grid;grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto 5px auto minmax(0,1fr) 48px 12px;
    align-content:stretch;justify-content:stretch;
    row-gap:0;padding:3px 8px 0;
  }
  .hud-top{padding:0 7px 3px;gap:5px}
  .timer-value{font-size:clamp(27px,7.8vw,34px)}
  .score-value{font-size:clamp(27px,7.5vw,32px)}
  .best-value{font-size:clamp(26px,7vw,31px)}
  .timer-track{margin:0 7px}
  .stage-line{margin:5px 3px 5px;min-height:25px}
  .card-area{min-height:0;height:100%;padding:0 2px 6px;align-self:stretch;justify-content:stretch}
  .swipe-card{min-height:0;height:100%;max-height:100%;}
  .swipe-card.prepared-card{inset:0 2px 6px;height:calc(100% - 6px);max-height:calc(100% - 6px)}
  .profile-photo,.swipe-card.prepared-card .profile-photo{min-height:0;flex:1 1 auto;height:auto;aspect-ratio:auto!important}
  .profile-details{padding:7px 13px 8px;min-height:0}
  .identity-line h3{font-size:20px}
  .profile-details p{margin:3px 0;font-size:11px}
  .distance-row{font-size:9px}
  .actions{height:48px;min-height:0;align-self:stretch;margin:0;gap:clamp(18px,8vw,34px)}
  .swipe-action{width:44px;height:44px;flex:0 0 44px}
  .swipe-action>span{font-size:24px}
  .swipe-action small{font-size:7px}
  .action-instruction{font-size:9px;line-height:1.25}
  .game-footnote{height:12px;margin:0;padding:0;font-size:9px;line-height:12px;align-self:start}
}
@media(max-width:840px) and (max-height:735px){
  .screen-game{grid-template-rows:auto 5px auto minmax(0,1fr) 44px 10px;padding-top:1px}
  .stage-line{margin:3px 3px 3px}
  .actions{height:44px}.swipe-action{height:44px;width:44px;flex-basis:44px}
  .game-footnote{font-size:8px;line-height:10px;height:10px}
}


/* v0.5.4 — iPhone 18 Pro / 402×874 CSS-px reference.
   In installed iOS PWAs, 100dvh can stop ~60 CSS px above the actual display.
   JS measures the *full physical display in CSS pixels* and exposes its
   intended height. Fill the bottom visually, reserving ONLY the Home bar inset. */
@media (max-width:840px){
  html,body{
    height:var(--dlym-display-height,100dvh)!important;
    min-height:var(--dlym-display-height,100dvh)!important;
    max-height:var(--dlym-display-height,100dvh)!important;
    width:100%;overflow:hidden;overscroll-behavior:none;
  }
  body{top:0;left:0;right:0;bottom:auto;position:fixed}
  .desktop-layout{
    box-sizing:border-box;
    height:var(--dlym-display-height,100dvh)!important;
    min-height:0!important;max-height:none!important;
    padding-right:0!important;padding-left:0!important;
    padding-bottom:0!important;
    overflow:hidden;
  }
  .app{height:100%!important;min-height:0!important;max-height:100%!important;
    flex:1 1 auto;overflow:hidden;}
  /* Reserve the Home indicator inside each screen instead of outside the App.
     The screen itself (and its background) now extends to the bottom edge. */
  .screen-game{padding-bottom:max(8px,env(safe-area-inset-bottom,0px))!important;}
  .screen-welcome{padding-bottom:max(16px,env(safe-area-inset-bottom,0px))!important;}
  .screen-result{padding-bottom:max(8px,env(safe-area-inset-bottom,0px))!important;}
  .screen-leaderboard{padding-bottom:max(9px,env(safe-area-inset-bottom,0px))!important;}
  .screen-welcome .welcome-art{height:clamp(170px,31%,260px);max-height:260px;min-height:120px;
    flex:0 1 auto;}
  .screen-welcome .welcome-portrait{max-height:95%}
  .screen-welcome .welcome-copy{margin-top:clamp(6px,2.2vh,18px)}
  .screen-welcome{justify-content:center}
}
/* On shorter phones, use the same single-screen flow without squeezing below tappable height. */
@media(max-width:840px) and (max-height:735px){
  .screen-welcome .welcome-art{height:clamp(92px,22%,165px)}
}

/* v0.5.6 — label leaderboard stats explicitly; stack on small screens. */
.board-row{min-height:63px}
.board-extra{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px;font-size:11px;line-height:1.25;white-space:nowrap;font-variant-numeric:tabular-nums;}
.board-likes{color:#90f5d8}
.board-mom-dodged{color:#dbc9fa}
@media(max-width:360px){.board-row{grid-template-columns:37px minmax(0,1fr) auto;gap:5px;padding:9px 8px}.board-extra{font-size:10px}.board-name{font-size:12px}}

/* v0.5.7 — friend challenges fit the existing fullscreen iPhone UI. */
.welcome-extra-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%;}
.welcome-extra-actions button{margin:9px 0 0;min-width:0;font-size:clamp(11px,3.3vw,14px);padding:12px 5px;white-space:nowrap}
.friend-challenge-button{background:linear-gradient(120deg,#50407044,#ff5c9c28);color:#ffe2f0;border:1px solid #ff88bf77;border-radius:14px;font-weight:800;}
.challenge-invite-info{font-size:11px;text-align:center;color:#b3f1db;padding:5px 8px;margin:4px 0;border:1px solid #81f4d24a;border-radius:9px;background:#4ac4a312;line-height:1.35}
@media(max-width:840px){
  .welcome-extra-actions button{padding:9px 3px;margin-top:7px}
  .challenge-invite-info{margin:3px 0;font-size:10px;padding:3px 5px}
  .screen-welcome:has(.challenge-invite-info:not(.hidden)) .welcome-art{max-height:215px}
  .result-notice{line-height:1.35}
}
@media(max-height:740px) and (max-width:840px){
  .welcome-extra-actions button{min-height:35px;padding:6px 2px;margin-top:5px}
  .screen-welcome:has(.challenge-invite-info:not(.hidden)) .welcome-art{max-height:135px}
}

/* v0.5.9: show the actual loaded JS version within the permanently visible header. */
.app-brand .brand-label{display:flex;flex-direction:column;align-items:flex-start;line-height:1.12;min-width:0}
.app-brand .game-version-badge{display:block;margin-top:3px;font-size:10px;letter-spacing:.3px;line-height:1.05;
  font-weight:750;color:#9be8d7;white-space:nowrap;text-align:left}
@media(max-width:840px){
  .app-brand{gap:7px}
  .app-brand .game-version-badge{font-size:9px}
  .app-brand .brand-heart{flex:0 0 27px}
  .app-brand .brand-label{font-size:clamp(11px,3.35vw,15px)}
}
@media(max-width:365px){
  .app-header{padding:0 9px}
  .header-controls{gap:5px}
  .app-brand .brand-label{font-size:11px}
  .app-brand .game-version-badge{font-size:9px}
}
/* Diagnostic messages must wrap on iPhones rather than forcing horizontal scroll. */
.score-submit-status{overflow-wrap:anywhere;word-break:break-word}

/* v0.6.0 simultaneous two-person lobby */
.screen-duel-lobby {display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:11px;padding:15px 22px max(20px,env(safe-area-inset-bottom,0px));text-align:center;min-height:0;overflow:hidden;}
.screen-duel-lobby.hidden {display:none!important}
.duel-hero{font-size:46px;line-height:1.1}
.screen-duel-lobby h2{font-size:clamp(22px,6vw,30px);margin:0;font-weight:900;color:#fff}
.duel-explainer{font-size:13px;color:#cbbfd7;line-height:1.55;margin:0}
.duel-name-label{text-align:left;font-size:12px;font-weight:800;color:#d9cce9}
.duel-name{width:100%;height:44px;box-sizing:border-box;min-height:0;border:1px solid #ff98c655;border-radius:12px;background:#251c39;color:#fff;font-size:16px;padding:8px 12px;}
.duel-players{border:1px solid #ffffff26;border-radius:14px;background:#21182f;display:grid;grid-template-columns:1fr;gap:8px;padding:12px;text-align:left;font-size:13px;}
.duel-status{font-size:12px;min-height:30px;line-height:1.45;color:#8af3d2;overflow-wrap:anywhere}
.screen-duel-lobby button{min-height:42px;width:100%;font-size:14px;margin:0}
.duel-result-status{white-space:pre-line;font-size:12px;font-weight:700;color:#baf8dd;background:#20483833;padding:6px;border-radius:10px;line-height:1.35;text-align:center;}
.duel-refresh{background:transparent;border:1px solid #8af3d255;border-radius:8px;color:#9aead2;font-size:10px;margin:auto;padding:5px 10px}
.duel-refresh.hidden{display:none}
@media(max-width:840px){.screen-duel-lobby{gap:clamp(5px,1.1dvh,11px);padding:8px 17px max(14px,env(safe-area-inset-bottom,0px));}.duel-hero{font-size:38px}.duel-explainer{font-size:12px}.duel-name{height:40px}.duel-players{padding:9px;font-size:12px;gap:5px}.screen-duel-lobby button{min-height:40px;padding:8px 10px}.duel-status{font-size:11px}.duel-result-status{font-size:11px}}
@media(max-height:730px){.screen-duel-lobby{gap:5px}.duel-hero{font-size:29px}.duel-explainer{font-size:10px}.duel-players{padding:6px}.screen-duel-lobby button{min-height:34px}}

/* Space for opponent scores without making the fixed-height result page scroll. */
@media(max-width:840px){
 .screen-result:has(.duel-result-status:not(.hidden)) .result-emoji{display:none}
 .screen-result:has(.duel-result-status:not(.hidden)) .result-title{font-size:clamp(22px,5.5vw,28px)}
 .screen-result:has(.duel-result-status:not(.hidden)) .result-stats{padding:4px 3px;margin:3px 0}
 .screen-result:has(.duel-result-status:not(.hidden)) .evidence-photo{height:min(24dvh,190px)!important;min-height:76px}
 .screen-result:has(.duel-result-status:not(.hidden)) .result-actions{gap:3px;margin:2px 0 0}
 .screen-result:has(.duel-result-status:not(.hidden)) .result-action-row button{min-height:34px}
 .screen-result:has(.duel-result-status:not(.hidden)) .result-action-secondary button{min-height:30px}
 .screen-result:has(.duel-result-status:not(.hidden)) .score-submit{display:none!important}
 .screen-result:has(.duel-result-status:not(.hidden)) .duel-result-status{font-size:10px;padding:4px;max-height:63px;overflow:hidden}
 .screen-result:has(.duel-result-status:not(.hidden)) .duel-refresh{font-size:10px;padding:2px 8px;margin-top:2px;}
 html.keyboard-open .screen-duel-lobby{justify-content:flex-start;overflow-y:auto;overscroll-behavior:contain;}
}

/* v0.6.1 — visible pending state prevents blind swipes on unloaded photos. */
.profile-photo .photo-loading-indicator {
  position:absolute;inset:0;z-index:5;width:100%;height:100%;border:0;
  background:#251f34;color:#ffe6f0;font:800 clamp(12px,3.7vw,17px)/1.5 system-ui,sans-serif;
  text-align:center;padding:20px;cursor:pointer;
}
.profile-photo .photo-loading-indicator.hidden {display:none!important}
.profile-photo .photo-loading-indicator:disabled {opacity:1;cursor:progress}


/* v0.6.2 — the original .result-notice is display:none on mobile; keep MOM
   dialogue on its own visible row. Use a text-only box (no new images). */
.mom-roast{
  margin:9px auto 10px;max-width:380px;width:100%;padding:10px 13px;
  border:1px solid #ff8cba88;border-radius:13px;
  background:linear-gradient(115deg,#ff549822,#a852d21b);
  color:#ffd4e4;font-size:clamp(12px,3.45vw,15px);
  font-weight:850;line-height:1.45;letter-spacing:.1px;text-align:center;
  box-shadow:0 5px 22px #e7377720;flex:0 0 auto;
  overflow-wrap:anywhere;
}
@media(max-width:840px){
  .mom-roast{margin:3px auto 6px;padding:8px 9px;
    font-size:clamp(12px,3.4vw,14px);line-height:1.35}
  .screen-result:has(.mom-roast:not(.hidden)) .evidence-photo{
    height:min(33dvh,calc(100dvh - 540px),290px)!important;
    min-height:98px;
  }
}
@media(max-width:840px) and (max-height:735px){
  .mom-roast{margin:2px auto 4px;padding:6px 8px;line-height:1.22;font-size:12px}
  .screen-result:has(.mom-roast:not(.hidden)) .evidence-photo{
    height:min(27dvh,calc(100dvh - 530px))!important;
    min-height:84px;
  }
}

/* v0.7.0: keep three welcome actions on one compact line. */
.welcome-extra-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.welcome-extra-actions button{white-space:normal;line-height:1.25;font-size:clamp(10px,2.85vw,13px);padding:10px 3px}
.community-submit-button{background:#ffffff0d;border:1px solid #fca7c471;border-radius:14px;color:#ffe4ed;font-weight:900}
@media(max-width:840px){.welcome-extra-actions button{padding:8px 3px;min-height:39px}}
@media(max-width:355px){.welcome-extra-actions{gap:4px}.welcome-extra-actions button{font-size:10px;padding:6px 2px}}

/* v0.7.1 — archives of daily champions. Keep all 3 tabs usable on 320px phones. */
.board-tabs{gap:5px}
.board-tabs button{font-size:11px;padding:10px 3px;white-space:nowrap}
.board-tabs .board-refresh{flex:0 0 38px;font-size:20px}
.board-champion{background:linear-gradient(105deg,#f5ab2720,#ffffff0b);border-color:#f8cf704a;}
.board-champion .board-rank{font-size:20px}
.board-champion-info{display:flex;flex-direction:column;gap:4px;min-width:0;overflow:hidden}
.board-champion-date{color:#ffd486;font-size:11px;font-weight:900;letter-spacing:.45px;font-variant-numeric:tabular-nums}
.board-champion-player{display:block;max-width:100%;font-size:14px}
.board-provisional{flex:0 0 auto;display:flex;flex-direction:column;gap:3px;align-items:center;
  background:linear-gradient(120deg,#fbbd3040,#ed5c9e19);border:1px solid #ffd57a67;
  border-radius:12px;padding:9px 10px;margin:0 0 9px;color:#fff;}
.board-provisional-label{color:#ffe1a1;font-size:11px;font-weight:900}
.board-provisional-player{font-size:15px;font-weight:900;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board-provisional-score{font-size:11px;color:#e7dae7;font-weight:700;}
.board-load-more{flex:0 0 auto;width:100%;padding:9px;margin:6px 0;border:1px solid #ffd27875;
  background:#fbc5471d;color:#ffe7b1;border-radius:10px;font-weight:850;font-size:12px;}
.board-footnote{white-space:pre-line}
@media(max-width:370px){
 .board-tabs{gap:3px}
 .board-tabs button{padding:9px 2px;font-size:10px;letter-spacing:-.3px}
 .board-tabs .board-refresh{flex-basis:31px}
 .board-champion .board-extra{font-size:10px}
 .board-champion{gap:5px;padding:9px 6px;grid-template-columns:29px minmax(0,1fr) auto}
}

/* v0.8.0 — local-only achievement gallery. The content scrolls inside the fixed-height PWA. */
.achievement-link{background:#ffcf7320;color:#ffe1aa;border:1px solid #ffcf7360;border-radius:12px;font-weight:850;cursor:pointer;min-height:40px;}
.achievement-award{display:block;width:100%;padding:5px 8px;margin:3px 0;border:1px solid #f5c77983;border-radius:9px;color:#ffe1ad;background:#6a492b70;font-weight:850;font-size:11px;cursor:pointer;text-align:center;}
.screen-achievements{display:flex;flex-direction:column;padding:20px 18px 17px;gap:9px;min-height:0;}
.ach-kicker{color:#f8a7c6;font-size:10px;font-weight:900;letter-spacing:1.6px;text-align:center;}
.screen-achievements h2{color:#fff;margin:0;text-align:center;font-size:27px;font-weight:950;}
.ach-intro{margin:0;text-align:center;color:#cebed8;font-size:12px;}
.ach-progress-head{display:flex;align-items:center;justify-content:space-between;color:#d8c7de;font-size:12px;}
.ach-progress-head strong{color:#ffbfd9;font-size:19px;}
.ach-progress-track{height:9px;background:#ffffff20;border-radius:12px;overflow:hidden;flex:none;}
.ach-progress-track span{display:block;height:100%;width:0;background:linear-gradient(90deg,#fe6da0,#ffc66f);border-radius:12px;transition:width .25s;}
.ach-next{color:#ffe6b5;background:#ffffff0b;border:1px solid #ffffff20;border-radius:10px;margin:0;padding:9px 10px;font-size:12px;font-weight:800;}
.ach-filters{display:flex;gap:6px;overflow-x:auto;flex:none;padding:2px 0 6px;touch-action:pan-x;scrollbar-width:none;}
.ach-filters::-webkit-scrollbar{display:none;}
.ach-filters button{flex:none;color:#d5bed7;border:1px solid #ffffff2c;border-radius:24px;background:#ffffff0b;padding:8px 12px;font-size:12px;font-weight:850;}
.ach-filters button[aria-pressed="true"]{background:#ff438a45;color:#ffd2e4;border-color:#ff6b9e;}
.ach-list{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;flex:1 1 auto;display:flex;flex-direction:column;gap:8px;padding:2px 2px 12px;}
.ach-item{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #ffffff19;border-radius:13px;background:#ffffff07;min-height:74px;flex:none;}
.ach-item.achieved{background:#ff639618;border-color:#ff89b74a;}
.ach-icon{display:grid;place-items:center;width:46px;height:46px;border-radius:11px;background:#ffffff12;font-size:24px;flex:none;}
.ach-item.achieved .ach-icon{background:#ff94bb28;}
.ach-info{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1;}
.ach-info strong{font-size:14px;color:#fff;}
.ach-info small{font-size:11px;color:#bfb0c9;}
.ach-item.achieved .ach-info small{color:#ffcbdd;}
.ach-meter{height:5px;background:#ffffff19;border-radius:6px;overflow:hidden;}
.ach-meter span{display:block;height:100%;background:#ff89b2;}
.ach-local-note{color:#a99aba;font-size:10px;line-height:1.35;margin:0;}
.ach-back{margin:0;flex:none;}
@media(max-width:840px){.screen-achievements{padding:10px 13px max(10px,env(safe-area-inset-bottom));gap:7px;overflow:hidden;}.screen-achievements h2{font-size:23px;}.ach-intro{font-size:11px;}.ach-item{min-height:67px;padding:8px;}.ach-back{min-height:39px;}}
@media(max-width:840px) and (max-height:735px){.ach-local-note{font-size:9px;}.screen-achievements h2{font-size:20px;}.ach-filters button{padding:6px 9px;}.ach-next{padding:6px 8px;}}

/* v0.8.2 — Edge MOM clues: ring can extend beyond the photo, never clipped.
   The image keeps its rounded corners; only the translucent clue ring escapes. */
.evidence-panel, .evidence-photo { overflow:visible !important; }
.evidence-photo > img { border-radius:8px; }
.evidence-spot { z-index:4; overflow:visible; }