@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#eff5ee;--muted:#93a8a9;--accent:#afdcba;--line:#d3f4e324;--bg:#04141b;color-scheme:dark}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:var(--bg);color:var(--ink);font-family:'Noto Sans KR','Malgun Gothic',sans-serif;font-size:14px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:1px solid var(--line);background:#09202799;color:var(--ink);padding:10px 15px;border-radius:7px;transition:background .2s,border-color .2s}button:hover{border-color:#bedac0;background:#173b3d}button:focus-visible,a:focus-visible{outline:2px solid #ccf3a5;outline-offset:4px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}#scene{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 66% 46%,#1d6b752e 0%,transparent 46%),radial-gradient(ellipse at 60% 45%,transparent 32%,#01080d96 100%)}header{position:fixed;z-index:5;top:0;left:0;right:0;height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 4vw;border-bottom:1px solid var(--line);background:linear-gradient(#031218aa,transparent)}.wordmark{color:var(--ink);text-decoration:none;font-size:17px;font-weight:500;letter-spacing:.11em;white-space:nowrap}.wordmark b{font-weight:800}.mark{color:var(--accent);font-size:29px;vertical-align:middle;margin-right:10px}.build{color:#9db6b3;font-size:9px;letter-spacing:.2em}nav{display:flex;gap:9px}nav button{font-size:12px}#count{color:var(--accent);margin-left:8px}#lobby{position:fixed;inset:88px 0 0;pointer-events:none}.lobby-copy{position:absolute;left:6vw;top:50%;transform:translateY(-55%);width:40%;max-width:570px;pointer-events:auto}.eyebrow{font-size:10px;letter-spacing:.22em;color:var(--accent);font-weight:700}h1{font-size:clamp(34px,3.6vw,64px);letter-spacing:-.045em;line-height:1.22;margin:22px 0;font-weight:750}h1 span{background:linear-gradient(92deg,#bfe9cf,#7fc5d8);-webkit-background-clip:text;background-clip:text;color:transparent}.lead{font-size:14px;line-height:1.9;color:#9cb5b3}.era-switch{display:flex;gap:8px;margin:32px 0 21px}.era-switch button{padding:10px 20px;border-radius:3px;font-size:12px}.era-switch .selected{border-color:var(--accent);background:#bdd7bc17;color:#d4f6c8}.era-detail{padding:0 0 18px;border-bottom:1px solid var(--line);margin-bottom:22px}.era-detail>span{font-size:10px;letter-spacing:.14em;color:var(--accent)}h2{font-size:21px;letter-spacing:-.025em;margin:9px 0}.era-detail p{max-width:460px;font-size:12px;color:var(--muted);line-height:1.8}.primary{display:flex;align-items:center;justify-content:space-between;gap:70px;background:#bad8b9;color:#102b2c;border:0;border-radius:4px;padding:16px 23px;font-size:14px;font-weight:800}.primary:hover{background:#d5edc3}.primary span{font-size:23px}.fine{font-size:10px;color:#839d9a;line-height:1.7}.globe-label{position:absolute;left:60%;bottom:11%;text-align:center;width:29%;color:#c2d5d0;pointer-events:none}.globe-label>span{font-size:8px;letter-spacing:.18em;display:block}.globe-label strong{display:block;font-size:25px;letter-spacing:.1em;margin:7px}.globe-label p{font-size:10px;color:var(--muted)}.globe-label small{font-size:9px;color:#627f81;line-height:1.7}footer{position:absolute;bottom:22px;left:4vw;right:4vw;display:flex;justify-content:space-between;color:#76958f;font-size:9px;letter-spacing:.16em}#diveUI{position:fixed;inset:88px 0 0;pointer-events:none}.instrument{position:absolute;top:22px;left:4vw;display:flex;gap:30px}.instrument small{display:block;letter-spacing:.18em;font-size:9px;color:#9dbabb}.instrument strong{font-size:27px;font-weight:500;font-variant-numeric:tabular-nums}.instrument i{font-size:11px;font-style:normal;margin-left:5px;color:#9ebcb9}.dive-location{position:absolute;top:29px;right:4vw;text-align:right;display:grid;gap:6px}.dive-location b{font-size:13px}.dive-location span{font-size:10px;color:#9ab5b4}.reticle{position:absolute;left:50%;top:45%;width:54px;height:42px;transform:translate(-50%,-50%);opacity:.65}.reticle i{position:absolute;width:9px;height:9px;border:solid #d5e9db}.reticle i:nth-child(1){left:0;top:0;border-width:1px 0 0 1px}.reticle i:nth-child(2){right:0;top:0;border-width:1px 1px 0 0}.reticle i:nth-child(3){right:0;bottom:0;border-width:0 1px 1px 0}.reticle i:nth-child(4){left:0;bottom:0;border-width:0 0 1px 1px}#target{position:absolute;top:54%;left:50%;transform:translateX(-50%);min-width:200px;text-align:center;text-shadow:0 2px 8px #000}#target span{display:block;font-size:14px}#target small{display:block;color:#a8c6bf;font-size:10px;margin:8px 0}.scan-track{height:2px;background:#d8fbe123;margin:12px auto;width:160px}.scan-track i{display:block;width:0;height:100%;background:var(--accent)}.bottom-bar{position:absolute;bottom:28px;left:4vw;right:4vw;display:flex;align-items:end;justify-content:space-between;gap:20px}.label{font-size:8px;letter-spacing:.2em;color:var(--accent);display:block}.bottom-bar b{display:block;font-size:11px;font-weight:500;color:#a8c4c0;margin-top:7px}.tools{display:flex;gap:7px;pointer-events:auto}.tools button{font-size:12px;background:#04181dcc;backdrop-filter:blur(10px)}.tools .active{border-color:#c4e1a4}kbd{font:10px monospace;color:#769792;margin-left:8px}.cockpit{position:absolute;left:-3%;right:-3%;bottom:-40px;height:110px;border-top:2px solid #a2c6b144;border-radius:50% 50% 0 0;background:linear-gradient(#091a2188,#041015);z-index:-1}.cockpit i{position:absolute;bottom:25px;width:90px;height:60vh;background:linear-gradient(90deg,#102c34,#0b2027,#21383f);border:1px solid #49687133;opacity:.62}.cockpit i:first-child{left:-36px;transform:rotate(-18deg);transform-origin:bottom}.cockpit i:last-child{right:-36px;transform:rotate(18deg);transform-origin:bottom}#pressure{position:absolute;top:115px;left:4vw;color:#e4af85;font-size:12px}#sonarRing{position:absolute;inset:0;opacity:0;background:radial-gradient(circle at center,transparent 20%,#a6fadc22 22%,transparent 23%);pointer-events:none}#sonarRing.pulse{animation:sonar 1.8s ease-out}@keyframes sonar{0%{opacity:1;transform:scale(.1)}100%{opacity:0;transform:scale(3)}}#toast{position:fixed;z-index:30;top:105px;left:50%;transform:translateX(-50%);padding:12px 20px;border:1px solid #bfe7d43a;background:#071e24ed;max-width:90%;font-size:12px;box-shadow:0 15px 70px #0007;border-radius:8px;pointer-events:none}dialog{padding:0;color:var(--ink);width:min(880px,calc(100vw - 30px));max-height:85svh;background:#071a21;border:1px solid #698d8755;border-radius:14px;box-shadow:0 35px 120px #000b;overflow:hidden}dialog[open]{display:flex;flex-direction:column}dialog::backdrop{background:#000a;backdrop-filter:blur(8px)}.panel-head{display:flex;justify-content:space-between;align-items:center;flex:0 0 auto;padding:18px 28px;background:#071a21;border-bottom:1px solid var(--line)}#panelBody{flex:1 1 auto;overflow-y:auto;padding:4px 28px 28px}.panel-head button{padding:7px 12px}#panelBody h2{font-size:29px;margin:15px 0 10px}#panelBody p{color:#9ab5b4;line-height:1.8;font-size:13px}.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:22px 0}.card{padding:18px;background:#0b2630;border:1px solid var(--line);border-radius:8px}.card h3{font-size:17px;margin:4px 0}.card small{font-size:10px;color:#a4b7b3}.card a{color:var(--accent);font-size:11px}.card .stages{display:flex;gap:10px;margin:10px 0;color:#769293;font-size:10px}.card .stages .done{color:#c8ecbd}.statline{display:flex;gap:30px;font-size:20px;margin:20px 0;color:var(--accent)}.statline small{display:block;font-size:10px;color:var(--muted)}.panel-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.photo-preview{display:block;max-width:100%;max-height:50vh;margin:18px auto;border-radius:6px}#transition{position:fixed;inset:0;z-index:40;background:#06191df5;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:20px}#transition span{font-size:10px;letter-spacing:.3em;color:#91bda9}#transition strong{font-size:25px;font-weight:500}#touchControls{display:none;pointer-events:auto}.pad{display:grid;grid-template-columns:repeat(3,36px);gap:5px}.pad button{padding:8px}.pad button:first-child{grid-column:2}.pad button:nth-child(2){grid-column:1}.vertical{display:flex;flex-direction:column;gap:6px}body.diving header{background:linear-gradient(#04131bcc,transparent)}
@media(max-width:900px){.build{display:none}header{padding:0 22px;height:72px}.wordmark{font-size:13px}.mark{font-size:22px;margin-right:5px}.lobby-copy{left:5vw;width:46%;transform:translateY(-50%)}h1{font-size:36px}.globe-label{left:58%;width:38%;bottom:15%}#lobby,#diveUI{inset:72px 0 0}.bottom-bar{flex-direction:column;align-items:stretch}.tools{justify-content:flex-end}#touchControls{display:flex;position:absolute;bottom:120px;left:20px;right:20px;justify-content:space-between;pointer-events:none}#touchControls button{pointer-events:auto;touch-action:none;background:#08232a99}.bottom-bar>div:first-child{display:none}}
@media(max-width:600px){header{height:60px;padding:0 14px;gap:5px}.wordmark{font-size:10px;letter-spacing:.05em}.mark{font-size:18px}nav{gap:4px}nav button{font-size:10px;padding:7px 8px}#lobby{inset:60px 0 0;overflow-y:auto}.lobby-copy{top:31%;transform:none;left:7vw;width:86%;padding-bottom:60px;pointer-events:auto}.eyebrow{font-size:8px}h1{font-size:31px;margin:15px 0 10px}h1 br{display:none}h1 span{display:block}.lead{font-size:11px;line-height:1.7;margin:10px 0}.era-switch{margin:18px 0 15px}.era-switch button{font-size:11px;padding:9px 16px}.era-detail h2{font-size:18px}.era-detail p{font-size:11px;line-height:1.6;margin:8px 0}.era-detail{margin-bottom:14px;padding-bottom:12px}.primary{width:100%;padding:12px 18px}.globe-label{top:13%;bottom:auto;left:54%;width:40%;text-align:left}.globe-label>span,.globe-label p,.globe-label small{display:none}.globe-label strong{font-size:12px;max-width:100px}footer{display:none}.fine{font-size:9px}#diveUI{inset:60px 0 0}.instrument{top:18px;left:20px;gap:23px}.instrument strong{font-size:23px}.instrument small{font-size:8px}.dive-location{top:90px;right:18px;max-width:160px}.dive-location b{font-size:11px}.dive-location span{font-size:9px}.bottom-bar{left:10px;right:10px;bottom:15px}.tools{display:grid;grid-template-columns:repeat(4,1fr);gap:5px}.tools button{font-size:11px;padding:10px 7px}kbd{display:none}.tools button:nth-last-child(1){grid-column:3/5}.tools button:nth-last-child(2){grid-column:1/3}#target{top:48%;width:80%}#target span{font-size:12px}.cards{grid-template-columns:1fr}dialog{padding:18px}.statline{gap:20px;font-size:18px}#pressure{top:82px;font-size:10px}.cockpit i{width:50px}.cockpit{height:100px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

@media(max-width:600px){.tools button:nth-last-child(2){grid-column:auto}.tools button:last-child{grid-column:3/5}}
.hangar{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}
.sub-hero,.sub-next{padding:20px;border:1px solid var(--line);border-radius:10px;background:#0b2630}
.sub-hero{background:linear-gradient(160deg,#10333c,#0a222b);border-color:#7fb89a55}
.sub-next.maxed{opacity:.75}
.subart{width:100%;height:auto;display:block;margin:12px 0 14px;border-radius:8px;background:#0a1d24;border:1px solid var(--line)}
.sub-next .subart{opacity:.72;filter:saturate(.65)}
.hangar small{font-size:10px;letter-spacing:.16em;color:var(--accent);display:block}
.sub-hero h3,.sub-next h3{font-size:19px;margin:6px 0 4px}
.hangar p{font-size:12px;color:#9ab5b4;line-height:1.75;margin:10px 0 0}
.spec{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px}
.spec li{font-size:10px;color:#a9c6bd;border:1px solid var(--line);border-radius:20px;padding:4px 10px}
.sub-upgrade{margin-top:16px;width:100%;gap:12px}
.ladder{display:flex;gap:8px;margin:6px 0 4px}
.tier{flex:1;text-align:center;padding:9px 4px;border:1px solid var(--line);border-radius:7px;font-size:10px;color:#6d8c8c}
.tier b{display:block;font-size:11px;letter-spacing:.08em}
.tier.on{border-color:var(--accent);color:#d4f6c8;background:#bdd7bc17}
.tier.done{color:#93b6a6;border-color:#6d9b8155}
.tier.locked{opacity:.45}
h2.sect{font-size:17px;margin:26px 0 4px;letter-spacing:-.01em}
@media(max-width:700px){.hangar{grid-template-columns:1fr}}

#radarWrap{position:absolute;left:4vw;bottom:96px;width:150px;pointer-events:none}
#radar{width:150px;height:150px;display:block;filter:drop-shadow(0 6px 18px #0009)}
.radar-meta{margin-top:6px}
.radar-meta b{display:block;font-size:10px;color:#a8c4c0;font-weight:500;margin-top:4px}
#trackBox{position:absolute;left:4vw;bottom:262px;width:190px;padding:11px 13px;border:1px solid #bfe7d43a;background:#061e24d9;border-radius:9px;pointer-events:none}
#trackBox b{display:block;font-size:13px;margin:6px 0 8px}
.track-line{display:flex;align-items:center;gap:9px}
.track-line i{font-style:normal;font-size:19px;color:var(--accent);display:inline-block;transition:transform .12s linear}
.track-line span{font-size:17px;font-variant-numeric:tabular-nums}
#trackHint{display:block;margin-top:8px;font-size:9px;color:#7d9b96;line-height:1.6}
@media(max-width:760px){#radarWrap{width:104px;bottom:150px}#radar{width:104px;height:104px}#trackBox{bottom:270px;width:150px}}

/* 연출 배율 선택 + 도감 실제 크기 */
.drama-note{color:var(--muted);font-size:13px;line-height:1.65;margin:2px 0 12px}
.drama{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.drama-step{padding:10px 16px;border:1px solid var(--line);border-radius:999px;background:transparent;
 color:var(--ink);font:inherit;font-size:13px;cursor:pointer;transition:.18s}
.drama-step:hover{border-color:#3e7d84}
.drama-step.on{background:#0e3a42;border-color:#54a9b0;color:#dff3ef}
.sizefact{margin:0 0 6px;font-size:13px;color:#a9cfc7}
.sizefact b{color:#cfe9e0;font-weight:600;margin-right:6px}

/* 모바일: 레이더 · 방향키 · 도구 바 · 토스트가 서로 겹치지 않게 세로로 쌓는다
   (도구 바 3줄 ≈ 136px → 방향키 → 레이더 순으로 올린다) */
@media(max-width:600px){
 #touchControls{bottom:170px}
 #radarWrap{left:14px;bottom:288px;width:92px}
 #radar{width:92px;height:92px}
 #trackBox{top:196px;right:14px;left:auto;bottom:auto;width:auto;max-width:180px}
 #toast{top:200px;font-size:11px;padding:9px 14px;max-width:calc(100% - 28px)}
 #pressure{top:112px}
 /* 중앙 대상 문구가 레이더 위로 오도록 끌어올린다 */
 #target{top:44%}
 .reticle{top:36%}
 #radarWrap{bottom:282px;width:76px}
 #radar{width:76px;height:76px}
 #radarWrap .label,#radarWrap b{font-size:8px}
}

/* 잠항 로딩 게이지: 30MB 가까운 생물 자료를 받는 동안 진행 상황을 보여 준다 */
.loadbar{width:min(360px,72vw);height:4px;margin:6px 0 2px;background:#12333a;border-radius:99px;overflow:hidden}
.loadbar i{display:block;width:0;height:100%;border-radius:99px;
 background:linear-gradient(90deg,#4f9f9a,#bfe9cf);transition:width .28s ease}
.loadbar.done i{background:#bfe9cf}
#loadNote{font-size:11px;color:#7f9f9c;letter-spacing:.02em}
#transition strong{min-height:1.2em}

/* 잠항 로딩 게이지: 해역 생물 자료를 받는 동안 진행 상황을 보여 준다 */
.loadbar{width:min(360px,72vw);height:4px;margin:6px 0 2px;background:#12333a;border-radius:99px;overflow:hidden}
.loadbar i{display:block;width:0;height:100%;border-radius:99px;
 background:linear-gradient(90deg,#4f9f9a,#bfe9cf);transition:width .28s ease}
.loadbar.done i{background:#bfe9cf}
#loadNote{font-size:11px;color:#7f9f9c;letter-spacing:.02em}
#transition strong{min-height:1.2em}

/* 랭킹 + 도감 개인 기록 */
.rank-tabs{display:flex;gap:8px;margin:14px 0 10px}
.rank-tabs button{padding:9px 18px;border-radius:999px;font-size:13px;background:transparent}
.rank-tabs button.on{background:#0e3a42;border-color:#54a9b0;color:#dff3ef}
.rank-note{font-size:12px;color:var(--muted);line-height:1.7;margin:8px 0 14px}
.rank-note b{color:#bfe0d6;font-weight:600}
.rank-name{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin:14px 0}
.rank-name input{flex:0 1 180px;padding:8px 11px;border-radius:6px;border:1px solid var(--line);
 background:#08222a;color:var(--ink);font:inherit;font-size:13px}
.rank-name button{padding:8px 14px;font-size:12px}
.rank-list{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:4px}
.rank-list li{display:grid;grid-template-columns:34px 1fr auto auto;align-items:center;gap:12px;
 padding:11px 14px;border:1px solid var(--line);border-radius:8px;background:#0b2630}
.rank-list li.me{border-color:#6fc3a8;background:#0e3540}
.rank-list b{color:var(--accent);font-variant-numeric:tabular-nums;font-size:13px}
.rank-list span{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-list em{font-style:normal;font-variant-numeric:tabular-nums;font-size:15px;color:#d8f0e4}
.rank-list small{font-size:10px;color:var(--muted);min-width:56px;text-align:right}
.myrec{margin:0 0 6px;font-size:13px;color:#b9dcc6}
.myrec b{color:#d8f0e4;font-weight:600;margin-right:6px}
.myrec i{font-style:normal;color:var(--accent);margin-left:6px}
.region-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:12px 0;max-width:510px}.region-picker button{text-align:left;font-size:11px;padding:8px 10px;line-height:1.5}.region-picker button.selected{background:#bdd7bc24;border-color:#a5d9bd}.atlas-region-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.city-chart-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:15px 0 24px}.city-chart-grid button{min-height:70px}.city-chart-grid b,.city-chart-grid small{display:block}.city-chart-grid small{font-size:10px;color:var(--muted);margin-top:7px}.event-options,.event-rewards,.journal-controls,.journal-pages{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:18px 0}.event-options button{min-width:90px}.event-rewards span{font-size:11px;color:var(--accent);padding-right:12px}.event-action-hint{border-left:2px solid var(--accent);padding-left:14px}.journal-controls input{flex:1;min-width:170px;background:#09232c;color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:10px;font:inherit}.journal-pages{justify-content:center}.lobby-copy .era-switch{margin:20px 0 10px}.lobby-copy h1{font-size:clamp(32px,3.3vw,56px);margin:17px 0}.lobby-copy .era-detail{margin-bottom:15px;padding-bottom:12px}
@media(max-height:850px) and (min-width:700px){.lobby-copy{top:49%;transform:translateY(-50%)}.lobby-copy h1{font-size:38px}.lobby-copy .lead{font-size:12px}.region-picker{grid-template-columns:repeat(3,minmax(0,1fr))}.region-picker button{padding:6px 8px;font-size:10px}.era-detail p{margin:5px 0}}
@media(max-width:600px){.atlas-region-grid{grid-template-columns:1fr}.city-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.region-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.lobby-copy{top:32%!important}.lobby-copy .lead{font-size:12px}.tools{grid-template-columns:repeat(4,1fr)}.tools button:last-child{grid-column:auto!important}.lobby-copy h1{font-size:31px}.journal-controls input{width:100%}}
.dive-only{display:none}body.diving .dive-only{display:inline-flex}
#expeditionHud{position:absolute;left:4vw;top:160px;width:240px;padding:13px 15px;background:#041a21d9;border:1px solid #a5d9bd44;border-radius:8px;pointer-events:none}
#expeditionHud b,#expeditionHud small{display:block;margin-top:7px}#expeditionHud b{font-size:13px}#expeditionHud small{color:#adc8c1;font-size:10px;line-height:1.6}
.survey-track{height:3px;background:#a5d9bd22;margin-top:10px}.survey-track i{display:block;height:100%;width:0;background:#f1c875}
#encounterNotice{position:absolute;left:50%;top:22%;transform:translateX(-50%);width:min(560px,80vw);text-align:center;border-top:1px solid #e9c27a66;border-bottom:1px solid #e9c27a66;padding:16px 22px;color:#f3d9a7;background:#071a23d9;font-size:14px;line-height:1.8;letter-spacing:.05em}
.expedition-card progress{display:block;width:100%;height:6px;margin:14px 0;accent-color:#a5d9bd}.expedition-card b{font-size:12px;color:var(--accent)}
@media(max-width:900px){.build{display:none}.bottom-bar{flex-wrap:wrap;gap:10px}.tools{flex-wrap:wrap;max-width:100%}.tools button{padding:9px 10px;font-size:11px}kbd{display:none}}
@media(max-width:600px){header{padding:0 12px;gap:8px}header .wordmark{font-size:13px}.mark{margin-right:3px;font-size:20px}header nav{gap:4px;flex-wrap:wrap;justify-content:flex-end}header nav button{padding:6px 7px;font-size:10px}#expeditionHud{left:12px;top:108px;width:186px;padding:9px 11px}#expeditionHud b{font-size:11px}#expeditionHud .label{font-size:7px}#encounterNotice{top:30%;font-size:12px;padding:10px;width:88vw}.bottom-bar{left:12px;right:12px;bottom:12px}.bottom-bar>div:first-child{display:none}.tools{gap:4px}.tools button{padding:8px 9px}#touchControls{bottom:150px!important}#target{top:47%;min-width:190px}#targetMeta{max-width:260px}.dive-location{max-width:160px}.dive-location b{font-size:10px}#pressure{top:86px;max-width:70%;font-size:10px}}
@media(max-width:600px){.rank-list li{grid-template-columns:26px 1fr auto;gap:8px;padding:9px 11px}
 .rank-list small{display:none}}

@media(max-width:600px){.tools button:last-child{grid-column:auto}}