/* Cool light, precise type, a small dose of electric blue. */
:root{--ink:#192447;--paper:#f9faff;--accent:#425cff;--line:#dfe4f0;--muted:#68728b;--display:'Instrument Serif',Georgia,serif;--sans:'Helvetica Neue',Helvetica,Arial,sans-serif;font-family:var(--sans);color:var(--ink)}
body,body.in-portfolio,#portfolio{background:var(--paper);color:var(--ink)}
button,input,textarea,select{font-family:var(--sans)}
h1,#portfolio h2,.case-hero .case-heading,#game-dialog h2,.next-case strong{font-family:var(--display);font-weight:400;letter-spacing:-.025em}
#portfolio h2{line-height:1.08}
p{letter-spacing:0}
.section-label,.eyebrow,.side-caption,.rack-label,.quiet-footer p,.pack-detail-label{font-family:var(--sans);font-weight:400;letter-spacing:.11em}
.section-label{font-size:11px;color:var(--muted)}
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
::selection{background:#d9e2ff;color:#182451}
/* Intro: a quiet blue hour, with the existing reactive stars. */
#sky{background:radial-gradient(ellipse at 78% 95%,#a8c6ed66,transparent 62%),radial-gradient(ellipse at 0 70%,#8787de55,transparent 65%),linear-gradient(165deg,#101b40 0%,#343f85 50%,#96afdd 100%);color:#fff}
#sky .star{background:#fff;box-shadow:0 0 6px #dceaffaa}.shooting{background:linear-gradient(90deg,transparent,#d8e8ff)}
h1{font-size:clamp(34px,3.5vw,50px);line-height:1.12;max-width:740px;letter-spacing:-.02em}.eyebrow{font-size:10px;letter-spacing:.16em;opacity:.7;margin-bottom:17px}.welcome .mascot-wrap{margin-bottom:23px}
.explore{border:1px solid transparent;background:#e5ecff;color:#25355b;border-radius:5px;font-size:13px;font-weight:400;min-height:44px;padding:12px 22px;box-shadow:0 2px 7px #1223450a;transition:background .25s,box-shadow .25s,translate .25s}
.explore:hover{background:#fff;box-shadow:0 5px 20px #10193418;transform:none;translate:0 -2px}
#sky .palette{background:#151e36de;border:1px solid #e1e9ff2b;box-shadow:0 12px 30px #07102922;backdrop-filter:blur(20px);border-radius:10px}
/* The sidebar is a light, glassy surface rather than a solid color block. */
.sidebar{width:218px;left:14px;top:14px;bottom:14px;padding:26px 14px;border:1px solid #d7e0f2;border-radius:10px;background:radial-gradient(ellipse at 0 90%,#c4d5ef90,transparent 60%),linear-gradient(170deg,#f0f4fc,#e6eafb 58%,#d9dff6);color:var(--ink);overflow-y:auto;overscroll-behavior:contain}
.sidebar>*{flex-shrink:0}.wordmark{font:400 32px/1.05 var(--display);letter-spacing:-.035em}.wordmark span{color:var(--accent)}.side-caption{font-size:9px;line-height:1.6;color:#5e6c8a;margin-top:12px}.side-intro{color:#657089;font-size:12px;line-height:1.65;margin:14px 0 20px}.pet-controls{margin-bottom:27px;gap:7px}.pet-controls button{width:34px;height:34px;border:1px solid #aab7d45e;background:#f8faff40;color:#495879;font-size:15px;box-shadow:inset 0 1px 0 #fff9}.pet-controls button:hover,.pet-controls button[aria-pressed=true]{background:#fff;color:var(--accent);border-color:#aebcec}
.sidebar nav{gap:4px}.sidebar nav a{background:transparent;color:#586581;border-radius:5px;padding:12px 10px;font-size:13px;transition:background .22s,color .22s}.sidebar nav a:hover{background:#fff9;color:#263977;transform:none}.sidebar nav a.active{background:#ffffffe0;color:#263977;box-shadow:0 2px 5px #42548906}.sidebar nav a small{background:transparent;color:#8d99b1;font-size:10px}.sidebar nav a.active small{background:#e9edff;color:#5368c5}.sidebar nav a em{font-family:var(--sans);font-size:11px;color:#8590a9;line-height:1.5;padding-top:7px}
.portfolio-content{margin-left:246px;padding:76px clamp(28px,5vw,88px) 0}.portfolio-content>section{max-width:1060px}.portfolio-content>section:not(:first-child){padding-top:105px}
.projects-intro{text-align:center;max-width:750px;margin:0 auto;padding:10px 0 65px}.projects-intro h2{font-size:clamp(42px,4.7vw,66px)!important;line-height:1.06!important;max-width:750px;margin-inline:auto!important;letter-spacing:-.025em}.projects-intro>p:last-child{font-size:15px;color:var(--muted);line-height:1.7;margin-top:24px}.projects-intro .section-label{font-size:10px!important;letter-spacing:.15em;margin-bottom:24px}
#word-cycle{font-style:italic;background:transparent;color:#4960bb;border-radius:0;border-bottom:1px solid #aebcf0;padding:0 2px 1px;line-height:.93}#word-cycle:hover{background:#e9edff}.caret{font-weight:300;color:#a4b3e8;opacity:.55}
.project-grid{gap:30px 24px}.project-card,.project-card:nth-child(even){border:1px solid #e0e5f0;border-radius:10px;padding:10px 10px 19px;background:#fff;color:var(--ink);box-shadow:0 3px 12px #15295603;transform:none;transition:translate .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s,border-color .35s}.project-card:hover,.project-card:focus-visible{transform:none;translate:0 -5px;box-shadow:0 14px 32px #24396809;border-color:#c1cceb}.project-art{border-radius:5px}.card-title{margin:17px 6px 9px}.card-title h3{font:400 25px/1.15 var(--display);letter-spacing:-.015em}.card-title>span{font:9px/1.5 var(--sans);letter-spacing:.04em;background:transparent;color:#7c88a3;border:0;padding:0}.project-card>p{font-size:13px;line-height:1.6;color:#788196;margin:0 6px}
.klar-art,.real-screens.klar-art{background:#dde6fa}.asta-art,.real-screens.asta-art{background:#e7e5f6}.real-screens img{border-color:#384158;box-shadow:0 8px 22px #1d30571a}.marketing-art{background:#e2e7f9}.lotus-art{background:#deeaf6}.travel-label strong{font-family:var(--display);color:#243d64}.travel-label>span{color:#677c9b}.demo-dashboard{box-shadow:0 5px 20px #27336610}.dash-body aside{background:#f4f6fb}.calendar-mini i:nth-child(5n){background:#cbd7fa}.campaign-line b{background:#e3eaff}.demo-chat p.reply{background:#e4ebff}
.media-section h2{font-size:43px!important;letter-spacing:-.025em}.media-feature{background:#eef1fa;border:1px solid #e2e6f2;border-radius:10px;color:var(--ink)}.media-feature h3{font:400 42px/1 var(--display)}.media-feature p,.about-band p,.case-prose p,.about-profile p,.about-story p,.video-feature p,.case-podcast>p:not(.section-label){color:var(--muted)}.media-links a,.contact-links a{border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);transition:background .2s,border-color .2s}.media-links a:hover,.contact-links a:hover{background:#f1f4ff;border-color:#c0cbed}.media-links span{font:400 25px/1.2 var(--display)}.media-links small{font-size:13px;color:#8690a6}.building-now p{color:#6e7891;font-size:16px}.play-game-link,.text-link,.back-link{color:#536aa1;font-size:13px;text-decoration-thickness:1px;text-underline-offset:4px}
.portfolio-content>section.about-band{background:#edf1fb;border:1px solid #dfe5f2;border-radius:10px;padding:36px;margin-top:95px}.about-band h2{font-size:43px!important}.about-band p{font-size:15px;line-height:1.75}.about-band .explore{background:#fff;border-color:#dce3f2}.portfolio-content>section.about-band>img.about-portrait{height:clamp(290px,28vw,400px);object-fit:cover;object-position:50% 0%;border-radius:6px}.contact-sun{color:#768ac0;font-size:29px}.contact-section h2{font-size:43px!important}.contact-section>p{color:var(--muted);font-size:14px}.contact-links a{font-size:13px;min-height:55px}.contact-links a span:last-child{color:#79859f}.quiet-footer,.portfolio-content footer.quiet-footer{color:#8b94a8}.quiet-footer p{font-size:9px}.quiet-footer button{color:#667bbb}
.case-hero .case-heading{font-family:var(--display);font-size:clamp(48px,6.2vw,84px);font-weight:400;letter-spacing:-.025em}.case-hero>p:not(.section-label){color:var(--muted);font-size:19px}.case-tags span{font-family:var(--sans);font-size:10px;color:#78839a;border-color:var(--line);background:#fff}.case-prose h2,.about-profile h2,.about-story h2{font-size:40px!important}.next-case{background:#edf1fc;color:var(--ink);border:1px solid var(--line);border-radius:8px}.next-case strong{font:400 40px var(--display)}.next-case span{font-family:var(--sans);color:#7c8baa}.case-notice{background:#f0f3fb;border-color:#a8b8e6;color:#657394}.case-workbench,.video-feature{background:#f0f3fb}.case-workbench input,.case-workbench select{font-family:var(--sans);border-color:#d6deee}.case-workbench h3,.video-feature h3{font-family:var(--display);font-weight:400}.case-gallery{background:#edf0f7}.case-gallery figcaption{color:#7a859c}.architecture>span{border-color:var(--line);background:white}.about-profile a{color:#4967b6}.about-story details{border-color:var(--line)}.chat-prompts button{background:white;border-color:#d3dced;color:#4b64a1}.chat-demo-messages p.question{background:#e1e8fb}.hype-title{background:#162044;color:#fff}.hype-title em{color:#b7c9ff}
#game-field{background:linear-gradient(#8397d0,#d0d9f5)}dialog{color:var(--ink);background:var(--paper)}
/* Feeding stays below navigation on every route. */
.sidebar #feed-panel{position:static;inset:auto;width:100%;max-width:100%;margin-top:9px;align-self:stretch;padding:10px;background:#1c2540f2;color:#c0cbe1;border:1px solid #7181aa20;box-shadow:0 7px 17px #1b295b13;border-radius:8px}.sidebar .feed-head{gap:5px}.sidebar .feed-head>span{font:9px var(--sans)}.sidebar .feed-head progress{flex:1;min-width:20px;width:0;accent-color:#acbdf5}.sidebar .feed-head button{flex:none;width:16px;line-height:1}.sidebar .food-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;justify-items:center}.sidebar .food-options button{width:min(33px,100%);height:auto;aspect-ratio:1;min-width:0;border-color:#69769480}.sidebar .food-options button:hover{border-color:#d8e3ff;background:#ffffff14}
@media(max-width:1050px) and (min-width:761px){.sidebar{width:190px;padding:24px 12px}.portfolio-content{margin-left:218px;padding-inline:30px}.wordmark{font-size:29px}.sidebar nav a{font-size:12px}.project-grid{gap:24px 18px}.card-title{flex-wrap:wrap;gap:5px}.card-title>span{font-size:8px}.side-intro{font-size:11px}}
@media(max-width:760px){.sidebar{position:relative;inset:auto;width:auto;margin:8px;padding:20px;border-radius:8px}.wordmark{font-size:31px}.side-caption{font-size:8px;margin-top:7px}.side-intro{display:none}.pet-controls{top:21px;right:19px;margin:0}.pet-controls button{width:31px;height:31px;font-size:14px}.sidebar nav{gap:3px;margin-top:23px}.sidebar nav a{font-size:12px;padding:10px;background:transparent}.sidebar nav a.active{background:#fff}.sidebar #feed-panel{max-width:250px;margin-top:9px}.portfolio-content{margin-left:0;padding:40px 22px 0}.projects-intro{padding:15px 0 42px}.projects-intro h2{font-size:46px!important}.projects-intro .section-label{font-size:9px!important;letter-spacing:.1em}.projects-intro>p:last-child{font-size:14px}.project-grid{gap:24px}.card-title h3{font-size:26px}.card-title>span{font-size:9px}.portfolio-content>section:not(:first-child){padding-top:75px}.portfolio-content>section.about-band{padding:25px;margin-top:70px}.about-band h2{font-size:37px!important}.contact-section h2{font-size:36px!important}.media-section h2{font-size:37px!important}.case-hero .case-heading{font-size:55px}.case-hero>p:not(.section-label){font-size:17px}.case-prose h2,.about-profile h2,.about-story h2{font-size:36px!important}}
@media(max-width:400px){.sidebar{padding:17px 14px}.pet-controls{right:12px;top:19px;gap:4px}.wordmark{font-size:28px}.projects-intro h2{font-size:41px!important}.eyebrow{font-size:9px}.line{display:inline}.line+.line:before{content:' '}.card-title{flex-wrap:wrap}}

.dash-top>span,.dash-body small,.calendar-mini i,.travel-label>span,.demo-chat small,.next-case span,.case-meta small,.case-tags span{font-family:var(--sans)}

/* Real SoMe work, imported from Mads-Peter's existing portfolio. */
.media-feature-video>video{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:contain;background:#111725;align-self:stretch}
.portfolio-content>section.some-showcase{display:grid;grid-template-columns:1.15fr 1fr;gap:42px;align-items:center;padding:48px 0 70px;border-bottom:1px solid var(--line);margin:0 0 8px}
.some-video-frame video{display:block;width:100%;aspect-ratio:4/3;background:#111725;border-radius:8px;object-fit:contain}
.video-caption{font-size:11px;color:#8b98b0;line-height:1.6;margin:12px 0 0}
.some-copy h2{font-size:39px!important;margin:14px 0 22px!important}
.some-copy>p:not(.section-label){font-size:15px;line-height:1.8;color:var(--muted)}
.about-story summary{font-size:16px;color:#536785;cursor:pointer}.about-story details p{font-size:16px;line-height:1.8;margin:18px 0 0}
@media(max-width:760px){.portfolio-content>section.some-showcase{grid-template-columns:1fr;gap:24px;padding:25px 0 50px}.some-copy h2{font-size:36px!important}.media-feature-video>video{aspect-ratio:4/3}.media-feature-video{grid-template-columns:1fr}.some-copy>p:not(.section-label){font-size:15px}}