*{box-sizing:border-box}:root{--bg:#f5f1e8;--card:#fffdf7;--text:#263238;--muted:#667;--main:#2f6f73;--main-dark:#24575b;--line:#ddd4c5;--danger:#b74d4d;--soft:#f3ead8;--lane:#d7b471}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif;background:var(--bg);color:var(--text)}.app-header{position:sticky;top:0;z-index:10;padding:18px 16px 14px;background:linear-gradient(135deg,#2f6f73,#6ca39a);color:white;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:0 2px 10px rgba(0,0,0,.15)}.app-header h1{margin:0;font-size:20px}.app-header p{margin:4px 0 0;font-size:13px;opacity:.92}main{max-width:860px;margin:0 auto;padding:14px}.view-tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 14px}.view-tabs .tab{border:1px solid var(--line);background:rgba(255,255,255,.7);color:var(--main-dark)}.view-tabs .tab.active{background:var(--main);border-color:var(--main);color:white}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;margin:0 0 14px;box-shadow:0 2px 10px rgba(89,71,45,.08)}h2{margin:0 0 14px;font-size:18px}.section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.badge{display:inline-block;padding:5px 10px;border-radius:999px;background:var(--soft);color:var(--main-dark);font-size:12px;font-weight:700}label{display:block;margin:0 0 12px;font-size:13px;color:var(--muted)}input,select,textarea{width:100%;margin-top:6px;padding:12px;border:1px solid var(--line);border-radius:12px;font-size:16px;background:white;color:var(--text)}textarea{resize:vertical}.grid{display:grid;gap:10px}.grid.two{grid-template-columns:1fr 1fr}.grid.three{grid-template-columns:1fr 1fr 1fr}button{border:none;border-radius:14px;padding:12px 16px;font-size:15px;font-weight:700;color:white;background:var(--main);cursor:pointer}button:active{transform:translateY(1px)}button.ghost{color:var(--main-dark);background:rgba(255,255,255,.85);border:1px solid rgba(47,111,115,.35)}button.danger{background:var(--danger)}.button-row{display:flex;gap:10px;flex-wrap:wrap}.button-row.small button{padding:8px 10px;font-size:13px}.hidden{display:none}.current-settings{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--soft)}.current-settings span{display:block;margin:0 0 4px;color:var(--muted);font-size:12px}.current-settings strong{display:block;font-size:14px;line-height:1.5}.current-settings button{flex:0 0 auto}.lane-box{display:grid;grid-template-columns:1fr 2fr;gap:10px;margin:0 0 14px}.approach,.lane{position:relative;height:150px;border-radius:16px;overflow:hidden;border:1px solid #c9b99f}.approach{background:repeating-linear-gradient(90deg,rgba(70,50,25,.06) 0,rgba(70,50,25,.06) 1px,transparent 1px,transparent 14px),linear-gradient(#ead8b6,#d7b471)}.lane{background:repeating-linear-gradient(90deg,rgba(70,50,25,.08) 0,rgba(70,50,25,.08) 1px,transparent 1px,transparent 8px),linear-gradient(#e6c887,#d7b471)}.approach p,.lane p{position:absolute;left:12px;bottom:8px;margin:0;font-size:12px;color:rgba(0,0,0,.52);font-weight:700}.approach-dots{position:absolute;left:12px;right:12px;top:60px;display:flex;justify-content:space-between}.approach-dots span,.spats span{width:12px;height:12px;border-radius:50%;background:rgba(47,111,115,.55)}.spats{position:absolute;left:18px;right:18px;bottom:52px;display:flex;justify-content:space-between}.pins{position:absolute;top:10px;right:18px;background:rgba(255,255,255,.85);border-radius:999px;padding:6px 14px;font-weight:700;font-size:12px;color:#8a5a2b}.detail-box{border:1px dashed var(--line);border-radius:14px;padding:10px 12px 0;margin:0 0 12px;background:#fffaf0}.detail-box summary{cursor:pointer;color:var(--main-dark);font-weight:700;padding-bottom:10px}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.summary-grid div{background:var(--soft);border-radius:14px;padding:12px 8px;text-align:center}.summary-grid strong{display:block;font-size:24px}.summary-grid span{font-size:12px;color:var(--muted)}.hint{margin-bottom:0;color:var(--muted);line-height:1.6}.log-list{display:grid;gap:10px}.log-item{border:1px solid var(--line);border-radius:14px;padding:12px;background:white}.log-main{display:flex;justify-content:space-between;gap:8px;margin-bottom:6px;font-weight:700}.log-meta{color:var(--muted);font-size:13px;line-height:1.7}.log-memo{margin:8px 0 0;line-height:1.6;white-space:pre-wrap}.log-actions{margin-top:10px}.log-actions button{padding:8px 10px;font-size:13px}footer{max-width:860px;margin:0 auto;padding:4px 16px 30px;color:var(--muted);font-size:12px}@media(max-width:680px){.grid.two,.grid.three,.summary-grid,.lane-box{grid-template-columns:1fr}.app-header{align-items:flex-start}.app-header h1{font-size:18px}.current-settings{align-items:flex-start}.approach,.lane{height:125px}}
 
.position-guide{margin:0 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#fffaf0}.guide-row{display:grid;grid-template-columns:64px 1fr;align-items:center;gap:10px;margin:0 0 8px}.guide-row:last-of-type{margin-bottom:6px}.guide-label{color:var(--muted);font-size:12px;font-weight:700}.guide-points{display:flex;justify-content:space-between;align-items:center;min-height:20px}.guide-points span{width:12px;height:12px;border-radius:50%;background:rgba(47,111,115,.62)}.spats-guide span{border-radius:3px;transform:rotate(45deg);background:#8a5a2b}.guide-scale{display:flex;justify-content:space-between;margin-left:74px;color:var(--muted);font-size:11px}
.pin-selector{margin:-2px 0 14px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fffaf0}.pin-row{display:flex;justify-content:center;gap:12px;margin:0 0 8px}.pin-button{width:42px;height:42px;padding:0;border:1px solid #d8c6aa;border-radius:50%;background:white;color:var(--main-dark);font-size:15px;box-shadow:0 2px 5px rgba(89,71,45,.08)}.pin-button.selected{background:var(--main);border-color:var(--main);color:white}.pin-clear{display:block;width:100%;margin-top:4px}
.score-board{display:grid;grid-template-columns:repeat(10,72px);gap:6px;overflow-x:auto;padding-bottom:4px}.score-frame{min-height:82px;border:1px solid var(--line);border-radius:10px;background:white;text-align:center;overflow:hidden}.score-frame-no{padding:5px;background:var(--soft);font-size:12px;font-weight:700;color:var(--main-dark)}.score-marks{min-height:28px;padding:6px 4px;font-weight:700}.score-total{border-top:1px solid var(--line);padding:7px 4px;font-size:18px;font-weight:700}
.score-header-controls{display:flex;align-items:center;gap:8px}.score-header-controls label{margin:0;font-size:12px}.score-header-controls select{width:auto;min-width:72px;margin:3px 0 0;padding:6px 8px;font-size:14px}
.pin-clear{width:auto;margin:4px auto 0;padding:8px 12px;font-size:13px}
.pin-button:disabled{cursor:not-allowed;opacity:.35}
.current-settings-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.current-settings-actions button{padding:8px 10px;font-size:13px}
.record-action-notice{min-height:1.4em;margin:-6px 0 12px;color:var(--main-dark);font-size:13px;font-weight:700}
.modal{position:fixed;inset:0;z-index:20;display:flex;align-items:flex-end;padding:12px;background:rgba(38,50,56,.48)}.modal.hidden{display:none}.modal-content{width:min(100%,620px);max-height:calc(100dvh - 24px);margin:0 auto;overflow-y:auto;border:1px solid var(--line);border-radius:12px;background:var(--card);padding:16px;box-shadow:0 10px 30px rgba(0,0,0,.24)}.modal-content .hint{margin-top:-6px}.modal-content .section-head{margin-bottom:12px}
.game-history{display:grid;gap:8px}.game-history-item{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:12px;border:1px solid var(--line);border-radius:8px;background:white;color:var(--text);text-align:left}.game-history-item.selected{border-color:var(--main);background:var(--soft)}.game-history-main{display:grid;gap:3px;min-width:0}.game-history-main strong{font-size:14px}.game-history-main span{color:var(--muted);font-size:12px}.game-history-score{flex:0 0 auto;color:var(--main-dark);font-size:14px}
.game-complete-content{text-align:center}.game-complete-game{margin:0 0 8px;color:var(--muted);font-weight:700}.game-complete-score{display:block;margin:0 0 12px;font-size:32px;color:var(--main-dark)}.game-complete-content .button-row{justify-content:center}
.backup-reminder{margin:12px 0;color:var(--main-dark);font-size:14px;font-weight:700}
.grid>label{min-width:0}.grid input,.grid select,.grid textarea{max-width:100%;min-width:0}input[type="date"]{display:block;inline-size:100%;min-inline-size:0;-webkit-appearance:none;appearance:none}
.view-tabs{grid-template-columns:repeat(3,1fr)}.analysis-scope-label{margin:0;font-size:12px}.analysis-scope-label select{width:auto;margin:3px 0 0;padding:6px 8px;font-size:14px}.analysis-list{display:grid;gap:8px}.analysis-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--line);border-radius:8px;background:white}.analysis-row strong{font-size:14px}.analysis-row span{color:var(--main-dark);font-size:13px;font-weight:700;text-align:right}
.import-preview{margin:0 0 12px;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fffaf0}.import-preview h3{margin:0 0 8px;font-size:15px}.import-preview-text p{margin:4px 0;color:var(--muted);font-size:13px}.import-warnings{margin:8px 0}.import-warnings ul{margin:6px 0 0;padding-left:20px;color:var(--danger);font-size:13px;line-height:1.6}

/* Spot practice screen */
fieldset{border:0;padding:0;margin:0 0 18px;min-width:0}legend{font-weight:700;margin-bottom:10px}summary{cursor:pointer;padding:12px 0}#notice{padding:12px;border-radius:12px;background:#e3efea;line-height:1.6}#notice.error{background:#ffe4e1;color:#862d25}.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.choice{background:#fff;color:var(--main-dark);border:2px solid var(--line);min-height:48px;padding:10px}.choice[aria-pressed=true]{background:var(--main);color:#fff;border-color:var(--main-dark);box-shadow:0 0 0 2px #a8d4c7}button:focus-visible,summary:focus-visible{outline:3px solid #bd620c;outline-offset:3px}.hit-map{height:260px;max-width:400px;margin:8px auto;position:relative;background:repeating-linear-gradient(90deg,#f3e2bf 0,#f3e2bf 18px,#ead5aa 19px,#ead5aa 20px);border:1px solid #d4b983;border-radius:16px}.hit-map .choice{position:absolute;transform:translate(-50%,-50%);width:40px;min-height:44px;height:44px;padding:0}.hit-map .pin-hit{border-radius:50%;font-size:17px}.hit-map .gap-hit{border-radius:10px;border-style:dashed;background:#fff8e9;font-size:23px;width:38px}.hit-map .gap-hit[aria-pressed=true]{background:var(--main);color:white}.lane-direction{text-align:center;font-size:12px;margin:8px 0 14px;color:var(--muted)}.selection{font-weight:700;line-height:1.7;background:var(--soft);padding:12px;border-radius:12px}.shot-entry{border-top:1px solid var(--line);padding:14px 0;overflow-wrap:anywhere}.shot-entry p{margin:8px 0;line-height:1.6}.shot-entry button{display:block;margin-top:10px}.spot-guide{display:flex;align-items:center;justify-content:space-between;text-align:center;color:var(--main-dark);font-size:13px;line-height:1.8}#legacy{overflow-wrap:anywhere}footer{text-align:center;padding:20px;font-size:12px;color:var(--muted)}@media(max-width:400px){main{padding:10px}.card{padding:12px}.grid.two{gap:8px}.hit-map .choice{width:36px}.hit-map .gap-hit{width:34px}.app-header{position:static}}