/* 街角ハンター / TRANQUILIZER GUN / style.css / v0.5.2 */
.dpad-and-share{display:flex;flex-direction:column;align-items:stretch;gap:8px}.dpad-and-share .share-game{min-height:32px;width:100%;padding:5px 3px;background:#31483b;color:#edf3de;border:1px solid #809d81;border-radius:6px;font-size:9px;font-weight:800}.share-note{font-size:9px;text-align:center;color:#364f40;line-height:1.5;margin:5px 0}.share-note:empty{display:none}
.ad-gate{position:absolute;inset:0;z-index:8;background:#172a23f5;color:#e5f1d6;padding:18px 16px;overflow:auto;display:flex;align-items:center;justify-content:center;text-align:center;touch-action:pan-y}.ad-gate>div{width:100%;max-width:330px}.ad-eyebrow{font-size:9px;letter-spacing:2px;color:#b8d29b}.ad-gate h3{font-size:19px;margin:13px 0}.ad-gate p{font-size:11px;line-height:1.8;margin:12px 0}.ad-gate .ad-disclosure{padding:10px;border:1px solid #8aa577;border-radius:7px;color:#d3e7b8;font-size:10px}.ad-gate button{display:block;min-height:42px;margin:8px 0;width:100%;border:1px solid #bdd59e;border-radius:6px;background:#d0e4a8;color:#21352a;font-size:12px;font-weight:700}.ad-gate .ad-secondary{background:#314a38;color:#e3efd4}.ad-gate .ad-text{background:transparent;color:#afc4a7;border:0;min-height:30px;font-size:11px}.ad-preview{position:relative;margin:14px 0;padding:20px 8px;background:linear-gradient(145deg,#466448,#263b36);border:1px dashed #9cb88c;border-radius:8px;min-height:104px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.ad-preview>span{font-size:25px;color:#d2e6b4}.ad-preview strong{font-size:11px}#adRemaining{font-size:12px}.ad-track{height:5px;background:#72866966;border-radius:4px;overflow:hidden;margin:12px 0}.ad-track i{display:block;height:100%;width:0;background:#b5df7b}#adProcessing{font-size:10px;color:#c2d6af;max-height:64px;overflow:auto}#adMount:not(:empty){position:absolute;inset:0;background:#15271f}
.console .trigger button.held{transform:translateY(3px);box-shadow:0 2px #8e4a26;background:linear-gradient(135deg,#d99340,#b2642c)}
.console .viewport{height:clamp(300px,calc(100dvh - 258px),650px)}
.console .controls{display:grid;grid-template-columns:78px minmax(0,1fr) 52px;gap:9px;align-items:center;padding:0 1px 4px}
.console .middle-controls{min-width:0;gap:0}.console .target-roster{width:100%}.console #targetList{max-height:72px}.console #targetList li span{max-width:unset;flex:1}.console #targetList li{font-size:10px;min-height:24px}.console .roster-heading{font-size:9px}
.console .dpad{grid-template:repeat(3,26px)/repeat(3,26px)}.console .dpad button{font-size:13px}
.console .trigger button{width:48px;height:48px;font-size:22px}.console .trigger{gap:6px;transform:none}.console .trigger span{font-size:8px}
.console .controls .utility{grid-column:1 / -1;display:grid;grid-template-columns:72px 72px;justify-content:center;column-gap:22px;row-gap:3px;padding:5px 0 0;align-self:center}.console .utility button{min-height:30px;padding:7px 12px}.console .utility small{font-size:7px}
.console header{margin-bottom:8px}.console #status{margin:6px 0;min-height:28px}.console details{margin-top:7px;padding-top:7px}.console footer{margin-top:6px}
.target-roster{width:140px;border:1px solid #8baca2;border-radius:9px;overflow:hidden;background:#dce9df;box-shadow:inset 0 1px 4px #638a6b25}
.roster-heading{display:flex;align-items:center;justify-content:space-between;padding:5px 6px;background:#c4d8cb;color:#345749;font-size:9px;font-weight:800;gap:4px}.roster-heading small{font-size:8px;color:#53695c}
#targetList{list-style:none;margin:0;padding:3px 6px;max-height:84px;overflow-y:auto;touch-action:pan-y;overscroll-behavior:contain}
#targetList li{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:25px;border-bottom:1px solid #b3cbbb;font-size:9px;color:#455a4d}#targetList li:last-child{border:0}#targetList li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:70px}#targetList li b{font-size:8px;white-space:nowrap;color:#738277}#targetList li.target-hit{color:#136144;font-weight:800}#targetList li.target-hit b{color:#086f4a}#targetList .target-empty{justify-content:center;font-size:9px}
#targetList,#targetList *{touch-action:pan-y!important}
.controls{touch-action:manipulation}.middle-controls,.target-roster{touch-action:pan-y}
@media(max-width:350px){.target-roster{width:115px}.middle-controls{gap:9px}}
.console{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.controls,.controls *{touch-action:none;-webkit-tap-highlight-color:transparent}
button,canvas{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-user-drag:none}
input,select,textarea{-webkit-user-select:auto;user-select:auto}
.processing{position:absolute;inset:0;background:#182820e8;color:#e4f3ce;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;padding:22px;text-align:center;z-index:5}
.processing strong{font-size:15px}.processing span{font-size:11px;line-height:1.7}.processing small{font-size:10px;color:#b9cba7}.processing button{min-height:42px;border:1px solid #a6c293;border-radius:6px;background:#39513a;color:#edf5de;padding:9px 12px;font-size:11px}.spinner{width:34px;height:34px;border:3px solid #b9dc9b44;border-top-color:#a4f25d;border-radius:50%;animation:loadingSpin .9s linear infinite}@keyframes loadingSpin{to{transform:rotate(360deg)}}
.middle-controls{display:flex;flex-direction:column;align-items:center;gap:13px}.zoom{display:flex;align-items:center;gap:4px}.zoom button{width:36px;min-height:38px;border:1px solid #91998c;border-radius:6px;background:#d8ddd0;color:#3c4d39;font-size:21px}.zoom span{font-size:9px;width:28px;text-align:center}.middle-controls .utility{align-self:center;padding-bottom:0}
.reticle::before,.reticle::after{content:"";position:absolute;background:#28fa59;filter:drop-shadow(0 0 1px #071c0c)}.reticle::before{left:33px;top:-6px;width:2px;height:11px;box-shadow:0 72px #28fa59}.reticle::after{left:-6px;top:33px;width:11px;height:2px;box-shadow:72px 0 #28fa59}
*{box-sizing:border-box}html{background:#202329}body{margin:0;padding:max(10px,env(safe-area-inset-top)) 10px max(12px,env(safe-area-inset-bottom));font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#303438}button,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.45}button:focus-visible,summary:focus-visible{outline:3px solid #8c2953;outline-offset:2px}[hidden]{display:none!important}.console{max-width:440px;margin:auto;padding:16px 16px 13px;border-radius:28px;background:linear-gradient(130deg,#cce5dc,#9fbfb5);box-shadow:inset 2px 2px 1px #ffffffa0,inset -4px -6px 4px #6c978b,0 16px 35px #0005}header{display:flex;justify-content:space-between;align-items:center;margin:0 2px 12px}.brand{font-size:13px;font-weight:900;letter-spacing:2px;color:#424b68;font-style:italic}.edition{font-size:8px;letter-spacing:1px;color:#62676b}.bezel{padding:9px 10px 7px;border-radius:10px 10px 30px 10px;background:#4c5056;box-shadow:inset 0 2px 4px #1e2229}.screen-top,.screen-bottom{display:flex;align-items:center;gap:8px;justify-content:space-between;font-size:8px;color:#bfc0b8;letter-spacing:1px;padding:0 4px 7px}.screen-top i{width:5px;height:5px;background:#e37d61;border-radius:50%;box-shadow:0 0 5px #e57c61}.screen-top span:nth-child(2){margin-right:auto}.screen-bottom{padding:7px 4px 0;font-size:6px;letter-spacing:1.3px}.viewport{position:relative;width:100%;height:clamp(310px,53dvh,500px);overflow:hidden;background:#bec9a0;border:2px solid #272e28;box-shadow:inset 0 0 15px #15221440;touch-action:none}canvas{display:block;width:100%;height:100%}.intro{position:absolute;inset:0;overflow:auto;text-align:center;padding:15px 12px;background:linear-gradient(145deg,#d6ddb5,#aab88a);color:#263c2c}.pixel-mark{font-size:30px;line-height:1}h1{font-size:clamp(23px,6.5vw,31px);line-height:1.02;letter-spacing:1px;margin:8px 0 4px;font-weight:1000;text-shadow:1px 2px #e9edcf}h2{font-size:15px;margin:7px 0;letter-spacing:3px}.tagline{font-size:10px}.instructions{border-top:1px solid #6e8059;border-bottom:1px solid #6e8059;margin:12px 0;padding:9px 0;font-size:11px;line-height:1.6}.instructions p{margin:4px 0}.intro>button{display:block;width:100%;min-height:42px;margin:7px 0;border:1px solid #374d32;border-radius:5px;background:#2e4431;color:#edf1d9;font-size:13px;font-weight:700}.intro>button:nth-of-type(2){background:#d5dfb7;color:#2d442c}.intro>.text-button{background:transparent;color:#344930;border:0;min-height:30px;font-size:11px}.intro small{font-size:9px;line-height:1.5;display:block}.reticle{position:absolute;left:50%;top:50%;width:74px;height:74px;transform:translate(-50%,-50%);border:2px solid #28fa59;border-radius:50%;box-shadow:0 0 0 1px #18301c99,0 0 12px #0005;pointer-events:none;color:#28fa59}.reticle span{position:absolute;inset:9px;border:1px solid #38ff6899;border-radius:50%}.reticle b{position:absolute;inset:0;display:grid;place-items:center;font-size:24px;font-weight:400;text-shadow:0 1px #071c0c,1px 0 #071c0c,-1px 0 #071c0c}.reticle.firing{border-color:#69ff89;box-shadow:0 0 25px #32ff68}.pause-overlay{position:absolute;inset:0;background:#17291ba0;display:flex;align-items:center;justify-content:center;flex-direction:column;color:#eff5d8;letter-spacing:5px;font-weight:900}.pause-overlay small{font-size:11px;letter-spacing:1px;margin-top:10px}#status{font-size:10px;line-height:1.5;min-height:30px;text-align:center;margin:9px 0;color:#4a5351}.controls{display:flex;align-items:center;justify-content:space-between;padding:3px 4px 8px;gap:10px}.dpad{display:grid;grid-template:repeat(3,32px)/repeat(3,32px);filter:drop-shadow(0 3px 1px #7c7f77)}.dpad button,.pad-center{border:0;background:#2c3033;color:#73787a;font-size:16px;touch-action:none;user-select:none;-webkit-user-select:none}.dpad button:active{background:#15191b;color:#ccd3c5}.dpad [data-dir=up]{grid-area:1/2;border-radius:4px 4px 0 0}.dpad [data-dir=left]{grid-area:2/1;border-radius:4px 0 0 4px}.pad-center{grid-area:2/2;background:radial-gradient(circle,#202426 0 28%,#2c3033 30%)}.dpad [data-dir=right]{grid-area:2/3;border-radius:0 4px 4px 0}.dpad [data-dir=down]{grid-area:3/2;border-radius:0 0 4px 4px}.utility{display:grid;grid-template-columns:1fr 1fr;gap:4px 9px;text-align:center;align-self:end;padding-bottom:7px}.utility button{grid-row:1;border:0;border-radius:12px;background:#727873;color:#f2f3e9;font-size:8px;font-weight:800;padding:9px 7px;min-height:36px;box-shadow:0 3px #8a8e84}.utility small{grid-row:2;font-size:7px;white-space:nowrap}.trigger{display:flex;flex-direction:column;align-items:center;gap:7px;transform:rotate(-12deg)}.trigger button{width:64px;height:64px;border-radius:50%;border:2px solid #9b5427;background:linear-gradient(135deg,#e5a24f,#bd7135);color:#fff1d8;box-shadow:0 5px #8e4a26,0 8px 7px #7776;font-size:25px;font-weight:800}.trigger button:active{transform:translateY(3px);box-shadow:0 2px #8e4a26}.trigger span{font-size:9px;letter-spacing:2px;font-weight:800;color:#424c6c}details{margin-top:12px;border-top:1px solid #a6aaa0;padding-top:10px;font-size:11px}summary{cursor:pointer;min-height:30px}details label{display:block;margin:9px 0}.tools,.manual{display:flex;gap:7px;margin:8px 0}.tools button,.manual button,.manual select{min-height:38px;background:#dedfd5;border:1px solid #9ca497;border-radius:5px;font-size:10px;padding:7px;flex:1}.note{font-size:10px;line-height:1.6;color:#555e56}footer{display:flex;justify-content:space-between;margin:12px 5px 0;font-size:7px;letter-spacing:1px;color:#697167}@media(max-width:350px){.console{padding:12px}.utility{gap:3px}.dpad{grid-template:repeat(3,28px)/repeat(3,28px)}.trigger button{width:55px;height:55px}.controls{gap:5px}}@media(prefers-reduced-motion:reduce){.reticle.firing{box-shadow:none}}