/* Area identity is owned by the route, including navigation and modal surfaces. */
body[data-area="personal"]{--paper:#f2f5f9;--ink:#25344c;--muted:#697b92;--green:#3866a8;--line:#dde5ef;--light:#edf3fc;--radius:12px;background:var(--paper);color:var(--ink)}
body[data-area="personal"] .sidebar{background:#fff;border-color:#dce4ef}
body[data-area="personal"] .nav-item{color:#62758f;border-radius:7px}
body[data-area="personal"] .nav-item.active{background:#eaf1fc;color:#315c9b;box-shadow:inset 3px 0 #4b78bd}
body[data-area="personal"] .nav-item:hover{background:#f2f6fc}
body[data-area="personal"] .nav-caption{color:#647a99}
body[data-area="personal"] .monogram{border-color:#a9bdd9;color:#365b90}
body[data-area="personal"] .avatar{background:#e8effa;color:#365b90}
body[data-area="personal"] .topbar{background:#ffffffd9;border-color:#dce4ef}
body[data-area="personal"] .search input{background:#edf2f9}
body[data-area="personal"] .main{max-width:1530px}
body[data-area="personal"] .page-head h1{font-size:29px;font-weight:600;letter-spacing:-1.3px}
body[data-area="personal"] .eyebrow{color:#5b7eac;letter-spacing:1.8px}
body[data-area="personal"] .date-pill{border-color:#ccd9e9;color:#5d7390;background:#fff}
body[data-area="personal"] .area-tabs{border-bottom:1px solid #d7e2ef;gap:18px;padding-bottom:0}
body[data-area="personal"] .area-tabs a{border-radius:0;padding:10px 4px 13px}
body[data-area="personal"] .area-tabs a.active{background:none;color:#315b96;border-bottom:2px solid #4a74ae;font-weight:700}
body[data-area="personal"] .hero{background:#e6eefb;border:1px solid #d5e0f2;border-radius:12px;color:#254269;padding:27px 30px}
body[data-area="personal"] .hero::after{border-color:#bdcde7;width:200px;height:200px;top:-110px;right:90px}
body[data-area="personal"] .hero h2{font-size:21px;font-weight:600;color:#2b4568}
body[data-area="personal"] .hero .eyebrow{color:#5378ab}
body[data-area="personal"] .hero p{color:#657e9e}
body[data-area="personal"] .hero-metric{border-color:#c4d3e9}
body[data-area="personal"] .hero-metric strong{color:#355f9b;font:45px/1.1 "Segoe UI",sans-serif;font-weight:300}
body[data-area="personal"] .hero-metric span{color:#607b9e}
body[data-area="personal"] .metric{border-radius:10px;padding:19px 22px;box-shadow:0 3px 10px #193e6810;border-top:3px solid #a8bcda}
body[data-area="personal"] .metric-top{color:#5f7390}
body[data-area="personal"] .metric-value{font-variant-numeric:tabular-nums;font-weight:500}
body[data-area="personal"] .panel{border-radius:12px;box-shadow:0 3px 12px #2d4b7310}
body[data-area="personal"] .panel-header{background:#fcfdff;border-color:#e6edf7;padding:19px 23px}
body[data-area="personal"] .panel-title svg{color:#5a7aa7}
body[data-area="personal"] .calendar-day.current{background:#416da8}
body[data-area="personal"] .calendar-day.has-event::after{background:#d2994e}
body[data-area="personal"] .mini-stat{background:#eff4fa;border-radius:7px}
body[data-area="personal"] .task-filter button{background:#f0f4fa;color:#617998}
body[data-area="personal"] .task-filter button.selected{background:#dfeafb;color:#365e96}
body[data-area="personal"] .task-row .check{border-color:#aebfd7}
body[data-area="personal"] .tags span{background:#e9effa;color:#526f99}
body[data-area="personal"] .badge{background:#edf2fa;color:#52709b}
body[data-area="personal"] .assistant-launch{background:#355e95;border-radius:11px}
body[data-area="personal"] .chat-bubble{background:#edf3fb}
body[data-area="personal"] .modal-hint{background:#eef3fa;color:#586e8d}
body[data-area="personal"] .readonly-area{background:#f0f4fa}

/* Hobby: a sunny, playful club room with a dashboard and persistent activity strip. */
body[data-area="hobby"]{--paper:#fff9ef;--ink:#3b3151;--muted:#81738a;--green:#7653ac;--line:#e9e0eb;--light:#f4edfb;--radius:23px;background:var(--paper);color:var(--ink);font-family:"Trebuchet MS","Malgun Gothic",sans-serif}
body[data-area="hobby"] .sidebar{background:#fffdf8;border-right:1px solid #e9dfeb}
body[data-area="hobby"] .brand strong{color:#584274}
body[data-area="hobby"] .monogram{border:2px solid #9c79b4;color:#77519a;background:#f5eaff}
body[data-area="hobby"] .nav-caption{color:#947d9f}
body[data-area="hobby"] .nav-item{color:#81718a;border-radius:14px}
body[data-area="hobby"] .nav-item:hover{background:#f8f0fd}
body[data-area="hobby"] .nav-item.active{background:#ebdef8;color:#704e99;font-weight:700}
body[data-area="hobby"] .avatar{background:#f5dba8;color:#755389}
body[data-area="hobby"] .topbar{background:#fffdf8;border-color:#ede3e7}
body[data-area="hobby"] .search input{background:#f3eaf8;color:#77598c}
body[data-area="hobby"] .icon-button{border-radius:50%;border-color:#e9ddec;background:#fffcf7}
body[data-area="hobby"] .eyebrow{color:#9470ad;letter-spacing:2px}
body[data-area="hobby"] .page-head h1{font-size:32px;letter-spacing:-1.1px;font-weight:800}
body[data-area="hobby"] .page-head p{color:#89798b}
body[data-area="hobby"] .date-pill{background:#fff;border-color:#e8d9eb;color:#846b94;border-radius:30px}
.hobby-welcome{background:#ffe9a8;border:1px solid #f3d88e;border-radius:25px;padding:34px 38px;display:grid;grid-template-columns:minmax(0,1fr) 230px;gap:25px;align-items:center;margin-bottom:25px;position:relative;overflow:hidden}
.hobby-welcome .eyebrow{color:#8a652a!important;font-size:10px}
.hobby-welcome h2{font-size:30px;line-height:1.5;letter-spacing:-1.1px;color:#584339;font-weight:800}
.hobby-welcome p{color:#8d7358;font-size:12px;line-height:1.9;margin-top:13px}
.hobby-welcome .play-sticker{display:inline-block;background:#fefaf1;border:1px solid #e4c883;transform:rotate(-5deg);border-radius:30px;padding:7px 12px;font-size:10px;font-weight:700;letter-spacing:1.3px;margin-top:20px;color:#8a6b36}
.hobby-art{width:100%;height:165px;stroke-width:2.5;overflow:visible}
.hobby-menu-label{font-size:10px;letter-spacing:2px;color:#9983a4;margin:26px 0 12px;font-weight:700}
.hobby-nav{display:flex;align-items:stretch;gap:7px;overflow-x:auto;max-width:100%;padding:5px 3px 15px;margin-bottom:21px;scrollbar-width:thin;scrollbar-color:#d4bee3 transparent}
.hobby-nav a{display:flex;align-items:center;gap:6px;border:1px solid #e9dced;border-radius:30px;background:#fffdfb;color:#89758e;white-space:nowrap;font-size:11px;padding:10px 13px;flex:0 0 auto;transition:background .15s,transform .15s}
.hobby-nav a:hover{background:#f2e8fa;transform:translateY(-2px)}
.hobby-nav a.active{background:#7855a2;border-color:#7855a2;color:#fff;box-shadow:0 4px 10px #7855a22a}
.hobby-nav .tab-symbol{font-size:14px;line-height:1}
body[data-area="hobby"] .hobby-grid{gap:20px}
body[data-area="hobby"] .hobby-card{border:1px solid #e7d9e9;border-radius:23px;padding:25px;min-height:218px;box-shadow:0 5px 0 #eee2e8;overflow:hidden}
body[data-area="hobby"] .hobby-card:hover{transform:translateY(-5px) rotate(-.6deg);box-shadow:0 10px 0 #e9d9e5}
body[data-area="hobby"] .hobby-card h2{font:700 23px/1.25 "Trebuchet MS",sans-serif;color:#554263;letter-spacing:-.6px}
body[data-area="hobby"] .hobby-card p{font-size:11px;color:#87728e;line-height:1.85;max-width:170px}
body[data-area="hobby"] .hobby-card small{font-size:9px;color:#8b7398;top:24px;right:22px}
body[data-area="hobby"] .hobby-icon{border-radius:18px;background:#fff9!important;box-shadow:0 3px 0 #00000008;width:53px;height:53px;font-size:27px;margin-bottom:21px;transform:rotate(-7deg)}
body[data-area="hobby"] .hobby-baseball{background:#ffebdc}
body[data-area="hobby"] .hobby-golf{background:#eaf2cd}
body[data-area="hobby"] .hobby-composition{background:#efe5fc}
body[data-area="hobby"] .hobby-guitar{background:#ffefbf}
body[data-area="hobby"] .hobby-vocal{background:#ffe2e5}
body[data-area="hobby"] .hobby-library{background:#e1effa}
body[data-area="hobby"] .hobby-travel{background:#dcf1e6}
body[data-area="hobby"] .hobby-japanese{background:#f8e3f0}
body[data-area="hobby"] .hobby-card::after{content:'↗';position:absolute;right:20px;bottom:20px;width:27px;height:27px;border:1px solid #9d86ad55;border-radius:50%;display:grid;place-items:center;color:#8f719d;font-size:13px}
body[data-area="hobby"] .panel{border-radius:21px;border:1px solid #e9dcec;box-shadow:0 4px 0 #efe4ed}
body[data-area="hobby"] .panel-header{background:#faf4fc;border-color:#eee2f0}
body[data-area="hobby"] .panel-title h2{font-size:15px;color:#654878}
body[data-area="hobby"] .panel-title svg{color:#a080b3}
body[data-area="hobby"] .button{background:#7a56a2;border-color:#7a56a2;border-radius:12px}
body[data-area="hobby"] .button.secondary{background:#fff;color:#795493;border-color:#decae8}
body[data-area="hobby"] .link-button{color:#805b9d}
body[data-area="hobby"] .record-card{border-color:#e9dcec;border-radius:14px;background:#fffcff}
body[data-area="hobby"] .connection-strip{background:#f5edf9;border-color:#e5d8ef;color:#8a7099;border-radius:13px}
body[data-area="hobby"] .back-link{color:#8e71a3}
body[data-area="hobby"] .assistant-launch{background:#7c53a1;border-radius:30px;box-shadow:0 5px 0 #e7d7ee}
body[data-area="hobby"] .chat-bubble{background:#f4eafa}
body[data-area="hobby"] .modal-hint{background:#faf2e5;color:#8d745c}
body[data-area="hobby"] .readonly-area{background:#f6effb}

/* Financial: a private-banking workspace, not a recolored personal dashboard. */
body[data-area="financial"]{--paper:#edf0f5;--ink:#1e2e46;--muted:#64748b;--green:#284d75;--line:#d8dfe8;--light:#e9eef6;--radius:5px;background:var(--paper);color:var(--ink);font-family:"Segoe UI","Malgun Gothic",sans-serif}
body[data-area="financial"] .sidebar{background:#12243c;border-right:1px solid #263951;color:#dde5ee}
body[data-area="financial"] .brand strong{color:#f2f0e9}
body[data-area="financial"] .brand small{color:#9caec3}
body[data-area="financial"] .monogram{border:1px solid #ac9671;color:#d9c49b;border-radius:3px;background:#1b304b}
body[data-area="financial"] .nav-caption{color:#8da0ba;letter-spacing:1.7px}
body[data-area="financial"] .nav-item{border-radius:3px;color:#aebfd3}
body[data-area="financial"] .nav-item:hover{background:#203853}
body[data-area="financial"] .nav-item.active{background:#263f5c;color:#ecdcb7;box-shadow:inset 3px 0 #c1a477}
body[data-area="financial"] .sidebar-footer{border-color:#32435a}
body[data-area="financial"] .owner small{color:#94a8c3}
body[data-area="financial"] .avatar{background:#30465e;color:#deca9f;border-radius:4px}
body[data-area="financial"] .topbar{background:#fff;border-color:#d4dce7;height:73px}
body[data-area="financial"] .search input{background:#f0f3f8;border-radius:4px}
body[data-area="financial"] .icon-button{border-radius:3px;border-color:#d9e0e8}
body[data-area="financial"] .main{padding-top:31px;max-width:1570px}
body[data-area="financial"] .page-head h1{font-size:28px;font-weight:600;letter-spacing:-1px}
body[data-area="financial"] .eyebrow{color:#8a7351;letter-spacing:2.1px}
body[data-area="financial"] .date-pill{border-radius:3px;background:#fff;border-color:#d0d9e5;color:#667a94}
body[data-area="financial"] .record-search{display:flex;align-items:center;gap:15px;max-width:270px;margin-left:auto;font-size:11px;color:#62748a;white-space:nowrap}
body[data-area="financial"] .record-search input{border-radius:3px;padding:8px 10px;font-size:12px;flex:1;width:auto}
body[data-area="financial"] .hero{background:#172d48;border:1px solid #213a57;border-radius:5px;padding:29px 34px;border-bottom:3px solid #b79d72;min-height:190px}
body[data-area="financial"] .hero::after{border-radius:0;width:240px;height:240px;transform:rotate(45deg);border-color:#65728855;right:120px;top:-170px}
body[data-area="financial"] .hero h2{font:26px/1.5 "Malgun Gothic",sans-serif;font-weight:400;letter-spacing:-1px;color:#e6ebf1}
body[data-area="financial"] .hero .eyebrow{color:#c8ad80}
body[data-area="financial"] .hero p{color:#91a8c3;font-size:11px}
body[data-area="financial"] .hero-metric{border-color:#53647a;padding-left:36px;min-width:230px;text-align:right}
body[data-area="financial"] .hero-metric strong{font:400 41px/1.2 "Segoe UI",sans-serif;color:#e7d5b4;font-variant-numeric:tabular-nums;letter-spacing:-1px;overflow-wrap:anywhere}
body[data-area="financial"] .hero-metric span{color:#a7b6ca;font-size:11px;letter-spacing:.6px}
body[data-area="financial"] .metric-grid{gap:0;border:1px solid #d3dce8;border-radius:4px;overflow:hidden;background:#fff}
body[data-area="financial"] .metric{border:0;border-right:1px solid #dbe2ec;border-radius:0;padding:23px 25px;background:#fff}
body[data-area="financial"] .metric:last-child{border-right:0}
body[data-area="financial"] .metric-top{color:#697a91;font-size:11px;letter-spacing:.1px}
body[data-area="financial"] .metric-value{font:500 28px/1.2 "Segoe UI",sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-1px;color:#203d61}
body[data-area="financial"] .panel{border-radius:4px;border-color:#d3dce8;box-shadow:none}
body[data-area="financial"] .panel-header{padding:17px 22px;background:#f8fafc;border-bottom:1px solid #d9e1ec}
body[data-area="financial"] .panel-title h2{font-size:13px;font-weight:700;color:#263d5b;letter-spacing:.1px}
body[data-area="financial"] .panel-title svg{color:#8d7755;width:16px;height:16px}
body[data-area="financial"] .panel-body{padding:19px 22px}
body[data-area="financial"] .record-card{border:0;border-bottom:1px solid #dde4ee;border-radius:0;background:#fff;padding:14px 0}
body[data-area="financial"] .record-card:last-child{border-bottom:0}
body[data-area="financial"] .record-card h3{font-size:13px;letter-spacing:.1px}
body[data-area="financial"] .record-fields{font-size:11px;color:#6c7f98;font-variant-numeric:tabular-nums}
body[data-area="financial"] .records-list{gap:0}
body[data-area="financial"] .button{background:#244a73;border-color:#244a73;border-radius:3px}
body[data-area="financial"] .button.secondary{background:#fff;color:#335476;border-color:#cbd6e4}
body[data-area="financial"] .link-button{color:#305881;font-size:11px}
body[data-area="financial"] .badge{border-radius:2px;background:#edf1f7;color:#566d89}
body[data-area="financial"] .connection-row{font-variant-numeric:tabular-nums;border-color:#e0e6ee}
body[data-area="financial"] .connection-row strong{font-weight:600;color:#28476c}
body[data-area="financial"] progress{accent-color:#8f7954;border-radius:0}
body[data-area="financial"] progress::-webkit-progress-bar{background:#e9edf4}
body[data-area="financial"] progress::-webkit-progress-value{background:#9b865f}
body[data-area="financial"] .modal-hint{background:#f0f3f8;color:#677c99;border-radius:3px}
body[data-area="financial"] .readonly-area{background:#f1f4f9;border-radius:3px}
body[data-area="financial"] .assistant-launch{background:#1e3858;border-radius:4px;border:1px solid #b39c72}
body[data-area="financial"] .chat-bubble{background:#edf2f8;border-radius:4px}
body[data-area="financial"] dialog{border-radius:5px}

/* The entry cards already communicate three different destinations. */
.space-personal{background:#edf3fd;border-color:#d1dff1;border-radius:12px}
.space-personal h2{font-family:"Segoe UI",sans-serif;color:#365780}
.space-personal .hobby-icon{background:#dce7fa;color:#436b9e;border-radius:9px}
.space-hobby{background:#ffedbe;border-color:#eed69c;border-radius:24px;box-shadow:0 4px 0 #eddfba}
.space-hobby h2{font:700 23px "Trebuchet MS",sans-serif;color:#8d628f}
.space-hobby .hobby-icon{background:#f9dbed;color:#a578ad;border-radius:14px;transform:rotate(-7deg)}
.space-financial{background:#172c46;border-color:#223d60;border-radius:4px;color:#e2d0aa}
.space-financial h2{font-family:Georgia,serif;color:#e9d9b8}
.space-financial p,.space-financial small{color:#aebed3}
.space-financial .hobby-icon{background:#29425f;color:#d1b484;border-radius:3px}
body[data-area="hobby"] h1,body[data-area="hobby"] .hobby-card p{word-break:keep-all}
@media(max-width:580px){body[data-area="hobby"] .hobby-art{right:12px;bottom:46px;width:85px;height:80px}}

@media(max-width:1150px){.hobby-welcome{grid-template-columns:minmax(0,1fr) 180px;padding:29px}.hobby-welcome h2{font-size:26px}.hobby-nav a{padding:9px 12px}.hobby-art{height:150px}body[data-area="financial"] .hero-metric{min-width:180px}body[data-area="financial"] .metric{padding:20px}}
@media(max-width:850px){body[data-area="financial"] .metric:nth-child(2){border-right:0}body[data-area="financial"] .metric:nth-child(-n+2){border-bottom:1px solid #dbe2ec}body[data-area="financial"] .hero-metric{min-width:160px}body[data-area="financial"] .hero-metric strong{font-size:33px}}
@media(max-width:580px){
 body[data-area="personal"] .page-head h1{font-size:25px}body[data-area="personal"] .hero{padding:23px 20px}body[data-area="personal"] .hero h2{font-size:18px}body[data-area="personal"] .hero-metric strong{font-size:32px}body[data-area="personal"] .metric{padding:16px}body[data-area="personal"] .panel-header{padding:18px}body[data-area="personal"] .sidebar{border-top:1px solid #d8e2ef}
 body[data-area="hobby"] .page-head h1{font-size:27px}body[data-area="hobby"] .date-pill{font-size:8px;padding:8px}.hobby-welcome{grid-template-columns:1fr;padding:25px;gap:12px;border-radius:21px}.hobby-welcome h2{font-size:25px}.hobby-welcome p{font-size:11px}.hobby-art{position:absolute;width:110px;height:100px;right:15px;bottom:5px;opacity:.75}.hobby-welcome .play-sticker{margin-top:18px;font-size:8px}.hobby-welcome p{max-width:210px}.hobby-nav{margin-bottom:18px;padding-bottom:12px;gap:6px}.hobby-nav a{font-size:10px;padding:9px 12px}.hobby-menu-label{margin-top:19px}body[data-area="hobby"] .hobby-grid{gap:13px}body[data-area="hobby"] .hobby-card{min-height:198px;padding:21px 18px;border-radius:18px}body[data-area="hobby"] .hobby-card h2{font-size:18px}body[data-area="hobby"] .hobby-card p{font-size:10px}body[data-area="hobby"] .hobby-card small{font-size:8px;right:14px;top:19px}body[data-area="hobby"] .hobby-icon{width:43px;height:43px;font-size:23px;margin-bottom:19px}body[data-area="hobby"] .hobby-card::after{width:22px;height:22px;bottom:13px;right:13px}body[data-area="hobby"] .sidebar{border-top-color:#ddc9e9}
 body[data-area="financial"] .topbar{height:62px}body[data-area="financial"] .main{padding-top:25px}body[data-area="financial"] .page-head h1{font-size:24px}body[data-area="financial"] .hero{padding:24px 20px;gap:18px;display:block}body[data-area="financial"] .hero h2{font-size:22px}body[data-area="financial"] .hero-metric{border-left:0;border-top:1px solid #415b78;padding:18px 0 0;margin-top:21px;text-align:left;min-width:0}body[data-area="financial"] .hero-metric strong{font-size:33px}body[data-area="financial"] .hero-metric span{font-size:10px}body[data-area="financial"] .metric{padding:20px 16px}body[data-area="financial"] .metric-value{font-size:25px}body[data-area="financial"] .record-search{margin-bottom:16px}body[data-area="financial"] .sidebar{background:#12243c;border-top:1px solid #354963}body[data-area="financial"] .nav-item{color:#adbed3}body[data-area="financial"] .nav-item.active{background:#2a4360;color:#e3cca0;box-shadow:inset 0 2px #c1a477}body[data-area="financial"] .panel-header{padding:17px 19px}body[data-area="financial"] .panel-body{padding:18px 19px}
}