@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--ink:#111b29;--copper:#c89764;--green:#008c6b}*{box-sizing:border-box}body{margin:0;color:var(--ink);font:14px Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:radial-gradient(ellipse at 75% 12%,#edf0e9 0,transparent 45%),linear-gradient(120deg,#686e66,#e0ddd3 43%,#bdb9a9 72%,#293a33);min-height:100vh;padding:12px 16px 0}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #ca935b;outline-offset:3px}button{border:0}input{min-width:0}h2{font-size:16px;margin:0;font-weight:700}p{color:#666b70}.workspace{display:flex;position:relative;min-height:830px;max-width:1600px;margin:auto;border-radius:36px;background:linear-gradient(110deg,#ffffff20,#ffffff80);border:1px solid #ffffff9c;box-shadow:0 20px 60px #0004,inset 0 1px 2px #fff;overflow:hidden}.sidebar{width:250px;flex-shrink:0;background:linear-gradient(125deg,#303b3b,#0d191b 70%,#253333);color:#e4e7e6;padding:27px 23px;border-radius:34px;box-shadow:inset -1px 0 12px #ffffff15,8px 0 22px #0002;display:flex;flex-direction:column}.brand{text-decoration:none;color:#f6f7f7;font-size:29px;font-weight:750;letter-spacing:-1.5px;white-space:nowrap}.brand>span:last-child{color:#d2693b;font-weight:400;font-size:24px}.brand-icon{color:#dca46d;font-size:46px;vertical-align:middle}.side-search{display:flex;gap:9px;border:1px solid #ffffff35;border-radius:10px;padding:10px;margin:25px 0 23px;color:#aab4b5;font-size:22px}.side-search input{width:100%;border:0;background:none;color:white;font-size:12px;outline:0}nav button{display:flex;width:100%;align-items:center;gap:20px;background:none;color:#bdc5c5;text-align:left;padding:13px 8px;border-radius:10px;margin-bottom:4px}nav button span{font-size:24px;width:24px;color:#edf0ef}nav button.active{background:linear-gradient(90deg,#ffffff0a,#ffffff13);color:white;box-shadow:inset 0 1px 1px #ffffff10}nav button:hover{background:#ffffff12}.brand-card{margin-top:auto;padding:25px 15px 0;border:1px solid #ffffff20;border-radius:20px;background:linear-gradient(130deg,#ffffff08,#0003);height:228px;transform:rotate(-3deg);font-size:18px;box-shadow:0 15px 20px #0003}.wood-drawer{position:relative;height:110px;margin:22px 2px;background:repeating-linear-gradient(2deg,#c19c72 0px,#99734b 3px,#c9a476 6px);transform:perspective(450px) rotateY(-24deg) rotateX(8deg);box-shadow:12px 12px 14px #0006;border:6px solid #6a4c31}.wood-drawer div{width:90%;height:80px;position:absolute;top:24px;left:14px;background:repeating-linear-gradient(1deg,#d3b48e,#ba9267 4px,#d3b48e 7px);box-shadow:7px 12px 10px #0005;transform:translateZ(35px);border:3px solid #9b754d}.wood-drawer div:after{content:'';position:absolute;top:10px;left:35%;width:42px;height:8px;background:#42342a;border-radius:0 0 9px 9px}.sidebar>small{font-size:8px;letter-spacing:1px;color:#a0aaa7;margin-top:18px}main{padding:22px 27px 25px;width:calc(100% - 250px);padding-right:265px;transition:padding .45s}.workspace.drawer-closed main{padding-right:27px}header{display:flex;justify-content:space-between;align-items:center;gap:20px}.searchbar{display:flex;align-items:center;gap:14px;background:#ffffff70;border-radius:16px;width:44%;padding:15px;text-align:left;font-size:22px}.searchbar span{font-size:10px;color:#777}.header-actions{display:flex;gap:15px;align-items:center}.add{font-size:30px;color:white;border-radius:50%;width:44px;height:44px;background:linear-gradient(130deg,#e9cba4,#b98146);border:1px solid #f4dfbd;box-shadow:0 5px 12px #0003}.bell{background:transparent;font-size:27px}.profile{display:flex;gap:9px;align-items:center;background:none;font-size:10px;text-align:left}.profile small{display:block;font-size:9px;color:#727574;margin-top:3px}.avatar{display:grid;place-items:center;background:#253736;border:3px solid #ced3ce;color:white;width:40px;height:40px;border-radius:50%}.greeting{display:flex;justify-content:space-between;align-items:center;margin:36px 0 27px}.greeting h1{font-size:clamp(25px,2.9vw,44px);letter-spacing:-1.5px;margin:0;font-weight:750}.greeting h1 span{font-size:34px}.greeting p{margin:7px 0 0;font-size:12px}.date{text-align:right;font-size:12px;line-height:1.6}.drawers{display:grid;grid-template-columns:repeat(4,1fr) 1.08fr;gap:17px;margin-bottom:23px;perspective:1000px}.drawer-card{background:none;position:relative;padding:0;height:178px;transform-style:preserve-3d}.drawer-back{position:absolute;top:0;left:7%;width:88%;height:148px;background:linear-gradient(160deg,#d1d3d1,#a7aaa6);border-radius:12px 12px 4px 4px;box-shadow:inset 0 1px 2px white,4px 10px 12px #0002;transform:rotateX(18deg);overflow:hidden}.drawer-back:before{content:'';position:absolute;inset:28px 7px 5px;background:linear-gradient(120deg,#908778,#c9c0af);border:7px solid #d5c9b8}.paper{display:block;position:absolute;top:35px;left:15%;width:68%;height:88px;padding:13px 6px;background:#f5f2e9;color:#a7a7a2;font-size:7px;transform:rotate(-10deg);box-shadow:0 4px 6px #0003;line-height:1.9}.paper.second{left:28%;top:23px;transform:rotate(12deg);width:58%}.helmet{position:absolute;left:20%;top:14px;font-size:65px;z-index:1;filter:sepia(1) saturate(4)}.drawer-front{position:absolute;left:0;right:0;bottom:0;min-height:107px;text-align:left;padding:16px 17px 12px;border-radius:6px;background:linear-gradient(120deg,#fbfbf5,#e4e4e0);box-shadow:0 14px 19px #0003,inset 1px 1px 2px #fff;border:1px solid #f4f1e8;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;transform:translateZ(0)}.drawer-card:hover .drawer-front{transform:translateY(9px) translateZ(25px) rotateX(-5deg);box-shadow:0 22px 25px #0004}.drawer-front>div{font-size:12px;font-weight:650;display:flex;justify-content:space-between;margin-bottom:12px}.drawer-front strong{font-size:20px;display:block;white-space:nowrap;letter-spacing:-.5px}.drawer-front small{display:inline-block;margin-top:6px;font-size:10px}.drawer-front em{font-style:normal;font-size:10px;font-weight:400;letter-spacing:0}.warm .drawer-front{background:linear-gradient(120deg,#f9ebd7,#e7ddcf)}.rose .drawer-front{background:linear-gradient(120deg,#fff3f1,#dfd2d9)}.blue .drawer-front{background:linear-gradient(120deg,#f6f5e8,#dce3eb)}.badge{display:inline-grid;place-items:center;background:#d66543;color:white;width:20px;height:20px;border-radius:50%;font-size:11px}.green{color:var(--green);background:#d3ebe0;padding:3px 7px;border-radius:14px}.quote{background:linear-gradient(15deg,#142326,#354b4c 55%,#a6b4b4);border:1px solid #c0cdca;border-radius:9px;box-shadow:0 10px 15px #0002;color:#fff;padding:14px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:end}.quote .house{font-size:70px;position:absolute;top:-5px;right:10px;opacity:.4}.quote i{line-height:1.55;font-size:12px;position:relative}.quote small{align-self:end;font-size:10px;margin-top:5px}.grid{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}.glass{background:linear-gradient(125deg,#fffffff0,#ffffff9c);border:1px solid #ffffffac;border-radius:18px;padding:18px 19px;box-shadow:0 8px 22px #37372c10,inset 0 1px 1px white;backdrop-filter:blur(16px)}.section-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.section-head select{background:#fdfdf8;border:0;border-radius:9px;padding:9px;font-size:10px;box-shadow:0 4px 10px #0001}.revenue-value{font-size:25px;font-weight:750;margin-top:12px;letter-spacing:-.5px}.revenue-value span{font-size:12px;font-weight:500;vertical-align:middle;letter-spacing:0}.chart{position:relative;margin-top:24px}.chart svg{display:block;width:100%;height:126px;overflow:visible}.months{display:flex;justify-content:space-between;font-size:9px;color:#647075;margin-top:9px}.chart-tip{position:absolute;right:0;top:-13px;border-radius:9px;background:white;padding:10px;font-size:11px;box-shadow:0 4px 10px #0001}.chart-tip small{display:block;color:#718080;font-size:9px;margin-top:4px}.projects .section-head{margin-bottom:12px}.link{background:none;padding:0;color:#326998;font-size:10px}.project-row{display:flex;gap:12px;width:100%;background:none;padding:7px 0;text-align:left}.building{width:76px;height:49px;border-radius:5px;flex-shrink:0;background:linear-gradient(#a8bcc5 42%,#5c7066 43%);position:relative;overflow:hidden}.building:before{content:'';position:absolute;left:8px;top:14px;width:61px;height:30px;background:linear-gradient(110deg,#ccc4ac 50%,#f0e5d4 51%);clip-path:polygon(0 25%,65% 0,100% 15%,100% 100%,0 100%)}.building:after{content:'▥ ▥';position:absolute;left:18px;top:22px;font-size:18px;color:#3a4548}.building.b1{filter:brightness(.8)}.building.b2{filter:sepia(.3)}.project-info{flex:1;min-width:0}.project-info b{font-size:11px;display:block;margin-bottom:8px}.progress-row{display:flex;align-items:center;gap:10px}.progress{height:6px;background:#d7d6d2;border-radius:4px;flex:1;overflow:hidden}.progress i{display:block;height:100%;border-radius:4px;background:var(--bar,#0da279)}.progress-row>span{font-size:10px}.project-info small{font-size:10px;display:block;margin-top:7px}.invoices table{width:100%;border-collapse:collapse;margin-top:15px;font-size:10px}th{font-weight:400;text-align:left;color:#697075;padding:7px;background:#e7e7e24a}td{padding:8px 6px;border-bottom:1px solid #deded780}td:nth-child(3){text-align:right;white-space:nowrap}tbody tr{cursor:pointer}tbody tr:hover{background:#dce6df50}.status{white-space:nowrap;padding:4px 7px;border-radius:6px;font-size:9px;background:#e1efe6;color:#088559}.status.wait{color:#c58428;background:#f7ecd8}.status.late{color:#c54c3b;background:#f6e0d9}.quick-actions>div{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:17px}.quick-actions button{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #dddcd6;border-radius:12px;background:linear-gradient(120deg,#ffffff90,#f5f3ee80);padding:15px 10px;font-size:10px;box-shadow:0 4px 8px #0001}.quick-actions button:hover{background:#fff}.quick-actions button span{font-size:23px;display:grid;place-items:center;border-radius:50%;width:30px;height:30px;background:#e9e7e2}.quick-drawer{position:absolute;right:17px;top:166px;width:231px;padding:30px 18px 23px;background:linear-gradient(120deg,#fffffff5,#e8e7e3f0);border:1px solid white;border-radius:17px;box-shadow:8px 18px 25px #0004,-2px 0 3px #fff;transform:perspective(1500px) rotateY(-9deg) rotateZ(1deg);transform-origin:right;transition:transform .5s,opacity .4s;z-index:5}.quick-drawer:before{content:'';position:absolute;inset:12px -12px 18px auto;width:12px;background:linear-gradient(90deg,#896c4f,#c6ac8c);border-radius:0 8px 8px 0;z-index:-1}.quick-drawer p{font-size:11px;margin:7px 0 18px}.close{position:absolute;right:13px;top:13px;border-radius:50%;width:25px;height:25px;font-size:22px;background:#dddeda88;color:#62666b}.tabs{display:flex;background:#efeeec;border-radius:10px;padding:4px;margin-bottom:20px}.tabs button{font-size:10px;padding:9px 7px;background:none;border-radius:7px;flex:1}.tabs button.active{background:white;box-shadow:0 2px 5px #0001}.drop-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;height:157px;border:1px dashed #a6aaa7;border-radius:10px;cursor:pointer;position:relative;text-align:center}.drop-zone>span{font-size:42px;line-height:1;color:#48545f}.drop-zone b{font-size:11px;font-weight:400;line-height:1.6}.drop-zone small{font-size:9px;color:#737a7d}.drop-zone input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.drop-zone.drag{background:#d4e9df}.save{width:100%;margin-top:17px;background:linear-gradient(120deg,#3c4245,#172528);border-radius:9px;color:white;padding:15px 7px;font-size:11px;box-shadow:0 6px 10px #0002}.quick-drawer h3{font-size:11px;margin:25px 0 12px}.file-row{display:flex;gap:10px;align-items:center;margin-top:13px}.file-icon{font-size:22px;background:#f2dad5;color:#c66353;padding:6px;border-radius:7px}.file-row b{display:block;font-size:10px;font-weight:400;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-row small{font-size:9px;color:#777;display:block;margin-top:5px}.drawer-handle{position:absolute;right:0;top:40%;writing-mode:vertical-rl;background:#263333;color:#e5bd93;padding:20px 7px;border-radius:10px 0 0 10px;z-index:6;opacity:0;pointer-events:none}.drawer-closed .quick-drawer{transform:translateX(280px) rotateY(-30deg);opacity:0;pointer-events:none}.drawer-closed .drawer-handle{opacity:1;pointer-events:auto}#note{height:157px;width:100%;resize:none;border:1px solid #b8beb5;border-radius:10px;padding:12px;background:#fff8}footer{display:flex;max-width:1560px;margin:10px auto 0;align-items:center;gap:16px;height:126px}.diary-strip{display:flex;align-items:center;gap:18px;flex:1;color:white;border-radius:27px;background:linear-gradient(120deg,#263436cc,#5e665c80);border:1px solid #fff9;padding:17px 23px;box-shadow:0 8px 18px #0004;height:110px}.diary-strip>b{white-space:nowrap}.diary-strip button{background:#ffffff10;border:1px solid #ffffff30;border-radius:10px;color:white;padding:12px;font-size:25px}.diary-strip .diary-photo{background:linear-gradient(30deg,#a98e6b,#435e61);font-size:43px}.diary-strip .diary-upload{font-size:10px;text-align:left;background:#1a292ddd}.diary-upload small{display:block;color:#b9c1bc;margin-top:5px}.diary-strip i{font-size:12px;line-height:1.5;margin-left:auto}.dock{display:flex;gap:20px;padding:16px 26px;border-radius:34px;background:repeating-linear-gradient(3deg,#af8a63bb,#9e7b57bb 5px,#c1a17cbb 8px);box-shadow:inset 0 2px 2px #fff,0 12px 15px #0003;border:2px solid #e2cfb2;transform:rotate(2deg)}.dock button{position:relative;background:linear-gradient(120deg,#4c4e46,#182a2c);color:#f7f0e6;border-radius:8px;font-size:28px;width:45px;height:46px;box-shadow:0 5px 6px #0005;margin-bottom:17px}.dock button.selected{background:linear-gradient(120deg,#d8b58e,#a87a4b);border:1px solid #f5d9bb}.dock small{position:absolute;bottom:-22px;left:-4px;font-size:10px;font-weight:400;white-space:nowrap}.preview-tools{display:flex;justify-content:center;align-items:center;gap:20px;margin:16px 0 20px;font-size:10px;color:#e9e7e1}.preview-tools button{background:#233331;color:#e6c29e;border:1px solid #bf9b76;border-radius:20px;padding:8px 15px;font-size:11px}#reference{position:fixed;inset:0;background:#172322;z-index:50;overflow:auto}#reference img{width:100%;display:block}#reference button{position:fixed;right:20px;bottom:20px;background:#172322;color:white;padding:14px;border:1px solid #d1a26f;border-radius:20px}dialog{border:1px solid #fff;background:linear-gradient(120deg,#fff,#eeece3);color:var(--ink);border-radius:22px;width:min(600px,90vw);padding:30px;box-shadow:0 30px 80px #0005}dialog::backdrop{background:#172a2b77;backdrop-filter:blur(5px)}dialog h2{font-size:23px;margin-bottom:20px}.form{display:grid;gap:14px}.form label{display:grid;gap:7px;font-size:12px}.form input,.form textarea{padding:12px;border:1px solid #d4d4c9;border-radius:9px;background:#fff}.form textarea{min-height:100px}.form button{padding:13px;background:#273b38;color:white;border-radius:10px}.detail-row{padding:14px 0;border-bottom:1px solid #d8d8cc;display:flex;justify-content:space-between;gap:12px;font-size:12px}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,30px);opacity:0;background:#243b34;color:white;padding:15px 25px;border-radius:14px;box-shadow:0 8px 30px #0004;transition:.25s;z-index:100;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}@media(min-width:1500px){.workspace{min-height:845px}main{padding:25px 30px;padding-right:265px}.drawers{margin-top:34px}.drawer-card{height:180px}.grid{gap:15px}.glass{padding:20px}.chart svg{height:140px}.quick-drawer{top:172px}.greeting{margin-top:38px}.project-row{padding:8px 0}}@media(max-width:1200px){.sidebar{width:205px;padding:20px 15px}.brand{font-size:25px}main{width:calc(100% - 205px);padding-right:235px;padding-left:20px}.quick-drawer{width:210px;right:12px}.drawers{gap:10px;grid-template-columns:repeat(4,1fr)}.quote{display:none}.drawer-front{padding:13px 10px}.drawer-front strong{font-size:17px}.grid{grid-template-columns:1fr}.date{display:none}.greeting h1{font-size:28px}.diary-strip i{display:none}.dock{gap:13px;padding:14px 20px}.workspace{min-height:1100px}}@media(max-width:800px){body{padding:8px}.workspace{display:block}.sidebar{width:100%;border-radius:28px 28px 0 0;padding:12px 18px}.brand{font-size:24px}.brand-icon{font-size:30px}.side-search,.brand-card,.sidebar>small{display:none}nav{display:flex;overflow:auto;margin-top:10px}nav button{width:auto;flex-shrink:0;padding:8px;font-size:10px;gap:5px}nav button span{font-size:17px;width:18px}main{width:100%;padding:20px!important}.searchbar{width:60%;padding:9px}.profile{display:none}.header-actions{gap:8px}.greeting{margin:24px 0}.greeting h1{font-size:26px}.greeting h1 span{font-size:24px}.greeting p{font-size:11px}.drawers{grid-template-columns:1fr 1fr;gap:18px}.drawer-card{height:167px}.quick-drawer{position:fixed;right:16px;top:100px;width:260px;max-height:80vh;overflow:auto}.drawer-handle{position:fixed;top:40%}.grid{grid-template-columns:1fr}.glass{padding:16px}.diary-strip{display:none}footer{height:110px;justify-content:center}.dock{gap:22px}.preview-tools span{display:none}.workspace{min-height:0}.invoices{overflow:auto}td,th{font-size:9px}nav button:nth-child(n+6){display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}}
/* Keep the front face above the tilted contents in every browser compositor. */
.drawer-card{transform-style:flat}.drawer-back{z-index:0}.drawer-front{z-index:2}
/* Reference-led materials, v0.3 */
body{background:#d2d0c6 url('assets/office-v3.png') center center/cover fixed no-repeat;padding-top:8px}
.workspace{background:linear-gradient(115deg,#ffffff52,#ffffff30);border-radius:34px;backdrop-filter:blur(12px);box-shadow:0 22px 65px #17232238,inset 0 1px 2px white;min-height:820px}
.sidebar{background:linear-gradient(115deg,#273433ed,#101e20f5 70%,#293a37dc);backdrop-filter:blur(18px);padding-top:21px}
.sidebar nav button{height:44px;padding:8px;margin-bottom:3px}
.sidebar .brand-card{height:228px;margin-top:30px}.sidebar>small{margin-top:12px}
main{padding-top:18px}.greeting{margin:27px 0 27px}.greeting h1{font-size:42px;font-weight:750}.greeting p{font-size:12px}
.drawers{margin-top:0;gap:14px}.drawer-card{height:185px;isolation:isolate}.drawer-back{inset:-9px -9px -9px;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;transform:none;background:url('assets/drawers-v3.png') 0 0/200% 200% no-repeat;overflow:visible}.drawer-back:before,.drawer-back>*{display:none}.warm .drawer-back{background-position:100% 0}.rose .drawer-back{background-position:0 100%}.blue .drawer-back{background-position:100% 100%}
.drawer-front,.warm .drawer-front,.rose .drawer-front,.blue .drawer-front{left:5%;right:5%;bottom:7%;min-height:88px;padding:11px 12px;background:transparent;border:none;box-shadow:none;border-radius:7px}.drawer-front>div{margin-bottom:10px}.drawer-front strong{font-size:20px}.drawer-front small{margin-top:7px}.drawer-card:hover .drawer-front{background:linear-gradient(110deg,#ffffffeb,#e6e8e3ed);box-shadow:0 15px 20px #27372a38;transform:translateY(12px) translateZ(20px) rotateX(-4deg)}.warm:hover .drawer-front{background:linear-gradient(110deg,#faf0e4,#e4d2ba)}.rose:hover .drawer-front{background:linear-gradient(110deg,#faece8,#e2d1d9)}.blue:hover .drawer-front{background:linear-gradient(110deg,#f5f5ec,#d7e0e8)}
.glass{background:linear-gradient(115deg,#ffffffca,#fffdf09c);backdrop-filter:blur(20px);box-shadow:0 9px 24px #303d3020,inset 0 1px 1px white;border-color:#ffffff9c}.glass h2{font-size:16px}.chart svg{height:125px}.revenue{padding-top:18px}.quick-drawer{background:linear-gradient(120deg,#ffffffef,#e5e4dff0);box-shadow:8px 18px 28px #1d282a40;top:170px;border-radius:16px}
.dock{background:linear-gradient(120deg,#ffffff25,#6a42244d),url('assets/office-v3.png') center bottom/1200px auto;border:2px solid #eedcc6}.diary-strip{backdrop-filter:blur(14px);background:linear-gradient(110deg,#223330c9,#46534c88)}
@media(min-width:1500px){.workspace{min-height:830px}main{padding-top:20px}.greeting{margin-top:28px}.drawers{margin-top:0}.glass{padding:18px 19px}.project-row{padding:7px 0}}
@media(max-width:800px){.sidebar{padding:12px 18px}.greeting h1{font-size:26px}.drawer-card{height:187px}.drawer-front strong{font-size:21px}.sidebar nav button{height:36px}.quick-drawer{top:100px}.drawers{gap:17px}.workspace{backdrop-filter:blur(8px)}}
.drawer-front,.warm .drawer-front,.rose .drawer-front,.blue .drawer-front{top:50%;bottom:auto;height:42%;min-height:0;padding:10px 12px}.rose .drawer-back,.blue .drawer-back{top:7px}.drawer-front>div{margin-bottom:8px}.drawer-front small{margin-top:5px}
.quote{background:linear-gradient(0deg,#142326ef,transparent 85%),url('assets/house-v3.png') center/cover}.quote .house{display:none}.building{background:url('assets/house-v3.png') center/cover}.building:before,.building:after{display:none}.building.b1{background-position:right center;filter:brightness(.8)}.building.b2{background-position:left center;filter:sepia(.2)}
.project-info b{margin-bottom:5px}.project-info small{margin-top:4px}.project-row{padding:5px 0}.chart{margin-top:17px}.chart svg{height:107px}.grid{gap:13px}.invoices table{margin-top:12px}td{padding:7px 6px}
@media(min-width:1500px){.project-row{padding:5px 0}.chart svg{height:107px}}
@media(max-width:800px){.drawer-front,.warm .drawer-front,.rose .drawer-front,.blue .drawer-front{padding:10px 12px}.greeting{margin:24px 0}}
.ui-icon{width:23px;height:23px;display:block;stroke:currentColor;stroke-width:1.7;fill:none;stroke-linecap:round;stroke-linejoin:round}.brand-icon .ui-icon{width:43px;height:43px}.brand-icon{display:inline-flex;vertical-align:middle;margin-right:5px}.drop-zone .ui-icon{width:38px;height:38px}.bell .ui-icon{width:25px;height:25px}.dock .ui-icon{width:25px;height:25px;margin:auto}
.wood-drawer{width:155px;height:88px;margin:25px auto 0;transform:perspective(450px) rotateY(-27deg) rotateX(13deg);background:linear-gradient(90deg,#604630,#c09b72 7%,#b58d63 85%,#634b36);border:6px solid #b59068;box-shadow:12px 18px 17px #0006}.wood-drawer:before{content:'';position:absolute;inset:3px 3px 12px;background:linear-gradient(#1b2018,#4c4130);box-shadow:inset 0 8px 12px #0009}.wood-drawer div{width:105%;height:72px;left:12px;top:31px;transform:translateZ(40px) translateX(8px);border:3px solid #b58c5f;background:repeating-linear-gradient(1deg,#ccaa80 0,#b98e61 3px,#d5b58a 5px,#c4a079 9px);box-shadow:5px 12px 15px #0006}.wood-drawer div:before{content:'';position:absolute;left:-14px;top:-22px;width:14px;height:88px;background:linear-gradient(90deg,#997049,#c6a579);transform:skewY(38deg);transform-origin:right bottom}.wood-drawer div:after{top:12px;left:35%;width:44px;height:7px}
/* The complete drawer travels as one unit, including artwork and live labels. */
.drawer-card{transform-origin:50% 70%;transition:transform .38s cubic-bezier(.18,.8,.22,1),filter .38s;will-change:transform}.drawer-card:hover,.drawer-card:focus-visible{transform:translateY(13px) perspective(900px) rotateX(-6deg) scale(1.035);filter:drop-shadow(0 15px 8px #26352b30)}
.drawer-card:hover .drawer-front,.warm:hover .drawer-front,.rose:hover .drawer-front,.blue:hover .drawer-front{transform:none;background:transparent;box-shadow:none}
.drawer-card:active{transform:translateY(19px) perspective(900px) rotateX(-8deg) scale(1.04)}
.drawer-motion{animation:wholeDrawer .38s cubic-bezier(.18,.8,.22,1)}@keyframes wholeDrawer{from{transform:none}to{transform:translateY(17px) perspective(900px) rotateX(-7deg) scale(1.04)}}
@media(prefers-reduced-motion:reduce){.drawer-card,.drawer-motion{animation:none;transition:none;transform:none!important}}
.brand{font-size:29px;font-weight:700;letter-spacing:-.8px}.brand>span:last-child{color:#cc643d;font-size:24px;letter-spacing:-1px}.brand-icon{margin-right:5px}.brand-icon img{display:block;filter:drop-shadow(0 1px 1px #0005)}
.brand-card{height:246px!important;padding:20px 15px 0;position:relative}.wood-drawer{width:190px;height:155px;margin:5px auto 0;left:-10px;background:url('assets/wood-cabinet-v4.png') center/contain no-repeat;border:0;box-shadow:none;transform:rotate(3deg);filter:drop-shadow(8px 10px 7px #0004)}.wood-drawer:before,.wood-drawer div{display:none}.brand-card:after{content:'➜';position:absolute;top:20px;right:12px;width:25px;height:25px;display:grid;place-items:center;background:#f0f1e9;border-radius:50%;color:#293735;font-size:16px}
.brand-card{padding-right:32px;font-size:16px}.wood-drawer{width:220px;height:180px;left:-16px;margin-top:0}.brand-card:after{top:18px;right:10px}
.design-toggle{display:flex;align-items:center;gap:7px;padding:9px 12px;border-radius:20px;background:linear-gradient(125deg,#fcf5e8b8,#cba37470);border:1px solid #fff9;box-shadow:0 4px 12px #14282520;color:#233531;font-weight:700;white-space:nowrap}.design-toggle span{font-size:9px;font-weight:400;color:#5d6a63}
body.mode-3d .workspace{transform:perspective(2600px) rotateY(-2.2deg) rotateX(.6deg);transform-origin:center center}.workspace{transition:transform .5s cubic-bezier(.2,.8,.2,1),background .4s}
.sidebar{position:relative;isolation:isolate;background:linear-gradient(115deg,#ffffff1f,#c7ded313 20%,#041817c4 62%,#0b2222ba);backdrop-filter:blur(30px) saturate(1.15);border:1px solid #ffffff5c;box-shadow:inset 2px 1px 3px #ffffff4f,inset -1px 0 12px #d5e7da19,10px 0 22px #12231d33}
.sidebar:before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(122deg,#ffffff18 0,#ffffff02 24%,transparent 50%,#a8cbb511 85%);pointer-events:none;z-index:-1}.sidebar:after{content:'';position:absolute;left:2px;top:22px;bottom:22px;width:1px;background:linear-gradient(transparent,#ffffff70,transparent);pointer-events:none}.sidebar nav button.active{background:linear-gradient(105deg,#ffffff13,#c5d4c81a);border:1px solid #ffffff14;box-shadow:inset 0 1px 1px #fff2,0 4px 10px #06191712}.sidebar nav button{color:#d2dad5}.side-search{background:#d6e9d507;border-color:#ffffff38;box-shadow:inset 0 1px 2px #0001}.brand-card{background:linear-gradient(125deg,#ffffff0c,#142b2552);border-color:#ffffff30;box-shadow:inset 0 1px 1px #fff1,0 12px 15px #06120e22}
body.mode-2d .workspace{transform:none;background:#f0eee8e8}body.mode-2d .sidebar{background:#203332;backdrop-filter:none;box-shadow:none}body.mode-2d .drawer-back{display:none}body.mode-2d .drawer-front,body.mode-2d .warm .drawer-front,body.mode-2d .rose .drawer-front,body.mode-2d .blue .drawer-front{top:24px;bottom:auto;left:0;right:0;height:137px;padding:20px 16px;background:linear-gradient(125deg,#fff,#e9ece5);border:1px solid #d3dbd3;border-radius:14px;box-shadow:none}body.mode-2d .warm .drawer-front{background:#eee2d0}body.mode-2d .rose .drawer-front{background:#ecdde3}body.mode-2d .blue .drawer-front{background:#e2e8eb}body.mode-2d .drawer-card,body.mode-2d .drawer-card:hover,body.mode-2d .drawer-card:active{transform:none;filter:none;animation:none}body.mode-2d .quick-drawer{transform:none;box-shadow:0 8px 20px #172a231c}body.mode-2d .drawer-closed .quick-drawer{transform:translateX(280px)}body.mode-2d .dock{transform:none}body.mode-2d .glass{backdrop-filter:none;background:#ffffffed;box-shadow:none}
@media(max-width:800px){body.mode-3d .workspace{transform:none}.design-toggle{padding:8px}.design-toggle span{display:none}.searchbar span{font-size:9px}.header-actions{gap:6px}}
@media(prefers-reduced-motion:reduce){.workspace{transition:none}body.mode-3d .workspace{transform:none}}
.sidebar{background:linear-gradient(115deg,#ffffff1e,transparent 35%,#a9d2bd0c),linear-gradient(130deg,#16352bce,#091f20c9 75%,#1c3b30b8)}
.drawer-tools{display:flex;align-items:center;gap:7px;margin:14px 0}.drawer-tools button{background:#ffffffa6;border:1px solid #d1d5cd;border-radius:8px;min-width:25px;height:27px;font-size:18px}.drawer-tools span{font-size:10px;flex:1;text-align:center;color:#6a746e}.quick-drawer h2{padding-right:10px;overflow-wrap:anywhere}.quick-drawer{right:35px;top:162px}.drawer-stack{position:absolute;right:5px;top:168px;width:29px;display:flex;flex-direction:column;gap:8px;z-index:4;max-height:600px;overflow:auto;padding:4px 0}.drawer-stack button{writing-mode:vertical-rl;background:linear-gradient(90deg,#d5c0a1,#b39773);border:1px solid #f7ead4;border-radius:0 9px 9px 0;padding:14px 6px;min-height:85px;font-size:10px;box-shadow:3px 4px 7px #0003}.drawer-stack button.selected{background:linear-gradient(90deg,#f6eee0,#dfc9a9);color:#1b3330}.drawer-closed .drawer-stack{display:none}.quick-drawer:before{width:17px;right:-17px}.edit-dashboard{padding:9px 10px;border-radius:16px;border:1px solid #fff8;background:#ffffff75;font-size:10px;white-space:nowrap}.setting-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #dedfd7}.setting-row label{flex:1;display:flex;align-items:center;gap:10px}.setting-row button{padding:7px 11px;background:#e0e6dd;border-radius:7px}.setting-row button:disabled{opacity:.3;cursor:default}.reset-layout{margin-top:20px;background:#e5e1d5;padding:10px;border-radius:8px}.grid.single-panel{grid-template-columns:1fr}.quick-drawer #files{max-height:180px;overflow:auto}.header-actions{gap:9px}
@media(max-width:800px){.edit-dashboard{font-size:0;padding:9px}.edit-dashboard:after{content:'⚙';font-size:18px}.quick-drawer{right:32px}.drawer-stack{position:fixed;right:5px;top:110px;max-height:65vh;z-index:5}.header-actions{gap:4px}.searchbar{width:40%}}
.sidebar{background:linear-gradient(120deg,#ffffff20,transparent 24%,#ccd6df0c 36%,transparent 68%),linear-gradient(125deg,#2a3135ed,#11191deb 65%,#242e32e6);backdrop-filter:blur(28px) saturate(.8);box-shadow:inset 2px 1px 4px #ffffff70,inset -2px 0 14px #bec7d526,12px 0 25px #050b1240;border-color:#e5e7eb88}.sidebar:before{background:linear-gradient(119deg,#ffffff18,transparent 24%,#ffffff08 29%,transparent 38%,#0000000d 70%)}.sidebar nav button.active{background:linear-gradient(110deg,#ffffff17,#ccd5dc13);border-color:#ffffff24}.sidebar .brand-card{background:linear-gradient(125deg,#ffffff09,#0c151b5e)}body.mode-2d .sidebar{background:#1c2428}.diary-strip{background:linear-gradient(115deg,#192127d9,#465058a6);border-color:#fff7}
@media(min-width:1201px){.drawers{grid-template-columns:repeat(var(--card-count,4),minmax(0,1fr)) 1.08fr}.drawers.empty-cards{grid-template-columns:1fr}}
@media(min-width:801px){.workspace main{padding-right:285px}.workspace.drawer-closed main{padding-right:27px}.quick-drawer{right:48px}.drawer-stack{right:18px}}
.drawer-outgoing{pointer-events:none!important;z-index:6!important}
.drawer-stack button{font-size:9px;letter-spacing:.2px}
.quick-drawer{background:linear-gradient(120deg,rgba(255,255,255,.90),rgba(var(--drawer-tint,214,229,237),.87));backdrop-filter:blur(24px) saturate(1.1)}.drawer-stack{position:fixed!important;right:4px!important;top:175px!important;width:38px!important;max-height:65vh!important;z-index:20!important;padding:4px;overflow:auto;display:flex!important}.drawer-stack button{writing-mode:vertical-rl;min-height:125px;max-height:200px;padding:14px 8px;color:#25313c;font-size:11px;line-height:1.2;background:linear-gradient(90deg,rgba(var(--tab-tint),.9),rgba(var(--tab-tint),.65));border-color:#ffffffb3;box-shadow:0 3px 9px #17243340}.drawer-stack button.selected{background:rgb(var(--tab-tint));border:2px solid #fff;box-shadow:0 0 0 1px #48536366,0 4px 9px #15202a50;font-weight:700}.drawer-stack button:hover{filter:brightness(1.07)}.drawer-handle{display:none!important}
@media(max-width:800px){.drawer-stack{top:145px!important}.quick-drawer{right:43px}}
.drawer-stack{position:absolute!important;top:162px!important;right:5px!important;max-height:620px!important}.workspace{margin-right:18px}.drawer-tools{gap:4px}.drawer-tools button{min-width:23px}.drawer-tools span{min-width:25px}
@media(max-width:800px){.workspace{margin-right:0}.drawer-stack{position:fixed!important;top:145px!important;max-height:65vh!important}}

/* Compact animated tabs remain attached to the quick drawer. */
.drawer-stack{height:var(--rail-height,500px);max-height:var(--rail-height,500px)!important;width:38px!important;padding:0!important;gap:0;overflow:hidden!important;isolation:isolate}
.drawer-tab-list{position:relative;display:flex;flex-direction:column;gap:6px;min-height:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:none;padding:4px 4px 8px 1px;overscroll-behavior:contain}
.drawer-tab-list::-webkit-scrollbar{display:none}
.drawer-stack .drawer-rail-tab{display:flex;align-items:center;justify-content:center;flex:0 0 66px;min-height:0;max-height:none;height:66px;width:29px;padding:9px 5px;border-radius:0 10px 10px 0;writing-mode:vertical-rl;transform:translateX(-3px);opacity:.76;transition:flex-basis .38s cubic-bezier(.2,.8,.2,1),height .38s cubic-bezier(.2,.8,.2,1),transform .3s,opacity .3s,box-shadow .3s;box-shadow:2px 3px 6px #17243325;font-size:10px}
.drawer-stack .drawer-rail-tab span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drawer-stack .drawer-rail-tab.selected{flex-basis:126px;height:126px;transform:translateX(0);opacity:1;box-shadow:0 0 0 1px #48536344,2px 4px 8px #15202a40}
.drawer-stack .drawer-rail-tab:hover,.drawer-stack .drawer-rail-tab:focus-visible{opacity:1;transform:translateX(0)}
.drawer-stack .drawer-rail-nav{display:none;writing-mode:horizontal-tb;flex:0 0 24px;height:24px;min-height:24px;width:30px;max-height:24px;padding:0;margin:2px 0;border:1px solid #ffffff8c;border-radius:9px;background:#f6f3ebad;font-size:17px;box-shadow:none;color:#253332}
.drawer-stack.rail-overflow .drawer-rail-nav{display:block}.drawer-stack .drawer-rail-nav:disabled{opacity:.35;cursor:default}
@media(max-width:800px){.drawer-stack{height:min(var(--rail-height,500px),65vh);max-height:65vh!important}}
@media(prefers-reduced-motion:reduce){.drawer-stack .drawer-rail-tab{transition:none}}

/* Shared workspace controls */
.sync-status{border:1px solid #93baa4;border-radius:12px;background:#e5f3e9;color:#164936;padding:9px 12px;font-size:11px;max-width:180px}
.sync-login{border:1px solid #fff;border-radius:24px;background:#eef1ed;color:#152522;padding:30px;max-width:min(420px,90vw);box-shadow:0 20px 80px #0006}
.sync-login::backdrop{background:#102120d9;backdrop-filter:blur(18px)}
.sync-error{color:#a83227;font-size:13px}.sync-issue{padding:18px 0;border-bottom:1px solid #c9ceca}.sync-issue small{display:block;color:#56665d;font-size:11px;margin-top:6px}.sync-issue p{white-space:pre-wrap;overflow-wrap:anywhere}
#files a{color:#214f60;overflow-wrap:anywhere}#files .file-row{flex-shrink:0}#files{max-height:350px;overflow:auto}
@media(max-width:800px){.header-actions{flex-wrap:wrap}.sync-status{max-width:140px;font-size:10px;padding:7px}.sync-login{padding:22px}}