:root{--bg:#101516;--bg2:#141c1c;--panel:#1c2525;--panel2:#222d2c;--line:#33423e;--text:#f0f5ee;--muted:#a3b4ad;--lime:#b9e96c;--lime2:#d7ff96;--danger:#ef8a81;--radius:19px;--shadow:0 14px 40px #060a0a65;font-family:'DM Sans',sans-serif;color-scheme:dark}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;color:var(--text);background:radial-gradient(ellipse 650px 450px at 95% -5%,#28413a80,transparent),var(--bg);min-height:100vh}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--lime)}.shell{max-width:1240px;margin:0 auto;padding:20px 26px 100px}.top{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:0 0 28px}.logo{display:flex;align-items:center;gap:14px}.brandmark{width:49px;height:49px;border:1px solid #638459;border-radius:15px;background:#20352b;color:var(--lime);display:grid;place-items:center;font-family:Outfit;font-size:22px;font-weight:900;letter-spacing:-2px}.brand{font-family:Outfit,sans-serif;font-size:18px;letter-spacing:.15px;font-weight:800}.brand small{font-family:'DM Sans',sans-serif;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:2px;display:block;margin-top:2px}.topright{display:flex;align-items:center;gap:12px}.mode{border:1px solid var(--line);border-radius:20px;color:var(--lime);font-size:11px;font-weight:800;letter-spacing:.5px;padding:7px 10px}.who{border:1px solid var(--line);border-radius:24px;padding:6px 11px 6px 6px;display:flex;align-items:center;gap:8px;background:var(--panel);color:var(--text);font-weight:800}.avatar{display:inline-grid;place-items:center;min-width:28px;width:28px;height:28px;border-radius:50%;color:#101516;font-size:11px;font-weight:900}.layout{display:grid;grid-template-columns:205px minmax(0,1fr);gap:30px}.sidebar{display:flex;flex-direction:column;gap:6px}.navbtn{width:100%;text-align:left;color:#afbeb9;background:none;border:1px solid transparent;display:flex;gap:12px;align-items:center;padding:12px 16px;border-radius:13px;font-weight:700;font-size:13px}.navbtn:hover{background:#202f29}.navbtn.active{background:#2b4032;border-color:#3f5d46;color:var(--lime)}.navbtn b{font-size:17px;font-weight:600;width:20px;text-align:center}.sidebar-note{margin-top:24px;border:1px solid var(--line);background:linear-gradient(160deg,#223329,#1a2523);border-radius:17px;padding:15px;font-size:12px;color:var(--muted);line-height:1.55}.sidebar-note strong{display:block;color:var(--text);margin:0 0 5px;font-size:13px}.content{min-width:0}.eyebrow{color:var(--lime);font-size:11px;font-weight:900;letter-spacing:2.2px;text-transform:uppercase}.heading{font:800 clamp(28px,4vw,42px)/1.08 Outfit,sans-serif;letter-spacing:-1.3px;margin:10px 0 8px}.desc{font-size:13px;color:var(--muted);margin:0 0 23px;line-height:1.5}.btn{background:var(--lime);border:1px solid var(--lime);border-radius:12px;color:#14201a;font-weight:900;padding:11px 17px;font-size:13px;white-space:nowrap}.btn:hover{background:var(--lime2)}.btn.secondary{background:var(--panel2);border-color:var(--line);color:var(--text)}.btn.ghost{background:transparent;color:var(--muted);border-color:var(--line)}.btn.small{padding:8px 11px;font-size:11px;border-radius:9px}.btnrow{display:flex;flex-wrap:wrap;gap:9px}.headrow{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 18px}.panel{background:linear-gradient(145deg,#1e2927,#192120);border:1px solid var(--line);border-radius:var(--radius);padding:20px;min-width:0}.panel h3,.sectiontitle{font:800 16px Outfit,sans-serif;letter-spacing:-.2px;margin:0 0 14px}.two{display:grid;grid-template-columns:1.15fr .85fr;gap:16px}.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin-bottom:18px}.metric{padding:17px;border:1px solid var(--line);border-radius:16px;background:#1a2422}.metric strong{display:block;font:800 29px Outfit;color:var(--text);margin:4px 0}.metric span{font-size:11px;color:var(--muted);font-weight:800;letter-spacing:.5px}.highlight{background:linear-gradient(110deg,#b8e972,#d3efa5);color:#18251a;border-radius:19px;padding:20px;position:relative;overflow:hidden;margin:0 0 16px}.highlight::after{content:'◉';position:absolute;right:20px;top:-36px;font-size:145px;color:#27402d18}.highlight h2{font:900 25px Outfit;margin:6px 0}.highlight p{font-size:13px;margin:0 0 15px;color:#364e37}.highlight .btn{background:#1f3427;border-color:#1f3427;color:#eaffd5}.rowitem{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:13px 0;border-top:1px solid var(--line)}.rowitem:first-of-type{border-top:none}.item-title{font-weight:800;font-size:13px}.sub{font-size:11px;color:var(--muted);margin-top:5px;line-height:1.4}.pill{border:1px solid #43514b;border-radius:20px;color:#b6cbc0;font-weight:800;padding:4px 9px;font-size:10px;display:inline-block}.tag{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--lime);font-weight:900}.miniavatar{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700}.miniavatar .avatar{min-width:23px;width:23px;height:23px;font-size:9px}.membergrid{display:flex;gap:8px;flex-wrap:wrap}.memberchip{display:flex;gap:7px;align-items:center;border:1px solid var(--line);border-radius:20px;padding:5px 10px 5px 6px;background:#192320;color:var(--text);font-size:12px;font-weight:800}.memberchip.selected{border-color:var(--lime)}.songgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.song-card{background:linear-gradient(155deg,#202b29,#192221);border:1px solid var(--line);border-radius:16px;padding:17px;text-align:left;color:var(--text);width:100%;min-height:138px;display:flex;flex-direction:column;justify-content:space-between}.song-card:hover{border-color:#708e5c}.song-card strong{font:800 17px Outfit;display:block;margin:8px 0}.song-card .meta{display:flex;justify-content:space-between;align-items:center}.songcard-icon{color:var(--lime);font-size:20px}.input,.textarea,.select{width:100%;display:block;padding:12px 13px;background:#111a19;border:1px solid #42504c;border-radius:11px;color:var(--text);outline:none;font-size:13px}.input:focus,.textarea:focus,.select:focus{border-color:var(--lime);box-shadow:0 0 0 2px #b9e96c25}.textarea{min-height:100px;resize:vertical}.field{display:block;font-size:12px;font-weight:800;color:#b9cbc3;margin:0 0 13px}.field .input,.field .textarea,.field .select{margin-top:6px}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.cal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:10px}.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.daylabel{text-align:center;color:var(--muted);font-weight:800;font-size:10px;padding:8px 0}.day{border:1px solid var(--line);background:#172120;color:var(--text);min-height:72px;display:flex;align-items:flex-start;flex-direction:column;padding:7px 5px;border-radius:10px;text-align:left;min-width:0}.day.other{opacity:.28}.day.selected{border-color:var(--lime);background:#2b3d2c}.day.today .daynum{color:var(--lime)}.daynum{font-size:12px;font-weight:800}.dots{display:flex;flex-wrap:wrap;gap:3px;margin-top:8px}.dot{width:7px;height:7px;border-radius:99px;background:var(--lime)}.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11px;color:var(--muted);margin:13px 0}.event{padding:12px 0;border-bottom:1px solid var(--line)}.event:last-child{border:none}.event strong{font-size:13px}.event small{color:var(--muted);display:block;margin:5px 0}.event .pill{margin-top:8px}.conflict{background:#55383155;border:1px solid #965b50;color:#ffd6cc;border-radius:10px;padding:9px;font-size:11px;font-weight:700;margin-top:9px}.setlistrow{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid var(--line)}.setlistrow .num{display:grid;place-items:center;width:30px;height:30px;background:#303f35;color:var(--lime);border-radius:9px;font:900 12px Outfit}.actions{display:flex;gap:5px}.action{background:#273631;border:1px solid #46564d;color:var(--text);border-radius:8px;padding:6px 9px;font-weight:900}.activity{display:flex;gap:11px;padding:13px 0;border-bottom:1px solid var(--line)}.activity:last-child{border:0}.timelinebar{width:3px;min-height:30px;border-radius:3px;flex-shrink:0}.empty{padding:24px 10px;color:var(--muted);text-align:center;font-size:13px;line-height:1.6}.linkcard{overflow-wrap:anywhere}.bottomnav{display:none}.modalbackdrop{position:fixed;z-index:40;inset:0;background:#070d0be3;display:grid;place-items:center;padding:18px;overflow:auto}.modal{border:1px solid #536a59;background:#1a2522;box-shadow:var(--shadow);border-radius:24px;padding:22px;width:min(560px,100%);max-height:calc(100vh - 36px);overflow:auto}.modaltop{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:19px}.modaltop h2{font:800 23px Outfit;margin:0}.x{background:#324039;border:0;border-radius:9px;color:var(--text);font-size:20px;width:32px;height:32px}.picker{width:min(580px,100%)}.picker h1{font:900 34px/1 Outfit;margin:14px 0}.picker p{color:var(--muted);font-size:13px;line-height:1.55}.pickgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:20px 0}.pick{border:1px solid #3f5546;background:#24342c;border-radius:13px;padding:12px;text-align:left;color:var(--text);display:flex;gap:12px;align-items:center;font:800 16px Outfit}.pick .avatar{width:38px;height:38px;font-size:13px}.pick:hover{border-color:var(--lime)}.hint{color:#bbc7bc;font-size:11px;line-height:1.5}.demo-banner{border:1px solid #866e3d;background:#3e3422;color:#f7dca6;padding:10px 15px;border-radius:12px;font-size:12px;margin-bottom:18px}.notice{padding:12px 14px;border-radius:12px;background:#2b382f;color:#c8e0c0;font-size:12px;line-height:1.5}.toast{display:none}#toast{position:fixed;z-index:50;left:50%;bottom:28px;transform:translateX(-50%);background:#cbea99;color:#152116;border-radius:11px;padding:10px 18px;font-weight:800;box-shadow:var(--shadow);font-size:12px;display:none;max-width:90vw}.tiny{font-size:11px;color:var(--muted)}.spacer{height:8px}.muted{color:var(--muted)}
@media (max-width:940px){.shell{padding:20px 18px 105px}.layout{grid-template-columns:165px minmax(0,1fr);gap:17px}.navbtn{padding:11px}.two{grid-template-columns:1fr}.cards3{gap:8px}.metric{padding:13px}.metric strong{font-size:24px}}
@media (max-width:650px){.shell{padding:16px 13px 105px}.top{margin-bottom:18px}.brand{font-size:15px}.brandmark{width:42px;height:42px}.brand small{font-size:8px}.topright .mode{display:none}.sidebar{display:none}.layout{display:block}.heading{font-size:31px}.desc{font-size:12px}.cards3{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.metric{padding:12px 9px}.metric strong{font-size:22px}.metric span{font-size:9px}.panel{padding:16px}.songgrid{grid-template-columns:1fr 1fr;gap:9px}.song-card{padding:14px;min-height:130px}.song-card strong{font-size:15px}.day{min-height:62px;padding:5px 3px}.daynum{font-size:11px}.calendar{gap:3px}.field-grid{grid-template-columns:1fr}.bottomnav{position:fixed;bottom:0;left:0;right:0;z-index:20;display:grid;grid-template-columns:repeat(7,1fr);background:#111a18f5;border-top:1px solid #3a4c42;padding:7px 3px calc(7px + env(safe-area-inset-bottom));backdrop-filter:blur(12px)}.bottomnav button{border:0;background:none;color:#8fa69a;display:flex;flex-direction:column;gap:5px;align-items:center;justify-content:center;font-size:8px;font-weight:800;padding:4px 0}.bottomnav button b{font-size:17px}.bottomnav button.active{color:var(--lime)}.pickgrid{gap:8px}.pick{font-size:14px;padding:9px}.highlight h2{font-size:23px}.headrow{flex-wrap:wrap}.who{font-size:12px}}

.connectionline{display:none}@media (max-width:650px){.connectionline{display:block;color:var(--lime);font-size:10px;font-weight:800;letter-spacing:.4px;margin:-7px 0 12px 4px}}

/* PJP v2: fast search, compact show responses, keyboard accessibility */
.song-search{max-width:460px;margin-bottom:12px}.song-card[hidden]{display:none!important}.rsvp-list{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.response{display:inline-block;font-size:10px;line-height:1.2;color:var(--text);background:#17231e;border:1px solid;padding:4px 6px;border-radius:8px}.action:focus-visible,.btn:focus-visible,.pick:focus-visible,.day:focus-visible,.navbtn:focus-visible,.bottomnav button:focus-visible,.song-card:focus-visible{outline:2px solid var(--lime);outline-offset:2px}.rowitem .btn{flex-shrink:0}.rowitem .action{flex-shrink:0} @media(max-width:650px){.rsvp-list{gap:4px}.response{font-size:9px;padding:3px 5px}.rowitem{flex-wrap:wrap}.rowitem .btn{margin-left:auto}.song-search{max-width:100%}}

.more-grid{display:grid;gap:12px}.more-card{display:flex;align-items:center;text-align:left;gap:14px;width:100%;padding:18px;border:1px solid var(--line);background:var(--panel);border-radius:16px;color:var(--text)}.more-card strong,.more-card small{display:block}.more-card strong{font:800 16px Outfit,sans-serif}.more-card small{font-size:12px;color:var(--muted);margin-top:4px}.more-card .more-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#304135;color:var(--lime);font-size:22px;flex-shrink:0}.more-card b{font-size:24px;margin-left:auto;color:var(--lime)}.more-card:hover{border-color:var(--lime)}@media(max-width:650px){.bottomnav{grid-template-columns:repeat(5,1fr)}.bottomnav button{font-size:10px;min-height:44px}.bottomnav button b{font-size:21px}}

.practice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:16px}.practice-card{margin-bottom:0}.readiness-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:13px 0}.ready-member{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:8px;background:#111b18;text-align:left;color:var(--text);min-width:0;font-size:12px}.ready-member .avatar{flex-shrink:0}.ready-member span:nth-child(2){min-width:0;font-weight:700}.ready-member small{display:block;color:var(--muted);font-size:10px}.ready-member.is-me{border-color:var(--lime)}.task-row{display:flex;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid var(--line)}.task-row>div{flex:1;min-width:0}.task-row strong{font-size:13px;word-break:break-word}.task-row.finished strong{text-decoration:line-through;color:var(--muted)}.task-check{border:1px solid var(--line);background:var(--panel2);color:var(--lime);border-radius:9px;width:35px;height:35px;font-size:19px;flex-shrink:0}.practice-card .headrow{margin-bottom:10px}@media(max-width:650px){.readiness-list{grid-template-columns:repeat(2,minmax(0,1fr))}.task-row{gap:8px}}

/* Readable song charts for tablets and mic-stand phones. */
.song-help{padding:12px 15px;background:#25352b;border:1px solid #516c54;border-radius:14px;color:#cbdfc5;font-size:12px;line-height:1.6;margin:3px 0 16px}.song-help strong{color:#b9e96c}.song-detail-indicator{font-size:11px;color:#b9e96c;margin-bottom:10px}.song-detail-modal{width:min(850px,100%);max-height:calc(100dvh - 32px)}.song-detail-head{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:13px;color:#b9c8bb;margin-bottom:20px}.song-detail-section{padding:18px 0;border-top:1px solid #3f5549}.song-detail-section h3{font-size:15px;color:#c7ef9b;margin:0 0 12px}.song-chart{white-space:pre-wrap;overflow-wrap:break-word;line-height:1.75;font-size:clamp(15px,2vw,20px);color:#f4f7ee;font-family:system-ui, -apple-system, sans-serif}.song-detail-buttons{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0 14px}.song-detail-buttons .btn{display:inline-flex;justify-content:center;align-items:center;text-decoration:none}.song-detail-modal .sub{font-size:13px}.song-card:focus-visible{outline:3px solid #b9e96c}@media(max-width:650px){.song-detail-modal{padding:18px;max-height:calc(100dvh - 24px)}.song-detail-section{padding:15px 0}.song-chart{font-size:17px;line-height:1.85}.song-detail-buttons .btn{flex:1;min-width:120px}.song-help{font-size:11px}}

/* Version 5 — recording library and calendar review */
.media-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:13px}.clip-card h3{margin:8px 0 2px;font-size:17px}.clip-kind{font-size:11px;letter-spacing:.8px;font-weight:900;color:var(--lime)}.clip-card .btnrow{margin-top:14px}.media-modal{width:min(650px,100%)}.capture-preview{width:100%;max-height:260px;object-fit:contain;background:#090f0d;border-radius:13px;margin:13px 0}.clip-preview{width:100%;max-height:360px;background:#090e0d;border-radius:13px;margin:12px 0}.record-status{font-weight:700;font-size:12px;color:var(--muted);margin:16px 0}.review-count{border:1px solid #587449;background:#243b2c;border-radius:14px;display:flex;align-items:center;gap:16px;padding:16px;margin-bottom:14px}.review-count strong{font:900 38px Outfit;color:var(--lime)}.review-count span{font-weight:800;font-size:13px}.clip-card .miniavatar .avatar{width:21px;height:21px;min-width:21px}.media-grid .panel{background:var(--panel)}.notice strong{color:var(--lime)}@media(max-width:650px){.media-grid{grid-template-columns:1fr}.media-modal{max-height:calc(100dvh - 24px)}.capture-preview{max-height:200px}}