:root{--bg:#fbf8f9;--surface:#fff;--ink:#342f38;--muted:#89818c;--pink:#ec7796;--pinksoft:#fff0f4;--border:#f0e8ec;--shadow:0 14px 36px rgba(71,43,60,.065);--radius:25px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-tap-highlight-color:transparent}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #ef9bb3;outline-offset:3px}button:disabled{opacity:.5;cursor:default}.hidden{display:none!important}.icon{width:24px;height:24px;display:inline-block;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round;fill:none;flex:none}.screen{min-height:100dvh}.login{display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 20% 16%,#ffe2eb 0,transparent 37%),radial-gradient(circle at 85% 86%,#eaf5ed 0,transparent 40%),#fbf8f9}.login-card{width:min(100%,410px);background:#fff;padding:38px 30px;border:1px solid var(--border);border-radius:32px;box-shadow:var(--shadow);text-align:center}.mark{width:74px;height:74px;border-radius:23px;background:linear-gradient(145deg,#f6a9bd,#e46a91);color:#fff;display:grid;place-items:center;margin:0 auto 18px;box-shadow:0 10px 24px #e88da839}.mark .icon{width:38px;height:38px}.login h1{font-size:30px;margin:0 0 6px;letter-spacing:-1.3px}.sub{color:var(--muted);font-size:14px}.login .sub{margin:0 0 31px}.field{text-align:left;margin:0 0 15px}.field label{font-size:13px;font-weight:700;display:block;margin-bottom:8px}.field input{width:100%;border:1px solid #e9dfe4;background:#fff;border-radius:14px;padding:15px;font-size:16px;color:var(--ink)}.field input:focus{border-color:var(--pink)}.login-error{font-size:13px;color:#ad294b;min-height:17px;margin:0 0 10px}.primary{background:var(--pink);border:0;border-radius:15px;color:#fff;font-weight:750;padding:15px 20px;display:inline-flex;gap:9px;align-items:center;justify-content:center}.primary.full{width:100%}.demo-note{font-size:12px;line-height:1.6;color:var(--muted);margin:21px 0 0}.app{max-width:1130px;margin:auto;padding:0 25px 100px}.topbar{position:sticky;top:0;z-index:10;background:rgba(251,248,249,.93);backdrop-filter:blur(18px);height:90px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(240,232,236,.8)}.brand{display:flex;align-items:center;gap:12px}.brand-icon{width:47px;height:47px;border-radius:15px;background:#f9e0e8;color:#d56386;display:grid;place-items:center}.brand-icon .icon{width:28px;height:28px}.brand-main{font-size:20px;font-weight:800;letter-spacing:-.7px}.brand-second{font-size:12px;color:var(--muted);margin-top:1px}.head-actions{display:flex;gap:7px;align-items:center}.round-btn{background:#fff;border:1px solid var(--border);border-radius:13px;width:43px;height:43px;display:grid;place-items:center;color:#6e616c}.round-btn:hover,.round-btn.active{color:#c9557a;background:#fff0f4}.avatar{background:#f3e9ec;font-size:20px}.crumb{margin-top:27px;display:flex;align-items:center;gap:7px;color:var(--muted);font-size:13px}.crumb button{border:0;background:none;color:var(--muted);padding:4px 0}.crumb strong{color:var(--ink);font-weight:700}.hero{margin:22px 0 28px;padding:24px 28px;border:1px solid #f8e0e7;border-radius:27px;background:linear-gradient(105deg,#fff0f4 0%,#fffbfc 61%,#f1f8f2 100%);display:flex;align-items:center;gap:19px}.hero-avatar{width:78px;height:78px;border-radius:26px;background:white;display:grid;place-items:center;color:#de7b9b;box-shadow:0 8px 19px #e4a2b331}.hero-avatar .icon{width:43px;height:43px}.hero-text{flex:1}.eyebrow{color:#c97792;font-size:12px;font-weight:750;margin-bottom:8px;letter-spacing:.6px;text-transform:uppercase}.hero h1{margin:0;font-size:clamp(23px,3vw,30px);letter-spacing:-1px}.hero p{color:#877a84;font-size:13px;margin:7px 0 0}.age-pill{white-space:nowrap;background:#fff;color:#c76083;padding:12px 16px;border-radius:16px;font-size:13px;font-weight:750}.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:24px 0 18px}.section-head h2{font-size:20px;letter-spacing:-.5px;margin:0}.section-head small{font-size:12px;color:var(--muted)}.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tile{min-height:205px;padding:22px 14px 18px;border:1px solid var(--border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;transition:transform .15s,border-color .15s,box-shadow .15s;color:var(--ink)}.tile:hover{transform:translateY(-3px);border-color:#efc5d2;box-shadow:0 14px 28px #6d405116}.tile:active{transform:scale(.985)}.tile-icon{width:87px;height:87px;border-radius:27px;display:grid;place-items:center;margin-bottom:6px}.tile-icon .icon{width:46px;height:46px;stroke-width:1.7}.tone1{background:#fff0f3;color:#df7693}.tone2{background:#f0f4ff;color:#8096d0}.tone3{background:#ffefd9;color:#d69e49}.tone4{background:#eaf6f0;color:#69ab88}.tone5{background:#f3effb;color:#9c84c6}.tone6{background:#eaf5fa;color:#75abc1}.tile-title{font-size:19px;font-weight:800;letter-spacing:-.4px}.tile-desc{font-size:12px;color:#948c95}.main-pane{animation:enter .18s ease}@keyframes enter{from{opacity:.4;transform:translateY(5px)}to{opacity:1;transform:none}}.page-title{display:flex;align-items:center;gap:15px;margin:25px 0}.back{height:45px;width:45px;display:grid;place-items:center;border:1px solid var(--border);background:#fff;border-radius:14px}.page-title h1{font-size:26px;margin:0 0 3px;letter-spacing:-.7px}.page-title .sub{margin:0}.child-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.child{border:1px solid var(--border);border-radius:23px;background:#fff;text-align:left;padding:26px;min-height:135px;display:flex;align-items:center;gap:18px;box-shadow:var(--shadow)}.child .tile-icon{width:66px;height:66px;border-radius:22px;margin:0;flex:none}.child .tile-icon .icon{width:33px;height:33px}.child h3{font-size:19px;margin:0 0 5px}.child p{margin:0;color:var(--muted);font-size:12px}.child .chev{margin-left:auto;color:#a49aa1}.child:hover{border-color:#eeb8c9}.panel{background:#fff;border:1px solid var(--border);border-radius:23px;padding:24px;box-shadow:var(--shadow);margin-top:19px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.panel h3{margin:0;font-size:17px;letter-spacing:-.3px}.flat-btn{border:0;background:#fff0f4;color:#ce6284;font-size:13px;font-weight:700;border-radius:11px;padding:10px 13px}.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.metric{background:#fcfafb;border:1px solid #f5edf0;border-radius:17px;padding:18px}.metric-name{font-size:12px;color:var(--muted)}.metric-value{font-size:25px;font-weight:800;margin-top:8px}.empty{color:var(--muted);font-size:13px;text-align:center;padding:26px 8px;line-height:1.7}.empty .icon{width:32px;height:32px;color:#c8bfc5;margin-bottom:6px}.stat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px}.stat-card{border:1px solid var(--border);background:#fff;border-radius:20px;padding:21px}.stat-card h3{font-size:15px;margin:0 0 7px}.stat-card p{font-size:12px;color:var(--muted);margin:0}.placeholder{background:#fcfafb;border:1px dashed #e7dce2;border-radius:15px;margin-top:16px;min-height:106px;display:grid;place-items:center;font-size:13px;color:#aaa0a8}.bottom-nav{display:none}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#3f3540;color:#fff;border-radius:14px;padding:13px 18px;font-size:13px;box-shadow:var(--shadow);z-index:30;max-width:90%;text-align:center}.footer{font-size:12px;color:#aaa0a8;text-align:center;margin:35px 0 0}@media(max-width:700px){.app{padding:0 16px 103px}.topbar{height:72px}.brand-icon{width:42px;height:42px}.brand-main{font-size:18px}.brand-second{font-size:11px}.head-actions .desktop-only{display:none}.crumb{margin-top:16px}.hero{margin:15px 0 21px;padding:19px 15px;gap:12px;border-radius:22px}.hero-avatar{width:59px;height:59px;border-radius:19px}.hero-avatar .icon{width:32px;height:32px}.hero h1{font-size:21px}.eyebrow{font-size:10px;margin-bottom:5px}.hero p{font-size:11px}.age-pill{font-size:11px;padding:9px 10px}.section-head{margin:20px 0 13px}.section-head h2{font-size:17px}.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tile{min-height:173px;border-radius:22px;padding:16px 8px}.tile-icon{width:72px;height:72px;border-radius:22px}.tile-icon .icon{width:38px;height:38px}.tile-title{font-size:17px}.tile-desc{font-size:11px}.page-title h1{font-size:23px}.child-grid{gap:11px}.child{padding:17px 12px;min-height:150px;flex-direction:column;align-items:flex-start;gap:9px}.child .tile-icon{height:49px;width:49px;border-radius:15px}.child .tile-icon .icon{width:26px;height:26px}.child h3{font-size:16px}.child .chev{display:none}.panel{padding:18px}.metric-row{gap:8px}.metric{padding:12px 9px}.metric-name{font-size:10px}.metric-value{font-size:19px}.stat-grid{grid-template-columns:1fr}.bottom-nav{display:grid;position:fixed;z-index:15;bottom:0;left:0;right:0;grid-template-columns:repeat(3,1fr);background:rgba(255,255,255,.96);backdrop-filter:blur(15px);border-top:1px solid var(--border);padding:8px 10px calc(9px + env(safe-area-inset-bottom))}.bottom-nav button{background:none;border:0;color:#928690;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:650;padding:6px}.bottom-nav button.selected{color:#d36486}.bottom-nav .icon{width:23px;height:23px}.footer{margin:24px 0 0}.toast{bottom:95px}}@media(max-width:365px){.hero{flex-wrap:wrap}.age-pill{margin-left:auto}.tile{min-height:158px}.tile-icon{width:62px;height:62px}.tile-icon .icon{width:33px;height:33px}}

/* V2: one unified header; screen-filling adaptive dashboard */
.app{max-width:none;width:100%;padding:0 clamp(16px,3.3vw,72px) 65px}
.topbar{height:clamp(92px,12vh,126px);background:linear-gradient(105deg,#fff0f4 0%,#fffafb 60%,#f1f8f2 100%);border:1px solid #f8e0e7;border-radius:0 0 26px 26px;padding:0 clamp(18px,2.3vw,38px);margin:0 0 24px;position:relative;top:auto;box-shadow:0 7px 22px rgba(71,43,60,.035)}
.brand-icon{width:62px;height:62px;border-radius:20px;background:white;box-shadow:0 7px 16px #e4a2b32d}
.brand-icon .icon{width:34px;height:34px}
.brand-main{font-size:clamp(23px,2vw,32px);line-height:1.1}
.heart-small{color:#dd7c9b;font-size:.9em}.brand-label{font-size:.58em;color:#8e818c;font-weight:650;vertical-align:middle}
.brand-second{font-size:clamp(12px,1vw,15px);margin-top:7px}
.brand-age{display:inline-block;margin-left:12px;background:#fff;color:#c76083;padding:7px 12px;border-radius:12px;font-weight:750}
.head-actions{gap:10px}.round-btn{width:50px;height:50px;border-radius:15px}
.crumb{margin:4px 0 20px}.section-head{margin:9px 0 17px}.section-head h2{font-size:clamp(19px,1.4vw,24px)}
.tiles{gap:clamp(12px,1.4vw,26px);grid-template-columns:repeat(3,minmax(0,1fr))}
.tile{min-height:clamp(210px,calc((100dvh - 270px)/2),340px);border-radius:clamp(22px,2vw,33px);gap:clamp(8px,1.5vh,15px)}
.tile-icon{width:clamp(88px,8vw,128px);height:clamp(88px,8vw,128px);border-radius:30px}
.tile-icon .icon{width:52%;height:52%}.tile-title{font-size:clamp(20px,1.65vw,28px)}.tile-desc{font-size:clamp(12px,.95vw,16px)}
.footer{margin:20px 0 0}
@media(min-width:1600px){.app{padding-left:4vw;padding-right:4vw}.tile{min-height:clamp(260px,calc((100dvh - 300px)/2),430px)}}
@media(min-width:701px) and (max-width:1024px){.tile{min-height:clamp(195px,25vh,275px)}.tile-icon{width:86px;height:86px}.tile-title{font-size:20px}}
@media(max-width:700px){.app{padding:0 13px 101px}.topbar{height:86px;padding:0 13px;margin:0 0 18px;border-radius:0 0 19px 19px}.brand-icon{width:49px;height:49px;border-radius:15px}.brand-icon .icon{width:28px;height:28px}.brand{gap:9px}.brand-main{font-size:22px}.brand-second{font-size:11px;margin-top:5px}.brand-age{font-size:10px;margin-left:5px;padding:4px 6px}.round-btn{width:42px;height:42px}.section-head{margin:7px 0 14px}.tiles{gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.tile{min-height:clamp(166px,24vh,235px);border-radius:22px;gap:8px;padding:13px 8px}.tile-icon{width:clamp(66px,18vw,91px);height:clamp(66px,18vw,91px);border-radius:22px}.tile-title{font-size:clamp(16px,4.3vw,20px)}.tile-desc{font-size:11px}.footer{margin-top:17px}.crumb{margin:3px 0 14px}}
@media(max-width:375px){.brand-label{display:none}.brand-age{display:block;width:max-content;margin:4px 0 0}.brand-second{font-size:10px}.brand-icon{width:43px;height:43px}.tile{min-height:158px}}

/* V3 — Full-bleed, two distinct color regions; six standalone colored tiles. */
:root{--bg:#f9f9fb;--shadow:0 10px 26px rgba(71,43,60,.045)}
.app{max-width:none;width:100%;margin:0;padding:0 0 42px;min-height:100dvh;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;width:100%;min-height:112px;height:auto;padding:19px clamp(18px,3.1vw,58px);margin:0;border:0;border-bottom:1px solid #f0dde7;background:linear-gradient(112deg,#fff1f5 0%,#fff9fc 48%,#eef7f5 100%);box-shadow:0 6px 24px rgba(105,77,92,.055);backdrop-filter:blur(18px)}
.brand-icon{width:63px;height:63px;border-radius:20px;background:linear-gradient(145deg,#fbe0e9,#f7ebef);box-shadow:0 6px 16px rgba(223,127,156,.10)}
.brand-icon .icon{width:34px;height:34px}.brand-main{font-size:clamp(23px,2vw,29px)}.brand-second{font-size:clamp(12px,1vw,14px);margin-top:4px}.round-btn{width:48px;height:48px;border-radius:15px;background:#ffffffd9}
#content{flex:1;width:100%;padding:clamp(18px,2.6vw,45px) clamp(15px,3.1vw,58px)}
.crumb{margin:0 0 22px;padding:18px clamp(15px,3.1vw,58px) 0}
.crumb.hidden{display:none!important}
.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.5vw,27px);min-height:min(680px,calc(100dvh - 205px));grid-auto-rows:minmax(210px,1fr)}
.tile{border:1px solid transparent;border-radius:clamp(20px,2vw,30px);padding:25px 12px 24px;box-shadow:0 10px 27px rgba(78,75,94,.055);gap:12px}
.tile.tone1{background:#fdebf0;color:#ce6585;border-color:#f5dce4}
.tile.tone2{background:#eaf0fe;color:#6c85c1;border-color:#dfe7f8}
.tile.tone3{background:#fff0dc;color:#c58f3e;border-color:#f8e5c8}
.tile.tone4{background:#e4f4ea;color:#579976;border-color:#d6ebdf}
.tile.tone5{background:#f0eafb;color:#8c70bb;border-color:#e9e0f8}
.tile.tone6{background:#e4f3f9;color:#5999b6;border-color:#d8ebf4}
.tile:hover{border-color:currentColor;box-shadow:0 16px 35px rgba(62,56,75,.10)}
.tile-icon{background:rgba(255,255,255,.67);width:clamp(88px,8vw,120px);height:clamp(88px,8vw,120px);border-radius:32px;margin-bottom:7px}
.tile-icon .icon{width:clamp(47px,4vw,64px);height:clamp(47px,4vw,64px);stroke-width:1.75}
.tile-title{color:#342f38;font-size:clamp(21px,1.7vw,28px)}
.tile-desc{color:#766f79;font-size:clamp(13px,1vw,16px)}
.footer{margin:0;padding:10px 0 25px}
@media(min-width:1450px){.tiles{min-height:calc(100dvh - 205px)}}
@media(min-width:701px) and (max-width:1050px){.tiles{grid-auto-rows:minmax(180px,1fr)}}
@media(max-width:700px){.app{padding:0 0 88px}.topbar{min-height:82px;padding:13px 16px}.brand-icon{width:46px;height:46px;border-radius:15px}.brand-icon .icon{width:27px;height:27px}.brand-main{font-size:19px}.brand-second{font-size:11px}.round-btn{width:42px;height:42px}#content{padding:16px 14px 20px}.crumb{padding:12px 14px 0;margin:0 0 5px}.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-height:calc(100dvh - 195px);grid-auto-rows:minmax(155px,1fr)}.tile{min-height:155px;padding:13px 7px;gap:7px;border-radius:23px}.tile-icon{width:74px;height:74px;border-radius:23px;margin-bottom:1px}.tile-icon .icon{width:39px;height:39px}.tile-title{font-size:18px}.tile-desc{font-size:11px}.footer{display:none}}
@media(max-width:365px){.brand-main{font-size:17px}.tiles{gap:9px}.tile{min-height:143px}.tile-icon{width:66px;height:66px}.tile-title{font-size:16px}}
@media(prefers-reduced-motion:reduce){.tile,.main-pane{transition:none;animation:none}}

/* Mint Design System v4: shared typography, motion, overlays, status and tools */
:root{--motion-fast:180ms;--motion-medium:380ms;--motion-slow:620ms;--ease-gentle:cubic-bezier(.22,1,.36,1);--focus:#d96b93}
body{font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-optical-sizing:auto}
button{touch-action:manipulation}button:focus-visible{outline:3px solid var(--focus);outline-offset:3px}
.topbar{z-index:24}.brand-age{margin:0;padding:7px 12px;font-size:clamp(12px,1vw,15px)}.brand-second{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.status-chip{border-radius:100px;border:1px solid #cce9de;color:#427f67;background:#e7f6ef;font-size:12px;font-weight:750;padding:7px 11px}
.status-chip[data-status="sleep"]{background:#edf0ff;border-color:#dadff8;color:#7582bc}
.status-chip[data-status="unwell"]{background:#fff0e0;border-color:#f6ddbb;color:#ad7935}
.status-chip[data-status="feeding"]{background:#fcebf2;border-color:#f2d8e1;color:#b55f82}
.tile{will-change:transform;transition:transform var(--motion-medium) var(--ease-gentle),box-shadow var(--motion-medium) ease,filter var(--motion-medium) ease}
.tile:hover{transform:translateY(-6px)}.tile:active{transform:scale(.975)}
.tile-icon{transition:transform var(--motion-medium) var(--ease-gentle)}.tile:hover .tile-icon{transform:translateY(-4px) rotate(-3deg)}
.motion-rise{animation:mintRise var(--motion-slow) var(--ease-gentle) both}.motion-left{animation:mintLeft var(--motion-slow) var(--ease-gentle) both}.motion-right{animation:mintRight var(--motion-slow) var(--ease-gentle) both}.motion-fade{animation:mintFade var(--motion-medium) ease both}.motion-pop{animation:mintPop var(--motion-medium) var(--ease-gentle) both}.motion-exit{animation:mintFadeOut var(--motion-fast) ease both}
@keyframes mintRise{from{opacity:0;transform:translate3d(0,24px,0)}to{opacity:1;transform:none}}
@keyframes mintLeft{from{opacity:0;transform:translate3d(-24px,0,0)}to{opacity:1;transform:none}}
@keyframes mintRight{from{opacity:0;transform:translate3d(24px,0,0)}to{opacity:1;transform:none}}
@keyframes mintFade{from{opacity:0}to{opacity:1}}
@keyframes mintFadeOut{from{opacity:1}to{opacity:0}}
@keyframes mintPop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
.tile.motion-rise{animation-delay:calc(var(--order,0)*65ms)}.main-pane{animation:mintFade var(--motion-medium) ease both}
.panel,.child,.stat-card{transition:box-shadow .25s ease,transform .25s var(--ease-gentle)}.child:active{transform:scale(.985)}
.toolbox-title{font-size:clamp(24px,2.4vw,32px);margin:4px 0 18px;letter-spacing:-.7px}.tool-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.tool-card{background:#fff;border:1px solid var(--border);border-radius:24px;padding:23px;min-width:0}.tool-card h2{font-size:18px;margin:0 0 16px}.tool-card p{font-size:13px;line-height:1.65;color:var(--muted)}.tool-card.wide{grid-column:1 / -1}
.tool-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.tool-btn{border:1px solid var(--border);border-radius:13px;background:#fff;padding:11px 14px;font-size:13px;font-weight:750;color:#574c59}.tool-btn:hover{border-color:#e3a5bb;background:#fff8fb}.tool-btn:active{transform:scale(.97)}
.tool-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.tool-field{display:flex;flex-direction:column;gap:7px;font-size:13px;color:#756b75}.tool-field input,.tool-field select{min-width:0;width:100%;border:1px solid #e6dfe4;border-radius:13px;padding:13px;background:white;color:#342f38;font-size:16px}
.preview-spot{background:#fcf7fa;border:1px dashed #e6c6d4;border-radius:16px;min-height:95px;margin-top:12px;display:grid;place-items:center}.preview-bubble{display:grid;place-items:center;background:#f7e3eb;color:#cb6487;border-radius:15px;width:70px;height:70px}.preview-bubble .icon{height:36px;width:36px}
.clock{font-variant-numeric:tabular-nums;font-feature-settings:'tnum';font-size:clamp(38px,5vw,58px);font-weight:820;letter-spacing:-1.9px;margin:13px 0}.tiny-note{font-size:12px;color:#968a95}.status-choices{display:flex;gap:10px;flex-wrap:wrap}.status-option{padding:12px 15px;border:1px solid #e7dfe5;border-radius:14px;background:white;font-size:13px;font-weight:700}.status-option[aria-pressed="true"]{border-color:#db83a3;background:#fff0f5;color:#b54c70}
.modal-layer{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px}.modal-scrim{position:absolute;inset:0;background:#2c233385;backdrop-filter:blur(5px);animation:mintFade var(--motion-medium)}.modal-card{position:relative;z-index:1;width:min(100%,470px);background:#fff;border-radius:26px;box-shadow:0 30px 80px #26162135;padding:24px;animation:mintPop var(--motion-medium) var(--ease-gentle)}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:10px}.modal-header h2{font-size:20px;margin:0}.modal-card p{line-height:1.7;color:#655a65;font-size:14px}.modal-actions{display:flex;justify-content:flex-end;margin-top:18px}.toast{box-shadow:0 12px 30px #33253b2b;animation:mintRise .34s var(--ease-gentle)}.toast.hidden,.modal-layer.hidden{display:none!important}
@media(max-width:700px){.brand-age{font-size:12px;padding:6px 9px}.status-chip{font-size:10px;padding:6px 8px}.topbar{padding:10px 13px}.head-actions{gap:5px}.round-btn{width:39px;height:39px}.tool-layout{grid-template-columns:1fr}.tool-card.wide{grid-column:auto}.tool-form{grid-template-columns:1fr}.tool-card{padding:17px}.status-chip{max-width:95px;white-space:nowrap}.clock{font-size:44px}}
@media(max-width:355px){.brand-label{display:none}.brand-second{gap:4px}.brand-icon{width:39px;height:39px}.brand{gap:6px}.brand-main{font-size:18px}.head-actions .desktop-only{display:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}}
/* Mint V5: exactly two visible home regions — unified header and six standalone touch targets */
.app{padding-bottom:0}
#content{padding:clamp(12px,2vw,30px) clamp(12px,2.8vw,52px) clamp(14px,2vw,30px)}
.topbar{min-height:clamp(96px,12vh,134px);padding:16px clamp(14px,2.8vw,52px);border-radius:0}
.brand{gap:clamp(12px,1.6vw,23px)}
.brand-icon{width:clamp(61px,5.1vw,82px);height:clamp(61px,5.1vw,82px);border-radius:23px}
.brand-icon .icon{width:52%;height:52%}
.brand-main{font-size:clamp(25px,2.15vw,36px)}
.brand-age{font-size:clamp(21px,1.65vw,30px);line-height:1.2;background:transparent;padding:0;color:#b74c77;margin:5px 0 0;font-weight:850;letter-spacing:-.4px}
.brand-second{margin-top:0}
.round-btn{min-width:52px;min-height:52px;width:52px;height:52px}
.round-btn .icon{width:26px;height:26px}
.tiles{gap:clamp(12px,1.65vw,28px);min-height:calc(100dvh - 178px);grid-auto-rows:minmax(200px,1fr)}
.tile{padding:clamp(18px,2vw,30px) 10px;gap:clamp(11px,1.5vh,19px);border-radius:clamp(22px,2vw,32px)}
.tile-icon{width:clamp(100px,8.6vw,150px);height:clamp(100px,8.6vw,150px);border-radius:clamp(25px,2.2vw,37px);margin-bottom:0}
.tile-icon .icon{width:55%;height:55%;stroke-width:1.8}
.tile-title{font-size:clamp(24px,2.1vw,34px);font-weight:850;line-height:1.15}
.tile-desc{font-size:clamp(15px,1.13vw,19px);font-weight:500;line-height:1.35}
.bottom-nav,.footer{display:none!important}
@media(max-width:700px){
 .app{padding-bottom:0}
 .topbar{min-height:94px;padding:12px 13px;gap:8px}
 .brand{gap:9px;min-width:0}
 .brand-icon{width:53px;height:53px;min-width:53px;border-radius:16px}
 .brand-main{font-size:clamp(20px,5.4vw,25px)}
 .brand-label{font-size:.6em}
 .brand-age{font-size:clamp(19px,4.8vw,23px);margin-top:5px;padding:0}
 .head-actions{gap:5px}
 .head-actions .desktop-only{display:grid}
 .round-btn{width:43px;min-width:43px;height:47px;min-height:47px;border-radius:13px}
 .round-btn .icon{width:23px;height:23px}
 #content{padding:13px 12px 20px}
 .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;min-height:calc(100dvh - 124px);grid-auto-rows:minmax(160px,1fr)}
 .tile{min-height:160px;padding:15px 7px;gap:9px;border-radius:22px}
 .tile-icon{width:clamp(74px,18vw,104px);height:clamp(74px,18vw,104px);border-radius:24px}
 .tile-icon .icon{width:56%;height:56%}
 .tile-title{font-size:clamp(19px,5vw,25px)}
 .tile-desc{font-size:clamp(12px,3vw,15px)}
}
@media(max-width:410px){.head-actions .desktop-only{display:none}.round-btn{width:45px;min-width:45px}.brand-main{font-size:21px}}
@media(max-width:355px){.brand-label{display:inline}.brand-age{font-size:18px}.tile-title{font-size:19px}}

/* Mint V6: unified single-line identity, rotating photo avatar, no extra home sections */
.brand-copy{min-width:0;flex:1}
.brand-line{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(10px,1.8vw,26px)}
.brand-main{white-space:nowrap;font-size:clamp(26px,2.25vw,39px);line-height:1.18}
.brand-age{display:inline-flex;align-items:center;gap:9px;white-space:nowrap;margin:0!important;padding:9px 16px!important;border-radius:16px;font-size:clamp(21px,1.8vw,30px);font-weight:850;background:rgba(255,255,255,.77)!important;color:#bb527a;box-shadow:0 3px 13px rgba(191,88,124,.07);font-variant-numeric:tabular-nums}
.brand-age .age-clock{width:clamp(23px,1.85vw,30px);height:clamp(23px,1.85vw,30px);stroke-width:2.1;color:#d7799a}
.brand-icon.photo-avatar{position:relative;overflow:hidden;isolation:isolate;border:2px solid rgba(255,255,255,.9);box-shadow:0 6px 22px #d98eaa38;flex:none}
.photo-avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease,transform 7s ease;transform:scale(1.03)}
.photo-avatar img.visible{opacity:1;transform:scale(1)}
.photo-avatar .avatar-placeholder{transition:opacity .4s ease}
.photo-avatar.has-photo .avatar-placeholder{opacity:0}
.photo-upload{display:inline-flex;align-items:center;justify-content:center;background:#fff0f4;color:#c65a80;border:1px solid #f2d8e1;border-radius:14px;padding:13px 17px;font-weight:750;cursor:pointer;min-height:48px}
.photo-gallery{display:flex;flex-wrap:wrap;gap:12px;margin-top:14px;min-height:40px}
.photo-item{width:98px;position:relative}
.photo-item img{display:block;width:98px;height:98px;object-fit:cover;border-radius:17px;border:1px solid #f1e1e7;background:#fff}
.photo-item button{position:absolute;right:-7px;top:-7px;width:27px;height:27px;border:0;border-radius:50%;background:#583c4a;color:white;font-size:18px;line-height:1}
.photo-hint{font-size:12px;color:var(--muted)}
@media(max-width:700px){
 .topbar{min-height:94px;height:auto;padding:11px 12px}
 .brand{flex:1;min-width:0}
 .brand-line{gap:7px 12px}
 .brand-main{font-size:clamp(21px,5.6vw,27px)}
 .brand-label{font-size:.57em}
 .brand-age{font-size:clamp(17px,4.6vw,23px);padding:6px 9px!important;gap:5px;border-radius:11px}
 .brand-age .age-clock{width:19px;height:19px}
 .photo-avatar{width:56px!important;height:56px!important;min-width:56px!important;border-radius:18px!important}
 .head-actions{gap:4px}
 .round-btn{width:42px;min-width:42px;height:44px;min-height:44px}
}
@media(max-width:480px){.head-actions .desktop-only{display:none}.brand-line{flex-wrap:nowrap}.brand-main{font-size:clamp(17px,4.7vw,23px)}.brand-age{font-size:clamp(15px,4vw,19px);padding:6px 7px!important}.photo-avatar{width:48px!important;height:48px!important;min-width:48px!important;border-radius:15px!important}.brand{gap:7px}.head-actions{gap:3px}.round-btn{width:39px;min-width:39px;height:42px;min-height:42px}.round-btn .icon{width:21px;height:21px}}
@media(max-width:355px){.brand-label{display:none}.brand-age{font-size:15px}.brand-age .age-clock{width:16px;height:16px}}
@media(prefers-reduced-motion:reduce){.photo-avatar img{transition:none;transform:none}}

/* V7: one-touch independent modules, same design language in every view */
.tiles{min-height:0!important;grid-auto-rows:auto!important;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start}
.tile{min-height:clamp(220px,32vh,315px);padding:clamp(17px,2vw,30px) 8px}
.tile-icon{width:clamp(82px,8vw,132px);height:clamp(82px,8vw,132px)}
.tile-title{font-size:clamp(21px,2vw,32px)}
.tile-desc{font-size:clamp(12px,1.1vw,16px)}
.tile.tone7{background:#fff1e9;color:#b98264;border-color:#f7e0d1}
.tile.tone8{background:#e6f3f1;color:#538e8b;border-color:#d4e9e5}
.tile.tone9{background:#fff1dd;color:#ad8a4c;border-color:#f2e3cb}
.tile.tone10{background:#ebecfc;color:#7775b8;border-color:#dedff7}
.tile.tone11{background:#f9e9f5;color:#b176a5;border-color:#efdcef}
.tile.tone12{background:#eaf4e8;color:#6e986c;border-color:#dcebd9}
.module-shell{display:grid;gap:18px}
.module-heading{display:flex;gap:15px;align-items:center;min-width:0}
.module-heading h1{margin:0;font-size:clamp(26px,2.6vw,38px);letter-spacing:-1px}
.module-heading p{margin:5px 0 0;color:var(--muted);font-size:clamp(14px,1.1vw,17px)}
.module-heading .tile-icon{width:78px;height:78px;flex:none;border-radius:22px;margin:0}
.module-heading .tile-icon .icon{width:43px;height:43px}
.module-top{display:flex;align-items:center;gap:12px;justify-content:space-between}
.module-top .back{flex:none}
.module-body{display:grid;grid-template-columns:1fr 1fr;gap:17px}
.module-body .panel{margin:0;min-width:0}
.module-body .panel.fullrow{grid-column:1/-1}
.module-body .primary{min-height:52px}
.pref-card{background:#fff;border:1px solid var(--border);border-radius:18px;padding:14px}
.pref-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pref-desc{color:var(--muted);font-size:13px;margin:5px 0 0}
.pref-list{display:grid;gap:9px;margin-top:15px}
.pref-item{display:flex;align-items:center;gap:10px;border:1px solid #f0e5eb;border-radius:14px;padding:8px 10px;background:#fff;min-height:62px}
.pref-item .mini-icon{display:grid;place-items:center;border-radius:12px;background:#fbedf2;color:#be678a;width:40px;height:40px;flex:none}
.pref-item .mini-icon .icon{width:23px;height:23px}
.pref-item-title{flex:1;min-width:0;font-size:15px;font-weight:700}
.pref-item small{display:block;font-weight:400;color:var(--muted);margin-top:2px}
.pref-arrow{border:1px solid var(--border);border-radius:11px;width:43px;height:43px;background:#fff;color:#796d78;font-size:21px;font-weight:bold;touch-action:manipulation}
.pref-arrow:disabled{opacity:.28}
.pref-visible{display:flex;align-items:center;gap:5px;padding:5px 7px;font-size:13px;white-space:nowrap}
.pref-visible input{width:20px;height:20px;accent-color:#d86f96}
.mode-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.mode-switch button{border:1px solid var(--border);background:#fff;padding:15px 10px;border-radius:15px;font-size:15px;font-weight:800;min-height:55px;color:var(--ink)}
.mode-switch button.selected{border-color:#df88a7;background:#fff0f6;color:#bb537b}
@media(max-width:700px){
  .tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;min-height:0!important;grid-auto-rows:auto!important}
  .tile{min-width:0;min-height:clamp(157px,24vh,205px);padding:13px 3px;gap:9px;border-radius:17px}
  .tile-icon{width:clamp(53px,15vw,82px);height:clamp(53px,15vw,82px);border-radius:19px}
  .tile-icon .icon{width:55%;height:55%}
  .tile-title{font-size:clamp(14px,4vw,20px);letter-spacing:-.3px;overflow-wrap:anywhere}
  .tile-desc{font-size:clamp(10px,2.8vw,12px);line-height:1.2;padding:0 2px}
  .module-body{grid-template-columns:1fr}
  .module-body .panel.fullrow{grid-column:auto}
  .module-heading .tile-icon{width:63px;height:63px;border-radius:18px}
  .module-heading .tile-icon .icon{width:34px;height:34px}
  .pref-item{gap:7px;padding:7px 5px}
  .pref-item-title{font-size:13px}
  .pref-item small{font-size:11px}
  .pref-arrow{width:36px;height:40px}
  .pref-visible{font-size:12px;gap:3px;padding:3px}
}
@media(max-width:380px){.tile{min-height:148px}.tile-icon{width:51px;height:51px}.tile-title{font-size:13.5px}.tile-desc{font-size:10px}}

/* V8: three large cards per viewport row; header remains sticky. */
:root{--mint-header-height:96px;--mint-home-gutter:30px}
.topbar{position:sticky;top:0;z-index:50}
.tiles{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-auto-rows:calc(100svh - var(--mint-header-height) - var(--mint-home-gutter))!important;gap:clamp(12px,1.4vw,26px)!important;min-height:0!important;align-content:start}
.tiles>.tile{height:100%;min-height:0!important;max-height:none!important;padding:clamp(12px,2vw,38px)!important;gap:clamp(12px,2vh,26px)!important;border-radius:clamp(20px,2.5vw,35px)}
.tiles .tile-icon{width:clamp(104px,11vw,185px)!important;height:clamp(104px,11vw,185px)!important;border-radius:clamp(26px,3vw,45px)}
.tiles .tile-icon .icon{width:55%!important;height:55%!important}
.tiles .tile-title{font-size:clamp(26px,2.6vw,43px)!important;line-height:1.14;text-align:center}
.tiles .tile-desc{font-size:clamp(15px,1.3vw,21px)!important;text-align:center}
@media(max-width:700px){
 :root{--mint-header-height:90px;--mint-home-gutter:20px}
 .tiles{gap:9px!important}
 .tiles>.tile{padding:10px 4px!important;gap:clamp(14px,3vh,24px)!important;border-radius:20px}
 .tiles .tile-icon{width:clamp(67px,20vw,110px)!important;height:clamp(67px,20vw,110px)!important;border-radius:23px}
 .tiles .tile-title{font-size:clamp(16px,4.5vw,25px)!important;overflow-wrap:anywhere}
 .tiles .tile-desc{font-size:clamp(12px,3vw,16px)!important;line-height:1.35}
}
@media(max-width:380px){.tiles .tile-icon{width:clamp(59px,18vw,76px)!important;height:clamp(59px,18vw,76px)!important}.tiles .tile-title{font-size:clamp(15px,4vw,19px)!important}}
@media(max-height:520px) and (orientation:landscape){.tiles{grid-auto-rows:minmax(260px,calc(100svh - var(--mint-header-height)))!important}.tiles .tile-icon{width:88px!important;height:88px!important}}


/* Mint V10 — Baby Cute motion with smart scroll rows. */
html.mint-home-snap{scroll-snap-type:y mandatory;scroll-padding-top:var(--mint-header-real, 96px)}
html.mint-home-snap .tiles>.tile:nth-child(3n + 1){scroll-snap-align:start;scroll-snap-stop:always}
html.mint-home-snap .tiles{grid-auto-rows:calc(100dvh - var(--mint-header-real, 96px) - var(--mint-content-top, 13px) - 12px)!important;row-gap:var(--mint-row-gap, 14px)!important}
html.mint-home-snap .tiles>.tile{position:relative;isolation:isolate;overflow:hidden;contain:paint;transform-origin:50% 84%;transition:transform .22s ease,box-shadow .26s ease,border-color .26s ease}
html.mint-home-snap .tiles>.tile::before{content:"";position:absolute;inset:-10% -12%;z-index:-2;pointer-events:none;opacity:0;background:radial-gradient(circle at 22% 18%,rgba(255,255,255,.82),transparent 22%),radial-gradient(circle at 80% 18%,rgba(255,255,255,.55),transparent 18%),radial-gradient(circle at 50% 78%,rgba(255,255,255,.3),transparent 26%);filter:blur(3px);transform:translateY(10px) scale(.96);transition:opacity .45s ease,transform .55s ease}
html.mint-home-snap .tiles>.tile::after{content:"✦";position:absolute;right:14%;top:14%;font-size:clamp(15px,1.3vw,20px);line-height:1;color:rgba(255,255,255,.95);text-shadow:0 0 12px rgba(255,255,255,.4);opacity:0;transform:scale(.6);pointer-events:none}
html.mint-home-snap .tiles>.tile.is-visible{animation:mintCuteReveal .62s cubic-bezier(.2,.8,.22,1) both;animation-delay:calc(var(--wave-index,0)*.09s)}
html.mint-home-snap .tiles>.tile.is-visible::before{opacity:1;transform:none;animation:mintCuteGlow 5.8s ease-in-out infinite alternate}
html.mint-home-snap .tiles>.tile.is-visible::after{opacity:.95;animation:mintCuteTwinkle 2.7s ease-in-out infinite;animation-delay:calc(var(--wave-index,0)*.28s)}
html.mint-home-snap .tiles>.tile.is-visible .tile-icon{animation:mintCuteBounce 3.45s ease-in-out infinite;animation-delay:calc(var(--wave-index,0)*.22s)}
html.mint-home-snap .tiles>.tile.is-visible .tile-icon .icon{animation:mintCuteSway 4.5s ease-in-out infinite;animation-delay:calc(var(--wave-index,0)*.18s)}
html.mint-home-snap .tiles>.tile:nth-child(3n + 2).is-visible .tile-icon{animation-name:mintCuteFloat}
html.mint-home-snap .tiles>.tile:nth-child(3n).is-visible .tile-icon{animation-name:mintCutePulse}
html.mint-home-snap .tiles>.tile:nth-child(3n).is-visible .tile-icon .icon{animation-name:mintCuteBlink}
html.mint-home-snap .tiles>.tile:active{transform:scale(.982)!important}
@keyframes mintCuteReveal{0%{opacity:.01;transform:translateY(24px) scale(.97)}65%{opacity:1;transform:translateY(-4px) scale(1.006)}100%{opacity:1;transform:none}}
@keyframes mintCuteGlow{0%{transform:translate3d(-2%,1.2%,0) scale(.985)}100%{transform:translate3d(2%,-1.2%,0) scale(1.02)}}
@keyframes mintCuteBounce{0%,100%{translate:0 0}18%{translate:0 -5px}34%{translate:0 0}52%{translate:0 -2px}70%{translate:0 0}}
@keyframes mintCuteFloat{0%,100%{translate:0 0}30%{translate:0 -4px}58%{translate:0 2px}80%{translate:0 -1px}}
@keyframes mintCutePulse{0%,100%{transform:scale(1)}22%{transform:scale(1.045)}36%{transform:scale(1)}52%{transform:scale(1.03)}70%{transform:scale(1)}}
@keyframes mintCuteSway{0%,100%{rotate:0deg}25%{rotate:1.7deg}55%{rotate:-1.6deg}78%{rotate:.8deg}}
@keyframes mintCuteBlink{0%,100%{opacity:1}45%{opacity:.92}58%{opacity:1}75%{opacity:.88}}
@keyframes mintCuteTwinkle{0%,100%{opacity:.18;transform:scale(.6) rotate(0deg)}28%{opacity:.88;transform:scale(1.06) rotate(10deg)}55%{opacity:.5;transform:scale(.82) rotate(-8deg)}}
@media(hover:hover){html.mint-home-snap .tiles>.tile:hover{transform:translateY(-3px)}html.mint-home-snap .tiles>.tile:hover .tile-icon{animation-play-state:paused}}
@media(prefers-reduced-motion:reduce){html.mint-home-snap{scroll-snap-type:none}html.mint-home-snap .tiles>.tile.is-visible,html.mint-home-snap .tiles>.tile.is-visible::before,html.mint-home-snap .tiles>.tile.is-visible::after,html.mint-home-snap .tiles>.tile.is-visible .tile-icon,html.mint-home-snap .tiles>.tile.is-visible .tile-icon .icon{animation:none!important;transition:none!important}}