:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#f6f8fb;background:#101319}*{box-sizing:border-box}body{margin:0}nav{display:flex;gap:20px;align-items:center;background:#1a1f29;padding:17px max(16px,calc((100vw - 1100px)/2));border-bottom:1px solid #303746}nav a{color:#d6e3fa;text-decoration:none}.brand{font-weight:900;margin-right:auto;color:#fff}main{max-width:1100px;margin:auto;padding:22px 14px 60px}h1{font-size:30px;margin:6px 0 8px}h2{font-size:21px}h3{margin:0 0 8px}.muted{color:#aeb9cb}.card{background:#1b202a;border:1px solid #303746;border-radius:15px;padding:18px;margin:14px 0}.form-row{display:flex;flex-wrap:wrap;gap:12px;margin:16px 0}.form-row label,.name-grid label{flex:1;min-width:160px;display:flex;flex-direction:column;gap:7px;color:#cbd5e5;font-size:14px}.name-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:16px 0}input,select{background:#111720;color:white;border:1px solid #49546a;border-radius:9px;padding:11px;font:inherit;width:100%}button,.button{background:#9fcbff;color:#101720;border:0;border-radius:9px;padding:11px 16px;font:inherit;font-weight:800;cursor:pointer;text-decoration:none;display:inline-block;text-align:center}button.secondary,.button.secondary{background:#394353;color:#fff}button.danger{background:#c34848;color:white}button:disabled{opacity:.35;cursor:not-allowed}.topline{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap}.list-row{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid #303746;color:#e5f1ff;text-decoration:none}.list-row:last-child{border-bottom:0}.game-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:12px}.game-grid .card{margin:0}.game-grid .button{margin:4px}.team-score{font-size:13px;color:#b9c6d8}.team-score strong{display:block;color:white;font-size:38px}.bowler-title{display:flex;align-items:center;justify-content:space-between}.bowler-title strong{font-size:32px}.frames{display:grid;grid-template-columns:repeat(10,minmax(52px,1fr));overflow-x:auto;border:1px solid #455063;border-radius:9px;margin:12px 0}.frame{border-right:1px solid #455063;min-height:72px;text-align:center;white-space:nowrap}.frame:last-child{border:0}.frame small{display:block;background:#293343;padding:4px}.frame div{padding:7px 1px;height:30px;font-weight:700}.frame b{font-size:17px}.pin-area{display:flex;flex-direction:column;align-items:center;gap:10px;padding-top:8px}.instruction{display:flex;flex-direction:column;gap:4px;text-align:center}.instruction span{color:#b7c5d9;font-size:13px}.pin-deck{height:180px;width:250px;position:relative;border-radius:18px;background:linear-gradient(180deg,#343d4b,#242b36);margin:6px auto}.pin{position:absolute;transform:translate(-50%,0);border-radius:50%;width:33px;height:33px;padding:0;background:transparent;color:#7b879a;border:1px dashed #718096;font-size:22px;display:flex;align-items:center;justify-content:center}.pin-visible{background:#fff;color:#202631;border:2px solid #e5eaf1;font-size:12px}.pin-disabled{opacity:.15}.pin-hit{opacity:.4}.pin:disabled{cursor:default}.actions,.footer-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.footer-actions{margin-top:22px}.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.stat-grid>div{background:#111720;padding:12px;border-radius:10px}.stat-grid small{display:block;color:#aab9ce}.stat-grid strong{display:block;font-size:25px;margin-top:5px}@media(max-width:600px){main{padding:12px 10px 40px}.card{padding:12px}.frames{grid-template-columns:repeat(10,52px)}.pin-deck{width:250px}nav{padding:14px}}

/* Mobile-first session setup refinements */
#setup .name-grid label{min-width:0}
#setup input,#setup select{min-height:46px}
#setup input:focus-visible,#setup select:focus-visible{outline:2px solid #9fcbff;outline-offset:2px}
#setup input[type="search"]{appearance:none}
@media (max-width: 680px){
  html{-webkit-text-size-adjust:100%}
  main{padding:20px 16px 72px}
  h1{font-size:clamp(24px,6.5vw,30px);line-height:1.15;margin:6px 0 10px}
  h2{font-size:19px;margin:24px 0 12px}
  main>p.muted{font-size:14px;line-height:1.5;margin:0 0 16px}
  .card{padding:18px 16px;margin:12px 0;border-radius:16px}
  #setup .form-row{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin:0 0 18px}
  #setup .form-row:nth-of-type(2){grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #setup label{min-width:0;font-size:14px;gap:8px}
  #setup input,#setup select{font-size:16px;min-height:50px;padding:12px 13px;border-radius:10px}
  #setup .name-grid{grid-template-columns:minmax(0,1fr);gap:0;margin:8px 0 18px}
  #setup .name-grid label{display:grid;grid-template-columns:minmax(0,1fr);gap:9px;padding:16px 0;border-bottom:1px solid #343d4c;font-weight:600}
  #setup .name-grid label:first-child{padding-top:4px}
  #setup .name-grid label:last-child{border-bottom:0;padding-bottom:4px}
  #setup .name-grid input{font-weight:400}
  #setup .name-grid select{font-weight:400}
  #setup button[type="submit"]{width:100%;min-height:54px;font-size:16px;margin-top:2px}
  .list-row{flex-direction:column;align-items:flex-start;gap:7px;line-height:1.5}
  .list-row>span{min-width:0;overflow-wrap:anywhere}
  .list-row>span:last-child{font-size:13px;color:#9fcbff}
  nav{padding:15px 16px;gap:16px}
  nav a{font-size:14px}
  .brand{font-size:15px}
}
@media (max-width: 360px){
  main{padding-inline:12px}
  .card{padding:16px 12px}
  #setup .form-row:nth-of-type(2){gap:8px}
  #setup label{font-size:13px}
}

/* Session setup: strictly one field per row, on phone and desktop. */
#setup .form-row,
#setup .form-row:nth-of-type(2),
#setup .name-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
}
#setup .form-row label,
#setup .name-grid label {width:100%;min-width:0;max-width:none;}
#setup .name-grid {gap:12px;}
#setup .name-grid label {padding:0;border:0;}
@media (max-width:680px) {
  #setup .form-row:nth-of-type(2) {grid-template-columns:minmax(0,1fr);gap:14px;}
  #setup .name-grid {gap:14px;}
  #setup .name-grid label,
  #setup .name-grid label:first-child,
  #setup .name-grid label:last-child {padding:0;border:0;}
}

/* Larger phone controls and typography — all session fields full width */
@media (max-width: 680px) {
  html {font-size:18px;-webkit-text-size-adjust:100%;}
  body {line-height:1.45;}
  main {padding:22px 14px 75px;}
  nav {padding:18px 14px;gap:16px;}
  nav a {font-size:16px;}
  .brand {font-size:17px;}
  h1 {font-size:clamp(28px,7.4vw,36px);line-height:1.18;margin:8px 0 15px;}
  h2 {font-size:24px;}
  main>p.muted {font-size:17px;line-height:1.55;margin-bottom:20px;}
  .card {padding:22px 18px;border-radius:17px;}
  #setup .form-row,#setup .form-row:nth-of-type(2),#setup .name-grid {grid-template-columns:minmax(0,1fr);gap:20px;margin-bottom:22px;}
  #setup label,#setup .name-grid label {font-size:17px;font-weight:600;gap:10px;line-height:1.35;}
  #setup input,#setup select {font-size:18px;min-height:64px;padding:17px 16px;border-radius:12px;font-weight:400;}
  #setup input::placeholder {font-size:17px;}
  #setup .name-grid {gap:20px;}
  #setup button[type=submit] {width:100%;min-height:66px;font-size:19px;border-radius:12px;padding:17px 20px;}
  .list-row {font-size:17px;padding:18px 0;gap:10px;}
  .list-row small {font-size:15px;}
  .list-row>span:last-child {font-size:15px;}
}

/* v4: deliberately global to support mobile browsers reporting a wide viewport.
   These rules override all older setup styles, including the 680px breakpoint. */
body { font-size: 19px; }
main { width:100%; max-width:1100px; }
#setup { width:100%; }
#setup .form-row, #setup .form-row:nth-of-type(2),
#setup .name-grid { display:flex !important; flex-direction:column !important;
  align-items:stretch !important; gap:20px !important; width:100% !important;
  grid-template-columns:none !important; margin:0 0 22px !important; }
#setup label, #setup .form-row label, #setup .name-grid label {
  display:flex !important; flex-direction:column !important; width:100% !important;
  max-width:none !important; min-width:0 !important; flex:0 0 auto !important;
  gap:10px !important; padding:0 !important; border:0 !important;
  font-size:21px !important; font-weight:650 !important; line-height:1.3 !important;
}
#setup input, #setup select { display:block !important; width:100% !important;
  max-width:none !important; min-height:76px !important;
  padding:19px 20px !important; border-radius:13px !important;
  font-size:23px !important; font-weight:450 !important;
  line-height:1.35 !important; background:#111720; }
#setup input::placeholder {font-size:21px !important;}
#setup button[type=submit] { display:block !important; width:100% !important;
  min-height:76px !important; font-size:23px !important;
  border-radius:13px !important; padding:18px 20px !important; }
@media(max-width:850px){
  main {max-width:none !important; padding:20px 10px 65px !important;}
  main > h1 {font-size:34px !important;line-height:1.16 !important;}
  main > p.muted {font-size:19px !important;line-height:1.45 !important;}
  main > h2 {font-size:27px !important;}
  main > .card {width:100% !important; margin:14px 0 !important;
    padding:20px 12px !important;}
  nav {padding:16px 12px !important;}
  .list-row {font-size:19px !important;}
}

/* v5: larger touch targets and a single shared scoring deck */
#setup input,#setup select {min-height:92px !important;font-size:27px !important;padding:24px 22px !important;}
#setup label,#setup .form-row label,#setup .name-grid label {font-size:24px !important;}
#setup button[type=submit] {min-height:92px !important;font-size:27px !important;}
#setup input::placeholder {font-size:24px !important;}
.bowler-tabs {display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:22px 0;}
.bowler-tab {background:#202938;color:#fff;border:2px solid #45556e;display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;min-height:100px;padding:16px;}
.bowler-tab.active {border-color:#9fcbff;background:#263d5b;box-shadow:0 0 0 2px #9fcbff55;}
.tab-name {font-size:20px;line-height:1.2;font-weight:800;}
.tab-score {font-size:32px;font-weight:900;}
.tab-done {font-size:13px;color:#a9dfb9;}
.single-scorecard .bowler-title h2 {font-size:27px;}
.single-scorecard .bowler-title strong {font-size:42px;}
.single-scorecard .instruction b {font-size:24px;}
.single-scorecard .instruction span {font-size:19px;max-width:360px;}
.single-scorecard .pin-deck {width:min(100%,340px);height:250px;}
.single-scorecard .pin {width:48px;height:48px;font-size:27px;}
.single-scorecard .pin-visible {font-size:18px;}
.single-scorecard .actions button {min-height:64px;font-size:20px;}
@media(max-width:680px){
 main {padding-inline:6px !important;}
 .card {padding:16px 8px !important;}
 .bowler-tabs {grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
 .bowler-tab {min-height:104px;padding:12px;}
 .tab-name {font-size:19px;}
 .single-scorecard .frames {grid-template-columns:repeat(10,minmax(64px,1fr));}
 .single-scorecard .frame {min-height:88px;}
 .single-scorecard .pin-deck {width:min(100%,340px);}
 .single-scorecard .actions {width:100%;}
 .single-scorecard .actions button {flex:1 1 120px;}
}

/* Frame editing and current frame visibility */
.single-scorecard .frame {display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;background:#19212d;color:#f5f8ff;border-radius:0;padding:0;min-width:64px;cursor:pointer;border-right:1px solid #455063;}
.single-scorecard .frame small{font-size:15px;font-weight:800;}
.single-scorecard .frame div{font-size:18px;}
.single-scorecard .frame b{font-size:21px;}
.single-scorecard .frame-current{background:#264b79;outline:3px solid #a6d4ff;outline-offset:-3px;box-shadow:inset 0 0 0 2px #a6d4ff;}
.single-scorecard .frame-current small{background:#3778c2;color:white;}
.single-scorecard .frame-editable:not(.frame-current):active{background:#3a516e;}
.single-scorecard .frame:disabled{opacity:1;cursor:default;}
.frame-hint{color:#b9cce5;font-size:16px;margin:10px 0 3px;}
.score-explainer{font-size:19px;color:#b9cce5;margin-top:10px;}
.score-explainer strong{color:#fff;font-size:22px;}
/* The pin deck now spans almost the full scorecard width. Positions scale with its size. */
.single-scorecard .pin-deck{width:min(100%,620px);height:auto;aspect-ratio:1.18;max-height:none;margin:12px auto;}
.single-scorecard .pin{width:clamp(44px,9.5vw,76px);height:clamp(44px,9.5vw,76px);font-size:34px;transform:translate(-50%,-50%);}
.single-scorecard .pin-visible{font-size:24px;}
.single-scorecard .instruction span{max-width:unset;}
@media(max-width:680px){
 .single-scorecard .pin-deck{width:100%;aspect-ratio:1.15;}
 .single-scorecard .pin{width:clamp(44px,12vw,66px);height:clamp(44px,12vw,66px);}
 .single-scorecard .frames{margin-top:14px;}
 .frame-hint{font-size:17px;}
}

/* v8: compact bowler switcher and expanded single pin deck */
.bowler-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0;}
.bowler-tab{min-height:66px;flex:1 1 140px;justify-content:center;align-items:center;text-align:center;padding:12px 8px;}
.tab-name{font-size:clamp(18px,3vw,24px);font-weight:800;}
.single-scorecard .score-explainer{margin:0 0 8px;text-align:center;font-size:16px;}
.single-scorecard .pin-area{width:100%;gap:6px;}
.single-scorecard .deck-wrap{width:100%;position:relative;padding-top:40px;}
.single-scorecard .pin-deck{width:100%;max-width:900px;aspect-ratio:1.38;margin:0 auto 8px;}
.single-scorecard .pin{width:clamp(54px,11vw,104px);height:clamp(54px,11vw,104px);font-size:clamp(29px,6vw,45px);}
.single-scorecard .pin-visible{font-size:clamp(23px,4.5vw,35px);}
.single-scorecard .deck-undo{position:absolute;top:0;left:38%;transform:translateX(-50%);z-index:2;min-width:74px;min-height:48px;font-size:37px;line-height:1;padding:1px 15px;background:#394353;color:#fff;border:1px solid #71839d;border-radius:12px;}
.single-scorecard .actions{width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;}
.single-scorecard .actions button{width:100%;min-height:78px;font-size:24px;}
.single-scorecard .actions .spare-action{background:#b5e6c5;color:#13251b;}
@media(max-width:680px){
 .bowler-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
 .bowler-tab{min-height:70px;}
 .single-scorecard .deck-wrap{padding-top:44px;}
 .single-scorecard .pin-deck{width:100%;aspect-ratio:1.08;}
 .single-scorecard .pin{width:clamp(48px,13vw,85px);height:clamp(48px,13vw,85px);}
 .single-scorecard .actions button{min-height:76px;font-size:22px;}
}

/* v9: mobile pin deck geometry and toolbar: keep the 1-pin inside the deck. */
.single-scorecard .deck-wrap{padding-top:0;display:flex;flex-direction:column;gap:10px;}
.single-scorecard .deck-toolbar{display:flex;justify-content:flex-end;align-items:center;min-height:54px;}
.single-scorecard .deck-undo{position:static;transform:none;min-width:68px;min-height:54px;font-size:32px;padding:5px 16px;}
.single-scorecard .pin-deck{width:100%;max-width:900px;aspect-ratio:1.16;margin:0 auto;overflow:hidden;}
.single-scorecard .pin{width:clamp(46px,10vw,82px);height:clamp(46px,10vw,82px);}
.single-scorecard .actions{margin-top:12px;}
.single-scorecard .actions button{min-height:74px;}
@media(max-width:680px){
  .single-scorecard .pin-deck{aspect-ratio:1.08;}
  .single-scorecard .pin{width:clamp(44px,11vw,66px);height:clamp(44px,11vw,66px);}
  .single-scorecard .actions{grid-template-columns:repeat(2,minmax(0,1fr));}
  .bowler-tabs{grid-template-columns:repeat(auto-fit,minmax(135px,1fr));}
  .bowler-tab{padding:10px 8px;min-width:0;}
  .tab-name{overflow-wrap:anywhere;}
}

/* Results navigation after automatic save */
.results-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 28px}
.results-actions .button{min-height:56px;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:700px){.results-actions{flex-direction:column}.results-actions .button{width:100%}}

/* PinPal-inspired mobile statistics, scoped to the statistics page */
.stats-page{max-width:760px;margin:auto}.stats-page h1{text-align:center;margin:8px 0 24px}.stats-filters{display:grid;gap:14px;background:#1b202a;border:1px solid #303746;padding:16px;border-radius:12px;margin-bottom:28px}.stats-filters label{display:flex;flex-direction:column;gap:7px;font-size:17px;color:#cbd5e5}.stats-filters select,.stats-filters input{font-size:18px;min-height:52px}.stats-date-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stats-date-row>*{min-width:0}.stats-filter-actions{display:flex;gap:10px}.stats-filter-actions>*{flex:1}.stats-section{font-size:24px;font-weight:700;margin:30px 0 12px;padding:0 2px}.stats-rows{border-top:1px solid #3a3a3a}.stats-row,.stats-subrow,.stats-detail>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #363636;min-height:66px;padding:15px 8px;font-size:20px;line-height:1.3}.stats-row strong,.stats-subrow strong{font-size:20px;text-align:right;white-space:nowrap;font-weight:600}.stats-row small,.stats-subrow small,.stats-count{font-size:16px;font-weight:400;color:#b9c3d0}.stats-detail>summary{cursor:pointer;list-style:none;font-weight:500}.stats-detail>summary::-webkit-details-marker{display:none}.stats-detail>summary .chevron{font-size:30px;color:#b9c3d0;line-height:1}.stats-detail[open]>summary .chevron{transform:rotate(90deg)}.stats-detail-content{background:#171c24}.stats-subrow{padding-left:22px}.stats-indent{padding-left:26px}.stats-indent-2{padding-left:44px}.stats-note{font-size:14px;color:#b2bed0;line-height:1.5;margin-top:20px}@media(max-width:480px){.stats-row,.stats-subrow,.stats-detail>summary{font-size:18px;padding-top:16px;padding-bottom:16px}.stats-row strong,.stats-subrow strong{font-size:18px}.stats-row small,.stats-subrow small,.stats-count{font-size:14px}.stats-date-row{gap:8px}.stats-filters{padding:12px}}

/* v11: compact phone session setup; overrides old oversized !important rules */
@media(max-width:700px){
 html{font-size:16px!important}
 body{font-size:15px!important;line-height:1.35!important}
 nav{padding:10px 12px!important;gap:12px!important;flex-wrap:nowrap}
 nav a{font-size:14px!important;white-space:nowrap}
 nav .brand{font-size:16px!important;min-width:0}
 main{padding:14px 12px 40px!important}
 main>h1{font-size:23px!important;line-height:1.2!important;margin:4px 0 12px!important}
 main>h2{font-size:19px!important;margin:20px 0 10px!important}
 main>.card{padding:14px 12px!important;margin:10px 0!important;border-radius:12px!important}
 #setup .name-grid,#setup .form-row,#setup .form-row:nth-of-type(2){gap:10px!important;margin:0 0 12px!important}
 #setup label,#setup .form-row label,#setup .name-grid label{font-size:14px!important;line-height:1.25!important;gap:5px!important;font-weight:600!important}
 #setup select,#setup input{min-height:44px!important;height:44px!important;padding:8px 11px!important;font-size:16px!important;border-radius:8px!important;line-height:1.2!important}
 #setup input::placeholder{font-size:15px!important}
 #setup button[type=submit]{min-height:46px!important;padding:10px 12px!important;font-size:16px!important;border-radius:8px!important}
 .list-row{font-size:15px!important;padding:12px 0!important}
 .list-row small,.list-row>span:last-child{font-size:13px!important}
}

/* Compact, full-width PinPal-inspired scoring view */
.score-screen{width:100%;max-width:760px;margin:0 auto}
.score-header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 10px}
.bowler-select-wrap{flex:1;min-width:0;max-width:65%}
.bowler-select{min-height:42px;height:42px;font-size:18px;font-weight:750;padding:6px 30px 6px 10px;border-radius:8px}
.game-meta{font-size:13px;color:#c5d0df;white-space:nowrap;text-align:right}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.scorecard-scroll{width:100%;overflow:hidden}
.pinpal-frames,.single-scorecard .pinpal-frames{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));width:100%;overflow:visible;margin:0 0 12px;border-radius:0;gap:0}
.pinpal-frames .frame,.single-scorecard .pinpal-frames .frame{min-width:0;min-height:78px;display:grid;grid-template-rows:25px 26px 27px;overflow:hidden;border-right:1px solid #47505b;border-radius:0;font-size:12px}
.pinpal-frames .frame small,.single-scorecard .pinpal-frames .frame small{padding:2px 0;font-size:13px;font-weight:600;background:#4a4c51;color:white}
.pinpal-frames .frame div,.single-scorecard .pinpal-frames .frame div{height:auto;padding:3px 0;font-size:clamp(9px,2.4vw,14px);font-weight:500;overflow:hidden;text-overflow:clip;white-space:nowrap}
.pinpal-frames .frame b,.single-scorecard .pinpal-frames .frame b{font-size:clamp(10px,2.6vw,15px);line-height:24px;overflow:hidden}
.pinpal-frames .frame-current,.single-scorecard .pinpal-frames .frame-current{outline:2px solid #9fcbff;outline-offset:-2px;background:#203e61}
.pinpal-frames .frame-current small,.single-scorecard .pinpal-frames .frame-current small{background:#376c9d}
.score-screen .pin-area{gap:6px;width:100%}
.score-screen .instruction{margin:0;min-height:22px}
.score-screen .instruction span{font-size:13px;max-width:none}
.score-screen .deck-wrap{padding:0;gap:0}
.score-screen .deck-toolbar{min-height:34px;margin:0 0 2px;display:flex;align-items:center;justify-content:space-between}
.score-screen .projected-score{font-size:12px;color:#9fb0c7}
.score-screen .deck-undo{min-height:32px;min-width:44px;font-size:24px;padding:0 8px}
.score-screen .pin-deck{width:100%;aspect-ratio:1.4;max-width:640px;background:#0b0c0e;border-radius:4px;overflow:hidden}
.score-screen .pin{width:clamp(28px,9vw,68px);height:clamp(28px,9vw,68px);font-size:clamp(17px,4vw,27px)}
.score-screen .pin-visible{font-size:clamp(13px,3.4vw,22px)}
.score-screen .actions{margin:8px 0 0;gap:7px;grid-template-columns:repeat(2,minmax(0,1fr))}
.score-screen .actions button{min-height:50px;font-size:17px}
@media(max-width:700px){
 main:has(.score-screen){padding:8px 6px 25px!important}
 .score-screen .pin-deck{aspect-ratio:1.32}
 .score-screen .pin{width:clamp(29px,9vw,54px);height:clamp(29px,9vw,54px)}
 .score-screen .actions button{min-height:50px;font-size:17px}
}

/* Restored scoring UI and responsive full 10-frame result cards */
.results-scorecard .frames{display:grid!important;grid-template-columns:repeat(10,minmax(0,1fr))!important;width:100%;min-width:0;overflow:visible!important;margin:12px 0}
.results-scorecard .frame{min-width:0!important;overflow:hidden;white-space:nowrap;padding:0!important;min-height:62px}
.results-scorecard .frame small{font-size:clamp(9px,2.4vw,14px);padding:3px 0}
.results-scorecard .frame div{font-size:clamp(9px,2.4vw,14px);padding:5px 0;height:26px;overflow:hidden}
.results-scorecard .frame b{font-size:clamp(10px,2.6vw,16px)}
.results-scorecard .bowler-title{gap:8px;min-width:0}
.results-scorecard .bowler-title h2{min-width:0;overflow-wrap:anywhere;font-size:clamp(17px,4.5vw,23px)}
.results-scorecard .bowler-title strong{font-size:clamp(24px,7vw,34px);flex-shrink:0}
@media(max-width:700px){.results-scorecard{padding:10px!important}.results-scorecard .frames{margin:10px 0 0}}

/* Scorecard fits viewport; all three bowler names remain on one row. */
.score-screen{width:100%;max-width:100%;margin:0 auto;min-width:0}
.score-screen .score-topline{display:flex;align-items:center;gap:8px;margin-bottom:8px;min-width:0}
.score-screen .bowler-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;flex:1;min-width:0;gap:4px;margin:0}
.score-screen .bowler-tab{min-width:0!important;min-height:42px!important;padding:5px 3px!important;font-size:clamp(10px,2.6vw,15px)!important;line-height:1.15;overflow:hidden;overflow-wrap:anywhere}
.score-screen .tab-name{overflow-wrap:anywhere;word-break:normal}
.score-screen .tab-done{font-size:10px}
.score-screen .game-meta{font-size:clamp(9px,2vw,12px);max-width:92px;white-space:normal;text-align:right;flex-shrink:0}
.score-screen .scorecard-scroll{width:100%;overflow:visible;min-width:0}
.score-screen .frames.pinpal-frames{display:grid!important;grid-template-columns:repeat(10,minmax(0,1fr))!important;width:100%!important;min-width:0!important;gap:0!important;overflow:visible!important}
.score-screen .pinpal-frames .frame{min-width:0!important;width:100%;padding:0!important;min-height:66px;grid-template-rows:20px 22px 24px;overflow:hidden}
.score-screen .pinpal-frames .frame small{font-size:clamp(9px,2.3vw,13px);padding:0}
.score-screen .pinpal-frames .frame div{font-size:clamp(8px,2.1vw,13px);padding:1px 0;letter-spacing:-.5px}
.score-screen .pinpal-frames .frame b{font-size:clamp(9px,2.4vw,14px);line-height:22px;letter-spacing:-.5px}
.score-screen .pin-area{width:100%}
.score-screen .instruction{margin:0;min-height:0}
.score-screen .instruction span{font-size:13px}
.score-screen .deck-wrap{padding:0;gap:0}
.score-screen .deck-toolbar{display:flex;justify-content:space-between;min-height:36px}
.score-screen .deck-undo{position:static;transform:none;min-height:32px;min-width:44px;font-size:24px;padding:0 8px}
.score-screen .pin-deck{width:100%;max-width:640px;aspect-ratio:1.32;overflow:hidden}
.score-screen .pin{width:clamp(29px,9vw,54px);height:clamp(29px,9vw,54px)}
.score-screen .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:8px}
.score-screen .actions button{min-height:50px;font-size:17px}
@media(max-width:700px){main:has(.score-screen){padding:8px 6px 25px!important}}

/* Compact 3-person selection; full names remain available in title attributes. */
.score-screen .score-topline{display:block!important;margin:0 0 7px!important}
.score-screen .bowler-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;width:100%;gap:5px!important}
.score-screen .bowler-tab{box-sizing:border-box;display:flex!important;min-height:46px!important;max-height:54px!important;padding:5px 3px!important;align-items:center!important;justify-content:center!important;flex-direction:column!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;font-size:clamp(11px,2.9vw,16px)!important}
.score-screen .tab-name{display:block;max-width:100%;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;overflow-wrap:normal!important;word-break:normal!important}
.score-screen .tab-done{font-size:9px;white-space:nowrap}
.score-screen .game-meta{display:block!important;max-width:none!important;margin:4px 1px 0;text-align:right!important;font-size:11px!important;white-space:nowrap!important}

/* Shot confirmation: prevents a fast turn switch from looking like a skipped shot. */
.score-screen{position:relative}
.score-screen .shot-feedback{position:absolute;z-index:20;top:54px;left:50%;transform:translate(-50%,-8px) scale(.97);min-width:min(90%,260px);max-width:95%;padding:16px 20px;text-align:center;border:2px solid #b5e6c5;border-radius:13px;background:#173d32;color:#eafff2;font-size:20px;font-weight:900;letter-spacing:.2px;box-shadow:0 8px 30px #000a;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s}
.score-screen .shot-feedback-visible{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1)}
.score-screen.shot-transition .actions button{opacity:.5}
@media(prefers-reduced-motion:reduce){.score-screen .shot-feedback{transition:none}}

/* Expanded spare conversion by exact pin leave */
.spare-breakdown > summary {display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none}
.spare-breakdown > summary::-webkit-details-marker{display:none}
.spare-breakdown > summary > strong{margin-left:auto;white-space:nowrap}
.spare-breakdown > summary > .chevron{margin-left:4px}
.spare-leaves-heading{font-size:.92rem;margin:16px 12px 8px;color:var(--muted,#aab4c8)}
.spare-leave-row{display:flex;align-items:center;gap:12px;padding:12px;border-top:1px solid rgba(160,175,200,.2);min-width:0}
.spare-pin-diagram{flex:0 0 76px;width:76px;height:76px;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(4,1fr);align-items:center;justify-items:center}
.spare-pin{display:flex;align-items:center;justify-content:center;width:15px;height:15px;border:1px solid #526074;border-radius:50%;font-size:8px;color:transparent;opacity:.4}
.spare-pin.standing{background:#f8fafc;color:#111827;opacity:1;border-color:#f8fafc;font-weight:700}
.spare-pin-7{grid-area:1/1/2/3}.spare-pin-8{grid-area:1/3/2/5}.spare-pin-9{grid-area:1/5/2/7}.spare-pin-10{grid-area:1/7/2/9}
.spare-pin-4{grid-area:2/2/3/4}.spare-pin-5{grid-area:2/4/3/6}.spare-pin-6{grid-area:2/6/3/8}
.spare-pin-2{grid-area:3/3/4/5}.spare-pin-3{grid-area:3/5/4/7}.spare-pin-1{grid-area:4/4/5/6}
.spare-leave-description{flex:1;min-width:0}.spare-leave-description strong,.spare-leave-percent strong{display:block;font-size:.94rem}.spare-leave-description small,.spare-leave-percent small{display:block;font-size:.75rem;opacity:.75;margin-top:3px}.spare-leave-percent{text-align:right;flex:0 0 auto}
@media(max-width:400px){.spare-leave-row{gap:7px;padding:10px 5px}.spare-pin-diagram{flex-basis:68px;width:68px}.spare-leave-description strong,.spare-leave-percent strong{font-size:.82rem}.spare-leave-description small,.spare-leave-percent small{font-size:.67rem}}

/* Bounty Hunters home and compact filters */
.home-menu{max-width:520px;margin:32px auto}.home-menu h1{font-size:30px}.home-action{display:flex;align-items:center;gap:14px;justify-content:space-between;margin:12px 0;padding:22px 18px;border:1px solid #45536a;border-radius:14px;background:#202b3b;color:#fff;text-decoration:none;font-size:18px;font-weight:750}.home-action span:first-child{font-size:25px}.home-action span:last-child{margin-left:auto;font-size:25px;color:#9fcbff}
.stats-filter-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.stats-filter-pair label{min-width:0}.stats-filter-pair select{width:100%;min-width:0;font-size:14px;min-height:44px;padding:8px 5px}
.leave-sort{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:6px 10px 12px}.leave-sort-button{padding:10px 5px;font-size:13px;background:#303d51;color:#e4ebf6;border:1px solid #53617b}.leave-sort-button.active{background:#9fcbff;color:#101720}.pin-leaves-list[hidden]{display:none!important}
@media(max-width:390px){.stats-filter-pair{gap:6px}.stats-filter-pair select{font-size:12px;padding:6px 3px}}

/* Select one or more dates from the dates recorded in completed sessions. */
.stats-date-select>label{display:block;margin-bottom:7px}
.stats-date-dropdown{position:relative;min-width:0}
.stats-date-dropdown>summary{display:flex;align-items:center;justify-content:space-between;list-style:none;cursor:pointer;min-height:48px;padding:10px 14px;border:1px solid #566176;border-radius:8px;background:#252b36;color:#f4f6fa}
.stats-date-dropdown>summary::-webkit-details-marker{display:none}
.stats-date-options{max-height:240px;overflow-y:auto;padding:8px 12px;border:1px solid #566176;border-radius:0 0 8px 8px;background:#252b36}
.stats-date-option{display:flex!important;flex-direction:row!important;align-items:center;gap:12px;min-height:42px;font-size:16px!important;cursor:pointer}
.stats-date-option input{min-height:0!important;width:19px;height:19px;flex:none}
.stats-date-hint{font-size:13px;color:#b9c3d0;margin:5px 0 10px}

/* Short, scrollable roster picker; tap outside to dismiss. */
.roster-picker{position:relative;width:100%}.roster-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important;min-height:0!important;padding:0!important}.roster-trigger{width:100%;height:44px;min-height:44px;background:#111720;color:#fff;border:1px solid #49546a;text-align:left;font-weight:400;padding:8px 11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.roster-panel{position:absolute;top:calc(100% + 3px);left:0;right:0;z-index:50;background:#171e29;border:1px solid #56627a;border-radius:9px;padding:8px;box-shadow:0 10px 30px #000a}.roster-panel[hidden]{display:none}.roster-panel input{height:40px!important;min-height:40px!important;margin-bottom:6px}.roster-options{max-height:180px;overflow-y:auto;overscroll-behavior:contain}.roster-option{display:block;width:100%;background:transparent;color:#fff;text-align:left;border-radius:4px;padding:9px 8px;font-size:15px;font-weight:400}.roster-option:focus,.roster-option:hover{background:#34425a}
.session-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.session-filters label{min-width:0;font-size:13px;color:#cbd5e5;display:flex;flex-direction:column;gap:5px}.session-filters select{min-width:0;font-size:14px;padding:9px 6px}.previous-session-row,.previous-session-row.list-row{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}.previous-session-row[hidden]{display:none!important}.session-left{display:flex;flex-direction:column;gap:3px;min-width:0}.session-left strong{font-size:16px}.session-left small{font-size:12px!important}.session-right{display:flex;align-items:center;gap:8px;text-align:right;justify-content:flex-end;font-size:14px!important;color:#d9e6f6!important;min-width:0;overflow-wrap:normal!important}.session-right span{color:#9fcbff}

/* Compact session details + editable roster */
.session-compact-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 12px}
.session-compact-header h1{font-size:clamp(22px,5vw,30px)!important;margin:0 0 2px!important}
.session-compact-header .muted{font-size:14px}
.session-stats-link{padding:8px 12px;font-size:14px}
.session-roster-compact{border:1px solid #303746;background:#1b202a;border-radius:12px;padding:12px 14px;margin:10px 0 14px}
.session-roster-line{display:flex;align-items:center;justify-content:space-between;gap:12px}
.roster-edit-button{font-size:13px;padding:6px 12px}
#roster-display{font-size:14px;line-height:1.5;margin:7px 0 0;overflow-wrap:anywhere}
#roster-form[hidden],#roster-display[hidden],#edit-roster[hidden]{display:none!important}
#roster-form{margin-top:10px}#roster-form label{display:block;font-size:13px;margin:9px 0;color:#cbd5e5}
#roster-form select{margin-top:4px;font-size:15px;min-height:42px;padding:8px}
.roster-warning{font-size:12px;line-height:1.4}
.roster-edit-actions{display:flex;gap:8px}.roster-edit-actions button{font-size:14px;padding:9px 12px}
.session-games-heading{font-size:20px!important;margin:14px 0 8px!important}
.session-game-list{display:grid;gap:8px}.session-game-row{border:1px solid #303746;background:#1b202a;border-radius:12px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.session-game-row strong{font-size:17px}.session-game-row small{display:block;font-size:12px;margin-top:3px}
.session-game-actions{display:flex;gap:6px;flex-shrink:0}.session-game-actions .button{font-size:13px;padding:9px 10px;white-space:nowrap}
@media(max-width:380px){.session-game-actions .button{font-size:12px;padding:8px 7px}.session-game-row{padding:10px 7px}}

/* Session pair category and one bowler per row. */
.pair-category-form{display:flex;align-items:center;gap:9px;margin:10px 0 12px}.pair-category-form label{flex:none;font-size:14px;color:#cbd5e5}.pair-category-form select{flex:1;min-width:0;min-height:42px;padding:8px;font-size:15px}.pair-category-form button{flex:none;padding:9px 12px;font-size:14px}
#roster-display{display:flex;flex-direction:column;gap:0;margin-top:7px}.roster-name-row{display:block;padding:7px 0;font-size:15px;line-height:1.3}.roster-name-row+.roster-name-row{border-top:1px solid #343c4c}

/* Two-row previous-session summaries */
.previous-session-row,.previous-session-row.list-row{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:5px!important;padding:12px 14px!important}
.session-summary-line{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.session-summary-line>span,.session-summary-line>small:last-child{text-align:right}
.session-summary-line strong{font-size:16px}.session-summary-line>span{font-size:14px}
.session-summary-secondary{color:#aab4c8;font-size:12px}.session-summary-secondary small{font-size:12px}
.session-pair-display{font-size:13px;color:#aab4c8;margin-top:3px}
#pair-display[hidden]{display:none!important}

/* Recording: prioritize pin deck and place Undo next to Gutter. */
.score-screen .game-meta,.score-screen .deck-toolbar{display:none!important}
.score-screen .pin-area{gap:3px!important;padding-top:2px!important}
.score-screen .pin-deck{max-width:760px!important;aspect-ratio:1.12!important;margin:0 auto!important}
.score-screen .actions{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important;margin-top:5px!important;width:100%}
.score-screen .actions button{min-width:0;padding:9px 4px!important}
.score-screen .actions .deck-undo{font-size:25px!important;min-width:0!important;min-height:50px!important}
.score-screen .instruction{min-height:0!important;margin:0!important}
.score-screen .cancel-frame-edit{font-size:12px;min-height:30px;padding:5px 9px}
.results-actions-top{margin:8px 0 14px!important;flex-direction:row!important}
.results-actions-top .button{flex:1;min-width:0;min-height:42px!important;padding:10px 6px;font-size:14px}
@media(max-width:700px){.score-screen .pin-deck{aspect-ratio:1.08!important}.results-actions-top .button{width:auto!important}}

.score-screen .shot-feedback-open{background:#6b1720;border-color:#ff8a92;color:#fff0f0}
