:root{
  --p1:#7eb8d4;--p1l:#dff0f8;--p1m:#aed4ea;--p1d:#2a5c78;
  --p2:#a084c8;--p2l:#ecdeff;--p2m:#cdb4ee;--p2d:#4a1e80;
  --p3:#e890b0;--p3l:#fde4f0;--p3m:#f4b8d4;--p3d:#882050;
  --p4:#6abcb0;--p4l:#d8f5f0;--p4m:#9ad8d0;--p4d:#1a6860;
  --p5:#f0a84a;--p5l:#fff2d8;--p5m:#f8cc88;--p5d:#7a4800;
  --pf:#ffebc0;--pt:#fdc8d8;--pb:#f8a8b8;--pc:#8a3a28;
  --uf:#c0eaf8;--ut:#b8f0e0;--ub:#70c8d8;--uc:#0a5060;
  --t1:var(--color-text-primary);--t2:var(--color-text-secondary);--t3:var(--color-text-tertiary);
  --bg:var(--color-background-primary);--bg2:var(--color-background-secondary);
  --bdr:var(--color-border-tertiary);--bdr2:var(--color-border-secondary);
  --r:var(--border-radius-lg);
  --safe-top:env(safe-area-inset-top,0px);--safe-bot:env(safe-area-inset-bottom,0px);
  --fs-base:14px;--fs-sm:12px;--fs-xs:11px;--fs-lg:16px;--fs-xl:18px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{font-family:'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;color:var(--t1);font-size:var(--fs-base)}
button{font-family:inherit;cursor:pointer;border:none;background:none}
input,select,textarea{font-family:inherit;font-size:var(--fs-base)}

.splash{height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:linear-gradient(155deg,var(--p1l),var(--bg),var(--p2l))}
.splash-flake{font-size:52px;animation:spin 4s linear infinite}
.splash-name{font-family:'DM Serif Display',serif;font-size:28px;color:var(--p1d)}
@keyframes spin{to{transform:rotate(360deg)}}

#root{height:100dvh;display:flex;flex-direction:column;max-width:480px;margin:0 auto}
.app-shell{display:flex;flex-direction:column;height:100dvh;overflow:hidden;
  background:linear-gradient(160deg,var(--p1l) 0%,var(--bg) 28%,var(--bg) 68%,var(--p2l) 100%)}

.app-header{padding:calc(var(--safe-top)+12px) 15px 0;flex-shrink:0;
  background:linear-gradient(118deg,rgba(223,240,248,.96),rgba(255,255,255,.9),rgba(236,222,255,.96));
  backdrop-filter:blur(14px);border-bottom:0.5px solid rgba(126,184,212,.18)}
.header-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.wordmark{display:flex;align-items:center;gap:7px;font-family:'DM Serif Display',serif;font-size:var(--fs-lg);
  background:linear-gradient(120deg,var(--p1d),var(--p2d));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.wicon{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,var(--p1),var(--p2));display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(126,184,212,.4)}
.wicon i{font-size:14px;color:#fff}
.streak-badge{font-size:var(--fs-xs);color:var(--p5d);background:linear-gradient(120deg,var(--p5l),var(--p3l));border:1px solid var(--p5m);padding:4px 10px;border-radius:20px;display:flex;align-items:center;gap:3px;font-weight:500}

.theme-strip{display:flex;align-items:center;gap:8px;padding:7px 15px;background:rgba(255,255,255,.55);border-bottom:0.5px solid var(--bdr)}
.theme-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--t3);flex-shrink:0}
.theme-dots{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.theme-dots::-webkit-scrollbar{display:none}
.theme-dot{width:20px;height:20px;border-radius:50%;cursor:pointer;border:2.5px solid transparent;flex-shrink:0;transition:transform .18s,box-shadow .18s}
.theme-dot.active{border-color:var(--t1);transform:scale(1.2);box-shadow:0 2px 8px rgba(0,0,0,.18)}

.nav-tabs{display:flex;overflow-x:auto;scrollbar-width:none}
.nav-tabs::-webkit-scrollbar{display:none}
.nav-tab{flex:1;min-width:44px;display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 2px 9px;font-size:11px;color:var(--t3);border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.nav-tab i{font-size:19px}
.nav-tab.active{color:var(--p1d);border-bottom-color:var(--p1)}
.nav-tab.active i{background:linear-gradient(135deg,var(--p1),var(--p2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

.content-area{flex:1;overflow-y:auto;overflow-x:hidden;padding:14px 13px 24px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.content-area::-webkit-scrollbar{display:none}
.page{display:none}.page.active{display:block}
.page-skills{background:linear-gradient(160deg,rgba(223,240,248,.2) 0%,transparent 40%)}
.page-log{background:linear-gradient(160deg,rgba(216,245,240,.2) 0%,transparent 40%)}
.page-goals{background:linear-gradient(160deg,rgba(253,228,240,.2) 0%,transparent 40%)}
.page-plan{background:linear-gradient(160deg,rgba(255,242,216,.2) 0%,transparent 40%)}
.page-video{background:linear-gradient(160deg,rgba(236,222,255,.2) 0%,transparent 40%)}
.page-notes{background:linear-gradient(160deg,rgba(218,245,236,.2) 0%,transparent 40%)}

.ph{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.pt{font-family:'DM Serif Display',serif;font-size:var(--fs-xl);color:var(--t1)}
.ph-right{display:flex;align-items:center;gap:6px}
.card{background:rgba(255,255,255,.75);border-radius:var(--r);padding:13px 14px;margin-bottom:10px}
.card-label{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.07em;color:var(--t3);margin-bottom:9px}

.btn-grad{font-size:var(--fs-xs);color:#fff;border-radius:20px;padding:6px 13px;display:flex;align-items:center;gap:3px;font-weight:500}
.btn-sky{background:linear-gradient(120deg,var(--p1),var(--p2));box-shadow:0 2px 6px rgba(126,184,212,.3)}
.btn-sage{background:linear-gradient(120deg,var(--p4),var(--p1))}
.btn-lav{background:linear-gradient(120deg,var(--p2),var(--p3))}
.btn-rose{background:linear-gradient(120deg,var(--p3),var(--p5))}
.btn-outline{font-size:var(--fs-xs);color:var(--p1d);background:rgba(223,240,248,.7);border-radius:20px;padding:5px 10px;display:flex;align-items:center;gap:3px}

.tag{font-size:var(--fs-xs);padding:3px 9px;border-radius:10px;font-weight:500;display:inline-block}
.tag-sage{background:var(--p4l);color:var(--p4d)}
.tag-sky{background:var(--p1l);color:var(--p1d)}
.tag-lav{background:var(--p2l);color:var(--p2d)}
.tag-amber{background:var(--p5l);color:var(--p5d)}

.view-toggle{display:flex;background:rgba(255,255,255,.75);border-radius:20px;padding:3px;gap:2px}
.vt-btn{height:30px;padding:0 12px;border-radius:15px;display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;color:var(--t3);font-size:var(--fs-xs);font-weight:500;transition:all .15s}
.vt-btn i{font-size:14px}
.vt-btn.active{background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff}

/* skills */
.stat3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:12px}
.sbox{border-radius:var(--r);padding:10px 5px;text-align:center}
.sbox-p{background:linear-gradient(135deg,var(--pf),var(--pt))}
.sbox-u{background:linear-gradient(135deg,var(--uf),var(--ut))}
.sbox-l{background:rgba(255,255,255,.55)}
.sv{font-size:20px;font-weight:500}.sl{font-size:10px;opacity:.7;margin-top:2px}
.cat-hdr{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.06em;color:var(--t3);margin:14px 0 7px;display:flex;align-items:center;gap:5px}
.cat-hdr i{font-size:15px}
.skill-row{display:flex;gap:4px;margin-bottom:6px;align-items:flex-start}
.skill-lv{font-size:10px;color:var(--t3);width:30px;text-align:right;flex-shrink:0;padding-top:6px;line-height:1.3}
.skill-chips{display:flex;flex-wrap:wrap;gap:5px}
.chip{font-size:var(--fs-sm);padding:5px 12px;border-radius:20px;cursor:pointer;white-space:nowrap;user-select:none;line-height:1.4;font-weight:500;transition:transform .1s}
.chip:active{transform:scale(.95)}
.chip-p{background:linear-gradient(120deg,var(--pf),var(--pt));color:var(--pc)}
.chip-u{background:linear-gradient(120deg,var(--uf),var(--ut));color:var(--uc)}
.chip-l{background:rgba(255,255,255,.45);color:var(--t3);font-weight:400}
.chip-parent{display:flex;align-items:center;gap:4px}
.chip-parent i{font-size:11px;transition:transform .2s}
.chip-parent.open i{transform:rotate(90deg)}
.sub-chips{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 6px 34px;animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}

/* radar */
.radar-wrap{display:flex;flex-direction:column;align-items:center;gap:16px}
.radar-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:100%}
.rcard{border-radius:var(--r);padding:12px 8px;text-align:center}
.rc1{background:linear-gradient(135deg,var(--p1l),var(--p2l))}
.rc2{background:linear-gradient(135deg,var(--p4l),var(--p1l))}
.rc3{background:linear-gradient(135deg,var(--p3l),var(--p5l))}
.rcard-name{font-size:var(--fs-sm);font-weight:500;margin-bottom:2px}
.rcard-pct{font-size:20px;font-weight:500}
.rbar-wrap{height:5px;border-radius:3px;margin:5px 0 3px;background:rgba(255,255,255,.6)}
.rbar-fill{height:5px;border-radius:3px}
.rcard-stat{font-size:10px;color:var(--t2)}

/* ice strip */
.ice-strip{border-radius:var(--r);padding:13px 15px;margin-bottom:13px;display:flex;align-items:center;gap:13px;background:linear-gradient(118deg,var(--p1l),var(--p2l),var(--p3l));cursor:pointer}
.ice-icon{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--p1),var(--p2));display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ice-icon i{font-size:18px;color:#fff}
.ice-val{font-size:22px;font-weight:500;background:linear-gradient(120deg,var(--p1d),var(--p2d));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.ice-lbl{font-size:11px;color:var(--p1d);opacity:.75}

/* log entries */
.log-entry{background:rgba(255,255,255,.82);border-radius:var(--r);padding:13px 14px;margin-bottom:10px}
.log-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}
.log-date{font-size:var(--fs-base);font-weight:500;color:var(--t1)}
.log-meta{font-size:var(--fs-xs);color:var(--t3);margin-top:2px}
.log-segment{margin-bottom:8px;padding-bottom:8px;border-bottom:0.5px solid rgba(0,0,0,.06)}
.log-segment:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.log-seg-label{font-size:var(--fs-sm);font-weight:500;color:var(--p1d);margin-bottom:3px}
.log-seg-text{font-size:var(--fs-base);color:var(--t2);line-height:1.7}
.entry-actions{display:flex;gap:6px;margin-top:9px;padding-top:9px;border-top:0.5px solid rgba(0,0,0,.06)}
.act-btn{flex:1;padding:6px;font-size:var(--fs-sm);border-radius:var(--r);background:rgba(255,255,255,.6);color:var(--t2);display:flex;align-items:center;justify-content:center;gap:3px}
.act-btn.del{color:var(--p3d)}
.type-pill{font-size:11px;padding:3px 10px;border-radius:10px;color:#fff;font-weight:500}
.pill-lesson{background:linear-gradient(120deg,var(--p1),var(--p2))}
.pill-free{background:linear-gradient(120deg,var(--p4),var(--p1))}

/* goals */
.goal-item{display:flex;gap:10px;align-items:flex-start;padding:11px 0;border-bottom:0.5px solid rgba(0,0,0,.06)}
.goal-item:last-child{border-bottom:none}
.goal-check{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--bdr2);flex-shrink:0;margin-top:1px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s}
.goal-check.done{background:linear-gradient(135deg,var(--p4),var(--p1));border-color:transparent}
.goal-check.done i{color:#fff;font-size:12px}
.goal-text{font-size:var(--fs-base);color:var(--t1);line-height:1.5}
.goal-text.crossed{text-decoration:line-through;opacity:.4}
.goal-date{font-size:var(--fs-xs);color:var(--t3);margin-top:2px}
.goal-badge{font-size:10px;padding:2px 9px;border-radius:8px;display:inline-block;margin-top:4px;font-weight:500;color:#fff}
.badge-long{background:linear-gradient(120deg,var(--p5),var(--p3))}
.badge-short{background:linear-gradient(120deg,var(--p1),var(--p2))}
.goal-act{font-size:var(--fs-xs);padding:3px 8px;border-radius:8px;background:rgba(255,255,255,.6);color:var(--t2)}
.goal-act.del{color:var(--p3d)}

/* plan */
.plan-prog-card{background:rgba(255,255,255,.75);border-radius:var(--r);padding:13px 15px;margin-bottom:13px}
.plan-prog-row{display:flex;justify-content:space-between;margin-bottom:6px;font-size:var(--fs-base);color:var(--t2)}
.plan-prog-val{font-weight:500;color:var(--p1d)}
.prog-bar-wrap{background:rgba(0,0,0,.06);border-radius:4px;height:6px}
.prog-bar-fill{background:linear-gradient(90deg,var(--p1),var(--p2));height:6px;border-radius:4px}
.daily-pct{font-size:var(--fs-xs);color:var(--t3);margin-top:5px;text-align:right}
.plan-day-block{margin-bottom:6px}
.plan-day-hdr{display:flex;align-items:center;gap:8px;padding:8px 0 5px;font-size:var(--fs-sm);font-weight:500;color:var(--t2)}
.plan-day-dot{width:7px;height:7px;border-radius:50%}
.plan-day-pct{margin-left:auto;font-size:10px;font-weight:500;color:var(--t3);background:rgba(255,255,255,.6);padding:2px 8px;border-radius:10px}
.pday-today .plan-day-dot{background:linear-gradient(135deg,var(--p5),var(--p3))}
.pday-today .plan-day-hdr{color:var(--p5d)}
.pday-today .plan-day-pct{color:var(--p5d);background:rgba(255,242,216,.7)}
.pday-up .plan-day-dot{background:linear-gradient(135deg,var(--p1m),var(--p2m))}
.pday-up .plan-day-hdr{color:var(--p1d)}
.pday-past .plan-day-dot{background:var(--bdr2)}
.pday-past .plan-day-hdr{color:var(--t3)}
.pday-past-toggle{font-size:10px;color:var(--p1d);background:var(--p1l);padding:2px 8px;border-radius:10px;cursor:pointer;margin-left:auto}
.plan-item{border-radius:var(--r);padding:10px 13px;margin-bottom:6px}
.pitem-done{background:linear-gradient(120deg,rgba(212,240,236,.55),rgba(223,240,248,.45));border-left:3px solid var(--p4);opacity:.65}
.pitem-today{background:linear-gradient(120deg,rgba(255,242,216,.65),rgba(253,228,240,.55));border-left:3px solid var(--p5)}
.pitem-up{background:linear-gradient(120deg,rgba(223,240,248,.55),rgba(236,222,255,.45));border-left:3px solid var(--p2m)}
.pitem-past{background:rgba(255,255,255,.4);border-left:3px solid var(--bdr2)}
.plan-item-name{font-size:var(--fs-base);font-weight:500;color:var(--t1)}
.plan-item-detail{font-size:var(--fs-sm);color:var(--t2);margin-top:3px}
.plan-badge{font-size:10px;padding:2px 8px;border-radius:8px;margin-right:5px;font-weight:500;color:#fff;display:inline-block}
.pb-land{background:linear-gradient(120deg,#b8a0c8,#a090b8)}
.pb-warmup{background:linear-gradient(120deg,var(--p4),var(--p1))}
.pb-step{background:linear-gradient(120deg,var(--p5),#e8b840)}
.pb-spin{background:linear-gradient(120deg,var(--p1),var(--p4))}
.pb-jump{background:linear-gradient(120deg,var(--p2),var(--p3))}
.pitem-actions{display:flex;gap:5px;margin-top:8px}
.pitem-act{flex:1;padding:6px;font-size:var(--fs-xs);border-radius:8px;background:rgba(255,255,255,.55);color:var(--t2);display:flex;align-items:center;justify-content:center;gap:3px}
.pitem-act.done-btn{background:linear-gradient(120deg,var(--p4),var(--p1));color:#fff;font-weight:500}
.pitem-act.undone-btn{color:var(--p4d)}
.pitem-act.del-btn{color:var(--p3d)}
.fab{position:sticky;bottom:0;display:flex;justify-content:flex-end;padding:10px 2px;pointer-events:none}
.fab-btn{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--p1),var(--p2));display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(126,184,212,.5);pointer-events:all}
.fab-btn i{font-size:24px;color:#fff}

/* plan gen card */
.plan-gen-card{background:rgba(255,255,255,.9);border-radius:var(--r);overflow:hidden;margin-bottom:13px}
.pgc-hdr{padding:12px 15px;background:linear-gradient(120deg,var(--p1m),var(--p2m));display:flex;align-items:center;justify-content:space-between}
.pgc-title{font-family:'DM Serif Display',serif;font-size:var(--fs-base);color:var(--p1d)}
.pgc-sub{font-size:10px;color:var(--p1d);opacity:.75;margin-top:2px}
.pgc-row{display:flex;align-items:stretch;border-bottom:0.5px solid rgba(0,0,0,.06)}
.pgc-row:last-child{border-bottom:none}
.pgc-day{width:32px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:var(--fs-sm);font-weight:500;color:var(--t3);background:rgba(255,255,255,.4)}
.pgc-day.hl{color:#fff;background:linear-gradient(135deg,var(--p1),var(--p2))}
.pgc-content{flex:1;padding:8px 12px}
.pgc-name{font-size:var(--fs-sm);font-weight:500;color:var(--t1)}
.pgc-detail{font-size:10px;color:var(--t2);margin-top:1px}
.pgc-footer{padding:8px 15px;font-size:10px;color:var(--t3);display:flex;align-items:center;gap:5px}

/* weekly report */
.report-card{background:rgba(255,255,255,.92);border-radius:var(--r);overflow:hidden;margin-bottom:13px}
.report-hdr{padding:16px 16px 12px;background:linear-gradient(135deg,var(--p1l),var(--p2l))}
.report-title{font-family:'DM Serif Display',serif;font-size:20px;color:var(--p1d)}
.report-sub{font-size:var(--fs-xs);color:var(--p1d);opacity:.7;margin-top:3px}
.report-section{padding:12px 16px;border-bottom:0.5px solid rgba(0,0,0,.06)}
.report-section:last-child{border-bottom:none}
.report-sec-title{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.07em;color:var(--t3);margin-bottom:8px}
.report-stat-row{display:flex;gap:8px}
.report-stat{flex:1;background:rgba(255,255,255,.6);border-radius:10px;padding:10px 8px;text-align:center}
.report-stat-val{font-size:20px;font-weight:500;color:var(--p1d)}
.report-stat-lbl{font-size:10px;color:var(--t3);margin-top:2px}
.report-log-item{font-size:var(--fs-sm);color:var(--t2);padding:4px 0;border-bottom:0.5px solid rgba(0,0,0,.04)}
.report-log-item:last-child{border-bottom:none}

/* calendar */
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:10px}
.cal-hdr{font-size:10px;font-weight:500;color:var(--t3);text-align:center;padding:4px 0}
.cal-day{aspect-ratio:1;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:var(--fs-xs);cursor:pointer;transition:all .15s;position:relative}
.cal-day.has-log{background:linear-gradient(135deg,var(--p1l),var(--p2l));color:var(--p1d);font-weight:500}
.cal-day.today{background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff;font-weight:500}
.cal-day.other-month{color:var(--t3);opacity:.4}
.cal-day.selected{box-shadow:0 0 0 2px var(--p1)}
.cal-month-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.cal-month-title{font-size:var(--fs-base);font-weight:500;color:var(--t1)}
.cal-nav-btn{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.7);color:var(--t2);display:flex;align-items:center;justify-content:center;font-size:16px}

/* video */
.vid-tabs{display:flex;gap:6px;margin-bottom:13px}
.vid-tab{font-size:var(--fs-sm);padding:5px 13px;border-radius:20px;background:rgba(255,255,255,.6);color:var(--t2);cursor:pointer;font-weight:500}
.vid-tab.active{background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff}
.upload-zone{border:1.5px dashed var(--p1m);border-radius:var(--r);padding:22px;text-align:center;color:var(--t3);font-size:var(--fs-sm);cursor:pointer;margin-bottom:13px;background:linear-gradient(135deg,rgba(223,240,248,.35),rgba(236,222,255,.35))}
.upload-zone i{font-size:28px;display:block;margin-bottom:7px;color:var(--p1d)}
.vid-card{background:rgba(255,255,255,.85);border-radius:var(--r);overflow:hidden;margin-bottom:11px}
.vid-thumb{height:115px;display:flex;align-items:center;justify-content:center;position:relative;cursor:pointer}
.vt-sky{background:linear-gradient(135deg,var(--p1l),var(--p2l))}
.vid-thumb i{font-size:34px;color:var(--p1d)}
.vid-dur{position:absolute;bottom:7px;right:8px;background:rgba(42,92,120,.7);color:#fff;font-size:10px;padding:2px 7px;border-radius:4px}
.vid-body{padding:12px 14px}
.vid-title{font-size:var(--fs-base);font-weight:500;color:var(--t1)}
.vid-meta{font-size:var(--fs-xs);color:var(--t3);margin-top:2px}
.vid-note{font-size:var(--fs-sm);color:var(--t2);line-height:1.6;margin-top:8px;padding:8px 11px;border-radius:var(--border-radius-md);border-left:2.5px solid var(--p1);background:linear-gradient(120deg,rgba(223,240,248,.4),rgba(236,222,255,.4))}
.vid-actions{display:flex;gap:6px;margin-top:9px;padding-top:9px;border-top:0.5px solid rgba(0,0,0,.06)}
.vid-act{flex:1;padding:7px;font-size:var(--fs-xs);border-radius:var(--border-radius-md);color:var(--t2);display:flex;align-items:center;justify-content:center;gap:4px;cursor:pointer;background:rgba(255,255,255,.6)}
.vid-act.primary{background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff;font-weight:500}
.vid-act.del{color:var(--p3d)}
.skill-timeline{margin-bottom:19px}
.tl-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
.tl-name{font-size:var(--fs-base);font-weight:500;color:var(--t1)}
.tl-count{font-size:var(--fs-xs);color:var(--t3)}
.tl-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;align-items:flex-start;scrollbar-width:none}
.tl-row::-webkit-scrollbar{display:none}
.tl-thumb{flex-shrink:0;width:74px;cursor:pointer}
.tl-img{width:74px;height:54px;border-radius:var(--border-radius-md);display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.6)}
.tl-img.good{background:linear-gradient(135deg,var(--p4l),var(--p1l))}
.tl-img.recent{background:linear-gradient(135deg,var(--p1l),var(--p2l))}
.tl-img i{font-size:21px;color:var(--t3)}
.tl-img.good i{color:var(--p4d)}
.tl-img.recent i{color:var(--p2d)}
.tl-date{font-size:10px;color:var(--t3);margin-top:3px;text-align:center}
.tl-note{font-size:10px;color:var(--t2);margin-top:1px;text-align:center;line-height:1.3}
.tl-arrow{display:flex;align-items:center;padding-top:17px;color:var(--t3);font-size:15px}

/* notes */
.note-card{background:rgba(255,255,255,.82);border-radius:var(--r);padding:14px 15px;margin-bottom:10px}
.note-teacher{font-size:var(--fs-sm);font-weight:500;margin-bottom:6px}
.note-topic{font-size:var(--fs-base);font-weight:500;color:var(--t1);margin-bottom:9px}
.note-segment{margin-bottom:8px;padding-bottom:8px;border-bottom:0.5px solid rgba(0,0,0,.06)}
.note-segment:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.note-seg-label{font-size:var(--fs-sm);font-weight:500;color:var(--p1d);margin-bottom:4px;display:flex;align-items:center;gap:5px}
.note-seg-label i{font-size:13px}
.note-seg-label.warn i{background:linear-gradient(135deg,var(--p3),var(--p5));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.note-seg-label.key i{background:linear-gradient(135deg,var(--p1),var(--p2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.note-seg-text{font-size:var(--fs-base);color:var(--t2);line-height:1.7}
.note-card-acts{display:flex;gap:6px;margin-top:9px;padding-top:9px;border-top:0.5px solid rgba(0,0,0,.06)}
.note-act{flex:1;padding:6px;font-size:var(--fs-xs);border-radius:8px;background:rgba(255,255,255,.55);color:var(--t2);display:flex;align-items:center;justify-content:center;gap:3px}
.note-act.del{color:var(--p3d)}

/* skill detail panel */
.skill-detail-logs{margin-top:10px}
.skill-log-item{background:rgba(255,255,255,.7);border-radius:10px;padding:10px 12px;margin-bottom:7px;font-size:var(--fs-sm);color:var(--t2);line-height:1.6}
.skill-log-item .sdl-date{font-size:10px;color:var(--t3);margin-bottom:3px}
.skill-log-item .sdl-src{font-size:10px;color:var(--p1d);font-weight:500;margin-bottom:4px}

/* modal */
.modal-overlay{position:fixed;inset:0;z-index:100;display:flex;align-items:flex-end;justify-content:center;animation:overlayIn .22s ease both}
@keyframes overlayIn{from{background:rgba(30,30,60,0);backdrop-filter:blur(0)}to{background:rgba(30,30,60,.38);backdrop-filter:blur(8px)}}
.modal-sheet{background:linear-gradient(160deg,rgba(223,240,248,.55) 0%,var(--bg) 18%);border-radius:22px 22px 0 0;width:100%;max-width:480px;padding:6px 16px calc(var(--safe-bot)+24px);max-height:92dvh;overflow-y:auto;animation:sheetUp .3s cubic-bezier(.32,.72,0,1) both;-webkit-overflow-scrolling:touch}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.modal-handle{width:40px;height:4px;background:linear-gradient(90deg,var(--p1m),var(--p2m));border-radius:2px;margin:10px auto 16px;opacity:.6}
.modal-title{font-family:'DM Serif Display',serif;font-size:20px;color:var(--t1);margin-bottom:18px}
.form-group{margin-bottom:15px}
.form-label{font-size:var(--fs-sm);font-weight:500;color:var(--t2);margin-bottom:7px;display:block}
.form-input{width:100%;background:rgba(255,255,255,.9);border:none;border-bottom:1.5px solid var(--bdr2);border-radius:0;padding:10px 2px 9px;font-size:var(--fs-lg);color:var(--t1);outline:none;transition:border-color .2s;-webkit-appearance:none}
.form-input:focus{border-bottom-color:var(--p1)}
select.form-input{background:rgba(255,255,255,.9);border-radius:10px;border:1px solid var(--bdr2);padding:10px 11px;font-size:var(--fs-base)}
select.form-input:focus{border-color:var(--p1)}
.form-textarea{min-height:90px;resize:none;border:1.5px solid var(--bdr2);border-radius:12px;padding:11px 13px;font-size:var(--fs-base);line-height:1.7}
.form-textarea:focus{border-color:var(--p1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.chip-selector{display:flex;flex-wrap:wrap;gap:6px;margin-top:2px}
.chip-sel{font-size:var(--fs-sm);padding:6px 13px;border-radius:20px;background:rgba(255,255,255,.75);color:var(--t2);cursor:pointer;transition:all .15s;border:1px solid var(--bdr2)}
.chip-sel.selected{background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff;font-weight:500;border-color:transparent}
.btn-submit{width:100%;padding:14px;background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff;border-radius:14px;font-size:var(--fs-lg);font-weight:500;margin-top:10px;box-shadow:0 4px 16px rgba(126,184,212,.4);transition:opacity .15s,transform .12s}
.btn-submit:active{opacity:.88;transform:scale(.99)}
.btn-cancel{width:100%;padding:10px;font-size:var(--fs-sm);color:var(--t3);margin-top:4px}

/* multi-segment input */
.seg-block{background:rgba(255,255,255,.6);border-radius:12px;padding:12px 13px;margin-bottom:10px;position:relative}
.seg-skill-label{font-size:var(--fs-sm);font-weight:500;color:var(--p1d);margin-bottom:6px;display:flex;align-items:center;justify-content:space-between}
.seg-remove{font-size:18px;color:var(--p3d);cursor:pointer;line-height:1;padding:0 2px}
.seg-type-row{display:flex;gap:6px;margin-bottom:8px}
.seg-type-btn{flex:1;padding:6px;font-size:var(--fs-xs);border-radius:8px;background:rgba(255,255,255,.6);color:var(--t2);display:flex;align-items:center;justify-content:center;gap:3px;transition:all .15s}
.seg-type-btn.active-key{background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff}
.seg-type-btn.active-warn{background:linear-gradient(120deg,var(--p3),var(--p5));color:#fff}
.add-seg-btn{width:100%;padding:10px;font-size:var(--fs-sm);color:var(--p1d);background:rgba(223,240,248,.5);border-radius:12px;border:1.5px dashed var(--p1m);display:flex;align-items:center;justify-content:center;gap:5px;margin-top:4px;cursor:pointer}

/* manage modal */
.manage-row{padding:9px 0;border-bottom:0.5px solid rgba(0,0,0,.06)}
.manage-row:last-child{border-bottom:none}
.manage-row-main{display:flex;align-items:center;gap:6px;margin-bottom:6px}
.manage-skill-name{font-size:var(--fs-sm);font-weight:500;color:var(--t1)}
.manage-skill-en{font-size:10px;color:var(--t3)}
.manage-row-controls{display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.manage-sel{font-size:var(--fs-xs);padding:4px 7px;border-radius:8px;background:rgba(255,255,255,.8);color:var(--t1);border:0.5px solid var(--bdr2);outline:none}
.manage-hide-btn{font-size:10px;padding:4px 9px;border-radius:8px;background:rgba(255,242,216,.7);color:var(--p5d);cursor:pointer}
.manage-show-btn{font-size:10px;padding:4px 9px;border-radius:8px;background:rgba(216,245,240,.7);color:var(--p4d);cursor:pointer}
.manage-del-btn{font-size:10px;padding:4px 9px;border-radius:8px;background:rgba(253,228,240,.7);color:var(--p3d);cursor:pointer}
.add-skill-input{flex:1;background:rgba(255,255,255,.88);border:1px solid var(--bdr2);border-radius:var(--border-radius-md);padding:8px 11px;font-size:var(--fs-sm);color:var(--t1);outline:none;min-width:0}
.add-skill-btn{padding:8px 15px;background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff;font-size:var(--fs-sm);border-radius:var(--border-radius-md);font-weight:500;white-space:nowrap;cursor:pointer}

/* ── FONT SIZE BUMP ── */
body { font-size: 15px; }
.chip { font-size: 12px; padding: 5px 12px; }
.nav-tab { font-size: 11px; }
.tag { font-size: 11px; }
.plan-item-name { font-size: 13px; }
.plan-item-detail { font-size: 11px; }
.log-date { font-size: 14px; }
.log-body,.log-seg-text { font-size: 13px; line-height: 1.7; }
.note-pt { font-size: 13px; }
.goal-text { font-size: 13px; }
.form-input { font-size: 15px; }
.modal-title { font-size: 20px; }
.pt { font-size: 17px; }

/* ── LOG SEGMENTS ── */
.log-segments { margin-top: 6px; }
.log-seg { margin-bottom: 6px; line-height: 1.7; font-size: 13px; color: var(--t2); }
.log-seg-label { font-weight: 500; color: var(--t1); margin-right: 2px; }
.log-seg-text { color: var(--t2); }

/* ── SEGMENT EDITOR ── */
.seg-row { background: rgba(255,255,255,.65); border-radius: var(--r); padding: 10px 12px; margin-bottom: 10px; }
.seg-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.seg-skill-btn {
  flex: 1; text-align: left; font-size: 13px; font-weight: 500;
  color: var(--p1d); background: var(--p1l); border-radius: 20px;
  padding: 5px 12px; cursor: pointer; border: none;
}
.seg-type-toggle { display: flex; gap: 4px; }
.seg-type-btn {
  width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  border: none; background: rgba(255,255,255,.7); color: var(--t3); cursor: pointer; font-size: 14px;
}
.seg-type-btn.active { background: linear-gradient(135deg,var(--p1),var(--p2)); color: #fff; }
.seg-type-btn:last-child.active { background: linear-gradient(135deg,var(--p3),var(--p5)); }
.seg-del-btn { width: 28px; height: 28px; border-radius: 50%; border: none; background: rgba(232,144,176,.15); color: var(--p3d); cursor: pointer; display: flex; align-items: center; justify-content: center; }
.seg-text { width: 100%; min-height: 72px; }
.seg-add-btn {
  width: 100%; padding: 10px; margin-top: 4px;
  border: 1.5px dashed var(--p1m); border-radius: var(--r);
  background: rgba(223,240,248,.3); color: var(--p1d);
  font-size: 13px; cursor: pointer;
}

/* ── NOTE SEGMENTS ── */
.note-skill-label { font-weight: 500; color: var(--t1); margin-right: 3px; }

/* ── SUB SKILL PICKER ── */
.sp-cat-label { font-size: 11px; text-transform: uppercase; letter-spacing: .06em; color: var(--t3); margin: 12px 0 6px; display: flex; align-items: center; gap: 5px; }
.sp-parent-group { display: inline-block; margin: 2px; }
.sp-parent { cursor: pointer; }
.sp-subs { display: none; flex-wrap: wrap; gap: 4px; padding: 6px 8px; margin-top: 4px; background: rgba(255,255,255,.5); border-radius: var(--border-radius-md); }
.sp-subs-open { display: flex; }
.sp-sub { font-size: 11px; padding: 3px 9px; }

/* ── SKILL MODAL LINKED ENTRIES ── */
.sub-skill-row { display: flex; align-items: center; justify-content: space-between; padding: 6px 0; border-bottom: 0.5px solid var(--bdr); }
.sub-skill-row:last-child { border-bottom: none; }
.sub-skill-name { font-size: 12px; color: var(--t1); }
.linked-entry { background: rgba(255,255,255,.6); border-radius: var(--border-radius-md); padding: 8px 10px; margin-bottom: 6px; }
.linked-date { font-size: 11px; color: var(--t3); margin-bottom: 4px; }
.linked-text { font-size: 12px; color: var(--t2); line-height: 1.6; }
.linked-warn { color: var(--p3d); }

/* ── PLAN PAST SECTION ── */
.past-section { margin-top: 8px; }
.past-toggle {
  width: 100%; text-align: left; padding: 10px 14px;
  background: rgba(255,255,255,.5); border-radius: var(--r);
  font-size: 13px; color: var(--t3); cursor: pointer; border: none;
  display: flex; align-items: center; gap: 6px;
}
.past-toggle.open i { transform: rotate(90deg); }
.past-toggle i { transition: transform .2s; }
.past-content { display: none; padding-top: 6px; }
.past-content.open { display: block; }
.pitem-past { background: rgba(255,255,255,.4); border-left: 3px solid var(--bdr2); opacity: .7; }

/* ── WEEKLY REPORT ── */
.report-header { margin-bottom: 14px; }
.report-week { font-size: 13px; color: var(--t3); }
.report-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-bottom: 16px; }
.report-stat { background: linear-gradient(135deg,var(--p1l),var(--p2l)); border-radius: var(--r); padding: 12px 8px; text-align: center; }
.report-stat-val { font-size: 24px; font-weight: 500; color: var(--p1d); }
.report-stat-unit { font-size: 13px; font-weight: 400; }
.report-stat-lbl { font-size: 11px; color: var(--t3); margin-top: 2px; }
.report-section-title { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--t3); margin: 12px 0 6px; }
.report-skills { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 10px; }
.report-logs { max-height: 28vh; overflow-y: auto; }
.report-log { background: rgba(255,255,255,.65); border-radius: var(--border-radius-md); padding: 8px 10px; margin-bottom: 6px; }
.report-log-date { font-size: 11px; color: var(--t3); margin-bottom: 3px; }
.report-log-seg { font-size: 12px; color: var(--t2); line-height: 1.6; }

/* ── ICE CALENDAR ── */
.cal-nav { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.cal-nav-btn { width: 32px; height: 32px; border-radius: 50%; border: none; background: rgba(255,255,255,.7); color: var(--t2); display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 15px; }
.cal-month-label { font-size: 15px; font-weight: 500; color: var(--t1); }
.cal-weekdays { display: grid; grid-template-columns: repeat(7,1fr); margin-bottom: 4px; }
.cal-wd { text-align: center; font-size: 11px; color: var(--t3); padding: 4px 0; }
.cal-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }
.cal-cell { aspect-ratio: 1; border-radius: 8px; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; position: relative; }
.cal-cell:hover { background: rgba(126,184,212,.15); }
.cal-day { font-size: 13px; color: var(--t2); }
/* cal-today handled by cal-today-day span */
.cal-has-log { background: linear-gradient(135deg,var(--p1l),var(--p2l)); border-radius: 8px; }
.cal-has-log .cal-day { color: var(--p1d); font-weight: 600; }
.cal-dot { width: 5px; height: 5px; border-radius: 50%; background: linear-gradient(135deg,var(--p1),var(--p2)); margin-top: 1px; }
.cal-today-day { color: #fff !important; font-weight: 700 !important;
  background: linear-gradient(135deg,var(--p1),var(--p2)); border-radius: 50%;
  width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;
  font-size: 13px; }
.cal-empty { }
.cal-month-stat { font-size: 12px; color: var(--t3); text-align: center; margin: 10px 0 6px; }
.cal-detail { margin-top: 8px; max-height: 20vh; overflow-y: auto; }
.cal-log-item { background: rgba(255,255,255,.65); border-radius: var(--border-radius-md); padding: 8px 10px; margin-bottom: 6px; }
.cal-log-date { font-size: 11px; color: var(--t3); margin-bottom: 3px; }
.cal-log-seg { font-size: 12px; color: var(--t2); line-height: 1.5; }

/* ── PLAN TEMPLATE CHIPS ── */
.plan-tpl-chip { font-size: 12px; padding: 4px 11px; border-radius: 20px; background: rgba(255,255,255,.75); color: var(--t2); cursor: pointer; display: inline-block; margin: 2px; border: 1px solid var(--bdr2); }
.plan-tpl-chip:hover { background: linear-gradient(120deg,var(--p1l),var(--p2l)); color: var(--p1d); }

/* ── STREAK BADGE clickable ── */
.streak-badge { cursor: pointer; }
.streak-badge:active { opacity: .8; }

/* ── BTN ROSE ── */
.btn-rose { background: linear-gradient(120deg,var(--p3),var(--p5)); box-shadow: 0 2px 6px rgba(232,144,176,.3); }

/* ── RICH EDITOR ── */
.rich-editor-wrap { border-bottom: 1.5px solid var(--bdr2); margin-bottom: 4px; }
.rich-editor {
  width: 100%; min-height: 100px; padding: 10px 2px 8px;
  font-size: 15px; color: var(--t1); outline: none;
  line-height: 1.7; word-break: break-word;
}
.rich-editor:focus { border-bottom-color: var(--p1); }
.rich-editor:empty::before {
  content: attr(data-placeholder); color: var(--t3); pointer-events: none;
}

/* ── INLINE SKILL TAGS ── */
.inline-skill-tag {
  display: inline-flex; align-items: center; gap: 3px;
  font-size: 12px; padding: 2px 8px; border-radius: 12px;
  font-weight: 500; cursor: default; margin: 0 2px;
  vertical-align: middle; line-height: 1.4;
}
.tag-remove-btn {
  background: none; border: none; cursor: pointer; font-size: 12px;
  color: inherit; opacity: .7; padding: 0 0 0 2px; line-height: 1;
}
.tag-remove-btn:hover { opacity: 1; }

/* ── SKILL PICKER PANEL ── */
.skill-picker-panel {
  background: rgba(255,255,255,.6); border-radius: var(--r);
  border: 0.5px solid var(--bdr2); margin-top: 8px;
  overflow: hidden;
}
.skill-picker-scroll {
  max-height: 36vh; overflow-y: auto; padding: 10px 12px;
  scrollbar-width: thin;
}
.sp-cat-label {
  font-size: 10px; text-transform: uppercase; letter-spacing: .07em;
  color: var(--t3); margin: 10px 0 5px; display: flex; align-items: center; gap: 4px;
}
.sp-cat-label:first-child { margin-top: 0; }
.sp-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 4px; }
.sp-chip { font-size: 11px; padding: 3px 10px; cursor: pointer; transition: all .12s; }
.sp-chip:hover { background: rgba(255,255,255,.7); }
.sp-chip.selected { background: linear-gradient(120deg,var(--pf),var(--pt)) !important; color: var(--pc) !important; }
.sp-sub-group {
  display: none; flex-wrap: wrap; gap: 3px;
  padding: 5px 8px; margin: 3px 0 5px;
  background: rgba(255,255,255,.4); border-radius: var(--border-radius-md);
  border-left: 2px solid var(--p1m);
}
/* Sub groups shown by default in picker for log/note */
.skill-picker-panel .sp-sub-group { display: flex; }
.sp-sub-chip { font-size: 10px; padding: 2px 8px; }

/* ── NOTE TYPE TOGGLE ── */
.note-type-row { display: flex; gap: 8px; margin-bottom: 10px; }
.note-type-btn {
  flex: 1; padding: 8px; border-radius: 10px; border: 1.5px solid var(--bdr2);
  background: rgba(255,255,255,.7); color: var(--t2); font-size: 13px;
  cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 5px;
  transition: all .15s;
}
.note-type-btn.active { border-color: var(--p1); color: var(--p1d); background: var(--p1l); }
.note-type-btn#note-type-warn.active { border-color: var(--p3); color: var(--p3d); background: var(--p3l); }

/* ── NOTE DISPLAY ── */
.note-body { margin: 6px 0 8px; }
.note-pt { display: flex; gap: 6px; padding: 4px 0; font-size: 13px; color: var(--t2); line-height: 1.6; align-items: flex-start; }
.note-pt i { font-size: 15px; flex-shrink: 0; margin-top: 1px; }
/* FIX: restore star/warn icon colors */
.note-pt.key i {
  background: linear-gradient(135deg, var(--p1), var(--p2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.note-pt.warn i {
  background: linear-gradient(135deg, var(--p3), var(--p5));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

/* ── WEEKLY REPORT REDESIGN ── */
.report-card { }
.report-top-banner {
  background: linear-gradient(120deg, var(--p1), var(--p2));
  border-radius: 16px; padding: 18px 20px; margin-bottom: 16px;
  display: flex; align-items: center; justify-content: space-between;
}
.report-banner-text { }
.report-week-label { font-size: 11px; color: rgba(255,255,255,.8); margin-bottom: 4px; }
.report-week-range { font-family: 'DM Serif Display', serif; font-size: 20px; color: #fff; }
.report-banner-icon { font-size: 36px; color: rgba(255,255,255,.35); }
.report-stats-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 16px; }
.report-stat-box {
  border-radius: 14px; padding: 14px 8px; text-align: center;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.report-stat-ice { background: linear-gradient(135deg, var(--p1l), var(--p2l)); }
.report-stat-sessions { background: linear-gradient(135deg, var(--p4l), var(--p1l)); }
.report-stat-plan { background: linear-gradient(135deg, var(--p2l), var(--p3l)); }
.report-stat-icon { font-size: 20px; color: var(--p1d); margin-bottom: 2px; }
.report-stat-num { font-size: 26px; font-weight: 600; color: var(--p1d); line-height: 1; }
.report-stat-u { font-size: 13px; font-weight: 400; }
.report-stat-lbl { font-size: 11px; color: var(--t3); }
.report-stat-plan .report-stat-num { font-size: 16px; }
.report-section { margin-bottom: 14px; }
.report-section-title {
  font-size: 12px; font-weight: 500; color: var(--t2);
  display: flex; align-items: center; gap: 5px;
  margin-bottom: 8px; text-transform: uppercase; letter-spacing: .05em;
}
.report-skills { display: flex; flex-wrap: wrap; gap: 5px; }
.report-skill-count { font-size: 10px; opacity: .75; margin-left: 2px; }
.report-logs { max-height: 24vh; overflow-y: auto; }
.report-log-row {
  background: rgba(255,255,255,.65); border-radius: 10px;
  padding: 8px 12px; margin-bottom: 6px;
}
.report-log-meta { font-size: 11px; color: var(--t3); margin-bottom: 3px; }
.report-log-preview { font-size: 12px; color: var(--t2); line-height: 1.5; }

/* ── REPORT ACTIONS ── */
.report-actions {
  display: flex; gap: 10px; margin-top: 14px;
}
.report-action-btn {
  flex: 2; height: 48px; font-size: 14px; border-radius: 14px;
  display: flex; align-items: center; justify-content: center; gap: 6px;
}
.report-close-btn {
  flex: 1; height: 48px; font-size: 14px; border-radius: 14px;
  background: rgba(255,255,255,.65); color: var(--t2);
  border: 0.5px solid var(--bdr2); cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}

/* ── REMOVE PH title-only rows that are now empty ── */
.ph:empty { display: none; }
.ph { min-height: 0; }
/* If ph only has empty span + buttons, still show for buttons */

/* ── FIX: rich editor font size matches form ── */
.rich-editor {
  font-size: 15px !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  line-height: 1.65;
  color: var(--t1);
}
.rich-editor * { font-size: 15px; font-family: inherit; }
.inline-skill-tag { font-size: 12px !important; }

/* ── FIX: chip on its own line in display ── */
.rich-chip-line {
  display: block;
  margin: 3px 0;
}
.rich-text-body {
  display: block;
  font-size: 13px;
  line-height: 1.7;
  color: var(--t2);
  margin: 2px 0;
}

/* ── FIX: note type indicator ── */
.note-type-indicator {
  display: flex; align-items: center; gap: 5px;
  margin-bottom: 6px;
}
.note-type-indicator i { font-size: 15px; }
.note-type-indicator.key i {
  background: linear-gradient(135deg, var(--p1), var(--p2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.note-type-indicator.warn i {
  background: linear-gradient(135deg, var(--p3), var(--p5));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.note-rich-content {
  font-size: 13px; color: var(--t2); line-height: 1.7;
}

/* ── ROW EDITOR ── */
.row-editor { display: flex; flex-direction: column; gap: 8px; margin-bottom: 8px; }

.re-row {
  background: rgba(255,255,255,.65);
  border-radius: var(--r); padding: 8px 10px;
  border: 1px solid var(--bdr2);
  transition: border-color .15s;
}
.re-row.re-row-picking { border-color: var(--p1); box-shadow: 0 0 0 2px rgba(126,184,212,.2); }

.re-row-head {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 6px; flex-wrap: wrap;
}

/* type button (star/warn) */
.re-type-btn {
  width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--bdr2); background: rgba(255,255,255,.7);
  cursor: pointer; transition: all .15s;
}
.re-type-btn i { font-size: 14px; color: var(--t3); }
.re-type-btn.key { border-color: var(--p1); background: var(--p1l); }
.re-type-btn.key i {
  background: linear-gradient(135deg,var(--p1),var(--p2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.re-type-btn.warn { border-color: var(--p3); background: var(--p3l); }
.re-type-btn.warn i {
  background: linear-gradient(135deg,var(--p3),var(--p5));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

/* skill pick button */
.re-skill-pick-btn {
  font-size: 11px; padding: 3px 10px; border-radius: 14px;
  background: rgba(223,240,248,.7); color: var(--p1d);
  border: 1px dashed var(--p1m); cursor: pointer;
}

.re-skill-chip { cursor: default; }

.re-del-btn {
  margin-left: auto; width: 22px; height: 22px; border-radius: 50%;
  background: rgba(232,144,176,.12); color: var(--p3d);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; flex-shrink: 0;
}
.re-del-btn i { font-size: 11px; }

/* text area in row — unified font size */
.re-text {
  width: 100%; font-size: 13px !important;
  border: none; border-bottom: 1px solid var(--bdr);
  border-radius: 0; padding: 4px 0 6px;
  background: transparent; resize: none;
  line-height: 1.6; color: var(--t1);
  min-height: 0;
}
.re-text:focus { outline: none; border-bottom-color: var(--p1); }

/* Display: log seg rows */
.log-seg-row {
  display: flex; align-items: flex-start; gap: 6px;
  margin-bottom: 5px; flex-wrap: wrap;
}
.log-seg-text { font-size: 13px; color: var(--t2); line-height: 1.65; flex: 1; min-width: 0; }

/* Display: note seg rows */
.note-seg-row {
  display: flex; align-items: flex-start; gap: 6px;
  padding: 4px 0; flex-wrap: wrap;
}
.note-seg-icon { flex-shrink: 0; margin-top: 1px; }
.note-seg-icon i { font-size: 14px; }
.note-seg-icon.key i {
  background: linear-gradient(135deg,var(--p1),var(--p2));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.note-seg-icon.warn i {
  background: linear-gradient(135deg,var(--p3),var(--p5));
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.note-seg-text { font-size: 13px; color: var(--t2); line-height: 1.65; flex: 1; }

/* Display: rich row lines (legacy/fallback) */
.rich-row-line { display: flex; align-items: baseline; gap: 5px; flex-wrap: wrap; margin-bottom: 4px; }
.rich-text-body { font-size: 13px; color: var(--t2); line-height: 1.65; }

/* Override old rich-editor styles that no longer apply */
.rich-editor-wrap, .rich-editor { display: none !important; }

/* ── Log seg: chip + text on same line, text wraps around ── */
.log-seg-row { margin-bottom: 6px; line-height: 1.65; }
.log-seg-line {
  display: inline; /* chip and text flow together */
}
.log-seg-line .inline-skill-tag {
  display: inline-flex;
  vertical-align: middle;
  margin-right: 5px;
  position: relative;
  top: -1px;
}
.log-seg-text {
  display: inline;
  font-size: 13px;
  color: var(--t2);
  line-height: 1.65;
}

/* ── Video skill picker ── */
.vid-skill-picker {
  max-height: 32vh; overflow-y: auto;
  background: rgba(255,255,255,.55);
  border-radius: var(--r); padding: 10px 12px;
  border: 0.5px solid var(--bdr2);
}
/* 真正的病根在这——这个容器一直没配暗夜模式版本，暗夜下还是亮白色55%
   不透明度的底，不管里面chip颜色怎么改都会被这一整片亮白盖过去。
   照着它的姐妹组件.skill-picker-panel(训练手记里那个动作墙用的)抄一份。 */
.dark-theme .vid-skill-picker{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.vid-skill-chip { cursor: pointer; margin: 2px; }
/* 这里复用了chip-l这个类，但chip-l本来是给动作墙"未接触"状态设计的，
   刻意弄得比较暗淡；放在这个"关联动作"选择器里，选中之前所有chip都
   灰蒙蒙看不清。单独给这个场景定义底色，不动chip-l本身(动作墙那边
   还要用它表示未接触状态)。 */
.vid-skill-chip:not(.selected){background:rgba(0,0,0,.06)!important;color:var(--t2)!important}
.vid-skill-chip.selected {
  background: linear-gradient(120deg,var(--pf),var(--pt)) !important;
  color: var(--pc) !important; border-color: transparent !important;
}

/* ════════ v18 ADDITIONS ════════ */

/* ── Bottom nav ── */
.bottom-nav{flex-shrink:0;display:flex;
  padding:6px 4px calc(var(--safe-bot) + 6px);
  background:linear-gradient(0deg,rgba(255,255,255,.97),rgba(255,255,255,.9));
  backdrop-filter:blur(16px);border-top:0.5px solid rgba(126,184,212,.22);z-index:50}
.bnav-tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 2px;
  font-size:10px;color:var(--t3);background:none;border:none;cursor:pointer;transition:color .15s}
.bnav-tab i{font-size:21px}
.bnav-tab.active{color:var(--p1d)}
.bnav-tab.active i{background:linear-gradient(135deg,var(--p1),var(--p2));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}

/* settings button in header */
.settings-btn{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.6);border:none;
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--p1d)}
.settings-btn i{font-size:19px}
.app-header{padding-bottom:12px}

/* ── Subview switch (combined pages) ── */
.subview-switch{display:flex;gap:0;background:rgba(0,0,0,.05);border-radius:13px;padding:3px;margin-bottom:14px}
.subsw-btn{flex:1;padding:9px 8px;border:none;background:none;border-radius:10px;
  font-size:13px;color:var(--t3);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;transition:all .2s;font-weight:500}
.subsw-btn i{font-size:16px}
.subsw-btn.active{background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff;box-shadow:0 2px 8px rgba(126,184,212,.4)}
.subsw-btn.active i{color:#fff}

/* ── Four-state stats ── */
.stat4{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:14px}
.stat4 .sbox{border-radius:var(--r);padding:10px 3px;text-align:center}
.stat4 .sv{font-size:20px;font-weight:600;line-height:1}
.stat4 .sl{font-size:10px;color:var(--t3);margin-top:3px}
.sbox-w{background:linear-gradient(135deg,var(--wf),var(--wt))}
.chip-w{background:linear-gradient(120deg,var(--wf),var(--wt));color:var(--wc)}

/* ── Status chips + rate slider + help ── */
.status-chip{font-size:12px}
.help-btn{background:none;border:none;color:var(--t3);cursor:pointer;padding:0 0 0 3px;vertical-align:middle}
.help-btn i{font-size:15px}
.status-help-box{margin-top:10px;background:rgba(255,255,255,.6);border-radius:12px;padding:10px 12px;border:0.5px solid var(--bdr2)}
.status-help-row{display:flex;gap:8px;padding:4px 0;font-size:12px;line-height:1.5}
.status-help-label{flex-shrink:0;width:48px;font-weight:600;color:var(--p1d)}
.status-help-desc{color:var(--t2)}
.rate-val{font-weight:600;color:var(--p1d);font-size:14px}
.rate-slider{width:100%;-webkit-appearance:none;height:6px;border-radius:3px;
  background:linear-gradient(90deg,var(--pf),var(--p1));outline:none;margin-top:6px}
.rate-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;
  background:#fff;border:2px solid var(--p1);cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.2)}

/* ── Settings page ── */
.settings-section{margin-bottom:18px}
.settings-sec-label{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--t3);margin-bottom:8px;padding-left:2px}
.settings-row{display:flex;align-items:center;justify-content:space-between;
  background:rgba(255,255,255,.7);border-radius:12px;padding:13px 14px;margin-bottom:7px;cursor:pointer}
.settings-row-left{display:flex;align-items:center;gap:11px;font-size:14px;color:var(--t1)}
.settings-row-left i{font-size:19px;color:var(--p1d)}
.settings-soon{font-size:11px;color:var(--t3);background:rgba(0,0,0,.05);padding:3px 9px;border-radius:10px}
.settings-arrow{color:var(--t3);font-size:16px}
.settings-theme-label{font-size:12px;color:var(--t2);margin:4px 0 8px 2px}
.settings-row .theme-dots,.settings-section .theme-dots{margin-bottom:10px}
.settings-version{text-align:center;font-size:11px;color:var(--t3);margin-top:14px}

/* toggle switch */
.toggle-switch{width:44px;height:26px;border-radius:13px;background:rgba(0,0,0,.15);position:relative;cursor:pointer;transition:background .2s;flex-shrink:0}
.toggle-switch.on{background:var(--p1)}
.toggle-knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.toggle-switch.on .toggle-knob{left:21px}

/* legal text */
.legal-text{max-height:55vh;overflow-y:auto;font-size:13px;line-height:1.7;color:var(--t2)}
.legal-text p{margin:0 0 12px}
.legal-text b{color:var(--t1)}
.legal-date{font-size:11px;color:var(--t3);margin-top:16px}

/* ── Data page ── */
.data-hero{display:flex;gap:8px;margin-bottom:16px}
.data-hero-item{flex:1;background:linear-gradient(135deg,rgba(255,255,255,.85),rgba(255,255,255,.65));
  border-radius:var(--r);padding:14px 6px;text-align:center}
.dh-val{font-size:26px;font-weight:700;color:var(--p1d);line-height:1}
.dh-val span{font-size:13px;font-weight:400;margin-left:1px}
.dh-lbl{font-size:11px;color:var(--t3);margin-top:5px}
.data-section{margin-bottom:18px}
.data-sec-title{font-size:13px;font-weight:600;color:var(--t1);margin-bottom:9px;display:flex;align-items:center;gap:6px}
.data-sec-title i{font-size:16px;color:var(--p1d)}
.data-card{background:rgba(255,255,255,.72);border-radius:var(--r);padding:14px}
.data-card-center{text-align:center}

/* badges grid */
.badge-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.badge-cell{display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer}
.badge-cell.locked svg{filter:grayscale(1);opacity:.4}
.badge-cell-name{font-size:10px;color:var(--t2);text-align:center;line-height:1.3}
.badge-cell.locked .badge-cell-name{color:var(--t3)}

/* badge celebration (center) */
.badge-celebrate{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;
  background:rgba(20,22,30,.45);backdrop-filter:blur(4px);opacity:0;transition:opacity .3s;overflow:hidden}
.badge-celebrate.show{opacity:1}
.bc-card{position:relative;text-align:center;padding:10px 20px;transform:scale(.7);opacity:0;
  transition:transform .45s cubic-bezier(.34,1.56,.64,1),opacity .35s;z-index:2}
.badge-celebrate.show .bc-card{transform:scale(1);opacity:1}
.bc-label{font-size:15px;font-weight:600;color:#fff;margin-bottom:6px;letter-spacing:.05em}
.bc-badge{margin:0 auto}
.bc-glow{animation:bcGlowPulse 2s ease-in-out infinite}
@keyframes bcGlowPulse{0%,100%{opacity:.5;transform:scale(1);transform-origin:110px 110px}50%{opacity:.9;transform:scale(1.15);transform-origin:110px 110px}}
.bc-rays{animation:bcSpin 12s linear infinite;transform-origin:110px 110px}
@keyframes bcSpin{to{transform:rotate(360deg)}}
.bc-medal{animation:bcPop .5s cubic-bezier(.34,1.56,.64,1) both;transform-origin:110px 110px}
@keyframes bcPop{0%{transform:scale(0)}100%{transform:scale(1)}}
.bc-name{font-size:22px;font-weight:800;color:#fff;margin-top:6px;font-family:'DM Serif Display',serif}
.bc-desc{font-size:13px;color:rgba(255,255,255,.8);margin-top:6px;max-width:240px;margin-left:auto;margin-right:auto;line-height:1.5}
.bc-count{font-size:12px;color:rgba(255,255,255,.6);margin-top:10px}
.bc-btn{margin-top:18px;padding:11px 32px;border:none;border-radius:24px;
  background:linear-gradient(120deg,#7eb8d4,#a084c8);color:#fff;font-size:15px;font-weight:600;cursor:pointer;
  box-shadow:0 4px 16px rgba(126,184,212,.5)}
.bc-btn:active{transform:scale(.96)}
/* confetti */
.bc-confetti-wrap{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.bc-confetti{position:absolute;top:-20px;border-radius:2px;opacity:0;
  animation-name:bcFall;animation-timing-function:ease-in;animation-iteration-count:1;animation-fill-mode:forwards}
@keyframes bcFall{
  0%{opacity:0;transform:translateY(-20px) rotate(0deg)}
  10%{opacity:1}
  100%{opacity:.4;transform:translateY(105vh) rotate(540deg)}
}

/* ── 绚丽纸屑：中心迸发 + 飘落，多形状多色带闪 ── */
.cp2-wrap{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.cp2{position:absolute;left:50%;top:42%;opacity:0;will-change:transform,opacity;
  animation:cp2Burst 2.4s cubic-bezier(.15,.6,.3,1) forwards}
@keyframes cp2Burst{
  0%{opacity:0;transform:translate(-50%,-50%) rotate(0deg) scale(.3)}
  8%{opacity:1}
  35%{opacity:1;transform:translate(calc(-50% + var(--bx)),calc(-50% + var(--by))) rotate(var(--r1)) scale(1)}
  100%{opacity:0;transform:translate(calc(-50% + var(--bx)*1.1),calc(-50% + var(--by) + 60vh)) rotate(var(--r2)) scale(.9)}
}
.cp2.sq{border-radius:1px}
.cp2.ci{border-radius:50%}
.cp2.st{border-radius:3px}
.cp2.ring{background:transparent!important;border-radius:50%;border-style:solid}
.cp2.star{background:transparent!important;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}

/* 轻量纸屑庆祝（掌握动作/完成计划/里程碑）：只飘纸屑 + 一行小祝贺 */
.confetti-pop{position:fixed;inset:0;z-index:320;pointer-events:none;opacity:0;transition:opacity .3s}
.confetti-pop.show{opacity:1}
.cp-toast{position:absolute;left:50%;top:38%;transform:translate(-50%,-6px) scale(.96);
  background:rgba(30,32,40,.92);color:#fff;font-size:15px;font-weight:500;
  padding:12px 22px;border-radius:22px;white-space:nowrap;
  box-shadow:0 8px 30px rgba(0,0,0,.3);opacity:0;transition:opacity .3s,transform .3s}
.confetti-pop.show .cp-toast{opacity:1;transform:translate(-50%,0) scale(1)}
.dark-theme .cp-toast{background:rgba(50,53,64,.95)}


/* badge detail flip */
.badge-detail{text-align:center;padding:10px 0 4px}
.badge-detail-flip{width:120px;height:120px;margin:0 auto 14px;perspective:800px;cursor:pointer}
.badge-flip-inner{position:relative;width:100%;height:100%;transition:transform .5s;transform-style:preserve-3d}
.badge-detail-flip.flipped .badge-flip-inner{transform:rotateY(180deg)}
.badge-flip-front,.badge-flip-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  display:flex;flex-direction:column;align-items:center;justify-content:center}
.badge-flip-back{transform:rotateY(180deg);background:rgba(255,255,255,.9);border-radius:16px;padding:10px}
.badge-tap-hint{font-size:10px;color:var(--t3);margin-top:2px;display:flex;align-items:center;gap:3px}
.badge-back-name{font-size:15px;font-weight:700;color:var(--p1d)}
.badge-back-desc{font-size:12px;color:var(--t2);margin:4px 0 8px}
.badge-back-date{font-size:12px;color:var(--uc);display:flex;align-items:center;gap:4px}
.badge-back-progress{width:90%}
.badge-prog-bar{height:7px;border-radius:4px;background:rgba(0,0,0,.08);overflow:hidden}
.badge-prog-fill{height:100%;background:linear-gradient(90deg,var(--p1),var(--p2));border-radius:4px}
.badge-prog-text{font-size:11px;color:var(--t3);margin-top:5px}
.badge-detail-name{font-size:17px;font-weight:600;color:var(--t1)}
.badge-detail-tier{font-size:11px;margin-top:5px;display:inline-block;padding:3px 12px;border-radius:12px}
.tier-silver{background:rgba(184,200,212,.3);color:#5a7a8c}
.tier-gold{background:rgba(232,176,74,.2);color:#9a6a20}
.tier-rainbow{background:linear-gradient(120deg,rgba(168,212,240,.3),rgba(255,176,200,.3));color:#7a5a9a}

/* bar chart */
.trend-toggle{display:flex;gap:6px;margin-bottom:12px}
.trend-btn{font-size:12px;padding:5px 14px;border-radius:14px;border:1px solid var(--bdr2);background:rgba(255,255,255,.6);color:var(--t2);cursor:pointer}
.trend-btn.active{background:var(--p1);color:#fff;border-color:var(--p1)}
.bar-chart{display:flex;align-items:flex-end;gap:3px;height:120px}
.bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%}
.bar-wrap{flex:1;width:100%;display:flex;align-items:flex-end}
.bar-fill{width:100%;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--p1),var(--p2));min-height:2px;transition:height .3s}
.bar-label{font-size:8px;color:var(--t3);white-space:nowrap;transform:scale(.85)}

/* frequency */
.freq-stats{display:flex;gap:8px;margin-bottom:14px}
.freq-stat{flex:1;text-align:center;background:rgba(255,255,255,.6);border-radius:12px;padding:10px 4px}
.fs-val{font-size:22px;font-weight:700;color:var(--p1d);line-height:1}
.fs-lbl{font-size:10px;color:var(--t3);margin-top:4px}
.weekday-title{font-size:11px;color:var(--t3);margin-bottom:8px}
.weekday-chart{display:flex;gap:5px;height:80px}
.wd-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px}
.wd-wrap{flex:1;width:100%;display:flex;align-items:flex-end}
.wd-fill{width:100%;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--p4),var(--p1));min-height:2px}
.wd-label{font-size:10px;color:var(--t2)}
.wd-count{font-size:9px;color:var(--t3)}

/* heatmap */
.heatmap-scroll{overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.heatmap-scroll::-webkit-scrollbar{display:none}
.heatmap{display:flex;gap:3px;min-width:max-content}
.hm-col{display:flex;flex-direction:column;gap:3px}
.hm-cell{width:11px;height:11px;border-radius:2px;background:rgba(0,0,0,.06)}
.hm-lvl0{background:rgba(0,0,0,.06)}
.hm-lvl1{background:var(--p2l)}
.hm-lvl2{background:var(--p2)}
.hm-lvl3{background:var(--p1)}
.hm-lvl4{background:var(--p1d)}
.hm-future{opacity:0}
.heatmap-legend{display:flex;align-items:center;gap:3px;justify-content:flex-end;margin-top:8px;font-size:10px;color:var(--t3)}
.heatmap-legend .hm-cell{width:10px;height:10px}

/* progress */
.prog-row{display:flex;align-items:flex-start;gap:8px;padding:7px 0;border-bottom:0.5px solid var(--bdr)}
.prog-row:last-of-type{border-bottom:none}
.prog-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;margin-top:4px}
.prog-dot-u{background:var(--uc)}
.prog-dot-w{background:var(--wc)}
.prog-dot-p{background:var(--pc)}
.prog-label{font-size:12px;color:var(--t2);width:42px;flex-shrink:0;padding-top:2px}
.prog-skills{display:flex;flex-wrap:wrap;gap:4px;flex:1}
.prog-skills .chip{font-size:11px;padding:2px 8px}
.prog-empty{font-size:12px;color:var(--t3)}
.prog-note{font-size:11px;color:var(--t3);margin-top:10px;line-height:1.5}
.recent-chips{display:flex;flex-wrap:wrap;gap:5px}
.recent-chips .chip{font-size:12px}

/* skill heat list */
.heat-list{display:flex;flex-direction:column;gap:8px}
.heat-row{display:flex;align-items:center;gap:8px}
.heat-name{font-size:12px;color:var(--t2);width:64px;flex-shrink:0;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.heat-bar-wrap{flex:1;height:14px;background:rgba(0,0,0,.05);border-radius:7px;overflow:hidden}
.heat-bar{height:100%;background:linear-gradient(90deg,var(--p2),var(--p1));border-radius:7px}
.heat-count{font-size:11px;color:var(--t3);width:20px;text-align:right}

/* ════════ DARK THEME ════════ */
.dark-theme{
  --color-text-primary:#e8e8ec;--color-text-secondary:#bcc0c8;--color-text-tertiary:#8b909b;
  --color-background-primary:#16181f;--color-background-secondary:#1e2129;
  --color-border-tertiary:rgba(255,255,255,.08);--color-border-secondary:rgba(255,255,255,.12);
}
.dark-theme .app-shell{background:linear-gradient(160deg,#1a1d28 0%,#16181f 30%,#16181f 70%,#1c1a26 100%)}
/* 各页面顶部原本有浅色渐变（蓝/绿/奶油），暗夜下会显出灰亮，全部取消 */
.dark-theme .page-skills,.dark-theme .page-log,.dark-theme .page-goals,
.dark-theme .page-plan,.dark-theme .page-video,.dark-theme .page-notes,
.dark-theme .page-record,.dark-theme .page-data{background:none}
.dark-theme .app-header{background:linear-gradient(118deg,rgba(30,33,45,.96),rgba(22,24,31,.92),rgba(34,30,44,.96));border-bottom-color:rgba(255,255,255,.08)}
.dark-theme .bottom-nav{background:linear-gradient(0deg,rgba(22,24,31,.98),rgba(22,24,31,.92));border-top-color:rgba(255,255,255,.08)}
/* 真正是"卡片"的容器：柔和抬升色，不是刺眼的白盒 */
.dark-theme .card,.dark-theme .data-card,.dark-theme .note-card{
  background:rgba(255,255,255,.035);border:0.5px solid rgba(255,255,255,.055);box-shadow:none}
/* 列表型的行（记录/设置/频率/成功率行）：去掉独立盒子，改用细分隔线，自然通透 */
.dark-theme .log-entry,.dark-theme .re-row,.dark-theme .freq-stat{
  background:transparent;border:none;border-bottom:0.5px solid rgba(255,255,255,.06);
  border-radius:0;box-shadow:none}
.dark-theme .settings-row{background:transparent;border-bottom:0.5px solid rgba(255,255,255,.06)}
.dark-theme .data-hero-item{background:rgba(255,255,255,.045);box-shadow:none}
.dark-theme .subview-switch{background:rgba(255,255,255,.06)}
.dark-theme .settings-btn{background:rgba(255,255,255,.08)}
.dark-theme .chip-l{background:rgba(255,255,255,.07);color:var(--t3)}
.dark-theme .hm-lvl0{background:rgba(255,255,255,.05)}
.dark-theme .heat-bar-wrap,.dark-theme .badge-prog-bar{background:rgba(255,255,255,.07)}
.dark-theme .settings-soon{background:rgba(255,255,255,.08)}
.dark-theme .badge-flip-back{background:rgba(40,42,52,.95)}
.dark-theme .form-input,.dark-theme .re-text{color:var(--t1)}
/* ── 暗夜：所有输入框原本是白底，导致白字看不见，统一改深底 ── */
.dark-theme .form-input,.dark-theme select.form-input,.dark-theme .add-skill-input,
.dark-theme .manage-sel,.dark-theme textarea,.dark-theme input[type=text],
.dark-theme input[type=number],.dark-theme input[type=date],.dark-theme input[type=time]{
  background:rgba(255,255,255,.07);color:#f0f1f4;border-color:rgba(255,255,255,.14)}
.dark-theme .form-input::placeholder,.dark-theme .add-skill-input::placeholder,
.dark-theme textarea::placeholder{color:#8b909b}
/* 下划线式输入框(form-input默认)在暗夜给个下边框可见色 */
.dark-theme .form-input{border-bottom-color:rgba(255,255,255,.18)}
/* 日期/时间选择器的图标在暗夜反色，否则黑图标看不见 */
.dark-theme input[type=date]::-webkit-calendar-picker-indicator,
.dark-theme input[type=time]::-webkit-calendar-picker-indicator{filter:invert(.7)}

/* ── 暗夜：记录编辑器里的"动作选择器"面板（原浅灰底看不清）── */
.dark-theme .skill-picker-panel{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.08)}
.dark-theme .sp-sub-group{background:rgba(255,255,255,.05)}
.dark-theme .sp-cat-label{color:#a4a8b2}
.dark-theme .sp-chip:hover{background:rgba(255,255,255,.12)}
.dark-theme .modal-sheet{background:linear-gradient(160deg,#1e2028,#181a21)}

/* ── 暗夜微调：让计划页/动作墙顶部/记录按钮更自然，去掉生硬的框 ── */
/* 计划页：浅色渐变在暗夜会发灰发闷，改成低饱和深色 + 保留左侧强调条 */
.dark-theme .plan-item{background:transparent}
.dark-theme .pitem-done{background:rgba(106,188,176,.10);border-left-color:#5a9e92;opacity:.7}
.dark-theme .pitem-today{background:rgba(240,168,74,.12);border-left-color:#e0a040}
.dark-theme .pitem-up{background:rgba(160,132,200,.10);border-left-color:#8a78b0}
.dark-theme .pitem-past{background:rgba(255,255,255,.03);border-left-color:rgba(255,255,255,.12)}
/* 动作墙顶部四格统计：去掉实心块，改成极淡底 + 细线，通透不抢眼 */
.dark-theme .stat4 .sbox{background:rgba(255,255,255,.04);border:0.5px solid rgba(255,255,255,.05)}
.dark-theme .sbox-p{background:rgba(160,132,200,.14)}
.dark-theme .sbox-w{background:rgba(240,168,74,.13)}
.dark-theme .sbox-u{background:rgba(106,188,176,.14)}
.dark-theme .sbox-l{background:rgba(255,255,255,.04)}
/* 记录/笔记/计划的操作按钮：柔和药丸形，不再是灰方块 */
.dark-theme .act-btn,.dark-theme .note-act,.dark-theme .pitem-act{
  background:rgba(255,255,255,.06);border-radius:20px;color:var(--t2)}
.dark-theme .act-btn.del,.dark-theme .note-act.del,.dark-theme .pitem-act.del-btn{color:#e89a9a}
/* 顺带把浅色模式下这些按钮也做圆润些（你说方楞） */
.act-btn,.note-act,.pitem-act{border-radius:20px}

/* ── 暗夜：修问号弹窗 / 关联手记的"灰底灰字看不清" ── */
/* 问号解释框：原来是浅灰盒子，暗夜里改深底 + 提亮说明文字 */
.dark-theme .status-help-box{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.09)}
.dark-theme .status-help-desc{color:#c8ccd4}
.dark-theme .status-help-label{color:#b8a8e0}
/* 关联手记/课堂记录：同样是浅灰盒子，改深底 + 提亮正文 */
.dark-theme .linked-entry{background:rgba(255,255,255,.05)}
.dark-theme .linked-text{color:#cdd1d9}
.dark-theme .linked-date{color:#9aa0aa}

/* ── 暗夜总扫：所有内嵌的浅灰小块统一改深底，避免满屏灰盒子 ── */
.dark-theme .report-stat,.dark-theme .skill-log-item,.dark-theme .seg-block,.dark-theme .seg-row,
.dark-theme .sp-subs,.dark-theme .report-log,.dark-theme .cal-log-item,.dark-theme .trend-mini,
.dark-theme .rbar-wrap,.dark-theme .plan-prog-card,.dark-theme .plan-day-pct,.dark-theme .goal-act,
.dark-theme .vid-tab,.dark-theme .vid-act,.dark-theme .tl-img,.dark-theme .cal-nav-btn,
.dark-theme .seg-type-btn,.dark-theme .chip-sel,.dark-theme .plan-tpl-chip,.dark-theme .trend-btn,
.dark-theme .sp-chip,.dark-theme .mhm-navbtn{
  background:rgba(255,255,255,.06)}
/* 这些块里普遍用 --t2/--t3 做正文，暗夜下太暗，统一提亮一档 */
.dark-theme .skill-log-item,.dark-theme .report-log,.dark-theme .cal-log-item{color:#c8ccd4}

/* ── 计划页专项修暗夜 ── */
/* 往期计划折叠条：原来浅灰底+灰字看不见 */
.dark-theme .past-toggle{background:rgba(255,255,255,.05);color:#c0c4cc}
/* 今日完成进度卡：浅色发灰蒙，改深底 */
.dark-theme .plan-prog-card{background:rgba(255,255,255,.04);border:0.5px solid rgba(255,255,255,.05)}
/* 顶部 计划/目标 切换条：底色再压深一点，别发亮 */
.dark-theme .subview-switch{background:rgba(255,255,255,.05)}
/* 计划日期标题在暗夜提亮 */
.dark-theme .plan-day-hdr{color:#bcc0c8}
.dark-theme .pday-past .plan-day-hdr{color:#8b909b}

/* ════════ v19 ADDITIONS ════════ */

/* ── Centered modal (badge detail) ── */
.modal-center{align-items:center!important}
.modal-card{background:linear-gradient(160deg,rgba(223,240,248,.7),var(--bg));
  border-radius:22px;width:calc(100% - 56px);max-width:340px;padding:22px 18px calc(var(--safe-bot)+18px);
  margin:0 auto;animation:cardPop .28s cubic-bezier(.32,.72,0,1) both;max-height:88dvh;overflow-y:auto}
@keyframes cardPop{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}
.dark-theme .modal-card{background:linear-gradient(160deg,#1e2028,#181a21)}

/* ── Month heatmap ── */
.mhm-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.mhm-month{font-size:14px;font-weight:600;color:var(--t1)}
.mhm-navbtn{width:30px;height:30px;border-radius:50%;border:none;background:rgba(255,255,255,.6);
  display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--p1d)}
.mhm-navbtn:disabled{opacity:.3;cursor:default}
.dark-theme .mhm-navbtn{background:rgba(255,255,255,.08)}
.mhm-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:5px}
.mhm-wd{text-align:center;font-size:10px;color:var(--t3)}
.mhm-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.mhm-cell{aspect-ratio:1;border-radius:7px;display:flex;align-items:center;justify-content:center;
  font-size:11px;color:var(--t2);background:rgba(0,0,0,.04);position:relative}
.mhm-empty{background:none}
.mhm-cell.mhm-lvl0{background:rgba(0,0,0,.04);color:var(--t3)}
.mhm-cell.mhm-lvl1{background:var(--p2l);color:var(--p1d)}
.mhm-cell.mhm-lvl2{background:var(--p1m);color:var(--p1d)}
.mhm-cell.mhm-lvl3{background:var(--p1);color:#fff}
.mhm-cell.mhm-lvl4{background:var(--p1d);color:#fff}
.mhm-today{box-shadow:0 0 0 2px var(--p3)}
.dark-theme .mhm-cell.mhm-lvl0{background:rgba(255,255,255,.05);color:var(--t3)}
.mhm-stat{text-align:center;font-size:12px;color:var(--t3);margin-top:12px}

/* ── Trend mini grid ── */
.trend-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.trend-mini{background:rgba(255,255,255,.55);border-radius:12px;padding:10px 6px;text-align:center}
.dark-theme .trend-mini{background:rgba(255,255,255,.05)}
.tm-label{font-size:10px;color:var(--t3);margin-bottom:5px}
.tm-val{font-size:18px;font-weight:700;color:var(--p1d);line-height:1;display:flex;align-items:center;justify-content:center;gap:2px}
.tm-val span{font-size:11px;font-weight:400}
.tm-val i{font-size:14px}
.tm-up{color:#3a9a78}.tm-down{color:#d0708a}
.tm-sub{font-size:10px;color:var(--t3);margin-top:4px}

/* ── Ratio bar (lesson vs free) ── */
.ratio-block{margin-top:16px}
.ratio-label{font-size:11px;color:var(--t3);margin-bottom:7px}
.ratio-bar{display:flex;height:16px;border-radius:8px;overflow:hidden;background:rgba(0,0,0,.05)}
.ratio-lesson{background:linear-gradient(90deg,var(--p1),var(--p2));height:100%}
.ratio-free{background:linear-gradient(90deg,var(--p4),var(--p1m));height:100%}
.ratio-legend{display:flex;gap:14px;margin-top:8px;font-size:11px;color:var(--t2);flex-wrap:wrap}
.ratio-legend span{display:flex;align-items:center;gap:5px}
.ratio-dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.dot-lesson{background:var(--p1)}
.dot-free{background:var(--p4)}

/* ensure bottom content reachable above nav */

/* ════════ v20 ADDITIONS ════════ */

/* preview tag */
.preview-tag{display:inline-block;font-size:10px;color:var(--p2d);background:var(--p2l);
  padding:2px 9px;border-radius:10px;margin-bottom:10px;font-weight:500}
.dark-theme .preview-tag{background:rgba(160,132,200,.2);color:#c8b0e8}

/* data section as cards — softer, rounded, subtle shadow */
.data-section{margin-bottom:16px}
.data-sec-title{font-size:13px;font-weight:600;color:var(--t1);margin-bottom:10px;display:flex;align-items:center;gap:6px;padding-left:2px}
.data-sec-title i{font-size:17px;color:var(--p1d)}
.data-card{background:rgba(255,255,255,.82);border-radius:18px;padding:16px;
  box-shadow:0 2px 12px rgba(126,184,212,.1);border:0.5px solid rgba(255,255,255,.6)}
.dark-theme .data-card{background:rgba(255,255,255,.035);box-shadow:none;border-color:rgba(255,255,255,.055)}

/* data hero as cards */
.data-hero{display:flex;gap:9px;margin-bottom:18px}
.data-hero-item{flex:1;background:linear-gradient(145deg,#fff,rgba(223,240,248,.6));
  border-radius:18px;padding:16px 6px;text-align:center;box-shadow:0 3px 14px rgba(126,184,212,.14)}
.dark-theme .data-hero-item{background:rgba(255,255,255,.045);box-shadow:none}

/* timeline (progress) */
.timeline{position:relative;padding-left:6px}
.timeline::before{content:'';position:absolute;left:11px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--p1),var(--p2),var(--p3))}
.tl-item{display:flex;gap:12px;margin-bottom:14px;position:relative}
.tl-item:last-child{margin-bottom:0}
.tl-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;margin-top:3px;z-index:1;border:2px solid var(--bg)}
.tl-dot-unlocked{background:var(--uc)}
.tl-dot-working{background:var(--wc)}
.tl-dot-learning{background:var(--pc)}
.tl-content{flex:1}
.tl-skill{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tl-skill .chip{font-size:12px}
.tl-status{font-size:11px;color:var(--t3)}
.tl-meta{font-size:11px;color:var(--t3);margin-top:3px}
.timeline-demo{opacity:.85}

/* radar legend */
.radar-legend{display:flex;gap:16px;justify-content:center;margin-top:10px;font-size:12px;color:var(--t2)}
.radar-legend span{display:flex;align-items:center;gap:5px}
.radar-legend i{width:14px;height:3px;border-radius:2px;display:inline-block}
.radar-dot-now{background:#7eb8d4}
.radar-dot-past{background:#a084c8;border:1px dashed #a084c8;height:0!important;border-width:1px}
.radar-legend-muted{color:var(--t3);font-size:11px}

/* heat view toggle */
.heat-view-toggle{display:flex;gap:0;background:rgba(0,0,0,.05);border-radius:10px;padding:3px;width:fit-content;margin:0 auto 14px}
.hv-btn{border:none;background:none;padding:5px 18px;border-radius:8px;font-size:12px;color:var(--t3);cursor:pointer;font-weight:500}
.hv-btn.active{background:#fff;color:var(--p1d);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.dark-theme .heat-view-toggle{background:rgba(255,255,255,.06)}
.dark-theme .hv-btn.active{background:rgba(255,255,255,.14)}

/* year heatmap */
.yhm-wrap{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 10px}
.yhm-month{}
.yhm-mlabel{font-size:10px;color:var(--t3);margin-bottom:4px;text-align:center}
.yhm-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.yhm-cell{aspect-ratio:1;border-radius:2px;background:rgba(0,0,0,.05)}
.yhm-empty{background:none}
.yhm-lvl0{background:rgba(0,0,0,.05)}
.yhm-lvl1{background:var(--p2l)}
.yhm-lvl2{background:var(--p1m)}
.yhm-lvl3{background:var(--p1)}
.yhm-lvl4{background:var(--p1d)}
.dark-theme .yhm-lvl0{background:rgba(255,255,255,.05)}

/* ════════ v21 ADDITIONS ════════ */

/* skill level help head */
.stat4-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.stat4-title{font-size:13px;font-weight:600;color:var(--t1)}

/* success rate list */
.rate-list{display:flex;flex-direction:column;gap:11px}
.rate-row{display:flex;align-items:center;gap:10px}
.rate-name{font-size:12px;color:var(--t2);width:70px;flex-shrink:0;text-align:right;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rate-track{flex:1;height:16px;background:rgba(0,0,0,.05);border-radius:8px;overflow:hidden}
.dark-theme .rate-track{background:rgba(255,255,255,.08)}
.rate-bar{height:100%;border-radius:8px;transition:width .4s}
.rate-pct{font-size:12px;font-weight:600;width:38px;text-align:right;flex-shrink:0}
.rate-demo{opacity:.9}

/* ════════ v22 ADDITIONS ════════ */
/* rate chart skill picker */
.rate-skill-picker{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.rate-skill-chip{font-size:12px;padding:5px 12px;border-radius:14px;border:1px solid var(--bdr2);
  background:rgba(255,255,255,.6);color:var(--t2);cursor:pointer;transition:all .15s}
.rate-skill-chip.active{background:linear-gradient(120deg,var(--p1),var(--p2));color:#fff;border-color:transparent}
.dark-theme .rate-skill-chip{background:rgba(255,255,255,.06)}

/* single value when not enough points */
.rate-single{text-align:center;padding:18px 10px}
.rate-single-val{font-size:40px;font-weight:800;color:var(--p1d);line-height:1}
.rate-single-note{font-size:12px;color:var(--t3);margin-top:8px;line-height:1.5}

/* rate chip empty state + hint */
.rate-skill-chip.rate-chip-empty{opacity:.55}
.rate-empty-hint{font-size:13px;color:var(--t2);text-align:center;margin-bottom:10px}

/* ════════ v23: rate time-range toggle ════════ */
.rate-range-toggle{display:flex;gap:0;background:rgba(0,0,0,.05);border-radius:10px;padding:3px;width:fit-content;margin:0 auto 12px}
.rr-btn{border:none;background:none;padding:5px 13px;border-radius:8px;font-size:12px;color:var(--t3);cursor:pointer;font-weight:500;white-space:nowrap}
.rr-btn.active{background:#fff;color:var(--p1d);box-shadow:0 1px 4px rgba(0,0,0,.08)}
.dark-theme .rate-range-toggle{background:rgba(255,255,255,.06)}
.dark-theme .rr-btn.active{background:rgba(255,255,255,.14)}

/* "关联动作"选择器(视频上传弹窗)暗夜模式背景——用户反馈之前几次改的颜色
   还是显灰，这次直接照抄"添加训练手记"里动作墙(.sp-chip)在暗夜模式下
   实际用的背景色和文字色，不再自己另配一套。放在文件最后，配合
   !important，确保不会被前面任何同优先级或更高优先级的规则盖掉。 */
.dark-theme .vid-skill-chip:not(.selected){
  background:rgba(255,255,255,.06)!important;
  color:var(--t3)!important;
}

/* ════════ v41: "我的"页面点选式布局 + "手账"合并页周历样式 ════════ */
.me-tabs{display:flex;gap:6px;margin-bottom:14px}
.me-tab{flex:1;background:rgba(255,255,255,.7);color:var(--t3);border-radius:14px;padding:9px 4px;
  font-size:11px;font-weight:500;display:flex;flex-direction:column;align-items:center;gap:4px}
.me-tab i{font-size:16px}
.me-tab.active{background:linear-gradient(135deg,var(--p1),var(--p2));color:#fff}
.me-tab-panel{margin-bottom:14px}
.me-row2{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.me-card-sm{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;
  text-align:center;color:var(--t1)}
.me-card-sm i{font-size:18px;color:var(--p2d)}
.me-settings-entry{display:flex;align-items:center;justify-content:space-between;
  background:rgba(255,255,255,.72);border-radius:var(--r);padding:13px 15px;cursor:pointer}
.me-settings-entry span{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500}
.me-settings-entry .ti-chevron-right{color:var(--t3);font-size:15px}
.dark-theme .me-tab{background:rgba(255,255,255,.06)}
.dark-theme .me-settings-entry{background:rgba(255,255,255,.06)}

.jw-goal-bar{display:flex;align-items:center;justify-content:space-between;gap:8px;
  background:linear-gradient(120deg,var(--p2l),var(--p1l));border-radius:16px;padding:11px 14px;
  margin-bottom:14px;cursor:pointer;font-size:12.5px;color:var(--p2d);font-weight:500}
.jw-goal-bar i:first-child{margin-right:2px}
.jw-goal-bar .ti-chevron-right{font-size:14px;flex-shrink:0}
.jw-weeknav{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.jw-week{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:14px}
.jw-cell{display:flex;flex-direction:column;align-items:center;gap:5px;cursor:pointer}
.jw-wd{font-size:10px;color:var(--t3)}
.jw-box{width:100%;aspect-ratio:1;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:500;color:var(--t2);transition:transform .1s}
.jw-h0{background:rgba(0,0,0,.045)}
.jw-h1{background:var(--p1l);color:var(--p1d)}
.jw-h2{background:var(--p1m);color:var(--p1d)}
.jw-h3{background:var(--p1d);color:#fff}
.jw-today{box-shadow:inset 0 0 0 2px var(--p2)}
.jw-sel .jw-box{transform:scale(1.08)}
.jw-sel .jw-wd{color:var(--p2d);font-weight:600}
.dark-theme .jw-h0{background:rgba(255,255,255,.06)}

.jw-day-card{background:rgba(255,255,255,.72);border-radius:var(--r);padding:14px;margin-bottom:14px}
.jw-day-title{font-size:13px;font-weight:600;color:var(--t1);margin-bottom:10px}
.jw-daybtns{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.jw-daybtn{position:relative;background:var(--bg2);border-radius:14px;padding:12px 4px;
  display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;color:var(--t3);font-weight:500}
.jw-daybtn i:first-child{font-size:19px}
.jw-daybtn.has{background:var(--p1l);color:var(--p1d)}
.jw-daybtn-mark{position:absolute;top:6px;right:6px;font-size:10px!important;width:15px;height:15px;
  border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.08);color:var(--t3)}
.jw-daybtn.has .jw-daybtn-mark{background:var(--p1d);color:#fff}
.dark-theme .jw-day-card{background:rgba(255,255,255,.06)}
.dark-theme .jw-daybtn{background:rgba(255,255,255,.06)}