/* =========================================================
NodeClash Tournament Platform — UI styles
Extends the existing NodeClash glass/nature design language
(styles.css). Original identity — no third-party branding.
========================================================= */

.tp-wrap{min-height:100vh;position:relative;z-index:3;padding:14px;display:flex;flex-direction:column;gap:14px;}

.tp-hero{padding:22px;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:18px;align-items:center;}
.tp-hero h1{margin:6px 0 8px;font-size:clamp(1.9rem,3.4vw,3rem);font-weight:900;line-height:1.04;}
.tp-hero p{margin:0;color:rgba(255,255,255,.9);line-height:1.6;}
.tp-mode-chip{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:999px;font-size:.78rem;font-weight:800;letter-spacing:.04em;}
.tp-mode-demo{background:rgba(255,193,7,.16);border:1px solid rgba(255,193,7,.45);color:#ffd76a;}
.tp-mode-live{background:rgba(56,224,175,.14);border:1px solid rgba(56,224,175,.45);color:#7ff0cf;}

.tp-actions{display:grid;gap:10px;}
.tp-actions .btn{width:100%;}

.tp-tabs{display:flex;gap:8px;flex-wrap:wrap;padding:10px;}
.tp-tab{border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:8px 16px;font-weight:800;font-size:.86rem;color:rgba(255,255,255,.92);cursor:pointer;background:rgba(255,255,255,.06);transition:all .18s ease;}
.tp-tab:hover{background:rgba(255,255,255,.12);}
.tp-tab.active{background:linear-gradient(135deg,#5bb8ff,#98fff0);color:#06283d;border-color:transparent;box-shadow:0 6px 18px rgba(91,184,255,.3);}

.tp-view{display:none;flex-direction:column;gap:14px;}
.tp-view.active{display:flex;}

.tp-grid{display:grid;gap:14px;}
.tp-grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr));}
.tp-grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr));}

.tp-card{padding:18px;display:flex;flex-direction:column;gap:10px;}
.tp-card h3{margin:0;font-size:1.05rem;font-weight:900;}
.tp-stat{display:flex;justify-content:space-between;gap:10px;font-size:.92rem;}
.tp-stat span{color:rgba(255,255,255,.75);}
.tp-stat strong{color:#fff;font-weight:800;text-align:right;}

.tnmt-card{padding:16px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.03));display:flex;flex-direction:column;gap:8px;}
.tnmt-card:hover{border-color:rgba(91,184,255,.4);}
.tnmt-card .tnmt-name{font-weight:900;font-size:1.02rem;}
.tnmt-meta{display:flex;flex-wrap:wrap;gap:6px;}
.tnmt-badge{padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.03em;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);}
.tnmt-badge.s-OPEN_FOR_JOINING{background:rgba(56,224,175,.15);border-color:rgba(56,224,175,.4);color:#7ff0cf;}
.tnmt-badge.s-FULL,.tnmt-badge.s-READY{background:rgba(91,184,255,.16);border-color:rgba(91,184,255,.4);color:#a9d8ff;}
.tnmt-badge.s-IN_PROGRESS{background:rgba(255,210,77,.14);border-color:rgba(255,210,77,.4);color:#ffe08a;}
.tnmt-badge.s-SETTLED,.tnmt-badge.s-COMPLETED{background:rgba(160,120,255,.16);border-color:rgba(160,120,255,.4);color:#cdbaff;}
.tnmt-badge.s-PAYMENT_REQUIRED,.tnmt-badge.s-PAYMENT_UNDER_REVIEW,.tnmt-badge.s-PAYMENT_SUBMITTED{background:rgba(255,167,38,.14);border-color:rgba(255,167,38,.4);color:#ffcf91;}
.tnmt-badge.s-PAYMENT_REJECTED,.tnmt-badge.s-CANCELLED{background:rgba(255,82,82,.14);border-color:rgba(255,82,82,.4);color:#ffab9e;}

/* wizard */
.tp-modal{position:fixed;inset:0;z-index:300;display:none;align-items:flex-start;justify-content:center;background:rgba(4,10,22,.55);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:26px 14px;overflow:auto;}
.tp-modal.show{display:flex;}
.tp-wizard{width:min(760px,100%);}
.tp-steps{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px;}
.tp-step-dot{font-size:.72rem;font-weight:800;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.7);}
.tp-step-dot.active{background:linear-gradient(135deg,#5bb8ff,#98fff0);color:#06283d;}
.tp-step-dot.done{color:#7ff0cf;border-color:rgba(56,224,175,.4);}
.tp-wizard h2{margin:0 0 4px;font-size:1.4rem;font-weight:900;}
.tp-wizard .wiz-sub{margin:0 0 14px;color:rgba(255,255,255,.82);font-size:.92rem;}
.wiz-step{display:none;flex-direction:column;gap:10px;}
.wiz-step.active{display:flex;}
.wiz-nav{display:flex;justify-content:space-between;gap:10px;margin-top:14px;}

.econ-box{border:1px solid rgba(255,210,77,.35);border-radius:16px;padding:14px;background:rgba(255,210,77,.06);display:flex;flex-direction:column;gap:8px;}
.econ-row{display:flex;justify-content:space-between;font-size:.95rem;}
.econ-row.total{border-top:1px dashed rgba(255,255,255,.25);padding-top:8px;font-weight:900;}
.econ-hint{font-size:.78rem;color:rgba(255,255,255,.72);}

/* bracket */
.bracket-wrap{overflow-x:auto;padding:6px 2px 14px;}
.bracket-rounds{display:flex;gap:18px;align-items:stretch;min-width:max-content;}
.bracket-round{display:flex;flex-direction:column;justify-content:space-around;gap:12px;min-width:230px;}
.bracket-round-title{font-size:.78rem;font-weight:900;letter-spacing:.06em;color:rgba(255,255,255,.75);text-transform:uppercase;}
.bracket-match{border:1px solid rgba(255,255,255,.16);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));padding:10px;display:flex;flex-direction:column;gap:6px;}
.bracket-match .bm-players{display:flex;flex-direction:column;gap:4px;}
.bm-player{display:flex;justify-content:space-between;gap:8px;font-size:.88rem;padding:4px 8px;border-radius:8px;background:rgba(255,255,255,.05);}
.bm-player.winner{background:rgba(56,224,175,.16);color:#8ff2d4;font-weight:800;}
.bm-player .seed{opacity:.65;font-size:.75rem;}
.bm-foot{display:flex;justify-content:space-between;align-items:center;font-size:.74rem;color:rgba(255,255,255,.7);}
.bm-key{font-weight:900;letter-spacing:.04em;}
.bm-status{padding:2px 8px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);}

/* odds + stakes */
.odds-duel{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;text-align:center;}
.odds-side{padding:16px;border-radius:18px;border:1px solid rgba(255,255,255,.16);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.03));cursor:pointer;transition:all .15s ease;}
.odds-side:hover{border-color:rgba(91,184,255,.5);}
.odds-side.selected{border-color:#5bb8ff;box-shadow:0 0 0 2px rgba(91,184,255,.35),0 10px 24px rgba(91,184,255,.22);}
.odds-side .sym{font-size:1.8rem;font-weight:900;}
.odds-side .price{font-size:1.7rem;font-weight:900;color:#ffe27f;}
.odds-side .prob{font-size:.85rem;color:rgba(255,255,255,.8);}
.odds-vs{font-weight:900;font-size:1.1rem;color:rgba(255,255,255,.7);}
.odds-indicators{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;}
.indicator{padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);}
.indicator span{display:block;font-size:.7rem;font-weight:800;letter-spacing:.05em;color:rgba(255,255,255,.65);text-transform:uppercase;margin-bottom:4px;}
.indicator strong{font-size:.92rem;}
.odds-why{font-size:.84rem;color:rgba(255,255,255,.82);line-height:1.6;}
.stake-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;}
.stake-summary .indicator strong{font-size:1.05rem;}
.risk-note{font-size:.78rem;color:rgba(255,220,150,.9);line-height:1.5;}

/* admin */
.apay-item{border:1px solid rgba(255,255,255,.14);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px;background:rgba(255,255,255,.05);}
.apay-actions{display:flex;gap:8px;flex-wrap:wrap;}
.settle-item{border-left:3px solid #98fff0;padding:8px 12px;background:rgba(255,255,255,.05);border-radius:0 12px 12px 0;margin-bottom:8px;}
.audit-line{font-size:.78rem;color:rgba(255,255,255,.75);padding:4px 0;border-bottom:1px dashed rgba(255,255,255,.12);}
.audit-line b{color:#fff;}

.tp-empty{padding:26px;text-align:center;color:rgba(255,255,255,.7);border:1px dashed rgba(255,255,255,.2);border-radius:16px;}

.share-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.share-code{font-family:ui-monospace,Menlo,monospace;font-size:1.3rem;font-weight:900;letter-spacing:.12em;color:#ffe27f;background:rgba(255,210,77,.08);border:1px dashed rgba(255,210,77,.4);padding:8px 16px;border-radius:12px;}

/* legacy quick join */
.legacy-panel{margin-top:4px;}
.legacy-toggle{font-size:.8rem;font-weight:800;color:rgba(255,255,255,.7);cursor:pointer;background:none;border:none;padding:6px 0;text-align:left;}
.legacy-body{display:none;flex-direction:column;gap:10px;}
.legacy-body.show{display:flex;}

/* creator dashboard additions */
.status-track{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.status-track .step{padding:5px 12px;border-radius:999px;font-size:.74rem;font-weight:800;letter-spacing:.03em;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);color:rgba(255,255,255,.65);}
.status-track .step.done{color:#7ff0cf;border-color:rgba(56,224,175,.45);background:rgba(56,224,175,.10);}
.status-track .step.current{color:#06283d;background:linear-gradient(135deg,#5bb8ff,#98fff0);border-color:transparent;box-shadow:0 4px 14px rgba(91,184,255,.28);}

.progress-bar{height:10px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14);overflow:hidden;}
.progress-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#5bb8ff,#98fff0);box-shadow:0 0 12px rgba(91,184,255,.35);transition:width .35s ease;}

.player-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;}
.player-card.mini{padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));display:flex;flex-direction:column;gap:6px;}
.player-card{animation:cardIn .28s ease both;}
@keyframes cardIn{from{opacity:0;transform:translateY(4px);}to{opacity:1;transform:none;}}
.pc-name{font-weight:900;font-size:.95rem;}

.payout-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;}
.payout-card{padding:12px;border-radius:14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);display:flex;flex-direction:column;gap:4px;}
.payout-card span{font-size:.72rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:rgba(255,255,255,.7);}
.payout-card strong{font-size:1.1rem;font-weight:900;}
.payout-card em{font-style:normal;font-size:.76rem;color:rgba(255,255,255,.7);}
.payout-card.tier-gold{border-color:rgba(255,210,77,.45);background:rgba(255,210,77,.08);}
.payout-card.tier-gold strong{color:#ffe27f;}
.payout-card.tier-silver{border-color:rgba(200,220,255,.4);background:rgba(200,220,255,.07);}
.payout-card.tier-silver strong{color:#cfe2ff;}
.payout-card.tier-bronze{border-color:rgba(255,167,110,.4);background:rgba(255,167,110,.07);}
.payout-card.tier-bronze strong{color:#ffc9a1;}
.payout-card.tier-reentry strong{color:#7ff0cf;}
.payout-card.tier-reentry{border-color:rgba(56,224,175,.4);background:rgba(56,224,175,.07);}

.match-card{border-left:3px solid rgba(91,184,255,.5);}

@media (prefers-reduced-motion: reduce){
  .player-card{animation:none;}
  .progress-fill{transition:none;}
}

@media (max-width:1000px){
  .tp-hero{grid-template-columns:1fr;}
  .tp-grid.cols-2,.tp-grid.cols-3{grid-template-columns:1fr;}
  .odds-duel{grid-template-columns:1fr;}
  .odds-vs{transform:rotate(90deg);}
}