:root{
  --blue:#178ff0;
  --cyan:#26b9db;
  --mint:#43d9b6;
  --ink:#131923;
  --muted:#687286;
  --line:#cfe4ea;
  --panel:#ffffff;
  --danger:#e84e4e;
  --warn:#eaa629;
  --ok:#1f9d74;
  --shadow:0 18px 45px rgba(28,72,90,.12);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Arial,"Noto Sans Hebrew",sans-serif;color:var(--ink);background:#fff}
body{min-height:100vh;background-image:url('/assets/hex-pattern.svg');background-size:260px 225px;background-attachment:fixed}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
a{color:inherit}
.hidden{display:none!important}

/* Intro screens */
.intro-screen{position:fixed;inset:0;background:#fff;display:grid;place-items:center;z-index:9999;direction:ltr}
.intro-logo{width:min(58vw,650px);height:auto;animation:introFade .55s ease both}
.intro-welcome{display:flex;flex-direction:column;align-items:center;gap:28px;transform:translateY(-1vh)}
.intro-welcome .intro-logo{width:min(50vw,560px)}
.welcome-bar{width:min(300px,55vw);height:25px;border-radius:20px;background:linear-gradient(#fff,#c9c9c9);border:1px solid #aaa;overflow:hidden;box-shadow:inset 0 1px 3px rgba(0,0,0,.18)}
.welcome-bar>i{display:block;height:100%;width:0;background:linear-gradient(90deg,#00d8bd,#00a9cf);border-radius:20px;animation:loadBar .9s ease forwards}
.welcome-text{font-family:Georgia,serif;font-weight:700;font-size:22px}
@keyframes introFade{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes loadBar{to{width:72%}}

/* Login */
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:36px 20px;background-image:url('/assets/hex-pattern.svg');background-size:260px 225px}
.auth-card{width:min(620px,92vw);min-height:390px;border-radius:24px;padding:38px 58px 28px;background:linear-gradient(155deg,#178ff0 10%,#21b4d1 52%,#44d9b8 100%);box-shadow:0 26px 36px rgba(48,78,92,.24);color:#fff;position:relative}
.auth-brand{display:flex;justify-content:center;margin:0 auto 36px}
.auth-brand img{width:min(330px,75%);filter:brightness(0) invert(1);opacity:.98}
.auth-row{display:grid;grid-template-columns:160px 1fr;align-items:center;gap:16px;margin:17px 0;direction:rtl}
.auth-row label{font-weight:800;font-size:20px;text-align:right}
.auth-row input{height:40px;border-radius:18px;border:2px solid rgba(255,255,255,.88);background:#fff;color:#111;padding:0 15px;outline:none;box-shadow:inset 0 1px 3px rgba(0,0,0,.12)}
.auth-remember{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:700;margin:14px 0 18px}
.auth-remember input{width:21px;height:21px;accent-color:#fff}
.go-btn{display:block;margin:0 auto;width:76px;height:76px;border-radius:50%;border:3px solid #fff;background:linear-gradient(145deg,#1593ed,#39d5b9);color:#fff;font:bold 22px Georgia,serif;box-shadow:0 0 0 2px rgba(0,0,0,.12);transition:.18s transform}
.go-btn:hover{transform:scale(1.04)}
.auth-error{min-height:22px;text-align:center;color:#fff;font-weight:700;margin-top:12px}
.setup-note{font-size:14px;text-align:center;margin-top:12px;opacity:.9}

/* Home */
.home{min-height:100vh;display:grid;grid-template-rows:auto 1fr auto;padding:28px 42px 24px;background:rgba(255,255,255,.68);backdrop-filter:blur(.3px)}
.home-top{display:grid;grid-template-columns:240px 1fr 220px;align-items:start;gap:24px;direction:ltr}
.home-brand{direction:ltr;text-align:left;padding-top:7px}
.home-brand img{width:185px;filter:sepia(.65) saturate(6) hue-rotate(105deg) brightness(.72)}
.home-brand b{display:block;font:800 20px Georgia,serif;margin-left:74px;margin-top:-2px;letter-spacing:1px;color:#111}
.home-welcome{direction:rtl;text-align:right;max-width:650px;margin:0 auto;padding-top:8px}
.home-welcome .small{font-size:33px;color:#656565;font-weight:400;line-height:1.25}
.home-welcome .name{font-size:60px;font-weight:900;line-height:1.05;margin-top:10px;letter-spacing:-2px;color:#050505}
.home-profile{direction:ltr;display:flex;flex-direction:column;align-items:center;color:#050505}
.avatar{width:114px;height:114px;border:5px solid #060606;border-radius:50%;position:relative;overflow:hidden;background:rgba(255,255,255,.5);display:grid;place-items:center}
.avatar img{width:100%;height:100%;object-fit:cover}
.avatar-silhouette:before{content:"";position:absolute;top:17%;left:31%;width:38%;height:38%;background:#080604;border-radius:50%}
.avatar-silhouette:after{content:"";position:absolute;left:16%;bottom:-5%;width:68%;height:45%;background:#080604;border-radius:50% 50% 15% 15%}
.profile-name{font:bold 24px Georgia,serif;margin-top:8px;text-align:center}.profile-role{font:bold 21px Georgia,serif;text-align:center;margin-top:2px}
.home-main{display:flex;align-items:center;justify-content:center}
.home-actions{display:grid;grid-template-columns:repeat(3,minmax(210px,290px));gap:38px;direction:rtl;margin-top:-6vh}
.canva-button{min-height:138px;border:5px solid #fff;border-radius:32px;background:linear-gradient(150deg,#168ded 2%,#22b7d4 54%,#45dab6 100%);box-shadow:0 0 0 8px #1492ef,0 12px 0 8px #3ad3b9;color:#fff;font-weight:900;font-size:36px;text-shadow:0 2px 0 rgba(0,0,0,.05);transition:.15s transform,.15s filter}
.canva-button:hover{transform:translateY(-2px);filter:saturate(1.06)}
.home-bottom{display:grid;grid-template-columns:190px 1fr 190px;align-items:end;direction:ltr}
.home-trash,.home-users{display:flex;justify-content:center;align-items:center;direction:rtl}
.home-users .mini-canva{font-size:19px;padding:12px 22px}
.home-tools{display:flex;justify-content:center;gap:31px;direction:ltr}
.tool-icon{width:58px;height:58px;border:0;background:transparent;padding:3px;color:#050505;display:grid;place-items:center}
.tool-icon svg{width:100%;height:100%;stroke:currentColor}
.tool-icon:hover{transform:scale(1.06)}
.mini-canva{border:4px solid #fff;border-radius:24px;background:linear-gradient(145deg,#148fee,#42d9b7);box-shadow:0 0 0 4px #168ff0,0 7px 0 4px #3fd5b7;color:#fff;font-weight:900}

/* App shell */
.app-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1fr) 190px;direction:ltr;background:rgba(255,255,255,.75)}
.main-area{direction:rtl;padding:26px 34px 42px;min-width:0;background-image:url('/assets/hex-pattern.svg');background-size:260px 225px}
.sidebar{direction:rtl;position:sticky;top:0;height:100vh;padding:26px 16px 18px;background:linear-gradient(180deg,#168fec 0%,#1ca7df 46%,#36cdd0 72%,#48dcb5 100%);color:#fff;display:flex;flex-direction:column;overflow:hidden}
.sidebar:before,.sidebar:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.09);border-radius:50%;width:280px;height:280px;right:-120px;top:-130px}.sidebar:after{top:auto;bottom:50px;right:-95px;width:235px;height:235px;background:rgba(255,255,255,.04)}
.side-brand{position:relative;z-index:1;display:flex;justify-content:center;margin:2px 0 34px}
.side-brand img{width:150px;max-width:100%;filter:brightness(0) invert(1)}
.side-nav{position:relative;z-index:1;display:flex;flex-direction:column;gap:17px}
.side-nav button{height:54px;border:3px solid #fff;border-radius:28px;background:transparent;color:#fff;font-weight:900;font-size:19px;transition:.15s}
.side-nav button.active,.side-nav button:hover{background:#fff;color:#1595eb}
.side-spacer{flex:1}
.side-tools{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0 17px;direction:ltr}
.side-tools button{background:transparent;border:0;color:#fff;padding:4px}.side-tools svg{width:31px;height:31px;stroke:currentColor}
.side-trash{position:relative;z-index:1;display:flex;justify-content:center;margin-bottom:12px}
.side-trash button{background:transparent;border:0;color:#fff}.side-trash svg{width:34px;height:34px;stroke:currentColor}
.side-profile{position:relative;z-index:1;border:3px solid #fff;border-radius:27px;padding:7px 9px;display:grid;grid-template-columns:1fr 48px;align-items:center;gap:7px;background:rgba(255,255,255,.04);color:#fff}
.side-profile .mini-avatar{width:46px;height:46px;border:2px solid #fff;border-radius:50%;overflow:hidden;position:relative;background:rgba(255,255,255,.85)}
.side-profile .mini-avatar img{width:100%;height:100%;object-fit:cover}.mini-avatar.avatar-silhouette:before{top:16%;left:31%}.mini-avatar.avatar-silhouette:after{bottom:-3%}
.side-profile b{display:block;font-size:15px}.side-profile small{display:block;font-size:12px;margin-top:2px}

.page-head{display:grid;grid-template-columns:110px 1fr 110px;align-items:start;direction:ltr;min-height:95px;margin-bottom:18px}
.page-head .filter-circle,.page-head .add-circle{direction:rtl;justify-self:center;width:60px;height:60px;border:5px solid #050505;border-radius:50%;background:#fff;font-weight:900;font-size:15px;color:#050505;display:grid;place-items:center}
.page-head .add-circle{font-size:40px;line-height:1}
.page-title{text-align:center;direction:rtl}.page-title h1{margin:5px 0 4px;font-size:33px}.page-title p{margin:0;font-size:16px;color:#485466}
.grid{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:20px;align-items:start}
.card{background:#fff;border:1.5px solid #d4e5e9;border-radius:22px;padding:20px 20px 16px;min-height:160px;box-shadow:0 8px 26px rgba(49,87,102,.05);position:relative;direction:rtl;user-select:none;touch-action:manipulation}
.card:hover{box-shadow:0 12px 30px rgba(49,87,102,.11)}
.card h3{margin:12px 0 8px;font-size:21px;line-height:1.25}.card .sub{color:#5e6b80;font-size:14px;margin-bottom:14px}.card-topline{position:absolute;top:11px;right:18px;font-size:12px;font-weight:800}.card-topline.high{color:#ef4545}.card-topline.medium{color:#ed9720}.card-topline.low{color:#5a6979}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:auto}.chip{border:0;border-radius:20px;background:#edf0f3;padding:7px 13px;font-size:12px;font-weight:800;color:#2c3340}.chip.ok{background:#dcf6ee;color:#14795c}.chip.bad{background:#fee7e7;color:#a92c2c}.chip.money{background:#e9f1ff;color:#1e62b8}
.vote-actions{display:flex;gap:9px;margin-top:13px}.vote-actions button{flex:1;border:0;border-radius:18px;padding:8px 10px;font-weight:800}.approve{background:#e1f7ef;color:#15785c}.reject{background:#fee8e8;color:#a93434}.approve.selected,.reject.selected{box-shadow:inset 0 0 0 2px currentColor}
.empty{grid-column:1/-1;text-align:center;padding:70px 20px;color:#6f7c90;font-size:18px}
.card-note{font-size:13px;color:#6b7484;margin-top:8px;white-space:pre-wrap}

/* utility pages */
.utility{max-width:850px;margin:20px auto 0;background:#fff;border:1px solid var(--line);border-radius:26px;padding:28px;box-shadow:var(--shadow)}
.utility h2{margin-top:0}.utility p{line-height:1.7;color:#5f6c7e}.utility-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}.btn{border:0;border-radius:20px;padding:11px 18px;font-weight:800}.btn.primary{background:linear-gradient(145deg,#168ff0,#3ed4b7);color:#fff}.btn.secondary{background:#eef3f5;color:#26313e}.btn.danger{background:#ffe4e4;color:#a12b2b}.btn.outline{background:#fff;border:1px solid #cddde2;color:#28333e}
.trash-row{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;border-bottom:1px solid #e7eef0;padding:14px 0}.trash-row:last-child{border-bottom:0}.trash-meta{font-size:12px;color:#7a8798;margin-top:5px}

/* Forms / modal */
.modal-backdrop{position:fixed;inset:0;background:rgba(13,28,38,.42);display:grid;place-items:center;padding:20px;z-index:10000}
.modal{width:min(590px,95vw);max-height:90vh;overflow:auto;background:#fff;border-radius:25px;padding:24px;box-shadow:0 30px 80px rgba(0,0,0,.25);direction:rtl}
.modal h2{margin:0 0 18px}.field{display:flex;flex-direction:column;gap:7px;margin:12px 0}.field label{font-weight:800;font-size:14px}.field input,.field textarea,.field select{border:1.5px solid #cddfe4;border-radius:14px;padding:11px 12px;background:#fff;outline:none}.field textarea{min-height:100px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-color:#1695ea;box-shadow:0 0 0 3px rgba(22,149,234,.12)}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.modal-actions{display:flex;gap:10px;justify-content:flex-start;margin-top:20px}.check-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;max-height:180px;overflow:auto;border:1px solid #d8e5e9;border-radius:14px;padding:10px}.check-list label{display:flex;align-items:center;gap:8px;font-size:14px}

.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:#151d26;color:#fff;padding:12px 18px;border-radius:18px;z-index:20000;transition:.22s;max-width:min(90vw,520px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}.toast.error{background:#9f2f2f}
.longpress-hint{font-size:12px;color:#7c8999;text-align:center;margin:8px 0 0}

@media(max-width:980px){
  .home-top{grid-template-columns:180px 1fr 160px}.home-welcome .small{font-size:27px}.home-welcome .name{font-size:50px}.home-actions{grid-template-columns:repeat(3,minmax(160px,1fr));gap:24px}.canva-button{font-size:30px;min-height:120px}.grid{grid-template-columns:repeat(2,minmax(220px,1fr))}.app-shell{grid-template-columns:minmax(0,1fr) 170px}
}
@media(max-width:760px){
  body{background-size:210px 182px}.auth-card{padding:30px 24px}.auth-row{grid-template-columns:1fr;gap:6px}.auth-row label{text-align:right}.auth-brand{margin-bottom:22px}
  .home{padding:18px 18px 90px}.home-top{grid-template-columns:1fr 100px;direction:rtl}.home-brand{display:none}.home-welcome{text-align:right}.home-welcome .small{font-size:21px}.home-welcome .name{font-size:38px}.avatar{width:86px;height:86px;border-width:4px}.profile-name{font-size:18px}.profile-role{font-size:15px}.home-actions{grid-template-columns:1fr;gap:22px;margin:28px auto;width:min(88vw,390px)}.canva-button{min-height:92px;font-size:30px;border-radius:26px}.home-main{align-items:flex-start}.home-bottom{position:fixed;left:0;right:0;bottom:0;grid-template-columns:70px 1fr 90px;background:rgba(255,255,255,.94);padding:8px 8px 12px;z-index:50;border-top:1px solid #dcebed}.home-tools{gap:8px}.tool-icon{width:44px;height:44px}.home-users .mini-canva{font-size:13px;padding:9px 10px}
  .app-shell{display:block}.sidebar{position:fixed;left:0;right:0;bottom:0;top:auto;height:auto;z-index:100;padding:7px 8px 9px;background:linear-gradient(90deg,#178ff0,#32c8d1,#46d9b7);display:block}.side-brand,.side-spacer,.side-tools,.side-trash,.side-profile{display:none}.side-nav{flex-direction:row;gap:5px}.side-nav button{flex:1;height:45px;border-width:2px;border-radius:22px;font-size:13px;padding:0 5px}.main-area{padding:18px 13px 86px;min-height:100vh}.page-head{grid-template-columns:60px 1fr 60px;min-height:75px}.page-head .filter-circle,.page-head .add-circle{width:48px;height:48px;border-width:4px}.page-head .add-circle{font-size:32px}.page-title h1{font-size:25px}.page-title p{font-size:13px}.grid{grid-template-columns:1fr;gap:13px}.card{min-height:145px}.utility{margin:5px auto 0;padding:20px;border-radius:21px}.form-grid{grid-template-columns:1fr}.check-list{grid-template-columns:1fr}
}
@media(max-width:430px){.home-welcome .name{font-size:34px}.home-profile{align-items:flex-end}.avatar{width:76px;height:76px}.home-actions{width:92vw}.auth-card{border-radius:20px}.page-title h1{font-size:22px}.card h3{font-size:19px}}
