:root{--paper:#f7f5f0;--ink:#37352e;--accent:#756247;--soft:#ece6db;--fine:#e6e0d6}
body[data-experience="personal"]{background:var(--paper);color:var(--ink);--green:var(--accent);--muted:#8c8578;--line:var(--fine)}
body[data-experience="personal"] header,body[data-experience="personal"] .filters{background:var(--paper)}
body[data-experience="personal"] .hero{background:#ebe5d9}
body[data-experience="personal"] .hero h2,body[data-experience="personal"] h1{font-family:"Noto Serif TC","Songti TC",serif;font-weight:500;letter-spacing:2px}
body[data-experience="personal"] .hero p{color:#80735f}
body[data-experience="personal"] .hero-art{color:#ad9771}
body[data-experience="personal"] .primary,body[data-experience="personal"] .chip.active{background:var(--accent);border-color:var(--accent)}
body[data-experience="personal"] .primary:hover{background:#615039}
body[data-experience="personal"] nav button.active,body[data-experience="personal"] .brand-icon{background:#e9e1d3;color:#756247}
body[data-experience="personal"] .badge,body[data-experience="personal"] .avatar,body[data-experience="personal"] .tag{background:#f0eadf;color:#857255}
body[data-experience="personal"] .stat.warn strong{color:#a0785b}
body[data-experience="personal"] .badge.late{background:#f8e9df;color:#a26744}
.experience-switch{display:flex;background:#e9ece3;border:1px solid var(--line);padding:4px;border-radius:14px;margin:0 0 16px;gap:4px}
.experience-switch button{flex:1;background:transparent;border:0;border-radius:10px;font-size:14px;color:var(--muted);padding:8px 10px}
.experience-switch button.active{background:#fff;box-shadow:0 1px 5px #3536260b;color:var(--green);font-weight:600}
body[data-experience="personal"] .experience-switch{background:#ece8df}
.record-tabs{display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:20px}
.record-tabs button{border:0;border-radius:0;background:transparent;padding:12px 2px;color:var(--muted);font-size:15px;border-bottom:2px solid transparent}
.record-tabs button.active{color:var(--green);border-bottom-color:var(--green);font-weight:600}
#family-picker{width:100%;margin-bottom:10px;min-width:0}
.date-time-field{border:0;margin:16px 0 0;padding:0;min-inline-size:0;max-width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,120px);gap:10px}
.date-time-field legend{font-size:13px;padding:0;margin-bottom:8px;max-width:100%;overflow-wrap:anywhere}
.date-time-field>div{min-width:0;max-width:100%;overflow:hidden}
.date-time-field label{font-size:11px;color:var(--muted);margin:0 0 5px}
#fields input[type="hidden"]{display:none!important}
#fields .date-time-field input{appearance:none;-webkit-appearance:none;display:block;inline-size:100%;width:100%;min-inline-size:0;min-width:0;max-width:100%;height:44px;padding:8px;font-size:16px;line-height:normal}
#fields input[type="time"]::-webkit-date-and-time-value{min-width:0;text-align:left;margin:0}
#share-fields{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin:16px 0 0;min-inline-size:0}
#share-fields legend{font-size:12px;color:var(--muted);padding:0 5px}
.share-choice{display:flex;align-items:center;gap:8px;margin:6px 0;overflow-wrap:anywhere}
#fields .share-choice input{flex-shrink:0;margin:0}
.adult{background:#eee7df}
@media(max-width:420px){.date-time-field{grid-template-columns:minmax(0,1fr);gap:10px}.date-time-field>div:nth-of-type(2){max-width:150px}.experience-switch button{font-size:13px}.hero h2{font-size:21px}.hero .eyebrow{letter-spacing:1.6px}.hero-art{font-size:34px;padding:0}.record-tabs{margin-bottom:14px}.hero{gap:8px}}
