/* Soft Lagoon: presentation layer, shared by the existing application flows. */
:root,body.art-pass.lagoon-pass{--paper:#252926;--ink:#f4f1e8;--muted:#c4cbc2;--green:#bedD9f;--acid:#bedd9f;--pink:#ef9fbc;--line:#50594f;--body:OppPlex,Arial,sans-serif;--display:OppPlex,Arial,sans-serif;--surface:#303730;--ivory:#f4f1e8;--dark-ink:#252b26}
body.art-pass.lagoon-pass{background:var(--paper);color:var(--ink)}
.art-pass.lagoon-pass :is(h1,h2,h3,.brand,.page-head h1,.job-detail-head h1,.lab-masthead h1){font-family:var(--body);text-transform:none;letter-spacing:-.025em;line-height:1.18;font-weight:600}
.art-pass.lagoon-pass .brand{text-transform:uppercase;font-weight:700;letter-spacing:-.035em;font-size:25px;gap:9px}
.art-pass.lagoon-pass :is(.workspace,.content,.hybrid-home,.topbar,.public-header,.footer){background:var(--paper);color:var(--ink);border-color:var(--line)}
.art-pass.lagoon-pass .sidebar{background:#222823;border-color:#414b40}
.art-pass.lagoon-pass :is(.panel,.tip-panel,.prime-sidebar,.prime-invite,.application-controls,.progress-strip,.extension-mock,.notice,.ats-info,.evidence-block,.upload-box,.beta-first-step,.empty,.demo-play){background:var(--surface);border:1px solid var(--line);border-radius:16px;box-shadow:none;color:var(--ink)}
.art-pass.lagoon-pass :is(.panel p,.tip-panel p,.note,.small-label,.breadcrumbs,.demo-label){color:var(--muted)}
.art-pass.lagoon-pass :is(.btn,.choice){border-radius:12px;box-shadow:none;min-height:44px;font-weight:600;border-color:var(--line);transition:background .15s}
.art-pass.lagoon-pass .btn:is(.green,.black){background:var(--green);border-color:var(--green);color:#20291d}
.art-pass.lagoon-pass .btn.pink{background:var(--pink);color:#30222a;border-color:var(--pink)}
.art-pass.lagoon-pass .btn:is(.white,.quiet){background:var(--surface);color:var(--ink)}
.art-pass.lagoon-pass .btn:hover{transform:none;filter:brightness(1.06)}
.art-pass.lagoon-pass :is(input,textarea,select){background:#373d37;color:var(--ink);border:1px solid #626d60;border-radius:11px;accent-color:var(--green)}
.art-pass.lagoon-pass :is(input,textarea)::placeholder{color:#c4cbc2}
.art-pass.lagoon-pass :is(a,button,input,textarea,select):focus-visible{outline:3px solid var(--pink);outline-offset:3px}
.art-pass.lagoon-pass :is(.chip,.tab){border-radius:999px;background:var(--surface);color:var(--ink);border-color:var(--line);min-height:40px}
.art-pass.lagoon-pass :is(.chip.active,.tab.active){background:var(--green);color:#20291d;border-color:var(--green)}
.art-pass.lagoon-pass .side-nav a{border-radius:12px;padding:12px;color:var(--muted);font-weight:500}
.art-pass.lagoon-pass .side-nav a.active{background:#3a4536;color:#d3ecb9;box-shadow:none}
.art-pass.lagoon-pass .side-nav a:hover{background:#353e33}
.art-pass.lagoon-pass .topbar{min-height:68px;height:auto;padding-block:12px}
.art-pass.lagoon-pass .page-head h1{font-size:clamp(27px,3vw,38px)}
.art-pass.lagoon-pass .eyebrow{text-transform:none;letter-spacing:.04em;font-weight:500;color:var(--muted)}
.art-pass.lagoon-pass .eyebrow:before{display:none}
/* Public page keeps its original video and section order. */
.art-pass.lagoon-pass .public-header{min-height:84px;padding:15px 5%;gap:20px}
.art-pass.lagoon-pass .public-header .brand-cup{width:48px;height:48px;flex-basis:48px;border-radius:0}
.art-pass.lagoon-pass .public-nav{gap:26px;font-size:15px}
.art-pass.lagoon-pass .public-nav .btn{border-radius:999px;padding:12px 25px}
.art-pass.lagoon-pass .coffee-hero{min-height:480px;max-height:800px;aspect-ratio:16/9}
.art-pass.lagoon-pass .coffee-copy{width:49%;padding:11% 0 8% 5%}
.art-pass.lagoon-pass .coffee-copy h1{font-size:clamp(42px,5.3vw,79px);font-weight:600;line-height:1.12;letter-spacing:-.035em;color:var(--pink);text-shadow:none;text-transform:none}
.art-pass.lagoon-pass .film-control{border-radius:999px;background:#252926ed;border-color:#899281;left:5%;right:auto;bottom:6%;padding:12px 23px;font-size:14px}
.coffee-description{padding:30px 5% 38px;border-bottom:1px solid #50594f;background:#29302a}
.coffee-description p{max-width:1080px;font-size:clamp(16px,1.45vw,19px);line-height:1.8;color:#f4f1e8;margin:auto}
.art-pass.lagoon-pass .pace-strip{background:#efb0c8;color:#30252b;padding:20px 5%;gap:20px;font-size:14px}
.art-pass.lagoon-pass .hybrid-tools{max-width:none;background:var(--ivory);padding:60px 5%;color:var(--dark-ink)}
.art-pass.lagoon-pass .steps{max-width:1350px;margin:auto;gap:0;overflow:visible}
.art-pass.lagoon-pass .hybrid-tools .step:nth-child(n){background:none;border:0;border-radius:0;box-shadow:none;transform:none;padding:10px 35px;gap:10px}
.art-pass.lagoon-pass .hybrid-tools .step+.step{border-left:1px solid #cbd0c0}
.art-pass.lagoon-pass .hybrid-tools .step h3{font-size:25px;margin:8px 0 12px;color:#252b26}
.art-pass.lagoon-pass .hybrid-tools .step p{color:#465143;font-size:16px;line-height:1.75}
.art-pass.lagoon-pass .hybrid-tools .step .eyebrow{color:#526647;font-size:14px;background:#d9e8c6;width:42px;height:42px;justify-content:center;border-radius:50%}
.art-pass.lagoon-pass .lagoon-intro{position:relative;background:#e7ebd9;color:#252b26;padding:60px 5%;gap:35px;border-radius:55% 12% 0 0 / 35px 15px 0 0;margin-top:-1px}
.art-pass.lagoon-pass .lagoon-intro h2{color:#252b26;font-size:clamp(34px,4vw,55px);font-weight:600}
.art-pass.lagoon-pass .lagoon-intro p{color:#465143;font-size:17px;line-height:1.7}
.art-pass.lagoon-pass .lagoon-window{aspect-ratio:16/9;border:0;border-radius:26px;max-height:none}
.art-pass.lagoon-pass .intro-resident{left:47%;top:42%;width:18%;height:38%}
.art-pass.lagoon-pass .footer{padding:28px 5%;border-top:1px solid var(--line)}
/* Job details and editing surfaces are light where sustained reading matters. */
.art-pass.lagoon-pass .job-result{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:13px;padding:21px;box-shadow:none}
.art-pass.lagoon-pass .job-result.selected{background:var(--green);color:#20291d;border-color:var(--green);padding:21px;box-shadow:none}
.art-pass.lagoon-pass .job-result.selected :is(span,p,b,.saved-marker){color:#35462e}
.art-pass.lagoon-pass .job-result>strong{font-size:20px;line-height:1.3}
.art-pass.lagoon-pass .job-result>b{background:#46533e;color:#e3efd8;border-radius:6px}
.art-pass.lagoon-pass .job-result.selected>b{background:#ffffff50}
.art-pass.lagoon-pass .live-job-row{border-radius:14px;border-color:var(--line);overflow:hidden;background:var(--surface)}
.art-pass.lagoon-pass .live-job-row .job-result{border:0;border-radius:0;box-shadow:none}
.art-pass.lagoon-pass .board-detail{background:var(--ivory);color:var(--dark-ink);border:0;border-radius:17px;scrollbar-color:#899c7a #e7e9dc}
.art-pass.lagoon-pass :is(.job-detail-head,.job-detail-body){background:var(--ivory);color:var(--dark-ink);border-color:#d6d9cd}
.art-pass.lagoon-pass .job-detail-head{border-top:0;padding:28px}
.art-pass.lagoon-pass .job-detail-head h1{font-size:clamp(25px,2.5vw,35px);line-height:1.22}
.art-pass.lagoon-pass .board-detail :is(p,.note,.demo-label){color:#465143}
.art-pass.lagoon-pass .board-detail .btn.quiet{background:#303730;color:#f4f1e8}
.art-pass.lagoon-pass .board-detail .text-button{color:#405d32}
.art-pass.lagoon-pass .board-detail .notice{background:#e2e9d5;color:#34432d;border-color:#c1cbb5}
.art-pass.lagoon-pass .live-job-search input:not([type=checkbox]){border-radius:12px;background:#373d37;border-color:#626d60}
.art-pass.lagoon-pass .lab-masthead{border:0;padding:8px 0 20px;margin-bottom:12px}
.art-pass.lagoon-pass .lab-masthead h1{font-size:34px;margin:8px 0 12px}
.art-pass.lagoon-pass .lab-masthead span{letter-spacing:0;color:var(--muted);font-size:14px}
.art-pass.lagoon-pass :is(.editor,.prime-editor textarea){background:var(--ivory);color:#252b26;border-color:#c9cfbf;border-radius:12px;line-height:1.7}
.art-pass.lagoon-pass .editor::placeholder{color:#606a58}
.art-pass.lagoon-pass .document-preview{background:#3a4238;border-color:var(--line);border-radius:15px;padding:20px}
/* Do not change exported document typography or layout metrics. */
.art-pass.lagoon-pass .case-file:nth-child(n){background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:25px;min-width:0}
.art-pass.lagoon-pass .case-file h2{font-size:25px}.art-pass.lagoon-pass .case-file h3{font-size:16px;font-weight:400;color:var(--muted)}
.art-pass.lagoon-pass .case-label{margin-bottom:18px;letter-spacing:0;color:var(--muted)}
.art-pass.lagoon-pass .case-next span{letter-spacing:0;text-transform:none}
.art-pass.lagoon-pass .track-stat{background:var(--surface);border:1px solid var(--line);border-radius:12px}
.art-pass.lagoon-pass .track-stat.active{background:#443940;border-color:var(--pink)}
.art-pass.lagoon-pass .track-stat b{font-size:26px}
.art-pass.lagoon-pass .status{background:#dce9cb;color:#374a2c;border:0;border-radius:999px;padding:5px 11px}
/* Habitat: its glass rim is the boundary, with controls outside the water. */
.art-pass.lagoon-pass .lagoon-scene{background:var(--paper);border:0;border-radius:0;box-shadow:none;aspect-ratio:16/9;min-height:0;overflow:hidden}
.art-pass.lagoon-pass .lagoon-scene .room-bg{object-fit:contain}
.art-pass.lagoon-pass #creature{width:17%}
.lagoon-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;padding:16px 20px;margin:0 auto 20px;width:fit-content;background:#303730;border:1px solid var(--line);border-radius:999px}
.lagoon-actions .btn{min-width:110px;border-radius:999px}
.art-pass.lagoon-pass .room-toolbar{gap:10px;margin-bottom:18px}
.art-pass.lagoon-pass .demo-play{margin-top:25px;padding:20px}
.art-pass.lagoon-pass .lagoon-tank .tank-glass{height:180px!important;min-height:0;border:1px solid #8f9f85;border-top:2px solid #acbda0;border-radius:45% 40% 30% 35% / 22% 25% 27% 24%;background:linear-gradient(115deg,#d5e8c622,transparent 30%),linear-gradient(#3c4c37,#647858 50%,#394b37);box-shadow:inset 3px 0 10px #dceccc22}
.art-pass.lagoon-pass .lagoon-tank .pip-live{height:145px;inset:26px 0 0}
.art-pass.lagoon-pass .lagoon-tank .tank-label{font-size:11px;inset:12px 17px auto}
.art-pass.lagoon-pass .tank-label b{max-width:110px;font-size:12px}
.art-pass.lagoon-pass .tank-label span{font-size:11px;color:#e3efd8}
.art-pass.lagoon-pass .tank-pebbles{background:#48583e;box-shadow:none}
.art-pass.lagoon-pass :is(dialog,.auth-panel){background:#303730;border:1px solid #64715b;border-radius:22px;color:var(--ink)}
.art-pass.lagoon-pass .modal-head{background:#373d37;border-color:var(--line)}
.art-pass.lagoon-pass .modal-head h2{color:var(--ink);font-size:25px}
.art-pass.lagoon-pass dialog :is(input,select,textarea){background:#252e24;border-color:#67725f;color:var(--ink)}
.art-pass.lagoon-pass .auth-panel h1{font-size:34px}
.art-pass.lagoon-pass .auth-art{filter:brightness(.65)}
@media(max-width:1000px){.art-pass.lagoon-pass .coffee-copy h1{font-size:clamp(38px,5.3vw,65px)}.art-pass.lagoon-pass .hybrid-tools .step:nth-child(n){padding:10px 22px}.art-pass.lagoon-pass .lagoon-intro{grid-template-columns:1fr}.art-pass.lagoon-pass .lagoon-window{max-width:780px}.art-pass.lagoon-pass .brand{font-size:22px}}
@media(max-width:700px){.art-pass.lagoon-pass .public-header{padding:14px 5%;gap:12px}.art-pass.lagoon-pass .public-header .brand{font-size:19px;gap:5px}.art-pass.lagoon-pass .public-header .brand-cup{width:36px;height:36px;flex-basis:36px}.art-pass.lagoon-pass .public-nav{gap:12px;font-size:13px;flex-wrap:nowrap}.art-pass.lagoon-pass .public-nav .btn{font-size:13px;padding:10px 15px}.art-pass.lagoon-pass .coffee-hero{min-height:0;aspect-ratio:auto;padding-bottom:56.25%}.art-pass.lagoon-pass .coffee-film{top:auto;bottom:0;height:auto;aspect-ratio:16/9;object-fit:contain}.art-pass.lagoon-pass .coffee-copy{width:100%;padding:34px 6% 22px}.art-pass.lagoon-pass .coffee-copy h1{font-size:clamp(36px,9vw,55px);margin:0}.art-pass.lagoon-pass .coffee-shade{display:none}.art-pass.lagoon-pass .film-control{bottom:14px;font-size:12px;padding:9px 15px}.coffee-description{padding:24px 6% 30px}.coffee-description p{font-size:16px;line-height:1.75}.art-pass.lagoon-pass .pace-strip{font-size:13px;grid-template-columns:1fr;padding:22px 6%}.art-pass.lagoon-pass .hybrid-tools{padding:25px 6%}.art-pass.lagoon-pass .hybrid-tools .step:nth-child(n){padding:26px 0}.art-pass.lagoon-pass .hybrid-tools .step+.step{border-left:0;border-top:1px solid #cbd0c0}.art-pass.lagoon-pass .lagoon-intro{padding:45px 6%;border-radius:0;gap:25px}.art-pass.lagoon-pass .lagoon-intro h2{font-size:35px}.art-pass.lagoon-pass .sidebar .brand{font-size:18px}.art-pass.lagoon-pass .side-nav a{padding:9px 7px;border-radius:9px;font-size:12px}.art-pass.lagoon-pass .sidebar-tank{display:none}.art-pass.lagoon-pass .topbar{padding:12px 16px}.art-pass.lagoon-pass .top-actions{gap:8px}.art-pass.lagoon-pass .lagoon-scene{aspect-ratio:1.3}.art-pass.lagoon-pass .lagoon-scene .room-bg{object-fit:fill}.art-pass.lagoon-pass #creature{width:24%}.lagoon-actions{border-radius:18px;gap:8px;padding:12px;width:100%}.lagoon-actions .btn{min-width:0;padding:10px 13px;font-size:13px}.art-pass.lagoon-pass .board-detail h1{font-size:27px}.art-pass.lagoon-pass .job-detail-head,.art-pass.lagoon-pass .job-detail-body{padding:22px}.art-pass.lagoon-pass .lab-masthead h1{font-size:30px}}
/* Match the loading surface before the app adds its theme classes. */
body:has(#legacy-root){background:#252926;color:#f4f1e8;font-family:OppPlex,Arial,sans-serif}

.alpha-intro{padding:40px 5%;display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,1.6fr);align-items:center;gap:40px;background:#303730}.alpha-intro h2{font:600 clamp(28px,3vw,42px)/1.15 OppPlex,Arial,sans-serif;letter-spacing:-.03em;color:#f4f1e8;margin:12px 0}.alpha-intro p{color:#d5dbcd;max-width:380px;line-height:1.65}.alpha-intro video{display:block;width:100%;aspect-ratio:3/2;border-radius:20px;background:#1d231e;box-shadow:0 12px 30px #0002}@media(max-width:700px){.alpha-intro{grid-template-columns:1fr;gap:20px;padding:30px 6%}.alpha-intro video{border-radius:14px}}

/* Keep the introduction and coffee together as a single, responsive hero. */
.art-pass.lagoon-pass .coffee-hero{aspect-ratio:auto;min-height:650px;max-height:none}
.art-pass.lagoon-pass .coffee-copy{width:49%;padding:55px 0 105px 5%}
.art-pass.lagoon-pass .coffee-copy h1{font-size:clamp(38px,4.5vw,66px);margin:0 0 24px}
.art-pass.lagoon-pass .coffee-description{background:none;border:0;padding:0}
.art-pass.lagoon-pass .coffee-description p{font-size:clamp(15px,1.25vw,18px);line-height:1.65;color:#f4f1e8}
.art-pass.lagoon-pass .coffee-shade{background:linear-gradient(90deg,#202621fa 0%,#202621eb 39%,#20262140 58%,transparent 75%)}
.alpha-video-note{font-size:13px}.intro-transcript-link{color:#bedd9f;text-underline-offset:4px}
.job-sources{background:#f4f1e8;color:#252b26;padding:64px 6%;display:grid;grid-template-columns:1fr 1.3fr;gap:70px}
.job-sources h2{font-size:clamp(30px,3.5vw,48px);margin:18px 0}.art-pass.lagoon-pass .job-sources .eyebrow{color:#53634a;letter-spacing:0;font-size:14px}
.job-source-options{display:grid;gap:30px}.job-source-options article+article{padding-top:28px;border-top:1px solid #ccd2c0}.job-source-options h3{font-size:23px;margin:0 0 12px}.job-source-options p{color:#465143;line-height:1.75;margin:0}
.art-pass.lagoon-pass .lagoon-landmark{position:absolute;z-index:3;background:none;border:0;padding:0;width:18%;height:auto;display:flex;flex-direction:column;align-items:center;cursor:pointer;transform:translate(-50%,-50%);color:#f4f1e8}
.lagoon-landmark svg{width:100%;max-width:145px;filter:drop-shadow(0 4px 4px #15201544);transition:transform .15s}
.lagoon-landmark span{padding:7px 12px;border-radius:999px;background:#28342bea;border:1px solid #9aaa89;font-size:13px;white-space:nowrap;min-height:34px}
.lagoon-landmark:hover svg{transform:translateY(-3px)}.lagoon-landmark:hover span{background:#bedd9f;color:#222823}
.art-pass.lagoon-pass .wardrobe-cove{left:22%;top:25%;right:auto}.art-pass.lagoon-pass .star-island{left:80%;top:30%;right:auto}.art-pass.lagoon-pass .snack-dock{left:16%;top:68%;right:auto}
@media(max-width:800px){.job-sources{grid-template-columns:1fr;gap:28px;padding:38px 6%}.art-pass.lagoon-pass .coffee-copy{width:53%;padding-top:35px}.art-pass.lagoon-pass .coffee-copy h1{font-size:38px}}
@media(max-width:700px){.art-pass.lagoon-pass .coffee-hero{min-height:0;padding-bottom:56.25%}.art-pass.lagoon-pass .coffee-copy{width:100%;padding:30px 6%}.art-pass.lagoon-pass .coffee-copy h1{font-size:clamp(36px,8.5vw,55px)}.art-pass.lagoon-pass .coffee-description p{font-size:16px;line-height:1.7}.art-pass.lagoon-pass .coffee-shade{display:none}.art-pass.lagoon-pass .lagoon-landmark{width:26%}.lagoon-landmark span{font-size:11px;padding:7px 9px}.lagoon-landmark svg{max-width:100px}.art-pass.lagoon-pass .wardrobe-cove{left:22%;top:25%}.art-pass.lagoon-pass .star-island{left:79%;top:29%}.art-pass.lagoon-pass .snack-dock{left:17%;top:70%}}

.art-pass.lagoon-pass .coffee-description strong{color:#bdff36;font-weight:700}.art-pass.lagoon-pass .brand-cup{object-fit:contain}

/* Aquarium ornaments: individual assets keep the habitat open for future decor. */
.lagoon-landmark .lagoon-ornament{display:block;width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 7px 5px #14231944);transition:filter .18s;pointer-events:none}
.lagoon-landmark:hover .lagoon-ornament,.lagoon-landmark:focus-visible .lagoon-ornament{filter:drop-shadow(0 7px 5px #14231944) brightness(1.12)}
.art-pass.lagoon-pass .lagoon-landmark.wardrobe-cove{width:28%;left:23%;top:26%}.art-pass.lagoon-pass .lagoon-landmark.star-island{width:19%;left:81%;top:30%}.art-pass.lagoon-pass .lagoon-landmark.snack-dock{width:15%;left:16%;top:69%}
.lagoon-landmark span{margin-top:0;box-shadow:0 2px 5px #15201522}
@media(max-width:700px){.art-pass.lagoon-pass .lagoon-landmark.wardrobe-cove{width:32%;left:24%;top:24%}.art-pass.lagoon-pass .lagoon-landmark.star-island{width:25%;left:79%;top:29%}.art-pass.lagoon-pass .lagoon-landmark.snack-dock{width:22%;left:17%;top:69%}.lagoon-landmark span{font-size:11px;min-height:34px}}

/* Keep job descriptions in the same readable type as the landing introduction. */
.art-pass.lagoon-pass :is(.job-result,.job-detail-head,.job-detail-body){font-family:var(--body)}
.art-pass.lagoon-pass :is(.job-result>p,.job-detail-body>p){font-family:var(--body);font-size:clamp(15px,1.25vw,18px);line-height:1.65;font-weight:400;letter-spacing:normal}
@media(max-width:700px){.art-pass.lagoon-pass :is(.job-result>p,.job-detail-body>p){font-size:16px;line-height:1.7}}

/* The landing preview shares the Lagoon's aquarium ornaments. */
.landing-ornaments{position:absolute;inset:0;pointer-events:none}
.landing-ornaments img{position:absolute;height:auto;transform:translate(-50%,-50%);filter:drop-shadow(0 5px 4px #14231944)}
.landing-ornaments .intro-shipwreck{width:28%;left:23%;top:26%}
.landing-ornaments .intro-skull{width:19%;left:81%;top:30%}
.landing-ornaments .intro-pineapple{width:15%;left:16%;top:69%}

/* Ornaments are integrated into this habitat image; keep accessible room buttons. */
.lagoon-window .landing-ornaments{display:none}
.lagoon-scene .lagoon-ornament{visibility:hidden}

/* Align the clickable areas with the ornaments in the new painted habitat. */
.art-pass.lagoon-pass .lagoon-scene .lagoon-landmark{height:30%;justify-content:flex-end}
.lagoon-scene .lagoon-landmark .lagoon-ornament{display:none}
.art-pass.lagoon-pass .lagoon-scene .wardrobe-cove{left:24%;top:22%;width:25%}
.art-pass.lagoon-pass .lagoon-scene .star-island{left:81%;top:27%;width:23%}
.art-pass.lagoon-pass .lagoon-scene .snack-dock{left:21%;top:63%;width:22%}
