/* Visual assets supplied for the Team Digital game portfolio. */
/* Touch layouts use the visible viewport, including short landscape screens. */
#collectionBackup[hidden] { display:none!important; }
#collectionBackup { margin:8px 0; }
.journal-open { min-height:34px; padding:6px 10px; border:2px solid #70593b; border-radius:8px; background:#fff5dc; color:#503b24; font:800 12px monospace; }
@media(max-width:600px) { .journal-open { font-size:10px; padding:5px; } .identity { display:none; } }
.journal-mode { place-items:center; padding:12px; background:#111810b8; backdrop-filter:blur(5px); }
.journal-mode .fishing-dialogue-card { display:block; width:min(1000px,100%); height:min(760px,calc(100dvh - 24px)); min-height:0; overflow:hidden; border:3px solid #644931; border-radius:18px; background:linear-gradient(90deg,#c6ac7c 0 8px,#f8f0df 8px 49.7%,#ddccab 50%,#f8f0df 50.3%); }
.journal-mode .fishing-portrait { display:none; }
.journal-mode .fishing-copy { height:100%; display:flex; flex-direction:column; padding:24px 28px; min-height:0; }
.journal-mode .fishing-copy>p { margin:8px 0 14px; font-size:clamp(19px,3vw,27px); }
.journal-mode .fishing-actions { flex-shrink:0; }
.journal-mode .fishing-collection { flex:1; min-height:0; max-height:none; overflow:auto; margin:12px 0 0; grid-template-columns:repeat(4,minmax(0,1fr)); align-content:start; }
.journal-mode .fish-slot { padding:12px; background:#fffcf2b8; border-color:#c9b48e; box-shadow:0 3px 0 #c5aa7e38; }
.journal-mode .fish-slot[hidden] { display:none!important; }
.journal-mode .fish-slot img { height:78px; }
.journal-mode .fish-slot b { font-size:13px; }
.journal-mode .fish-slot small { font-size:11px; }
.journal-mode .fish-slot em { font-size:10px; line-height:1.5; }
.journal-mode .fish-rarity { font-size:9px; }
#journalNavigation { margin-top:16px; display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:space-between; }
.fishing-dialogue:not(.journal-mode) #journalNavigation { display:none; }
.journal-tabs { display:flex; flex-wrap:wrap; gap:5px; }
.journal-tabs button,.journal-pagination button { padding:8px 10px; min-height:36px; border:1px solid #a68a60; border-radius:7px; background:#fff9e9; color:#604729; font:700 11px monospace; }
.journal-tabs button[aria-pressed="true"] { background:#5d7843; color:white; border-color:#455c30; }
.journal-pagination { display:flex; align-items:center; gap:8px; font:700 11px monospace; }
.journal-pagination button:disabled { opacity:.35; }
#collectionBackup { align-items:center; }
#collectionBackup button { background:#f9f1de; color:#574229; font-size:12px; }
#collectionBackup small { flex:1; min-width:180px; font:500 11px/1.5 monospace; color:#725e42; }
@media(max-width:600px) {
  .journal-mode .fishing-copy { padding:16px; }
  .journal-mode .fishing-collection { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .journal-mode .fish-slot img { height:60px; }
  #collectionBackup small { flex-basis:100%; }
}
@media(max-height:500px) and (orientation:landscape) {
  .journal-mode .fishing-copy { padding:10px 18px; }
  .journal-mode .fishing-copy>small { display:none; }
  .journal-mode .fishing-copy>p { margin:0 0 6px; font-size:18px; }
  .journal-mode .fishing-actions button { min-height:30px; padding:5px 10px; }
  #journalNavigation { margin-top:6px; }
  #collectionBackup { margin:5px 0 0; }
  #collectionBackup small { font-size:9px; }
  .journal-mode .fish-slot img { height:45px; }
}
@media (any-pointer:coarse) { .touch-controls { display:flex; } .controls { display:none; } }
@media (pointer:coarse), (any-pointer:coarse), (max-width:700px), (max-width:1100px) and (max-height:600px) {
  html,body { height:100%; overflow:hidden; overscroll-behavior:none; }
  body { position:fixed; inset:0; width:100%; }
  .app-shell { height:100dvh; min-height:0; padding:0; }
  .room.asset-room { width:100vw; height:100dvh; max-height:100dvh; aspect-ratio:auto; border:0; border-radius:0; touch-action:none; }
  .hud { top:max(8px,env(safe-area-inset-top)); width:calc(100% - 20px); }
  .touch-controls { inset:auto max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left)); }
  .fishing-dialogue-card { max-height:calc(100dvh - 30px); overflow:auto; }
}
@media (max-width:1100px) and (max-height:600px) {
  .touch-controls { display:flex; }
  .controls { display:none; }
}
@media (max-height:500px) and (orientation:landscape) {
  .identity { padding:6px 9px; font-size:12px; }
  .identity small { display:none; }
  .hud-actions { padding:5px 7px; gap:6px; }
  .profile-link { max-width:125px; font-size:10px; }
  .joystick { width:90px; height:90px; }
  #touchInteract { width:62px; height:62px; }
  .fishing-fight { bottom:14px; width:min(480px,calc(100% - 240px)); padding:9px 12px; }
  .fishing-dialogue { padding:8px; }
  .fishing-dialogue-card { grid-template-columns:110px minmax(0,1fr); min-height:0; }
  .fishing-portrait { max-height:155px; }
  .fishing-copy { padding:12px; }
  .fishing-copy>p { font-size:14px; margin:8px 0; }
  .fishing-collection { max-height:130px; }
}
.asset-room.riverside-room.rainy-room:not(.night-room) #playerSprite { filter:brightness(.86) saturate(.88) drop-shadow(0 5px 3px #23313b70); }
html body button,html body a,html body select,html body select option,html body [role="button"],html body input[type="checkbox"],html body .scene-hotspot,html body #fishingHookPrompt { cursor:url('assets/cursor-hand.svg') 14 3,pointer; }
html body button:disabled { cursor:not-allowed; }
html body input:not([type="checkbox"]),html body textarea { cursor:text; }
.game-clock { display:flex; align-items:center; gap:8px; padding:3px 9px 3px 3px; border-right:1px solid #94774d66; color:#40311e; min-width:110px; }
.game-clock>div { display:grid; gap:2px; }
.game-clock small { font:900 8px/1 ui-monospace,monospace; letter-spacing:.13em; color:#a06d2f; }
.game-clock strong { font:900 20px/1 ui-monospace,monospace; font-variant-numeric:tabular-nums; }
.game-clock div>span { font:700 9px/1 ui-monospace,monospace; color:#77654b; }
.clock-dial { position:relative; width:39px; height:39px; border:3px solid #83613b; border-radius:50%; background:radial-gradient(circle,#fff9df 58%,#edd2a2 60%); box-shadow:inset 0 0 0 2px #fff7de,0 2px 0 #38271933; }
.clock-dial::before { content:''; position:absolute; inset:4px; border:2px dotted #b39567; border-radius:50%; }
.clock-dial i { position:absolute; width:2px; height:12px; left:calc(50% - 1px); bottom:50%; background:#51402c; border-radius:2px; transform-origin:50% 100%; transform:rotate(var(--hand-angle,270deg)); }
.clock-dial::after { content:''; position:absolute; width:5px; height:5px; left:calc(50% - 2.5px); top:calc(50% - 2.5px); border-radius:50%; background:#9e733b; }
.dark .game-clock { color:#f5dfaf; }
.dark .game-clock small,.dark .game-clock div>span { color:#dbb981; }
@media(max-width:560px) { .game-clock { min-width:88px; gap:5px; padding-right:6px; } .clock-dial { width:30px; height:30px; } .game-clock strong { font-size:16px; } .hud-actions { gap:6px; } }
.room.asset-room {
  background-image: url('assets/background-motion/frame_01.webp');
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  image-rendering: auto;
}

.room.asset-room::before {
  content: '';
  position: absolute;
  z-index: 1;
  left: 38%;
  top: 20%;
  width: 48%;
  height: 58%;
  pointer-events: none;
  background: radial-gradient(ellipse at 48% 48%, rgba(255,238,177,.13), rgba(255,225,145,.045) 38%, transparent 72%);
  mix-blend-mode: screen;
  opacity: .22;
  transform: scale(.99);
  animation: sunlight-breathe 14s ease-in-out infinite alternate;
}

@keyframes sunlight-breathe {
  to { opacity: .48; transform: scale(1.015); }
}

.room.asset-room.night-room { background-image: url('assets/background-night/night_frame_01.webp'); }
.room.asset-room.night-room::before {
  left: 42%;
  top: 18%;
  width: 43%;
  height: 60%;
  background: radial-gradient(ellipse at 52% 43%, rgba(103,148,255,.12), rgba(70,112,224,.035) 42%, transparent 72%);
  mix-blend-mode: screen;
}

.hud-actions .icon-button {
  position: relative;
  display: grid;
  place-items: center;
  padding: 0;
  color: #30271f;
  transition: transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.profile-link {
  display:flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 10px;
  border:2px solid #2e241c;
  border-radius:9px;
  background:#fff8ea;
  color:#30271f;
  font-size:10px;
  font-weight:900;
  text-decoration:none;
  transition:transform .16s ease,background-color .16s ease,box-shadow .16s ease;
}
.profile-link svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.profile-link:hover { transform:translateY(-1px); background:#fffdf6; box-shadow:0 3px 0 #2e241c33; }
.dark .profile-link { border-color:#d8c8a8; background:#292b2d; color:#f5dfaf; }
@media (max-width:560px) { .profile-link span { display:none; } .profile-link { width:34px; justify-content:center; padding:0; } }
.hud-actions .icon-button:hover { transform: translateY(-1px); background:#fffdf6; box-shadow:0 3px 0 #2e241c33; }
.hud-actions .icon-button:active { transform: translateY(1px); box-shadow:none; }
.hud-actions .icon-button svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.theme-icon { position:absolute; transition:opacity .2s ease, transform .25s ease; }
.icon-sun { opacity:0; transform:scale(.65) rotate(-35deg); }
.dark .icon-moon { opacity:0; transform:scale(.65) rotate(25deg); }
.dark .icon-sun { opacity:1; transform:scale(1) rotate(0); }
.dark .hud-actions .icon-button { color:#f5dfaf; }
@media (prefers-reduced-motion: reduce) {
  .room.asset-room { background-image: url('assets/background-motion/frame_01.webp'); }
  .room.asset-room.night-room { background-image: url('assets/background-night/night_frame_01.webp'); }
  .room.asset-room::before { animation: none; opacity: .3; }
}
.asset-room .wall,
.asset-room .floor-grid { display: none; }

.asset-room .hotspot {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.asset-room .hotspot > *:not(.label) { visibility: hidden; }
.asset-room .desk { left: 24%; top: 38%; width: 24%; height: 29%; }
.asset-room .board { left: 29%; top: 6%; width: 13%; height: 17%; }
.asset-room .cabinet { right: 17%; top: 5%; width: 11%; height: 30%; }
.asset-room .sofa { right: 5%; top: 31%; width: 15%; height: 31%; }
.asset-room .bookshelf { left: 9%; top: 3%; width: 17%; height: 31%; }
.asset-room .plant { right: 5%; top: 47%; width: 17%; height: 22%; }

.asset-room .player {
  width: clamp(58px, 8.2vw, 106px);
  height: auto;
  aspect-ratio: 1086 / 1448;
  transform: translate(-50%, -91%);
  pointer-events: none;
}

.asset-room .player img {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 5px 3px #2d1c1366);
  transition: filter .55s ease, opacity .55s ease;
  user-select: none;
}

.asset-room .player .shadow {
  left: 18%;
  bottom: 0;
  width: 64%;
  height: 8%;
  background: #38271955;
  border-radius: 50%;
  filter: blur(2px);
}

.asset-room .player.facing-left,
.asset-room .player.facing-right,
.asset-room .player.facing-up,
.asset-room .player.facing-down { transform: translate(-50%, -91%); }
.dark .asset-room { filter: none; }
.dark .asset-room .player { filter: none; }
.dark .asset-room .player img {
  filter:
    brightness(var(--night-brightness,.7))
    saturate(var(--night-saturation,.94))
    contrast(1.035)
    sepia(var(--night-sepia,0))
    hue-rotate(var(--night-hue,-3deg))
    drop-shadow(0 0 3px rgb(77 116 204 / var(--night-blue-edge,.18)))
    drop-shadow(0 5px 4px #081126a6);
  opacity: .98;
}
.dark .asset-room .player .shadow { background:var(--night-shadow,rgba(8,17,43,.46)); filter:blur(3px); }
.dark .asset-room .prompt,
.dark .asset-room .controls { filter: brightness(1.22); }

.asset-room .prompt:not([hidden]) {
  animation: objectPromptFloat 1.05s ease-in-out infinite alternate;
}

.project-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 24px;
  padding: 11px 15px;
  border: 2px solid #efb25f;
  border-radius: 7px;
  background: #efb25f14;
  color: #ffd18f !important;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 4px 4px 0 #0005;
  transition: transform .16s ease, background-color .16s ease;
}
.project-link:hover { transform: translateY(-2px); background:#efb25f27; }
.project-link:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.project-link.secondary { border-color:#777c7f; background:#252a2d; color:#e7e4dc!important; }
.case-actions { display:flex; flex-wrap:wrap; gap:10px; }
.case-actions .project-link { margin-top:24px; }

.case-kicker,.editorial-kicker { display:flex; align-items:center; gap:10px; margin-bottom:16px; color:#efb25f; font-size:9px; font-weight:900; letter-spacing:.15em; }
.case-kicker span,.editorial-kicker span { display:grid; place-items:center; width:38px; height:38px; border:2px solid #efb25f; border-radius:7px; background:#efb25f18; color:#ffd28f; font-size:12px; letter-spacing:0; box-shadow:3px 3px 0 #0006; }
.case-title { margin-bottom:8px!important; font-size:clamp(27px,4vw,46px)!important; }
.case-headline,.editorial-headline { max-width:720px; margin:0 0 12px; color:#efb25f; font-size:clamp(17px,2.2vw,25px); font-weight:900; line-height:1.25; }
.case-lead { max-width:700px; color:#c7cacc; }
.case-tags { margin-top:17px; }
.case-comparison { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:28px 0 34px; }
.case-column { padding:17px; border:1px solid #4d5255; border-radius:8px; background:#111518bd; }
.case-column.before { border-top:3px solid #a95a4b; }
.case-column.after { border-top:3px solid #6ca774; }
.case-column small,.case-section-title small { color:#9ea4a6; font-size:8px; font-weight:900; letter-spacing:.14em; }
.case-column ul { margin:12px 0 0; padding:0; list-style:none; }
.case-column li { position:relative; margin:8px 0; padding-left:17px; color:#d9d9d4; font-size:11px; line-height:1.45; }
.case-column li::before { content:'›'; position:absolute; left:0; color:#efb25f; font-weight:900; }
.case-section-title { margin:34px 0 15px; }
.case-section-title h3 { margin:5px 0 0; color:#f2f0ea; font-size:clamp(18px,2.5vw,28px); }
.case-features { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.case-feature { position:relative; min-height:132px; padding:16px; border:1px solid #4d5255; border-radius:7px; background:#202528; }
.case-feature>small { color:#efb25f; font-weight:900; }
.case-feature h3 { margin:8px 0 5px; color:#f4f0e8; font-size:13px; }
.case-feature p { margin:0; color:#adb2b4; font-size:10px; line-height:1.45; }
.case-quote { margin:30px 0; padding:17px 20px; border-left:4px solid #efb25f; background:#efb25f0d; color:#f1d3a8; font-size:clamp(14px,2vw,19px); font-style:italic; line-height:1.5; }
.case-steps { display:grid; gap:8px; }
.case-step { display:grid; grid-template-columns:38px 1fr; gap:13px; padding:13px; border-bottom:1px solid #454a4c; }
.case-step>span { color:#efb25f; font-size:11px; font-weight:900; }
.case-step h3 { margin:0 0 4px; color:#f3f0e9; font-size:13px; }
.case-step p { margin:0; color:#aeb3b5; font-size:10px; line-height:1.45; }
.editorial-kicker small { color:#efb25f; }
.editorial-title { margin-bottom:8px!important; font-size:clamp(28px,4vw,50px)!important; }
.editorial-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:25px 0; }
.editorial-facts article { padding:14px; border-top:3px solid #efb25f; background:#202528; }
.editorial-facts small,.editorial-facts strong { display:block; }
.editorial-facts small { color:#949a9d; font-size:8px; letter-spacing:.1em; }
.editorial-facts strong { margin-top:8px; color:#f0ede6; font-size:11px; line-height:1.35; }

.window-body nav button.member-nav {
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:10px;
  padding:10px;
}
.member-nav .member-mark {
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border:1px solid #777a7c;
  border-radius:7px;
  background:#171a1c;
  color:#efb25f;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
}
.member-nav strong,.member-nav small { display:block; }
.member-nav strong { overflow:hidden; color:#f2eee5; font-size:12px; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.member-nav small { margin-top:4px; overflow:hidden; color:#9fa4a6; font-size:8px; line-height:1.25; letter-spacing:0; text-overflow:ellipsis; text-transform:none; white-space:nowrap; }
.member-nav.active .member-mark { border-color:#f0b15d; background:#4b3928; color:#ffd693; box-shadow:2px 2px 0 #0007; }
.member-heading { display:flex; align-items:center; gap:13px; margin-bottom:20px; }
.member-emblem { display:grid; place-items:center; flex:0 0 54px; width:54px; height:54px; border:2px solid #efb25f; border-radius:10px; background:#efb25f17; color:#ffc978; box-shadow:4px 4px 0 #0005; font-size:17px; font-weight:900; letter-spacing:.08em; }
.member-heading small { display:block; color:#8f9598; font-size:8px; letter-spacing:.16em; }
.member-heading p { margin:4px 0 0; color:#efb25f; font-size:12px; font-weight:800; line-height:1.35; }
.member-heading + h2 { font-size:clamp(24px,3vw,40px); }

@media (max-width:700px) {
  .window-body nav button.member-nav { min-width:215px; }
  .member-heading { margin-bottom:15px; }
  .member-emblem { flex-basis:46px; width:46px; height:46px; }
  .case-comparison,.case-features { grid-template-columns:1fr; }
  .editorial-facts { grid-template-columns:1fr; }
  .case-actions { flex-direction:column; }
  .case-actions .project-link { justify-content:space-between; width:100%; margin-top:8px; }
}

.onboarding {
  position:fixed;
  z-index:2600;
  inset:0;
  display:grid;
  place-items:center;
  padding:22px;
  background:#080a0bd1;
  backdrop-filter:blur(7px) saturate(.75);
}
.onboarding[hidden] { display:none; }
.onboarding-card {
  position:relative;
  width:min(590px,94vw);
  padding:34px 36px 30px;
  overflow:hidden;
  border:3px solid #dfcfaa;
  border-radius:13px;
  background:radial-gradient(circle at 90% 0,#384349 0,transparent 38%),#1a1e20;
  color:#f4f1e9;
  box-shadow:0 0 0 5px #3a3b3e,14px 18px 0 #0009;
}
.onboarding-card::after { content:''; position:absolute; right:-38px; bottom:-52px; width:170px; height:170px; border:2px solid #efad54; border-radius:50%; opacity:.12; }
.onboarding-mark { display:grid; place-items:center; width:54px; height:54px; margin-bottom:24px; border:2px solid #efad54; border-radius:10px; background:#efad5415; color:#ffc473; box-shadow:4px 4px 0 #0006; font-size:17px; font-weight:900; letter-spacing:.08em; }
.onboarding-card>small { color:#efad54; font-size:10px; font-weight:800; letter-spacing:.18em; }
.onboarding-card h1 { margin:7px 0 13px; font-size:clamp(28px,5vw,47px); line-height:1.03; }
.onboarding-card>p { margin:0; color:#c9cccd; font-size:14px; line-height:1.65; }
.onboarding-guide { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:25px 0 13px; }
.onboarding-guide span { display:flex; min-width:0; flex-direction:column; gap:8px; padding:12px 10px; border:1px solid #555b5e; border-radius:7px; background:#111416a3; }
.onboarding-guide kbd { align-self:flex-start; color:#ffc473; font-size:12px; }
.onboarding-guide b { color:#e2e3df; font-size:10px; font-weight:700; }
.onboarding-card .onboarding-touch { display:none; color:#d1d2cf; font-size:11px; }
#onboardingStart { display:flex; justify-content:space-between; align-items:center; width:100%; margin-top:19px; padding:13px 15px; border:2px solid #f3d9aa; border-radius:7px; background:#a94c38; color:#fff8e9; box-shadow:4px 5px 0 #0008; cursor:pointer; font-weight:900; }
#onboardingStart:hover { background:#bb5841; transform:translateY(-1px); }
#onboardingStart:focus-visible { outline:3px solid #fff; outline-offset:4px; }
.onboarding-card>em { display:block; margin-top:15px; color:#858b8e; font-size:8px; font-style:normal; line-height:1.45; }
@media (pointer:coarse) {
  .onboarding-guide { grid-template-columns:1fr 1fr; }
  .onboarding-guide span:nth-child(-n+2) { display:none; }
  .onboarding-card .onboarding-touch { display:block; }
}
@media (max-width:520px) {
  .onboarding-card { padding:27px 22px 24px; }
  .onboarding-mark { width:46px; height:46px; margin-bottom:18px; }
  .onboarding-guide { grid-template-columns:1fr; margin-top:19px; }
}

.modal-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 7px;
  padding: 8px 12px;
  border-top: 1px solid #444a4d;
  background: #111416;
  color: #aeb4b7;
  font-size: 10px;
}
.modal-controls kbd { color:#efb25f; font-weight:800; }
.modal-controls span { opacity:.45; }

/* Modal shell: header and controls stay visible; only navigation/content scroll. */
.game-window {
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  height:min(82vh,760px);
  max-height:none;
}
.window-body {
  min-height:0;
  max-height:none;
  overflow:hidden;
  grid-template-rows:minmax(0,1fr);
}
.window-body nav,
.window-body article {
  min-width:0;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-color:#777 #171a1d;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
.window-body article { padding-bottom:42px; }
.modal-controls { position:relative; z-index:3; flex:none; }

@media (max-width:700px) {
  .modal-backdrop { padding:8px; }
  .game-window { width:100%; height:calc(100svh - 16px); max-height:none; }
  .game-window>header { padding:10px 12px; }
  .game-window header button { width:36px; height:36px; }
  .window-body {
    grid-template-columns:1fr;
    grid-template-rows:auto minmax(0,1fr);
  }
  .window-body nav { max-height:112px; touch-action:pan-x; }
  .window-body article { padding:20px 18px 34px; touch-action:pan-y; }
  .modal-controls { padding:6px 8px; font-size:8px; }
}
@media (pointer:coarse) and (orientation:landscape) and (max-height:650px) {
  .modal-backdrop { padding:6px; place-items:stretch; }
  .game-window { width:100%; height:calc(100svh - 12px); max-height:none; border-width:3px; }
  .game-window>header { min-height:54px; padding:6px 10px; }
  .game-window h1 { margin:0; font-size:clamp(18px,4.5vh,25px); }
  .game-window>header small { font-size:8px; }
  .game-window header button { width:34px; height:34px; font-size:22px; }
  .window-body { grid-template-columns:minmax(165px,31%) minmax(0,1fr); grid-template-rows:minmax(0,1fr); }
  .window-body nav { display:block; max-height:none; padding:8px; border-right:1px solid #4a4b4d; border-bottom:0; overflow-x:hidden; overflow-y:auto; touch-action:pan-y; }
  .window-body nav button { min-width:0; margin-bottom:5px; padding:8px 9px; font-size:11px; }
  .window-body article { padding:14px 16px 26px; overflow-y:auto; touch-action:pan-y; }
  .window-body article h2 { margin-bottom:10px; font-size:clamp(23px,7vh,34px); }
  .window-body article p { margin-block:8px; }
  .modal-controls { min-height:24px; padding:4px 8px; font-size:8px; }
}
@media (max-height:650px) and (min-width:701px) and (pointer:fine) {
  .modal-backdrop { padding:2vh 3vw; }
  .game-window { height:94vh; }
  .game-window>header { padding-block:10px; }
  .modal-controls { padding-block:6px; }
}

/* Fixed 1672×941 game world. The outer room is now a viewport/camera. */
.room.asset-room {
  background:#151013;
  image-rendering:auto;
}
.room.asset-room::before { display:none; }
.asset-loader {
  position:absolute;
  z-index:3000;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#171310;
  transition:opacity .65s ease,visibility .65s ease;
}
.asset-loader.is-ready { opacity:0; visibility:hidden; pointer-events:none; }
.asset-loader-scene { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.92) brightness(.72); transform:scale(1.015); }
.asset-loader::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,#100c0810 42%,#100c08b8 100%); }
.asset-loader-card { position:relative; z-index:1; align-self:end; width:min(500px,86vw); margin-bottom:clamp(26px,6vh,66px); padding:22px 25px 20px; border:2px solid #d7c7a2; border-radius:10px; background:#1a1e20e8; color:#eee; box-shadow:8px 10px 0 #0008; backdrop-filter:blur(7px); }
.asset-loader-brand { display:flex; align-items:center; gap:9px; margin-bottom:23px; color:#f7eedc; font-size:14px; }
.asset-loader-brand .status-dot { width:9px; height:9px; box-shadow:0 0 0 3px #d8ead433; }
.asset-loader-card>small { display:block; color:#efad54; font-size:8px; font-weight:900; letter-spacing:.16em; }
.asset-loader-title { display:block; margin:7px 0 14px; color:#f4f0e8; font-size:22px; line-height:1.15; }
.asset-loader-guide { display:grid; gap:9px; margin:0 0 17px; padding:12px 13px; border:1px solid #d7c7a233; border-radius:7px; background:#080a0b52; color:#f0ede5; font-size:11px; line-height:1.4; }
.asset-loader-guide>span { display:flex; align-items:center; gap:8px; }
.asset-loader-guide kbd { min-width:42px; padding:5px 7px; border:1px solid #e5d7b8; border-radius:4px; background:#f5ead4; color:#28231d; box-shadow:0 2px 0 #9f8d6c; font:800 10px/1 inherit; text-align:center; }
.asset-loader-guide .mobile-guide { display:none; }
.joystick-mark { width:17px; height:17px; flex:0 0 auto; border:1px solid #e5d7b8; border-radius:50%; box-shadow:inset 0 0 0 5px #f5ead429; }
.loading-dots { display:inline-block; width:25px; overflow:hidden; color:#efad54; animation:loading-dots 1.2s steps(4,end) infinite; }
@keyframes loading-dots { 0%{width:0} 33%{width:8px} 66%{width:16px} 100%{width:25px} }
.asset-loader-track { height:6px; overflow:hidden; border-radius:99px; background:#343a3d; }
.asset-loader-track span { display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg,#efad54,#f2d49e); transition:width .25s ease; }
.asset-loader-meta { display:flex; justify-content:space-between; gap:12px; margin-top:9px; color:#92999c; font-size:9px; }
.asset-loader-meta b { color:#efc37d; font-size:10px; }
@media (max-width:560px) { .asset-loader-scene { object-position:center; } .asset-loader-card { width:min(380px,88vw); margin-bottom:48px; padding:18px; } .asset-loader-title { font-size:20px; } .asset-loader-guide { padding:10px 11px; font-size:9px; } .asset-loader-guide kbd { min-width:38px; font-size:9px; } .asset-loader-guide .desktop-guide { display:none; } .asset-loader-guide .mobile-guide { display:flex; } }
@media (prefers-reduced-motion:reduce) { .loading-dots { animation:none; width:25px; } }
.asset-room .world {
  position:absolute;
  left:0;
  top:0;
  width:1672px;
  height:941px;
  overflow:hidden;
  transform-origin:top left;
  will-change:transform;
  background:url('assets/background-motion/frame_01.webp') center/100% 100% no-repeat;
}
.asset-room .world-video {
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  opacity:0;
  transition:opacity .65s ease;
}
.scene-background {
  position:absolute;
  z-index:0;
  inset:0;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
  opacity:0;
  transition:opacity .55s ease,filter .35s ease;
}
.asset-room.riverside-room .world { background-image:url('assets/scenes/riverside-day-new.webp'); }
.asset-room.riverside-room .world-video { opacity:0; }
.asset-room.riverside-room .hotspot { display:none; }
.asset-room.riverside-room .riverside-day-background { opacity:1; }
.asset-room.riverside-room .riverside-night-background { opacity:0; }
.asset-room.riverside-room.night-room .world { background-image:url('assets/scenes/riverside-night.webp'); }
.asset-room.riverside-room.night-room .riverside-day-background { opacity:0; }
.asset-room.riverside-room.night-room .riverside-night-background { opacity:1; }
.asset-room.riverside-room .riverside-day-video { opacity:1; }
.asset-room.riverside-room .riverside-rain-video { opacity:0; }
.asset-room.riverside-room.rainy-room .riverside-day-video { opacity:0; }
.asset-room.riverside-room.rainy-room:not(.night-room) .riverside-rain-video { opacity:1; }
.asset-room.riverside-room.night-room .riverside-day-video { opacity:0; }
.asset-room.riverside-room.night-room .riverside-rain-video { opacity:0; }
.asset-room.riverside-room.night-room .riverside-night-video { opacity:1; }
.asset-room.riverside-room .riverside-night-rain-video { opacity:0; }
.asset-room.riverside-room.night-room.rainy-room .riverside-night-video { opacity:0; }
.asset-room.riverside-room.night-room.rainy-room .riverside-night-rain-video { opacity:1; }
.asset-room.riverside-room .world::before {
  left:0;
  top:0;
  width:100%;
  height:100%;
  background:linear-gradient(180deg,transparent 50%,rgba(93,154,185,.05) 100%);
  mix-blend-mode:screen;
  opacity:.3;
}
.scene-hotspot {
  position:absolute;
  z-index:900;
  display:none;
  border:0;
  background:transparent;
  cursor:pointer;
}
.asset-room:not(.riverside-room) .studio-hotspot,
.asset-room.riverside-room .riverside-hotspot { display:block; }
.studio-exit { left:42%; top:86%; width:22%; height:13%; }
.river-door { left:43%; top:1%; width:17%; height:21%; }
.river-board { left:7%; top:4%; width:20%; height:29%; }
.river-tree { left:84%; top:2%; width:15%; height:34%; }
.river-workflow { left:70%; top:18%; width:19%; height:23%; }
.river-fishing { left:55%; top:52%; width:19%; height:27%; }
.river-easter { left:5%; top:68%; width:14%; height:22%; }
.scene-hotspot:focus-visible { outline:4px solid #fff3d2; outline-offset:-4px; border-radius:8px; }
.scene-fade {
  position:absolute;
  z-index:2900;
  inset:0;
  background:#120e0b;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .28s ease,visibility .28s ease;
}
.scene-fade.is-active { opacity:1; visibility:visible; }
.asset-room .day-video { opacity:1; }
.asset-room.night-room .world {
  background-image:url('assets/background-night/night_frame_01.webp');
}
.asset-room.night-room .day-video { opacity:0; }
.asset-room.night-room .night-video { opacity:1; }
.asset-room .world::before {
  content:'';
  position:absolute;
  z-index:1;
  left:38%;
  top:20%;
  width:48%;
  height:58%;
  pointer-events:none;
  background:radial-gradient(ellipse at 48% 48%,rgba(255,238,177,.13),rgba(255,225,145,.045) 38%,transparent 72%);
  mix-blend-mode:screen;
  opacity:.22;
  transform:scale(.99);
  animation:sunlight-breathe 14s ease-in-out infinite alternate;
}
.asset-room.night-room .world::before {
  left:42%;
  top:18%;
  width:43%;
  height:60%;
  background:radial-gradient(ellipse at 52% 43%,rgba(103,148,255,.12),rgba(70,112,224,.035) 42%,transparent 72%);
}
.asset-room .player { width:180px; }
.asset-room.riverside-room .player { width:150px; }
.asset-room.riverside-room .player.fishing-mode { width:270px; aspect-ratio:1312/1199; transform:translate(-48%,-88%); }
.asset-room.riverside-room .player.fishing-mode .shadow { left:34%; width:35%; }
.asset-room .player img.fishing-emotion {
  position:absolute;
  z-index:8;
  left:50%;
  top:-31%;
  width:48%;
  height:auto;
  aspect-ratio:1;
  object-fit:contain;
  transform:translateX(-50%);
  filter:drop-shadow(0 3px 3px #2b1b1266);
  opacity:1;
  pointer-events:none;
  animation:fishing-emotion-pop .32s cubic-bezier(.2,1.55,.45,1),fishing-emotion-float .65s .32s ease-in-out infinite alternate;
}
.asset-room .player.fishing-mode img.fishing-emotion { left:74%; top:-25%; width:40%; }
.asset-room .player img.fishing-emotion[hidden] { display:none!important; }
@keyframes fishing-emotion-pop { from { opacity:0; transform:translateX(-50%) scale(.35) translateY(18px); } }
@keyframes fishing-emotion-float { to { transform:translateX(-50%) translateY(-7px); } }

.fishing-bobber,.fishing-splash,.fishing-ripple,.fishing-shadow,.fishing-reward-fx {
  position:absolute;
  left:48.5%;
  top:65.5%;
  z-index:722;
  width:74px;
  height:74px;
  object-fit:contain;
  transform:translate(-50%,-50%);
  pointer-events:none;
  filter:drop-shadow(0 3px 3px #08203380);
}
.fishing-shadow { z-index:718; width:120px; height:120px; opacity:.34; filter:blur(.3px); animation:fish-shadow-drift 1.5s ease-in-out infinite alternate; }
.fishing-ripple { z-index:719; width:158px; height:158px; transform:translate(-50%,-67%); filter:drop-shadow(0 2px 2px #08203345); }
.fishing-splash { z-index:723; width:150px; height:150px; }
.fishing-bobber.sinking { width:128px; height:128px; }
.fishing-reward-fx { z-index:1095; left:60.5%; top:49%; width:240px; height:240px; filter:drop-shadow(0 0 10px #f2bd5577); }
@keyframes fish-shadow-drift { to { transform:translate(-44%,-53%) rotate(3deg); opacity:.23; } }
.fishing-caught-fish {
  position:absolute;
  z-index:1100;
  left:48.5%;
  top:65.5%;
  width:clamp(72px,9vw,126px);
  height:auto;
  object-fit:contain;
  pointer-events:none;
  filter:drop-shadow(0 7px 5px #09203370);
  transform:translate(-50%,-50%) rotate(-14deg) scale(.35);
}
.fishing-caught-fish.is-flying { animation:caught-fish-flight .92s cubic-bezier(.2,.72,.28,1) both; }
.fishing-caught-fish[hidden] { display:none!important; }
@keyframes caught-fish-flight {
  0% { left:48.5%; top:65.5%; opacity:0; transform:translate(-50%,-50%) rotate(-22deg) scale(.35); }
  14% { opacity:1; }
  48% { left:53.5%; top:39%; transform:translate(-50%,-50%) rotate(28deg) scale(1.05); }
  72% { left:58%; top:43%; transform:translate(-50%,-50%) rotate(-18deg) scale(.9); }
  100% { left:60.5%; top:49%; opacity:0; transform:translate(-50%,-50%) rotate(12deg) scale(.55); }
}
.fishing-bobber.fake-bite { animation:false-bite .42s ease-in-out 2; }
@keyframes false-bite { 45% { transform:translate(-50%,-32%) rotate(9deg) scale(.92); filter:drop-shadow(0 2px 2px #08203380) brightness(.9); } }
.fishing-fight {
  position:absolute;
  z-index:1900;
  left:50%;
  bottom:3.5%;
  width:min(700px,calc(100% - 32px));
  padding:17px 20px 18px;
  transform:translateX(-50%);
  border:3px solid #f3dfb7;
  border-radius:15px;
  background:linear-gradient(135deg,#202421f2,#121719f5);
  color:#fff7e6;
  box-shadow:0 0 0 3px #4c3c2b99,8px 9px 0 #0909098c,0 18px 38px #0007;
  backdrop-filter:blur(8px);
  font:700 14px/1.3 ui-monospace,monospace;
}
.fishing-fight[hidden] { display:none!important; }
.fight-heading,.fishing-fight label { display:flex; justify-content:space-between; align-items:center; }
.fight-heading { margin-bottom:14px; gap:14px; }
.fight-heading strong { padding:6px 10px; border:1px solid #e8bb71; border-radius:7px; background:#3b3022; color:#ffc86d; letter-spacing:.08em; font-size:14px; }
.fight-heading span { color:#cce4d0; font-size:14px; text-align:right; }
.fishing-fight label { margin:9px 2px 5px; color:#eee4d3; font-size:12px; letter-spacing:.03em; }
.fishing-fight label span { color:#fff; font-size:13px; }
.fight-meter { height:16px; overflow:hidden; border:2px solid #e8dac0; border-radius:999px; background:#2a3032; box-shadow:inset 0 2px 5px #0008; }
.fight-meter i { display:block; width:0; height:100%; transition:width .08s linear,background .15s; }
.fight-meter.progress i { background:linear-gradient(90deg,#6d9b4e,#a6c968); }
.fight-meter.tension i { background:linear-gradient(90deg,#71a8cb 0 50%,#efb34e 72%,#d64b3f 100%); }
.fishing-fight.danger { border-color:#f0785d; animation:fight-danger .25s ease-in-out infinite alternate; }
.fishing-fight.danger .fight-heading span { color:#ff8a72; }
.fishing-fight small { display:block; margin-top:13px; color:#d9d1c2; text-align:center; font-size:12px; }
.fishing-fight kbd { display:inline-grid; min-width:25px; padding:3px 6px; place-items:center; border:1px solid #f4d497; border-radius:5px; background:#f5e4bf; color:#33291f; box-shadow:0 2px 0 #a98a58; }
@keyframes fight-danger { to { box-shadow:0 0 0 3px #d64b3f55,6px 7px 0 #0909098c; } }
@media (max-width:700px) {
  .fishing-fight { bottom:100px; width:calc(100% - 16px); padding:12px 14px 13px; border-width:2px; border-radius:12px; }
  .fight-heading { margin-bottom:9px; }
  .fight-heading strong,.fight-heading span { font-size:11px; }
  .fishing-fight label { margin-top:6px; font-size:11px; }
  .fight-meter { height:13px; }
  .fishing-fight small { margin-top:9px; padding-right:76px; text-align:left; font-size:10px; }
}
.fishing-hook-prompt {
  position:absolute;
  z-index:1850;
  left:48.5%;
  top:56%;
  display:flex;
  align-items:center;
  gap:9px;
  padding:9px 12px;
  border:2px solid #f7e5bd;
  border-radius:8px;
  background:#17191bea;
  color:#fff7e6;
  box-shadow:5px 6px 0 #0b0b0b9c;
  transform:translate(-50%,-50%);
  font:800 14px/1 ui-monospace,monospace;
  animation:hook-pulse .38s ease-in-out infinite alternate;
}
.fishing-hook-prompt strong { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:#d75a3c; font-size:22px; }
.fishing-hook-prompt kbd { padding:6px 9px; border-radius:5px; background:#f5ead1; color:#33271d; box-shadow:0 3px 0 #b8a783; }
@keyframes hook-pulse { to { transform:translate(-50%,-55%) scale(1.045); } }

.fishing-dialogue {
  position:fixed;
  z-index:5100;
  inset:0;
  display:grid;
  place-items:end center;
  padding:22px clamp(12px,4vw,60px) 34px;
  background:linear-gradient(180deg,transparent 42%,rgba(12,10,9,.6));
}
.fishing-dialogue[hidden],.fishing-fight[hidden],.fishing-hook-prompt[hidden],.fishing-bobber[hidden],.fishing-splash[hidden],.fishing-ripple[hidden],.fishing-shadow[hidden],.fishing-reward-fx[hidden],.fishing-caught-fish[hidden],.fishing-catch[hidden],.fishing-collection[hidden],.fishing-record-badge[hidden] { display:none!important; }
.fishing-dialogue-card {
  position:relative;
  display:grid;
  grid-template-columns:minmax(150px,230px) minmax(0,720px);
  width:min(950px,96vw);
  min-height:220px;
  border:3px solid #3b3027;
  border-radius:14px;
  background:#f3ead9;
  color:#30271f;
  box-shadow:0 8px 0 #17120ed9,0 20px 44px #0007,inset 0 0 0 3px #d6c5a5;
}
.fishing-portrait { align-self:end; width:100%; max-height:260px; object-fit:contain; object-position:center bottom; filter:drop-shadow(0 6px 5px #543b2947); }
.fishing-copy { padding:25px 28px 22px 8px; }
.fishing-copy>small { color:#8b5a32; font:900 12px/1.2 ui-monospace,monospace; letter-spacing:.14em; }
.fishing-copy>p { margin:12px 0 18px; font:700 clamp(16px,2vw,21px)/1.5 ui-monospace,monospace; }
.fishing-actions { display:flex; flex-wrap:wrap; gap:10px; }
.fishing-actions button { min-height:42px; padding:9px 18px; border:2px solid #8d7357; border-radius:8px; background:#fff7e7; color:#433327; font:800 13px/1 ui-monospace,monospace; cursor:pointer; }
.fishing-actions button:first-child { border-color:#5c793c; background:#709449; color:white; }
.fishing-actions button:hover,.fishing-actions button:focus-visible { transform:translateY(-2px); outline:3px solid #e0ad59; outline-offset:2px; }
.fishing-catch { position:relative; display:grid; grid-template-columns:130px 1fr; gap:16px; align-items:center; margin:-4px 0 18px; padding:10px 14px; border:2px solid #c8b38c; border-radius:10px; background:#e8dcc5; }
.fishing-catch.legendary { border-color:#c99536; background:#ead8aa url('assets/fishing/ui/48_legendary_effect.webp') center/cover no-repeat; box-shadow:0 0 22px #f2ba4d80; }
.fishing-catch img { width:130px; height:82px; object-fit:contain; }
.fishing-catch div { display:grid; gap:4px; }
.fishing-catch span { width:max-content; padding:3px 7px; border-radius:999px; background:#526b73; color:white; font:800 9px/1 ui-monospace,monospace; letter-spacing:.1em; }
.fishing-catch strong { font:900 21px/1.15 ui-monospace,monospace; }
.fishing-catch small { color:#775d45; font:700 11px/1.2 ui-monospace,monospace; }
.fishing-catch img.fishing-record-badge { position:absolute; right:-15px; top:-22px; width:72px; height:72px; z-index:3; filter:drop-shadow(0 5px 4px #5f3d2670); animation:record-badge-pop .55s cubic-bezier(.2,1.5,.4,1); }
@keyframes record-badge-pop { from { opacity:0; transform:scale(.2) rotate(-18deg); } to { opacity:1; transform:scale(1) rotate(0); } }
.fishing-collection { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; max-height:250px; margin:8px 0 16px; overflow:auto; }
.fishing-collection:not([hidden]) { display:grid; }
.fish-slot { min-width:0; padding:7px; border:1px solid #b8a383; border-radius:7px; background:#e9ddc7; text-align:center; }
.fish-slot img { display:block; width:100%; height:54px; object-fit:contain; }
.fish-slot.locked img { filter:brightness(0) opacity(.17); }
.fish-slot b { display:block; overflow:hidden; font:800 10px/1.2 ui-monospace,monospace; text-overflow:ellipsis; white-space:nowrap; }
.fish-rarity { display:inline-block; margin-top:4px; padding:2px 6px; border:1px solid currentColor; border-radius:999px; background:#d6c7aa; color:#665844; font:900 7px/1.2 ui-monospace,monospace; letter-spacing:.04em; }
.fish-slot[data-rarity="TIDAK BIASA"] .fish-rarity { background:#c9dccb; color:#376543; }
.fish-slot[data-rarity="LANGKA"] .fish-rarity { background:#cbd9e7; color:#315e7d; }
.fish-slot[data-rarity="EPIK"] .fish-rarity { background:#dacbe9; color:#704492; }
.fish-slot[data-rarity="LEGENDARIS"] .fish-rarity { background:#f1d992; color:#7c5310; box-shadow:0 0 8px #efba42aa; }
.fish-slot small { display:block; margin-top:4px; color:#684f34; font:800 9px/1.3 ui-monospace,monospace; }
.fish-slot em { display:block; margin-top:2px; color:#8b6b48; font:700 8px/1.25 ui-monospace,monospace; font-style:normal; }
.fish-slot.locked b { color:#927f66; }
.fishing-dev-panel { position:fixed; inset:0; z-index:4000; display:grid; place-items:center; padding:12px; background:rgba(12,10,8,.74); backdrop-filter:blur(5px); }
.fishing-dev-panel[hidden] { display:none; }
.fishing-dev-panel section { width:min(620px,100%); max-height:calc(100dvh - 24px); overflow-y:auto; padding:16px; border:3px solid #d8bb78; border-radius:14px; background:#252622; color:#f7ecd4; box-shadow:0 18px 70px #000b; font-family:ui-monospace,monospace; }
.fishing-dev-panel select[size] { height:130px; padding:4px; }
.fishing-dev-panel select[size] option { padding:5px 8px; }
.fishing-dev-panel input[name="code"] { padding:12px; border:1px solid #d8bb78; border-radius:7px; background:#171816; color:#fff; font:800 18px monospace; text-transform:uppercase; }
.fishing-dev-panel form>button { padding:12px 20px; border:0; border-radius:7px; background:#668b38; color:white; font:800 14px monospace; }
.fishing-dev-panel header { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.fishing-dev-panel header div { display:grid; gap:4px; }
.fishing-dev-panel header small { color:#e7ae48; font-weight:900; letter-spacing:.16em; }
.fishing-dev-panel header strong { font-size:22px; }
.fishing-dev-panel header button { width:38px; height:38px; border:1px solid #806f52; border-radius:8px; background:#3b3329; color:#fff; font-size:24px; }
.fishing-dev-panel label { display:grid; gap:7px; margin:12px 0; color:#dbcba9; font-weight:800; }
.fishing-dev-panel select { width:100%; padding:11px; border:1px solid #8f7956; border-radius:7px; background:#171816; color:#fff4dc; font:700 14px ui-monospace,monospace; }
.fishing-dev-panel .dev-check { display:flex; align-items:center; gap:9px; }
.fishing-dev-panel .dev-check input { width:18px; height:18px; accent-color:#86a74b; }
.fishing-dev-panel p { min-height:40px; padding:10px; border-left:3px solid #e7ae48; background:#191a18; color:#f3c96f; font-size:12px; }
.fishing-dev-panel section>div:last-of-type { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.fishing-dev-panel section>div:last-of-type button { padding:11px 9px; border:1px solid #8f7956; border-radius:7px; background:#34352f; color:#fff; font:800 11px ui-monospace,monospace; }
.fishing-dev-panel section>div:last-of-type button:first-child { grid-column:1/-1; background:#668b38; border-color:#9fbd60; }
.fishing-dev-panel footer { margin-top:14px; color:#aa9a7d; font-size:10px; text-align:center; }

@media (max-width:700px) {
  .asset-room.riverside-room .player.fishing-mode { width:235px; }
  .fishing-dialogue { padding:8px 8px 18px; }
  .fishing-dialogue-card { grid-template-columns:112px minmax(0,1fr); min-height:185px; }
  .fishing-copy { padding:18px 14px 16px 0; }
  .fishing-copy>p { font-size:13px; margin:8px 0 12px; }
  .fishing-actions { gap:6px; }
  .fishing-actions button { min-height:36px; padding:7px 10px; font-size:10px; }
  .fishing-catch { grid-template-columns:82px 1fr; gap:8px; padding:7px; }
  .fishing-catch img { width:82px; height:58px; }
  .fishing-catch strong { font-size:15px; }
  .fishing-collection { grid-template-columns:repeat(3,minmax(0,1fr)); max-height:190px; }
}

.debug-layer { position:absolute; inset:0; z-index:1200; pointer-events:none; }
.debug-rect { position:absolute; border:3px solid #ff4545; background:#ff303038; }
.debug-zone { position:absolute; border:3px solid #2fdcff; background:#21d4ff29; }
.debug-zone::after { content:attr(data-label); position:absolute; left:2px; top:2px; padding:2px 4px; background:#08252dcc; color:#8decff; font:700 12px/1 ui-monospace,monospace; }
.debug-status { position:absolute; z-index:1800; right:14px; bottom:14px; padding:7px 10px; border:2px solid #ff7373; border-radius:6px; background:#260d0de8; color:#ffb1b1; font-size:10px; }

.touch-controls { display:none; position:absolute; z-index:1750; inset:auto 18px 18px; justify-content:space-between; align-items:end; pointer-events:none; }
@media (any-pointer:coarse), (max-width:700px), (max-width:1100px) and (max-height:600px) {
  .touch-controls { display:flex; }
  .controls { display:none; }
}
.joystick { position:relative; width:112px; height:112px; border:2px solid #f1dfbd99; border-radius:50%; background:#1815138c; box-shadow:inset 0 0 24px #0008; pointer-events:auto; touch-action:none; backdrop-filter:blur(4px); }
.joystick span { position:absolute; left:50%; top:50%; width:48px; height:48px; margin:-24px; border:2px solid #fff2d3; border-radius:50%; background:#d7ad69d9; box-shadow:0 5px 12px #0008; transform:translate(0,0); }
#touchInteract { width:72px; height:72px; border:3px solid #fff0ce; border-radius:50%; background:#a94c38e8; color:#fff6e4; box-shadow:0 6px 0 #54251c,0 10px 24px #0007; font:900 25px/1 ui-monospace,monospace; pointer-events:auto; touch-action:manipulation; }
#touchInteract:active { transform:translateY(4px); box-shadow:0 2px 0 #54251c; }
.touch-controls,.touch-controls * { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; }
#touchInteract { touch-action:none; }

@media (pointer:coarse) {
  .touch-controls { display:flex; }
  .controls { display:none; }
}
@media (max-width:700px) {
  .asset-room .hotspot,.asset-room .hotspot:hover { transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  .asset-room .world-video { display:none; }
  .asset-room .world::before { animation:none; opacity:.3; }
}

@keyframes objectPromptFloat {
  from { transform: translate(-50%, calc(-100% - 2px)); }
  to { transform: translate(-50%, calc(-100% - 9px)); }
}

/* Compact mobile HUD only; desktop dimensions remain unchanged. */
@media (pointer:coarse), (any-pointer:coarse), (max-width:700px), (max-width:1100px) and (max-height:600px) {
  .room>.fishing-fight { position:absolute; left:50%; bottom:calc(100px + env(safe-area-inset-bottom)); width:min(480px,calc(100% - 24px)); padding:10px 12px; border-width:2px; border-radius:10px; pointer-events:none; }
  .room>.fishing-fight .fight-heading { margin-bottom:5px; gap:8px; }
  .room>.fishing-fight .fight-heading strong { font-size:10px; padding:4px 6px; }
  .room>.fishing-fight .fight-heading span { font-size:11px; line-height:1.35; }
  .room>.fishing-fight label { font-size:11px; margin:5px 0 3px; }
  .room>.fishing-fight label span { font-size:12px; }
  .room>.fishing-fight .fight-meter { height:12px; }
  .room>.fishing-fight small { padding:0; margin-top:6px; text-align:center; font-size:10px; }
  .room:has(>.fishing-fight:not([hidden])) .joystick { visibility:hidden; }
}
@media (max-width:1100px) and (max-height:600px) and (orientation:landscape) {
  .room>.fishing-fight { bottom:calc(86px + env(safe-area-inset-bottom)); width:min(420px,calc(100% - 180px)); }
}
@media (pointer:coarse), (any-pointer:coarse), (max-width:700px), (max-width:1100px) and (max-height:600px) {
  .fishing-dialogue:not(.journal-mode) { padding:8px max(10px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)); }
  .fishing-dialogue:not(.journal-mode) .fishing-dialogue-card { width:min(720px,100%); min-height:0; grid-template-columns:88px minmax(0,1fr); border-width:2px; border-radius:10px; }
  .fishing-dialogue:not(.journal-mode) .fishing-portrait { width:88px; max-height:118px; }
  .fishing-dialogue:not(.journal-mode) .fishing-copy { padding:12px 14px 12px 4px; }
  .fishing-dialogue:not(.journal-mode) .fishing-copy>small { font-size:9px; }
  .fishing-dialogue:not(.journal-mode) .fishing-copy>p { margin:6px 0 10px; font-size:13px; line-height:1.45; }
  .fishing-dialogue:not(.journal-mode) .fishing-actions { gap:6px; }
  .fishing-dialogue:not(.journal-mode) .fishing-actions button { min-height:36px; padding:7px 11px; font-size:11px; }
  .fishing-dialogue:not(.journal-mode) .fishing-catch { grid-template-columns:65px 1fr; gap:8px; margin:0 0 9px; padding:6px 8px; }
  .fishing-dialogue:not(.journal-mode) .fishing-catch img:not(.fishing-record-badge) { width:65px; height:45px; }
  .fishing-dialogue:not(.journal-mode) .fishing-catch strong { font-size:16px; }
  .fishing-dialogue:not(.journal-mode) .fishing-catch small { font-size:10px; }
}
@media (pointer:coarse), (any-pointer:coarse), (max-width:700px), (max-width:1100px) and (max-height:600px) {
  .hud { top:max(6px,env(safe-area-inset-top)); left:auto; right:max(8px,env(safe-area-inset-right)); transform:none; width:auto; }
  .hud .identity { display:none; }
  .hud .hud-actions { gap:5px; padding:4px 6px; border-radius:10px; box-shadow:0 2px 6px #0004; }
  .hud .game-clock { min-width:0; gap:5px; padding:0 6px 0 0; }
  .hud .clock-dial { width:26px; height:26px; border-width:2px; }
  .hud .clock-dial i { height:8px; }
  .hud .game-clock strong { font-size:15px; }
  .hud .game-clock small { font-size:7px; }
  .hud .game-clock div>span { display:none; }
  .hud .profile-link span { display:none; }
  .hud .profile-link,.hud .icon-button,.hud .journal-open { width:34px; height:34px; min-height:34px; padding:0; justify-content:center; border-width:1px; border-radius:7px; }
  .hud .journal-open { font-size:0; }
  .hud .journal-open::before { content:'▤'; font:900 20px/1 monospace; }
}

@media (max-width: 700px) {
  .room.asset-room { background-size: 100% 100%; }
  .asset-room .player { width:180px; }
  .asset-room.riverside-room .player { width:150px; }
}