/* Google-inspired application palette; formal diagram colours remain document-specific. */
:root{--accent:#1a73e8;--border:#dadce0;--muted:#5f6368;--ink:#202124;color:#202124;background:#f8fafd;font-family:Arial,"Segoe UI",sans-serif}
button{border-radius:20px;color:#3c4043}
button:hover{background:#f1f6fe}
button.primary{background:#1a73e8;border-color:#1a73e8;color:white;box-shadow:0 1px 2px #174ea626}
button.primary:hover{background:#1765cc;box-shadow:0 2px 5px #174ea633}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:#a8c7fa}
input,textarea,select{border-color:#dadce0;color:#202124}
input:focus,textarea:focus{border-color:#1a73e8}
.sidebar{background:#f0f4f9;border-right:0;padding:27px 16px;width:230px}
.brand{font-weight:500;font-size:24px;letter-spacing:-1px;color:#3c4043;gap:9px}
.brand-mark{position:relative;background:white;border-radius:50%;width:35px;height:35px;border:3px solid #4285f4;border-right-color:#34a853;border-bottom-color:#fbbc04;border-left-color:#ea4335}
.brand-mark .ph-icon{filter:none;opacity:.8;width:21px;height:21px}
.brand-subtitle{font-size:9px;color:#80868b;letter-spacing:.08em;margin:12px 8px 37px}
.version{background:#e3eaf4;color:#5f6368;font-size:9px;letter-spacing:0}
.nav-item{border-radius:0 24px 24px 0;font-size:13px;padding:14px 16px;margin-bottom:5px}
.nav-item.active{background:#d3e3fd;color:#174ea6;font-weight:600}
.nav-item:hover{background:#e3eaf4}
.nav-item.active .ph-icon{filter:invert(33%) sepia(86%) saturate(1669%) hue-rotate(198deg) brightness(87%);opacity:1}
.nav-caption{color:#80868b;font-size:10px;margin:30px 16px 12px}
.sidebar-bottom{border-top:1px solid #dce3ed;padding:20px 10px 0;color:#5f6368}
.sidebar-bottom strong{color:#3c4043;font-weight:500}
.home-main{margin-left:230px;width:calc(100% - 230px);background:#fff}
.home-top{background:#fff;border-bottom:1px solid #edf0f3;height:76px;color:#5f6368}
.home-content{padding-top:43px}
.hero-row{margin-bottom:38px}
.hero-row h1{font-size:34px;font-weight:400;letter-spacing:-1.15px;color:#202124}
.eyebrow{color:#1a73e8;letter-spacing:.12em;font-weight:600}
.hero-row p{color:#5f6368}
.hero-row .primary{padding:14px 23px;font-weight:600}
.section-heading h2{color:#3c4043;font-weight:500;font-size:18px}
.section-heading small{color:#80868b}
.template-grid{gap:18px}
.template-card{border:1px solid #e3e7ec;border-radius:16px;box-shadow:none;position:relative}
.template-card::before{content:"";position:absolute;left:18px;top:16px;width:8px;height:8px;background:#4285f4;border-radius:50%;z-index:1}
.template-card:nth-child(2)::before{background:#ea4335}
.template-card:nth-child(3)::before{background:#fbbc04}
.template-card:nth-child(4)::before{background:#34a853}
.template-card:hover{background:#fff;border-color:#c3d6f5;box-shadow:0 3px 10px #3c404318;transform:translateY(-2px)}
.template-preview{height:142px;background:#e8f0fe;background-image:none}
.template-card:nth-child(2) .template-preview{background:#fce8e6}
.template-card:nth-child(3) .template-preview{background:#fef7e0}
.template-card:nth-child(4) .template-preview{background:#e6f4ea}
.template-info{padding:20px 17px}
.template-info strong{font-weight:500;font-size:14px;color:#202124}
.template-info small{font-size:11px;color:#5f6368}
.search{border:0;border-radius:24px;background:#f0f4f9;padding:12px 18px;width:260px}
.project-list{border-color:#e3e7ec;border-radius:16px;box-shadow:none}
.list-header{background:#f8fafd;color:#80868b}
.project-row{border-color:#edf0f3}
.project-title{color:#3c4043;font-weight:500;border-radius:0}
.project-ref{color:#80868b}
.status-pill{background:#fef7e0;color:#8a5700}
.status-pill.final{background:#e6f4ea;color:#137333}
.empty-state{padding:38px 20px}
.empty-icon{background:#e8f0fe;border-radius:50%;width:52px;height:52px;color:#1a73e8}
.empty-state h3{font-weight:500;color:#3c4043}
.empty-state button{color:#1a73e8;font-weight:500;border-color:#dadce0}
.home-foot{color:#80868b}
.home-note{background:#f8fafd;border:1px solid #e3e7ec;border-left:4px solid #4285f4;color:#5f6368;border-radius:4px 14px 14px 4px}
.home-note strong{color:#174ea6;font-weight:500}
.language-mini{border-radius:18px;background:#fff;color:#3c4043}
.workspace-header{background:white;border-color:#e3e7ec}
.workspace-heading input{color:#202124;font-weight:500}
.save-line{color:#80868b}
.workspace-tabs{border-color:#e3e7ec;background:#fff}
.workspace-tabs .tab{border-radius:20px;color:#5f6368}
.workspace-tabs .tab.active{background:#e8f0fe;color:#1967d2}
.notice-strip{background:#f8fafd;color:#5f6368;border-bottom:1px solid #edf0f3}
.workspace-body{background:#f0f4f9}
.process-editor{border-color:#e3e7ec;border-radius:0;color:#3c4043;font-family:inherit}
.editor-viewport{background-color:#f0f4f9;background-image:radial-gradient(#d4dce9 .7px,transparent .7px)}
.process-editor button,.process-editor select{border-color:#dadce0;border-radius:18px;color:#3c4043}
.process-editor button:hover,.process-editor select:hover{background:#e8f0fe;border-color:#aecbfa}
.process-editor button:focus-visible,.process-editor select:focus-visible,.process-editor input:focus-visible,.process-editor textarea:focus-visible{outline-color:#a8c7fa}
.diagram-node:focus-visible>rect:first-child,.diagram-node:focus-visible>ellipse:first-child,.diagram-node:focus-visible>polygon:first-child,.editor-page [data-lane-id]:focus-visible rect{stroke:#1a73e8}
.document-workspace{background:#f0f4f9;color:#202124}
.doc-buttons button{border-radius:20px;border-color:#dadce0;color:#3c4043}
.doc-buttons button:first-child{background:#1a73e8;border-color:#1a73e8;color:white}
.doc-field:focus{outline-color:#a8c7fa}
.doc-field{border-color:#dadce0;background:#f8fafd}
.procedure-table th{background:#f1f3f4}
.procedure-table th,.procedure-table td{border-color:#dadce0}
.doc-empty>span{color:#aecbfa}
.doc-notice{background:#fef7e0;border-color:#f9e6a8;color:#8a5700}
.dialog-head h2{font-weight:400;color:#202124}
dialog{border-radius:24px;color:#202124;border-color:#e3e7ec}
dialog::backdrop{background:#20212455;backdrop-filter:blur(2px)}
.callout{background:#e8f0fe;color:#3c4043}
.choice:hover{background:#e8f0fe}
button.danger{color:#c5221f}
#toast{background:#303134;border-radius:8px}
@media(max-width:1000px){.sidebar{width:180px}.home-main{margin-left:180px;width:calc(100% - 180px)}}
@media(max-width:650px){.home-main{margin-left:0;width:100%}.hero-row h1{font-size:28px}.template-preview{height:110px}.search{width:160px}.template-info{padding:14px}}
.nav-item:not(.active){background:transparent}.nav-item:not(.active):hover{background:#e3eaf4}
/* User-supplied ProcessFlowKu logo, preserved at its original aspect ratio. */
.brand-image{display:block;margin:-8px -4px 27px;line-height:0}
.product-logo{display:block;width:100%;height:auto;object-fit:contain;mix-blend-mode:multiply}
#back-home{display:flex;align-items:center;gap:3px;padding:0 4px;color:#5f6368}
#back-home>span{font-size:24px}
.workspace-logo{display:block;width:170px;height:auto;object-fit:contain;mix-blend-mode:multiply}
@media(max-width:1000px){.brand-image{margin-bottom:30px}.workspace-logo{width:115px}}
@media(max-width:650px){.workspace-logo{width:105px}#back-home{padding:0}}
[hidden]{display:none!important}
.account-controls{display:flex;align-items:center;gap:12px}.google-signin{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:white;border:1px solid #dadce0;color:#3c4043;border-radius:20px;padding:9px 15px;font-weight:500}.google-g{font-family:Arial,sans-serif;font-weight:bold;font-size:18px;color:#4285f4}.account-button{max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workspace-actions .google-signin{white-space:nowrap}#login-error{color:#c5221f;font-size:12px}
