@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";:root{font-family:DM Sans,system-ui,sans-serif;color:#173244;background:#f4f7fa;font-synthesis:none;--page: #f4f7fa;--ink: #173244;--muted: #7b8998;--line: #e6ecf1;--card: #fff;--green-dark: #098d80;--green: #12b8a4;--green-soft: #e5f5f0;--navy: #122c3b;--navy-2: #204c58;--red: #d64545;--red-soft: #fdecec;--amber: #b7791f;--amber-soft: #fdf3e1;--blue: #2f6fb3;--blue-soft: #e8f1fb;--violet: #7364cb;--violet-soft: #efedfb;--shadow: 0 10px 40px #1732440a;--radius: 20px}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 90% 0%,#e7f4f4 0,transparent 35%),var(--page)}button,input,select,textarea{font:inherit;color:inherit}button{cursor:pointer;border:0;background:none;-webkit-tap-highlight-color:transparent}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[contenteditable]:focus-visible{outline:3px solid #35bba7;outline-offset:2px}h1,h2,h3{font-family:Manrope,system-ui,sans-serif;margin-top:0}svg{flex-shrink:0;vertical-align:middle}.muted{color:var(--muted)}.small{font-size:12px}.eyebrow{display:block;color:#82939f;font-size:10px;font-weight:700;letter-spacing:.16em;margin-bottom:8px}.spinner{width:34px;height:34px;border-radius:50%;border:3px solid #d7e6e6;border-top-color:var(--green-dark);animation:spin .8s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.splash{min-height:100vh;display:grid;place-items:center;align-content:center;gap:24px}.splash img{width:160px;mix-blend-mode:multiply}.primary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:14px;background:linear-gradient(115deg,var(--navy),var(--navy-2));color:#fff;font-weight:600;box-shadow:0 10px 22px #122c3b20}.ghost-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 16px;border-radius:13px;background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:600}.icon-button{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#fff;border:1px solid var(--line);color:var(--ink)}.link-button{color:var(--green-dark);font-weight:600;padding:4px 6px}.notice{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:14px;font-size:14px;margin:0 0 14px;line-height:1.5}.notice.info{background:var(--blue-soft);color:#1f4f80}.notice.error{background:var(--red-soft);color:#9b2c2c}.notice.success{background:var(--green-soft);color:#0d6b60}.notice.warn{background:var(--amber-soft);color:#7a5212}.notice.floating{position:fixed;z-index:50;left:50%;transform:translate(-50%);bottom:22px;width:min(560px,calc(100% - 28px));box-shadow:0 16px 40px #17324422}.login-page{min-height:100vh;display:grid;place-items:center;padding:24px 16px;background:radial-gradient(ellipse at 10% 0%,#dff1ee 0,transparent 40%),radial-gradient(ellipse at 100% 100%,#e3ecf5 0,transparent 40%),var(--page)}.login-card{width:min(430px,100%);background:#ffffffd9;border:1px solid #fff;border-radius:28px;padding:32px 28px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.login-logo{width:150px;height:60px;object-fit:contain;object-position:left;mix-blend-mode:multiply;margin-bottom:18px}.login-card h1{font-weight:400;color:#6c7d89;font-size:30px;letter-spacing:-.04em;margin-bottom:6px}.login-card h1 strong{color:var(--ink);font-weight:700}.form-stack{display:grid;gap:14px;margin-top:18px}.form-stack label,.field{display:grid;gap:6px;font-size:13px;font-weight:600;color:#4c5f6d}.form-stack input,.field input,.filter-panel input,.filter-panel select,.template-select,.viewer-toolbar select{width:100%;min-height:46px;padding:0 14px;border-radius:13px;border:1px solid var(--line);background:#fff;font-weight:500}.password-field{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:13px;background:#fff;padding-right:6px}.password-field input{border:0!important}.captcha{display:grid;gap:10px;padding:14px;border-radius:16px;background:#f4f8fa}.captcha-row{display:flex;gap:10px;align-items:center}.captcha-image{flex:1;min-height:60px;display:grid;place-items:center;border-radius:12px;background:#fff;overflow:hidden;color:var(--muted);font-size:13px}.check{display:flex!important;align-items:center;gap:8px;font-weight:500!important;font-size:13px}.fine-print{color:var(--muted);font-size:12px;line-height:1.5;margin:12px 0 0}.app-shell{min-height:100vh}.topbar{max-width:1100px;margin:0 auto;min-height:74px;display:flex;align-items:center;justify-content:space-between;padding:8px 20px}.workspace-logo{width:130px;height:50px;object-fit:contain;object-position:left center;mix-blend-mode:multiply}.topbar-actions{display:flex;gap:10px;align-items:center}.user-chip{display:inline-flex;align-items:center;gap:6px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:8px 12px;border-radius:99px;background:#dceeea;color:#25615c;font-size:13px;font-weight:600}.main-content{max-width:1100px;margin:0 auto;padding:8px 20px 80px}.greeting{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}.greeting h1{font-weight:400;color:#6c7d89;font-size:clamp(22px,4vw,32px);line-height:1.3;letter-spacing:-.04em;margin:0}.greeting h1 strong{color:var(--ink);font-weight:700}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin-bottom:18px}.summary-card{display:grid;gap:6px;text-align:left;padding:14px 16px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.summary-card span{font-size:12px;color:var(--muted);font-weight:600;display:inline-flex;gap:4px;align-items:center}.summary-card b{font:700 24px Manrope,sans-serif}.summary-card.active{background:linear-gradient(115deg,var(--navy),var(--navy-2));color:#fff;border-color:transparent}.summary-card.active span{color:#afc3cd}.summary-card.cito{border-color:#f3c3c3}.summary-card.cito b{color:var(--red)}.summary-card.cito.active{background:var(--red)}.summary-card.cito.active b{color:#fff}.toolbar{display:flex;gap:10px;margin-bottom:10px}.search{flex:1;display:flex;align-items:center;gap:8px;padding:0 14px;min-height:46px;border-radius:14px;background:#fff;border:1px solid var(--line);color:var(--muted)}.search input{flex:1;border:0;outline:0;min-height:42px;background:transparent;color:var(--ink)}.filter-panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;align-items:end;padding:16px;border-radius:18px;background:#fff;border:1px solid var(--line);margin-bottom:10px}.filter-panel label{display:grid;gap:6px;font-size:12px;font-weight:600;color:#4c5f6d}.list-meta{color:var(--muted);font-size:12px;margin:6px 2px 10px}.work-list{display:grid;gap:10px}.work-item{display:flex;justify-content:space-between;gap:14px;width:100%;text-align:left;padding:16px 18px;border-radius:18px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);transition:transform .12s ease,box-shadow .12s ease}.work-item:hover{transform:translateY(-1px);box-shadow:0 14px 34px #17324412}.work-item.is-cito{border-left:5px solid var(--red)}.wi-main{display:grid;gap:5px;min-width:0}.wi-title{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px}.wi-patient{font-weight:600;font-size:14px}.wi-patient span{color:var(--muted);font-weight:500}.wi-meta{color:var(--muted);font-size:12px}.wi-side{display:grid;gap:6px;justify-items:end;align-content:start;flex-shrink:0}.badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:99px;font-size:11px;font-weight:700;white-space:nowrap}.badge.cito{background:var(--red);color:#fff}.st-belum{background:var(--amber-soft);color:var(--amber)}.st-draft{background:var(--blue-soft);color:var(--blue)}.st-final{background:var(--green-soft);color:var(--green-dark)}.st-addendum{background:var(--violet-soft);color:var(--violet)}.badge.img{background:#eaf4f2;color:#25615c}.badge.noimg{background:#f0f2f5;color:var(--muted)}.empty{display:grid;place-items:center;gap:8px;padding:48px 16px;color:var(--muted);background:#fff;border-radius:18px;border:1px dashed var(--line)}.detail-shell{min-height:100vh;display:flex;flex-direction:column}.detail-header{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 16px;background:#ffffffe6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}.dh-main{min-width:0;flex:1}.dh-title{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:16px}.dh-sub{color:var(--muted);font-size:12px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dirty-dot{font-size:11px;font-weight:700;color:var(--amber);background:var(--amber-soft);padding:4px 10px;border-radius:99px}.pane-tabs{display:none;gap:6px;padding:8px 12px;background:#e9eef3}.pane-tabs button{flex:1;min-height:40px;border-radius:11px;color:#8592a0;font-size:13px;font-weight:600}.pane-tabs button.active{color:var(--ink);background:#fff;box-shadow:0 3px 10px #17324408}.detail-grid{flex:1;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(360px,1fr);grid-template-areas:"gambar bacaan" "gambar riwayat";grid-template-rows:auto 1fr;gap:14px;padding:14px}.pane-gambar{grid-area:gambar}.pane-bacaan{grid-area:bacaan}.pane-riwayat{grid-area:riwayat}.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);margin-bottom:14px}.card h2{font-size:17px;margin-bottom:0}.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}.template-select{width:auto;min-height:38px;max-width:100%}.info-card dl{display:grid;gap:10px;margin:0}.info-card dt{font-size:11px;color:var(--muted);font-weight:700;letter-spacing:.04em;text-transform:uppercase}.info-card dd{margin:2px 0 0;font-size:14px}.other-exams{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px;font-size:12px;color:var(--muted)}.chip{padding:6px 10px;border-radius:99px;background:#f0f4f6;font-size:12px;font-weight:600}.chip em{font-style:normal;color:var(--muted);margin-left:4px}.field{margin-bottom:12px}.editor{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}.editor-toolbar{display:flex;flex-wrap:wrap;gap:4px;padding:6px;background:#f6f9fb;border-bottom:1px solid var(--line)}.editor-toolbar button{min-width:36px;height:34px;padding:0 10px;border-radius:9px;font-size:13px}.editor-toolbar button:hover{background:#e7eef2}.editor-body{min-height:240px;max-height:55vh;overflow:auto;padding:14px 16px;line-height:1.6;font-size:15px;outline:none}.editor-body:empty:before{content:attr(data-placeholder);color:#a5b1bb}.editor-body p{margin:0 0 8px}.editor.disabled{opacity:.7}.actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:14px}.report-view{line-height:1.6;font-size:15px;padding:14px 16px;border-radius:14px;background:#f8fafb;border:1px solid var(--line);max-height:50vh;overflow:auto}.report-view p{margin:0 0 8px}.sub-head{font-size:14px;margin:18px 0 8px}.history{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}.history button{width:100%;display:grid;gap:4px;text-align:left;padding:12px 14px;border-radius:14px;background:#f8fafb;border:1px solid var(--line);font-size:13px}.history .badge{justify-self:start}.viewer-card{position:sticky;top:72px;background:#0e1b24;border-radius:var(--radius);padding:10px;box-shadow:var(--shadow)}.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 2px 10px;color:#d6e2e8}.viewer-toolbar select{min-height:40px;background:#1a2c38;color:#e6eef2;border-color:#2a4150}.viewer-caption{font-size:13px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.viewer-buttons{display:flex;gap:6px;flex-shrink:0}.viewer-card .icon-button{background:#1a2c38;border-color:#2a4150;color:#e6eef2}.viewer-stage{position:relative;height:calc(100vh - 170px);min-height:380px;border-radius:14px;overflow:hidden;background:#000;touch-action:none;overscroll-behavior:contain;-webkit-user-select:none;user-select:none}.viewer-stage iframe{width:100%;height:100%;border:0;display:block;touch-action:none}.viewer-stage.is-full,.viewer-stage:fullscreen{position:fixed;inset:0;z-index:100;height:100vh;height:100dvh;border-radius:0}.exit-full{position:absolute;z-index:2;top:10px;right:10px;display:inline-flex;gap:6px;align-items:center;padding:8px 12px;border-radius:10px;background:#000a;color:#fff;font-size:12px;font-weight:600}.viewer-msg{height:100%;display:grid;place-items:center;align-content:center;gap:12px;padding:20px}.viewer-card .fine-print{color:#8aa0ad;margin:8px 4px 2px}.empty-viewer{display:grid;justify-items:center;text-align:center;gap:8px;padding:40px 20px;color:var(--muted)}.empty-viewer h2{color:var(--ink)}.dialog-backdrop{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:16px;background:#0e1b2466}.dialog{width:min(440px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:22px;padding:22px;box-shadow:0 30px 60px #0e1b2440}.dialog.wide{width:min(720px,100%)}.dialog p{line-height:1.55}@media(max-width:900px){.pane-tabs{display:flex;position:sticky;top:61px;z-index:19}.detail-grid{display:block;padding:12px}.pane{display:none}.pane.show{display:block}.viewer-card{position:static;padding:8px}.viewer-stage{height:calc(100vh - 230px);height:calc(100dvh - 230px);min-height:300px}}@media(max-width:560px){.topbar{padding:8px 14px}.main-content{padding:4px 14px 60px}.user-chip{max-width:140px}.work-item{flex-direction:column}.wi-side{display:flex;justify-items:start}.greeting .ghost-button{padding:0 12px}.login-card{padding:26px 20px}.actions>*{flex:1}}.mode-banner{position:sticky;top:0;z-index:70;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;justify-content:center;padding:7px 14px;background:repeating-linear-gradient(135deg,#f59e0b,#f59e0b 14px,#f7b733 14px 28px);color:#3b2500;font-size:13px;text-align:center;box-shadow:0 2px 8px #0002}.mode-banner b{letter-spacing:.08em;background:#3b2500;color:#ffd27a;padding:2px 8px;border-radius:6px}
