:root{
  --ink:#12344a;--ink-2:#284b60;--muted:#657f8d;--teal:#1ea99e;--cyan:#179bd0;--navy:#07334f;
  --line:#d5e5eb;--line-strong:#c3d9e2;--surface:#fff;--soft:#f4f9fb;--board:#b7d88d;--cell:#dff0c4;--cell-alt:#d8ebbb;
  --shadow:0 14px 34px rgba(20,66,86,.10);--shadow-soft:0 8px 20px rgba(20,66,86,.07);--board-size:680px;
}
*,*::before,*::after{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:linear-gradient(#99dcf7 0 43%,#eef8e8 43% 100%)}body{min-height:100dvh}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.56}img{max-width:100%}#app{min-height:100dvh}.ui-icon,.button-icon,.panel-icon{width:21px;height:21px;display:block}.eyebrow{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;font-weight:900;color:#168da1}.screen-brand{font-size:.62rem;font-weight:800;color:rgba(255,255,255,.94)}
.primary-btn,.secondary-btn,.flow-btn,.ma-primary,.ma-secondary,.ma-link-btn{border:0;border-radius:13px;font-weight:850;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.primary-btn,.ma-primary,.flow-btn{background:linear-gradient(135deg,#1599cf,#20aa9f);color:#fff;box-shadow:0 8px 18px rgba(22,148,175,.22)}.secondary-btn,.ma-secondary{background:#fff;color:#24465a;border:1px solid var(--line-strong)}.ma-link-btn{background:transparent;color:#167d9f;padding:0}.primary-btn:hover,.secondary-btn:hover,.ma-primary:hover,.ma-secondary:hover{transform:translateY(-1px)}.wide-btn{width:100%}.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.54);border-radius:14px;background:rgba(255,255,255,.94);box-shadow:0 6px 14px rgba(22,78,101,.10)}.icon-text-btn{display:flex;align-items:center;justify-content:center;gap:7px}
.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,18px);opacity:0;pointer-events:none;z-index:120;padding:10px 15px;border-radius:999px;background:#173448;color:#fff;box-shadow:var(--shadow);transition:.2s ease;font-size:.82rem;font-weight:750}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#a84141}.toast.info{background:#245a78}.modal-layer{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px;background:rgba(7,32,48,.50);backdrop-filter:blur(7px)}.result-card,.auth-card,.leaderboard-modal,.support-modal{width:min(94vw,500px);max-height:92dvh;overflow:auto;padding:20px;border:1px solid rgba(255,255,255,.7);border-radius:24px;background:#fff;box-shadow:0 28px 70px rgba(11,43,60,.25)}.compact-modal{width:min(94vw,440px)}.result-brand{display:flex;justify-content:center}.result-brand img{width:78px;height:78px;object-fit:contain}.result-card h2,.auth-card h2,.leaderboard-modal h2,.support-modal h2{margin:8px 0 6px;text-align:center}.result-card p,.auth-card p{text-align:center;color:var(--muted);line-height:1.45}.result-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.result-stats span{padding:11px;border-radius:15px;background:var(--soft);text-align:center;font-size:1.12rem;font-weight:900}.result-stats small{display:block;font-size:.6rem;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.1em}.result-actions{display:flex;gap:9px}.result-actions button{flex:1;min-height:44px}.stars{text-align:center;font-size:1.7rem;color:#d7a522}
.auth-tabs,.support-tabs{display:flex;gap:8px;margin:10px 0}.auth-tabs button,.support-tabs button{flex:1;padding:10px;border:1px solid var(--line);border-radius:12px;background:#f8fbfc;font-weight:800;color:#46606f}.auth-tabs button.active,.support-tabs button.active{background:#e4f6f8;color:#138b98}.auth-form{display:grid;gap:9px}.auth-form label{display:grid;gap:5px;color:#4b6675;font-size:.74rem;font-weight:750}.auth-form input{width:100%;padding:11px 12px;border:1px solid var(--line-strong);border-radius:12px;outline:none}.auth-form input:focus{border-color:#35a8bf;box-shadow:0 0 0 3px rgba(30,169,158,.12)}.register-only[hidden]{display:none!important}.auth-tip,.auth-status,.auth-error{margin:0;padding:9px 11px;border-radius:12px;font-size:.72rem}.auth-tip{background:#f5fafc;color:var(--muted)}.auth-status.connected{background:#e8f7ee;color:#2d7650}.auth-status.unavailable,.auth-error{background:#fff0ee;color:#a64b42}.auth-status.checking{background:#f2f6f8;color:#617581}.auth-cancel{width:100%;margin-top:8px;min-height:42px;border:1px solid var(--line-strong);border-radius:12px;background:#fff;color:#496474;font-weight:800}.leader-filter{display:flex;gap:6px;overflow-x:auto;margin:12px 0}.leader-filter button{padding:8px 10px;border:1px solid var(--line);border-radius:999px;background:#f8fbfc;font-weight:800;color:#4d6774}.leader-filter button.active{background:#e3f5f7;color:#118d9b}.leader-list{display:grid;gap:7px}.leader-row{display:grid;grid-template-columns:38px 1fr auto;gap:9px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:13px}.leader-row small{display:block;color:var(--muted)}.fg-qr{text-align:center}.fg-qr img{width:min(260px,70vw);border-radius:16px}.fg-paypal{text-align:center;display:grid;gap:8px}.paypal-mark{width:58px;height:58px;border-radius:18px;margin:auto;display:grid;place-items:center;background:#0f55a8;color:#fff;font-size:2rem;font-weight:900}.pipe-drag-ghost{position:fixed;z-index:150;width:72px;height:72px;pointer-events:none;transform:translate(-50%,-50%) scale(1.05);filter:drop-shadow(0 12px 18px rgba(10,55,77,.28))}.pipe-drag-ghost .pipe-piece{width:100%;height:100%}
.auth-error:empty{display:none}

/* v0.52 logo contrast fix: transparent crest never floats directly on white */
.result-brand{
  width:96px;
  height:96px;
  margin:0 auto 8px;
  padding:8px;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  background:
    radial-gradient(circle at 35% 24%,rgba(54,214,255,.22),transparent 38%),
    linear-gradient(145deg,#082f49,#0b5878 62%,#0d6f85);
  border:1px solid rgba(28,114,145,.55);
  box-shadow:0 10px 24px rgba(8,48,73,.18),inset 0 1px 0 rgba(255,255,255,.10);
}
.result-brand img{
  width:80px;
  height:80px;
  padding:0;
  object-fit:contain;
  filter:drop-shadow(0 4px 9px rgba(0,0,0,.22));
}