*{box-sizing:border-box}body{margin:0;background:#171720;color:#fff4d5;font-family:'Yu Gothic',Meiryo,sans-serif}main{max-width:1040px;margin:0 auto;padding:20px}header{display:flex;align-items:baseline;gap:20px}header span,.foot{color:#c9a97e;font-size:12px;letter-spacing:.12em}h1{font-size:24px;margin:0}header p{margin-left:auto;color:#d7c9b5;font-size:13px}.frame{position:relative;margin-top:16px;border:5px solid #5c493c;border-radius:12px;overflow:hidden;background:#111;box-shadow:0 18px 60px #0009}canvas{display:block;width:100%;height:auto;image-rendering:pixelated}#overlay{position:absolute;inset:0;pointer-events:none;display:flex;align-items:center;justify-content:center}#overlay>div{pointer-events:auto;background:#211d25ed;border:2px solid #b99665;border-radius:12px;padding:24px 32px;text-align:center;max-width:82%;box-shadow:0 12px 45px #0009}button{background:#f4cd78;color:#30251c;border:0;border-radius:7px;padding:10px 18px;font-weight:bold;font-size:15px;cursor:pointer;margin:5px}button:hover{background:#ffe8a7}button:disabled{opacity:.4;cursor:default}.foot{display:flex;justify-content:space-between;margin:12px 5px}p{line-height:1.7}small{color:#d3c5ad}@media(max-width:700px){header{display:block}header p{display:none}main{padding:8px}h1{font-size:20px}#overlay>div{padding:12px}button{font-size:12px;padding:7px}}

#overlay>div:has(.feedback-list){max-height:92%;overflow:auto;width:min(620px,90%)}textarea{width:100%;min-height:70px;resize:vertical;padding:10px;font:inherit}.feedback-list{max-height:155px;overflow:auto;text-align:left;background:#151820;padding:10px}.feedback-list article{border-bottom:1px solid #66594f;padding:6px}.feedback-list p{white-space:pre-wrap;overflow-wrap:anywhere;margin:5px 0}.feedback-list small{font-size:12px}

#overlay>div:has(.help-content){width:min(700px,90%);max-height:92%;overflow:auto;text-align:left} .help-content h2{font-size:19px;color:#f4cd78}.help-content p{font-size:14px;line-height:1.7}.help-content a{color:#f4cd78}

#mobile-controls{display:none} .mobile-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mobile-actions button{margin:0;min-height:48px;font-size:15px;touch-action:manipulation}.mobile-work,.mobile-cave{display:none}#mobile-controls[data-mode="work"] .mobile-work,#mobile-controls[data-mode="cave"] .mobile-cave{display:block}#mobile-work-status,#mobile-cave-status{font-weight:bold;color:#ffe6a3;font-size:16px}.mobile-work p{margin:5px 0;font-size:14px}.cave-actions{grid-template-columns:repeat(4,minmax(0,1fr))}.cave-actions button{padding:8px 2px;min-height:60px;touch-action:none;user-select:none;-webkit-user-select:none}.secondary{margin-top:8px}.foot{gap:8px}
@media(max-width:700px),(pointer:coarse){#mobile-controls{display:block;margin-top:10px}#mobile-controls[data-mode="other"]{display:none}.frame{margin-top:8px}#overlay:has(>div){position:fixed;inset:0;z-index:20;background:#10101bcf;padding:12px}#overlay>div,#overlay>div:has(.feedback-list),#overlay>div:has(.help-content){width:min(100%,620px);max-width:100%;max-height:90dvh;overflow:auto;padding:18px}#overlay>div button{min-height:44px;font-size:15px;padding:10px 14px}#overlay>div p{font-size:15px}.help-content p{font-size:15px}.feedback-list{max-height:25dvh}textarea{font-size:16px;min-height:90px}header span{font-size:10px}.foot{font-size:10px}.frame canvas{touch-action:manipulation}}

#feedback-form label{display:block;text-align:left;margin:8px 0 4px;font-size:14px}#feedback-nickname{width:100%;padding:10px;font:inherit;font-size:16px;margin-bottom:8px}

@media(max-width:700px),(pointer:coarse){#mobile-work-status,#mobile-cave-status{font-size:18px;line-height:1.5}.mobile-work p,.mobile-items,.mobile-hint,.mobile-message{font-size:16px;line-height:1.6;margin:8px 0}.mobile-items{color:#fff2d3}.mobile-hint,.mobile-message{padding:10px 12px;border-radius:7px;background:#2d2932;color:#fff4d5}.mobile-hint{border-left:4px solid #f4cd78}.mobile-message{border-left:4px solid #a7d7b9}.mobile-actions button{font-size:16px}.cave-actions button{font-size:16px}}

.lane-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:8px 0}.lane-buttons button{margin:0;min-height:56px;font-size:18px;touch-action:manipulation;background:#ffda78}

#tutorial[hidden]{display:none}#tutorial{position:fixed;inset:0;z-index:100;touch-action:none}#tutorial-spot{position:fixed;border:4px solid #ffe274;border-radius:9px;box-shadow:0 0 0 9999px #0a0b13c9,0 0 20px 5px #ffdf7d;pointer-events:none}.tutorial-card{position:fixed;z-index:1;bottom:16px;left:50%;transform:translateX(-50%);width:min(92vw,560px);background:#26242e;border:2px solid #f4cd78;border-radius:14px;padding:15px 20px;color:#fff4d5;box-shadow:0 8px 28px #0009;touch-action:manipulation}.tutorial-card small{color:#f4cd78;font-weight:bold}.tutorial-card h2{font-size:20px;margin:5px 0}.tutorial-card p{font-size:16px;line-height:1.55;margin:6px 0 10px}.tutorial-card div{text-align:right}.tutorial-card button{font-size:16px;min-height:44px}.tutorial-card #tutorial-skip{background:#625967;color:#fff}

.tutorial-card.tutorial-card-top{top:16px;bottom:auto}
#work-extra{display:none;margin:10px 0}body[data-mode="work"] #work-extra{display:block}#open-rhythm{font-size:16px;min-height:48px;background:#eec9f2;color:#3a2750}#classic-tap{display:none}@media(max-width:700px),(pointer:coarse){#classic-tap{display:block;width:100%;min-height:50px;margin:8px 0;font-size:16px}}
#rhythm-root[hidden]{display:none}#rhythm-root{position:fixed;inset:0;z-index:80;background:#11111ff7;overflow:auto;padding:12px;color:#fff7e4}#rhythm-root .rhythm-shell{max-width:880px;margin:auto;background:#252338;border:2px solid #b99cde;border-radius:16px;padding:16px;box-shadow:0 0 32px #ba8ade40}#rhythm-root h2{margin:2px 0 8px;color:#ffe8a5}#rhythm-root p{margin:6px 0;line-height:1.5}#rhythm-root button{font-size:15px;min-height:44px}#rhythm-root .r-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}#rhythm-root .r-panel{background:#171927;border-radius:10px;padding:10px;margin:8px 0}#rhythm-root .r-setting{display:grid;grid-template-columns:1fr auto;gap:4px;align-items:center;border-top:1px solid #7773;padding:8px 0}#rhythm-root input[type=range]{width:min(100%,300px)}#rhythm-root .r-setting small{display:block;color:#d9d3e7;line-height:1.4}#rhythm-root canvas{width:100%;height:auto;max-height:48vh;object-fit:contain;background:#101323;border:1px solid #9a8ba9;border-radius:8px;touch-action:none}#rhythm-root .r-controls{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0}#rhythm-root .r-controls button{margin:0;min-height:62px;font-size:20px;touch-action:none;user-select:none;background:#bde4ed}#rhythm-root .r-status{font-weight:bold;color:#ffe9a1;min-height:1.5em}#rhythm-root .r-debug{font:12px Consolas,monospace;white-space:pre-wrap;color:#dce9df}#rhythm-root .r-results{font-size:18px}#rhythm-root .r-secondary{background:#665c76;color:white}@media(max-width:700px),(pointer:coarse){#rhythm-root{padding:5px}#rhythm-root .rhythm-shell{padding:10px}#rhythm-root canvas{max-height:39vh}#rhythm-root button{font-size:15px}#rhythm-root .r-setting{grid-template-columns:1fr auto}#rhythm-root .r-controls button{min-height:64px}}
#rhythm-root .r-controls button.r-hit{background:#fff7c4;box-shadow:0 0 20px #ffe7a0;transform:scale(.97)}
#rhythm-root canvas{max-height:none;aspect-ratio:800/660;object-fit:fill}#rhythm-root .r-controls{gap:0}#rhythm-root .r-controls button{position:relative;height:100px;min-height:64px;background:transparent url('assets/rhythm-button-normal.png') center/contain no-repeat;box-shadow:none;transform:none}#rhythm-root .r-controls button.r-hit{background:transparent url('assets/rhythm-button-pressed.png') center/contain no-repeat;box-shadow:none;transform:scale(.97)}#rhythm-root .r-controls button.r-held{background-image:url('assets/rhythm-button-hold.png')}#rhythm-root .r-controls button:disabled{background-image:url('assets/rhythm-button-disabled.png');opacity:.65}#rhythm-root .r-controls button span{display:inline-block;background:#181322db;color:#fff8d5;padding:3px 7px;border-radius:6px;font-size:15px;position:absolute;left:50%;bottom:0;transform:translateX(-50%);white-space:nowrap}@media(max-width:700px),(pointer:coarse){#rhythm-root canvas{max-height:none}#rhythm-root .r-controls button{height:80px}}

/* 投稿全文を表示し、画面全体で自然にスクロールする。 */
.feedback-heading{text-align:left;margin:18px 0 8px;color:#ffe7a5}.feedback-list{max-height:none;overflow:visible;padding:10px 14px;border-radius:8px}.feedback-list article{padding:14px 4px}.feedback-list p{font-size:16px;line-height:1.7;margin:8px 0;color:#fff8ec}.feedback-list small{font-size:13px;color:#e4d4af}#feedback-body{min-height:120px;line-height:1.6}@media(max-width:700px),(pointer:coarse){.feedback-list{max-height:none;overflow:visible}.feedback-list p{font-size:16px;line-height:1.7}#feedback-body{min-height:120px}}

/* タイトル画面の企画説明と物語を分ける */
#overlay>div:has(.title-intro){width:min(570px,92%);max-height:94%;overflow:auto}.title-intro h2{margin:0 0 14px;font-size:22px}.title-intro section{text-align:left;background:#ffffff0a;border-left:3px solid #e8c17a;border-radius:4px;padding:8px 14px;margin:9px 0}.title-intro h3{margin:0;color:#f4cd78;font-size:15px}.title-intro p{margin:3px 0 0;font-size:14px;line-height:1.55}@media(max-width:700px),(pointer:coarse){#overlay>div:has(.title-intro){width:min(100%,570px);max-height:90dvh}.title-intro h2{font-size:20px}.title-intro h3{font-size:16px}#overlay .title-intro p{font-size:15px}}

/* リザルトのランクは、後から画像にも差し替え可能。 */
#rhythm-root .r-rank{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:12px auto;padding:12px;width:150px;min-height:108px;border:2px solid #f7d277;border-radius:18px;background:linear-gradient(140deg,#59427a,#2a4059);box-shadow:0 0 22px #e7bc6855;color:#ffe7a0}#rhythm-root .r-rank-label{font-size:14px;letter-spacing:.2em}#rhythm-root .r-rank strong{font-size:52px;line-height:1.1;text-shadow:0 3px 0 #90572e}#rhythm-root .r-rank img{max-width:140px;max-height:110px;image-rendering:pixelated}#rhythm-root .r-result-hint{font-size:14px;line-height:1.6;color:#e9d7b5}#rhythm-root .r-share{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:5px;padding:10px 18px;border-radius:7px;background:#090b12;color:white;font-weight:bold;text-decoration:none}#rhythm-root .r-share:hover{background:#354052}

#rhythm-root .r-rank{width:100%;max-width:720px;min-height:0;padding:0;overflow:hidden;border-radius:12px}#rhythm-root .r-rank img{display:block;width:100%;max-width:none;max-height:none;height:auto}#rhythm-root .r-rank img[hidden],#rhythm-root .r-rank-fallback[hidden]{display:none}#rhythm-root .r-rank-fallback{padding:25px;font-size:38px;font-weight:bold}

#overlay>div:has(.shipping-panel){width:min(760px,95%);max-height:94%;overflow:auto}.shipping-panel h2{margin:0 0 10px}.shipping-panel img{display:block;width:100%;height:auto;border-radius:8px}.shipping-panel button{margin-top:12px}#open-shipping{font-size:16px;min-height:48px;background:#abd5dd;color:#203440}
#rhythm-root .r-cheer-board{height:94px;display:flex;align-items:center;justify-content:center;gap:12px;margin:4px 0 6px;padding:0 10px;overflow:hidden;border:1px solid #eedc9a70;border-radius:10px;background:linear-gradient(90deg,#333050,#40304e,#294652)}#rhythm-root .r-cheer-people{height:100%;display:flex;align-items:end}#rhythm-root .r-cheer-slot{width:86px;height:86px;visibility:hidden;position:relative}#rhythm-root .r-cheer-slot.is-visible{visibility:visible}#rhythm-root .r-cheer-sprite{width:100%;height:100%;background-position:0 0;background-repeat:no-repeat;background-size:300% 100%;animation:r-cheer-frames 1.2s steps(3) infinite}#rhythm-root .r-cheer-kani{background-image:url('assets/rhythm-cheer-kani.webp')}#rhythm-root .r-cheer-shiitake{background-image:url('assets/rhythm-cheer-shiitake.webp')}#rhythm-root .r-cheer-neko{background-image:url('assets/rhythm-cheer-neko.webp')}#rhythm-root #r-cheer-text{font-size:14px;color:#ffedb5;white-space:normal}#rhythm-root .r-cheer-board.is-hit .is-visible .r-cheer-sprite{animation:r-cheer-frames 1.2s steps(3) infinite,r-cheer-rainbow .24s ease-out 1}#rhythm-root .rhythm-shell:has(#r-paused:not([hidden])) .r-cheer-sprite{animation-play-state:paused}@keyframes r-cheer-frames{from{background-position-x:0%}to{background-position-x:150%}}@keyframes r-cheer-rainbow{0%{filter:drop-shadow(0 0 5px #ff5eb1) brightness(1.35)}33%{filter:drop-shadow(0 0 10px #ffe75b) brightness(1.2)}66%{filter:drop-shadow(0 0 10px #67f8fc) brightness(1.15)}100%{filter:none}}@media(max-width:700px),(pointer:coarse){#overlay>div:has(.shipping-panel){width:100%;max-height:90dvh}#rhythm-root .r-cheer-board{height:72px;gap:3px;padding:0 5px}#rhythm-root .r-cheer-slot{width:65px;height:65px}#rhythm-root #r-cheer-text{font-size:12px}}@media(prefers-reduced-motion:reduce){#rhythm-root .r-cheer-sprite,#rhythm-root .r-cheer-board.is-hit .is-visible .r-cheer-sprite{animation:none}}

#rhythm-root .r-sound-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#rhythm-root .r-sound-setting{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px;align-items:center}#rhythm-root .r-sound-setting label{font-weight:bold;white-space:nowrap}#rhythm-root .r-sound-setting select{min-width:0;min-height:44px;padding:5px;font:inherit;font-size:15px;border-radius:6px}#rhythm-root .r-sound-setting button{margin:0;padding:8px}#rhythm-root #r-se-status{display:block;margin-top:8px;color:#e5d7b8}@media(max-width:700px),(pointer:coarse){#rhythm-root .r-sound-grid{grid-template-columns:1fr}#rhythm-root .r-sound-setting select{font-size:16px}}

#rhythm-root .r-judgement-guide summary{font-weight:bold;cursor:pointer;color:#ffe6a5;min-height:44px;display:flex;align-items:center}#rhythm-root .r-judgement-guide img{display:block;width:100%;height:auto;border-radius:6px;margin:10px 0}#rhythm-root .r-judgement-guide small{color:#ddd2b9}

#rhythm-root .r-track-panel label,#rhythm-root .r-track-panel small{display:block}#rhythm-root .r-track-panel select{width:100%;max-width:560px;min-height:44px;padding:8px;margin:8px 0;font:inherit;font-size:16px;border-radius:6px}#rhythm-root .r-track-panel small{color:#e5d7b8}

#rhythm-root .r-food-labels{display:grid;grid-template-columns:repeat(4,1fr);text-align:center;color:#ffe8bd;font-size:14px;font-weight:bold;margin:4px 0 -2px}@media(max-width:700px),(pointer:coarse){#rhythm-root .r-food-labels{font-size:12px}}

#overlay>div:has(.shop){width:min(840px,95%);max-width:95%;max-height:94%;overflow:auto;padding:12px 20px}.shop h2{margin:0}.shop-header{display:flex;align-items:center;justify-content:center;gap:20px;text-align:left}.shop-header img{width:68px;height:85px;object-fit:contain;image-rendering:pixelated}.shop-header p{margin:2px 0}.shop-notice{min-height:1em;margin:0;color:#ffe4a0}.shop-items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.shop-items article{background:#ffffff10;border:1px solid #b99665;border-radius:9px;padding:8px}.shop-items img{width:100%;height:68px;object-fit:contain;image-rendering:pixelated}.shop-items p{font-size:12px;line-height:1.35;margin:4px 0;min-height:3em}.shop-items button{margin:3px}.shop-items b{font-size:14px}@media(max-width:700px),(pointer:coarse){#overlay>div:has(.shop){max-height:90dvh;width:min(100%,620px);overflow:auto}.shop-items{grid-template-columns:1fr}.shop-items article{display:flex;align-items:center;gap:10px;text-align:left}.shop-items img{width:72px;flex:none}.shop-items p{min-height:0!important;margin:3px 0;font-size:14px!important}.shop-header img{width:60px}.shop-header{gap:10px}}
#territory-root{position:fixed;inset:0;z-index:30;background:#171720;overflow:auto;padding:12px;color:#fff4d5}#territory-root[hidden]{display:none}.t3-shell{max-width:1000px;margin:auto;position:relative}.t3-shell h2{margin:4px 0;font-size:21px}.t3-shell h2 small{font-size:12px}.t3-shell p{margin:4px 0;font-size:15px}#t3-status{font-weight:bold;color:#ffe294}#t3-message{min-height:1.7em}#t3-map{width:100%;height:auto;max-height:55vh;object-fit:contain;background:#416b35;border:3px solid #9b7548;border-radius:8px;image-rendering:pixelated;touch-action:manipulation}.t3-actions{display:flex;flex-wrap:wrap;gap:4px}.t3-actions button{margin:2px;min-height:44px}.t3-result{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#171720ef;z-index:33}.t3-result img{max-width:min(90vw,800px);max-height:65vh;object-fit:contain}.t3-result h2{font-size:30px;color:#ffdc7e}@media(max-width:700px){#territory-root{padding:8px}.t3-shell h2{font-size:17px}.t3-actions{display:grid;grid-template-columns:repeat(2,1fr)}.t3-actions button{font-size:14px}.t3-help{font-size:13px!important}}

.resource-icon{display:flex;align-items:center;justify-content:center;height:68px;font-size:42px}@media(max-width:700px),(pointer:coarse){.resource-icon{width:72px;flex:none}}

#mobile-attack{display:none}body[data-stage="3"] #mobile-attack{display:block}

#overlay>div:has(.cave-ranking){width:min(650px,94%);max-height:94%;overflow:auto}.cave-ranking p{text-align:left;font-size:13px;line-height:1.5}.cave-ranking ol{text-align:left;margin:8px auto;max-width:420px}.cave-ranking li{padding:5px;border-bottom:1px solid #ffffff22}.cave-ranking strong{font-size:19px;color:#ffe29b}@media(max-width:700px),(pointer:coarse){#overlay>div:has(.cave-ranking){max-height:90dvh;width:100%}.cave-ranking p{font-size:15px}}

.cave-ranking input{font:inherit;font-size:16px;max-width:190px;padding:8px}.cave-ranking h3{margin:10px 0 3px;color:#ffdf99}.ranking-note{opacity:.8;font-size:12px!important}

#fish-controls{display:none;gap:10px;justify-content:center;margin:8px auto}body[data-mode="work"] #fish-controls{display:flex}#fish-controls button{margin:0;padding:0;border:0;background:transparent;touch-action:manipulation;min-width:92px;width:min(26%,145px);line-height:1;position:relative}#fish-controls img{display:block;width:100%;height:78px;object-fit:contain;image-rendering:pixelated}#fish-controls button:active{transform:scale(.94)}#fish-marlin{border-radius:12px!important;background:#16436a!important;color:#fff!important;display:flex;align-items:center;justify-content:center}#fish-marlin img{width:60%}#fish-marlin span{font-size:15px;line-height:1.25}#fish-controls button:disabled{opacity:.45}

#overlay>div:has(.fishing-panel){width:min(720px,95%);max-height:94%;overflow:auto;padding:14px 20px}.fishing-panel h2,.fishing-panel h3{margin:4px 0}.fishing-panel p{margin:5px 0;line-height:1.4}.fishing-scene{height:clamp(100px,20vh,180px);background:linear-gradient(0deg,#08283ac9,transparent 65%),url("assets/work-sourcing.png") center 53%/cover;border-radius:8px;display:flex;align-items:end;justify-content:center}.fishing-scene span{background:#16283cda;padding:5px 10px;border-radius:6px}.fishing-baits,.fishing-controls{display:flex;justify-content:center;gap:8px}.fishing-baits button,.fishing-controls button{flex:1;margin:3px;min-height:52px;touch-action:manipulation}.fishing-baits small{display:block;color:#503a2b;font-size:12px}.fishing-panel details{text-align:left;margin:7px auto;max-width:400px}.fishing-panel details ul{margin:4px}.fishing-arena{height:clamp(110px,22vh,185px);position:relative;overflow:hidden;border-radius:8px;background:linear-gradient(#55bde5,#087eaf 55%,#075484);border:2px solid #8bdcf6}.fishing-swimmer{position:absolute;top:35%;width:clamp(90px,25%,180px);transform:translateX(-50%);transition:left .25s ease}.fishing-swimmer img{display:block;width:100%;height:80px;object-fit:contain;image-rendering:pixelated}.fishing-trash{font-size:64px;line-height:1.4}.fishing-direction{position:absolute;left:0;right:0;top:8px;color:#fff5a4;text-shadow:1px 2px 3px #093449;font-size:20px}.fishing-meter{height:22px;margin:10px 0;background:#302b30;border:2px solid #f5dda6;border-radius:20px;overflow:hidden}.fishing-meter div{height:100%;width:0;background:linear-gradient(90deg,#70d69d,#f7df72)}.fishing-controls button{font-size:22px;min-height:60px}.fishing-note{font-size:13px}.fishing-result-fish{width:min(80%,350px);height:130px;object-fit:contain;image-rendering:pixelated}.fishing-result-name{font-size:25px;font-weight:bold;color:#ffe08f}@media(max-width:700px),(pointer:coarse){#overlay>div:has(.fishing-panel){width:min(100%,620px);max-height:90dvh;padding:12px}.fishing-baits button{padding:7px 3px;font-size:15px}.fishing-baits small{font-size:11px}.fishing-controls button{min-height:68px;font-size:20px}.fishing-panel p{font-size:15px}}

.fishing-share{display:inline-block;background:#abd5dd;color:#203440;border-radius:7px;padding:10px 18px;margin:5px;font-weight:bold;font-size:15px;text-decoration:none;line-height:1.4}.fishing-share:hover{background:#c9eff5}@media(max-width:700px),(pointer:coarse){.fishing-share{min-height:44px;padding:11px 14px}}

.fishing-result-actions[aria-disabled="true"]{pointer-events:none;opacity:.55}.fishing-result-wait{font-size:13px;color:#ffe6a3}.fishing-result-wait[hidden]{display:none}
