@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700;800&family=Vazirmatn:wght@400;500;600;700;800&display=swap');
:root{font-family:Manrope,"DM Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#27294a;background:#f8f9fe;font-synthesis:none;text-rendering:optimizeLegibility;--bg:#f8f9fe;--surface:#fff;--surface2:#f4f5fb;--text:#28294d;--muted:#8990ab;--line:#eef0f7;--purple:#7759ed;--purpleDark:#5c43ce;--pink:#ff73a8;--coral:#ff8d79;--mint:#32cdaa;--blue:#66a4fc;--yellow:#ffbc57;--shadow:0 16px 42px rgba(46,51,114,.055)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{opacity:.48;cursor:not-allowed}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #9c8bff;outline-offset:3px}
a{color:inherit;text-decoration:none}
.app-shell{min-height:100vh;display:grid;grid-template-columns:250px minmax(0,1fr);max-width:1800px;margin:0 auto}
.sidebar{height:100vh;position:sticky;top:0;background:var(--surface);border-right:1px solid var(--line);padding:29px 17px 22px;display:flex;flex-direction:column;gap:30px;z-index:4}
.brand{display:flex;align-items:center;gap:11px;padding:2px 11px;font-size:20px;font-weight:800;letter-spacing:-1px}
.brand-mark{width:40px;height:40px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(140deg,#ed76b5,#a084fa 70%,#64baff);color:white;box-shadow:0 7px 18px #b89bf94d;font-size:22px;flex-shrink:0}
.brand em{color:var(--purple);font-style:normal}
.nav-group{display:grid;gap:6px}.nav-caption{padding:0 15px;color:#abb0c3;font-weight:800;font-size:10px;letter-spacing:2px;margin:4px 0 8px}
.nav-item{border:0;background:transparent;color:#8186a0;display:flex;align-items:center;gap:13px;padding:13px 15px;border-radius:14px;font-size:13px;font-weight:750;text-align:start;width:100%;transition:.2s}
.nav-item svg{width:19px;height:19px;stroke-width:2}.nav-item:hover{background:#f5f3ff;color:var(--purple)}.nav-item.active{background:#f0ecff;color:var(--purple);box-shadow:inset 3px 0 var(--purple)}
.nav-item .nav-dot{margin-inline-start:auto;width:6px;height:6px;background:var(--pink);border-radius:50%}
.sidebar-bottom{margin-top:auto;display:grid;gap:16px}
.side-banner{position:relative;overflow:hidden;background:linear-gradient(135deg,#e7e0ff,#f9deee);padding:21px;border-radius:22px;min-height:170px}
.side-banner::after{content:"✦";position:absolute;font-size:92px;color:#ffffff9c;inset:auto -1px -25px auto;transform:rotate(-17deg)}
.side-banner p{margin:0 0 4px;font-size:15px;font-weight:800;position:relative;z-index:1}.side-banner small{font-size:11px;line-height:1.6;color:#756889;display:block;max-width:160px;position:relative;z-index:1}
.side-banner button{margin-top:15px;background:white;color:var(--purple);border:0;border-radius:11px;padding:9px 14px;font-weight:800;font-size:11px;position:relative;z-index:1}
.workspace{min-width:0}.topbar{height:87px;display:flex;justify-content:space-between;align-items:center;padding:0 clamp(24px,3.5vw,62px);border-bottom:1px solid var(--line);background:var(--surface);position:sticky;top:0;z-index:3;gap:20px}
.topbar-left{display:flex;align-items:center;gap:12px}.topbar-label{display:block;color:var(--muted);font-size:11px;font-weight:750;letter-spacing:.2px}.topbar-title{font-size:15px;font-weight:850;margin:3px 0 0}
.topbar-actions{display:flex;align-items:center;gap:11px}.pill-date{color:#8d93ac;font-size:12px;font-weight:750;background:var(--surface2);border-radius:13px;padding:12px 15px;white-space:nowrap}
.avatar{width:43px;height:43px;flex-shrink:0;display:grid;place-items:center;border-radius:14px;background:linear-gradient(140deg,#ffd1e4,#b6adff);color:#6757ae;font-size:15px;font-weight:900;box-shadow:inset 0 0 0 2px #fff7;border:0}
.icon-button{border:1px solid var(--line);width:40px;height:40px;background:var(--surface);color:var(--text);border-radius:13px;display:grid;place-items:center}.icon-button svg{width:18px;height:18px}
.main-content{width:100%;padding:36px clamp(24px,3.5vw,62px) 65px;max-width:1550px;margin:auto}
.boot-screen{min-height:60vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--muted)}.boot-heart{color:var(--pink);font-size:60px}.boot-screen h1{color:var(--text);margin:8px 0}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:24px}.page-head h1{margin:0 0 8px;font-size:clamp(25px,2.5vw,35px);letter-spacing:-1.3px;line-height:1.25;font-weight:850}.page-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}.eyebrow{color:var(--purple);text-transform:uppercase;font-weight:850;font-size:10px;letter-spacing:2px;display:block;margin-bottom:10px}
.btn{border:0;border-radius:13px;padding:12px 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;font-weight:850;white-space:nowrap;transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px)}.btn svg{width:17px;height:17px}
.btn-primary{color:white;background:linear-gradient(115deg,#8767f9,#6f55e4);box-shadow:0 8px 17px #7655eb33}.btn-light{color:var(--purple);background:#f0edff}.btn-ghost{background:var(--surface2);color:var(--text)}.btn-pink{background:#ffe9f2;color:#d74488}.btn-danger{background:#fff0f0;color:#d8526c}.btn-white{background:#fff;color:#6450b9}.btn-sm{padding:9px 12px;border-radius:10px;font-size:11px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:23px;padding:23px;box-shadow:var(--shadow);min-width:0}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.card-title{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:850;letter-spacing:-.35px;margin:0}.card-subtitle{font-size:11px;color:var(--muted);line-height:1.5;margin:7px 0 0}.subtle-link{color:var(--purple);border:0;background:none;font-size:11px;font-weight:850}
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}.span-8{grid-column:span 8}.span-7{grid-column:span 7}.span-6{grid-column:span 6}.span-5{grid-column:span 5}.span-4{grid-column:span 4}.span-3{grid-column:span 3}.span-12{grid-column:span 12}
.hero{background:linear-gradient(114deg,#fce6e3 1%,#fae9ed 37%,#e9e6ff 100%);border-radius:26px;min-height:245px;padding:34px 34px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;border:1px solid #ffffffa8}
.hero-copy{position:relative;z-index:1;max-width:425px}.hero .tiny-badge{display:inline-flex;background:#fff9;padding:7px 10px;border-radius:20px;font-size:10px;font-weight:850;color:#da6595;margin-bottom:15px}.hero h1{font-size:clamp(28px,3vw,43px);line-height:1.15;letter-spacing:-1.7px;margin:0 0 10px;max-width:410px}.hero h1 span{color:#8e61d9}.hero p{margin:0 0 21px;color:#7f7899;font-size:12px;line-height:1.7;max-width:330px}.hero-art{flex:0 0 30%;height:190px;position:relative;display:grid;place-items:center}.hero-orb{width:167px;height:167px;border-radius:38% 62% 61% 39%/47% 46% 54% 53%;background:radial-gradient(circle at 25% 18%,#fffefa,#fcbdd7 45%,#ab95fa);filter:drop-shadow(0 15px 22px #aa7bd76b);animation:float 5s ease-in-out infinite;display:grid;place-items:center;font-size:76px;color:white}.hero-art .sparkle{position:absolute;color:white;font-size:34px}.hero-art .s1{top:6px;right:14px}.hero-art .s2{bottom:8px;left:0;font-size:25px}
.section-title{font-size:18px;font-weight:850;letter-spacing:-.6px;margin:30px 0 17px}.metric-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.metric{padding:21px 20px;border-radius:19px;position:relative;overflow:hidden}.metric.pink{background:#fff1f5}.metric.mint{background:#e9faf4}.metric.blue{background:#edf5ff}.metric.yellow{background:#fff8e9}
.metric-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:21px}.metric-label{font-size:12px;color:#74758c;font-weight:750}.metric-icon{font-size:22px}.metric strong{font-size:28px;font-weight:900;letter-spacing:-1.4px}.metric small{font-size:11px;color:#999bad;font-weight:700}.metric-foot{margin-top:7px;color:#8388a2;font-size:11px}.mini-progress{height:6px;border-radius:8px;background:#ffffffbd;margin-top:14px;overflow:hidden}.mini-progress i{display:block;height:100%;border-radius:8px;background:#61d0b4;transition:width .3s}
.mood-picker{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.mood-option{border:1.5px solid transparent;border-radius:17px;padding:13px 6px;background:var(--surface2);color:var(--muted);text-align:center;transition:.2s;min-width:0}.mood-option:hover{transform:translateY(-3px)}.mood-option.selected{border-color:#a38afa;background:#f1ecff;box-shadow:0 7px 20px #ac90ff21}.mood-option .face{display:block;font-size:29px;margin-bottom:6px}.mood-option small{font-weight:850;font-size:10px;display:block}.mood-option.selected small{color:var(--purple)}
.mood-note{margin-top:15px}.mood-note textarea{min-height:64px}
.card-actions{display:flex;gap:9px;align-items:center;justify-content:space-between;margin-top:14px}.helper{color:var(--muted);font-size:10px;line-height:1.6}
.week-chart{height:188px;display:flex;gap:12px;align-items:flex-end;justify-content:space-around;padding-top:15px}.week-day{min-width:0;flex:1;max-width:55px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px}.week-bar-track{flex:1;width:100%;max-width:37px;display:flex;align-items:flex-end;justify-content:center;background:linear-gradient(0deg,#f4f1fc 0%,#faf9fe 100%);border-radius:12px;overflow:hidden;position:relative}.week-bar{width:100%;border-radius:11px 11px 8px 8px;background:linear-gradient(180deg,#b49dff,#755aee);min-height:5px;transition:height .4s}.week-bar.empty{background:#e9e5f1;min-height:4px}.week-emoji{font-size:16px;position:absolute;top:7px}.week-day small{font-size:10px;color:var(--muted);font-weight:800}.week-day.today small{color:var(--purple)}
.joy-tags{display:flex;flex-wrap:wrap;gap:8px}.joy-tag{border:1px solid var(--line);background:var(--surface2);border-radius:13px;padding:10px 12px;font-size:11px;font-weight:800;display:inline-flex;align-items:center;gap:7px}.joy-tag b{font-size:16px}
.quote-card{background:linear-gradient(130deg,#eef7fe,#eef0ff 70%,#f8efff);display:flex;flex-direction:column;justify-content:space-between;min-height:207px;border:0}.quote-card .quote-symbol{font-size:36px;color:#ad99f0;line-height:1}.quote-card blockquote{font-size:20px;font-weight:800;letter-spacing:-.7px;line-height:1.4;margin:8px 0}.quote-card small{color:#8d93b0;font-weight:800;font-size:11px}
.prompt-card{background:linear-gradient(130deg,#f8efff,#fff4e9);border:0}.prompt-icon{font-size:33px;display:block;margin-bottom:13px}.prompt-card h3{font-size:17px;letter-spacing:-.4px;margin:0 0 8px}.prompt-card p{font-size:11px;line-height:1.8;color:#85829d;margin:0 0 17px}
.empty{padding:25px;text-align:center;border:1.5px dashed #dedbf3;border-radius:19px;background:var(--surface2)}.empty .empty-art{display:block;font-size:37px;margin-bottom:8px}.empty strong{display:block;font-size:13px}.empty p{font-size:11px;color:var(--muted);line-height:1.7;margin:7px auto 14px;max-width:310px}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}.field label{font-weight:850;font-size:11px;color:var(--text)}.input,.select,.textarea{width:100%;background:var(--surface);border:1.5px solid #e9e9f4;border-radius:13px;outline:none;padding:12px 14px;color:var(--text);font-size:12px;transition:border .2s}.input:focus,.select:focus,.textarea:focus{border-color:#ad9af9;box-shadow:0 0 0 3px #ad9af91d}.textarea{resize:vertical;min-height:110px;line-height:1.65}.form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.stack{display:grid;gap:16px}.inline-options{display:flex;gap:8px;flex-wrap:wrap}.chip{border:1.5px solid var(--line);border-radius:13px;background:var(--surface);color:var(--muted);padding:11px 14px;font-size:11px;font-weight:850;display:inline-flex;align-items:center;gap:8px}.chip.selected{border-color:#a58aff;color:var(--purple);background:#f5f1ff}.chip .chip-emoji{font-size:18px}
.filter-row{display:flex;align-items:center;justify-content:space-between;gap:15px;flex-wrap:wrap;margin-bottom:20px}.searchbox{position:relative;max-width:310px;flex:1;min-width:190px}.searchbox svg{position:absolute;top:12px;left:13px;width:17px;color:#a7a3bc}.searchbox input{padding-inline-start:41px}
.collection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:15px}.collection-card{background:var(--surface);border:1px solid var(--line);border-radius:21px;padding:15px;position:relative;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:11px;min-height:170px}.collection-thumb{height:88px;border-radius:14px;background:linear-gradient(130deg,#e3e0ff,#fad6e5);display:grid;place-items:center;font-size:40px;overflow:hidden}.collection-thumb img{width:100%;height:100%;object-fit:cover}.collection-card h3{font-size:13px;line-height:1.5;margin:0;overflow-wrap:anywhere}.collection-card p{font-size:11px;line-height:1.55;color:var(--muted);margin:4px 0 0}.collection-card footer{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-top:auto}.micro-label{background:#f1eeff;color:#7b63d4;border-radius:20px;font-size:9px;font-weight:850;padding:6px 9px}.delete-mini{border:0;background:#fff2f6;color:#df789b;border-radius:9px;padding:7px;display:grid;place-items:center}.delete-mini svg{width:14px;height:14px}
.feed-list{display:grid;gap:12px}.feed-item{display:flex;align-items:flex-start;gap:13px;padding:16px;border:1px solid var(--line);background:var(--surface);border-radius:17px;min-width:0}.feed-emoji{display:grid;place-items:center;font-size:25px;width:46px;height:46px;flex-shrink:0;background:var(--surface2);border-radius:14px}.feed-body{flex:1;min-width:0}.feed-body strong{font-size:13px;line-height:1.6;display:block}.feed-body p{margin:6px 0 0;font-size:11px;line-height:1.65;color:var(--muted);overflow-wrap:anywhere}.feed-meta{font-size:10px;color:#a7aabe;margin-top:6px}
.planner-top{background:linear-gradient(115deg,#eae4ff,#f3e5ff 55%,#ffe7ee);padding:26px;border-radius:23px;position:relative;overflow:hidden}.planner-top::after{content:"✳";color:#ffffffa1;font-size:180px;position:absolute;right:12px;top:-37px;pointer-events:none}.planner-top>*{position:relative;z-index:1}.planner-top h2{font-size:27px;letter-spacing:-1.1px;margin:0 0 9px}.planner-top p{max-width:550px;font-size:12px;line-height:1.75;color:#7b729a;margin:0}
.plan-slot{display:flex;gap:15px;padding:17px;border:1px solid var(--line);border-radius:18px;align-items:flex-start;background:var(--surface)}.plan-icon{width:53px;height:53px;flex-shrink:0;border-radius:17px;background:#f2e9ff;display:grid;place-items:center;font-size:25px}.plan-slot h3{font-size:14px;margin:2px 0 7px}.plan-slot p{font-size:11px;line-height:1.65;color:var(--muted);margin:0 0 10px}.plan-time{font-size:10px;font-weight:850;color:var(--purple);background:#f4f0ff;border-radius:8px;padding:6px 9px;display:inline-flex;align-items:center;gap:5px}.plan-check{margin-inline-start:auto;flex-shrink:0}.plan-check input{appearance:none;width:21px;height:21px;border:2px solid #d4d1e7;border-radius:7px;cursor:pointer}.plan-check input:checked{background:var(--mint);border-color:var(--mint)}.plan-check input:checked::after{content:"✓";color:white;display:block;text-align:center;line-height:17px;font-size:13px;font-weight:900}
.timeline{display:grid;gap:12px}.timeline-date{font-weight:850;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:1px;margin:12px 0 2px}
.note-card{padding:21px;border:1px solid var(--line);border-radius:19px;background:var(--surface);position:relative}.note-card h3{font-size:15px;margin:0 0 9px}.note-card p{font-size:12px;color:#717992;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere;margin:0}.note-card footer{margin-top:16px;display:flex;gap:10px;align-items:center;justify-content:space-between}.note-card .note-emoji{font-size:26px;display:block;margin-bottom:10px}.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(195px,1fr));gap:14px}.photo-card{background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:11px;overflow:hidden}.photo-card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;background:#eae7fa}.photo-card h3{font-size:12px;line-height:1.6;margin:9px 4px 0}.photo-card small{font-size:10px;color:var(--muted);margin:4px;display:block}
.wellness-hero{background:linear-gradient(130deg,#dff9ec,#e6faf8,#eff3ff);border:0}.water-row{display:flex;gap:8px;flex-wrap:wrap;padding:15px 0}.water-glass{border:0;background:#edf4ff;border-radius:11px;width:42px;height:50px;font-size:23px;color:#add5ff;transition:.2s}.water-glass.filled{background:#d8eaff;color:#4f9bff}.number-stepper{display:flex;gap:12px;align-items:center}.number-stepper strong{font-size:28px;letter-spacing:-1px;min-width:50px;text-align:center}.number-stepper button{border:0;background:var(--surface2);border-radius:12px;width:40px;height:40px;color:var(--purple);font-size:19px}
.goal-line{width:100%;height:9px;background:#f1f0f7;border-radius:20px;overflow:hidden;margin:12px 0 7px}.goal-line i{display:block;height:100%;background:linear-gradient(90deg,#50d5b0,#61bcf6);border-radius:20px;transition:width .3s}
.range-input{width:100%;accent-color:var(--purple)}.stat-large{font-size:34px;font-weight:900;letter-spacing:-1.6px}.stat-large span{font-size:13px;color:var(--muted);letter-spacing:0}
.settings-card{max-width:770px;margin:0 auto}.settings-section{padding:22px 0;border-bottom:1px solid var(--line)}.settings-section:last-child{border-bottom:0}.settings-section h3{margin:0 0 7px;font-size:15px}.settings-section p{font-size:11px;color:var(--muted);line-height:1.8;max-width:550px;margin:0 0 14px}
.notice{font-size:11px;line-height:1.75;padding:14px 16px;border-radius:13px;background:#f2f0ff;color:#7165ae}.notice.warn{background:#fff5e5;color:#977746}
.modal-backdrop{position:fixed;inset:0;background:#27284870;backdrop-filter:blur(7px);z-index:20;display:grid;place-items:center;padding:17px}.modal{width:min(500px,100%);max-height:min(85dvh,800px);overflow:auto;background:var(--surface);border-radius:25px;padding:25px;box-shadow:0 24px 100px #26234e3a}.modal-head{display:flex;justify-content:space-between;gap:15px;align-items:center;margin-bottom:21px}.modal-head h2{font-size:20px;letter-spacing:-.8px;margin:0}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:21px}
.toast{position:fixed;bottom:26px;right:26px;background:#39335b;color:#fff;border-radius:14px;padding:14px 18px;box-shadow:0 16px 35px #28204f3a;font-size:12px;font-weight:750;z-index:50;max-width:350px;opacity:0;transform:translateY(15px);transition:.25s;pointer-events:none}.toast.visible{opacity:1;transform:translateY(0)}
.mobile-nav{display:none}.mobile-only{display:none}.separator{height:1px;background:var(--line);margin:18px 0}.muted{color:var(--muted)}.text-small{font-size:11px}.text-center{text-align:center}.mb-0{margin-bottom:0}.mt-15{margin-top:15px}.mt-20{margin-top:20px}.mt-28{margin-top:28px}.flex-between{display:flex;justify-content:space-between;align-items:center;gap:12px}.flex-center{display:flex;align-items:center;gap:9px}.flex-wrap{display:flex;flex-wrap:wrap;gap:8px}.w-100{width:100%}
body.dark{--bg:#171827;--surface:#22243a;--surface2:#2a2d43;--text:#f2f0ff;--muted:#a4a6c1;--line:#353750;--shadow:0 15px 45px #090a1736;color:var(--text)}
body.dark .hero{background:linear-gradient(120deg,#473d67,#604665,#393858)}body.dark .hero p,body.dark .planner-top p{color:#d2c8e2}body.dark .planner-top{background:linear-gradient(120deg,#3d3569,#64465c)}body.dark .metric.pink{background:#433047}body.dark .metric.mint{background:#25433f}body.dark .metric.blue{background:#29405a}body.dark .metric.yellow{background:#4f4536}body.dark .metric-label,body.dark .metric-foot{color:#d0cde0}body.dark .nav-item.active,body.dark .nav-item:hover,body.dark .mood-option.selected{background:#3b335e}body.dark .nav-item.active{box-shadow:inset 3px 0 var(--purple)}body.dark .notice{background:#393456;color:#cbbdfd}body.dark .quote-card{background:linear-gradient(120deg,#343d63,#4c355f)}body.dark .prompt-card{background:linear-gradient(120deg,#553950,#4b3d43)}body.dark .hero .tiny-badge{background:#ffffff22;color:#ffd1e6}body.dark .micro-label,body.dark .plan-time{background:#3d345e;color:#c5baff}body.dark .chip.selected{background:#3c3159}body.dark .mood-option.selected{border-color:#ab95ff}body.dark .input,body.dark .select,body.dark .textarea{border-color:#444660}body.dark .delete-mini{background:#493449}
[dir=rtl]{font-family:Vazirmatn,Manrope,sans-serif}[dir=rtl] .sidebar{border-right:0;border-left:1px solid var(--line)}[dir=rtl] .nav-item.active{box-shadow:inset -3px 0 var(--purple)}[dir=rtl] .searchbox svg{left:auto;right:13px}[dir=rtl] .searchbox input{padding-inline-start:41px}[dir=rtl] .hero-art .s1{right:auto;left:14px}[dir=rtl] .hero-art .s2{left:auto;right:0}[dir=rtl] .planner-top::after{right:auto;left:12px}[dir=rtl] .toast{right:auto;left:26px}[dir=rtl] .page-head h1{letter-spacing:0}
@keyframes float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-12px) rotate(6deg)}}
@media(max-width:1170px){.app-shell{grid-template-columns:215px minmax(0,1fr)}.sidebar{padding-inline:12px}.brand{font-size:18px}.main-content{padding-inline:23px}.topbar{padding-inline:23px}.bento{gap:13px}.card{padding:19px}.hero-art{flex-basis:27%}.mood-option .face{font-size:24px}.mood-option small{font-size:9px}}
@media(max-width:980px){.span-8,.span-7,.span-6,.span-5{grid-column:span 12}.span-4,.span-3{grid-column:span 6}.metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:740px){.app-shell{display:block}.sidebar{display:none}.topbar{height:71px;padding-inline:19px}.main-content{padding:24px 17px 102px}.pill-date{display:none}.topbar-label{font-size:10px}.topbar-title{font-size:13px}.avatar{width:39px;height:39px}.mobile-nav{position:fixed;display:flex;justify-content:space-around;gap:5px;align-items:center;bottom:0;left:0;right:0;height:calc(68px + env(safe-area-inset-bottom));padding:6px 10px calc(7px + env(safe-area-inset-bottom));background:color-mix(in srgb,var(--surface) 94%,transparent);backdrop-filter:blur(25px);border-top:1px solid var(--line);z-index:7}.mobile-nav button{border:0;background:none;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:4px;font-size:9px;font-weight:800;min-width:48px;padding:8px 5px;border-radius:11px}.mobile-nav svg{width:21px;height:21px}.mobile-nav button.active{color:var(--purple);background:#f3efff}.mobile-only{display:block}.page-head{align-items:center}.page-head h1{font-size:27px}.page-head p{font-size:12px}.hero{padding:25px 23px;min-height:234px}.hero h1{font-size:32px}.hero-art{position:absolute;right:-60px;bottom:-18px;opacity:.4}.hero-copy{max-width:310px}.span-4,.span-3{grid-column:span 12}.metric-grid{gap:10px}.metric{padding:15px 12px}.metric-label{font-size:10px}.metric strong{font-size:22px}.metric small{font-size:9px}.metric-top{margin-bottom:14px}.mood-picker{gap:5px}.mood-option{border-radius:12px;padding:10px 2px}.mood-option .face{font-size:22px}.mood-option small{font-size:8px}.card{padding:20px}.toast{bottom:82px;right:16px;left:16px;max-width:none}[dir=rtl] .toast{right:16px;left:16px}[dir=rtl] .hero-art{right:auto;left:-60px}}
@media(max-width:380px){.mood-option .face{font-size:19px}.mood-option small{font-size:7px}.metric strong{font-size:20px}.page-head h1{font-size:24px}.hero h1{font-size:29px}.topbar-actions{gap:6px}.hero{padding:23px 19px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}


/* My Music */
.music-hero{display:flex;align-items:center;justify-content:space-between;min-height:238px;position:relative;overflow:hidden;padding:29px 34px;border-radius:26px;background:linear-gradient(115deg,#fae5fb 2%,#e9e4ff 45%,#d9eeff);border:1px solid #fff;box-shadow:var(--shadow)}.music-hero-copy{z-index:1;position:relative}.music-hero h2{font-size:clamp(27px,3.5vw,40px);line-height:1.25;letter-spacing:-1.2px;margin:2px 0 8px}.music-hero h2 span{color:#9a72e7}.music-hero p{font-size:12px;color:#837998;margin:0 0 20px;max-width:440px;line-height:1.7}.music-hero-count{display:inline-flex;align-items:baseline;gap:8px;color:#7454dc;font-size:30px;font-weight:900}.music-hero-count small{font-weight:800;font-size:11px;color:#857a9e}.music-hero-visual{position:absolute;inset:0 1% 0 auto;width:32%;display:grid;place-items:center;pointer-events:none}.music-vinyl{width:168px;height:168px;border:22px solid #39334fc9;border-radius:50%;background:radial-gradient(circle at center,#ffe2e6 0 13%,#9071e6 14% 27%,#37324f 28% 30%,#46405c 31% 45%,#302940 46% 60%,#453c57 61%);box-shadow:0 22px 35px #745bb047,inset 0 0 12px #fff6;display:grid;place-items:center;color:white;font-size:35px;transform:rotate(-17deg)}.music-note-floating{position:absolute;right:8%;top:9%;font-size:28px;color:#a56fe9;word-spacing:40px}
.music-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:17px}.music-track{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:23px;overflow:hidden;min-width:0}.music-track-art{height:170px;position:relative;background:linear-gradient(135deg,#f7c7df,#e2d5ff 55%,#d6effa);display:grid;place-items:center;font-size:63px;overflow:hidden}.music-track:nth-child(3n+2) .music-track-art{background:linear-gradient(125deg,#d5e9ff,#e7dfff,#fad9e6)}.music-track:nth-child(3n+3) .music-track-art{background:linear-gradient(125deg,#fae3ce,#f5e5f9,#d3ede9)}.music-artwork-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}.music-disc{position:absolute;bottom:10px;right:12px;background:#ffffffcf;color:#6650bd;border-radius:50%;width:39px;height:39px;display:grid;place-items:center;font-size:23px;z-index:2;box-shadow:0 4px 13px #0002}.music-track-info{padding:18px;display:flex;flex-direction:column;flex:1}.music-track-label{font-size:10px;font-weight:850;color:#9575e6;letter-spacing:.3px}.music-track h3{font-size:16px;font-weight:900;letter-spacing:-.4px;line-height:1.4;margin:10px 0 3px;overflow-wrap:anywhere}.music-track-info>p{font-size:11px;line-height:1.6;color:var(--muted);margin:0}.music-track-note{color:#8b8ba2;font-size:11px;line-height:1.7;background:var(--surface2);border-radius:12px;margin-top:13px;padding:11px;overflow-wrap:anywhere}.music-track footer{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-top:auto;padding-top:15px}.music-home-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.music-home-item{display:flex;align-items:center;gap:11px;border-radius:16px;padding:10px;background:var(--surface2);min-width:0}.music-home-art{position:relative;border-radius:12px;width:51px;height:51px;flex-shrink:0;overflow:hidden;background:linear-gradient(145deg,#ffdcf2,#d6d6ff);display:grid;place-items:center;font-size:27px}.music-home-item>div:last-child{min-width:0}.music-home-item strong,.music-home-item small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.music-home-item strong{font-size:11px}.music-home-item small{font-size:10px;margin-top:4px;color:var(--muted)}
body.dark .music-hero{background:linear-gradient(120deg,#58416c,#443d6d,#34566e);border-color:var(--line)}body.dark .music-hero p{color:#dacde7}body.dark .music-hero-count{color:#dfb7ff}body.dark .music-hero-count small{color:#c1b1d3}body.dark .music-track-label{color:#bd9cfa}
[dir=rtl] .music-hero-visual{inset:0 auto 0 1%}[dir=rtl] .music-note-floating{right:auto;left:8%}[dir=rtl] .music-disc{right:auto;left:12px}
@media(max-width:740px){.music-hero{min-height:200px;padding:24px}.music-hero h2{font-size:28px;max-width:270px}.music-hero p{max-width:260px}.music-hero-visual{opacity:.45;width:46%;right:-8%}[dir=rtl] .music-hero-visual{right:auto;left:-8%}.music-vinyl{width:130px;height:130px;border-width:16px}.music-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}.music-home-row{grid-template-columns:1fr}.music-track-art{height:160px}}


/* Ten lifestyle experiences — scoped extras; existing views unchanged */
.sidebar{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#ddd4f8 transparent}.sidebar-bottom{margin-top:15px}.extra-head{display:flex;align-items:end;justify-content:space-between;gap:15px;margin-bottom:23px}.extra-head h1{font-size:clamp(26px,3vw,36px);margin:3px 0 7px;letter-spacing:-1.1px}.extra-head p{color:var(--muted);font-size:12px;line-height:1.7;max-width:650px;margin:0}.extra-eyebrow{color:#8965d9;font-size:10px;font-weight:900;letter-spacing:2px}.extra-feature{background:linear-gradient(115deg,#e9e0fd,#fce9f4,#deefff);border:1px solid #ffffffad;border-radius:25px;padding:32px;min-height:201px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden;box-shadow:var(--shadow)}.extra-feature>div:first-child{position:relative;z-index:1;max-width:630px}.extra-feature h2{font-size:clamp(23px,3vw,34px);line-height:1.3;letter-spacing:-.9px;margin:10px 0}.extra-feature p{font-size:12px;line-height:1.8;color:#796c90;margin:9px 0 18px}.extra-hero-emoji{font-size:108px;filter:drop-shadow(0 16px 15px #9782b050);transform:rotate(-15deg);flex-shrink:0;margin-right:5%}.dj-gradient{background:linear-gradient(120deg,#f0dffc,#e5ddff,#d8f2fd)}.quest-gradient{background:linear-gradient(120deg,#fff0cd,#ffdef0,#e3e7ff)}.comfort-gradient{background:linear-gradient(120deg,#dff8e9,#e8f9f5,#f0ecff)}.travel-gradient{background:linear-gradient(120deg,#dbf0ff,#def8ec,#f3e8ff)}.vision-gradient{background:linear-gradient(120deg,#f9e2fb,#e5e0ff,#fce5d6)}.pet-gradient{background:linear-gradient(120deg,#ffe6d5,#fcebf2,#e2e8ff)}.insights-gradient{background:linear-gradient(120deg,#dff3ff,#e4e4ff,#f1e5ff)}.creative-gradient{background:linear-gradient(120deg,#e7e0fe,#ffddf1,#ffe9da)}.cinema-gradient{background:linear-gradient(120deg,#e4e5ff,#f1deff,#ffdfea)}.sleep-gradient{background:linear-gradient(120deg,#e2e3ff,#e8eafe,#f2e2fa)}
.extra-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:15px 0}.extra-toolbar>span:first-child{color:var(--muted);font-weight:850;font-size:11px;margin-inline-end:4px}.extra-section-title{display:flex;justify-content:space-between;align-items:center;gap:13px;font-size:18px;font-weight:900;letter-spacing:-.5px;margin:28px 0 15px}.extra-list{display:grid;gap:10px}.extra-list-item{display:flex;gap:12px;align-items:center;min-width:0;border:1px solid var(--line);padding:13px 16px;border-radius:18px;background:var(--surface);box-shadow:var(--shadow)}.extra-list-item>div:nth-child(2){flex:1;min-width:0}.extra-list-item strong{font-size:12px;display:block;overflow-wrap:anywhere;line-height:1.5}.extra-list-item small{font-size:10px;color:var(--muted);display:block;margin-top:5px;line-height:1.7}.extra-list-item p{font-size:11px;line-height:1.6;color:var(--muted)}.extra-list-emoji{font-size:25px}.extra-mini-art{width:50px;height:50px;border-radius:13px;background:#eee4ff;display:grid;place-items:center;font-size:24px;overflow:hidden;flex-shrink:0}.extra-mini-art img{width:100%;height:100%;object-fit:cover}.extra-number{color:#a19bb0;font-size:12px;font-weight:800}.extra-check{width:20px;height:20px;accent-color:var(--purple);cursor:pointer}
.extra-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}.extra-card{background:var(--surface);box-shadow:var(--shadow);border:1px solid var(--line);border-radius:20px;padding:19px;position:relative;min-width:0;overflow:hidden}.extra-card-icon{height:103px;border-radius:15px;background:linear-gradient(135deg,#e2d8ff,#ffdfeb);display:grid;place-items:center;font-size:45px;overflow:hidden}.extra-card-icon img{width:100%;height:100%;object-fit:cover}.extra-card h3{font-size:14px;line-height:1.5;overflow-wrap:anywhere;margin:14px 0 7px}.extra-card p{font-size:11px;line-height:1.7;color:var(--muted);white-space:pre-wrap;overflow-wrap:anywhere}.extra-trash{margin-inline-start:auto;border:0;background:#ffeefa;color:#b65b8b;padding:8px 11px;font-size:11px;font-weight:900;line-height:1;border-radius:9px;cursor:pointer}.extra-card>.extra-trash{position:absolute;top:12px;inset-inline-end:12px;z-index:2}.extra-suggestion{background:var(--surface);border:1px solid var(--line);border-radius:19px;padding:20px;text-align:start;color:var(--text);display:grid;gap:9px;box-shadow:var(--shadow);transition:transform .2s}.extra-suggestion:hover{transform:translateY(-3px);border-color:#c0abf6}.extra-suggestion span{font-size:30px}.extra-suggestion strong{font-size:13px;line-height:1.5}.extra-suggestion small{font-size:10px;color:var(--purple)}
.extra-empty{background:var(--surface);border:1.5px dashed #cfc6eb;border-radius:19px;min-height:170px;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center;padding:24px;color:var(--muted);text-align:center;font-size:12px}.extra-empty>span{font-size:39px}.extra-empty strong{font-size:13px}.extra-empty p{line-height:1.8;max-width:390px}.extra-footnote{color:var(--muted);font-size:10px;line-height:1.9;margin:18px 0}.extra-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:17px;margin-top:20px}.extra-columns .card{min-width:0}.extra-breath-wrap{display:grid;place-items:center;min-height:200px}.extra-breath{width:125px;height:125px;border-radius:50%;background:radial-gradient(circle at 25% 20%,#fefaff,#d3c5fb 60%,#b5e6e0);box-shadow:0 15px 45px #b69ed13b;display:grid;place-items:center;font-size:52px}.extra-breath.is-breathing{animation:extra-breathe 8s ease-in-out infinite}@keyframes extra-breathe{0%,100%{transform:scale(.85)}50%{transform:scale(1.28)}}
.extra-map-card{border:1px solid var(--line);border-radius:23px;background:var(--surface);padding:14px;margin-top:20px}.extra-world{width:100%;height:auto;display:block;max-height:480px}.extra-vision-grid{columns:4 190px;column-gap:15px}.extra-vision-tile{break-inside:avoid;display:inline-block;width:100%;background:var(--surface);border-radius:19px;box-shadow:var(--shadow);border:1px solid var(--line);overflow:hidden;margin-bottom:15px;position:relative}.extra-vision-tile>.extra-trash{position:absolute;top:10px;inset-inline-end:10px;z-index:1}.extra-vision-art{height:155px;background:linear-gradient(140deg,#f2d7f4,#c9cbff);display:grid;place-items:center;font-size:53px;overflow:hidden}.extra-vision-tile.v1 .extra-vision-art{height:203px;background:linear-gradient(140deg,#d5f3eb,#ede3ff)}.extra-vision-tile.v2 .extra-vision-art{height:126px;background:linear-gradient(140deg,#ffe5d0,#f7d4e9)}.extra-vision-art img{height:100%;width:100%;object-fit:cover}.extra-vision-info{padding:15px}.extra-vision-info h3{font-size:14px;line-height:1.5}.extra-vision-info p{font-size:11px;color:var(--muted);line-height:1.6}
.extra-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin-top:24px}.extra-stats>div{background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:20px;box-shadow:var(--shadow)}.extra-stats strong{font-size:27px;display:block;color:var(--purple);letter-spacing:-1px}.extra-stats small{font-size:10px;color:var(--muted);line-height:1.7}.extra-chart{height:180px;display:flex;gap:7px;align-items:end;overflow-x:auto;min-width:0;padding:18px 0 0}.extra-chart-col{height:100%;min-width:17px;flex:1;display:flex;align-items:center;justify-content:end;gap:7px;flex-direction:column}.extra-chart-bar{width:min(100%,29px);background:linear-gradient(180deg,#b79ef5,#8068e8);border-radius:9px 9px 4px 4px;display:flex;align-items:flex-start;justify-content:center;transition:height .3s}.extra-chart-bar span{color:white;font-size:9px;font-weight:800;padding-top:3px}.extra-chart-col small{font-size:9px;color:var(--muted);min-height:23px;white-space:nowrap}
.extra-idea-card{margin-top:8px;background:linear-gradient(125deg,var(--surface),var(--surface2));min-height:230px}.extra-idea-card h2{font-size:22px;letter-spacing:-.7px}.extra-idea-card p{font-size:13px;line-height:1.85;color:var(--muted);max-width:690px;white-space:pre-wrap}.extra-idea-emoji{font-size:46px}.extra-consent{display:flex;gap:11px;align-items:start;font-size:11px;line-height:1.8;color:var(--muted);margin:15px 0}.extra-consent input{accent-color:var(--purple);margin-top:4px}.extra-form{display:grid;gap:14px}.extra-field{display:grid;gap:7px;min-width:0}.extra-field>span{font-size:11px;font-weight:850}.extra-dream{white-space:pre-wrap;overflow-wrap:anywhere}
body.dark .extra-feature{background:linear-gradient(120deg,#54476a,#414968,#40585f);border-color:var(--line)}body.dark .extra-feature p{color:#e1d4e8}body.dark .extra-eyebrow{color:#d5bdff}body.dark .extra-card-icon,body.dark .extra-vision-art{background:linear-gradient(145deg,#513b60,#4d4b77)}body.dark .extra-trash{background:#49334a;color:#eaa1ca}body.dark .extra-world{opacity:.86}
[dir=rtl] .extra-head h1{letter-spacing:0}
@media(max-width:950px){.extra-columns{grid-template-columns:1fr}.extra-stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:740px){.extra-head{align-items:start}.extra-head h1{font-size:26px}.extra-head .btn{padding:10px}.extra-feature{padding:23px;min-height:180px}.extra-feature h2{font-size:24px;max-width:270px}.extra-feature p{max-width:275px}.extra-hero-emoji{font-size:70px;opacity:.42;position:absolute;inset:auto 5px 0 auto}[dir=rtl] .extra-hero-emoji{inset:auto auto 0 5px}.extra-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}.extra-stats>div{padding:15px}.extra-list-item{padding:11px;gap:8px}.extra-list-item .btn{white-space:normal}.extra-list-item strong{font-size:11px}}
@media(prefers-reduced-motion:reduce){.extra-breath.is-breathing{animation:none}}

/* Local photo uploads for new lifestyle collections */
.extra-pin-photo{display:grid;place-items:center;overflow:hidden;border-radius:17px;background:var(--surface2);height:210px;font-size:64px}.extra-pin-photo img{width:100%;height:100%;object-fit:cover}.extra-form input[type=file]{padding:12px;color:var(--muted);line-height:1.6}.extra-form input[type=file]::file-selector-button{background:#eeeaff;color:#6d52d0;border:0;border-radius:8px;padding:9px 12px;margin-inline-end:12px;font-weight:850;cursor:pointer}


/* APPLE HEALTH RED — visual-only palette update, 2026-09-25.
   All existing routes, elements, data, forms and interactions remain untouched. */
:root{
  color-scheme:light;
  --bg:#f0f3f8;
  --surface:#ffffff;
  --surface2:#f3f6fb;
  --text:#14223a;
  --muted:#6e7b90;
  --line:#e2e8f1;
  --purple:#ff3b30;
  --purpleDark:#d92e27;
  --pink:#ed6389;
  --coral:#fa8875;
  --mint:#12b99c;
  --blue:#ff625a;
  --yellow:#e9ac42;
  --shadow:0 12px 35px rgba(62,33,40,.045),0 2px 8px rgba(62,33,40,.025);
}
body{
  background:radial-gradient(ellipse 65% 33% at 93% -9%,rgba(255,118,107,.10),transparent 78%),var(--bg);
  background-attachment:fixed;
  color:var(--text);
}
button,input,select,textarea{font-family:inherit}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid #437bff;outline-offset:3px;
}
.app-shell{grid-template-columns:246px minmax(0,1fr);max-width:1920px}
.sidebar{
  gap:23px;padding:27px 16px 21px;
  background:rgba(255,255,255,.94);
  border-color:var(--line);
  scrollbar-color:#c6d1e4 transparent;
}
.brand{font-size:19px;letter-spacing:-.85px;gap:12px;padding:4px 11px 13px}
.brand em{color:#ff3b30}
.brand-mark{
  width:42px;height:42px;border-radius:13px;
  background:linear-gradient(150deg,#731d27,#ff453a 78%);
  box-shadow:0 8px 18px rgba(207,47,46,.17),inset 0 1px rgba(255,255,255,.3);
}
.nav-group{gap:4px}
.nav-caption{font-size:10px;letter-spacing:1.6px;color:#91878b;margin:8px 0 9px}
.nav-item{
  padding:11px 14px;border:1px solid transparent;border-radius:12px;
  color:#65738b;font-size:12px;font-weight:750;
  transition:background .2s,border-color .2s,color .2s,transform .2s;
}
.nav-item svg{width:18px;height:18px;stroke-width:1.9}
.nav-item:hover{background:#fff2f1;color:#d42e2a;border-color:#ffe5e3}
.nav-item.active{
  background:#fff0ef;color:#d52c28;border:1px solid #ffd6d3;
  box-shadow:inset 3px 0 #ff453a;font-weight:850;
}
.nav-item .nav-dot{background:#ff453a}
.sidebar-bottom{margin-top:auto}
.side-banner{
  min-height:158px;border-radius:17px;border:1px solid #dbe8ff;
  background:linear-gradient(138deg,#e7eeff 0%,#fff6f5 67%,#e8f5ff 100%);
}
.side-banner::after{content:"✧";color:#acc5ff80;right:0}
.side-banner p{color:#7d2630}
.side-banner small{color:#876e77}
.side-banner button{color:#c52e2b;border:1px solid #dce6ff;box-shadow:0 5px 14px #1d3d8610}
.workspace{min-width:0}
.topbar{
  height:78px;background:rgba(255,255,255,.83);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}
.topbar-label{color:#8895a9}
.topbar-title{font-size:15px;letter-spacing:-.3px}
.pill-date{background:#f0f4fa;color:#65738b;border:1px solid #e7ecf4}
.avatar{
  background:linear-gradient(140deg,#dbe9ff,#b5cbff);
  color:#244d9a;border-radius:13px;
  box-shadow:inset 0 0 0 1px #fff9;
}
.icon-button{
  border-color:var(--line);background:var(--surface);border-radius:12px;
  transition:background .2s,border-color .2s;
}
.icon-button:hover{background:#fff1ef;border-color:#c5d7ff}
.main-content{padding-top:34px}
.page-head h1,.extra-head h1{color:var(--text);font-weight:850;letter-spacing:-1.15px}
.page-head p,.extra-head p{color:var(--muted)}
.eyebrow,.extra-eyebrow{color:#e13a32;font-weight:850;letter-spacing:1.6px}
.section-title,.extra-section-title{font-weight:850;letter-spacing:-.55px}
.btn{border-radius:11px;transition:transform .18s,box-shadow .18s,background .18s}
.btn:hover{transform:translateY(-1px)}
.btn-primary{
  background:linear-gradient(125deg,#ec302c,#ff6259);
  box-shadow:0 7px 17px rgba(226,53,47,.19);
}
.btn-primary:hover{box-shadow:0 10px 22px rgba(226,53,47,.27)}
.btn-light{background:#ffefed;color:#db342e}
.btn-ghost{background:#f8f3f3;color:#573b40}
.btn-pink{background:#fff0f3;color:#c73e68}
.btn-danger{background:#fff0f1;color:#c23d55}
.btn-white{background:#fff;color:#b82b29;border:1px solid #f0e2e2}
.card,.collection-card,.music-track,.photo-card,.note-card,.extra-card,.extra-list-item,.extra-map-card,.extra-vision-tile{
  border:1px solid var(--line);box-shadow:var(--shadow);
}
.card{border-radius:19px;padding:23px}
.card-title{letter-spacing:-.4px}
.card-subtitle{color:var(--muted)}
.subtle-link{color:#e13a32}
.bento{gap:17px}
.hero{
  min-height:240px;border:1px solid #672630;border-radius:23px;color:#fff;
  background:
    radial-gradient(circle at 78% 36%,rgba(255,80,70,.43),transparent 33%),
    radial-gradient(circle at 100% 100%,rgba(255,147,116,.2),transparent 40%),
    linear-gradient(117deg,#27171e 4%,#54202a 63%,#872e38 100%);
  box-shadow:0 20px 38px rgba(97,28,40,.12);isolation:isolate;
}
.hero::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(125deg,rgba(255,255,255,.07),transparent 42%);
  pointer-events:none;
}
.hero .tiny-badge{
  color:#bfe9ff;background:rgba(255,143,132,.12);
  border:1px solid rgba(255,185,173,.26);
  padding:7px 12px;letter-spacing:.3px;
}
.hero h1{color:#fff;letter-spacing:-1.55px}
.hero h1 span{color:#ffb6ac}
.hero p{color:#f0d2d2;font-size:12px}
.hero .btn-primary{
  background:#f5f9ff;color:#a82828;box-shadow:0 8px 25px #081b4250;
}
.hero-art{height:190px}
.hero-orb{
  width:164px;height:164px;border-radius:50%;
  color:#effaff;font-size:70px;
  background:radial-gradient(circle at 33% 23%,#ffd1c7 0%,#ff6558 33%,#922e3a 75%);
  border:1px solid rgba(255,218,210,.72);
  box-shadow:inset 0 0 0 10px rgba(255,255,255,.08),0 0 0 17px rgba(255,155,144,.08),0 20px 40px rgba(6,16,44,.28);
  filter:none;
}
.hero-orb::after{
  content:"";position:absolute;width:190px;height:190px;border:1px solid rgba(255,186,178,.28);
  border-radius:50%;pointer-events:none;
}
.hero-art .sparkle{display:none}
.metric-grid{gap:13px}
.metric{
  --metric:#ff453a;
  border:1px solid var(--line);border-radius:17px;
  background:#fff!important;
  box-shadow:var(--shadow);
  padding:20px;
}
.metric::before{
  content:"";position:absolute;top:0;inset-inline:17px;
  height:3px;border-radius:0 0 5px 5px;background:var(--metric);
}
.metric.pink{--metric:#ed7390}
.metric.mint{--metric:#0fb79e}
.metric.blue{--metric:#ff7166}
.metric.yellow{--metric:#dfa847}
.metric-label{color:#66768d}
.metric-foot,.metric small{color:#8b7c82}
.metric strong{color:#39252a;font-size:29px}
.metric-icon{font-size:21px}
.mini-progress{background:#f8eded}
.week-bar-track{background:linear-gradient(0deg,#f8e8e8,#fff8f8)}
.week-bar,.extra-chart-bar{background:linear-gradient(180deg,#ff9a8b,#ff453a)}
.week-bar.empty{background:#eedbdb}
.week-day.today small{color:#e13a32}
.mood-option{
  background:#faf6f6;border:1px solid #f1e8e8;border-radius:13px;
  color:#718096;
}
.mood-option:hover{background:#fff1ef;transform:translateY(-2px)}
.mood-option.selected{
  background:#ffefed;border-color:#ff928b;
  box-shadow:0 0 0 2px rgba(255,69,58,.12);
}
.mood-option.selected small{color:#d5322d}
.joy-tag,.chip{
  background:#f5f7fb;border:1px solid #e5eaf3;border-radius:11px;color:#43536d;
}
.joy-tag:hover,.chip:hover{border-color:#f3b9b4;background:#fff2f0}
.chip.selected{background:#e9f0ff;border-color:#f3a39d;color:#d5322d}
.quote-card{
  background:linear-gradient(135deg,#fff0ee,#fff9f8 68%,#fff3f0);
  border:1px solid #f5dedb;
}
.quote-card .quote-symbol{color:#ef756d}
.quote-card small{color:#8e7379}
.prompt-card{
  background:linear-gradient(135deg,#fff6f5,#fff0ef);
  border:1px solid #f0dfdd;
}
.prompt-card p{color:var(--muted)}
.empty,.extra-empty{
  background:#f8faff;border-color:#cfdced;border-radius:16px;
}
.field label{color:var(--text)}
.input,.select,.textarea{
  border-radius:11px;background:var(--surface);border:1px solid #e9d7d7;
  color:var(--text);font-size:12px;
}
.input:focus,.select:focus,.textarea:focus{
  border-color:#ff645b;box-shadow:0 0 0 3px rgba(255,69,58,.12);
}
.searchbox svg{color:#9b8589}
.collection-card,.music-track,.note-card,.photo-card{border-radius:17px}
.collection-thumb{
  border-radius:12px;
  background:linear-gradient(145deg,#ffe5e1,#ffd0ca 60%,#fce3dc);
}
.micro-label{background:#ffefed;color:#d63630}
.delete-mini,.extra-trash{background:#fff0f3;color:#bf4a69}
.feed-item,.plan-slot{border-radius:14px}
.feed-emoji,.plan-icon{background:#fff1ef;border-radius:12px}
.planner-top{
  border:1px solid #f6dbd8;border-radius:20px;
  background:linear-gradient(117deg,#fff0ed,#f5f8ff 58%,#ffe3dc);
}
.planner-top::after{content:"◌";color:#bdd5ff80}
.planner-top p{color:#896d74}
.plan-time{background:#ffefed;color:#d73c34}
.plan-check input:checked{background:#12b99c;border-color:#12b99c}
.water-glass{background:#eff6ff;color:#efa9a2}
.water-glass.filled{background:#dceaff;color:#f05248}
.goal-line{background:#e9eef7}
.goal-line i{background:linear-gradient(90deg,#1db8a4,#ff6459)}
.wellness-hero{
  background:linear-gradient(125deg,#fff1ee,#ffe7e2 64%,#fff6f5);
  border:1px solid #ddf0ea;
}
.notice{background:#fff1ef;color:#b53b38}
.notice.warn{background:#fff6e8;color:#876333}
.modal-backdrop{background:rgba(11,23,46,.53);backdrop-filter:blur(11px)}
.modal{border-radius:20px;border:1px solid var(--line);box-shadow:0 32px 90px rgba(13,25,51,.24)}
.toast{background:#4b2028;border:1px solid #87414a;border-radius:12px}
.mobile-nav{box-shadow:0 -8px 24px rgba(97,28,40,.05)}
.mobile-nav button.active{background:#e7efff;color:#dc3c33}

/* Music: streamlined dark listening header and neutral artwork panels. */
.music-hero{
  border:1px solid #78343d;border-radius:22px;
  background:radial-gradient(circle at 85% 44%,#3163a0a6,transparent 38%),linear-gradient(115deg,#281a20,#652934);
  color:#fff;box-shadow:0 16px 35px #132d5920;
}
.music-hero h2{color:white}
.music-hero h2 span{color:#ffb0a8}
.music-hero p{color:#ebced0}
.music-hero-count{color:#ffb9ac}
.music-hero-count small{color:#f0d9d9}
.music-vinyl{
  border-color:#4a222b;background:radial-gradient(circle at center,#ffd2c9 0 13%,#f56558 14% 27%,#5a2831 28% 30%,#76333a 31% 45%,#3e2028 46% 60%,#803c43 61%);
  box-shadow:0 16px 40px #0616297a,inset 0 0 8px #fff4;
}
.music-note-floating{color:#ffb9af}
.music-track-art,.music-track:nth-child(3n+2) .music-track-art,.music-track:nth-child(3n+3) .music-track-art{
  background:linear-gradient(145deg,#fff0ee,#ffcec8 57%,#ffe5df);
}
.music-track:nth-child(3n+2) .music-track-art{background:linear-gradient(140deg,#ffebe7,#ffd4ce,#ffe8e1)}
.music-track:nth-child(3n+3) .music-track-art{background:linear-gradient(140deg,#fff0ed,#ffdcd6,#ffe9e3)}
.music-track-label{color:#dc443c}
.music-track-note{background:#fff3f1;color:#876e75}
.music-home-art{background:linear-gradient(145deg,#ffe9e4,#ffc8c0)}
.music-home-item{background:#f1f5fb}
.music-disc{background:#eff6ff;color:#d63a34}

/* All ten lifestyle experiences share a calm, consistent design language. */
.extra-feature{
  --feature-glow:rgba(255,80,73,.25);
  border:1px solid #71303a;border-radius:21px;color:#fff;
  background:radial-gradient(circle at 82% 42%,var(--feature-glow),transparent 41%),linear-gradient(116deg,#291a21,#662b36 100%);
  box-shadow:0 16px 34px rgba(97,28,40,.12);isolation:isolate;
}
.extra-feature::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(122deg,rgba(255,255,255,.05),transparent 47%);
  pointer-events:none;
}
.extra-feature h2{color:#fff}
.extra-feature p{color:#c3d2e8}
.extra-feature .extra-eyebrow{color:#ffbdb4}
.dj-gradient{--feature-glow:rgba(255,92,85,.37)}
.quest-gradient{--feature-glow:rgba(250,113,87,.36)}
.comfort-gradient{--feature-glow:rgba(20,189,166,.32)}
.travel-gradient{--feature-glow:rgba(255,100,80,.4)}
.vision-gradient{--feature-glow:rgba(244,91,99,.36)}
.pet-gradient{--feature-glow:rgba(248,123,98,.3)}
.insights-gradient{--feature-glow:rgba(251,85,77,.39)}
.creative-gradient{--feature-glow:rgba(239,89,96,.36)}
.cinema-gradient{--feature-glow:rgba(238,73,78,.38)}
.sleep-gradient{--feature-glow:rgba(225,95,103,.35)}
.extra-hero-emoji{
  width:142px;height:142px;border-radius:50%;
  display:grid;place-items:center;font-size:83px;line-height:1;
  background:radial-gradient(circle at 30% 25%,rgba(255,183,174,.26),rgba(224,75,72,.10));
  border:1px solid rgba(255,182,173,.23);
  filter:none;transform:rotate(-10deg);
  box-shadow:inset 0 0 0 12px #ffffff08,0 16px 35px #061b3947;
}
.extra-mini-art,.extra-card-icon,.extra-vision-art,.extra-vision-tile.v1 .extra-vision-art,.extra-vision-tile.v2 .extra-vision-art{
  background:linear-gradient(138deg,#ffebe7,#ffd5cf 64%,#ffe9e3);
}
.extra-card,.extra-list-item,.extra-map-card,.extra-vision-tile{border-radius:17px}
.extra-suggestion{
  border-color:var(--line);border-radius:17px;background:var(--surface);box-shadow:var(--shadow);
}
.extra-suggestion:hover{border-color:#f6b3ae}
.extra-suggestion small{color:#d63a34}
.extra-number{color:#947d84}
.extra-stats>div{border-radius:15px}
.extra-stats strong{color:#d63a34}
.extra-breath{
  background:radial-gradient(circle at 25% 20%,#fff9f7,#ffb4a9 56%,#fa6259);
  box-shadow:0 15px 38px #2d81d13d;
}
.extra-idea-card{background:linear-gradient(135deg,var(--surface),var(--surface2))}
.extra-form input[type=file]::file-selector-button{
  background:#ffefed;color:#d73d35;border-radius:9px;
}

/* Dark mode: same cobalt/teal visual identity, not the former purple/pink palette. */
body.dark{
  color-scheme:dark;
  --bg:#171316;--surface:#261d23;--surface2:#32252d;
  --text:#fff1ef;--muted:#c8adb0;--line:#49343c;
  --purple:#ff8b83;--purpleDark:#ff554c;--pink:#f08ba5;--mint:#35cfb6;
  --shadow:0 12px 38px rgba(0,5,17,.16);
  background:radial-gradient(ellipse 70% 40% at 89% 0%,rgba(180,43,50,.12),transparent 80%),var(--bg);
}
body.dark .sidebar,body.dark .topbar{background:rgba(17,30,52,.95)}
body.dark .brand em{color:#88b0ff}
body.dark .nav-caption{color:#8094b3}
body.dark .nav-item{color:#a9b8ce}
body.dark .nav-item:hover{background:#442b34;color:#ffd3cc;border-color:#71414b}
body.dark .nav-item.active{
  background:#552f39;color:#ffd3cc;border-color:#84434c;
  box-shadow:inset 3px 0 #ff645b;
}
body.dark .pill-date,body.dark .icon-button{background:#382831;color:#eed6d6;border-color:#593943}
body.dark .icon-button:hover{background:#59323d}
body.dark .avatar{background:linear-gradient(140deg,#783b46,#b43d43);color:#fff0ed}
body.dark .side-banner{background:linear-gradient(145deg,#472932,#65313c);border-color:#86404c}
body.dark .side-banner p{color:#fff0ed}
body.dark .side-banner small{color:#e6c2c4}
body.dark .side-banner button{background:#fff0ed;color:#a02e30;border-color:#f6aaa5}
body.dark .hero,body.dark .music-hero,body.dark .extra-feature{
  background:radial-gradient(circle at 78% 37%,rgba(245,77,74,.34),transparent 43%),linear-gradient(117deg,#351e28,#692d3b 100%);
  border-color:#87434d;
}
body.dark .hero p,body.dark .music-hero p,body.dark .extra-feature p{color:#edcccf}
body.dark .metric,body.dark .metric.pink,body.dark .metric.mint,body.dark .metric.blue,body.dark .metric.yellow{
  background:#33242d!important;border-color:#563944;
}
body.dark .metric strong{color:#fff1ee}
body.dark .metric-label,body.dark .metric-foot,body.dark .metric small{color:#d0b1b7}
body.dark .mini-progress{background:#583944}
body.dark .week-bar-track{background:linear-gradient(0deg,#472e39,#342630)}
body.dark .week-bar.empty{background:#60414b}
body.dark .nav-item.active,body.dark .nav-item:hover{box-shadow:inset 3px 0 #ff645b}
body.dark .mood-option{background:#3d2933;border-color:#65404a;color:#d7b8bd}
body.dark .mood-option:hover{background:#57313d}
body.dark .mood-option.selected{background:#703640;border-color:#ff8c82;box-shadow:0 0 0 2px #427ae32a}
body.dark .mood-option.selected small{color:#ffe1db}
body.dark .chip,body.dark .joy-tag{background:#3e2b35;border-color:#62414c;color:#e7c7cb}
body.dark .chip.selected{background:#743844;color:#ffe5e0;border-color:#ff8078}
body.dark .quote-card{background:linear-gradient(135deg,#4d2d39,#35252f);border-color:#67414b}
body.dark .quote-card .quote-symbol{color:#ff988e}
body.dark .quote-card small{color:#e5bfc4}
body.dark .prompt-card{background:linear-gradient(135deg,#51313c,#1b2d49);border-color:#65434c}
body.dark .prompt-card p{color:#e3c6ca}
body.dark .empty,body.dark .extra-empty{background:#382832;border-color:#67434e}
body.dark .input,body.dark .select,body.dark .textarea{background:#2b2029;border-color:#5b3c46;color:#fff1ef}
body.dark .collection-thumb,body.dark .extra-mini-art,body.dark .extra-card-icon,body.dark .extra-vision-art,body.dark .extra-vision-tile.v1 .extra-vision-art,body.dark .extra-vision-tile.v2 .extra-vision-art{
  background:linear-gradient(145deg,#58313d,#813f4c);
}
body.dark .micro-label,body.dark .plan-time{background:#54313c;color:#ffc5bf}
body.dark .feed-emoji,body.dark .plan-icon,body.dark .music-home-item,body.dark .music-track-note{background:#432b36}
body.dark .planner-top{background:linear-gradient(117deg,#452b36,#633540);border-color:#77434d}
body.dark .planner-top p{color:#e6c9cd}
body.dark .water-glass{background:#4b2d39;color:#e5a09d}
body.dark .water-glass.filled{background:#843f4b;color:#ffd3ca}
body.dark .goal-line{background:#513741}
body.dark .wellness-hero{background:linear-gradient(135deg,#4d2b34,#5d303c);border-color:#79434d}
body.dark .notice{background:#53303d;color:#ffd3cb}
body.dark .notice.warn{background:#4c3b27;color:#f9d69b}
body.dark .modal{border:1px solid #6d454f}
body.dark .mobile-nav{background:rgba(16,29,49,.94)}
body.dark .mobile-nav button.active{background:#733742;color:#ffe3dd}
body.dark .music-hero-count{color:#ffc2b7}
body.dark .music-hero-count small{color:#f0d2d2}
body.dark .music-track-art,body.dark .music-track:nth-child(3n+2) .music-track-art,body.dark .music-track:nth-child(3n+3) .music-track-art{
  background:linear-gradient(145deg,#5c3440,#964b55);
}
body.dark .music-track-label{color:#ffb4aa}
body.dark .music-home-art{background:linear-gradient(140deg,#315176,#9b4c58)}
body.dark .extra-eyebrow{color:#ffb9af}
body.dark .extra-feature .extra-eyebrow{color:#ffc4b9}
body.dark .extra-stats strong{color:#ffb6ad}
body.dark .extra-suggestion small{color:#ffb6ad}
body.dark .extra-trash,body.dark .delete-mini{background:#493344;color:#ffb3c7}
body.dark .extra-world{opacity:.92}
[dir=rtl] body.dark .nav-item.active,[dir=rtl] body.dark .nav-item:hover{box-shadow:inset -3px 0 #ff645b}

/* Compact screens: preserve every existing navigation action and readable touch targets. */
@media(max-width:1170px){
  .app-shell{grid-template-columns:216px minmax(0,1fr)}
}
@media(max-width:740px){
  .topbar{height:70px;background:rgba(255,255,255,.93)}
  .main-content{padding:23px 16px calc(108px + env(safe-area-inset-bottom))}
  .card{padding:19px}
  .bento{gap:13px}
  .hero{min-height:226px;padding:24px}
  .hero-art{opacity:.38}
  .hero-orb{width:150px;height:150px}
  .hero-orb::after{width:165px;height:165px}
  .metric{padding:17px 12px}
  .metric strong{font-size:23px}
  .metric-grid{gap:9px}
  .mobile-nav{
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
    border-top:1px solid var(--line);
  }
  .mobile-nav button{min-height:48px}
  .music-hero{min-height:206px}
  .extra-feature{padding:24px;min-height:185px}
  .extra-hero-emoji{width:105px;height:105px;font-size:63px;opacity:.46}
  body.dark .topbar,body.dark .mobile-nav{background:rgba(15,27,46,.94)}
}
@media(max-width:380px){
  .hero{padding:21px 19px}
  .hero h1{font-size:29px}
  .metric strong{font-size:20px}
  .music-hero{padding:21px}
}
@media(prefers-reduced-motion:reduce){
  .nav-item,.icon-button,.btn,.mood-option{transition:none}
}