:root{--blue:#3a4fd9;--ink:#14162b;--muted:#6e6f7b;--line:#dbdada;--paper:#f6f5f2;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;color:var(--ink);background:#ecebe7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit;-webkit-tap-highlight-color:transparent}button:disabled{cursor:default;opacity:.3}button:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--blue);outline-offset:5px}button{touch-action:manipulation}button:active{transform:scale(.96)}[hidden]{display:none!important}.workbench{min-height:100svh;display:flex;align-items:center;justify-content:center;gap:100px;padding:42px}.study{width:250px;flex-shrink:0}.back-link{color:var(--muted);font-size:12px;text-decoration:none}.study-kicker{font-size:10px;letter-spacing:.2em;margin-top:55px}.study h1{font-size:64px;line-height:1.18;font-weight:800;letter-spacing:-.065em;margin:25px 0}.study h1 span{color:var(--blue)}.lead{font-size:17px;line-height:1.8;letter-spacing:.03em}.study-rule{width:28px;height:2px;background:var(--blue);margin:35px 0}.study-copy{font-size:12px;line-height:2.3;color:#6e6f7b}.study-foot{font-size:10px;color:var(--muted);line-height:1.9;margin-top:35px}.lab{margin-top:25px;font-size:12px}.lab summary{cursor:pointer;color:#6e6f7b}.lab label{display:block;margin-top:16px}.lab select,.lab button{width:100%;background:transparent;border:1px solid #a7a7ac;border-radius:6px;padding:9px;margin-top:8px}.lab p{font-size:10px;line-height:1.8;color:#6e6f7b}.lab a{color:var(--blue)}.phone{position:relative;width:390px;height:845px;flex-shrink:0;overflow:hidden;isolation:isolate;background:white;border-radius:38px;box-shadow:0 0 0 7px #fbfbfa,0 0 0 8px #dbdada,0 30px 80px #14162b1f;container-type:inline-size;--pull:0px;--shot-x:0px}.scene{position:absolute;inset:0;transform-origin:47% 47%;transition:transform 1.5s cubic-bezier(.2,.65,.25,1)}.scene img{position:absolute;width:100%;height:100%;object-fit:fill;user-select:none;-webkit-user-drag:none}.world-overlay{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.aim-path{stroke:var(--blue);stroke-width:1.2;stroke-dasharray:3 5;fill:none;opacity:.6}.flight-trail{fill:none;stroke:var(--blue);stroke-width:1;opacity:.4}#world-ball{fill:var(--blue)}#ball-shadow{fill:#6e6f7b;opacity:.25}#landing-rings{fill:none;stroke:var(--blue);stroke-width:1}.game-ui{position:absolute;inset:0}.game-top{position:absolute;top:40px;left:22px;right:18px;display:flex;align-items:center;gap:12px}.hole-badge{width:45px;height:57px;border:1px solid #a7a7ac;display:grid;place-content:center;text-align:center;clip-path:polygon(0 0,100% 0,100% 83%,50% 100%,0 83%);background:#f6f5f2}.hole-badge span{font-size:7px;letter-spacing:.13em}.hole-badge b{font-size:27px;line-height:1.1;font-weight:600;letter-spacing:-.06em}.hole-name small{font-size:11px;letter-spacing:.13em;font-variant-numeric:tabular-nums}.hole-name small span{font-size:8px;color:var(--muted);margin-left:8px}.hole-name h2{font-size:15px;font-weight:500;letter-spacing:.12em;margin:6px 0 0}.icon-button{width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:#fbfbfab8;font-size:26px}.sound-button{margin-left:auto}.icon-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5}.sound-button[aria-pressed=true]{color:var(--blue)}.wind-hud{position:absolute;right:24px;top:121px;display:grid;justify-items:center}.compass{width:58px;height:58px;position:relative}.compass i{font-size:7px;font-style:normal;position:absolute;top:-7px;left:27px;color:#6e6f7b}.compass svg{width:100%;height:100%;fill:none;stroke:#a7a7ac;stroke-width:.7}.compass .wind-arrow{stroke:var(--blue);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.wind-hud b{font-size:19px;font-weight:600;margin-top:4px;font-variant-numeric:tabular-nums}.wind-hud small{font-size:8px;font-weight:400;margin-left:4px}.pin-hud{position:absolute;left:46%;top:38%;transform:translate(-50%,-100%);display:flex;align-items:center;gap:5px;padding:7px 10px 7px 7px;background:#fbfbfaf2;border-radius:9px;border:1px solid #dbdada;box-shadow:0 4px 10px #14162b06;white-space:nowrap}.pin-hud:after{content:"";position:absolute;width:1px;height:32px;top:100%;left:50%;background:#a7a7ac}.pin-hud svg{width:13px;height:21px;fill:none;stroke:#6e6f7b;stroke-width:1.5}.pin-hud strong{font-size:23px;font-weight:500;letter-spacing:-.06em;font-variant-numeric:tabular-nums}.pin-hud small{font-size:10px;letter-spacing:0;margin-left:3px}.pin-hud>span{font-size:9px;border-left:1px solid #dbdada;margin-left:5px;padding-left:8px;color:#6e6f7b}.aim-target{position:absolute;left:39.7%;top:40.5%;transform:translate(-50%,-50%);width:54px;height:54px;background:transparent;border:0;padding:0;touch-action:none;cursor:ew-resize;z-index:1}.aim-target:active{transform:translate(-50%,-50%) scale(.96)}.aim-target svg{width:100%;height:100%;stroke:var(--blue);stroke-width:1.3;fill:none}.aim-readout{position:absolute;top:44%;left:36%;font-size:10px;color:var(--blue);opacity:0}.aiming .aim-readout{opacity:1}.shot-controls{position:absolute;inset:0;pointer-events:none}.shot-controls button{pointer-events:auto}.shot-dial{position:absolute;width:52.31%;aspect-ratio:204/220;left:23.845%;bottom:18px;pointer-events:none}.dial-svg{width:100%;height:100%;overflow:visible}.dial-track{stroke:#dbdada;stroke-width:5;fill:none;stroke-linecap:round}.dial-fill{stroke:var(--blue);stroke-width:5;fill:none;stroke-linecap:round;stroke-dasharray:82 100;opacity:.7}.dial-tick{stroke:#a7a7ac;stroke-width:1}.pull-track{stroke:#a7a7ac;stroke-width:1;stroke-dasharray:2 5}.pull-chevron{stroke:#a7a7ac;stroke-width:1.5;fill:none}#tether{stroke:var(--blue);stroke-width:2;opacity:.6}.shot-ball{position:absolute;left:calc(50% - 28px);top:calc(35.455% - 28px);width:56px;height:56px;border-radius:50%;border:3px solid #fbfbfa;background:var(--blue);box-shadow:0 0 0 1px #3a4fd926,0 6px 0 #2f3ea5,0 11px 18px #3a4fd924;transform:translate(var(--shot-x),var(--pull));touch-action:none;z-index:4;cursor:grab;transition:box-shadow .15s}.shot-ball:active{transform:translate(var(--shot-x),var(--pull)) scale(.98);cursor:grabbing}.ball-dimples{position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle,#fbfbfa66 1px,transparent 1.7px) 0 0/8px 8px;mask-image:linear-gradient(135deg,#000,transparent)}.shot-ball:before{content:"";position:absolute;left:8px;top:7px;width:18px;height:8px;border-top:2px solid #fbfbfa90;border-radius:50%;transform:rotate(-25deg)}.power-readout{position:absolute;left:0;right:0;top:81%;text-align:center;color:#6e6f7b;font-variant-numeric:tabular-nums}.power-readout b{font-size:27px;font-weight:500;letter-spacing:-.06em}.power-readout span{font-size:10px;margin-left:4px}.ghost-ball{position:absolute;left:calc(50% - 16px);top:calc(35.455% - 16px);width:32px;height:32px;border:1px solid var(--blue);border-radius:50%;opacity:0;animation:pull-hint 2.8s 1s 3;pointer-events:none}.interacted .ghost-ball{display:none}.cancel-mark,.ready-mark{position:absolute;top:16%;left:calc(50% - 12px);font-size:24px;color:#6e6f7b;opacity:0;transition:opacity .15s}.ready-mark{color:var(--blue);font-size:19px}.pulling .dial-fill{opacity:1}.pulling .power-readout{color:var(--blue)}.pulling .pull-chevron{opacity:0}.pulling .shot-ball{box-shadow:0 0 0 8px #3a4fd910,0 3px 0 #2f3ea5,0 9px 18px #3a4fd921}.pulling.ready .ready-mark{opacity:1}.pulling.cancelling .cancel-mark{opacity:1}.pulling.cancelling .shot-ball{opacity:.4}.club-control{position:absolute;left:19px;bottom:87px;width:79px;pointer-events:auto}.club-button{width:79px;height:80px;background:#fbfbfaf2;border:1px solid #dbdada;border-radius:20px;box-shadow:0 4px 0 #dbdada;display:grid;place-items:center;transform:rotate(-7deg)}.club-button:active{transform:rotate(-7deg) scale(.95)}.club-button svg{width:60px;height:70px;color:var(--blue)}.club-cycle{display:flex;align-items:center;justify-content:center;margin-top:8px;gap:2px}.club-cycle button{width:27px;height:36px;padding:0;border:0;background:transparent;font-size:24px;color:#6e6f7b}.club-cycle strong{min-width:27px;text-align:center;font-size:23px;font-weight:700;font-style:italic}.impact-button{position:absolute;right:23px;bottom:108px;width:60px;height:74px;border:0;background:transparent;display:grid;justify-items:center;align-content:center;gap:6px}.mini-ball{display:block;position:relative;width:47px;height:47px;border:1px solid #a7a7ac;border-radius:50%;background:radial-gradient(circle,#a7a7ac 1px,transparent 1.5px) 0 0/7px 7px #fbfbfa;box-shadow:0 3px 0 #dbdada}.mini-ball>span{position:absolute;left:50%;top:50%;width:9px;height:9px;transform:translate(-50%,-50%);background:var(--blue);border:2px solid white;border-radius:50%}.impact-button svg{width:17px;height:17px;stroke:#6e6f7b;stroke-width:1;fill:none}.phone[data-phase=flight] .game-ui,.phone[data-phase=result] .game-ui{pointer-events:none}.phone[data-phase=flight] .shot-controls,.phone[data-phase=result] .shot-controls,.phone[data-phase=flight] .aim-target,.phone[data-phase=result] .aim-target,.phone[data-phase=flight] .pin-hud,.phone[data-phase=result] .pin-hud,.phone[data-phase=flight] .wind-hud,.phone[data-phase=result] .wind-hud{opacity:0;transition:opacity .2s}.phone[data-phase=flight] .sound-button,.phone[data-phase=result] .sound-button{pointer-events:auto}.phone[data-phase=flight] .scene,.phone[data-phase=result] .scene{transform:scale(1.38) translate(-1%,7%)}.flight-hud{position:absolute;left:0;right:0;top:22%;text-align:center;color:var(--blue)}.flight-hud>span{display:block;font-size:9px;letter-spacing:.3em}.flight-hud>b{display:block;font-size:48px;font-weight:500;letter-spacing:-.05em;margin-top:6px;font-variant-numeric:tabular-nums}.flight-hud small{font-size:14px;margin-left:6px}.result{position:absolute;left:0;right:0;bottom:45px;text-align:center;animation:result-enter .45s cubic-bezier(.22,.7,.2,1) both}.result-emblem{width:66px;height:66px;margin:0 auto 19px;color:var(--blue)}.result-emblem svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.2}.result-eyebrow{font-size:9px;letter-spacing:.3em;color:#6e6f7b}.result h2{font-size:58px;line-height:1.1;letter-spacing:-.045em;margin:12px 0 4px;font-weight:500;color:var(--blue)}.result h2 small{font-size:20px;margin-left:5px}.result p{font-size:12px;letter-spacing:.12em;margin:13px 0 25px;color:#6e6f7b}.result-actions{display:flex;gap:15px;justify-content:center;margin-bottom:28px}.result-actions button{width:55px;height:55px;border:1px solid #a7a7ac;background:#fbfbfadf;border-radius:50%;display:grid;place-items:center;box-shadow:0 3px 0 #dbdada}.result-actions svg{width:23px;height:23px;stroke:#6e6f7b;stroke-width:1.5;fill:none}.result-actions .share-button{background:var(--blue);border-color:var(--blue);box-shadow:0 3px 0 #2f3ea5}.share-button svg{stroke:white}.result>small{font-size:10px;color:#6e6f7b;letter-spacing:.13em}.scrim{position:absolute;inset:0;z-index:10;background:#14162b33;backdrop-filter:blur(3px)}.sheet{position:absolute;bottom:0;left:0;right:0;background:var(--paper);border-radius:28px 28px 0 0;padding:18px 20px 30px;z-index:11;max-height:80%;overflow:auto;overscroll-behavior:contain;animation:sheet-enter .25s cubic-bezier(.22,.7,.2,1)}.sheet header{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px}.sheet h2{font-size:15px;font-weight:500;letter-spacing:.08em;margin:0}.sheet header button{background:#dbdada;width:38px;height:38px}.club-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.club-card{min-width:0;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 0 10px;border:1px solid #dbdada;border-radius:15px;background:white;box-shadow:0 3px 0 #dbdada}.club-card svg{width:55px;height:73px}.club-card b{font-size:22px;font-style:italic}.club-card small{font-size:10px;color:#6e6f7b}.club-card[aria-pressed=true]{border:2px solid var(--blue);color:var(--blue);background:#3a4fd914;padding:7px 0 9px;box-shadow:0 3px 0 var(--blue)}.impact-ball{position:relative;width:190px;height:190px;margin:20px auto 18px;border:1px solid #a7a7ac;border-radius:50%;background:radial-gradient(circle,#a7a7ac 1.1px,transparent 1.6px) 2px 2px/12px 12px white;box-shadow:0 7px 0 #dbdada;touch-action:none;cursor:crosshair}.impact-ball:before,.impact-ball:after{content:"";position:absolute;background:#6e6f7b2d;pointer-events:none}.impact-ball:before{width:1px;height:100%;left:50%}.impact-ball:after{height:1px;width:100%;top:50%}.impact-dot{position:absolute;width:20px;height:20px;transform:translate(-50%,-50%);border-radius:50%;background:var(--blue);border:3px solid white;box-shadow:0 0 0 1px var(--blue)}.impact-reset{display:block;width:44px;height:44px;margin:0 auto;border:1px solid #a7a7ac;border-radius:50%;background:white;color:var(--blue);font-size:24px}.impact-readout{text-align:center;font-size:11px;color:#6e6f7b;margin:14px 0 3px;font-variant-numeric:tabular-nums}.share-preview{width:100%;max-height:310px;object-fit:contain;display:block}.check-row{display:flex;align-items:center;gap:8px;font-size:11px;margin:18px 0 10px}.check-row input{accent-color:var(--blue);width:18px;height:18px}.share-warning{font-size:10px;color:#6e6f7b;line-height:1.7}.save-card{width:100%;border:0;background:var(--blue);color:white;border-radius:14px;padding:15px;margin-top:10px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes pull-hint{0%,15%{opacity:0;transform:translateY(0)}30%{opacity:.5}75%,100%{opacity:0;transform:translateY(66px)}}@keyframes result-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}@keyframes sheet-enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@media(max-width:760px){.workbench{display:block;padding:0}.phone{width:100%;height:100svh;min-height:620px;max-height:none;max-width:480px;border-radius:0;box-shadow:none;margin:auto}.study{padding:35px 25px;width:100%;max-width:480px;margin:auto}.workbench{display:flex;flex-direction:column;gap:0;align-items:stretch}.phone{order:-1}.study h1{font-size:35px;line-height:1.3}.study h1 br{display:none}.study-kicker{margin-top:24px}.lead{font-size:14px}.study-rule{margin:20px 0}.study-copy{display:none}.study-foot{margin-top:20px}.game-top{top:max(25px,env(safe-area-inset-top));}.shot-dial{bottom:max(18px,env(safe-area-inset-bottom))}.sheet{padding-bottom:max(30px,env(safe-area-inset-bottom))}}@media(max-height:700px) and (max-width:760px){.shot-dial{width:47%;left:26.5%}.club-control{bottom:67px;transform:scale(.9);transform-origin:left bottom}.impact-button{bottom:89px}.wind-hud{top:100px}.game-top{top:18px}.result{bottom:22px}.result-emblem{margin-bottom:8px}.result-actions{margin-bottom:17px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.scene{transform:none!important}}

/* Keep the two course facts together above the landscape. */
.pin-hud{left:27px;top:128px;transform:none;border:0;box-shadow:none;background:transparent;padding:0;flex-wrap:wrap;max-width:110px;gap:6px}
.pin-hud:after{display:none}.pin-hud strong{font-size:31px}.pin-hud>span{width:100%;border:0;margin:0;padding-left:20px;font-size:10px}.pin-hud svg{height:25px;width:15px}
.shot-dial{width:min(52.31%,26svh);left:50%;transform:translateX(-50%)}
.result:before{content:"";position:absolute;inset:-20px -10px -45px;z-index:-1;background:linear-gradient(transparent,#fbfbfaf5 44%,white)}
@media(max-height:700px) and (max-width:760px){.pin-hud{top:108px}}
.club-cycle{width:115px;margin-left:-18px;gap:0}.club-cycle button{width:44px;height:44px;flex-shrink:0}.sheet header button{width:44px;height:44px}
@media(max-height:700px) and (max-width:760px){.club-control{bottom:55px}}

/* Flight framing is controlled by the ball position, in camera.js. */
.scene[data-camera=follow]{transition:none}
.world-overlay path,.world-overlay ellipse{vector-effect:non-scaling-stroke}
.lab select:disabled{opacity:.5}

.side-scene{position:absolute;inset:0;opacity:0;pointer-events:none;background:white}.side-scene video,.side-overlay{position:absolute;inset:0;width:100%;height:100%;object-fit:fill}
.phone[data-view=side][data-phase=flight] .side-scene,.phone[data-view=side][data-phase=result] .side-scene{opacity:1}
.phone[data-view=side][data-phase=flight] .scene,.phone[data-view=side][data-phase=result] .scene{opacity:0}
.view-switch{position:absolute;right:18px;top:111px;display:flex;gap:3px;padding:4px;background:#fbfbfaf0;border:1px solid #dbdada;border-radius:28px;pointer-events:auto;opacity:0}
.phone[data-phase=flight] .view-switch,.phone[data-phase=result] .view-switch{opacity:1}
.phone[data-phase=prepare] .view-switch{visibility:hidden}
.view-switch button{border:0;background:transparent;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#6e6f7b}
.view-switch button[aria-pressed=true]{background:#3a4fd9;color:white}
.view-switch svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.asset-status{font-size:11px;color:#6e6f7b;line-height:1.8}.asset-status:empty{display:none}
.phone[data-view=side] .flight-hud{top:23%}.phone[data-view=side][data-phase=result] .result{bottom:30px}
@media(prefers-reduced-motion:reduce){.side-scene video{transition:none}}

/* 球・コース・カメラは同じ3D座標から描く。 */
.live-scene{position:absolute;inset:0;opacity:0;pointer-events:none}.live-scene canvas{display:block;width:100%;height:100%}
.phone[data-live=true] .live-scene{opacity:1}.phone[data-live=true] .scene{opacity:0!important}
.phone .scene{transform:none!important;transition:none}.phone[data-view=side] .scene{opacity:1}
.try-again{display:block;margin:0 auto 16px;border:0;border-bottom:1px solid #dbdada;padding:6px 2px;background:transparent;font-size:12px;color:#6e6f7b}.try-again span{padding-left:8px}
.result-actions{margin-bottom:16px}.result{bottom:30px}
#load-message{position:absolute;bottom:36%;left:24px;right:24px;background:#fbfbfaf5;border:1px solid #dbdada;border-radius:14px;padding:14px;text-align:center;font-size:12px;line-height:1.8;z-index:12}
#load-message button{border:0;border-radius:8px;padding:8px 16px;background:#3a4fd9;color:white;margin-top:8px}

/* 指の触れ始めに余裕を持たせる。見た目の球は56pxのまま。 */
.shot-ball:after{content:"";position:absolute;inset:-10px;border-radius:50%}
.shot-ball{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}

.wind-hud{padding:0;border:0;background:transparent;color:var(--ink);min-width:62px;gap:3px}
.weather-label{font-size:10px;letter-spacing:.12em;color:#6e6f7b;margin-bottom:8px}
.wind-arrow{transform-origin:32px 32px}
.weather-choices{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.weather-choices button{min-height:52px;border:1px solid var(--line);border-radius:14px;background:white;font-size:14px}
.weather-choices button[aria-pressed=true]{color:var(--blue);border-color:var(--blue);background:#3a4fd914}
.weather-field{display:flex;align-items:center;gap:20px;font-size:13px;margin-top:18px}
.weather-field select{flex:1;min-width:0;min-height:44px;border:1px solid var(--line);border-radius:10px;background:white;padding:8px}
.weather-note{font-size:11px;line-height:1.8;color:#6e6f7b;margin:18px 0 0}

.game-ui,.flight-hud,.result{z-index:2}

.backswing-layer{position:absolute;inset:0;pointer-events:none}
#landscape,.backswing-layer{filter:var(--weather-filter,none)}
.scene{z-index:1;pointer-events:none}
.phone[data-world=ready] .live-scene{opacity:1}
.phone[data-world=ready] #landscape,.phone[data-world=ready] #world-ball,.phone[data-world=ready] #ball-shadow{display:none}
.phone:not([data-world=ready]) .backswing-layer{visibility:hidden}
.backswing-layer img{position:absolute;user-select:none;-webkit-user-drag:none}
/* 狙いと強さの操作（D-068・D-069）。照準は見せるだけで、左右のボタンで動かす。 */
html,body{overscroll-behavior:none}
.aim-target{pointer-events:none}
/* 低い画面でも風速表示の下端（215px）へ狙いの操作領域を重ねない。 */
.aim-step{position:absolute;top:max(36%,223px);width:52px;height:52px;border-radius:50%;border:1px solid var(--line);background:#fbfbfaf0;color:var(--blue);display:none;place-items:center;padding:0;touch-action:none;z-index:2;box-shadow:0 2px 8px #14162b14}
.aim-step svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.aim-step:active{background:#3a4fd914}
#aim-left{left:5%}#aim-right{right:5%}
.phone[data-phase=prepare] .aim-step{display:grid}
.pull-readout{position:absolute;left:68%;top:63%;transform:translate(-50%,-50%);font-size:46px;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--blue);text-shadow:0 0 6px #fbfbfa,0 0 14px #fbfbfa;opacity:0;pointer-events:none;z-index:3;transition:opacity .12s}
.phone.pulling .pull-readout{opacity:1}
/* 一人一球（D-073）：結果のあとの一言と、次の人へ戻す隠した長押し（HOLE の札）。今日の天気は見るだけ。 */
.day-done{margin:0 auto 16px;font-size:12px;color:#6e6f7b;text-align:center}.hole-badge{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.weather-today{margin:8px 0 4px;font-size:15px;line-height:1.9;color:#14162b}
/* 打つ前の下見（D-088）：ピンの表示がグリーンへ寄るボタン。グリーンを見ている間は、打者の絵を隠す。 */
.pin-hud{cursor:pointer;color:inherit;text-align:left;font:inherit}.pin-hud em{width:100%;padding-left:20px;font-style:normal;font-size:10px;color:var(--blue);letter-spacing:.04em}.phone[data-look=green] .backswing-layer,.phone[data-look=green] #landscape{visibility:hidden}
/* 着地点の印：地面に置いた形（ui.js の drawLandingMark）。前の照準（?mark=bracket）以外では、照準のボタンは見せない（キーボードの狙いの調整には残す）。 */
.landing-mark{fill:none;stroke:var(--blue);stroke-width:1.6;opacity:.85;stroke-linejoin:round;stroke-linecap:round}.landing-mark.dot{fill:var(--blue);stroke:none;opacity:.9}.landing-mark.shadow{fill:#6e6f7b;stroke:none;opacity:.3}.aim-target:not(.as-mark){opacity:0}
/* ゲームの画面では文字を選ばせない（iPhone の長押しで選択が始まり、HOLE の札の長押しが切れた）。 */
.phone{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* 着地点のピン（地図に刺すピン）：針は墨、頭は青、根元に淡い影。 */
.landing-pin-needle{stroke:#585967;stroke-width:1.1;stroke-linecap:round}.landing-pin-head{fill:var(--blue);stroke:#fbfbfa;stroke-width:.8}.landing-pin-base{fill:#6e6f7b;opacity:.3}
/* 結果の画面は上の帯を押せない（.game-ui の pointer-events:none）。次の人へ戻す HOLE の札の長押しだけは受ける（D-087）。 */
.phone[data-phase=result] .hole-badge{pointer-events:auto}
/* HOLE の札：とがった下の斜めの辺にも枠線を出す（切り抜きで枠線が消え、見切れて見えた）。外側を枠線の色で切り抜き、1px 内側に紙の色を重ねる。 */
.hole-badge{position:relative;border:0;background:#a7a7ac}.hole-badge::before{content:'';position:absolute;inset:1px 1px 1.2px;background:#f6f5f2;clip-path:polygon(0 0,100% 0,100% 82.6%,50% 100%,0 82.6%)}.hole-badge span,.hole-badge b{position:relative}
/* ---------- 設えの Pop（D-094、02_design/色調/設えの色調へ_v1.md） ----------
   色は設えの Traditional の色調、書体は数字と英字が Space Grotesk、和文が Zen Kaku Gothic New。
   丸ボタンは枠なしで 3px の硬い縁だけ。HOLE の札は半券（下の辺だけ破線）。 */
:root{--paper-raised:#fbfbfa;--accent-deep:#2f3ea5;--accent-wash:#3a4fd914;--control-border:#a7a7ac;--label:#6e6f7b;
 --font-ui:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;--font-num:"Space Grotesk","Zen Kaku Gothic New","Hiragino Kaku Gothic ProN",sans-serif;font-family:var(--font-ui)}
button,input,select{font-family:inherit}
/* 数字と英字 */
.hole-badge,.hole-name small,.pin-hud strong,.pin-hud>span,.wind-hud b,.weather-label,.power-readout,.flight-hud,.result-eyebrow,.result h2,#club-name,.aim-readout,.impact-readout{font-family:var(--font-num)}
/* 大きさ：距離 26px、強さ 22px、風速 16px、飛距離 40px */
.pin-hud strong{font-size:26px;font-weight:500;letter-spacing:-.02em}
.power-readout b{font-size:22px;font-weight:500;letter-spacing:-.02em}
.wind-hud b{font-size:16px;font-weight:500}
.flight-hud>b{font-size:40px;letter-spacing:-.02em}
/* 丸ボタン：枠なしで 3px の硬い縁 */
.icon-button,.result-actions button,.aim-step{border:0;box-shadow:0 3px 0 var(--line)}
.icon-button{background:#fbfbfab8}
.aim-step{background:#fbfbfaf0}
.result-actions button{background:#fbfbfadf}
.result-actions .share-button{background:var(--blue);box-shadow:0 3px 0 var(--accent-deep)}
.share-button svg{stroke:var(--paper)}
.icon-button:focus-visible,.result-actions button:focus-visible,.aim-step:focus-visible{outline:none;box-shadow:0 0 0 5px var(--paper),0 0 0 8px var(--blue)}
/* HOLE の札：半券（角のない紙の札に藍黒の 1px の枠、下の辺だけ破線） */
.hole-badge{clip-path:none;border:1px solid var(--ink);border-bottom-style:dashed;border-radius:0;background:var(--paper)}
.hole-badge::before{display:none}
.hole-badge span{font:400 7px/9px var(--font-num);letter-spacing:.13em}
.hole-badge b{font:600 24px/1.05 var(--font-num);letter-spacing:0}
.hole-name h2{font-family:var(--font-ui)}
/* 結果 */
.result-eyebrow{font:400 9px/14px var(--font-num);letter-spacing:.3em;color:var(--label)}
.result h2{font-family:var(--font-num);font-weight:500;letter-spacing:-.03em}
.result p,#result-caption{font-family:var(--font-ui);letter-spacing:.12em;color:var(--label)}
/* 読み込み（LoadingScreen・Pop）：最初の 400ms は出さない。三つの点は読み込みの間だけ点滅する */
#load-message{position:absolute;inset:0;z-index:12;display:grid;place-items:center;padding:0;border:0;border-radius:0;background:var(--paper);font:inherit;animation:load-in .25s cubic-bezier(.22,.7,.2,1) .4s both}
@keyframes load-in{from{opacity:0}to{opacity:1}}
.load-inner{display:grid;justify-items:center;gap:14px;max-width:280px;padding:0 24px;text-align:center}
.load-dots{display:inline-flex;gap:6px}
.load-dots i{width:7px;height:7px;border-radius:50%;background:var(--ink);animation:load-blink .9s ease-in-out infinite}
.load-dots i:nth-child(2){animation-delay:.15s}
.load-dots i:nth-child(3){animation-delay:.3s;background:var(--blue)}
@keyframes load-blink{0%,100%{opacity:1}50%{opacity:.35}}
.load-label{margin:0;font:400 12px/1.6 var(--font-num);letter-spacing:.12em;color:var(--label)}
.load-notice{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px;border:1px solid var(--control-border);border-radius:14px;background:var(--paper-raised);color:var(--ink);font:400 12px/1.8 var(--font-ui)}
.load-notice p{margin:0}
.load-notice button,#load-message button{margin:0;border:1px solid var(--blue);border-radius:8px;padding:8px 16px;background:var(--blue);color:var(--paper);font:400 12px/16px var(--font-ui)}
#load-message.slow{animation:none}
@media (prefers-reduced-motion:reduce){#load-message{animation:none}.load-dots i{animation:none;opacity:.6}}
/* 引く球（設えの Pop）：青い円と下の濃い縁だけ。白い縁・光の筋・くぼみの模様は付けない。 */
.shot-ball{border:0;box-shadow:0 6px 0 var(--accent-deep),0 11px 18px #3a4fd91f}
.shot-ball:before,.shot-ball .ball-dimples{display:none}
.pulling .shot-ball{box-shadow:0 0 0 8px #3a4fd910,0 3px 0 var(--accent-deep),0 9px 18px #3a4fd91a}
/* 結果の足元の一行（設えの Result）：「次の景色は、明日。」 */
.day-done{margin:16px auto 0;font:400 9px/14px var(--font-ui);letter-spacing:.13em;color:var(--label)}
/* 打ったあとの視点（D-096）：二つの視点の切り替えはやめ、なぞって向きを変えたときだけ「元の向き」の丸ボタン。 */
.view-switch{padding:0;background:transparent;border:0;gap:0}
.view-switch button{width:44px;height:44px;border-radius:50%;background:#fbfbfadf;color:var(--ink);box-shadow:0 3px 0 var(--line)}
.view-switch button[hidden]{display:none}
.view-switch svg{width:22px;height:22px;stroke-width:1.5}
.phone[data-phase=flight],.phone[data-phase=result]{touch-action:none}
/* ブラウザの下のバー（D-097）：端末の安全な余白を JS に渡し、低い画面では最低の高さで画面の外へはみ出さない。 */
.phone{--safe-bottom:env(safe-area-inset-bottom,0px)}
@media(max-width:760px){.phone{min-height:min(620px,100svh)}}
/* ゲームだけの1画面（試作の説明を外した、D-099）。スマホではページをスクロールさせない。PC では端末の枠を紙の地の真ん中に置く。 */
@media(min-width:761px){.workbench{justify-content:center;padding:24px;min-height:100vh}}
@media(max-width:760px){html,body{height:100%;overflow:hidden}.workbench{min-height:100svh;height:100svh;overflow:hidden}}
/* 操作を下へ寄せる（D-100）：下の余白を使い、クラブの札と引く球を下端に近づける。 */
.shot-dial{bottom:max(6px,env(safe-area-inset-bottom))}
.club-control{bottom:48px}
@media(max-height:700px) and (max-width:760px){.club-control{bottom:40px}}
/* 線で描く小さな矢印（記号の文字は iPhone で絵文字に化けるため、D-103）と、拡大した案内板。 */
.slope-arrow{width:10px;height:10px;margin-right:3px;vertical-align:-1px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.sign-preview{display:block;width:100%;height:auto;border:1px solid var(--line)}
.pin-hud>span{display:flex;align-items:center;gap:1px}
.sheet:focus{outline:none}
/* 今日の球（D-104）：コース名の下の青いハート。残りは青で塗り、下に濃い青の影（引く球の影と同じ）。使った球は線だけ */
.balls{display:flex;gap:6px;margin-top:7px;height:13px}
.heart{width:15px;height:13px;fill:var(--blue);stroke:var(--blue);stroke-width:1.1;stroke-linejoin:round;overflow:visible;filter:drop-shadow(0 1.5px 0 #2f3ea5)}
.heart.spent{fill:none;stroke:#a7a7ac;filter:none}
.heart.spending{animation:heart-spend .5s cubic-bezier(.22,.7,.2,1)}
@keyframes heart-spend{0%{transform:scale(1.3)}100%{transform:scale(1)}}
/* 前の球が止まった所（D-104） */
.resting-ball{fill:#c9c9cd;stroke:#fbfbfa;stroke-width:.8}.resting-shadow{fill:#6e6f7b;opacity:.2}
/* もう一球（D-104）：ハートと同じ青で、矢印の代わりに小さなハート */
.try-again .more-heart{display:none}.try-again.more .try-arrow{display:none}
.try-again.more{color:var(--blue);border-bottom-color:#3a4fd966;font-size:13px;letter-spacing:.08em}
.try-again.more .more-heart{display:inline-block;width:12px;height:10px;fill:var(--blue);margin-right:6px;vertical-align:-1px}
.result:focus{outline:none}

/* クレジット：既存のシートで原文の出典・ライセンスを読めるようにする。 */
.credits-button{flex-shrink:0;pointer-events:auto;font:500 18px/1 Georgia,serif}
.credits{font-size:12px;line-height:1.8;overflow-wrap:anywhere;-webkit-user-select:text;user-select:text}
.credits h3{font-size:13px;margin:24px 0 8px}.credits ul{padding-left:18px}.credits li{margin-bottom:16px}
.credits a{color:var(--blue);text-decoration:underline}.credits pre{white-space:pre-wrap;font:11px/1.7 ui-monospace,monospace}
.sheet:has(.credits) header{position:sticky;top:-18px;z-index:1;background:var(--paper);padding-bottom:8px}
/* 保存できないときだけ。操作を遮らず、同じ失敗のたびに表示を入れ直さない。 */
.storage-note{position:absolute;z-index:3;left:16px;right:16px;bottom:max(6px,env(safe-area-inset-bottom));margin:0;padding:6px 10px;border-radius:8px;background:var(--paper);color:var(--ink);font:400 11px/1.6 var(--font-ui);text-align:center;pointer-events:none}
.storage-note:empty{padding:0}
.phone:has(.storage-note:not(:empty)) .result{bottom:max(64px,calc(env(safe-area-inset-bottom) + 50px))}
.phone:has(.storage-note:not(:empty)) .club-control{bottom:max(64px,calc(env(safe-area-inset-bottom) + 58px))}