*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#edf5f1;background:#06100e}button,input{font:inherit}button{cursor:pointer}.app{min-height:100vh;position:relative;background:linear-gradient(90deg,rgba(2,9,12,.96) 0 248px,rgba(2,9,12,.38) 410px,rgba(2,9,12,.16)),linear-gradient(180deg,rgba(0,7,10,.05),rgba(2,12,10,.78)),url("landscape-bg.png") center/cover fixed no-repeat}.app:after{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 70% 25%,transparent 0 28%,rgba(0,0,0,.12) 68%,rgba(0,0,0,.42));z-index:0}.sidebar{position:fixed;z-index:20;left:0;top:0;bottom:0;width:248px;padding:28px 20px;background:rgba(2,11,14,.62);backdrop-filter:blur(20px);border-right:1px solid rgba(255,255,255,.08)}.brand{font-size:18px;letter-spacing:.08em;font-weight:700;margin:0 10px 28px;display:flex;gap:10px;align-items:center}.brand span{color:#76ca92;font-size:24px}.sidebar nav{display:grid;gap:4px}.nav-item{width:100%;height:40px;border:0;border-radius:9px;background:transparent;color:#afbfba;text-align:left;padding:0 12px;display:flex;align-items:center;gap:14px;font-size:13px}.nav-item:hover{background:rgba(255,255,255,.05);color:#e8f0ed}.nav-item.active{color:#9de2b2;background:rgba(71,156,111,.15);box-shadow:inset 2px 0 #68c98e}.side-bottom{position:absolute;left:20px;right:20px;bottom:20px;padding:14px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:rgba(3,13,17,.56);overflow:hidden}.mini-scene{height:76px;margin:-14px -14px 12px;background:linear-gradient(180deg,rgba(4,20,28,.15),rgba(4,16,18,.72)),url("landscape-bg.png") center/cover}.mini-time{font-size:18px}.side-bottom small{color:#81928d;font-size:10px}.side-bottom strong{display:block;margin-top:9px;font-size:12px;font-weight:500;line-height:1.5}.side-bottom em{display:block;color:#7f918b;font-size:10px;line-height:1.5;margin-top:10px;font-style:normal}.main{position:relative;z-index:2;margin-left:248px;padding:20px 36px 130px;max-width:1680px}.topbar{height:52px;display:grid;grid-template-columns:1fr 380px 1fr;align-items:center}.search{height:43px;border:1px solid rgba(255,255,255,.18);background:rgba(3,12,16,.27);backdrop-filter:blur(14px);border-radius:11px;display:flex;align-items:center;gap:9px;padding:0 13px;color:#92a39e}.search input{width:100%;border:0;outline:0;background:transparent;color:#e8f1ee;font-size:12px}.search kbd{border:1px solid rgba(255,255,255,.11);border-radius:6px;padding:3px 6px;color:#788b86;font-size:10px}.profile{justify-self:end;display:flex;align-items:center;gap:9px;color:#d5e0dc;font-size:12px}.avatar{width:31px;height:31px;border:1px solid rgba(255,255,255,.24);border-radius:50%;display:grid;place-items:center}.mobile-menu{display:none}.hero{padding:42px 32px 30px}.eyebrow{color:#c8d5d1;font-size:15px}.hero h1{font-size:48px;line-height:1;margin:7px 0 14px;letter-spacing:-.045em}.hero p{margin:0;color:#bccbc6;font-size:15px}.hero p b{color:#76ca92;font-weight:500}.online{display:inline-block;width:9px;height:9px;border-radius:50%;background:#67c98d;margin-left:10px;box-shadow:0 0 14px rgba(103,201,141,.75)}.grid{display:grid;gap:17px}.metrics{grid-template-columns:repeat(4,1fr)}.card{border:1px solid rgba(255,255,255,.11);background:rgba(5,18,23,.62);backdrop-filter:blur(18px);box-shadow:0 18px 45px rgba(0,0,0,.2);border-radius:15px}.metric{padding:21px 22px 15px;min-height:205px}.label{font-size:11px;letter-spacing:.07em;color:#adbbb7}.metric-value{font-size:28px;margin-top:22px;letter-spacing:-.03em}.metric-value small{font-size:11px;color:#72c88e;margin-left:6px;letter-spacing:0}.sub{font-size:11px;color:#73c88e;margin-top:5px}.spark{height:45px;margin-top:9px;clip-path:polygon(0 78%,8% 68%,15% 73%,22% 57%,31% 66%,40% 45%,49% 61%,57% 50%,65% 57%,74% 34%,84% 48%,92% 20%,100% 5%,100% 100%,0 100%);border-bottom:1px solid rgba(255,255,255,.06)}.green{background:linear-gradient(180deg,rgba(70,185,111,.26),transparent)}.blue{background:linear-gradient(180deg,rgba(74,155,216,.24),transparent)}.orange{background:linear-gradient(180deg,rgba(220,150,67,.23),transparent)}.foot{display:flex;justify-content:space-between;color:#899a95;font-size:10px;margin-top:12px}.positive{color:#73c88e}.focus{text-align:center;padding:21px;display:flex;flex-direction:column;align-items:center}.focus-time{font-size:31px;margin-top:26px}.focus-sub{color:#8e9d99;font-size:11px;margin-top:5px}.primary{border:0;background:#63bc83;color:#06100e;font-weight:700;border-radius:22px;padding:10px 25px;margin-top:18px}.lower{grid-template-columns:1.05fr 1.15fr 1fr;margin-top:17px}.panel{padding:20px 22px;min-height:340px}.panel-title{display:flex;justify-content:space-between;color:#b5c3bf;font-size:11px;letter-spacing:.05em;margin-bottom:10px}.task{min-height:54px;display:flex;align-items:center;gap:10px;border-bottom:1px solid rgba(255,255,255,.065);font-size:12px}.task input{appearance:none;width:17px;height:17px;border:1px solid rgba(255,255,255,.25);border-radius:5px}.task input:checked{background:#68c88c;border-color:#68c88c}.tag{font-size:9px;padding:5px 8px;border-radius:7px;background:rgba(75,181,112,.13);color:#7bd39a;margin-left:auto}.tag.blue{background:rgba(68,142,205,.13);color:#83bce7}.tag.orange{background:rgba(218,150,64,.14);color:#e1ad68}.tag.purple{background:rgba(143,108,197,.14);color:#baa4dc}.link-btn{border:0;background:none;color:#91a29d;font-size:11px;padding:14px 0}.activity{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:11px}.activity-icon{width:27px;height:27px;border-radius:8px;background:rgba(70,181,112,.12);display:grid;place-items:center;color:#7bd29a}.activity-text{flex:1}.activity-text small{display:block;color:#788983;margin-top:3px}.activity time{font-size:9px;color:#687974}.ai-status{display:flex;gap:13px;align-items:center;padding:14px 0}.ring{width:48px;height:48px;border:1px solid #4aa36d;border-radius:50%;display:grid;place-items:center;color:#79d29b;box-shadow:0 0 20px rgba(70,180,110,.13)}.ai-status strong{font-size:11px;color:#7bd29a}.ai-status p{font-size:10px;color:#8c9c97;line-height:1.5;margin:6px 0}.ai-action{width:100%;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025);color:#cbd6d2;border-radius:9px;padding:12px;margin-top:8px;text-align:left;font-size:10px}.ai-action span{float:right;color:#8d9d98}.page-head{padding:38px 32px 20px;display:flex;justify-content:space-between;align-items:end}.page-head h2{font-size:32px;margin:5px 0 0;letter-spacing:-.035em}.page-head p{color:#8fa09b;font-size:12px;margin:0}.page-actions{display:flex;gap:8px}.btn{border:1px solid rgba(255,255,255,.12);background:rgba(3,15,18,.45);color:#cbd7d3;border-radius:9px;padding:9px 13px;font-size:11px}.btn.primary{border:0;margin:0;background:#63bc83}.list-grid{grid-template-columns:repeat(2,1fr)}.list-card{padding:19px}.list-card h3{margin:0 0 7px;font-size:15px}.list-card p{margin:0;color:#849690;font-size:11px;line-height:1.6}.progress{height:5px;border-radius:9px;background:rgba(255,255,255,.07);overflow:hidden;margin:15px 0 8px}.progress span{display:block;height:100%;background:#69c78d;border-radius:9px}.statline{display:flex;justify-content:space-between;color:#82938e;font-size:10px}.note-grid{grid-template-columns:repeat(3,1fr)}.note{padding:18px;min-height:150px}.note h3{font-size:14px;margin:0 0 9px}.note p{font-size:11px;color:#899a95;line-height:1.6;margin:0}.finance-big{padding:26px}.money{font-size:38px;letter-spacing:-.04em}.money-meta{display:flex;gap:30px;margin-top:20px;color:#8c9c97;font-size:11px}.money-meta b{display:block;color:#e8f0ed;font-size:14px;margin-top:4px}.goal-row{display:flex;justify-content:space-between;padding:16px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:11px}.goal-row small{color:#7f908b}.empty{padding:45px;text-align:center;color:#82938e;font-size:12px}.dock{position:fixed;z-index:30;left:268px;right:18px;bottom:13px;height:68px;border:1px solid rgba(255,255,255,.1);background:rgba(3,13,17,.77);backdrop-filter:blur(22px);border-radius:17px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 16px;box-shadow:0 18px 50px rgba(0,0,0,.3)}.now-playing{display:flex;align-items:center;gap:11px;font-size:11px}.now-playing small{display:block;color:#748580;font-size:9px;margin-top:3px}.album{width:39px;height:39px;border-radius:8px;background:url("landscape-bg.png") center/cover}.now-playing button{background:none;border:0;color:#98a9a4;font-size:16px}.dock-nav{display:flex;gap:25px}.dock-nav button{background:none;border:0;color:#7d8e89;font-size:18px}.dock-nav button.active{color:#72ca91}.dock-nav button:nth-child(3){width:38px;height:38px;border-radius:50%;background:#63bc83;color:#06100e;font-size:22px}.weather{justify-self:end;display:flex;align-items:center;gap:10px;color:#a9b7b3}.weather b{font-size:17px}.weather span{font-size:9px;line-height:1.45;color:#82928d}.modal{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.55);backdrop-filter:blur(7px);display:grid;place-items:center;padding:20px}.modal.hidden{display:none}.modal-card{width:min(560px,100%);border:1px solid rgba(255,255,255,.12);border-radius:17px;background:rgba(7,19,22,.96);box-shadow:0 30px 90px rgba(0,0,0,.5);padding:25px;position:relative}.close{position:absolute;right:15px;top:12px;border:0;background:none;color:#8fa09b;font-size:24px}.modal-card h3{margin:0 0 15px}.field{display:grid;gap:6px;margin:12px 0}.field label{font-size:10px;color:#82938e}.field input,.field textarea{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);border-radius:9px;padding:11px;color:#edf5f1;outline:0}.field textarea{min-height:120px;resize:vertical}.toast{position:fixed;z-index:120;right:24px;bottom:95px;background:#10241b;border:1px solid rgba(111,202,144,.3);color:#a6e0b8;border-radius:10px;padding:11px 14px;font-size:11px;opacity:0;transform:translateY(8px);transition:.2s}.toast.show{opacity:1;transform:none}@media(max-width:1120px){.metrics{grid-template-columns:repeat(2,1fr)}.lower{grid-template-columns:1fr}.list-grid,.note-grid{grid-template-columns:1fr 1fr}.sidebar{width:220px}.main{margin-left:220px}.dock{left:238px}}@media(max-width:760px){.sidebar{display:none}.sidebar.open{display:block;width:250px}.main{margin-left:0;padding:12px 12px 110px}.topbar{grid-template-columns:42px 1fr auto}.mobile-menu{display:block;border:0;background:none;color:#dce8e4;font-size:20px}.search{grid-column:2;grid-row:1;width:auto}.search kbd{display:none}.profile{grid-column:3}.hero{padding:62px 8px 26px}.hero h1{font-size:40px}.metrics,.list-grid,.note-grid{grid-template-columns:1fr}.page-head{padding:32px 8px 18px;display:block}.page-actions{margin-top:15px}.dock{left:10px;right:10px;height:62px;grid-template-columns:1fr auto}.now-playing,.weather{display:none}.dock-nav{justify-self:center}.dock-nav button{font-size:17px}}
/* Hide sidebar bottom card on narrow screens in Desktop Mode */
@media (max-width: 760px) {
html.desktop-mode .side-bottom {
display: none !important;
}
}
/* MOBILE CLEANUP */
@media screen and (max-width: 760px) {
.sidebar .side-bottom {
display: none !important;
visibility: hidden !important;
height: 0 !important;
overflow: hidden !important;
}
}
/* ===== MOBILE SIDEBAR FIX ===== */
.sidebar-close {
display: none;
}
.sidebar-overlay {
display: none;
}
@media screen and (max-width: 760px) {
body.menu-open {
overflow: hidden;
}
.sidebar.open {
display: block;
width: min(310px, 86vw);
z-index: 1000;
box-shadow: 30px 0 80px rgba(0,0,0,.45);
overflow-y: auto;
}
.sidebar.open .sidebar-close {
display: grid;
position: absolute;
top: 14px;
right: 14px;
width: 38px;
height: 38px;
place-items: center;
border: 1px solid rgba(255,255,255,.12);
border-radius: 50%;
background: rgba(255,255,255,.05);
color: #dce8e4;
font-size: 25px;
line-height: 1;
z-index: 5;
}
.sidebar.open .sidebar-close:active {
transform: scale(.92);
}
.sidebar.open .side-bottom {
display: none !important;
}
.sidebar-overlay {
display: block;
position: fixed;
inset: 0;
z-index: 999;
background: rgba(0,0,0,.52);
backdrop-filter: blur(2px);
}
html.desktop-mode .sidebar-close,
html.desktop-mode .sidebar-overlay {
display: none !important;
}
}