.sharktales-page{--ink:#061820;--paper:#f4efdd;--lime:#edc188;--muted:#b1c9cc;background:radial-gradient(ellipse at 15% 30%,#0b3240,transparent 45%),#061820}.sharktales-page .masthead{background:#061820;gap:24px}.sharktales-page nav{flex-wrap:wrap;justify-content:flex-end}.sharktales-page .section{padding:90px 6%;max-width:1500px}.reef-hero>img{height:min(720px,58vw);min-height:580px;object-position:center 40%}.reef-hero:after{background:linear-gradient(0deg,#061820 1%,#061820b8 35%,transparent 75%)}.reef-title{bottom:50px;max-width:850px}.reef-title .game-actions{margin-top:25px}.reef-title>p:last-child{font-family:Outfit,sans-serif;font-style:normal;font-size:11px;letter-spacing:2px;color:#b1c9cc;margin-top:18px}.reef-title h1{font-size:clamp(75px,8vw,126px)}.hero-watch{text-decoration:none;font-size:16px;color:#ecf3ed}.art-caption{bottom:16px;right:6%;opacity:.6}.section-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:8%;align-items:end;margin-bottom:38px}.section-heading h2{margin:0;font-size:clamp(46px,5.4vw,78px)}.section-heading>p{color:var(--muted);margin-bottom:5px;max-width:470px}.gameplay-showcase{padding-top:30px!important}.live-footage{margin:0;position:relative}.live-footage video{display:block;width:100%;aspect-ratio:16/9;background:#03131d;border:1px solid #375e65;box-shadow:0 18px 80px #0005}.live-footage figcaption{display:flex;justify-content:space-between;gap:18px;font-size:12px;padding:17px 0;color:#a5c7ca}.live-footage figcaption span{letter-spacing:2px;color:#80d5da}.dive-facts{padding:28px 0;margin-top:23px;justify-content:space-between;gap:22px}.dive-facts span{display:flex;flex-direction:column;font-size:14px}.dive-facts b{font-family:Lilita,sans-serif;font-size:49px;margin:0;line-height:1.2}.scope-note{font-size:13px;color:#9ab6bd;margin:22px 0 0}.gallery-section{padding-top:30px!important}.dive-gallery{display:grid;grid-template-columns:1fr 1fr;gap:28px}.dive-gallery figure{margin:0}.dive-gallery figure:first-child{grid-column:1/-1}.dive-gallery img{width:100%;display:block;height:auto;aspect-ratio:16/9;border:1px solid #254c59}.dive-gallery a{display:block;overflow:hidden}.dive-gallery figcaption{padding:16px 0;font-size:20px}.dive-gallery figcaption span{display:block;font-size:11px;letter-spacing:2px;color:#84c7cc;margin-bottom:5px}.field-notes{grid-template-columns:.8fr 1.2fr;gap:5%}.field-notes h2{font-size:clamp(44px,4.4vw,66px)}.journal-shot img{border-color:#375b68;box-shadow:0 12px 35px #0005}.build-path{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:18px 0;border-block:1px solid #30505a;color:#edc188;font-size:14px}.build-path b{color:#5ca4b2}.feature-detail{font-size:13px;margin-top:14px!important}.lighthouse-story>img{height:650px}.lighthouse-story:after{background:linear-gradient(90deg,transparent,#061820ba 65%,#061820ed),linear-gradient(0deg,#061820,transparent 30%)}.mystery-notes{grid-template-columns:1.2fr .8fr}.wide-shot{margin:0}.wide-shot img{width:100%;height:auto;display:block;border:1px solid #2b4c56}.wide-shot figcaption{font-size:13px;color:#9ab6bd;margin-top:12px}.sea-section{background:radial-gradient(ellipse at top,#12405170,transparent 70%)}.ready-section{border-bottom:1px solid #294752}.mod-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.mod{position:relative;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;min-height:325px;padding:30px 24px;border:1px solid #375360;background:#0c2631;transition:border-color .2s,transform .2s}.mod:hover{transform:translateY(-4px);border-color:#edc188}.mod-number{font-size:10px;letter-spacing:1.4px;color:#95c3c9;position:relative}.mod h3{font-family:Lilita,sans-serif;font-size:34px;line-height:1.05;margin:38px 0 18px;color:#f4efdd;position:relative}.mod p{font-size:16px;color:#b8ced1;position:relative}.mod-link{margin-top:auto;font-size:14px;color:#edc188;position:relative}.midnight{background:radial-gradient(ellipse at 100% 0,#1c3a7c88,transparent 70%),#071b2c}.glow{background:radial-gradient(ellipse at 80% 5%,#288e835e,transparent 65%),#09252b}.arsenal{background:radial-gradient(ellipse at 100% 0,#95663c66,transparent 75%),#202b2d}.shoal{background:radial-gradient(ellipse at 100% 0,#2d6e8666,transparent 65%),#112b3a}.workshop-foot{display:flex;gap:45px;align-items:center;margin-top:30px}.workshop-foot p{font-size:14px;color:#a7c1c6;flex:1;margin:0}.workshop-foot .button{flex-shrink:0}.demo-callout{position:relative;isolation:isolate;overflow:hidden;min-height:550px;display:flex;align-items:center;border-block:1px solid #2b4c56}.demo-callout>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right;z-index:-2}.demo-callout:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#061820f5,#061820da 35%,#06182030);z-index:-1}.demo-callout>div{max-width:560px}.demo-callout p{max-width:450px}.sharktales-page .online{padding-top:45px;padding-bottom:45px;background:transparent;grid-template-columns:1fr 1fr}.sharktales-page .online h2{font-size:38px}.sharktales-page .online .eyebrow{margin-bottom:0}.sharktales-page .support{background:transparent}.sharktales-page .button{box-shadow:0 3px 0 #010d15;padding:15px 23px}.sharktales-page .game-actions{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.sharktales-page .text-link{font-size:18px}
@media(max-width:1000px){.mod-grid{grid-template-columns:1fr 1fr}.field-notes,.mystery-notes{grid-template-columns:1fr}.field-notes .note-copy{max-width:700px}.workshop-foot{align-items:flex-start;flex-direction:column;gap:20px}.section-heading{gap:5%}.reef-title h1{font-size:86px}}
@media(max-width:650px){.sharktales-page .masthead{padding:13px 5%;gap:12px}.sharktales-page nav{font-size:12px;gap:10px 16px}.sharktales-page nav a:last-child{display:none}.sharktales-page .section{padding:58px 6%}.reef-hero>img{min-height:550px;height:550px;object-position:59%}.reef-title{bottom:45px;left:6%;right:6%}.reef-title h1{font-size:65px}.reef-title>p{font-size:21px!important}.reef-title .hero-meta{font-size:9px!important;letter-spacing:1px!important}.reef-title .eyebrow{font-size:10px!important}.reef-title .game-actions{gap:17px}.sharktales-page .button{font-size:15px;padding:13px 17px}.hero-watch{font-size:14px}.section-heading{grid-template-columns:1fr;gap:22px}.section-heading h2{font-size:46px}.section-heading>p{font-size:17px}.live-footage figcaption{flex-direction:column;gap:9px;font-size:10px}.dive-facts{display:grid;grid-template-columns:1fr 1fr;gap:20px}.dive-facts b{font-size:40px}.dive-gallery{grid-template-columns:1fr;gap:18px}.dive-gallery figure:first-child{grid-column:auto}.dive-gallery figcaption{font-size:18px}.mod-grid{grid-template-columns:1fr}.mod{min-height:260px}.mod h3{margin-top:30px}.lighthouse-story>img{height:640px}.lighthouse-story:after{background:linear-gradient(0deg,#061820,#061820b8 50%,transparent)}.demo-callout{min-height:560px}.demo-callout:before{background:#061820c9}.sharktales-page .online{grid-template-columns:1fr;gap:14px}.sharktales-page .online h2{font-size:35px}.journal-shot figcaption{font-size:11px}.mystery-notes .note-copy{grid-row:1}}
@media(prefers-reduced-motion:reduce){.mod{transition:none}.mod:hover{transform:none}}

/* Keep the complete gameplay frame on phones and desktop. */
.live-footage video{object-fit:contain}

/* Steam hides its demo Download control in the phone layout. */
.phone-demo-note{display:none}
@media(max-width:650px){.phone-demo-note{display:block;margin:0;padding:17px 6% 20px;background:#061820;color:#b1c9cc;font-size:14px;line-height:1.55;border-bottom:1px solid #294752}.phone-demo-note strong{color:#f4efdd}}