
:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Arial;color:#24223b;background:#eeeafd}*{box-sizing:border-box}body{margin:0}.shell{min-height:100svh;max-width:490px;margin:auto;background:#fbfaff;box-shadow:0 10px 60px #4d377521;position:relative;padding:20px 19px 102px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.logo{font-weight:950;font-size:21px;letter-spacing:-1.3px}.logo i{font-style:normal;color:#815bea}.pill{font-size:11px;background:#eae4ff;border-radius:100px;padding:8px 12px;color:#6241b1;font-weight:800}.muted{color:#77738e}.tiny{font-size:12px}.eyebrow{font-size:12px;font-weight:900;letter-spacing:1.5px;color:#825ed7;text-transform:uppercase}h1{font-size:32px;line-height:1.13;margin:8px 0 10px;letter-spacing:-1.4px}h2{font-size:23px;line-height:1.2;margin:8px 0 14px;letter-spacing:-.7px}p{line-height:1.5}.card{border-radius:25px;background:#fff;border:1px solid #e9e5f4;padding:18px;margin:15px 0;box-shadow:0 4px 16px #54408808}.hero{background:linear-gradient(135deg,#d9c7ff,#e5f7bf 92%);border:0;overflow:hidden}.art{height:175px;position:relative;border-radius:19px;background:linear-gradient(135deg,#504287,#8b64d9 55%,#d8b5ff);display:grid;place-items:center;font-size:80px;overflow:hidden}.art:before{content:'✦ ✧ ✦ ✧';position:absolute;top:15px;left:15px;color:#f8efae;font-size:22px;letter-spacing:20px}.art:after{content:'🔑';position:absolute;bottom:8px;right:20px;font-size:45px;transform:rotate(-18deg)}button{font:inherit;cursor:pointer}button.primary{background:#7653d9;color:white;border:0;border-radius:16px;min-height:52px;padding:12px 19px;font-weight:800;box-shadow:0 5px 12px #7653d929}button.primary:disabled{opacity:.4;cursor:not-allowed}button.secondary{background:#f0edfa;color:#4f4191;border:0;border-radius:16px;min-height:48px;padding:10px 16px;font-weight:800}button.outline{background:white;border:1.5px solid #ddd6f0;border-radius:16px;min-height:48px;padding:10px 16px;font-weight:800;color:#5b4c91}.wide{width:100%}.grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.interest{min-height:88px;border:2px solid #ece6f4;background:#fff;border-radius:18px;display:flex;align-items:flex-start;justify-content:center;flex-direction:column;gap:7px;padding:13px;font-weight:800}.interest span{font-size:25px}.interest.on{border-color:#7956d9;background:#ede6ff}.progress{height:7px;background:#e9e5f2;border-radius:10px;overflow:hidden;margin:15px 0}.progress>div{height:100%;background:#8060e5;border-radius:10px;transition:width .3s}.options{display:grid;gap:10px}.option{border:2px solid #eae5f5;background:white;border-radius:15px;padding:16px;text-align:left;font-weight:750}.option.selected{border-color:#7653d9;background:#f2ecff}.option.correct{border-color:#4ba877;background:#eafff2}.option.wrong{border-color:#f58d7c;background:#fff0ed}.msg{padding:13px 16px;border-radius:18px;max-width:86%;font-size:15px;line-height:1.5}.msg.other{background:#eeeaf6;align-self:flex-start;border-bottom-left-radius:6px}.msg.self{background:#ded2ff;align-self:flex-end;border-bottom-right-radius:6px}.messages{display:flex;flex-direction:column;gap:11px;min-height:170px;padding:13px 0}.tip{background:#fff2d9;border:1px solid #ffdaa0;border-radius:17px;padding:14px;line-height:1.5;margin:12px 0}.good{background:#e8f9ed;border:1px solid #a6dec0}.warning{background:#fff0ef;border:1px solid #f0c1b9}textarea,input{width:100%;border:1.5px solid #e2dcee;border-radius:15px;background:white;padding:13px;font:inherit;color:#211c3a;outline-color:#7956d9}textarea{min-height:87px;resize:vertical}.actions{display:flex;gap:10px;margin-top:12px}.actions>*{flex:1}.nav{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-around;padding:12px 10px calc(14px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #eee9f6}.nav button{border:0;background:transparent;display:grid;justify-items:center;gap:3px;color:#8b849d;font-size:11px;font-weight:800}.nav button strong{font-size:21px}.nav button.active{color:#7653d9}.badge{display:inline-block;padding:7px 10px;background:#f0eafc;border-radius:12px;color:#6446b9;font-size:12px;font-weight:800}.row{display:flex;align-items:center;justify-content:space-between;gap:12px}.avatar{width:48px;height:48px;border-radius:16px;background:#e4d8ff;display:grid;place-items:center;font-size:27px}.hidden{display:none!important}.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#62b47e;margin-right:5px}.note{margin:20px 0 6px;font-size:12px;color:#78708d;line-height:1.5}.feature{background:#f4f1fb;border-radius:16px;padding:13px;margin:10px 0}.list{display:grid;gap:12px}.smallbtn{border:0;background:#f0eafc;padding:9px 12px;border-radius:11px;font-size:12px;font-weight:750;color:#6947bc}.topback{border:0;background:transparent;padding:8px 0;color:#7653d9;font-weight:800} .screen{animation:appear .2s ease}@keyframes appear{from{opacity:.4;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media(min-width:650px){.shell{margin:24px auto;min-height:850px;border-radius:30px;overflow:hidden;border:7px solid #231e3b}.nav{border-radius:0 0 21px 21px}} 
/* Pilot design-system additions */
:root{--ink:#23213c;--muted:#716d83;--purple:#7752d9;--lime:#d8f56b;--coral:#fa8b7c;--bg:#faf9ff}
html{scroll-behavior:smooth}body{min-height:100vh;background:#e9e4f7;color:var(--ink)}
.shell{max-width:490px;min-height:100svh;padding:20px 18px 112px;background:var(--bg)}
.app-header{margin-bottom:18px}.brand-star{color:#b5da4a;margin-left:2px}
h1{font-size:31px}h3{font-size:18px;margin:8px 0}.intro-hero{padding:10px 0 5px}
.hero-art{height:184px;border-radius:24px;display:grid;place-items:center;font-size:82px;background:radial-gradient(circle at 15% 20%,#dff69f,transparent 42%),linear-gradient(135deg,#b5a0ec,#7855d9)}
.hero-art.story{height:204px;margin-bottom:16px;font-size:96px}.hero-art.mini{height:132px}
.eyebrow{letter-spacing:1.3px}.label{font-size:13px;font-weight:850;color:#635f78;margin:12px 0 7px;display:block}
.radio-tile{padding:13px 15px;border:2px solid #e6e0f2;border-radius:16px;background:white;font-weight:800;cursor:pointer}
.radio-tile.on{background:#ebe4ff;border-color:var(--purple)}
.input-line{display:grid;gap:5px;margin:12px 0}.input-line input{width:100%}.tiny{line-height:1.45}
button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #9d8bf0;outline-offset:2px}
button:disabled{opacity:.45;cursor:not-allowed}.hero-badge{display:inline-flex;align-items:center;gap:6px;background:#fff8;color:#473977;border-radius:15px;padding:7px 10px;font-size:12px;font-weight:900}
.notice{padding:12px 14px;margin:12px 0;border-radius:15px;background:#f4edff;color:#493979;font-size:13px;line-height:1.45}
.notice.error{background:#fff0ed;color:#953d33}.notice.success{background:#e9f9e9;color:#27643c}
.feature-row{display:flex;gap:12px;align-items:center;border-radius:17px;padding:12px;background:white;border:1px solid #eeeaf6;margin:10px 0}
.feature-ico{display:grid;place-items:center;width:46px;height:46px;flex:none;border-radius:16px;background:#efe8ff;font-size:26px}
.quest-thumb{display:grid;place-items:center;height:92px;min-width:95px;border-radius:17px;font-size:50px;background:linear-gradient(135deg,#e0cbff,#c6eab5)}
.quest-item{display:flex;align-items:center;gap:14px;cursor:pointer}.quest-item h3{margin:4px 0}.quest-item p{margin:5px 0}
.quest-card{margin:12px 0;padding:15px;background:white;border:1px solid #e9e5f4;border-radius:22px}
.center{text-align:center}.dark-card{background:linear-gradient(125deg,#272342,#6243a3);color:#fff;border:0}
.dark-card .muted{color:#dbd3fa}.dark-card .hero-badge{color:#453777;background:#f5efff}
.story-dialog{font-weight:760;line-height:1.6;font-size:17px}.choice{width:100%;text-align:left}
.nav{position:fixed;left:50%;transform:translateX(-50%);max-width:490px;width:100%;bottom:0;z-index:10}
.nav button{min-width:59px;padding:6px;border-radius:11px}.nav button.active{background:#f4efff}
.nav button .icon{font-size:21px}.app-header .pill{border:0;cursor:pointer}
.header-user{font-size:12px;color:#595074;font-weight:800}
.chat-window{display:flex;flex-direction:column;gap:9px;min-height:120px;max-height:40vh;overflow:auto;padding:12px 3px}
.msg{word-break:break-word}.msg-time{font-size:10px;color:#8c8497;padding:3px 4px}.msg-status{font-size:10px;color:#6b5899;display:block;margin-top:5px}
.chat-compose textarea{min-height:94px}.chat-compose button{min-height:48px}
.skill{border-bottom:1px solid #eeeaf5;padding:14px 0;display:flex;gap:14px;align-items:center}
.skill:last-child{border-bottom:0}.skill .marker{width:37px;height:37px;border-radius:13px;display:grid;place-items:center;background:#eee8f9;flex:none}
.avatar-circle{width:52px;height:52px;display:grid;place-items:center;background:#e9defe;border-radius:50%;font-size:25px}
.screen{animation:appear .22s ease}.footer-note{color:#78738b;font-size:12px;line-height:1.5;margin-top:19px}.spacer12{height:12px}
.side-label{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:10px 0}
.breath{margin-bottom:22px}.micro{font-size:11px;color:#918b9f}.button-row{display:flex;gap:9px}.button-row button{flex:1}
.pill-btn{display:inline-flex;align-items:center;gap:6px;background:#ece7fa;border:0;border-radius:15px;padding:10px 14px;font-size:12px;color:#53428a;font-weight:900}
.admin-link{font-size:11px;color:#8478a3;text-decoration:underline}
@media(min-width:650px){.shell{border:5px solid #231e3b;overflow:visible;min-height:840px}.nav{border-radius:0 0 19px 19px;position:sticky;transform:none;left:unset;bottom:-2px;margin:-4px -18px -112px;width:calc(100% + 36px)}}
@media(prefers-reduced-motion:reduce){.screen{animation:none}*{scroll-behavior:auto!important}}

/* Daily return moment and closed contact chooser */
.friend-tabs{display:flex;gap:8px;overflow:auto;padding:8px 0 12px;scrollbar-width:thin}
.friend-tabs button.active{outline:2px solid #856ae2;outline-offset:1px}
.daily-card{border:1px solid #ab98ed;background:linear-gradient(140deg,#f4efff,#ffffff)}
.daily-card .story-dialog{background:#fff;border-radius:12px;padding:12px}

/* Seven-day life-situation journey, optimized for narrow mobile displays */
.week-hub{background:linear-gradient(140deg,#ebe1ff,#f3ffdc);padding:20px;border-radius:24px;margin:12px 0 20px;border:1px solid #dbcbf8}
.week-hub h2{font-size:24px;margin:10px 0}.week-hub p{font-size:14px}
.week-mini-rail{display:flex;gap:6px;justify-content:space-between;margin:16px 0 20px}
.week-dot{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;background:#f9f7fd;color:#79728d;font-size:13px;font-weight:900;border:1px solid #ddd2f4}
.week-dot.completed{color:white;background:#4d9f70;border-color:#4d9f70}
.week-dot.available{color:white;background:#7955dc;border-color:#7955dc;box-shadow:0 0 0 3px #d6c7ff}
.week-map{display:grid;gap:10px;margin:20px 0}.week-tile{display:flex;gap:12px;align-items:center;text-align:left;padding:14px;border-radius:19px;background:#fff;border:1px solid #e5def2;width:100%;min-height:88px}
.week-tile.available{border:2px solid #8b69e5;background:#f7f2ff}.week-tile.completed{background:#effbf2;border-color:#b9e0c3}
.week-tile:disabled{opacity:.65;cursor:default}.week-tile small{display:block;color:#6b6580;font-size:12px;margin-top:3px;line-height:1.4}
.week-tile-main{flex:1;min-width:0}.week-emoji{width:48px;height:48px;border-radius:16px;background:#eee4ff;display:grid;place-items:center;font-size:25px;flex:none}
.week-scene{height:170px;margin:12px 0 19px;background:radial-gradient(circle at 12% 25%,#e1f9a8,transparent 42%),linear-gradient(130deg,#b2a0ff,#7554d4)}
.choice-strip{display:flex;flex-wrap:wrap;gap:7px;margin:14px 0}.choice-strip button{flex:1;white-space:nowrap;min-height:44px}.choice-strip button.active{outline:2px solid #8a63ed;outline-offset:1px;background:#e6dbff}
@media(max-width:365px){.week-mini-rail{gap:3px}.week-dot{width:30px;height:30px}.week-tile{gap:8px;padding:11px}.week-emoji{width:39px;height:39px}}
