.tjp{display:flex;flex-direction:column;gap:14px}.tjp__flowCard{background:var(--n-card);border:1px solid var(--n-border);border-radius:16px;padding:14px 18px;box-shadow:var(--n-shadow-soft);justify-content:center}.tjp__flow,.tjp__flowCard{display:flex;align-items:center}.tjp__flow{justify-content:space-between;width:100%;max-width:540px;margin:0 auto;padding:12px 2px 2px}.tjp__step{flex-direction:column;flex-shrink:0;position:relative;z-index:2}.tjp__step,.tjp__stepCircle{display:flex;align-items:center}.tjp__stepCircle{width:28px;height:28px;border-radius:50%;background:#f1f5f9;border:2px solid #cbd5e1;color:#475569;font-size:.8rem;font-weight:700;justify-content:center;box-shadow:0 2px 4px rgba(0,0,0,.04);transition:all .2s ease}.tjp__stepCircle--done{background:#ecfdf5;border-color:#10b981;color:#059669}.tjp__connector{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;height:28px;min-width:36px;position:relative;padding:0 4px}.tjp__connectorLabel{position:absolute;bottom:calc(50% + 2px);left:50%;transform:translateX(-50%);font-size:.58rem;font-weight:700;color:#64748b;white-space:nowrap;margin-bottom:0;line-height:1;letter-spacing:.01em;text-align:center}.tjp__connectorLine{height:2px;width:100%;background:#cbd5e1;border-radius:2px;position:relative}.tjp__connectorLine:after{display:none!important}.dark .tjp__stepCircle{background:#1e293b;border-color:#475569;color:#cbd5e1}.dark .tjp__stepCircle--done{background:rgba(16,185,129,.15);border-color:#10b981;color:#34d399}.dark .tjp__connectorLabel{color:#94a3b8}.dark .tjp__connectorLine{background:#475569}@media (max-width:480px){.tjp__flowCard{padding:12px 10px}.tjp__flow{padding:16px 2px 2px}.tjp__stepCircle{width:25px;height:25px;font-size:.72rem}.tjp__connector{height:25px;min-width:24px;padding:0 2px}.tjp__connectorLabel{font-size:.5rem;margin-bottom:0}}.tjp__section{background:var(--n-card);border:1px solid var(--n-border);border-radius:18px;padding:18px}.tjp__sectionHead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;margin-bottom:14px;border-bottom:1px solid var(--n-border)}.tjp__sectionHead h3{margin:0;font-size:.9rem;font-weight:700;color:var(--n-ink);display:flex;align-items:center;gap:8px;white-space:nowrap}.tjp__sectionHead h3 i,.tjp__sectionHead h3 svg{color:var(--n-primary);flex-shrink:0}.tjp__sectionHead-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.tjp__count{background:var(--n-primary);color:#fff;border-radius:6px;padding:2px 9px;font-size:.7rem;font-weight:800;flex-shrink:0}.tjp__btn--head{padding:5px 12px;font-size:.76rem;border-radius:8px;white-space:nowrap;flex-shrink:0;background:#E0ECFF!important;border:1px solid rgba(48,131,255,.25)!important;font-weight:700;transition:all .15s ease}.tjp__btn--head,.tjp__btn--head svg{color:var(--n-ink)!important}.tjp__btn--head:hover:not(:disabled){background:#cbe0ff!important;color:#0f172a!important}.tjp__card{border:1px solid var(--n-border);border-radius:13px;padding:14px;margin-bottom:10px;background:var(--n-surface);min-width:min(100%,480px)}.tjp__card:last-child{margin-bottom:0}.tjp__card.is-busy{opacity:.6;pointer-events:none}.tjp__cardHead{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px}.tjp__pair{gap:8px;font-size:.85rem;font-weight:700;color:var(--n-ink)}.tjp__names,.tjp__pair{display:inline-flex;align-items:center;flex-wrap:wrap}.tjp__names{gap:6px}.tjp__vs{color:var(--n-muted);font-weight:400}.tjp__jenis{display:inline-flex;align-items:center;gap:5px;font-size:.75rem;font-weight:700;white-space:nowrap}.tjp__jenis--pbm{color:#1d4ed8}.tjp__jenis--piket{color:#b45309}.tjp__status{padding:3px 11px;border-radius:6px;font-size:.68rem;font-weight:800;white-space:nowrap}.tjp__status--wait{background:rgba(245,158,11,.15);color:#b45309}.tjp__status--ok{background:rgba(16,185,129,.15);color:#047857}.tjp__status--bad{background:rgba(239,68,68,.13);color:#b91c1c}.tjp__status--off{background:var(--n-soft);color:var(--n-muted)}.tjp__status--circle{width:26px;height:26px;padding:0;border-radius:50%!important;display:inline-flex;align-items:center;justify-content:center}.tjp__slots{display:flex;align-items:stretch;gap:10px}.tjp__slotBox{flex:1;min-width:0;padding:10px 12px;border-radius:10px;background:var(--n-card);border:1px solid var(--n-border);display:flex;flex-direction:column;gap:3px}.tjp__slotBox--a{border-left:3px solid var(--n-primary)}.tjp__slotBox--b{border-left:3px solid #3083ff}.tjp__slotOwner{font-size:.7rem;font-weight:700;color:var(--n-muted)}.tjp__slotVal{font-size:.8rem;font-weight:600;color:var(--n-ink);line-height:1.45}.tjp__swapIcon{align-self:center;color:var(--n-muted);font-size:1rem;flex-shrink:0}.tjp__note{margin-top:9px;font-size:.76rem;color:var(--n-muted);padding:7px 10px;background:var(--n-soft);border-radius:8px;line-height:1.5}.tjp__cardFoot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:12px}.tjp__date{font-size:.72rem;color:var(--n-muted)}.tjp__actions{display:flex;gap:8px;flex-wrap:wrap}.tjp__btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:9px;border:1px solid transparent;font-size:.78rem;font-weight:700;cursor:pointer}.tjp__btn:disabled{opacity:.5;cursor:not-allowed}.tjp__btn--ok{background:#059669;color:#fff}.tjp__btn--bad{background:rgba(239,68,68,.12);color:#b91c1c;border-color:rgba(239,68,68,.3)}.tjp__btn--ghost{background:transparent;color:var(--n-muted);border-color:var(--n-border)}.tjp__btn--ok:hover:not(:disabled){filter:brightness(1.1)}.tjp__btn--bad:hover:not(:disabled){background:rgba(239,68,68,.2)}.tjp__btn--ghost:hover:not(:disabled){background:var(--n-soft);color:var(--n-ink)}.tjp__empty{padding:22px;text-align:center;font-size:.82rem;color:var(--n-muted);border:1px dashed var(--n-border);border-radius:12px}.tjp__loading{display:flex;align-items:center;justify-content:center;gap:9px;padding:40px;color:var(--n-muted);font-size:.85rem}.tjp__error{display:flex;align-items:flex-start;gap:8px;padding:11px 14px;border-radius:11px;font-size:.8rem;background:rgba(239,68,68,.1);color:#dc2626;border:1px solid rgba(239,68,68,.25)}.dark .tjp__count{border-radius:6px!important}.dark .tjp__btn--head{background:rgba(48,131,255,.22)!important;border-color:rgba(59,130,246,.35)!important}.dark .tjp__btn--head,.dark .tjp__btn--head svg{color:#ffffff!important}.dark .tjp__status{border-radius:6px!important}.dark .tjp__jenis--pbm{color:#38bdf8!important}.dark .tjp__jenis--piket{color:#fbbf24!important}.dark .tjp__status--wait{background:rgba(217,119,6,.25)!important;color:#ffffff!important;border:1px solid rgba(245,158,11,.5)!important}.dark .tjp__status--ok{background:#1a73e8!important;color:#ffffff!important;border:1px solid #60a5fa!important;box-shadow:0 0 10px rgba(26,115,232,.4)!important}.dark .tjp__status--bad{background:rgba(220,38,38,.25)!important;color:#ffffff!important;border:1px solid rgba(239,68,68,.5)!important}.dark .tjp__status--off{background:rgba(255,255,255,.08)!important;color:#ffffff!important;border:1px solid rgba(255,255,255,.2)!important}.dark .tjp__btn--bad,.dark .tjp__error{color:#f87171}@media (max-width:640px){.tjp__section{padding:14px;border-radius:14px}.tjp__topBar{padding:12px 14px}.tjp__newBtn{width:100%;justify-content:center}.tjp__slots{flex-direction:column}.tjp__swapIcon{transform:rotate(90deg)}.tjp__actions{width:100%}.tjp__btn{flex:1;justify-content:center}}.tj__overlay{position:fixed;inset:0;z-index:9999;background:rgba(15,23,42,.55);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px}.tj__modal{background:var(--n-card);color:var(--n-ink);border:1px solid var(--n-border);border-radius:18px;width:min(940px,100%);max-height:90vh;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.28);overflow:hidden}.tj__header{justify-content:space-between;gap:16px;padding:16px 24px;border-bottom:1px solid var(--n-border)}.tj__header,.tj__title{display:flex;align-items:center}.tj__title{margin:0;font-size:.98rem;font-weight:700;color:var(--n-ink);gap:8px}.tj__subtitle{display:none}.tj__close{border:none;background:#f1f5f9;color:#64748b;width:32px;height:32px;border-radius:50%;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-left:auto;transition:all .15s ease}.tj__close:hover{background:#e2e8f0;color:#0f172a}.dark .tj__close{background:rgba(255,255,255,.08);color:#94a3b8}.dark .tj__close:hover{background:rgba(255,255,255,.16);color:#ffffff}.tj__body{padding:18px 24px;overflow-y:auto}.tj__jenisBar{display:flex;gap:6px;padding:5px;margin-bottom:14px;background:var(--n-soft);border:1px solid var(--n-border);border-radius:12px}.tj__jenisBtn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:9px 14px;border:none;border-radius:9px;cursor:pointer;background:transparent;color:var(--n-muted);font-size:.82rem;font-weight:700;transition:background .15s,color .15s}.tj__jenisBtn:hover{color:var(--n-ink)}.tj__jenisBtn.is-active{background:#3083FF!important;color:#fff!important}.tj__hintBox{display:flex;align-items:flex-start;gap:8px;margin-bottom:14px;padding:10px 13px;border-radius:10px;font-size:.77rem;line-height:1.5;background:rgba(245,158,11,.1);color:#b45309;border:1px solid rgba(245,158,11,.25)}.dark .tj__hintBox{color:#fbbf24}.tj__cols{display:grid;grid-template-columns:1fr 1fr;gap:18px}.tj__col{min-width:0;display:flex;flex-direction:column;gap:10px}.tj__colHead{gap:10px}.tj__colHead,.tj__step{display:flex;align-items:center}.tj__step{width:24px;height:24px;border-radius:50%;flex-shrink:0;background:#3083FF!important;color:#fff!important;justify-content:center;font-size:.75rem;font-weight:800}.tj__colTitle{font-size:.9rem;font-weight:700}.tj__colHint{font-size:.72rem;color:var(--n-muted);line-height:1.4}.tj__search,.tj__select{width:100%;padding:9px 12px;border-radius:10px;border:1px solid var(--n-border);background:var(--n-surface);color:var(--n-ink);font-size:.83rem}.tj__search:focus,.tj__select:focus{outline:none;border-color:var(--n-primary)}.tj__slotList{max-height:300px;overflow-y:auto;border:1px solid var(--n-border);border-radius:12px;padding:8px;background:var(--n-surface)}.tj__slotDay+.tj__slotDay{margin-top:10px}.tj__slotDayName{font-size:.7rem;font-weight:700;text-transform:none;letter-spacing:.02em;color:var(--n-muted);padding:4px 4px 6px}.tj__slot{width:100%;display:flex;align-items:center;gap:10px;padding:8px;margin-bottom:5px;cursor:pointer;text-align:left;border:1px solid var(--n-border);border-radius:10px;background:var(--n-card);color:var(--n-ink);transition:border-color .15s,background .15s}.tj__slot.is-selected,.tj__slot:hover{border-color:#3083FF!important}.tj__slot.is-selected{background:rgba(48,131,255,.08)!important}.tj__slotJam{flex-shrink:0;width:28px;height:28px;padding:0;border-radius:6px!important;color:#fff!important;font-size:.78rem;font-weight:800;display:inline-flex;align-items:center;justify-content:center;line-height:1}.tj__slot--b .tj__slotJam,.tj__slotJam{background:#3083FF!important}.tj__slot--b.is-selected{background:rgba(48,131,255,.08)!important}.tj__slot--b.is-selected,.tj__slot--b:hover{border-color:#3083FF!important}.tj__slotBody{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.tj__slotKelas{font-size:.82rem;font-weight:700;line-height:1.35}.tj__slotMapel{font-size:.74rem}.tj__slotMapel,.tj__slotWaktu{color:var(--n-muted);line-height:1.35}.tj__slotWaktu{font-size:.68rem;opacity:.85}.tj__slotCheck{font-size:.95rem;flex-shrink:0}.tj__slot--b .tj__slotCheck,.tj__slotCheck{color:#3083FF!important}.tj__loading,.tj__slotEmpty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:28px 12px;color:var(--n-muted);font-size:.8rem;border:1px dashed var(--n-border);border-radius:12px;text-align:center}.tj__slotEmpty i{font-size:1.6rem;opacity:.35}.tj__loading{flex-direction:row}.tj__preview{margin-top:16px;padding:14px 16px;border:1px solid var(--n-border);border-radius:12px;background:var(--n-soft)}.tj__previewTitle{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:800;color:var(--n-ink);margin-bottom:10px}.tj__previewIconWrap{width:26px;height:26px;border-radius:50%;background:rgba(48,131,255,.12);color:#3083FF;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.dark .tj__previewIconWrap{background:rgba(48,131,255,.22);color:#60a5fa}.tj__previewRows{display:flex;flex-direction:column;gap:6px}.tj__previewRow{display:flex;align-items:center;gap:8px;font-size:.8rem;flex-wrap:wrap}.tj__pvName{font-weight:700;min-width:120px}.tj__pvArrow,.tj__pvSlot{color:var(--n-muted)}.tj__pvSlot{font-weight:600}.tj__previewNote{margin:10px 0 0;font-size:.72rem;color:var(--n-muted);font-style:italic;line-height:1.5}.tj__label{display:block;margin:16px 0 6px;font-size:.88rem;font-weight:700;color:var(--n-ink)}.tj__textarea{width:100%;padding:10px 12px;border-radius:10px;resize:vertical;border:1px solid var(--n-border);background:var(--n-surface);color:var(--n-ink);font-size:.86rem;font-family:inherit}.tj__textarea:focus{outline:none;border-color:var(--n-primary)}.tj__error{display:flex;align-items:flex-start;gap:8px;margin-top:14px;padding:10px 12px;border-radius:10px;font-size:.8rem;line-height:1.5;background:rgba(239,68,68,.1);color:#dc2626;border:1px solid rgba(239,68,68,.25)}.dark .tj__error{color:#f87171}.tj__footer{display:flex;justify-content:flex-end;gap:10px;padding:14px 24px;border-top:1px solid var(--n-border);background:var(--n-elevated)}.tj__btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:10px;border:1px solid transparent;font-size:.83rem;font-weight:700;cursor:pointer}.tj__btn:disabled{opacity:.55;cursor:not-allowed}.tj__btn--ghost{background:transparent;border-color:var(--n-border);color:var(--n-muted)}.tj__btn--ghost:hover:not(:disabled){background:var(--n-soft);color:var(--n-ink)}.tj__btn--primary{background:#3083FF!important;color:#fff!important}.tj__btn--primary:hover:not(:disabled){filter:brightness(1.07)}@media (max-width:760px){.tj__overlay{padding:0!important;align-items:flex-end!important;justify-content:center!important;background:rgba(17,46,89,.55)!important;-webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important;animation:bnavFadeIn .2s ease-out!important}.tj__modal{width:100%!important;max-width:100%!important;max-height:calc(100vh - 20px)!important;max-height:calc(100dvh - 20px)!important;height:auto!important;border-radius:24px 24px 0 0!important;border:none!important;border-top:1.5px solid #e1e2e9!important;box-shadow:0 -12px 36px rgba(17,46,89,.2)!important;animation:bnavSlideUp .28s cubic-bezier(.16,1,.3,1)!important;padding-bottom:calc(14px + env(safe-area-inset-bottom, 0px))!important}.tj__modal:before{content:"";display:block;width:36px;height:4px;border-radius:999px;background:#112E59!important;margin:10px auto 2px;flex-shrink:0}.dark .tj__modal{background:#000000!important;border-top:1.5px solid rgba(59,130,246,.45)!important;box-shadow:0 -16px 48px rgba(0,0,0,.95),0 0 25px rgba(26,115,232,.15)!important}.dark .tj__modal:before{background:#334155!important}.tj__header{padding:14px 16px!important}.tj__body{padding:16px 12px!important}.tj__cols{grid-template-columns:1fr}.tj__slotList{max-height:240px}.tj__pvName{min-width:auto}.tjp__section{padding:12px 14px;border-radius:14px}.tjp__sectionHead{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;flex-wrap:nowrap!important;padding-bottom:10px;margin-bottom:12px}.tjp__sectionHead h3{font-size:.82rem!important;white-space:nowrap!important;gap:5px!important;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis}.tjp__sectionHead h3 svg{width:15px!important;height:15px!important;flex-shrink:0}.tjp__sectionHead-right{gap:5px!important;flex-shrink:0}.tjp__btn--head{padding:4px 8px!important;font-size:.72rem!important;border-radius:7px!important;white-space:nowrap!important;flex-shrink:0}.tjp__btn--head svg{width:13px!important;height:13px!important}.tjp__count{padding:1.5px 7px!important;font-size:.65rem!important;flex-shrink:0}}.dark .tjp__section,.dark .tjp__topBar{background:#000000!important;border:1.5px solid rgba(59,130,246,.4)!important;box-shadow:0 16px 48px rgba(0,0,0,.95),0 0 25px rgba(26,115,232,.15)!important}.dark .tjp__intro{color:#94a3b8!important}.dark .tjp__sectionHead{border-bottom-color:rgba(59,130,246,.25)!important}.dark .tjp__sectionHead h3{background:linear-gradient(90deg,#1d6bf3,#3b82f6 30%,#60a5fa 70%,#93c5fd)!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important}.dark .tjp__sectionHead h3 i{color:#60a5fa!important}.dark .tjp__card{background:#000000!important;border:1.5px solid rgba(59,130,246,.35)!important;box-shadow:0 4px 16px rgba(0,0,0,.6)!important}.dark .tjp__pair,.dark .tjp__slotBox{color:#cbd5e1!important}.dark .tjp__slotBox{background:rgba(3,7,18,.7)!important;border-color:rgba(59,130,246,.3)!important}.dark .tjp__slotOwner{color:#93c5fd!important}.dark .tjp__newBtn{background:#1a73e8!important;border:1px solid #3b82f6!important;box-shadow:0 0 12px rgba(26,115,232,.4)!important}.dark .tj__modal{background:#000000!important;border:2px solid #1a73e8!important;box-shadow:0 24px 64px rgba(0,0,0,.98),0 0 35px rgba(26,115,232,.3)!important}.dark .tj__header{background:#000000!important;border-bottom:1px solid rgba(59,130,246,.3)!important}.dark .tj__header h2{background:linear-gradient(90deg,#1d6bf3,#3b82f6 30%,#60a5fa 70%,#93c5fd)!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important}.dark .tj__header p{color:#94a3b8!important}.dark .tj__footer{background:#000000!important;border-top:1px solid rgba(59,130,246,.3)!important}.dark .tj__colTitle,.dark .tj__slot{color:#cbd5e1!important}.dark .tj__slot{background:rgba(3,7,18,.7)!important;border-color:rgba(59,130,246,.3)!important}.dark .tj__slot:hover{border-color:#1a73e8!important;box-shadow:0 0 12px rgba(26,115,232,.3)!important}.dark .tj__slot.is-selected{background:rgba(37,99,235,.18)!important;border-color:#1a73e8!important}.dark .tj__title{background:linear-gradient(90deg,#1d6bf3,#3b82f6 30%,#60a5fa 70%,#93c5fd)!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;display:inline-flex!important;align-items:center!important;gap:8px!important}.dark .tj__title i{color:#60a5fa!important;-webkit-text-fill-color:#60a5fa!important}.dark .tjp__note{background:#000000!important;border:1.5px solid rgba(59,130,246,.45)!important;box-shadow:0 2px 8px rgba(0,0,0,.6)!important;color:#cbd5e1!important}.dark .tjp__note b{color:#93c5fd!important}.dark .tj__preview{background:rgba(3,7,18,.7)!important;border-color:rgba(59,130,246,.3)!important}.dark .tj__previewTitle{color:#cbd5e1!important}.dark .tj__previewNote{color:#94a3b8!important}.dark .tj__textarea{background:#000000!important;border-color:rgba(59,130,246,.4)!important;color:#cbd5e1!important}.react-select__container,.react-select__control,.react-select__input,.react-select__input-container,.react-select__menu,.react-select__option,.react-select__placeholder,.react-select__single-value{font-family:Poppins,sans-serif!important}.react-select__input input,.react-select__input-container{color:var(--n-ink,#0f172a)!important}.react-select__input input{opacity:1!important;font-family:Poppins,sans-serif!important}.dark .react-select__input input,.dark .react-select__input-container{color:#f8fafc!important}