/* Dimensional brand refresh. Original logo remains unmodified. */
.app-header{padding:7px 19px;min-height:110px;background:#fbfaf5;border-bottom:1px solid #173e5010}
.brand-button{gap:12px;flex:1;justify-content:flex-start}
.original-logo{display:block;position:relative;width:102px;height:94px;overflow:hidden;flex:none;mix-blend-mode:multiply}
.original-logo img{position:absolute;width:255px;max-width:none;height:auto;left:-76px;top:-18px}
.header-brand-copy{font-family:var(--rounded);font-size:16px;line-height:1.2;text-align:left;letter-spacing:-.6px;color:var(--navy)}
.header-brand-copy em{font-family:Georgia,serif;font-size:21px;color:#237e80;font-weight:400}
.app-header .mode-badge{font-size:6px;padding:7px 5px;letter-spacing:.3px}
.app-header>.icon-button{background:#e8efe8;border:1px solid #dce5db}
.desktop-brand{top:15px;align-items:center}
.desktop-brand .original-logo{width:145px;height:120px}
.desktop-brand .original-logo img{width:350px;left:-104px;top:-28px}
.desktop-brand .header-brand-copy{display:none}
.presentation-intro h1{letter-spacing:-2.7px}
.home-greeting{padding-top:16px;padding-bottom:12px}
.welcome{min-height:355px;border-radius:26px;background:radial-gradient(ellipse at 85% 65%,#346c76 0%,#173e50 48%,#102e41 100%);box-shadow:0 15px 35px #10304218;overflow:hidden;padding-top:25px}
.welcome:before{opacity:.16}
.welcome h1{font-size:37px;letter-spacing:-1.8px;position:relative;z-index:4;max-width:215px}
.welcome h1 em{font-size:40px;color:#ffe1a2}
.welcome>p{position:relative;z-index:4;max-width:175px;font-size:11px;color:#e0eaec}
.welcome-art{width:205px;height:290px;right:-9px;bottom:22px;pointer-events:auto;z-index:3}
.welcome-art>.scribble{display:none}
.welcome-art .box-scene{width:205px;height:290px}
.welcome-art .orange-box,.welcome-art .box-flap{display:none}
.welcome-art .mascot-dimensional{width:207px;height:310px;left:0;bottom:-22px;top:auto;transform:none}
.welcome-art .scene-star{right:5px;top:45px;color:#ffd275;animation:orbit-star 7s ease-in-out infinite}
.hero-bottom{font-size:6.5px;letter-spacing:1px;bottom:19px;z-index:4}
.paper-tag{background:#ecf4e5;border-radius:4px;box-shadow:0 3px 8px #0002;letter-spacing:1px}
.home-start{position:relative;z-index:5;margin-top:14px}
.camera-cta{border:0;border-radius:17px;background:linear-gradient(135deg,#f77b40,#e95629);box-shadow:0 7px 0 #c84525,0 12px 23px #e95a2920;transition:transform .2s,box-shadow .2s}
.camera-cta:active{transform:translateY(4px);box-shadow:0 3px 0 #c84525}
.start-options{margin-top:13px}
.child-peek{border-radius:19px;background:linear-gradient(145deg,#f4f6ea,#e8eee2);border:1px solid #e1e7d9;box-shadow:0 4px 12px #133d5005}
#bottomnav{background:#fffefbf5;box-shadow:0 -8px 25px #173e5006;border-top:1px solid #173e500b}
.nav-item.active{color:#df5b2e}


.quote-title .mascot-dimensional{height:135px;width:90px}
.success-scene .mascot-dimensional{width:145px;height:220px;bottom:38px;left:42px}
.box-scene>.mascot-dimensional{height:180px;width:120px;left:37px;bottom:58px;top:auto}
.orange-box{background:linear-gradient(120deg,#ffab62 0%,#f77a38 47%,#d94e24 100%);border:1px solid #a73c27;box-shadow:9px 12px 14px #09243826,inset 0 3px 0 #ffc98a;transform:perspective(400px) rotateY(-12deg) rotateZ(-4deg)}
.box-flap{background:linear-gradient(145deg,#ffd096,#f79b59)!important;border-width:1px!important}
.van-scene{animation:van-travel 5s ease-in-out infinite}
.van-scene .wheel{animation:wheel-roll 1.4s linear infinite}
.van-scene .mascot-dimensional{height:135px;width:90px;top:-20px;left:85px}
.processing-scene .mascot-dimensional{width:132px;height:190px}
.btn{border-radius:14px;box-shadow:0 5px 13px #153c5010}
.notebook{box-shadow:0 12px 28px #123a5009}
@keyframes character-wave{0%,45%,100%{transform:rotate(0)}55%,75%{transform:rotate(13deg)}65%,85%{transform:rotate(-9deg)}}
@keyframes character-breathe{0%,100%{transform:translateY(2px) rotate(-3deg)}50%{transform:translateY(-12px) rotate(3deg)}}
@keyframes character-think{0%,100%{transform:rotate(-7deg) translateY(0)}50%{transform:rotate(5deg) translateY(-7px)}}
@keyframes character-celebrate{0%,60%,100%{transform:translateY(0) rotate(-3deg)}20%{transform:translateY(-18px) rotate(7deg)}40%{transform:translateY(-4px) rotate(-7deg)}}
@keyframes character-pack{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(12px) rotate(8deg)}}
@keyframes character-ride{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-5px) rotate(2deg)}}
@keyframes character-hello{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-20px) rotate(-10deg)}55%{transform:translateY(-12px) rotate(12deg)}75%{transform:translateY(-6px) rotate(-5deg)}}
@keyframes character-shadow{0%,100%{scale:1;opacity:.6}50%{scale:.75;opacity:.3}}
@keyframes orbit-star{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(-15px,-20px) rotate(80deg)}}
@keyframes van-travel{0%,100%{transform:translateX(-6px) rotate(-1deg)}50%{transform:translateX(9px) rotate(1deg)}}
@keyframes wheel-roll{to{rotate:360deg}}
@media(max-width:760px){.app-header{padding:5px 18px;min-height:107px}.welcome{min-height:355px}.welcome h1{font-size:39px}.welcome h1 em{font-size:41px}.welcome-art{right:-8px;bottom:20px}.header-brand-copy{font-size:15px}.original-logo{width:99px}.camera-cta{min-height:72px}.home-start{margin-top:16px}.stepper button{height:42px;width:38px}.remove-item{min-height:44px}.row-edit{min-height:44px}.fine{font-size:11px;line-height:1.6}}
@media(max-width:370px){.header-brand-copy{font-size:12px}.header-brand-copy em{font-size:17px}.app-header{padding-inline:12px;gap:5px}.brand-button{gap:4px}.welcome{min-height:350px;padding-inline:20px}.welcome h1{font-size:33px;max-width:180px}.welcome h1 em{font-size:36px}.welcome-art{right:-25px;transform:scale(.91);transform-origin:bottom right}.welcome>p{max-width:145px;font-size:10px}.stepper button{width:31px}.original-logo{width:89px}.original-logo img{left:-81px}.app-header .mode-badge{font-size:5px}.hero-bottom{font-size:5.5px}}
/* Hero scale overrides the smaller packing-scene proportions. */
.welcome-art .box-scene>.mascot-dimensional{width:202px;height:303px;left:6px;bottom:-16px;top:auto}
.original-logo{height:103px}
.app-header{min-height:116px}
@media(max-width:760px){.app-header{min-height:112px}.original-logo{height:101px}.welcome-art .box-scene>.mascot-dimensional{width:190px;height:285px;left:14px;bottom:-8px}}
@media(max-width:760px){.welcome h1{font-size:36px;max-width:190px}.welcome h1 em{font-size:38px}.welcome-art{right:-21px}.welcome>p{max-width:165px}}
@media(max-width:370px){.welcome h1{font-size:32px;max-width:170px}.welcome h1 em{font-size:34px}.welcome-art{right:-35px}}