@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#090a10;--panel:#11131d;--panel2:#151725;--line:#25283a;--text:#f2f3fb;--muted:#858aa5;--purple:#9b8cff;--purple2:#7665ee;--green:#72e2b4;--red:#ff7587;--radius:18px}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh;overflow-x:hidden}button,input,select{font:inherit}button{cursor:pointer}.ambient{position:fixed;pointer-events:none;filter:blur(100px);opacity:.14;border-radius:50%;z-index:-1}.ambient-a{width:460px;height:460px;background:#6d4cff;top:-240px;left:10%}.ambient-b{width:380px;height:380px;background:#266a9e;right:-220px;top:42%}.shell{max-width:1400px;margin:auto;padding:0 38px}.topbar{height:90px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0d}.brand{display:flex;gap:12px;align-items:center;color:inherit;text-decoration:none}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border:1px solid #a99bff7a;background:linear-gradient(145deg,#8e7aff35,#8e7aff05);border-radius:13px;font:700 24px 'Space Grotesk';color:#c2b9ff;box-shadow:0 0 26px #8268ff14}.brand strong{display:block;font:700 17px 'Space Grotesk';letter-spacing:2.5px}.brand small{display:block;font-size:9px;letter-spacing:1.8px;color:#8186a0;margin-top:4px}.topbar-right{display:flex;align-items:center;gap:10px}.system-dot{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 12px #72e2b4}.tiny{font-size:10px;letter-spacing:1.5px;color:var(--muted)}.login-layout{min-height:calc(100vh - 160px);display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:9%;padding:65px 5%}.eyebrow,.card-kicker{font-size:10px;font-weight:700;letter-spacing:2.2px;color:#aaa0ff;display:flex;align-items:center;gap:10px}.line{display:inline-block;width:24px;height:1px;background:var(--purple)}h1,h2,p{margin-top:0}h1{font:600 clamp(42px,5.3vw,70px)/1.06 'Space Grotesk';letter-spacing:-2.5px;margin:25px 0 22px}h1 span{color:var(--purple)}.hero-copy>p{max-width:470px;color:#9a9eb4;line-height:1.8;font-size:15px}.hero-stat-row{display:flex;gap:40px;margin-top:55px}.hero-stat-row strong{display:block;font:600 23px 'Space Grotesk'}.hero-stat-row small{display:block;color:#777d98;font-size:9px;letter-spacing:1.4px;margin-top:7px}.login-card,.panel,.stat-card,.modal-card{background:linear-gradient(145deg,#141622f5,#10121bf5);border:1px solid #ffffff10;box-shadow:0 20px 70px #0002}.login-card{border-radius:22px;padding:36px;max-width:440px;width:100%;justify-self:end}.login-card h2,.modal-card h2{font:600 28px 'Space Grotesk';margin:15px 0 8px}.muted{color:var(--muted);font-size:13px;line-height:1.65}.login-card form{margin-top:28px}label{display:block;color:#c5c8d9;font-size:12px;font-weight:600;margin:17px 0 8px}input,select{width:100%;border:1px solid #2b2e42;border-radius:10px;background:#0c0e16;color:#f5f5fc;padding:13px 14px;outline:none;transition:.2s}input:focus,select:focus{border-color:#8e7cff;box-shadow:0 0 0 3px #8e7cff18}input::placeholder{color:#626780}.btn{border:1px solid transparent;border-radius:10px;padding:12px 16px;font-size:12px;font-weight:700;transition:.2s;display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap}.btn:hover{transform:translateY(-1px)}.btn-primary{background:linear-gradient(120deg,#9d8cff,#7664eb);color:#0a0915;box-shadow:0 8px 25px #8e7cff20}.btn-secondary{background:#1a1c2a;border-color:#2d3044;color:#d9daeb}.btn-quiet{background:transparent;border-color:#2c2e40;color:#c7c9dc;padding:8px 12px}.btn-danger{background:#3a1722;border-color:#66303d;color:#ff9aaa}.full{width:100%;margin-top:22px;padding:14px}.secure-note{border-top:1px solid #ffffff0d;padding-top:18px;margin-top:22px;font-size:10px;color:#777d95}.secure-note span{color:var(--purple);font-size:16px;margin-right:8px}.message{min-height:16px;color:#ff9aaa;font-size:12px;margin:10px 0 0}.hidden{display:none!important}.page-heading{display:flex;justify-content:space-between;align-items:center;padding:44px 0 28px}.page-heading h1{font-size:43px;margin:16px 0 10px;letter-spacing:-1.6px}.page-heading p{margin-bottom:0}.welcome-pill{display:flex;align-items:center;gap:12px;border:1px solid #ffffff12;background:#121420;padding:10px 15px;border-radius:14px}.avatar{width:36px;height:36px;border-radius:11px;background:#2a254b;color:#c4baff;display:grid;place-items:center;font-weight:700}.welcome-pill strong,.welcome-pill small{display:block}.welcome-pill strong{font-size:12px}.welcome-pill small{font-size:9px;color:var(--purple);letter-spacing:1.4px;margin-top:4px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat-card{padding:21px 22px;border-radius:15px}.stat-label{font-size:9px;color:#9297b1;letter-spacing:1.2px;font-weight:700;display:flex;justify-content:space-between}.stat-label span{color:var(--purple);font-size:14px}.stat-label .green{color:var(--green)}.stat-label .purple{color:var(--purple)}.stat-card>strong{display:block;font:600 32px 'Space Grotesk';margin:17px 0 7px}.stat-card>small{font-size:10px;color:#737994}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin:30px 0 16px}.search-wrap{display:flex;align-items:center;gap:10px;background:#11131d;border:1px solid #26293b;border-radius:10px;padding:0 12px;width:min(400px,100%);color:#8884ff}.search-wrap input{border:0;background:transparent;box-shadow:none;padding:12px 0;font-size:12px}.toolbar-actions{display:flex;gap:10px}.panel{border-radius:17px;overflow:hidden}.panel-head{padding:22px 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff0b}.panel-head h2{font:600 18px 'Space Grotesk';margin:0 0 5px}.panel-head p{margin:0;font-size:11px}.count-badge{border:1px solid #34304f;background:#211d37;color:#b9adff;border-radius:7px;padding:7px 9px;font-size:9px;letter-spacing:1px;font-weight:700}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:900px}th{text-align:left;padding:14px 18px;background:#0d0f18;color:#757b96;font-size:9px;letter-spacing:1px;font-weight:700}td{padding:16px 18px;border-top:1px solid #ffffff08;color:#d8daea;font-size:11px}tbody tr:hover{background:#ffffff03}.member-cell{display:flex;align-items:center;gap:11px}.member-initial{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#24213d;color:#b8adff;font-size:11px;font-weight:700}.member-name{font-size:12px;font-weight:700}.member-sub{font-size:9px;color:#717792;margin-top:4px}.title-chip{display:inline-block;padding:6px 8px;background:#1b1d2b;border:1px solid #2b2e42;border-radius:6px;font-size:10px;color:#c4c7da}.rating{font-variant-numeric:tabular-nums;font-weight:600}.target-value{color:#c2b7ff;font-weight:700}.status{display:inline-flex;align-items:center;gap:6px;padding:6px 8px;border-radius:6px;font-size:9px;font-weight:700;white-space:nowrap}.status:before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor}.status-progress{background:#28213b;color:#c1aaff}.status-reached{background:#163329;color:#77e1b3}.action-btn{border:1px solid #303348;background:#191b29;color:#b9bdd1;border-radius:7px;padding:6px 9px;font-size:10px}.action-btn:hover{border-color:#8b7bff;color:white}.empty{text-align:center;color:#8186a0;padding:40px}.panel-foot{display:flex;justify-content:space-between;padding:13px 20px;border-top:1px solid #ffffff0a;color:#686e89;font-size:9px;letter-spacing:.8px}.bottom-actions{display:flex;align-items:center;justify-content:space-between;margin:16px 0 28px}.bottom-actions .muted{font-size:11px}footer{border-top:1px solid #ffffff0d;display:flex;justify-content:space-between;padding:24px 0;color:#666c85;font-size:9px;letter-spacing:1px}.footer-sep{color:#a79bff;margin:0 8px}.modal{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:20px}.modal-backdrop{position:absolute;inset:0;background:#03040bd9;backdrop-filter:blur(8px)}.modal-card{position:relative;width:min(480px,100%);max-height:90vh;overflow:auto;border-radius:20px;padding:28px;z-index:1}.modal-wide{width:min(700px,100%)}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:20px}.modal-head h2{margin-bottom:0}.icon-btn{background:#202232;border:1px solid #34364a;color:#c8c9d9;border-radius:9px;width:32px;height:32px;font-size:22px}.preview-box{display:grid;grid-template-columns:1fr auto;align-items:center;background:#1a1730;border:1px solid #3b315e;border-radius:12px;padding:14px 15px;margin-top:20px}.preview-box span{font-size:11px;color:#a8a0cf}.preview-box strong{font:600 22px 'Space Grotesk';color:#c9bdff}.preview-box small{grid-column:1/-1;font-size:9px;letter-spacing:1px;color:#b5a8ff;margin-top:7px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:24px}.history-list{display:flex;flex-direction:column;gap:10px}.history-item{padding:14px;background:#0d0f18;border:1px solid #24273a;border-radius:10px}.history-item strong{font-size:12px}.history-item p{font-size:11px;color:#9a9fb7;margin:6px 0}.history-item small{font-size:9px;color:#777d98}.confirm-card{text-align:center;width:min(420px,100%)}.warning-icon{margin:0 auto 12px;width:46px;height:46px;border-radius:15px;background:#3a2027;color:#ff9baa;display:grid;place-items:center;font:700 24px 'Space Grotesk'}.confirm-card h2{font-size:23px}.confirm-card .modal-actions{justify-content:center}.toast{position:fixed;right:24px;bottom:24px;background:#202234;border:1px solid #3c3e55;color:#e9e9f8;border-radius:10px;padding:13px 16px;font-size:12px;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none;z-index:20;max-width:calc(100% - 48px)}.toast.show{opacity:1;transform:translateY(0)}
@media(max-width:900px){.shell{padding:0 22px}.login-layout{grid-template-columns:1fr;gap:35px;padding:45px 2%}.hero-stat-row{margin-top:30px}.login-card{justify-self:start;max-width:none}.stats-grid{grid-template-columns:repeat(2,1fr)}.page-heading h1{font-size:36px}}@media(max-width:600px){.shell{padding:0 15px}.topbar{height:76px}.tiny{display:none}.login-layout{padding:38px 0}.hero-stat-row{gap:23px}.hero-stat-row strong{font-size:20px}.hero-stat-row small{font-size:8px}.login-card{padding:24px}.page-heading{align-items:flex-start;gap:15px;flex-direction:column}.page-heading h1{font-size:34px}.stats-grid{gap:9px}.stat-card{padding:15px}.stat-label{font-size:8px}.stat-card>strong{font-size:27px}.toolbar{align-items:stretch;flex-direction:column}.search-wrap{width:100%}.toolbar-actions{display:grid;grid-template-columns:1fr 1fr}.toolbar-actions .btn{white-space:normal;padding:11px 8px}.panel-head{padding:18px 15px}.panel-foot{gap:15px;font-size:8px}footer{gap:15px;line-height:1.7}footer span:last-child{text-align:right}.welcome-pill{align-self:flex-start}.modal-card{padding:22px}}

/* Public dashboard + compact staff-login overlay */
.login-overlay{position:fixed;inset:0;z-index:15;display:grid;place-items:center;padding:20px}
.login-backdrop{position:absolute;inset:0;border:0;background:#03040bdc;backdrop-filter:blur(9px);cursor:default}
.login-dialog{position:relative;z-index:1;justify-self:auto;max-width:460px;width:100%;border-radius:20px;padding:30px;max-height:calc(100vh - 40px);overflow:auto}
.login-dialog .modal-head{margin-bottom:18px}
.login-dialog .modal-head h2{margin:12px 0 8px}
.login-dialog .modal-head p{margin-bottom:0}
.login-dialog form{margin-top:18px}
.topbar-right #loginBtn{padding:10px 14px}
@media(max-width:600px){.login-dialog{padding:23px}.topbar-right{gap:7px}.topbar-right #loginBtn{padding:9px 10px;font-size:10px}.topbar-right .system-dot{display:none}}


/* ============================================================
   ARAXIS STATISTIC — MAROON DESIGN SYSTEM + MICRO-INTERACTIONS
   ============================================================ */
:root{
  --bg:#0b080b;
  --panel:#151015;
  --panel2:#20151b;
  --line:#3a222b;
  --text:#f8f1f3;
  --muted:#a4939b;
  --purple:#e45b70;
  --purple2:#a9233e;
  --red:#ff7182;
  --radius:18px;
}
html{scroll-behavior:smooth; color-scheme:dark}
body{
  background:
    radial-gradient(ellipse at 8% -7%, rgba(134,24,48,.22), transparent 35%),
    radial-gradient(ellipse at 96% 42%, rgba(91,20,42,.17), transparent 34%),
    var(--bg);
}
::selection{background:#a9233e;color:#fff}
.ambient-a{background:#a51e3c;opacity:.18}
.ambient-b{background:#65142d;opacity:.16}
.topbar{border-bottom-color:#e45b701a}
.brand{transition:opacity .22s ease, transform .22s ease}
.brand:hover{opacity:.96;transform:translateY(-1px)}
.brand-mark{
  border-color:#f06a7b80;
  background:linear-gradient(145deg,#a9233e60,#40101f35);
  color:#ffb4be;
  box-shadow:0 0 30px #a9233e25,inset 0 1px 0 #ffffff13;
  transition:transform .28s cubic-bezier(.2,.75,.25,1.2),box-shadow .25s ease;
}
.brand:hover .brand-mark{transform:rotate(-5deg) scale(1.055);box-shadow:0 0 32px #cf294b48}
.brand small{color:#b69fa7}
.system-dot{box-shadow:0 0 13px #72e2b4aa;animation:statusPulse 2.5s ease-in-out infinite}
.eyebrow,.card-kicker{color:#f17a8a}
.line{background:linear-gradient(90deg,#f17a8a,#a9233e)}
h1 span{color:#f16b7d}
.page-heading h1{letter-spacing:-1.9px}
.muted{color:#aa9aa1}
.login-card,.panel,.stat-card,.modal-card{
  background:linear-gradient(145deg,rgba(31,19,25,.97),rgba(17,12,16,.98));
  border-color:#e45b701e;
  box-shadow:0 22px 70px #0005, inset 0 1px 0 #ffffff05;
}
input,select{border-color:#412630;background:#100b0f;transition:border-color .22s ease,box-shadow .22s ease,background .22s ease,transform .22s ease}
input:focus,select:focus{border-color:#df5368;background:#140b10;box-shadow:0 0 0 3px #e45b7020,0 0 18px #a9233e12}
.search-wrap{background:#140e12;border-color:#3b242d;color:#f17a8a;transition:border-color .22s ease,box-shadow .22s ease,background .22s ease,transform .22s ease}
.search-wrap:focus-within{border-color:#c63a54;background:#180e13;box-shadow:0 0 0 3px #a9233e20,0 8px 24px #0002;transform:translateY(-1px)}
.search-wrap input{color:var(--text)}
.btn{
  position:relative;isolation:isolate;overflow:hidden;
  transition:transform .18s cubic-bezier(.2,.75,.25,1.25),box-shadow .22s ease,border-color .22s ease,background .22s ease,color .22s ease;
  will-change:transform;
}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent,#ffffff20,transparent);transform:translateX(-120%);transition:transform .48s ease;pointer-events:none;z-index:-1}
.btn:hover::after{transform:translateX(120%)}
.btn:hover{transform:translateY(-2px)}
.btn:active,.icon-btn:active,.action-btn:active{transform:translateY(1px) scale(.97);transition-duration:.08s}
.btn:focus-visible,.icon-btn:focus-visible,.action-btn:focus-visible{outline:2px solid #f17a8a;outline-offset:3px}
.btn-primary{
  background:linear-gradient(125deg,#f16b7d 0%,#c72d4a 53%,#8c1832 100%);
  color:#fff8f9;border-color:#f0788870;
  box-shadow:0 8px 25px #a9233e35,inset 0 1px 0 #ffffff25;
}
.btn-primary:hover{box-shadow:0 12px 30px #a9233e50,inset 0 1px 0 #ffffff30}
.btn-secondary{background:#25171e;border-color:#51303b;color:#eee1e5}
.btn-secondary:hover{border-color:#a83a50;background:#321923;box-shadow:0 8px 18px #0002}
.btn-quiet{background:#170f13;border-color:#4c2c36;color:#e8cbd2}
.btn-quiet:hover{border-color:#b13b53;background:#26121a}
.btn-danger{background:linear-gradient(125deg,#7d1c32,#4b1322);border-color:#933147;color:#ffc0c8}
.btn-danger:hover{box-shadow:0 8px 24px #8b1d3635}
.full{box-shadow:0 8px 25px #a9233e25}
.welcome-pill{border-color:#e45b7028;background:linear-gradient(135deg,#21151b,#150f13);box-shadow:0 8px 24px #0002;animation:softEnter .35s ease both}
.avatar{background:linear-gradient(145deg,#8c1d35,#3f1422);color:#ffe0e5;box-shadow:inset 0 1px 0 #ffffff20}
.welcome-pill small{color:#f17a8a}
.stats-grid{perspective:1000px}
.stat-card{
  position:relative;overflow:hidden;border-radius:16px;padding:23px 24px;
  transition:transform .28s cubic-bezier(.2,.75,.25,1.2),border-color .25s ease,box-shadow .28s ease,background .25s ease;
  animation:softEnter .52s ease both;
}
.stat-card::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,#d5445f,transparent);opacity:.48;transform:scaleX(.45);transform-origin:left;transition:transform .35s ease,opacity .35s ease}
.stat-card::after{content:"";position:absolute;width:150px;height:150px;right:-90px;top:-105px;border-radius:50%;background:#a9233e20;filter:blur(10px);transition:transform .4s ease,background .4s ease;pointer-events:none}
.stat-card:nth-child(1){animation-delay:.04s}.stat-card:nth-child(2){animation-delay:.10s}.stat-card:nth-child(3){animation-delay:.16s}.stat-card:nth-child(4){animation-delay:.22s}
.stat-card:hover{transform:translateY(-5px);border-color:#b83a532e;box-shadow:0 18px 38px #0004,0 0 0 1px #a9233e13;background:linear-gradient(145deg,#211219,#160e13)}
.stat-card:hover::before{transform:scaleX(1);opacity:1}.stat-card:hover::after{transform:scale(1.3);background:#c3294829}
.stat-label{color:#bdaab1;font-size:10px;letter-spacing:1.1px}
.stat-label span{color:#f17a8a}.stat-label .green{color:var(--green)}
.stat-label .purple{color:#ef7b8d}
.stat-card>strong{font-size:35px;letter-spacing:-.7px}
.stat-card>small{font-size:11px;color:#9c8992}
.toolbar{margin-top:32px}
.toolbar-actions .btn{min-height:42px}
.panel{border-radius:18px;transition:border-color .25s ease,box-shadow .25s ease;animation:softEnter .62s .12s ease both}
.panel:hover{border-color:#e45b702c;box-shadow:0 24px 70px #0004,0 0 0 1px #a9233e0a}
.panel-head{padding:24px 26px;border-bottom-color:#e45b7017}
.panel-head h2{font-size:21px;letter-spacing:-.35px}
.panel-head p{font-size:12px}
.count-badge{border-color:#723041;background:linear-gradient(135deg,#451b27,#2a131b);color:#ffb3bd;border-radius:8px;padding:8px 11px;font-size:10px;letter-spacing:.9px}
.table-scroll{scrollbar-color:#793047 #120c10;scrollbar-width:thin}
table{min-width:1080px}
th{padding:17px 21px;background:#180e13;color:#b69fa8;font-size:10px;letter-spacing:1.1px;border-bottom:1px solid #e45b7018}
td{padding:19px 21px;border-top-color:#ffffff0a;color:#eadfe3;font-size:13px;transition:background .2s ease}
tbody tr{animation:rowReveal .35s ease both;transition:background .2s ease,box-shadow .2s ease}
tbody tr:nth-child(1){animation-delay:.025s}tbody tr:nth-child(2){animation-delay:.05s}tbody tr:nth-child(3){animation-delay:.075s}tbody tr:nth-child(4){animation-delay:.1s}tbody tr:nth-child(5){animation-delay:.125s}tbody tr:nth-child(6){animation-delay:.15s}tbody tr:nth-child(7){animation-delay:.175s}tbody tr:nth-child(8){animation-delay:.2s}
tbody tr:hover{background:linear-gradient(90deg,#8d203317,#4614210d);box-shadow:inset 3px 0 #c63a54}
.member-cell{gap:13px}
.member-initial{width:40px;height:40px;border-radius:12px;background:linear-gradient(145deg,#8b2038,#3a1421);color:#ffdbe1;font-size:13px;box-shadow:inset 0 1px 0 #ffffff1a;transition:transform .22s ease,box-shadow .22s ease}
tbody tr:hover .member-initial{transform:scale(1.06) rotate(-3deg);box-shadow:0 5px 14px #a9233e2b}
.member-name{font-size:14px;letter-spacing:.05px;color:#fff4f6}
.member-sub{font-size:10px;letter-spacing:.7px;color:#a68b95}
.title-chip{padding:7px 10px;background:#24141b;border-color:#54303c;border-radius:7px;font-size:11px;color:#ebcbd3;transition:background .2s ease,border-color .2s ease}
tbody tr:hover .title-chip{background:#381923;border-color:#8c3044}
.rating{font-size:13px;font-weight:600;color:#e8dce0}
.target-value{color:#ff8d9c;font-weight:700;font-size:13px}
.status{padding:7px 10px;border-radius:8px;font-size:10px;letter-spacing:.1px}
.status-progress{background:#321c28;color:#f1a4b4;border:1px solid #693347}
.status-reached{background:#163329;color:#77e1b3;border:1px solid #2e6b53}
.action-btn{border-color:#54303b;background:#21131a;color:#f0dbe0;border-radius:8px;padding:8px 11px;font-size:11px;transition:transform .16s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease}
.action-btn:hover{border-color:#d14a62;color:#fff;background:#381722;box-shadow:0 5px 12px #0003;transform:translateY(-1px)}
.empty{padding:52px 24px;color:#b59da6;font-size:13px}
.panel-foot{border-top-color:#e45b7015;color:#8f7d85;font-size:10px}
footer{border-top-color:#e45b701a;color:#8d7a83}
.footer-sep{color:#ef7b8d}
.modal{backdrop-filter:none}
.modal-backdrop{background:#070407df;animation:backdropReveal .2s ease both}
.modal-card{border-color:#6b2a3b55;box-shadow:0 28px 90px #0009,inset 0 1px 0 #ffffff08;animation:modalReveal .28s cubic-bezier(.2,.8,.2,1) both}
.login-backdrop{background:#070407df;animation:backdropReveal .22s ease both}
.login-dialog{box-shadow:0 28px 90px #000a,0 0 0 1px #a9233e12,inset 0 1px 0 #ffffff0a}
.login-overlay:not(.hidden) .login-dialog{animation:modalReveal .3s cubic-bezier(.2,.8,.2,1) both}
.icon-btn{background:#26151d;border-color:#54303c;color:#f0dbe0;transition:transform .18s ease,background .2s ease,border-color .2s ease}
.icon-btn:hover{background:#3b1926;border-color:#bb3d56;transform:rotate(5deg)}
.preview-box{background:linear-gradient(135deg,#311621,#1a1016);border-color:#693044}
.preview-box span{color:#d8abb6}.preview-box strong{color:#ff9caa}
.preview-box small{color:#f0a0b0}
.history-item{background:#180e13;border-color:#492832;transition:transform .2s ease,border-color .2s ease,background .2s ease}
.history-item:hover{transform:translateX(3px);border-color:#a9364f;background:#211019}
.confirm-card h2{color:#fff0f3}
.warning-icon{background:linear-gradient(145deg,#642035,#30121d);color:#ffbdc6;box-shadow:0 0 28px #a9233e20}
.toast{background:linear-gradient(135deg,#321822,#1b1016);border-color:#723044;color:#fff0f3;box-shadow:0 12px 38px #0007;transition:opacity .22s ease,transform .3s cubic-bezier(.2,.8,.2,1)}
.toast.show{animation:toastReveal .3s cubic-bezier(.2,.8,.2,1) both}
.bottom-actions{gap:14px}
@keyframes softEnter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes rowReveal{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes modalReveal{from{opacity:0;transform:translateY(12px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes backdropReveal{from{opacity:0}to{opacity:1}}
@keyframes toastReveal{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes statusPulse{0%,100%{box-shadow:0 0 6px #72e2b477}50%{box-shadow:0 0 15px #72e2b4cc}}
@media(max-width:900px){
  .shell{padding:0 20px}
  .stats-grid{gap:12px}
  .stat-card{padding:19px}
  .panel-head{padding:21px 20px}
  td{padding:17px 18px}
}
@media(max-width:600px){
  .shell{padding:0 14px}
  .topbar{height:74px}
  .brand{gap:9px}
  .brand-mark{width:38px;height:38px;font-size:22px}
  .brand strong{font-size:15px;letter-spacing:2px}
  .brand small{font-size:8px;letter-spacing:1.2px}
  .topbar-right #loginBtn,.topbar-right #logoutBtn{padding:9px 10px;font-size:10px;gap:6px}
  .page-heading{padding:35px 0 23px}
  .page-heading h1{font-size:clamp(32px,8vw,39px);letter-spacing:-1.4px}
  .stats-grid{gap:9px}
  .stat-card{padding:16px 14px;min-width:0}
  .stat-label{font-size:8px;letter-spacing:.7px;gap:6px}
  .stat-card>strong{font-size:28px;margin:14px 0 6px}
  .stat-card>small{font-size:10px;line-height:1.45}
  .toolbar{margin-top:24px}
  .toolbar-actions{display:flex;flex-wrap:wrap}
  .toolbar-actions .btn{flex:1;white-space:normal;font-size:11px;padding:10px 9px}
  .panel-head{gap:10px;padding:19px 14px;align-items:flex-start}
  .panel-head h2{font-size:19px}
  .panel-head p{font-size:11px}
  .count-badge{font-size:9px;white-space:nowrap;padding:7px 8px}
  .panel-foot{padding:12px 14px;font-size:8px;line-height:1.5}
  .panel-foot span:last-child{text-align:right}
  footer{font-size:8px;padding:19px 0;gap:10px}
  .bottom-actions{align-items:flex-start;flex-direction:column}
  .modal-card{padding:22px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* Mobile-friendly crew directory: rating values are visible without horizontal swiping. */
.member-cards{display:none}
.mobile-empty{margin:0;padding:28px 16px;text-align:center;color:#b59da6;font-size:13px;line-height:1.6}
.member-mobile-card{min-width:0;padding:17px;border:1px solid #542a36;border-radius:14px;background:linear-gradient(145deg,#21141a,#150e12);box-shadow:0 8px 24px #0002;animation:softEnter .28s ease both;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}
.member-mobile-card:hover{border-color:#9e354c;box-shadow:0 12px 28px #0003}
.mobile-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;padding-bottom:14px;border-bottom:1px solid #e45b701a}
.mobile-card-head .member-cell{min-width:0;flex:1}
.mobile-card-head .member-cell>span:last-child{min-width:0}
.mobile-member-copy{display:flex;flex-direction:column;min-width:0}
.mobile-member-copy .member-name{overflow-wrap:anywhere;line-height:1.35}
.mobile-card-head .title-chip{flex-shrink:0;max-width:44%;white-space:normal;text-align:center;line-height:1.3}
.mobile-rating-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:14px 0}
.mobile-rating-item{min-width:0;padding:11px 12px;border:1px solid #3f252e;border-radius:10px;background:#120c10;display:flex;flex-direction:column;gap:7px}
.mobile-rating-item>span{font-size:9px;letter-spacing:.9px;font-weight:700;color:#ad929c;line-height:1.4}
.mobile-rating-item>strong{font-family:'Space Grotesk','DM Sans',sans-serif;font-size:17px;line-height:1.15;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.mobile-rating-item .target-value{color:#ff8d9c}
.mobile-target-item{grid-column:1/-1;flex-direction:row;align-items:center;justify-content:space-between;background:linear-gradient(110deg,#351620,#211117);border-color:#723044}
.mobile-target-item>strong{font-size:20px}
.mobile-card-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.mobile-card-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.mobile-card-actions .action-btn{padding:8px 10px}
.mobile-no-action{font-size:10px}
@media(max-width:680px){
  .table-scroll{display:none!important}
  .member-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:11px;padding:0 12px 16px;min-width:0;overflow:visible}
  .panel{overflow:hidden}
  .panel-head{padding:18px 14px}
  .panel-foot{gap:10px;flex-wrap:wrap}
  .panel-foot span{max-width:48%}
}
@media(max-width:360px){
  .member-mobile-card{padding:13px}
  .mobile-rating-grid{gap:7px}
  .mobile-rating-item{padding:10px}
  .mobile-rating-item>strong{font-size:15px}
  .mobile-target-item>strong{font-size:18px}
  .member-mobile-card .member-initial{width:34px;height:34px}
  .mobile-card-head .title-chip{font-size:9px;padding:6px 7px}
}
