/* Material study: warm smoked glass, clear edges, readable working surfaces. */
:root{--ink:#282923;--muted:#68685f;--teal:#357e70;--line:#ffffff66;--shadow:inset 0 1px 0 #ffffff85,inset 1px 0 0 #ffffff30,0 14px 40px #201a171c}
body{background:radial-gradient(ellipse at 85% 8%,#eee8db 0,transparent 55%),radial-gradient(ellipse at 12% 90%,#a8b5ac 0,transparent 60%),linear-gradient(125deg,#b7b3a7,#d2c7b6 60%,#aaa99c);background-attachment:fixed;color:var(--ink)}
body:before{background:linear-gradient(115deg,#e5d9c51a,#ffffff05 45%,#5a3d2012);filter:none}
.shell{padding:24px;gap:16px;grid-template-columns:194px minmax(0,1fr)}
.sidebar{top:24px;height:calc(100vh - 48px);padding:24px 12px 16px;background:linear-gradient(130deg,#eee5d449,#c2b5a32b);backdrop-filter:blur(25px) saturate(80%);-webkit-backdrop-filter:blur(25px) saturate(80%);border:1px solid #fff7;border-radius:26px;box-shadow:inset 0 1px 1px #fffb,inset -1px -1px 1px #fff2,0 20px 55px #30241428}
.main{padding:0 0 18px;min-width:0}
.topbar{height:53px;border-radius:28px;background:linear-gradient(100deg,#a69c8d52,#eee9df4a);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid #fffa;box-shadow:inset 0 1px 1px #ffffffa0,0 8px 25px #34271a15;padding:0 17px;margin-bottom:20px}
#content{background:linear-gradient(130deg,#eee8df4d,#b4a59334 55%,#dbcebc45);backdrop-filter:blur(22px) saturate(85%);-webkit-backdrop-filter:blur(22px) saturate(85%);border:1px solid #ffffff75;border-radius:28px;padding:24px;box-shadow:inset 0 1px 1px #ffffffa0,inset -1px -1px 1px #fff3,0 25px 70px #32241625;min-height:calc(100vh - 157px)}
.glass{background:linear-gradient(130deg,#fffdfb66,#e4ded349);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid #ffffff85;border-radius:20px;box-shadow:inset 0 1px 1px #fffb,inset 0 -1px 1px #fff3,0 8px 24px #33261c15}
.card,.stat{transition:box-shadow .2s,background .2s}
.card:hover,.stat:hover{box-shadow:inset 0 1px 1px #fff,0 12px 26px #33261c1c}
.stat{background:linear-gradient(135deg,#ffffff80,#ede9e15c)}
.stat.highlight{background:linear-gradient(130deg,#67b2a099,#2b7b6ce0);border:1px solid #b8e4d69c;box-shadow:inset 0 1px 1px #e7fffbbb,0 9px 25px #204f4330}
.stat.highlight .stat-label,.stat.highlight .stat-foot{color:#edf9f2}
.btn,.icon-btn,.role-select{border-radius:22px;background:linear-gradient(160deg,#fffdfbd6,#eee8de9c);border:1px solid #ffffffa6;box-shadow:inset 0 1px 0 #fff,0 3px 8px #36281912;backdrop-filter:blur(14px);color:#3e3d35}
.btn.primary{background:linear-gradient(140deg,#373934,#20251f);border:1px solid #626b5f;color:#fffef7;box-shadow:inset 0 1px 0 #ffffff32,0 6px 15px #1f251e26}
.btn.primary:hover{background:linear-gradient(140deg,#4b5146,#292f25)}
.role-select{background:#f5f0e3a0;border-color:#fff8;font-size:10px}
.brand{color:#2f322b}.brand-mark{background:linear-gradient(140deg,#528a79,#326457);box-shadow:inset 0 1px 0 #fff5,0 3px 10px #293e2520}.brand small,.nav-label,.sidebar .nav-label,.profile small{color:#67695e}
.nav{color:#565b4e;border-radius:20px}.nav:hover{background:#ffffff30}.nav.active{background:linear-gradient(130deg,#fffefbb0,#fffdfb70);border:1px solid #ffffffe0;box-shadow:inset 0 1px 0 white,0 4px 10px #4b40231a;color:#303c30}
.nav .count{background:#e7eadd90}.nav.active svg{color:#3a6a57}.profile{border-color:#ffffff5c}.profile .avatar{background:#f0f2e7a0;border:1px solid #fffc}
.heading{margin:2px 0 24px}.heading h1,.board-hero h1{color:#282c25;font-weight:650;letter-spacing:-1px}.heading p,.board-hero p,.board-kicker,.board-metric p,.stat-label,.stat-foot,.card-head p,.muted,.crumb{color:#62665b}
.board-hero{margin:0 0 22px}.board-kicker{font-size:9px;letter-spacing:1.6px}.board-hero h1{font-size:29px}.board-people small{color:#626556}.board-people .avatar{border-color:#e7e1d3}
.board-metric{border-radius:17px;background:linear-gradient(130deg,#ffffff75,#e5e0d54d)}.board-metric strong{color:#30362e}.board-metric .metric-symbol{background:#f8f4eb63;border-color:#fff9;color:#638572;border-radius:50%}
.board-container{background:linear-gradient(120deg,#fffaf04a,#dcd5c83d);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid #ffffffb0;border-radius:21px;box-shadow:inset 0 1px 1px #ffffffdf,0 14px 30px #392d1e16}
.board-viewbar{border-color:#ffffff4d;background:#b2a79718;padding:8px 14px}
.board-views{gap:5px}.board-views button{border:1px solid transparent;border-radius:24px;padding:9px 13px;color:#66665a;font-size:10px}
.board-views button.active{border:1px solid #fff;background:linear-gradient(145deg,#ffffffe0,#f6f4ecc9);box-shadow:0 3px 8px #46381e15;color:#3b5144}
.view-save{color:#5c6656}.board-tools{padding:14px;gap:7px;border-bottom:1px solid #fff4}.board-tools input,.board-tools select,.board-tools .tool{border-radius:18px;background:linear-gradient(160deg,#fffcf774,#e9e3d852);border:1px solid #ffffff85;box-shadow:inset 0 1px 0 #ffffff85;color:#515b4d}
.board-tools .tool:hover,.board-tools .tool.active{background:#fff9}.board-search::placeholder{color:#74766a}.board-tools .search-icon svg{color:#727e6b}
.grid-scroll{max-height:calc(100dvh - 545px);scrollbar-color:#9b9a89 #eee9dd80}
.work-grid th{background:#e6e2d6ed;color:#5d6254;border-color:#928b742b}
.work-grid td{background:#fffdf282;border-color:#aaa18d35}
.work-grid tbody tr:hover td{background:#fffdf5bd}
.work-grid .sticky-check,.work-grid .sticky-name{background:#eeeadef5}
.work-grid th.sticky-check,.work-grid th.sticky-name{background:#e3e0d3f7}
.work-grid tr.selected td{background:#d1e2d3e0}
.work-grid .cell-control{color:#454e40}
.work-grid .cell-control:disabled{color:#61685c}
.work-grid .cell-control:focus{background:#fffdf5;outline-color:#6e9b83}
.work-grid .status-select{border-radius:5px;background:#95c6b391;border-color:#ffffff65;color:#325d49}
.grid-group td{background:#b3c3ae7a!important}.grid-group td strong{color:#3f5d44}
.work-grid tfoot td,.work-grid tfoot .sticky-name{background:#e2e1d1f5;color:#626959}
.name-cell button{color:#394b38}.name-cell .avatar{background:#e1e6d8;border:1px solid #ffffffa0;color:#566b4c}
.board-bottom,.add-row{background:#efeadb30;color:#5d6656;border-color:#ffffff66}
.board-key{color:#505b48}.summary-capsule,.chip{background:#f9f5e6a0;border-color:#fff9;color:#656754}
.board-progress .progress{background:#bec5b070}.board-progress .progress i{background:#629b7e}
.kanban-column{background:#d6cfbe4a;border-color:#fff9}.kanban-card{background:linear-gradient(135deg,#fffdf4b3,#f0e8db82);box-shadow:inset 0 1px 0 white,0 5px 15px #3b2b1c15}
.settings-nav button.selected,.segments button.selected{border-radius:20px;background:#fffaf0b0;box-shadow:inset 0 1px 0 white}
.notice{background:#fcf1d596;border-color:#fff9;color:#72613f}
dialog{background:linear-gradient(135deg,#f4ede0ed,#d8d1c3f0);backdrop-filter:blur(35px);-webkit-backdrop-filter:blur(35px);border:1px solid #fff;border-radius:26px;box-shadow:inset 0 1px 0 #fff,0 40px 90px #1e1a1550}
dialog::backdrop{background:#39342b30;backdrop-filter:blur(8px)}
input,select,textarea{background:#fffdf4a0;border-color:#fff9}.table-wrap th{background:#eee9dc91;color:#656855}.table-wrap td{border-color:#a8a38f40}
.footer-note{color:#f6f1e7;text-shadow:0 1px 4px #3b2d1b;padding:0 9px}.attention-item{border-color:#aaa28a38}.attention-symbol{background:#f4e6c975;color:#988252}.chart text{fill:#666b5d}.chart line{stroke:#939b8138}.login-box{background:linear-gradient(145deg,#eee9deb0,#ddd3c187)}
@media(min-width:1600px){.shell{padding:28px;gap:20px}.sidebar{top:28px;height:calc(100vh - 56px)}#content{padding:30px}.grid-scroll{max-height:calc(100dvh - 570px)}}
@media(max-width:1000px){.shell{padding:14px;grid-template-columns:175px minmax(0,1fr);gap:12px}.sidebar{top:14px;height:calc(100vh - 28px)}#content{padding:18px}.board-views button{padding:8px 10px}.grid-scroll{max-height:55vh}}
@media(max-width:760px){.shell{display:block;padding:10px}.sidebar{background:linear-gradient(135deg,#eee7d6d9,#c7beabd9)}#content{padding:16px 12px;border-radius:23px}.topbar{border-radius:25px;padding:0 10px}.board-hero{margin-top:3px}.board-hero h1{font-size:25px}.board-viewbar{padding:7px}.board-views button{padding:8px;font-size:9px}.board-metrics{gap:9px}.board-metric{padding:12px}.board-metric .metric-symbol{width:25px;height:25px}.board-metric p{font-size:9px}.board-tools{padding:10px}.board-hero .row{justify-content:flex-start}.grid-scroll{max-height:55vh}.footer-note{font-size:9px;line-height:1.6}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Share the content row so both glass panels have identical top/bottom edges. */
@media(min-width:761px){
 .shell{grid-template-rows:auto auto auto;align-items:stretch;row-gap:20px}
 .main{display:contents}
 .topbar{grid-column:2;grid-row:1;margin-bottom:0}
 #content{grid-column:2;grid-row:2}
 .sidebar{grid-column:1;grid-row:2;position:relative;top:0;height:auto;align-self:stretch}
 .footer-note{grid-column:2;grid-row:3;margin:0}
}