/* RC Greenlight — THE PLAYER APP (rev246, owner 2026-10-12: approved mockup, "Ship Rev 245 and build the portal").
   Linked LAST on portal.html, after coach-app.css, which draws the shell both apps share (the rail, the tabs, the
   site menu across the top, the bar's Sign out, the player and event rows). This file adds what the portal had no
   copy of: the dashboard's panels, headings and Needs you box, the event chips, and Settings showing every panel at
   once. Shape, type and layout only; colours come from portal.html's :root, and score colours never change.
   player-app.js sets body.pa-on (with body.ca-on) only while a PLAYER is signed in. */

#pa-app{max-width:920px;margin:0 auto;}
/* The demo-only note (portal.html .demo-note) is a flex row, so every text run became its own column on a phone.
   In the app it reads as one paragraph. */
body.pa-on #v-portal > .demo-note{display:block;max-width:920px;margin:0 auto 18px;}
body.pa-on #v-portal > .demo-note .mono{margin-right:8px;}
#pa-app .pa-screen[hidden]{display:none!important;}
/* While the app is on, the one-long-page pieces it replaces step aside: the old header and its line, the tray's
   button row (its panels now live on Settings and Plans), the up-next card (Home's Needs you says the same). */
body.pa-on #v-portal > .phead,body.pa-on #v-portal > .sub,body.pa-on #v-portal > [data-tray-row],
body.pa-on #ptop-row,body.pa-on #upgrade-box,body.pa-on #upnext{display:none!important;}
/* The app's own panels stay square, as the coach dashboard's do (#v-coach .panel, coach-dash.css): the racing cut
   (racing-app.css) takes a row's first letters. The portal's own cards moved into the screens (report cards, the
   account, coaches and team cards) keep the slant they have today. */
#pa-app .panel,#pa-app .needs,#pa-app .panel .rc-slant,#pa-homehead .rc-slant,#pa-needs .rc-slant{clip-path:none!important;background-image:none!important;}
/* The badge's base (coach-dash.css, which the portal does not load); coach-app.css colours and places it. */
.ca-rail .ca-badge,.ca-tabs .ca-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;font-family:var(--mono);font-style:normal;font-size:11px;font-weight:700;}

/* ---------- headings and panels (the dashboard's, rcgl-console.css + coach-dash.css) ---------- */
#pa-app .head{display:flex;align-items:flex-end;justify-content:space-between;gap:14px 20px;margin-bottom:18px;flex-wrap:wrap;}
#pa-app .cd-head{min-width:0;flex:1 1 320px;}
#pa-app .head h1{font-family:var(--head);font-weight:800;font-size:30px;letter-spacing:-.02em;overflow-wrap:anywhere;}
#pa-app .head .sub{font-size:14px;color:var(--ink-700);margin-top:4px;}
#pa-app .pa-hact{flex:none;}
#pa-app .btn-dark{background:var(--pine-950);color:#fff;border-color:var(--pine-950);}
#pa-app .btn-dark:hover{background:var(--forest-800);}
#pa-app .panel{background:#fff;border:1px solid var(--border);overflow:hidden;margin-bottom:22px;}
#pa-app .panel-h{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 14px;padding:18px 22px;border-bottom:1px solid var(--border);}
#pa-app .panel-h h2{font-family:var(--head);font-weight:700;font-size:18px;}
#pa-app .panel-h .btn{padding:8px 14px;font-size:11.5px;}
#pa-app .empty{padding:22px;text-align:left;color:var(--ink-700);font-size:14px;}
.pa-why{display:block;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;line-height:1.55;color:var(--ink-700);margin-bottom:14px;}
.pa-why:hover{color:var(--ink-900);}
.pa-pad{padding:16px 22px 0;font-size:14.5px;line-height:1.55;color:var(--ink-700);}
.pa-pad b{color:var(--ink-900);}
.pa-pad-b{padding-bottom:18px;}

/* ---------- Needs you ---------- */
#pa-app .needs{background:#FBF3E2;border:1px solid #EBD39C;padding:14px 20px 16px;display:flex;flex-direction:column;gap:12px;margin-bottom:22px;}
#pa-app .needs.clear{background:#fff;border-color:var(--border);flex-direction:row;align-items:baseline;gap:4px 12px;padding:12px 20px;flex-wrap:wrap;}
#pa-app .needs.pa-info{background:#fff;border-color:var(--border);}
#pa-app .needs-h{font-family:var(--rc-race,var(--head));font-style:italic;font-stretch:116%;font-weight:900;font-size:15px;text-transform:uppercase;letter-spacing:.02em;color:var(--ink-900);}
#pa-app .needs-ok{font-size:13.5px;color:var(--ink-700);}
#pa-app .needs-ok a{color:var(--fairway-700);font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.pa-need{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;flex-wrap:wrap;font-size:15px;line-height:1.5;color:var(--ink-900);}
.pa-need > span{flex:1 1 280px;min-width:0;}
.pa-need .btn{flex:none;padding:9px 16px;font-size:12px;background:#fff;color:var(--ink-900);border-color:var(--border);}
.pa-need .btn:hover{border-color:var(--ink-900);}

/* ---------- Your events: one row per event, one chip per report ---------- */
#pa-app .pa-erow{cursor:default;grid-template-columns:auto minmax(0,1fr);}
#pa-app .pa-erow:hover{background:transparent;}
#pa-app .pa-erow .ca-pact{display:none;}
.pa-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;}
.pa-chip{display:inline-flex;align-items:center;min-height:30px;padding:4px 12px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;
  clip-path:polygon(5px 0,100% 0,calc(100% - 5px) 100%,0 100%);background:rgba(16,25,20,.07);color:var(--ink-700);text-decoration:none;}
a.pa-chip:hover{background:rgba(16,25,20,.14);color:var(--ink-900);}
a.pa-chip:focus-visible{outline:2px solid var(--forest-800);outline-offset:2px;}
.pa-chip.on{background:var(--lime-500);color:var(--pine-950);}
a.pa-chip.on:hover{background:var(--lime-400);}
.pa-chip.wait{background:transparent;color:var(--ink-700);box-shadow:inset 0 0 0 1px rgba(16,25,20,.32);}

/* ---------- the moved sections ---------- */
/* Settings: every panel open at once. The tray showed one at a time and hides the rest inline; a panel with
   nothing in it (or notifications on a browser without push) stays hidden. */
body.pa-on #pa-app [data-slot="settings"] > [data-tray-panel]:not(:empty),
body.pa-on #pa-app #rcgl-app-card[data-avail="1"],
body.pa-on #pa-app #rcgl-app-guide:not(:empty){display:block!important;}
#pa-app [data-slot="settings"] > *{margin:0 0 18px!important;max-width:none!important;}
#pa-app [data-slot="settings"] .addcoach,#pa-app [data-slot="plans"] .addcoach{margin-top:0!important;}
#pa-app [data-slot="plans"] > *{margin-bottom:22px;}
#pa-app [data-slot="plans"] > #practice-cta{margin:0 0 22px!important;}
#pa-app #gir-snapshot{margin:0;}
#pa-app #ptl{margin-top:0;}
/* The report list's Plans and Reports filters are spare once plans have their own screen. */
body.pa-on #ptabs [data-f="plans"],body.pa-on #ptabs [data-f="reports"]{display:none!important;}
#pa-app #newreq{margin-top:0!important;margin-bottom:22px;}

@media(max-width:640px){
  #pa-app .panel-h{padding:16px;}
  #pa-app .head h1{font-size:26px;}
  #pa-app .needs{padding:14px 16px 16px;}
  #pa-app .needs.clear{padding:12px 16px;}
  .pa-pad{padding-left:16px;padding-right:16px;}
}
/* rev343 (owner 2026-10-27: the player dashboard wears the brand of "the head coach of the academy or their stand alone
   coach"): as the coach screens (coach-app.css rev342) — dark buttons and each panel's top edge in the brand's chrome,
   the selected filter chip in its readable accent. Status, report-kind and data colours are untouched. */
body.ca-brand #pa-app .btn-dark{background:var(--ca-chrome);border-color:var(--ca-chrome);color:#fff;}
body.ca-brand #pa-app .panel{box-shadow:inset 0 3px 0 var(--ca-chrome);}
body.ca-brand .pa-chip.on{background:var(--ca-ornt);color:var(--ca-chrome);}