/* Black, champagne and ivory. All layout remains native HTML, not mockup screenshots. */
body{background:#e9dfce;color:#241e14} .app{background:#fff8ec}button{cursor:pointer}button:disabled{cursor:default}
.overlay-screen{max-width:480px;left:50%;right:auto;width:100%;transform:translateX(-50%);box-shadow:0 0 0 100vmax #17120c85;animation:none}
.overlay-body{padding:18px 18px 32px}.overlay-head{background:#15120e;color:#fff5df}.overlay-head .back-btn{color:#fff5df}
.item-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px}.item-card{min-width:0}.ic-box{max-height:105px}.item-card .ic-name{font-size:12px}
.dress-direct{position:absolute;bottom:18px;left:20px;display:flex;gap:9px;align-items:center;padding:11px 15px;border:1px solid #e1c58b;background:#19150ef2;color:#fff4db;border-radius:30px;font-size:13px;box-shadow:0 4px 15px #0002;min-height:44px}
.dress-direct>span:first-child{font-size:21px;color:#e1bd73}.daily-reward{position:relative;margin:0 0 16px;padding:18px;background:linear-gradient(130deg,#f3e4c6,#fffaf0);border:1px solid #dbc18f;border-radius:20px;box-shadow:0 8px 28px #8b682015}.reward-title{display:flex;align-items:center;gap:10px}.spark-medallion{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font-size:30px;background:#221b12;color:#efd28e}.eyebrow{font-size:10px;letter-spacing:1px;color:#88704b;font-weight:600}.reward-title h2{font-size:17px;margin:2px 0}.reward-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:12px 0}.reward-row p{margin:0;font-size:12px}.reward-row strong{font-size:26px;color:#604a27}.reward-row button{border:0;background:#211b12;color:#fff7e6;border-radius:24px;padding:12px;font-size:12px;min-height:44px}.reward-row button:disabled{background:#e9ddc5;color:#77654a}.muted{color:#96846a}.reward-track{height:5px;background:#e4d6bc;border-radius:8px;overflow:hidden}.reward-track span{display:block;height:100%;background:#aa7f34}.reward-foot{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:8px;font-size:10px;color:#736043}.reward-foot button{border:0;background:none;color:#604215;font-size:11px;min-height:36px}.demo-caption{display:block;font-size:11px;line-height:1.65;color:#7d6c52;margin:10px 0}.daily-reward>.demo-caption{margin:0}.studio-heading{margin:24px 2px 18px}.studio-heading h1{font-size:25px;letter-spacing:-.7px;margin:6px 0}.studio-heading p{font-size:14px;color:#82715a;margin:0}
.calendar-art{position:relative;overflow:hidden;background:radial-gradient(ellipse at 85% 10%,#70522a,#201b14 60%);color:#fff5dc;border:1px solid #d8bb80;border-radius:19px;min-height:140px;display:flex;align-items:center;padding:23px;margin-bottom:22px}.calendar-art>div{z-index:1}.calendar-art strong{display:block;font-size:24px;letter-spacing:-.5px;margin:5px 0}.calendar-art div>span{font-size:11px;letter-spacing:.5px;color:#e1c898}.calendar-art small{font-size:9px;color:#e0d0b5}.cal-moon{position:absolute;right:22px;top:-4px;font-family:Georgia,serif;font-size:117px;color:#ebd29a;text-shadow:0 0 25px #c4964950;transform:rotate(-18deg)}.orbit{position:absolute;width:230px;height:230px;border:1px solid #ddbe7740;border-radius:50%;right:-73px;top:-42px}.o2{width:280px;height:280px;right:-95px;top:-65px}
.segmented{display:flex;gap:4px;padding:4px;background:#f0e7d7;border-radius:30px;margin:14px 0 18px}.segmented button{flex:1;border:0;border-radius:25px;background:transparent;color:#695943;min-height:42px;font-size:13px;padding:8px 4px}.segmented button[aria-pressed=true]{background:#1e1a14;color:#fff7e7;box-shadow:0 3px 7px #20170518}.planner-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:20px 0 0}.planner-toolbar>button{width:44px;height:44px;background:#fffdf7;border:1px solid #e5d7bb;border-radius:50%;font-size:25px;color:#7c633d}.planner-toolbar strong{font-size:18px}.planner-today-row{text-align:center;margin:0 0 14px}.planner-today-row button{min-height:36px;background:none;border:none;font-size:11px;color:#9a763d}.planner-board{background:#fffdf8;border:1px solid #e6d8bc;border-radius:18px;overflow:hidden;box-shadow:0 8px 25px #91713908}.planner-week{display:grid;grid-template-columns:repeat(7,1fr);background:#f3ead8;border-bottom:1px solid #eaddc4;padding:13px 0;color:#8d785a;font-size:12px;text-align:center}.planner-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));padding:8px 5px}.planner-day{height:56px;min-width:0;border:none;border-bottom:1px solid #f5eee1;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;color:#332a1b;font-size:14px;position:relative;border-radius:8px}.planner-day>span{display:grid;place-items:center;width:28px;height:28px}.planner-day small{font-size:11px;line-height:10px}.planner-day.selected{background:#252017;color:#fff7de}.planner-day.is-today>span{border:1px solid #c09749;border-radius:50%}.mark-good{color:#aa7930}.mark-care{color:#a05f4c}.mark-neutral{color:#b6a88f}.selected .mark-good,.selected .mark-neutral{color:#e9cc8b}.planner-legend{display:flex;justify-content:center;gap:18px;padding:14px 4px;font-size:10px;color:#7e6b4d;border-top:1px solid #eee4d1}.selected-day-bar{display:flex;justify-content:space-between;align-items:center;padding:17px 2px}.selected-day-bar small{display:block;font-size:10px;color:#948163}.selected-day-bar strong{font-size:14px}.selected-day-bar button{border:0;background:none;color:#8b682b;font-size:12px;min-height:44px}.day-story{padding:20px;background:#fffdf7;border:1px solid #e8d9bc;border-radius:18px;margin-bottom:14px}.day-story-head{display:flex;align-items:center;gap:13px;margin-bottom:12px}.day-number{font-family:Georgia,serif;font-size:47px;color:#a68445;line-height:1}.day-story h2{font-size:16px;margin:4px 0;line-height:1.5}.sample-label{font-size:10px;background:#f6edda;color:#8d754a;border-radius:12px;padding:4px 9px}.day-advice{display:flex;gap:12px;padding-top:18px}.day-advice>span{color:#ab8036;font-size:24px;line-height:1}.day-advice strong{font-size:13px}.day-advice p{font-size:13px;color:#8a795e;line-height:1.7;margin:4px 0}.day-story details{border-top:1px solid #eee2cb;margin-top:15px;padding-top:12px;font-size:11px;color:#978464}.day-story details p{line-height:1.7;margin-top:10px}.year-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.year-card{position:relative;text-align:left;background:#fffdf7;border:1px solid #e4d6ba;border-radius:15px;padding:14px 10px;min-height:116px;overflow:hidden}.year-card small{font-size:10px;color:#ad9367}.year-card strong{display:block;font-size:12px;margin:8px 0}.year-card>span{position:absolute;right:9px;top:9px;color:#d8bd86;font-size:23px}.year-card em{font-style:normal;font-size:9px;color:#a18960}.year-card.chosen{background:#252016;color:#fff6df;border-color:#a58448}.calendar-disclaimer{padding:12px;background:#f4ebd9;border-radius:12px}
.studio-wallet{max-height:88svh;overflow-y:auto;background:#fff9ed;padding:20px 20px 30px}.wallet-key-card{background:radial-gradient(ellipse at 100% 0,#74552b,#1c1812 70%);padding:24px;border-radius:20px;border:1px solid #c8a665;position:relative;margin:18px 0 12px!important;color:#e9cb8d}.wallet-key-card:after{content:'⚿';font-size:79px;position:absolute;right:20px;top:8px;color:#d8b775}.wallet-key-card .num{color:#ecd097!important;font-size:42px!important}.wallet-key-card .unit{color:#e4d0a8!important}.spark-balance{display:flex;justify-content:space-between;align-items:center;padding:15px 18px;background:#f1e6ce;border-radius:13px;font-size:13px;color:#836636}.spark-balance strong{font-size:22px}.wallet-help{font-size:13px;line-height:1.7;color:#827153;margin:12px 0}.bundle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.bundle-card{min-width:0;padding:13px 6px;background:#fffdf7;border:1px solid #e1cea8;border-radius:15px;display:flex;flex-direction:column;align-items:center;gap:10px}.bundle-art{width:64px;height:75px;border-radius:50%;background:radial-gradient(#f0d89c,transparent 65%);display:flex;align-items:center;justify-content:center;font-size:43px;color:#ad8235;font-family:Georgia,serif}.b1{font-size:29px}.b2{font-size:23px}.bundle-card strong{font-size:13px}.bundle-card small{font-size:10px;line-height:1.7;color:#948267}.bundle-card>span:last-child{font-size:10px;color:#8d6528}.soft-card{background:#f5ecd9;border:1px solid #e5d4b2;padding:16px;border-radius:16px;margin-top:15px}.soft-card p{font-size:13px;line-height:1.7;margin:8px 0 15px}.line-row{display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:13px;padding:12px 0}.line-row small{display:block;font-size:10px;color:#9b896e}.spark-history{border-bottom:1px solid #e9ddc5}.exchange-art{display:flex;justify-content:center;gap:25px;align-items:center;padding:10px;color:#aa823e;font-size:50px}.exchange-art i{font-style:normal;font-size:22px;color:#c1ad89}.exchange-title{text-align:center;font-size:19px;margin:0}.exchange-title+.wallet-help{text-align:center}
.wallet-key-card:after{content:none}.wallet-key-art{position:absolute;width:62px;height:75px;right:24px;top:12px;transform:rotate(22deg);color:#e4c382}
.studio-heading{margin:18px 2px 12px}.studio-heading h1{font-size:23px;margin:3px 0}.studio-heading p{font-size:13px}.calendar-art{min-height:104px;padding:17px 20px;margin-bottom:13px}.calendar-art strong{font-size:22px}.calendar-art .cal-moon{font-size:96px;top:-12px}.planner-toolbar{margin-top:8px}.planner-today-row{margin-bottom:7px}.planner-day{height:48px}.planner-grid{padding:5px}.segmented{margin:12px 0}.planner-legend{padding:10px 4px}.planner-week{padding:10px 0}
@media(min-width:600px){body{padding:24px 0}.app{border-radius:26px;border:1px solid #dfd0b6;box-shadow:0 20px 60px #3a2b1820}.overlay-screen{top:24px;bottom:24px;border-radius:24px;overflow:hidden}.bottomnav{position:fixed!important;bottom:0!important;left:50%!important;transform:translateX(-50%);width:480px!important;border-radius:16px 16px 0 0}.sheet{max-width:480px}.app{padding-bottom:20px}}
@media(max-width:370px){.reward-title h2{font-size:15px}.reward-row button{font-size:11px}.reward-foot{font-size:9px}.planner-day{height:51px}.planner-legend{gap:11px}.studio-heading h1{font-size:23px}.year-card strong{font-size:11px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.calendar-art *,.daily-reward *{animation:none!important;transition:none!important}}