:root { --ink:#24313a; --muted:#7b8586; --paper:#f7f6f1; --card:#fffefa; --line:#e3e4dc; --accent:#cf6339; --green:#4b8069; --blue:#52718a; --danger:#b95c63; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Cairo,sans-serif; }
button,input,select { font:inherit; } button { cursor:pointer; border:0; }
.auth-gate { min-height:100vh; display:none; place-items:center; align-content:center; gap:12px; padding:28px; text-align:center; background:radial-gradient(circle at 50% 15%,#fffefa 0,#f7f6f1 55%); }
body:not(.authenticated) .auth-gate { display:grid; }
body:not(.authenticated) .shell { display:none; }
.auth-gate-mark { width:48px; height:48px; display:grid; place-items:center; margin-bottom:8px; border-radius:14px; background:var(--ink); color:#fff; font:700 24px 'Space Grotesk',sans-serif; }
.auth-gate h1 { margin:0; font-size:30px; letter-spacing:-.05em; }
.auth-gate p { max-width:390px; margin:0 0 8px; color:var(--muted); font-size:13px; line-height:1.9; }
.auth-gate small { color:var(--muted); font-size:10px; }
.shell { min-height:100vh; display:flex; }.sidebar { width:232px; padding:34px 22px; background:#eaece4; color:var(--ink); display:flex; flex-direction:column; border-left:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:10px; font:20px 'Space Grotesk',sans-serif; direction:ltr; letter-spacing:-.04em; }.brand-mark { width:31px; height:31px; display:grid; place-items:center; border-radius:9px; background:var(--ink); color:#fff; font-weight:700; }
.sidebar-caption { color:var(--muted); font-size:11px; margin:8px 42px 38px 0; }.nav { display:grid; gap:4px; }.nav-item { color:#718080; background:transparent; border-radius:8px; padding:11px 12px; text-align:right; display:flex; gap:11px; align-items:center; }.nav-item:hover,.nav-item.active { background:var(--card); color:var(--ink); }.nav-item.active { font-weight:700; box-shadow:0 0 0 1px var(--line); }
.sidebar-note { margin-top:auto; padding:13px 12px; display:flex; gap:9px; border-top:1px solid #d6dad0; font-size:11px; }.sidebar-note p { margin:3px 0 0; color:var(--muted); line-height:1.7; }.note-dot { width:7px; height:7px; background:var(--accent); border-radius:50%; margin-top:5px; flex:none; }
.content { flex:1; max-width:1160px; padding:48px 62px; margin:0 auto; }.topbar,.section-heading,.top-actions,.score-row,.card-kicker { display:flex; align-items:center; justify-content:space-between; }.topbar { margin-bottom:46px; }.eyebrow { color:var(--accent); text-transform:uppercase; letter-spacing:.09em; font-size:10px; font-weight:800; }.topbar h1 { font-size:27px; margin:8px 0 0; letter-spacing:-.045em; font-weight:800; }.ghost-button { color:var(--muted); background:transparent; font-size:11px; padding:10px 14px; }.primary-button { background:var(--ink); color:#fff; border-radius:7px; padding:10px 16px; font-weight:700; font-size:12px; }.primary-button:hover { background:#3d4c54; }
.hero-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:28px; }.focus-card,.score-card,.task-card,.job-card { background:var(--card); border:1px solid var(--line); border-radius:10px; }.focus-card { padding:27px; min-height:225px; border-right:4px solid var(--accent); }.card-kicker { color:var(--muted); font-size:11px; justify-content:flex-start; gap:8px; }.live-dot { width:7px; height:7px; border-radius:50%; background:var(--green); }.focus-title { font-size:23px; margin:28px 0 8px; letter-spacing:-.035em; }.focus-meta { color:var(--muted); font-size:12px; }.focus-actions { display:flex; align-items:center; gap:10px; margin-top:25px; }.score-card { padding:27px; }.score-row { justify-content:flex-start; align-items:baseline; gap:6px; margin:26px 0 12px; }.score-row strong { font:700 49px 'Space Grotesk',sans-serif; letter-spacing:-.08em; }.score-row span { color:var(--muted); font-size:12px; }.progress { height:6px; background:#ecede8; border-radius:99px; overflow:hidden; }.progress span { display:block; height:100%; width:0; border-radius:99px; background:var(--green); transition:width .3s; }.score-card p { font-size:11px; color:var(--muted); margin:13px 0 0; }
.section-heading { margin:45px 0 18px; }.section-heading h2 { font-size:20px; margin:6px 0 0; letter-spacing:-.035em; }.availability { color:var(--muted); font-size:11px; }.task-queue { display:grid; gap:8px; }.task-card { display:grid; grid-template-columns:35px 1fr auto; align-items:center; gap:14px; padding:14px 17px; }.task-card.is-focus { border-color:#dca383; }.task-card.done { opacity:.52; }.task-card.done .task-name { text-decoration:line-through; }.task-rank { width:30px; height:30px; display:grid; place-items:center; border-radius:7px; color:var(--blue); background:#eef2f0; font:700 12px 'Space Grotesk'; }.task-name { font-weight:700; font-size:13px; }.task-meta { color:var(--muted); font-size:10px; margin-top:4px; }.task-score { color:var(--green); font:700 11px 'Space Grotesk'; }.task-buttons { display:flex; gap:6px; align-items:center; }.small-button { padding:7px 10px; border-radius:6px; background:#edf2f2; color:var(--blue); font-size:10px; font-weight:700; }.small-button.secondary { background:transparent; color:var(--muted); }.hidden { display:none !important; }
.jobs-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }.job-card { padding:18px; border-top:3px solid var(--accent); }.job-name { font-weight:800; margin-bottom:7px; }.job-salary { font:700 23px 'Space Grotesk'; }.job-salary small { font:400 10px Cairo; color:var(--muted); }.job-stats { color:var(--muted); font-size:11px; margin:12px 0 15px; }.job-card .small-button { width:100%; }
.modal { position:fixed; inset:0; background:#24313a55; display:grid; place-items:center; padding:20px; z-index:10; }.modal-panel { width:min(500px,100%); background:var(--card); border-radius:12px; padding:28px; position:relative; box-shadow:0 20px 60px #24313a2a; }.modal-panel h2 { margin:8px 0 25px; }.modal-close { position:absolute; left:20px; top:17px; background:#f0f1ed; border-radius:50%; width:28px; height:28px; font-size:18px; color:var(--muted); }.modal-panel form { display:grid; gap:16px; }.modal-panel label { font-size:11px; color:var(--muted); display:grid; gap:7px; }.modal-panel input,.modal-panel select { width:100%; border:1px solid var(--line); border-radius:7px; padding:10px 11px; outline:0; color:var(--ink); background:var(--card); }.modal-panel input:focus,.modal-panel select:focus { border-color:var(--accent); }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.full { width:100%; margin-top:5px; }
@media (max-width:800px) { .shell{display:block}.sidebar{width:auto;padding:17px 20px}.sidebar-caption,.sidebar-note{display:none}.nav{display:flex;margin-top:18px;overflow:auto}.nav-item{padding:9px 13px;white-space:nowrap}.content{padding:28px 18px}.topbar{align-items:flex-start;gap:12px}.topbar h1{font-size:21px}.top-actions{gap:4px;align-items:flex-start;flex-wrap:wrap}.ghost-button{display:block;padding:8px}.hero-grid{grid-template-columns:1fr}.section-heading{align-items:flex-end;gap:12px}.availability{text-align:left}.task-card{grid-template-columns:32px 1fr}.task-card .task-buttons,.task-card .task-score{grid-column:2}.task-card .task-score{text-align:right}.task-buttons{justify-content:flex-start}.form-grid{grid-template-columns:1fr} }