#ftos-app{--bg:#070914;--panel:#0e1222;--panel2:#151a30;--line:#2a3150;--txt:#f7f8ff;--muted:#9aa6c7;--cyan:#44e5ff;--violet:#a879ff;--green:#5cf2a5;--yellow:#ffd166;--red:#ff6b7a;--shadow:0 20px 60px rgba(0,0,0,.28);color:var(--txt);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(circle at 80% -10%,#252052 0,transparent 33%),radial-gradient(circle at 0 20%,#082c3b 0,transparent 28%),var(--bg);min-height:760px;border-radius:18px;overflow:hidden}
#ftos-app *{box-sizing:border-box}#ftos-app button,#ftos-app input,#ftos-app select,#ftos-app textarea{font:inherit}#ftos-app button{cursor:pointer}#ftos-app .ftos-app{display:grid;grid-template-columns:270px 1fr;min-height:800px}#ftos-app .side{position:sticky;top:0;height:100vh;max-height:1000px;padding:22px 16px;border-right:1px solid var(--line);background:rgba(8,11,24,.95)}
#ftos-app .brand{display:flex;align-items:center;gap:12px;margin-bottom:20px}#ftos-app .logo{width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--cyan),var(--violet));display:grid;place-items:center;font-weight:1000;color:#07111a}#ftos-app .brand b{display:block;font-size:14px}#ftos-app .brand small,#ftos-app .muted{color:var(--muted)}#ftos-app .nav{display:grid;gap:6px}#ftos-app .nav button{border:1px solid transparent;background:transparent;color:var(--muted);padding:10px 11px;border-radius:11px;text-align:left}#ftos-app .nav button:hover,#ftos-app .nav button.active{background:linear-gradient(90deg,rgba(68,229,255,.12),rgba(168,121,255,.08));border-color:rgba(68,229,255,.25);color:var(--txt)}
#ftos-app .main{padding:26px;min-width:0}#ftos-app .top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}#ftos-app .eyebrow{color:var(--cyan);font-size:11px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase}#ftos-app h1{font-size:26px;margin:5px 0 0;color:#fff}#ftos-app h2{color:#fff}#ftos-app h3{color:#fff}#ftos-app .top-actions,#ftos-app .actions{display:flex;gap:8px;flex-wrap:wrap}#ftos-app .btn{border:1px solid var(--line);background:#151a30;color:var(--txt);padding:9px 12px;border-radius:10px}#ftos-app .btn:hover{border-color:#53628f}#ftos-app .btn.primary{background:linear-gradient(135deg,var(--cyan),#73a7ff 55%,var(--violet));border:0;color:#061018;font-weight:900}#ftos-app .btn.good{border-color:rgba(92,242,165,.4);color:var(--green)}#ftos-app .btn.warn{border-color:rgba(255,209,102,.45);color:var(--yellow)}#ftos-app .view{display:none}#ftos-app .view.active{display:block}
#ftos-app .grid{display:grid;gap:15px}#ftos-app .g4{grid-template-columns:repeat(4,minmax(0,1fr))}#ftos-app .g3{grid-template-columns:repeat(3,minmax(0,1fr))}#ftos-app .g2{grid-template-columns:repeat(2,minmax(0,1fr))}#ftos-app .card{background:linear-gradient(180deg,rgba(21,26,48,.96),rgba(12,16,32,.96));border:1px solid var(--line);border-radius:17px;padding:17px;box-shadow:var(--shadow)}#ftos-app .hero{padding:23px;background:linear-gradient(135deg,rgba(68,229,255,.12),rgba(168,121,255,.12))}#ftos-app .hero h2{font-size:28px;margin:7px 0 8px}#ftos-app .hero p{max-width:850px;color:#c7cee7;line-height:1.55}#ftos-app .metric .val{font-size:28px;font-weight:950;margin:4px 0}#ftos-app .metric small{color:var(--muted)}#ftos-app .section-title{display:flex;justify-content:space-between;align-items:flex-end;margin:24px 0 11px}#ftos-app .section-title h3{margin:0;font-size:18px}#ftos-app .section-title p{margin:3px 0 0;color:var(--muted);font-size:12px}
#ftos-app .pill,#ftos-app .badge{display:inline-flex;align-items:center;border:1px solid var(--line);background:#10162b;padding:6px 9px;border-radius:999px;color:#bec9e7;font-size:11px}#ftos-app .badge{border-radius:7px;padding:4px 7px;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.55px}#ftos-app .good{color:var(--green)!important}#ftos-app .warnText{color:var(--yellow)!important}#ftos-app .danger{color:var(--red)!important}#ftos-app .status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;background:currentColor;margin-right:6px}
#ftos-app .table-wrap{overflow:auto;border:1px solid var(--line);border-radius:13px}#ftos-app table{width:100%;min-width:700px;border-collapse:collapse}#ftos-app th,#ftos-app td{padding:11px 12px;border-bottom:1px solid var(--line);font-size:13px;text-align:left;color:#e9edfb}#ftos-app th{background:#0b0f20;color:#90a0c8;font-size:11px;text-transform:uppercase;letter-spacing:.7px}#ftos-app tr:last-child td{border-bottom:0}#ftos-app .rank{color:var(--cyan);font-weight:900}
#ftos-app .form{display:grid;gap:11px}#ftos-app .row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}#ftos-app .field label{display:flex;gap:6px;align-items:center;color:#aeb8d8;font-size:11px;font-weight:850;margin-bottom:6px;text-transform:uppercase;letter-spacing:.6px}#ftos-app .field input,#ftos-app .field select,#ftos-app .field textarea{width:100%;border:1px solid var(--line);background:#090d1c;color:var(--txt);border-radius:10px;padding:10px;outline:none}#ftos-app .field textarea{min-height:80px}#ftos-app .field input:focus,#ftos-app .field select:focus,#ftos-app .field textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(68,229,255,.08)}
#ftos-app .callout{border-left:3px solid var(--cyan);background:rgba(68,229,255,.07);padding:12px 13px;border-radius:0 11px 11px 0;color:#cfd8f3;line-height:1.5}#ftos-app .callout.warn{border-left-color:var(--yellow);background:rgba(255,209,102,.07)}#ftos-app .stage-list{display:grid;gap:8px}#ftos-app .stage{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;background:#0b0f20}#ftos-app .stage .n{width:28px;height:28px;border-radius:9px;background:linear-gradient(135deg,#1e3559,#3b275e);display:grid;place-items:center;font-weight:900}#ftos-app .stage small{display:block;color:var(--muted)}#ftos-app .explain{margin-top:9px;color:#b9c3df;font-size:12px;line-height:1.5}#ftos-app .helpBtn{width:20px;height:20px;border-radius:50%;padding:0;border:1px solid #4e5c86;background:#11182c;color:#aeefff;font-size:12px;font-weight:900}
#ftos-app .connection-card{position:relative}#ftos-app .connection-card .state{position:absolute;right:16px;top:16px}#ftos-app .island-result pre{white-space:pre-wrap;word-break:break-word;background:#080b16;border:1px solid var(--line);padding:12px;border-radius:10px;max-height:280px;overflow:auto;color:#bfeefa;font-size:11px}#ftos-app .empty{padding:25px;text-align:center;color:var(--muted)}#ftos-app .toast{position:fixed;right:22px;bottom:22px;background:#11172c;border:1px solid #3c4c78;color:#fff;padding:12px 15px;border-radius:11px;box-shadow:var(--shadow);display:none;z-index:99999}#ftos-app .toast.show{display:block}#ftos-app .modal{position:fixed;inset:0;background:rgba(3,5,12,.78);display:none;align-items:center;justify-content:center;padding:20px;z-index:99998}#ftos-app .modal.show{display:flex}#ftos-app .modal-panel{max-width:680px;width:100%;max-height:80vh;overflow:auto;background:#10162a;border:1px solid #39476e;border-radius:16px;padding:20px}#ftos-app .modal-panel h3{margin-top:0}#ftos-app .help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}#ftos-app .help-card{border:1px solid var(--line);border-radius:13px;padding:14px;background:#0c1122}#ftos-app .help-card h4{margin:0 0 6px;color:#fff}#ftos-app .help-card p{margin:0;color:#b7c0db;font-size:12px;line-height:1.5}#ftos-app code{color:#b8f4ff;background:#090d18;padding:2px 5px;border-radius:5px}
@media(max-width:1080px){#ftos-app .ftos-app{grid-template-columns:90px 1fr}#ftos-app .brand div:not(.logo),#ftos-app .nav span{display:none}#ftos-app .nav button{text-align:center}#ftos-app .g4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){#ftos-app .ftos-app{display:block}#ftos-app .side{height:auto;position:sticky;top:0;z-index:30;max-height:none;padding:9px;border-right:0;border-bottom:1px solid var(--line)}#ftos-app .brand{display:none}#ftos-app .nav{display:flex;overflow:auto}#ftos-app .nav button{white-space:nowrap}#ftos-app .nav span{display:inline}#ftos-app .main{padding:15px}#ftos-app .top{flex-direction:column}#ftos-app .g4,#ftos-app .g3,#ftos-app .g2,#ftos-app .row,#ftos-app .help-grid{grid-template-columns:1fr}#ftos-app .hero h2{font-size:23px}}
#ftos-app .btn:disabled{opacity:.45;cursor:not-allowed;filter:saturate(.5)}
#ftos-app .btn.danger{border-color:rgba(255,95,122,.45);color:var(--red);background:rgba(255,95,122,.06)}
#ftos-app .consent-row{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:#0b0f20;color:#d8def2;line-height:1.45;margin:10px 0 13px}
#ftos-app .consent-row input{width:auto;margin-top:3px;accent-color:var(--cyan)}
#ftos-app .soft{border:0;border-top:1px solid var(--line);margin:18px 0}
#ftos-app a{color:var(--cyan);text-decoration:none}#ftos-app a:hover{text-decoration:underline}
#ftos-app .stage .explain{margin-top:5px}

/* v0.3.1 — Área del jugador */
.ftos-app.player-area .side{background:linear-gradient(180deg,#070c1d 0%,#0b1230 100%)}
.ftos-app.player-area .brand small{color:#8eb7ff}
.ftos-app.player-area .top{border-bottom:1px solid rgba(112,183,255,.16)}
.ftos-app.player-area .nav button span{font-weight:600}
.ftos-app .btn[disabled]{opacity:.5;cursor:not-allowed;pointer-events:none}
.ftos-app a.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}

/* v0.3.2 — Acceso y paneles por rol */
#ftos-app .ftos-session-link{display:inline-flex;align-items:center;justify-content:center;padding:6px 10px;border:1px solid var(--line);border-radius:999px;color:#dfe7ff;text-decoration:none;font-size:11px;background:#0e152a}
#ftos-app .ftos-session-link:hover{border-color:#5e71a6;text-decoration:none;background:#151f3a}
#ftos-app .role-player .side{background:linear-gradient(180deg,#070c1d 0%,#0b1230 100%)}
#ftos-app .role-organizer .side{background:linear-gradient(180deg,#08121d 0%,#102319 100%)}
#ftos-app .role-moderator .side{background:linear-gradient(180deg,#160d16 0%,#26121f 100%)}
#ftos-app .role-administrator .side{background:linear-gradient(180deg,#080b18 0%,#15122d 100%)}
#ftos-app .role-organizer .logo{background:linear-gradient(135deg,#55f0bd,#91d96f)}
#ftos-app .role-moderator .logo{background:linear-gradient(135deg,#ffd166,#ff768e)}
#ftos-app .role-administrator .logo{background:linear-gradient(135deg,var(--cyan),var(--violet))}
#ftos-app .top-actions{align-items:center}
@media(max-width:760px){#ftos-app .top-actions{width:100%}#ftos-app .ftos-session-link{margin-left:auto}}

/* v0.3.3 — Navegación FTOS y experiencia de aplicación */
#ftos-app .ftos-app.standalone .top{margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid rgba(119,145,211,.16)}
#ftos-app .ftos-app.standalone .main{padding-top:22px}
#ftos-app .ftos-app.standalone .top-actions{display:none}
@media(max-width:760px){#ftos-app .ftos-app.standalone .main{padding-top:14px}}
/* v0.3.4 · Cuentas y permisos */
#ftos-app .accountRole{min-width:135px;border:1px solid var(--line);background:#090d1c;color:var(--txt);border-radius:9px;padding:8px 9px;outline:none}#ftos-app .accountRole:focus{border-color:var(--cyan)}

/* v0.4 — Motor de torneos */
#ftos-app .engine-manager{overflow:hidden}
#ftos-app .compact{grid-template-columns:minmax(180px,1fr) auto;align-items:end;margin-bottom:12px}
#ftos-app .compact select{width:100%;border:1px solid var(--line);background:#090d1c;color:var(--txt);border-radius:10px;padding:10px}
#ftos-app .tournament-stage{margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:15px;background:rgba(7,10,22,.52)}
#ftos-app .stage-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
#ftos-app .stage-head h3{margin:7px 0 0}
#ftos-app .ftos-bracket{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 12px;scrollbar-color:#53628f #0b0f20}
#ftos-app .ftos-round{min-width:245px;display:grid;align-content:start;gap:10px}
#ftos-app .ftos-round h4{margin:0;color:#a9b8df;font-size:12px;text-transform:uppercase;letter-spacing:.7px}
#ftos-app .fixture-card{border:1px solid var(--line);border-radius:13px;background:#0a0f20;padding:11px;box-shadow:0 9px 25px rgba(0,0,0,.2)}
#ftos-app .fixture-card.status-ready,#ftos-app .fixture-card.status-scheduled{border-color:rgba(68,229,255,.34)}
#ftos-app .fixture-card.status-awaiting_confirmation{border-color:rgba(255,209,102,.38)}
#ftos-app .fixture-card.status-completed,#ftos-app .fixture-card.status-bye{border-color:rgba(92,242,165,.28)}
#ftos-app .fixture-top{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:8px;color:#8fa5d4;font-size:11px}
#ftos-app .fixture-player{padding:8px 9px;border-radius:9px;background:#11172c;color:#eaf0ff;font-weight:750}
#ftos-app .fixture-player.winner{background:rgba(92,242,165,.1);border:1px solid rgba(92,242,165,.24);color:var(--green)}
#ftos-app .fixture-vs{text-align:center;color:#7180a8;font-size:10px;text-transform:uppercase;padding:3px}
#ftos-app .fixture-result{margin-top:8px;color:#b8c3df;font-size:12px}
#ftos-app .fixture-card .actions{margin-top:9px}
#ftos-app .engine-manager .stage{grid-template-columns:34px minmax(0,1fr) auto auto}
@media(max-width:760px){#ftos-app .compact{grid-template-columns:1fr}#ftos-app .ftos-round{min-width:220px}#ftos-app .engine-manager .stage{grid-template-columns:34px 1fr}#ftos-app .engine-manager .stage>.btn,#ftos-app .engine-manager .stage>select{grid-column:2}}


/* v0.4.2 — Reprogramación y zonas horarias */
#ftos-app .fixture-schedule{margin-top:9px;padding:9px 10px;border:1px solid rgba(68,229,255,.18);border-radius:9px;background:rgba(68,229,255,.045);color:#dce7ff;font-size:12px;line-height:1.45}
#ftos-app .fixture-schedule small{display:block;margin-top:3px;color:#91a2cb}
#ftos-app input[type="datetime-local"]{color-scheme:dark}


/* v0.4.3 — Pulido del Motor de torneos */
#ftos-app .fixture-rest-card{border-style:solid;background:linear-gradient(180deg,rgba(92,242,165,.045),rgba(92,242,165,.018))}
#ftos-app .fixture-rest-card .fixture-player{margin-bottom:8px}
#ftos-app .fixture-rest-note{font-size:.88rem;color:var(--muted);padding:0 2px 4px}

/* v0.5 — Gestión avanzada de torneos y experiencia del jugador */
.tournament-discovery{display:flex;flex-direction:column;gap:10px}
.tournament-discovery .compact-metrics{gap:8px}
.tournament-discovery .compact-metrics>div{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(8,15,36,.42);display:flex;justify-content:space-between;align-items:center}
.tournament-discovery .compact-metrics small{color:var(--muted)}
.public-tournament-detail{overflow:hidden}
.notification-item.unread{border-color:rgba(69,211,255,.5);box-shadow:inset 3px 0 0 rgba(69,211,255,.8)}
.notification-item .explain{margin-top:6px}
.tournament-experience-card{background:linear-gradient(135deg,rgba(13,31,52,.78),rgba(26,25,66,.74))}
.small-val{font-size:18px!important;line-height:1.25!important}
@media (max-width:780px){.tournament-discovery .compact-metrics{grid-template-columns:1fr 1fr}.public-tournament-detail .g4{grid-template-columns:1fr 1fr}}
