/* A stable app selector. Product composition lives in the presentation stylesheets. */
/* The footer reserves space for the fixed dock; the workspace adds its normal gap. */
.app-shell{position:relative;width:min(100%,1720px);min-height:calc(100svh - var(--header-height));margin:auto;padding-bottom:28px}
.app-canvas{position:relative;min-width:0}
.app-browser-enhanced .app-panel[hidden],.app-browser-enhanced .studio-view[hidden]{display:none}
.canvas-topline,.rail-heading,.rail-caption,.rail-studio,.rail-arrow{display:none}
.rail-brand{display:none}
.app-rail{position:fixed;z-index:20;left:50%;bottom:14px;transform:translateX(-50%);width:min(1272px,calc(100% - 48px));padding:8px;background:#fffffff2;border:1px solid #dbd4e6;border-radius:20px;box-shadow:0 12px 32px -20px #2b17493b;backdrop-filter:blur(28px)}
.rail-items{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.rail-selection{position:absolute;z-index:0;left:0;top:0;display:block;border-radius:12px;pointer-events:none}
.rail-selection::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;border-radius:3px;background:currentColor}
.rail-selection.is-moving{will-change:transform}
.dock-selection-ready .rail-choice{z-index:1}
.dock-selection-ready .rail-choice[aria-current]{background:transparent}
.dock-selection-ready .rail-choice::after{display:none}
.rail-choice{position:relative;display:flex;align-items:center;gap:13px;min-width:0;min-height:94px;padding:9px 12px;border-radius:12px;isolation:isolate;transition:background-color .24s,color .24s}
.rail-choice:hover{background:color-mix(in srgb,var(--accent) 6%,white)}
.rail-choice[aria-current]{background:color-mix(in srgb,var(--accent) 11%,white)}
.rail-choice::after{content:"";position:absolute;left:12px;right:12px;bottom:1px;height:3px;border-radius:3px;background:var(--accent);transform:scaleX(0);transition:transform .24s cubic-bezier(.2,.7,.3,1)}
.rail-choice[aria-current]::after{transform:scaleX(1)}
.rail-art{display:block;flex:0 0 76px;width:76px;filter:drop-shadow(0 5px 8px #17122516)}
.rail-copy{display:grid;gap:5px;min-width:0}
.rail-copy strong{font-family:"eurostile",Arial,sans-serif;font-size:21px;font-weight:700;line-height:1.08;letter-spacing:-.02em}
.rail-copy>span{font-size:12px;line-height:1.3;color:var(--muted)}
.rail-choice[aria-current] .rail-copy strong,.rail-choice[aria-current] .dock-label{color:var(--accent)}
.dock-label{display:none}
.app-panel{position:relative;padding:20px 36px 32px;background:transparent}
.app-toolbar{display:flex;align-items:center;justify-content:space-between;min-height:48px;margin-bottom:20px;gap:12px}
.canvas-back{display:inline-flex;gap:10px;align-items:center;min-height:44px;color:var(--muted);font-size:16px}
.canvas-back:hover{color:var(--accent)}
.canvas-category{display:none}
body[data-default-app]:not([data-default-app=""]):not(.app-browser-enhanced) .studio-view{display:none}
body[data-default-app]:not([data-default-app=""]):not(.app-browser-enhanced) .app-panel{display:none}
body.home:not(.app-browser-enhanced) .app-panel{display:none}
body[data-default-app="comfy-companion"]:not(.app-browser-enhanced) #comfy-companion,body[data-default-app="aftertone"]:not(.app-browser-enhanced) #aftertone,body[data-default-app="iosamp"]:not(.app-browser-enhanced) #iosamp,body[data-default-app="the-edge"]:not(.app-browser-enhanced) #the-edge,body[data-default-app="image-studio"]:not(.app-browser-enhanced) #image-studio{display:grid}
@media(max-width:1199px){.rail-copy strong{font-size:18px}.rail-art{flex-basis:70px;width:70px}.rail-choice{gap:10px;padding-inline:8px}.app-panel{padding-inline:28px}}
@media(min-width:768px) and (width <1000px){:root{--dock-height:136px}.app-rail{width:calc(100% - 32px)}.rail-choice{flex-direction:column;gap:6px;min-height:108px;padding:7px 4px}.rail-art{width:70px;flex-basis:auto}.rail-copy{display:none}.dock-label{display:block;text-align:center;font-size:14px;font-weight:700;line-height:1.1}}
@media(width <768px){
 :root{--dock-height:120px}
 .app-shell{min-height:0;padding-bottom:20px}
 .app-rail{left:0;right:0;bottom:0;transform:none;width:100%;padding:7px 7px calc(7px + env(safe-area-inset-bottom));border:0;border-top:1px solid #ddd4e8;border-radius:0;background:#fffffff2;box-shadow:0 -8px 26px -20px #37175250}
 .rail-items{gap:2px}
 .rail-selection::after{left:12%;right:12%;height:2px;bottom:0}
 .rail-choice{flex-direction:column;justify-content:center;gap:6px;min-height:103px;padding:5px 1px;border-radius:12px}
 .rail-choice::after{left:12%;right:12%;height:2px;bottom:0}
 .rail-art{width:58px;flex-basis:auto}
 .rail-copy{display:none}
 .dock-label{display:flex;align-items:center;justify-content:center;max-width:100%;min-height:28px;text-align:center;font-family:"eurostile",Arial,sans-serif;font-size:14px;font-weight:700;line-height:1.08;letter-spacing:-.015em}
 .app-panel{padding:14px 20px 28px}
 .app-toolbar{margin-bottom:18px;gap:8px}
 .canvas-back{font-size:15px}
}
@media(width <360px){.rail-art{width:48px}.dock-label{font-size:13px}.app-panel{padding-inline:16px}}
/* Desktop has a persistent navigation region beside the selected canvas. */
@media(min-width:1100px){
 :root{--dock-height:0px}
 .app-shell{display:grid;grid-template-columns:304px minmax(0,1fr);align-items:start;gap:20px;width:min(100%,1720px);padding:20px 24px 28px}
 .app-canvas{grid-column:2;grid-row:1;border:0;border-radius:0;overflow:visible;background:transparent}
 .app-rail{position:fixed;grid-column:1;grid-row:1;top:calc(var(--header-height) + 20px);left:max(24px,calc((100vw - 1720px)/2 + 24px));bottom:auto;transform:none;width:304px;max-height:calc(100svh - var(--header-height) - 40px);padding:8px 10px 12px;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
 .rail-brand{display:block;margin:0 0 18px}
 .rail-brand .studio-brand-zone{display:block}
 .rail-brand .studio-brand-art{width:220px;max-width:100%;margin:0 auto}
 .rail-brand-purpose,.rail-heading{display:none}
 .rail-items{grid-template-columns:minmax(0,1fr);gap:6px}
 .rail-choice{min-height:104px;padding:8px 10px;gap:14px;border-radius:14px}
 .rail-art{width:88px;flex-basis:88px}
 .rail-copy{display:grid;gap:5px}
 .rail-copy strong{font-size:21px;line-height:1.1}
 .rail-copy>span{font-size:13px;line-height:1.25}
 .dock-label{display:none}
 .rail-selection{border-radius:14px}
 .rail-selection::after,.rail-choice::after{top:12px;bottom:12px;left:0;right:auto;width:3px;height:auto;border-radius:3px}
 .rail-choice::after{transform:scaleY(0)}
 .rail-choice[aria-current]::after{transform:scaleY(1)}
 .rail-studio{display:none}
 .app-panel{padding-inline:28px}
}
@media(min-width:1100px) and (max-height:900px){
 .rail-brand-purpose{display:none}
}
@media(min-width:1100px) and (max-height:828px){
 .rail-brand{margin-bottom:12px}
 .rail-brand .studio-brand-art{width:200px}
 .rail-brand-purpose{display:none}
 .rail-heading{margin-bottom:8px;font-size:11px}
 .rail-items{gap:4px}
 .rail-choice{min-height:72px;padding:4px 8px;gap:12px}
 .rail-art{width:64px;flex-basis:64px}
 .rail-copy strong{font-size:20px}
 .rail-copy>span{display:none}
}
@media(prefers-reduced-motion:reduce){.rail-choice,.rail-choice::after,.app-view-controls button{transition:none}}
.motion-paused .rail-choice,.motion-paused .rail-choice::after,.motion-paused .app-view-controls button{transition:none}

/* About introduces the actual company before the unchanged release/data facts. */
.information.company-about{width:min(1200px,calc(100% - 64px));margin:28px auto 64px}
.company-about .company-back{margin:0 0 20px;gap:10px;color:var(--ink);font-size:17px}
.company-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(260px,.8fr);gap:44px;align-items:center;padding:24px 0 48px}
.company-story{min-width:0}
.company-about .company-kicker{margin:0 0 18px;color:var(--brand);font-size:14px;letter-spacing:.055em;line-height:1.4}
.company-about .company-intro h1{margin:0;font-size:clamp(54px,5.6vw,76px);line-height:1.04;letter-spacing:-.055em;overflow-wrap:normal;word-break:normal}
.company-intro h1>span{color:var(--brand)}
.company-lead{margin-top:24px;max-width:640px;font-size:25px;line-height:1.38;letter-spacing:-.02em;color:var(--ink)}
.company-story-copy{margin-top:18px;max-width:600px;font-size:19px;line-height:1.55;color:var(--muted)}
.company-section-links{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:22px}
.company-section-links>a{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:48px;padding:8px 0;border-bottom:1px solid var(--brand);color:var(--brand);font-size:18px;font-weight:700;line-height:1.3}
.company-section-links>a:hover{color:var(--ink);border-color:var(--ink)}
.company-brand-art{width:100%;max-width:440px;justify-self:end;padding:18px 0;background:radial-gradient(ellipse at 72% 32%,#ffe2d170,transparent 65%),radial-gradient(ellipse at 30% 80%,#dae9ff70,transparent 65%)}
.company-about .company-apps{margin:0;padding-top:32px;border-top:1px solid var(--line);scroll-margin-top:calc(var(--header-height) + 20px)}
.company-section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:16px 36px;margin-bottom:24px}
.company-about .company-section-heading h2{margin:0;flex:none;font-size:34px;line-height:1.15}
.company-about .company-section-heading>p{max-width:570px;font-size:18px;line-height:1.5;color:var(--muted)}
.company-app-list{display:grid;grid-auto-rows:1fr;gap:12px;list-style:none;margin:0;padding:0}
.company-app-list>li{min-width:0}
.company-about .company-app-link{display:grid;grid-template-columns:112px 250px minmax(0,1fr) 44px;align-items:center;gap:24px;min-height:144px;height:100%;padding:16px 22px;border-left:3px solid var(--accent);border-radius:12px;background:color-mix(in srgb,var(--tint) 45%,#fff);text-decoration:none}
.company-app-link:hover{background:color-mix(in srgb,var(--tint) 75%,#fff)}
.company-app-art{display:block;width:112px;min-width:0}
.company-app-link h3{min-width:0;margin:0;font-size:28px;font-weight:700;line-height:1.15;letter-spacing:-.025em;color:var(--ink);overflow-wrap:normal;word-break:normal}
.company-about .company-app-link p{min-width:0;margin:0;font-size:19px;line-height:1.45;color:var(--muted)}
.company-app-arrow{display:grid;place-items:center;width:44px;height:44px;font-size:27px;line-height:1;color:var(--accent)}
.company-about .company-information{margin-top:56px;scroll-margin-top:calc(var(--header-height) + 20px)}
.company-about .company-information>section{display:grid;grid-template-columns:250px minmax(0,1fr);column-gap:44px;row-gap:16px;margin:0;padding:32px 0;border-top:1px solid var(--line)}
.company-about .company-information h2{grid-column:1;grid-row:1;margin:0;font-size:28px;line-height:1.22;letter-spacing:-.025em}
.company-about .company-information section>p,.company-about .company-information dl{grid-column:2;max-width:750px;margin:0;font-size:19px;line-height:1.55;color:var(--muted)}
.company-about .company-information dl{display:grid;grid-template-columns:150px minmax(0,1fr);gap:22px 24px}
.company-about .company-information dt{margin:0;font-size:20px;font-weight:700;line-height:1.35;color:var(--ink)}
.company-about .company-information dd{margin:0;font-size:18px;line-height:1.55;color:var(--muted)}
.company-about .company-information section a{display:inline-flex;align-items:center;min-height:44px;line-height:1.45;color:var(--brand)}
.information-page>footer{width:min(1200px,calc(100% - 64px));margin-inline:auto;padding:16px 0 32px;font-size:14px}
@media(width <1100px){
 .company-intro{grid-template-columns:minmax(0,1.4fr) minmax(220px,.8fr);gap:28px}
 .company-about .company-intro h1{font-size:clamp(46px,5.6vw,62px)}
 .company-about .company-app-link{grid-template-columns:96px 210px minmax(0,1fr) 44px;gap:18px;padding-inline:18px}
 .company-app-art{width:96px}
 .company-app-link h3{font-size:25px}
 .company-about .company-information>section{grid-template-columns:220px minmax(0,1fr);column-gap:30px}
 .company-about .company-information dl{grid-template-columns:1fr;gap:8px}
 .company-about .company-information dt:not(:first-child){margin-top:14px}
}
@media(width <960px){
 .company-intro{grid-template-columns:minmax(0,1fr) minmax(190px,.55fr);gap:24px}
 .company-about .company-intro h1{font-size:46px}
 .company-lead{font-size:23px}
 .company-about .company-app-link{grid-template-columns:96px minmax(0,1fr) 44px;grid-template-areas:"art name arrow" "art purpose arrow";column-gap:22px;row-gap:8px;min-height:140px}
 .company-app-art{grid-area:art}
 .company-app-link h3{grid-area:name;align-self:end}
 .company-about .company-app-link p{grid-area:purpose;align-self:start;font-size:18px}
 .company-app-arrow{grid-area:arrow}
 .company-about .company-information>section{grid-template-columns:minmax(0,1fr);row-gap:18px}
 .company-about .company-information h2,.company-about .company-information section>p,.company-about .company-information dl{grid-column:1;grid-row:auto}
 .company-about .company-information dl{grid-template-columns:160px minmax(0,1fr);gap:20px 24px}
 .company-about .company-information dt:not(:first-child){margin-top:0}
}
@media(width <768px){.company-intro{grid-template-columns:minmax(0,1fr)}.company-brand-art{max-width:360px;justify-self:center}}
@media(width <600px){
 .information.company-about{width:calc(100% - 40px);margin:20px auto 40px}
 .company-about .company-back{margin-bottom:12px;font-size:17px}
 .company-intro{grid-template-columns:minmax(0,1fr);gap:24px;padding:16px 0 32px}
 .company-about .company-kicker{font-size:13px;margin-bottom:14px}
 .company-about .company-intro h1{font-family:"eurostile",Arial,sans-serif;font-size:44px;font-weight:700;letter-spacing:-.04em;line-height:1.06}
 .company-lead{font-size:22px;line-height:1.42;margin-top:20px}
 .company-story-copy{font-size:18px;line-height:1.5;margin-top:16px}
 .company-section-links{gap:8px 20px;margin-top:18px}
 .company-section-links>a{font-size:17px;gap:16px;min-height:48px}
 .company-brand-art{max-width:350px;justify-self:center;padding:8px 0}
 .company-section-heading{display:block;margin-bottom:20px}
 .company-about .company-section-heading h2{font-size:27px;margin:0 0 10px}
 .company-about .company-section-heading>p{font-size:18px;line-height:1.45}
 .company-about .company-app-link{grid-template-columns:80px minmax(0,1fr);grid-template-areas:"art name" "purpose purpose";gap:14px;min-height:174px;padding:16px;position:relative}
 .company-app-art{width:80px}
 .company-app-link h3{align-self:center;font-size:25px;line-height:1.14}
 .company-about .company-app-link p{align-self:start;padding-right:32px;font-size:18px;line-height:1.45}
 .company-app-arrow{position:absolute;right:8px;bottom:9px;width:44px;height:44px;font-size:26px}
 .company-about .company-information{margin-top:36px}
 .company-about .company-information>section{padding:26px 0;row-gap:16px}
 .company-about .company-information h2{font-size:25px;line-height:1.24}
 .company-about .company-information section>p,.company-about .company-information dd{font-size:18px;line-height:1.55}
 .company-about .company-information dl{grid-template-columns:minmax(0,1fr);gap:8px}
 .company-about .company-information dt{font-size:21px}
 .company-about .company-information dt:not(:first-child){margin-top:16px}
 .information-page>footer{width:calc(100% - 40px);font-size:14px;padding-bottom:24px}
}
@media(width <360px){.information.company-about,.information-page>footer{width:calc(100% - 32px)}.company-about .company-app-link{padding:14px;column-gap:12px}.company-app-link h3{font-size:24px}}

/* A personal studio introduction, followed by a direct business contact. */
.company-about .company-maker{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:32px 64px;margin:0 0 44px;padding:42px 36px;border:0;border-radius:20px;background:radial-gradient(ellipse at 0 0,#dff4ff90,transparent 65%),radial-gradient(ellipse at 100% 100%,#f5dfff80,transparent 70%),#f1edfb;scroll-margin-top:calc(var(--header-height) + 20px)}
.maker-heading .eyebrow{margin:0 0 18px;font-size:14px;letter-spacing:.07em;color:var(--brand)}
.company-about .maker-heading h2{margin:0;font-size:clamp(36px,4.1vw,54px);line-height:1.08;letter-spacing:-.045em;color:var(--ink)}
.maker-copy{min-width:0}
.company-about .maker-copy p{max-width:650px;margin:0;font-size:20px;line-height:1.55;color:#51475f}
.company-about .maker-copy .maker-lead{margin:0 0 16px;font-size:28px;line-height:1.25;font-weight:700;letter-spacing:-.025em;color:var(--ink)}
.company-about .maker-copy p+p{margin-top:16px}
.company-about .maker-contact{display:grid;grid-template-columns:minmax(0,1fr) 30px;gap:5px 14px;align-items:center;margin-top:26px;padding:18px 0 0;border-top:1px solid #bba3df80;text-decoration:none;color:var(--brand)}
.maker-contact-label{grid-column:1;font-size:15px;font-weight:700;line-height:1.3}
.maker-contact-address{grid-column:1/-1;min-width:0;font-size:clamp(17px,1.65vw,21px);font-weight:700;line-height:1.4;overflow-wrap:anywhere}
.maker-contact-arrow{grid-column:2;grid-row:1;font-size:30px}
.company-about .maker-contact:hover{color:var(--ink)}
footer a[href^="mailto:"]{overflow-wrap:anywhere}
@media(width <768px){.company-about .company-maker{grid-template-columns:minmax(0,1fr);gap:24px;padding:30px 24px;margin-bottom:32px}.company-about .maker-copy p{font-size:19px}.company-about .maker-copy .maker-lead{font-size:25px}}
@media(width <400px){.company-about .company-maker{padding:26px 20px;border-radius:16px}.company-about .maker-heading h2{font-size:35px}.maker-contact-address{font-size:17px}}