/* 2003 Aqua revision: soft chrome, glossy controls, restrained color. */
:root{font-family:'Lucida Grande','Lucida Sans Unicode',Tahoma,Arial,sans-serif;--blue:#167fc8;--paper:#f3f5f6;--line:#d3dce3;color:#344d62;background:#f3f5f6}
body{background:radial-gradient(ellipse at 50% 10%,#fff,#f3f5f6 65%)}
.site-header{margin:0 5%;height:106px}.header-brand{display:flex;align-items:baseline;gap:17px}.digicam-wordmark{font-family:'Arial Rounded MT Bold','Trebuchet MS',Arial,sans-serif;letter-spacing:-2.7px;font-size:43px;font-weight:900;text-decoration:none;color:#34536e;text-shadow:0 1px white}.digicam-wordmark span{font-size:14px;letter-spacing:0;margin-left:5px;color:#4aa3d9;text-shadow:0 1px #bfeafb,0 -1px #2e749d}.studio-attribution{font-size:11px;color:#7a8b9a;text-decoration:none;letter-spacing:-.2px}.studio-attribution:hover{text-decoration:underline}.text-button{font-size:11px;font-weight:500;color:#708697}.edition{color:#63798b;letter-spacing:1px;font-size:9px}.dot{background:linear-gradient(#b6e6ff,#4d9edb 55%,#73bce9);box-shadow:0 0 0 1px #4a97c276,inset 0 1px 1px white}#landing h1{font-family:'Trebuchet MS',Arial,sans-serif;color:#324d66;font-weight:700;text-shadow:0 2px white;letter-spacing:-4.3px}#landing h1 span{color:#167ac7}#landing h1 em{color:#188bb6}.intro-stage{height:380px}.hero-camera{width:485px;transform:perspective(1000px) rotateY(-12deg) rotateZ(-8deg) rotateX(5deg);transition:transform .6s cubic-bezier(.2,.65,.2,1);filter:drop-shadow(5px 26px 15px #28446124)}.hero-camera:hover{transform:perspective(1000px) rotateY(-4deg) rotateZ(-4deg) rotateX(2deg)}.front-asset{object-fit:contain;border-radius:0}.camera-invitation{transform:translateX(-50%) rotate(8deg);font-size:10px;font-weight:700;letter-spacing:1.4px;color:#164c77;background:linear-gradient(#fff 1%,#dcf2ff 30%,#8fc8ef 49%,#68b3e8 51%,#b8e5ff 99%);border:1px solid #78a9ca;box-shadow:inset 0 1px 1px white,0 2px 3px #416a8c40;border-radius:25px;text-shadow:0 1px #e1f4ff}.orbit{border-color:#b2cddd}.orbit-two{border-color:#d6dfd8}.spark{color:#4196ba}.spark-two{color:#92bac9}.sticker{background:linear-gradient(150deg,#f8ffde,#d8eb89);width:112px;height:112px;box-shadow:0 0 0 4px #f7f9f4,0 0 0 5px #cbd8ad;color:#657a2c}.sticker b{font-family:'Trebuchet MS',Arial,sans-serif}.hand-note{color:#748b9c}.intro-bottom{display:block;text-align:center;margin:35px auto 36px}.intro-bottom p{font-size:13px;line-height:1.8;color:#7d8c99}.intro-foot{font-weight:400;letter-spacing:.2px;color:#8594a0;margin:0 5%}.intro-foot span:first-child{color:#8594a0}
#studio{padding:0 5%}.studio-heading{color:#8393a0;font-size:9px}.studio-heading .text-button{font-size:10px}.studio-layout{grid-template-columns:minmax(0,1fr) 320px;gap:50px}.workspace-title h1,.look-sidebar h2,dialog h2{font-family:'Trebuchet MS',Arial,sans-serif;color:#36536c}.eyebrow{color:#8b9ba7;font-size:8px}.tiny-star{color:#8bbacb;font-size:45px}.camera-actions{margin-top:27px;gap:12px}.primary-button,.secondary-button{font-family:'Lucida Grande',Tahoma,Arial,sans-serif;font-size:12px;font-weight:700;border-radius:25px;padding:12px 23px;gap:20px;min-height:44px;white-space:nowrap}.primary-button{color:#154d79;background:linear-gradient(#fff 0%,#e1f4ff 16%,#abd9f6 46%,#69b4e9 50%,#6db9ef 62%,#b7e5ff 100%);box-shadow:inset 0 1px 2px white,inset 0 -1px 1px #b8e5ff,0 2px 3px #526c8a40;border:1px solid #719dc6;text-shadow:0 1px #d5edff}.secondary-button{color:#607183;background:linear-gradient(#fff,#f6f8fa 43%,#dfe5eb 49%,#d4dce5 55%,#f4f6f9);border:1px solid #a8b5c1;box-shadow:inset 0 1px 2px white,0 2px 3px #50668224;text-shadow:0 1px white}.primary-button:hover{box-shadow:inset 0 1px 2px white,0 0 0 3px #c9eaff80,0 3px 6px #4a8ebf40}.secondary-button:hover{box-shadow:inset 0 1px white,0 0 0 3px #e0e9f280}.primary-button:active,.secondary-button:active{box-shadow:inset 0 2px 5px #395f9270;background:linear-gradient(#8dbbdc,#9cd4f4 45%,#c6e6fb);border-color:#6589a9;transform:translateY(2px)}.camera-secondary .text-button{font-size:10px;color:#8192a0}.status{font-size:11px;color:#657e91}.settings-status{color:#9babb6;font-weight:400}.camera-note{color:#8799a7}.look-sidebar{padding-left:28px}.look-sidebar h2{font-size:26px}.look-option{position:relative;border:1px solid #d0dae2;background:linear-gradient(#fff,#f6f8fa 56%,#eef2f5);padding:11px 13px 11px 5px;grid-template-columns:100px minmax(0,1fr) 15px;gap:7px;border-radius:11px;min-height:102px;box-shadow:inset 0 1px 1px #fff,0 1px 2px #4259710b;overflow:hidden;transition:background .2s,border-color .2s,box-shadow .2s}.look-option:hover{border-color:#97bedc;background:linear-gradient(#fff,#ecf7ff)}.look-option[aria-pressed=true]{background:linear-gradient(#f7fdff,#e5f3fc 50%,#d4e9f7);border-color:#7ba7ca;box-shadow:inset 0 1px 1px #fff,0 0 0 1px #d8ebf8,0 2px 3px #244e7914}.look-option:active{box-shadow:inset 0 2px 4px #44678a30}.look-option[data-look=classic]{grid-template-columns:1fr 20px 15px;min-height:53px;padding-left:17px}.era-title{font-family:'Trebuchet MS',Arial,sans-serif;font-size:16px;letter-spacing:-.5px;color:#44617a}.era-copy{min-width:0}.era-wordmark{width:100%;max-width:145px;height:30px;object-fit:contain;object-position:left center;display:block;margin:0 0 8px}.look-era{font-size:8px;color:#8b9daa;line-height:1.5;font-weight:400}.look-swatch{width:13px;height:22px;border-radius:8px;box-shadow:inset 0 0 0 1px #405d6d20,0 1px white;grid-column:3;grid-row:1}.look-swatch:after{display:none}.look-option[data-look=classic] .look-swatch{grid-column:2;width:16px}.look-check{position:absolute;right:12px;bottom:7px;color:#6f9bb7;font-size:5px}.era-camera{position:relative;display:block;width:100%;aspect-ratio:4/3;perspective:500px;grid-column:1;grid-row:1;isolation:isolate}.era-camera-turn{position:absolute;inset:0;transform:rotateY(-8deg);transition:transform .65s cubic-bezier(.2,.65,.2,1)}.era-camera img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 3px #36587521);transition:opacity .55s;pointer-events:none}.era-angle-left{opacity:1}.era-angle-right{opacity:0}.era-glow{position:absolute;left:var(--flash-x);top:var(--flash-y);width:12px;height:7px;transform:translate(-50%,-50%);border-radius:50%;opacity:0;box-shadow:0 0 6px 2px #fff,0 0 16px 7px #d4efffa6;background:#f5fcff;transition:opacity .6s;pointer-events:none}.look-option[data-look=phone] .era-glow{width:22px;height:34px;border-radius:5px;box-shadow:0 0 14px 5px #c1e2ff55;background:#c4eaff5c}.look-option:focus-visible .era-camera-turn{transform:rotateY(8deg)}.look-option:focus-visible .era-angle-left{opacity:0}.look-option:focus-visible .era-angle-right{opacity:1}.look-option:focus-visible .era-glow{opacity:.65}@media(hover:hover){.look-option:hover .era-camera-turn{transform:rotateY(8deg)}.look-option:hover .era-angle-left{opacity:0}.look-option:hover .era-angle-right{opacity:1}.look-option:hover .era-glow{opacity:.65}}@media(hover:none){.look-option[aria-pressed=true] .era-camera-turn{transform:rotateY(8deg)}.look-option[aria-pressed=true] .era-angle-left{opacity:0}.look-option[aria-pressed=true] .era-angle-right{opacity:1}.look-option[aria-pressed=true] .era-glow{opacity:.5}}
.look-explanation{font-size:11px;color:#7890a1}.look-footnote{font-size:8px;color:#98a9b5}.studio-footer{color:#91a2af;font-weight:400}.studio-footer a{text-decoration:none}dialog{border:1px solid #aabcc9;border-radius:16px;background:linear-gradient(#fff,#eff4f7);box-shadow:inset 0 1px 2px #fff,0 20px 100px #243c5850}dialog::backdrop{background:#283d5670}dialog h2{font-size:40px}dialog p{font-size:12px;color:#718594}.setting-row{font-size:12px}.setting-row small{color:#8a9ba8;font-size:10px}.setting-row [aria-pressed=true]{background:linear-gradient(#b8dcf5,#8dc7ed 50%,#c2e7fb);border-color:#729dc0}.camera-transition{position:fixed;z-index:80;pointer-events:none;transform-style:preserve-3d;filter:drop-shadow(0 15px 18px #344b6b30)}.camera-transition img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;backface-visibility:hidden;-webkit-backface-visibility:hidden}.camera-transition #transition-rear{transform:rotateY(180deg)}.arriving .rear-camera{visibility:hidden}.arriving .camera-actions,.arriving .camera-secondary{pointer-events:none;opacity:.25}
@media(min-width:1450px){.studio-layout{gap:75px;grid-template-columns:minmax(0,1fr) 345px}.look-sidebar{padding-left:35px}.look-option{grid-template-columns:110px minmax(0,1fr) 15px}}
@media(max-width:1050px){.studio-layout{gap:28px;grid-template-columns:minmax(0,1fr) 280px}.look-sidebar{padding-left:20px}.look-option{grid-template-columns:83px minmax(0,1fr) 12px;gap:5px;min-height:93px}.era-wordmark{height:27px}.look-era{font-size:7px}.workspace-title h1{font-size:29px}}
@media(max-width:760px){.site-header{height:87px;margin:0 6%;gap:10px}.header-brand{gap:11px}.digicam-wordmark{font-size:34px;letter-spacing:-2.1px}.digicam-wordmark span{font-size:10px;margin-left:3px}.studio-attribution{font-size:8px}.site-header .text-button{font-size:9px}.edition{font-size:7px;letter-spacing:.7px}#landing h1{font-size:61px;letter-spacing:-3.5px}.intro-stage{height:330px}.hero-camera{width:380px}.camera-invitation{font-size:8px}.sticker{width:80px;height:80px}.sticker b{font-size:22px}.sticker span{font-size:6px}.intro-bottom{margin:27px 8% 32px}.intro-bottom p{font-size:11px}.intro-foot{margin:0 6%;font-size:7px}.intro-foot span{max-width:70%}.studio-layout{grid-template-columns:1fr;gap:31px}.look-sidebar{padding:23px 0 0}.look-list{grid-template-columns:1fr 1fr}.look-option{min-height:110px;padding:12px 13px 12px 5px;grid-template-columns:95px minmax(0,1fr) 12px;gap:5px}.look-option[data-look=classic]{grid-column:1/-1;min-height:52px}.primary-button,.secondary-button{font-size:11px;padding:12px 21px;gap:16px}.studio-footer{font-size:8px}.camera-note{font-size:8px}.camera-secondary .text-button{font-size:10px}}
@media(max-width:570px){.look-list{grid-template-columns:1fr}.look-option{grid-template-columns:110px minmax(0,1fr) 16px;min-height:99px;padding-right:18px;gap:15px}.era-wordmark{max-width:170px;height:32px}.look-era{font-size:9px}.era-camera{aspect-ratio:4/2.8}.look-swatch{width:16px;height:26px}.look-check{right:20px;bottom:10px}.look-footnote{font-size:9px}}
@media(max-width:450px){.header-brand{gap:8px}.digicam-wordmark{font-size:31px}.studio-attribution{font-size:8px}#landing h1{font-size:49px;letter-spacing:-2.8px}.hero-camera{width:310px}.intro-stage{height:290px}.sticker{width:67px;height:67px}.sticker b{font-size:19px}.sticker span{font-size:5px}.workspace-title h1{font-size:26px}.eyebrow{font-size:7px}.camera-secondary .text-button{font-size:9px}dialog h2{font-size:35px}.setting-row .secondary-button{font-size:9px}}
@media(prefers-reduced-motion:reduce){.hero-camera,.hero-camera:hover,.hero-camera:active{transform:rotate(-4deg)}.era-camera-turn,.look-option:hover .era-camera-turn,.look-option:focus-visible .era-camera-turn,.look-option[aria-pressed=true] .era-camera-turn{transform:none!important}.look-option .era-angle-left{opacity:1!important}.look-option .era-angle-right{opacity:0!important}.look-option .era-glow{box-shadow:none!important;opacity:0!important}.look-option:hover .era-glow,.look-option:focus-visible .era-glow,.look-option[aria-pressed=true] .era-glow{opacity:.15!important}.camera-transition{display:none!important}}

/* Iridescence stays in small accents; interaction supplies the movement. */
.digicam-wordmark{background:linear-gradient(110deg,#284b64 6%,#4e7d89 29%,#75658e 48%,#337c93 68%,#284b64 94%);background-clip:text;-webkit-background-clip:text;color:transparent;text-shadow:0 1px 1px #7194ab18}
#landing h1 em{background:linear-gradient(105deg,#2476a3 8%,#3d949c 36%,#8b73a4 62%,#2476a3 92%);background-clip:text;-webkit-background-clip:text;color:transparent}
.look-option:before{content:'';position:absolute;left:10%;right:10%;top:0;height:1px;background:linear-gradient(90deg,transparent,#9dc5d799,#c4b8e799,#bed9c599,transparent);pointer-events:none}
.look-option{transition:transform .3s,background .2s,border-color .2s,box-shadow .3s}
@media(hover:hover){.look-option:hover{transform:translateY(-2px);box-shadow:inset 0 1px #fff,0 5px 12px #48658015}.hero-camera:hover{transform:perspective(1000px) translateZ(12px) rotateY(-4deg) rotateZ(-4deg) rotateX(2deg)}}
.look-option:active{transform:translateY(1px)}
@media(prefers-reduced-motion:reduce){.look-option:hover,.look-option:active{transform:none}.hero-camera:hover{transform:rotate(-4deg)}}
