*,*:before,*:after{box-sizing:border-box}body{margin:0;padding:0;font-family:sans-serif;background-color:#f0f0f0}#app-wrapper{width:100%;max-width:900px;margin:0 auto;background-color:#fff;min-height:100vh;box-shadow:0 0 15px #0000001a;position:relative}.toolbar{width:100%;height:60px;background-color:#19448e;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 15px;position:sticky;top:0;z-index:1000;box-shadow:0 2px 10px #0000004d}.app-title{font-weight:700;font-size:18px}.menu-actions{display:flex;align-items:center;gap:10px}.icon-btn{background:transparent;border:none;color:#fff;cursor:pointer;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:background .2s}.icon-btn:hover{background-color:#fff3}.icon-btn.active{background-color:#ff9f43;color:#fff}.material-symbols-outlined{font-size:24px}.board-container{width:100%;padding:0;margin:0;position:relative}.court{width:100%;aspect-ratio:1 / 2;background:#ff9f43;position:relative;overflow:hidden;border-bottom:2px solid white}.net-line,.attack-line{position:absolute;left:0;width:100%;background-color:#ffffffe6;pointer-events:none}.net-line{top:50%;height:4px;transform:translateY(-50%)}.attack-line{height:2px}.attack-line.top{top:33.33%}.attack-line.bottom{top:66.66%}.player{position:absolute;width:18%;height:auto;aspect-ratio:1;background-color:#19448e;color:#fff;border:2px solid white;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:clamp(12px,8vw,64px);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;z-index:10;box-shadow:2px 2px 5px #0000004d;transform:translate(-50%,-50%)}.player.opponent{background-color:#e74c3c;transform:translate(-50%,-50%) rotate(180deg)}.player.ball{background:transparent;border:none;box-shadow:none;font-size:clamp(24px,10vw,60px);display:flex;align-items:center;justify-content:center;line-height:1}#drawing-canvas{position:absolute;top:0;left:0;width:100%;height:100%;z-index:100;pointer-events:none}.usage-guide{max-width:800px;margin:20px auto;padding:20px;background-color:#f9f9f9;border-radius:8px;color:#333;font-size:14px}.usage-guide h3{margin-top:0;border-bottom:2px solid #ddd;padding-bottom:5px;font-size:16px}.usage-guide ul{padding-left:20px;line-height:1.8}.usage-guide li{margin-bottom:5px}.contact-link{margin-top:15px;text-align:right;font-size:12px;color:#666}.revenue-section{margin-top:50px;margin-bottom:50px;padding:0 15px;font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif}.ad-container{text-align:center;margin-bottom:40px}.ad-label{display:block;font-size:12px;color:#999;margin-bottom:5px}.recommend-goods{background-color:#fffbf0;border:2px dashed #ff9800;border-radius:8px;padding:25px 20px;margin:0 auto;max-width:600px;box-sizing:border-box;text-align:center}.recommend-title{color:#d84315;font-weight:700;font-size:18px;margin-bottom:10px;line-height:1.4}.recommend-text{font-size:15px;color:#333;line-height:1.6;margin:0 0 20px}.goods-catch{font-weight:700;color:#333;font-size:16px;margin:0 0 15px;display:block}.goods-item{width:100%}