:root{--navy:#061426;--navy2:#0a2039;--cyan:#4ccde5;--blue:#526fff;--violet:#7b65ff;--ink:#0b1d34;--muted:#68798b;--line:#dae5ed;--paper:#f3f7fa;--green:#32b978}*{box-sizing:border-box}body{margin:0;font-family:Geist,Inter,Arial,sans-serif;background:var(--paper);color:var(--ink);min-height:100vh}.demo-side{position:fixed;left:0;top:0;bottom:0;width:260px;background:radial-gradient(circle at 50% 0,#123555,transparent 38%),var(--navy);color:#fff;padding:25px 20px;display:flex;flex-direction:column}.demo-brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}.demo-brand>span{width:39px;height:39px;border-radius:10px;background:#fff;overflow:hidden}.demo-brand img{width:42px}.demo-brand div{display:flex;flex-direction:column}.demo-brand strong{font-size:19px}.demo-brand small{color:var(--cyan);font-size:8px;letter-spacing:.14em;font-weight:900}.academy-id{display:flex;gap:10px;align-items:center;padding:16px;margin:32px 0 22px;border:1px solid #6fd5e531;border-radius:15px;background:#ffffff08}.academy-id>span{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#4dcde5;color:#061426;font-weight:900}.academy-id div{display:flex;flex-direction:column;gap:3px}.academy-id small{font-size:8px;letter-spacing:.12em;color:#64cfe4}.academy-id b{font-size:12px}.demo-side nav p{font-size:9px;letter-spacing:.16em;color:#6e8da7;margin:16px 12px}.role{width:100%;padding:13px;border:0;border-radius:11px;background:transparent;color:#9eb2c3;text-align:left;font:inherit;font-size:14px;cursor:pointer;margin:3px 0}.role span{display:inline-block;width:24px;color:#55cfe6}.role.active{background:#17344f;color:#fff;box-shadow:inset 3px 0 var(--cyan)}.demo-note{margin-top:auto;padding:15px;border:1px solid #5dd1e42d;border-radius:14px;background:#092039}.demo-note b{font-size:9px;letter-spacing:.14em;color:var(--cyan)}.demo-note p{font-size:11px;line-height:1.55;color:#8fa8bc;margin:7px 0 0}.back-link{font-size:11px;color:#7795ad;text-decoration:none;margin-top:18px}.demo-main{margin-left:260px;padding:0 42px 60px}.demo-main>header{height:100px;display:flex;align-items:center;border-bottom:1px solid var(--line)}.demo-main header p{margin:0 0 5px;color:#21a8c4;font-size:9px;font-weight:900;letter-spacing:.17em}.demo-main header h1{margin:0;font-size:26px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.live-dot{padding:7px 10px;border-radius:999px;background:#e2f6f8;color:#1895ad;font-size:9px;font-weight:900}.header-actions button{width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:#fff;font-weight:900;cursor:pointer}.view{display:none;padding-top:32px}.view.active{display:block}.coach-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:25px;box-shadow:0 12px 35px #18344d0c}.panel-title{display:flex;justify-content:space-between;align-items:flex-start}.panel-title small,.panel>small,.feedback-block small,.event small{color:#27a8c4;font-size:9px;font-weight:900;letter-spacing:.14em}.panel-title h2{margin:8px 0 23px;font-size:22px}.panel-title>span{font-size:9px;color:#8294a4;border:1px solid var(--line);padding:6px 9px;border-radius:999px}.record-panel label{font-size:12px;font-weight:800;display:block;margin:10px 0 7px}.record-panel select{width:100%;height:46px;border:1px solid var(--line);border-radius:10px;padding:0 12px;background:#fff;font-size:14px}.voice-box{min-height:218px;margin:18px 0;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #9ccbd5;border-radius:17px;background:#f6fbfc;text-align:center}.voice-box>button{width:70px;height:70px;border-radius:50%;border:8px solid #d9f1f5;background:var(--cyan);color:#061426;font-size:19px;cursor:pointer;box-shadow:0 0 0 8px #ecf8fa}.voice-box.recording>button{background:#ff6572;animation:pulse 1s infinite}.voice-box b{font-size:14px;margin-top:20px}.voice-box p{font-size:11px;color:#8596a5}.wave{display:none;height:28px;align-items:center;gap:4px}.recording .wave{display:flex}.wave i{width:3px;background:#e34d5d;border-radius:4px;animation:wave .7s infinite alternate}.wave i:nth-child(2n){animation-delay:.2s}.wave i:nth-child(3n){animation-delay:.4s}@keyframes wave{from{height:5px}to{height:26px}}@keyframes pulse{50%{box-shadow:0 0 0 15px #ff657222}}.transcript{padding:15px;border-left:3px solid var(--cyan);background:#eef8fa;border-radius:0 10px 10px 0;margin:15px 0}.transcript p{font-size:13px;line-height:1.6;margin:5px 0}.hidden{display:none!important}.primary-action,.secondary-action{width:100%;border:0;border-radius:11px;padding:13px 16px;font-weight:900;cursor:pointer}.primary-action{background:linear-gradient(100deg,var(--blue),var(--violet));color:#fff}.primary-action:disabled{background:#cdd7df;cursor:not-allowed}.empty-result{min-height:470px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#748696}.empty-result>span{font-size:40px;color:#4ccde5}.empty-result h3{color:#263a50;margin:15px 0 5px}.empty-result p{font-size:13px}.ai-label{color:#5b54d7!important;background:#eeeaff;border:0!important}.feedback-block{padding:16px;margin:11px 0;border-radius:13px}.feedback-block p{margin:6px 0 0;line-height:1.5;font-size:14px}.good{background:#edfaf4;border-left:3px solid var(--green)}.focus-block{background:#eef4ff;border-left:3px solid #5876ff}.challenge-block{background:#f5efff;border-left:3px solid #9568ee}.approve{display:block;padding:15px 0;font-size:12px}.parent-head{display:flex;align-items:center;padding:24px;background:linear-gradient(110deg,#0b2947,#11405f);border-radius:20px;color:#fff;margin-bottom:20px}.player-person{display:flex;align-items:center;gap:15px}.player-person>span{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#50cee5;color:#071426;font-weight:900}.player-person small,.season small{color:#70d6e8;font-size:9px;font-weight:900;letter-spacing:.14em}.player-person h2{margin:5px 0 2px}.player-person p{margin:0;color:#93a9bb;font-size:12px}.season{margin-left:auto;text-align:right;display:flex;flex-direction:column;gap:5px}.parent-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:20px}.parent-stack{display:flex;flex-direction:column;gap:20px}.timeline{border-left:2px solid #dbe7ed;margin-left:15px;padding-left:30px}.event{position:relative;padding:0 0 30px}.event>i{position:absolute;left:-44px;top:0;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#dce8ee;color:#607487;font-style:normal;font-size:11px;border:4px solid #fff}.event.current>i{background:var(--cyan);color:#061426}.event h3{margin:7px 0;font-size:17px}.event p{color:var(--muted);font-size:13px;line-height:1.55}.event b{font-size:11px}.challenge-card{background:linear-gradient(145deg,#172c4e,#162343);color:#fff}.challenge-card h3{font-size:20px;margin:10px 0}.challenge-card p{font-size:12px;color:#aebbd0;line-height:1.55}.check-days{display:flex;gap:8px;margin:20px 0}.check-days button{width:47px;height:40px;border:1px solid #71809a;border-radius:9px;background:transparent;color:#b9c4d6;font-weight:900}.check-days button.done{background:#3fc58a;color:#071426;border-color:#3fc58a}.secondary-action{background:#e8f2f6;color:#14344e}.values-card>div{display:flex;justify-content:space-between;padding:13px 0;border-bottom:1px solid var(--line);font-size:13px}.values-card>div b{color:#209e72}.values-card>p{font-size:11px;line-height:1.5;color:#7a8d9e}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:20px}.metrics article{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px}.metrics small{display:block;color:#718496;font-size:8px;font-weight:900;letter-spacing:.12em}.metrics strong{font-size:32px;display:block;margin:12px 0 4px}.metrics span{font-size:11px;color:#8193a2}.metrics .positive{color:#1ba16e}.admin-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.team-row{display:grid;grid-template-columns:40px 1fr 40px;align-items:center;gap:12px;margin:21px 0;font-size:12px}.team-row i{height:9px;border-radius:99px;background:#e4edf2;overflow:hidden}.team-row em{display:block;height:100%;background:linear-gradient(90deg,#48cce4,#5b70ff);border-radius:99px}.chart-note{font-size:11px;color:#76899a;line-height:1.5;border-top:1px solid var(--line);padding-top:15px}.insight{background:linear-gradient(145deg,#0c2945,#123b5b);color:#fff}.insight>span{display:block;font-size:42px;color:var(--cyan);margin-top:35px}.insight h2{font-size:25px;line-height:1.25}.insight p{color:#aebed0;font-size:13px;line-height:1.7}.insight .secondary-action{margin-top:30px}dialog{border:0;border-radius:22px;padding:35px;max-width:520px;box-shadow:0 35px 100px #0005}dialog::backdrop{background:#061426aa}dialog>button:first-child{float:right;border:0;background:transparent;font-size:25px;cursor:pointer}dialog small{color:#24a6c2;font-weight:900;letter-spacing:.15em}dialog h2{font-size:27px}dialog li{margin:12px 0;color:#5e7082;line-height:1.5}.toast{position:fixed;right:25px;bottom:25px;background:#09243d;color:#fff;padding:14px 18px;border-radius:12px;box-shadow:0 16px 45px #0004;transform:translateY(100px);opacity:0;transition:.3s;font-size:13px}.toast.show{transform:translateY(0);opacity:1}@media(max-width:1000px){.demo-side{position:static;width:auto;height:auto}.demo-side nav{display:flex;gap:5px}.demo-side nav p,.demo-note,.back-link{display:none}.role{width:auto}.demo-main{margin-left:0;padding:0 20px 50px}.coach-grid,.parent-grid,.admin-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr 1fr}}@media(max-width:600px){.demo-side{padding:15px}.academy-id{display:none}.role{font-size:12px;padding:10px}.role span{display:none}.demo-main>header{height:82px}.demo-main header h1{font-size:20px}.metrics{grid-template-columns:1fr 1fr}.parent-head{align-items:flex-start}.season{display:none}.panel{padding:18px}}
/* Football photography layer */
.demo-side{background:linear-gradient(180deg,#061426e8 0%,#061426 42%),url('/player-journey-field.png') 67% top/auto 280px no-repeat,var(--navy)}
/* Demo conversion */
.demo-contact{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding:12px 13px;border-radius:11px;background:linear-gradient(100deg,#526fff,#7b65ff);color:#fff;text-decoration:none;font-size:12px;font-weight:900}.demo-contact span{font-size:16px}