:root{--purple:#7957FF;--lavender:#C7B6FF;--pink:#FF70B8;--bg:#F8F7FC;--ink:#241a3d;--muted:#6f6787;--card:#ffffff;--line:#e8e4f5;--red:#e5484d;--yellow:#f5a524;--blue:#3b82f6;--green:#22a06b;--grey:#8a8a9a;--shadow:0 8px 28px rgba(121,87,255,.12);--radius:18px}*{box-sizing:border-box}html,body{margin:0;padding:0;overflow-x:hidden}img,video,iframe{max-width:100%}pre{max-width:100%;overflow:auto;white-space:pre-wrap;word-break:break-word}table{max-width:100%;display:block;overflow-x:auto}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink);overflow-wrap:break-word}body.dark{--bg:#171225;--ink:#f2eefc;--muted:#b3a9cf;--card:#221b38;--line:#3a2f5c;--shadow:0 8px 28px rgba(0,0,0,.4)}a{color:var(--purple)}button{font:inherit;cursor:pointer}input,select,textarea{font:inherit;color:inherit;background:var(--card);border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;width:100%}input:focus,select:focus,textarea:focus{outline:2px solid var(--lavender);border-color:var(--purple)}label{font-size:13px;font-weight:700;color:var(--muted);display:block;margin:14px 0 6px}.btn{border:none;border-radius:999px;padding:11px 20px;font-weight:800;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;box-shadow:0 6px 18px #7957ff59}.btn:hover{filter:brightness(1.06)}.btn.ghost{background:var(--card);color:var(--purple);border:1.5px solid var(--lavender);box-shadow:none}.btn.danger{background:var(--red);box-shadow:none}.btn.small{padding:7px 14px;font-size:13px}.btn:disabled{opacity:.55;cursor:not-allowed}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.grid{display:grid;gap:14px}.grid.stats{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.stat b{font-size:28px;display:block}.stat span{color:var(--muted);font-size:13px;font-weight:700}.badge{display:inline-block;padding:4px 10px;border-radius:999px;font-size:11px;font-weight:800;letter-spacing:.3px;color:#fff}.badge.BELUM{background:var(--red)}.badge.SEDANG{background:var(--yellow)}.badge.MENUNGGU{background:var(--blue)}.badge.SELESAI{background:var(--green)}.badge.DITOLAK,.badge.PERLU_PERBAIKAN{background:var(--grey)}.badge.platform{background:var(--lavender);color:#3d2a7a}.badge.type{background:#ffe3f1;color:#a12a6b}.layout{display:flex;min-height:100vh}.sidebar{width:250px;flex-shrink:0;background:linear-gradient(180deg,#2b1a5e,#7957ff);color:#fff;padding:20px 14px;display:flex;flex-direction:column;gap:4px;position:sticky;top:0;height:100vh;overflow:auto}.sidebar h1{font-size:20px;margin:0 0 2px;letter-spacing:1px}.sidebar .slogan{font-size:12px;color:var(--lavender);font-weight:700;margin-bottom:18px}.navitem{display:block;width:100%;text-align:left;background:transparent;border:none;color:#e9e4ff;padding:10px 12px;border-radius:12px;font-weight:700}.navitem:hover{background:#ffffff24}.navitem.active{background:#fff;color:var(--purple)}.navitem.secret{border:1.5px dashed var(--pink);color:#ffd6ec}.sidehead{display:flex;flex-direction:column}.navtoggle{display:none}.navgrid{display:flex;flex-direction:column;gap:4px}.main{flex:1;padding:22px;min-width:0;max-width:1100px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex-wrap:wrap}.topbar h2{margin:0;font-size:24px}.topbar .who{color:var(--muted);font-weight:600}.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}.toolbar input,.toolbar select{width:auto;flex:1;min-width:140px}.taskcard{display:flex;flex-direction:column;gap:8px}.taskcard h3{margin:0;font-size:17px}.taskcard p{margin:0;color:var(--muted);font-size:14px}.taskmeta{display:flex;gap:6px;flex-wrap:wrap}.taskactions{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}.deadline-soon{border:2px solid var(--red)}.deadline-soon .dl{color:var(--red);font-weight:800}.loginwrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#7957ff33,#ff70b833),var(--bg)}.loginbox{width:100%;max-width:420px;text-align:center}.loginbox h1{font-size:34px;margin:0;letter-spacing:1px}.loginbox h1 span{color:var(--purple)}.loginbox .slogan{color:var(--pink);font-weight:900;letter-spacing:2px;margin:6px 0 20px}.loginbox form{text-align:left}.err{background:#ffe1e1;color:#a11;border-radius:12px;padding:10px 12px;font-size:14px;margin-bottom:10px}.ok{background:#d9f5e6;color:#0a6b3c;border-radius:12px;padding:10px 12px;font-size:14px;margin-bottom:10px}.toastwrap{position:fixed;bottom:90px;left:50%;transform:translate(-50%);z-index:999;display:flex;flex-direction:column;gap:8px;align-items:center}.toast{background:#241a3d;color:#fff;padding:10px 18px;border-radius:999px;box-shadow:var(--shadow);font-weight:700;font-size:14px}.fab{position:fixed;right:20px;bottom:20px;width:60px;height:60px;border-radius:50%;border:none;font-size:28px;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff;box-shadow:0 10px 26px #7957ff73;z-index:998}.aipanel{position:fixed;right:20px;bottom:92px;width:min(360px,calc(100vw - 40px));height:460px;max-height:70vh;background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden;z-index:997}.aipanel header{padding:14px 16px;font-weight:900;background:linear-gradient(135deg,var(--purple),var(--pink));color:#fff}.aimsgs{flex:1;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:8px}.msg{padding:9px 12px;border-radius:14px;max-width:88%;font-size:14px;line-height:1.45;white-space:pre-wrap;word-break:break-word}.msg.me{align-self:flex-end;background:var(--purple);color:#fff}.msg.them{align-self:flex-start;background:#efeafd;color:var(--ink)}body.dark .msg.them{background:#332a52}.aisend{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}.chatlayout{display:grid;grid-template-columns:260px 1fr;gap:14px}.chatlist{display:flex;flex-direction:column;gap:6px}.room{padding:10px 12px;border-radius:12px;border:1.5px solid var(--line);background:var(--card);cursor:pointer;font-weight:700;text-align:left;width:100%}.room.active{border-color:var(--purple);background:#efeafd}body.dark .room.active{background:#332a52}.comment{border:1.5px solid var(--line);border-radius:14px;padding:12px;display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.comment p{margin:0;flex:1}.pager{display:flex;gap:8px;align-items:center;justify-content:center;margin-top:16px}.pager button{border:1.5px solid var(--lavender);background:var(--card);border-radius:10px;padding:7px 12px;font-weight:700}.kv{display:grid;grid-template-columns:140px 1fr;gap:6px 12px;font-size:14px}.kv b{color:var(--muted)}img.proof{max-width:100%;border-radius:14px;border:1px solid var(--line)}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.genlinkrow{display:flex;gap:8px}.genlinkrow input{flex:1;min-width:0}.genlinkrow .btn{flex-shrink:0}.detailhead{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.detailhead h3{min-width:0;overflow-wrap:break-word}.aisend input{flex:1;min-width:0;width:auto}.aisend .btn{flex-shrink:0}@media (max-width:820px){.layout{flex-direction:column}.sidebar{width:100%;height:auto;position:sticky;top:0;z-index:900;padding:12px 14px;flex-direction:column;gap:0}.sidehead{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px}.sidebar h1{font-size:17px;margin:0;white-space:nowrap}.sidebar .slogan{font-size:11px;margin:2px 0 0}.navtoggle{display:flex;align-items:center;justify-content:center;width:42px;height:42px;flex-shrink:0;border:1.5px solid rgba(255,255,255,.45);border-radius:12px;background:#ffffff24;color:#fff;font-size:20px;font-weight:900}.navgrid{display:none}.navgrid.open{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;max-height:55vh;overflow-y:auto;padding-bottom:4px}.navitem{width:100%;min-height:44px;display:flex;align-items:center;padding:10px 12px;font-size:14px;line-height:1.25;overflow-wrap:break-word}.navitem.secret{width:100%}.main{padding:14px 14px 96px}.topbar{flex-direction:column;align-items:stretch}.topbar h2{font-size:20px;line-height:1.25}.topbar .btn{width:100%}.grid.stats{grid-template-columns:repeat(2,1fr);gap:10px}.stat b{font-size:22px}.card{padding:14px}.toolbar{flex-direction:column;flex-wrap:nowrap}.toolbar input,.toolbar select{width:100%;flex:none;min-width:0}.taskcard h3{font-size:16px;line-height:1.3;overflow-wrap:break-word}.taskcard .taskactions .btn{flex:1 1 auto;text-align:center}.comment{flex-wrap:wrap}.comment>div{display:flex;flex-wrap:wrap}.kv{grid-template-columns:110px 1fr}.kv span{min-width:0;overflow-wrap:break-word}.kv a{overflow-wrap:anywhere}.chatlayout,.two{grid-template-columns:1fr}.loginbox h1{font-size:28px}.genlinkrow{flex-direction:column}.genlinkrow .btn{width:100%}.detailhead{flex-wrap:wrap}.fab{right:14px;bottom:16px;width:52px;height:52px;font-size:24px}.aipanel{right:12px;left:12px;bottom:80px;width:auto;height:min(460px,62vh);max-height:62vh}.toastwrap{bottom:84px;left:12px;right:12px;transform:none;width:auto}.toast{max-width:100%;text-align:center}}@media (max-width:420px){.grid.stats{grid-template-columns:repeat(2,1fr);gap:8px}.main{padding:12px 12px 96px}.topbar h2{font-size:19px}.kv{grid-template-columns:96px 1fr}.pager{flex-wrap:wrap}}
