/* ============ LOAN SHARK TYCOON HK v3 ============ */
:root{--bg:#0a0a0f;--card:#141420;--card2:#1a1a2e;--bdr:#2a2a3a;--t1:#e8e8ec;--t2:#9898a8;--t3:#58586a;--gold:#ffd700;--green:#39ff14;--cyan:#00f0ff;--pink:#ff2d6b;--yellow:#ffe600;--red:#ff3344;--orange:#ff8800}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--t1);font-family:-apple-system,'PingFang HK','Microsoft YaHei',sans-serif;height:100vh;overflow:hidden}

.screen{display:none;flex-direction:column;height:100vh;overflow-y:auto}.screen.active{display:flex}
.hidden{display:none!important}

/* SPLASH */
#splash-screen{justify-content:center;align-items:center;text-align:center;background:var(--bg);background-image:radial-gradient(ellipse at 20% 50%,rgba(255,215,0,.12) 0%,transparent 50%),radial-gradient(ellipse at 80% 50%,rgba(255,45,107,.12) 0%,transparent 50%)}
.splash-content{padding:24px;max-width:400px}
.title-cn{font-size:3rem;font-weight:900;background:linear-gradient(135deg,var(--gold),var(--yellow),var(--orange));-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:6px}
.title-en{font-size:.8rem;color:var(--gold);letter-spacing:8px;margin-top:2px;opacity:.6}
.splash-tagline{color:var(--gold);font-size:1rem;font-weight:700;margin:12px 0}
.splash-desc{color:var(--t2);font-size:.85rem;line-height:1.8;margin-bottom:20px}

/* BUTTONS */
.btn{padding:12px 24px;border:none;border-radius:10px;font-size:.9rem;font-weight:700;cursor:pointer;width:100%;margin:4px 0;transition:all .2s}
.btn-primary{background:var(--gold);color:#000}.btn-secondary{background:var(--card);color:var(--t2);border:1px solid var(--bdr)}
.neon-glow{box-shadow:0 0 20px rgba(255,215,0,.25)}
.btn-back{background:none;border:none;color:var(--t2);font-size:1.2rem;cursor:pointer;padding:8px}

/* HEADER */
.screen-header{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--card);border-bottom:1px solid var(--bdr);flex-shrink:0}
.screen-header h2{font-size:1.1rem;flex:1}

/* HELP */
.help-content{padding:16px;overflow-y:auto;flex:1;padding-bottom:40px}
.help-section{margin-bottom:14px}
.help-section h3{color:var(--gold);font-size:.9rem;margin-bottom:4px}
.help-section p{color:var(--t2);font-size:.82rem;line-height:1.7}

/* HUD */
.hud{background:var(--card);border-bottom:1px solid var(--bdr);padding:8px 14px 6px;flex-shrink:0}
.hud-row1{display:flex;align-items:center;gap:8px;justify-content:space-between;margin-bottom:4px;flex-wrap:wrap}
.hud-day{font-size:.75rem;color:var(--t2);font-weight:700}
.hud-lives{font-size:.85rem;letter-spacing:1px}
.hud-cash{font-size:1rem;font-weight:900;color:var(--gold)}
.hud-combo{font-size:.7rem;color:var(--red);font-weight:700;background:rgba(255,51,68,.12);padding:2px 6px;border-radius:6px}
.hud-heat{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.heat-bar{flex:1;height:4px;background:var(--bdr);border-radius:2px;overflow:hidden}
.heat-fill{height:100%;border-radius:2px;transition:width .5s,background .5s;background:var(--green)}
.heat-icon{font-size:.7rem}
.hud-row2{display:flex;justify-content:space-between;font-size:.7rem}
.hud-debt{color:var(--red);cursor:pointer;font-weight:700}
.hud-loans{color:var(--cyan);cursor:pointer}
.hud-loc{color:var(--t2);cursor:pointer}
.hud-cash.ding{animation:ding .6s ease}
@keyframes ding{0%{transform:scale(1)}30%{transform:scale(1.3);color:var(--green)}100%{transform:scale(1)}}

/* CARD AREA */
.card-area{flex:1;display:flex;align-items:center;justify-content:center;padding:12px;overflow-y:auto}

/* CARDS */
.card{background:var(--card);border:1px solid var(--bdr);border-radius:18px;padding:20px 16px;max-width:380px;width:100%;text-align:center}
.card-wide{max-width:420px}
.card-collect{border-color:var(--red)}
.card-danger{border-color:var(--red);background:rgba(255,51,68,.05)}
.card-settlement{text-align:left}
.card-phase{font-size:.68rem;color:var(--t3);margin-bottom:10px;font-weight:700;letter-spacing:1px}
.card-emoji{font-size:3rem;margin-bottom:6px}
.card-name{font-size:1.05rem;font-weight:900;margin-bottom:3px}
.card-line{font-size:.88rem;color:var(--t2);margin-bottom:10px;line-height:1.6;font-style:italic}
.card-cues{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-bottom:12px}
.cue{font-size:.68rem;color:var(--yellow);background:rgba(255,230,0,.08);padding:3px 8px;border-radius:10px}

/* DEAL INFO */
.card-deal{background:rgba(255,255,255,.03);border-radius:10px;padding:10px 12px;margin-bottom:12px}
.deal-row{display:flex;justify-content:space-between;padding:3px 0;font-size:.82rem;color:var(--t2)}
.deal-row.highlight{color:var(--t1);font-weight:700;border-top:1px solid var(--bdr);padding-top:6px;margin-top:4px}
.deal-hi{color:var(--gold);font-weight:700}
.deal-profit{color:var(--green);font-weight:700}

/* CARD ACTIONS */
.card-actions{display:flex;gap:10px;margin-top:10px}
.btn-swipe{flex:1;padding:12px;border:none;border-radius:12px;font-size:.95rem;font-weight:700;cursor:pointer;transition:all .15s}
.btn-reject{background:rgba(255,51,68,.1);color:var(--red);border:2px solid var(--red)}
.btn-approve{background:rgba(57,255,20,.1);color:var(--green);border:2px solid var(--green)}
.btn-ok{background:rgba(255,215,0,.1);color:var(--gold);border:2px solid var(--gold)}
.btn-reject:active{background:var(--red);color:#fff}
.btn-approve:active{background:var(--green);color:#000}
.btn-ok:active{background:var(--gold);color:#000}
.disabled{opacity:.3;pointer-events:none}

/* CLIENT SELECTION GRID */
.client-grid{display:flex;flex-direction:column;gap:8px;margin-bottom:10px;text-align:left}
.client-option{background:var(--bg);border:1px solid var(--bdr);border-radius:12px;padding:12px;cursor:pointer;transition:all .15s}
.client-option:active{border-color:var(--gold);background:var(--card2)}
.co-head{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.co-emoji{font-size:1.6rem}
.co-name{font-weight:700;font-size:.9rem}
.co-risk{font-size:.7rem;font-weight:700}
.co-line{font-size:.78rem;color:var(--t2);font-style:italic;margin-bottom:6px}
.co-cues{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.co-deal{display:flex;justify-content:space-between;font-size:.75rem;color:var(--t3);padding-top:6px;border-top:1px solid var(--bdr)}

/* COLLECT */
.collect-options{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.btn-collect{background:var(--bg);border:1px solid var(--bdr);color:var(--t1);padding:10px 12px;border-radius:10px;font-size:.82rem;text-align:left;cursor:pointer;transition:all .15s}
.btn-collect:active{border-color:var(--gold);background:var(--card2)}
.collect-desc{font-size:.7rem;color:var(--t3);margin-top:2px}

/* SETTLEMENT */
.settlement-row{display:flex;gap:8px;align-items:center;padding:8px 10px;border-radius:8px;margin-bottom:5px;font-size:.82rem}
.settlement-row.good{background:rgba(57,255,20,.06);color:var(--green)}
.settlement-row.bad{background:rgba(255,51,68,.06);color:var(--red)}
.settlement-total{text-align:center;font-size:1.4rem;font-weight:900;color:var(--gold);margin:10px 0}
.combo-text{text-align:center;font-size:.82rem;color:var(--red);font-weight:700;margin:6px 0}
.eve-summary{display:flex;justify-content:space-between;font-size:.7rem;color:var(--t3);padding:8px 0;border-top:1px solid var(--bdr);margin-top:8px}

/* TUTORIAL */
.tut-text{text-align:left;font-size:.85rem;color:var(--t2);line-height:1.8;margin:12px 0}
.tut-text p{margin-bottom:8px}
.tut-text ul{margin:8px 0 8px 20px}
.tut-text li{margin-bottom:4px}
.tut-hint{font-size:.78rem;color:var(--yellow);background:rgba(255,230,0,.06);padding:8px 12px;border-radius:8px;margin:10px 0;text-align:left}

/* DISTRICT PICKER */
.district-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:12px 0}
.district-btn{background:var(--bg);border:1px solid var(--bdr);border-radius:10px;padding:10px 4px;text-align:center;cursor:pointer;transition:all .15s}
.district-btn.current{border-color:var(--gold);box-shadow:0 0 10px rgba(255,215,0,.15)}
.district-btn.locked{opacity:.35}
.district-name{display:block;font-size:.75rem;font-weight:700;margin-top:4px}
.district-desc{display:block;font-size:.55rem;color:var(--t3);margin-top:2px}
.district-cost{display:block;font-size:.6rem;color:var(--gold);margin-top:2px}

/* GAME OVER */
#gameover-screen{justify-content:center;align-items:center;text-align:center;background:var(--bg);background-image:radial-gradient(ellipse at 50% 30%,rgba(255,51,68,.08) 0%,transparent 60%)}
.go-reason{font-size:.82rem;color:var(--t3);margin-bottom:8px}
.go-net-label{font-size:.7rem;color:var(--t3)}
.go-net{font-size:2.2rem;font-weight:900;color:var(--gold);margin-bottom:8px}
.go-rank{margin-bottom:8px;font-size:1rem;font-weight:700}
.go-almost{color:var(--yellow);font-size:.82rem;font-weight:700;margin-bottom:6px;padding:8px;background:rgba(255,230,0,.06);border-radius:10px}
.go-blame{color:var(--t2);font-size:.78rem;font-style:italic;margin-bottom:10px}
.go-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--bdr);border-radius:10px;overflow:hidden;margin:12px 0}
.go-stat{background:var(--card);padding:10px;text-align:center}
.go-stat span:first-child{display:block;font-size:.6rem;color:var(--t3)}
.go-stat span:nth-child(2){display:block;font-size:.9rem;font-weight:700;color:var(--gold)}
.go-stat span:last-child{font-size:.6rem;color:var(--t3)}
.name-input{width:100%;padding:10px;background:var(--card);border:1px solid var(--bdr);border-radius:10px;color:var(--t1);font-size:.9rem;margin-bottom:8px;text-align:center}

/* LEADERBOARD */
.lb-row{display:flex;align-items:center;padding:10px 12px;border-bottom:1px solid var(--bdr);gap:12px}
.lb-rank{font-size:1.2rem;width:36px;text-align:center}
.lb-name{flex:1;font-size:.85rem}.lb-score{text-align:right;font-weight:700;color:var(--gold);font-size:.9rem}
.lb-title{font-size:.65rem;color:var(--t3)}
.gold{background:rgba(255,215,0,.04)}.silver{background:rgba(192,192,192,.04)}.bronze{background:rgba(205,127,50,.04)}

/* TOAST */
.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);background:var(--card);color:var(--t1);padding:10px 20px;border-radius:12px;border:1px solid var(--bdr);font-size:.8rem;font-weight:600;opacity:0;transition:opacity .3s;pointer-events:none;z-index:999;max-width:90%;text-align:center}
.toast.show{opacity:1}

/* SLIDER */
.trade-slider{width:100%;height:6px;-webkit-appearance:none;background:var(--bdr);border-radius:3px;outline:none;margin:12px 0}
.trade-slider::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:var(--gold);cursor:pointer}

@media(max-height:600px){.card{padding:14px 12px}.card-emoji{font-size:2.5rem}}
