/* A usable vintage desktop, framed by a physical CRT rather than a flat form card. */
.studio-design .retro-contact-stage.contact-stage{display:block;padding:130px 6% 65px;min-height:100svh;overflow:visible}
.retro-contact-heading{max-width:1110px;margin:0 auto 35px;display:flex;justify-content:space-between;align-items:end;gap:30px}
.retro-contact-heading>div>p{font-size:12px;color:#bcd8c8;margin:0 0 15px}
.retro-contact-heading h1,.retro-contact-heading h2{font-family:InterTight,Arial,sans-serif;font-weight:550;font-size:clamp(36px,4vw,56px);line-height:1.05;letter-spacing:-.035em;margin:0;color:#f0fbf4}
.retro-contact-heading>p{color:#c2d7ca;font-size:13px;line-height:1.8;max-width:280px;margin:0 0 4px}
.retro-computer{max-width:1110px;margin:auto;position:relative;padding-bottom:75px;filter:drop-shadow(0 30px 40px #0007)}
.retro-monitor{position:relative;padding:26px 33px 0;border-radius:32px 32px 25px 25px;background:linear-gradient(145deg,#e4e2cf,#c4c7b5 40%,#b0b9a5);border:2px solid #e8ecd94d;box-shadow:inset 3px 4px 3px #fff8,inset -7px -7px 6px #68755d99,11px 14px 0 #667660,17px 20px 0 #2e4439}
.retro-screen{position:relative;padding:10px;background:#1c2e25;border-radius:24px;box-shadow:inset 0 3px 9px #000,0 2px 1px #ffffee99;border:2px solid #909e89;overflow:hidden;isolation:isolate}
.retro-screen:after{content:'';position:absolute;inset:10px;border-radius:15px;pointer-events:none;z-index:10;box-shadow:inset 0 0 25px #00150b55;background:repeating-linear-gradient(0deg,#00190a08 0,#00190a08 1px,transparent 1px,transparent 3px);mix-blend-mode:multiply}
.retro-desktop{position:relative;min-height:0;padding:26px 35px 63px 125px;border-radius:15px;overflow:hidden;background:linear-gradient(135deg,#257d73,#195e59);font-family:Arial,Helvetica,sans-serif;color:#151c19;color-scheme:light}
.retro-desktop:before{content:'MDPXL';position:absolute;right:35px;top:27px;color:#bfe4cb12;font-family:InterTight,Arial,sans-serif;font-size:130px;font-weight:800;letter-spacing:-.06em;pointer-events:none}
.retro-desktop-icons{position:absolute;z-index:2;left:12px;top:23px;width:95px;display:grid;gap:22px}
.retro-desktop-icons :is(a,button){display:flex;flex-direction:column;align-items:center;gap:7px;color:#fff;background:none;border:1px solid transparent;padding:5px 0;font-size:12px;text-align:center;cursor:pointer;line-height:1.25;text-shadow:1px 1px #002e24;min-height:64px}
.retro-desktop-icons :is(a,button):hover,.retro-desktop-icons :is(a,button):focus-visible{background:#ffffff15;border:1px dotted #dcffef}
.retro-desktop-icons svg{width:43px;height:37px;filter:drop-shadow(2px 3px #003a3790)}
.retro-window{position:relative;z-index:3;width:min(100%,690px);margin:12px auto 0;border:2px solid #eef1e7;background:#c8cec6;box-shadow:inset -2px -2px #637464,3px 4px 0 #073e3399;color:#17201a;padding:3px;font-size:13px}
.retro-window[hidden]{display:none!important}
.retro-titlebar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:5px 5px 5px 9px;background:linear-gradient(90deg,#173c64,#426b91);color:#fff;min-height:32px;font-weight:700;font-size:12px;line-height:1.35}
.retro-titlebar>span{min-width:0}
.retro-titlebar i{font-style:normal;font-size:15px;margin-right:7px}
.retro-titlebar button,.retro-desktop .retro-taskbar>button,.retro-info-content>button{background:#d7dbd1;color:#15211a;border:2px solid;border-color:#f5faed #627365 #627365 #f5faed;border-radius:0;box-shadow:inset -1px -1px #b4bfb2;cursor:pointer;font:inherit}
.retro-titlebar button{width:25px;height:24px;flex-shrink:0;font-size:17px;line-height:16px;align-self:start}
.retro-menu-bar{display:flex;gap:23px;padding:10px 12px 7px;font-size:11px;color:#29372d;border-bottom:1px solid #9ba997;line-height:1}
.studio-design .retro-contact-stage.contact-stage .retro-window .story-contact-form{display:grid;gap:16px;max-width:none;margin:0;padding:20px 23px 17px;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;position:relative;z-index:1;color:#1b2b20;font:13px Arial,Helvetica,sans-serif}
.studio-design .retro-contact-stage.contact-stage .contact-form-heading h3{font:600 23px Arial,Helvetica,sans-serif;letter-spacing:-.025em;color:#17291d;margin:0 0 9px}
.studio-design .retro-contact-stage.contact-stage .contact-form-heading p{font-size:11px;color:#394c3f;margin:0;line-height:1.5;border-bottom:1px solid #95a491;padding-bottom:13px;overflow-wrap:anywhere}
.studio-design .retro-contact-stage.contact-stage .story-contact-form label{font:12px/1.55 Arial,Helvetica,sans-serif;color:#283c2d}
.studio-design .retro-contact-stage.contact-stage .story-contact-form :is(input,textarea,select){color:#14291c;background:#f7f9ed;border:2px solid;border-color:#71816c #f4f9e9 #f4f9e9 #71816c;border-radius:0;padding:8px 10px;box-shadow:inset 1px 1px #344d3040;font:14px/1.4 Arial,Helvetica,sans-serif;min-height:39px;appearance:auto;resize:vertical}
.studio-design .retro-contact-stage.contact-stage .story-contact-form textarea{min-height:67px;max-height:150px}
.studio-design .retro-contact-stage.contact-stage .story-contact-form :is(input,textarea)::placeholder{color:#697765;opacity:1}
.studio-design .retro-contact-stage.contact-stage .story-contact-form select option{color:#14291c;background:#f7f9ed}
.studio-design .retro-contact-stage.contact-stage .story-contact-form :is(input,textarea,select):focus-visible{outline:2px solid #184f72;outline-offset:2px}
.studio-design .retro-contact-stage.contact-stage .story-contact-form>button{background:#dce8d4;border:2px solid;border-color:#f6ffed #64785a #64785a #f6ffed;border-radius:0;color:#17371d;font:600 13px Arial,Helvetica,sans-serif;min-height:43px;padding:11px 15px;box-shadow:inset 0 0 0 1px #c5d1ba;cursor:pointer}
.studio-design .retro-contact-stage.contact-stage .story-contact-form>button:hover{background:#e5f3dc}
.studio-design .retro-contact-stage.contact-stage .story-contact-note{color:#43563e;font-size:10px;line-height:1.6;margin:0}
.studio-design .retro-contact-stage.contact-stage .story-contact-note a{color:#234e6f;text-decoration:underline}
.retro-window-status{display:flex;justify-content:space-between;gap:10px;margin:0 4px 4px;border:1px solid;border-color:#8b9d86 #ecf4e6 #ecf4e6 #8b9d86;padding:5px 8px;color:#42573e;font-size:10px}
.retro-info-content{padding:35px;color:#193320;min-height:375px}
.retro-info-content h3{font-family:Arial,sans-serif;font-weight:600;font-size:28px;line-height:1.2;letter-spacing:-.025em;margin:0 0 20px}
.retro-info-content p{font-size:13px;line-height:1.8;color:#40543b}
.retro-info-content address{display:flex;flex-direction:column;gap:18px;font-style:normal;font-size:17px;margin:30px 0}
.retro-info-content nav{display:flex;flex-wrap:wrap;gap:18px;font-size:12px;margin-bottom:30px}
.retro-info-content a{color:#204e6a;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
.retro-info-content>button{padding:11px 18px;font-size:13px}
.retro-taskbar{position:absolute;bottom:0;left:0;right:0;z-index:6;display:flex;align-items:center;gap:7px;min-height:39px;padding:4px;background:#c9d1c3;border-top:2px solid #edf5e6;color:#223b24;box-shadow:0 -1px #71896e;font-size:12px}
.retro-desktop .retro-taskbar>button{min-height:30px;padding:3px 11px;white-space:nowrap;font-size:11px}
.retro-taskbar .retro-start{font-weight:700!important}
.retro-start>span{font-size:19px;vertical-align:middle;color:#315e71;margin-right:3px}
.retro-desktop .retro-taskbar>.retro-task[aria-pressed=true]{background:#e4ebdd;border-color:#71816c #f8fbed #f8fbed #71816c;font-weight:600}
.retro-taskbar time{margin-left:auto;padding:6px 9px;border:1px solid;border-color:#889a83 #f2f6e6 #f2f6e6 #889a83;min-width:60px;text-align:center;font-size:11px}
.retro-start-menu{position:absolute;z-index:7;bottom:38px;left:4px;width:240px;display:grid;grid-template-columns:30px 1fr;padding:3px;border:2px solid;border-color:#f8fbed #71816c #71816c #f8fbed;background:#cad2c3;box-shadow:3px -3px 15px #002a2044}
.retro-start-menu[hidden]{display:none}
.retro-start-menu>span{writing-mode:vertical-rl;transform:rotate(180deg);color:#eef8e7;background:#58745d;padding:12px 6px;font-weight:700;letter-spacing:.02em}
.retro-start-menu>div{display:grid;padding:5px}
.retro-start-menu :is(button,a){background:none;color:#253b26;border:0;padding:12px;text-align:left;font:12px Arial,sans-serif;cursor:pointer;min-height:40px}
.retro-start-menu :is(button,a):hover{background:#1d5073;color:#fff}
.retro-monitor-chin{height:68px;display:flex;align-items:center;gap:15px;padding:0 10px;color:#4b6050}
.retro-maker{font-family:InterTight,Arial,sans-serif;font-size:23px;font-weight:800;letter-spacing:-.055em;text-shadow:1px 1px #f3f7dfbb}
.retro-maker>span{display:block;font-family:Arial,sans-serif;font-size:7px;letter-spacing:.48em;font-weight:400;text-align:center;margin-top:2px}
.retro-speaker{width:105px;height:14px;background:repeating-linear-gradient(90deg,#81927b 0,#81927b 2px,transparent 2px,transparent 5px);opacity:.45;border-radius:3px;margin-left:auto}
.retro-power{width:42px;height:42px;border-radius:50%;border:1px solid #65785e;background:linear-gradient(#d0d8c3,#a7b69c);box-shadow:inset 1px 2px #fff7,1px 2px #e8edda66;color:#3b523c;font-size:20px;cursor:pointer;display:grid;place-items:center}
.retro-led{width:6px;height:6px;background:#aaff73;border-radius:50%;box-shadow:0 0 8px #95ff4d}
.retro-computer[data-power=off] .retro-led{background:#8e9b7d;box-shadow:none}
.retro-monitor-foot{position:absolute;bottom:45px;left:50%;transform:translateX(-50%);width:28%;height:40px;background:linear-gradient(90deg,#879d83,#c6d1b7 45%,#819c7d);clip-path:polygon(10% 0,90% 0,100% 100%,0 100%);z-index:-1}
.retro-keyboard{position:absolute;bottom:0;left:50%;width:62%;height:30px;border-radius:5px;background:repeating-linear-gradient(90deg,transparent 0,transparent 12px,#869980 12px,#869980 14px),repeating-linear-gradient(0deg,#c8d4b9 0,#c8d4b9 7px,#94a78b 7px,#94a78b 9px);transform:translateX(-50%) perspective(180px) rotateX(35deg);border:7px solid #bccbb0;box-shadow:0 7px 0 #82967e,0 10px 15px #00100b66;z-index:-1}
.retro-standby{min-height:0;border-radius:14px;background:#06100a;color:#a9cfb2;display:grid;align-content:center;justify-items:center;gap:20px;font:14px 'Courier New',monospace}
.retro-standby[hidden]{display:none}
.retro-standby button{padding:12px 22px;color:#d8f3da;border:1px solid #8cc7937a;background:#10271a;font:inherit;cursor:pointer}
.retro-computer[data-power=off] .retro-desktop{display:none}
.retro-contact-outro{max-width:1110px;margin:20px auto 0;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;line-height:1.8;color:#bfd5c8}
.retro-contact-outro>span{color:#a1bfad;font-size:11px;text-align:center}
.studio-design .retro-desktop :is(a,button):focus-visible{outline:2px dotted #123e62;outline-offset:3px}
.studio-design .retro-desktop-icons :is(a,button):focus-visible{outline-color:#e2ffea}
@media(min-width:1500px){.retro-computer{max-width:1160px}.retro-desktop{min-height:0}}
@media(max-width:900px){.retro-desktop{padding:20px 18px 60px 105px}.retro-desktop-icons{left:5px;width:90px}.retro-monitor{padding:21px 23px 0}.retro-desktop:before{font-size:95px}.retro-contact-heading{gap:25px}.retro-contact-heading>p{max-width:220px}.retro-contact-heading h1,.retro-contact-heading h2{font-size:42px}}
@media(max-width:600px){.studio-design .retro-contact-stage.contact-stage{padding:110px 4% 45px}.retro-contact-heading{display:block;padding:0 2%;margin-bottom:27px}.retro-contact-heading h1,.retro-contact-heading h2{font-size:38px}.retro-contact-heading>p{margin:20px 0 0;font-size:12px;max-width:300px}.retro-monitor{padding:12px 10px 0;border-radius:22px 22px 18px 18px;box-shadow:inset 2px 3px 3px #fff8,inset -4px -4px 4px #68755d99,5px 7px 0 #62765d}.retro-screen{padding:5px;border-radius:15px}.retro-screen:after{inset:5px;border-radius:10px}.retro-desktop{padding:91px 8px 53px;min-height:0;border-radius:9px}.retro-desktop-icons{left:7px;right:7px;top:9px;width:auto;display:flex;gap:9px}.retro-desktop-icons :is(a,button){width:76px;font-size:11px;gap:5px;padding:3px 0;min-height:66px}.retro-desktop-icons svg{width:36px;height:31px}.retro-desktop:before{font-size:75px;top:25px;right:8px}.retro-window{margin:0;padding:3px;border-width:1px}.retro-titlebar{font-size:10px;gap:5px;padding:5px 4px 5px 6px;min-height:30px}.retro-titlebar i{display:none}.retro-titlebar button{width:25px;min-width:25px}.retro-menu-bar{gap:17px;font-size:10px;padding:9px}.studio-design .retro-contact-stage.contact-stage .retro-window .story-contact-form{padding:16px 12px;gap:13px}.studio-design .retro-contact-stage.contact-stage .contact-form-heading h3{font-size:22px}.studio-design .retro-contact-stage.contact-stage .contact-form-heading p{font-size:10px}.studio-design .retro-contact-stage.contact-stage .story-contact-form :is(input,textarea,select){font-size:16px;min-height:41px;padding:8px}.retro-contact-stage .contact-name-row{grid-template-columns:1fr;gap:13px}.studio-design .retro-contact-stage.contact-stage .story-contact-note{font-size:10px;line-height:1.6}.studio-design .retro-contact-stage.contact-stage .story-contact-form>button{font-size:12px;min-height:44px;padding:10px}.retro-taskbar{gap:4px;font-size:10px;padding:3px}.retro-desktop .retro-taskbar>button{font-size:9px;padding:4px 6px}.retro-taskbar time{font-size:10px;min-width:44px;padding:6px 4px}.retro-start>span{font-size:15px}.retro-window-status{font-size:9px}.retro-monitor-chin{height:58px;padding:0 4px;gap:11px}.retro-maker{font-size:20px}.retro-speaker{width:50px;height:10px}.retro-power{width:36px;height:36px}.retro-standby{min-height:0;font-size:12px}.retro-contact-outro{flex-wrap:wrap;justify-content:center;gap:10px 20px;font-size:11px;margin:13px auto 0}.retro-contact-outro>span{order:3;width:100%;font-size:10px}.retro-info-content{padding:25px 18px;min-height:410px}.retro-info-content h3{font-size:25px}.retro-info-content address{font-size:15px}.retro-keyboard{width:77%;height:27px}.retro-computer{padding-bottom:62px}.retro-monitor-foot{bottom:34px;height:34px;width:35%}}
@media(prefers-reduced-motion:reduce){.retro-computer *{scroll-behavior:auto}}
.retro-desktop-icons :is(a,button)>span{font-family:Arial,Helvetica,sans-serif;font-size:12px!important;line-height:1.25;letter-spacing:0;max-width:82px}
@media(max-width:600px){.retro-desktop-icons :is(a,button)>span{font-size:11px!important;max-width:72px;line-height:1.2}}

/* Keep the CRT proportions independent of the length of its applications. */
.retro-screen{aspect-ratio:4/3;display:grid;min-height:0}
.retro-desktop,.retro-standby{height:100%;min-height:0;min-width:0}
.retro-desktop{display:flex;flex-direction:column}
.retro-window{flex:1;min-height:0;margin-top:0;display:flex;flex-direction:column}
.retro-titlebar,.retro-menu-bar,.retro-window-status{flex-shrink:0}
.studio-design .retro-contact-stage.contact-stage .retro-window .story-contact-form{overflow-y:auto;min-height:0;flex:1;order:0;scrollbar-width:thin;scrollbar-color:#728b77 #c7d1c1;scroll-padding-block:18px}
.retro-info-content{min-height:0;overflow-y:auto;flex:1}
.retro-desktop-welcome{display:none}
.retro-message-dialog{width:calc(100% - 24px);max-width:540px;max-height:calc(100dvh - 24px);margin:auto;padding:7px;border:2px solid;border-color:#eef4e8 #71816c #71816c #eef4e8;background:#c8cec6;color:#17201a;box-shadow:0 20px 80px #0008;overflow:hidden}
.retro-message-dialog[open]{display:flex;flex-direction:column;gap:7px}
.retro-message-dialog::backdrop{background:#00140ee8}
.retro-dialog-close{align-self:end;flex-shrink:0;min-height:40px;padding:6px 12px;border:2px solid;border-color:#f5faed #627365 #627365 #f5faed;border-radius:0;background:#d7dbd1;color:#17291d;font:600 12px Arial,sans-serif;cursor:pointer}
[data-retro-dialog-body]{min-height:0;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#728b77 #c7d1c1;scroll-padding-block:12px}
.retro-message-dialog .retro-window{height:auto;margin:0;width:100%}
.studio-design .retro-message-dialog .retro-window .story-contact-form{overflow:visible;flex:none}
body.retro-message-open{overflow:hidden}
@media(max-width:600px){
 .retro-desktop{padding:8px 8px 46px 73px}
 .retro-desktop:before{top:32%;right:5%;font-size:clamp(40px,14vw,75px)}
 .retro-desktop-icons{top:6px;left:4px;right:auto;width:62px;display:grid;gap:0}
 .retro-desktop-icons :is(a,button){width:62px;min-height:51px;gap:3px;padding:4px 0}
 .retro-desktop-icons svg{width:29px;height:25px}
 .retro-desktop-icons :is(a,button)>span{font-size:10px!important}
 .js .retro-desktop-welcome{position:absolute;inset:16px 10px 48px 78px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;color:#eef9e6;text-shadow:1px 1px #153c32}
 .retro-desktop-welcome>span{font:10px Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
 .retro-desktop-welcome strong{font:600 clamp(16px,5vw,23px)/1.15 InterTight,Arial,sans-serif;letter-spacing:-.025em}
 .retro-desktop-welcome button{min-height:44px;padding:8px 13px;border:2px solid;border-color:#f5faed #627365 #627365 #f5faed;background:#d7dbd1;color:#17291d;font:600 12px Arial,sans-serif;cursor:pointer}
 .retro-info-window{position:absolute;inset:7px 7px 45px 72px;width:auto;height:auto}
 .retro-info-content{padding:13px 10px}
 .retro-info-content h3{font-size:20px;margin-bottom:10px}
 .retro-info-content p{font-size:12px;line-height:1.5}
 .retro-info-content address{font-size:13px;gap:12px;margin:17px 0}
 .retro-info-content nav{gap:12px;margin-bottom:18px}
 .retro-monitor-chin{height:50px}
 .retro-maker{font-size:18px}
 .retro-maker>span{font-size:6px}
 .retro-power{width:32px;height:32px}
 .retro-start-menu{max-height:calc(100% - 42px);overflow-y:auto;width:min(240px,calc(100% - 8px))}
 .retro-start-menu :is(button,a){min-height:36px;padding:9px}
 .retro-message-dialog .retro-titlebar button{min-height:36px;width:36px}
 .retro-message-dialog .retro-menu-bar{padding:9px}
}

.retro-desktop-welcome[hidden]{display:none!important}
@media(max-width:370px){
 .studio-design .retro-desktop-icons{gap:0}
 .studio-design .retro-desktop-icons :is(a,button){width:62px;min-height:44px;gap:2px;padding:3px 0}
 .studio-design .retro-desktop-icons svg{width:25px;height:21px}
}
