:root { --ink:#162333; --muted:#667282; --line:#dfe6eb; --paper:#fff; --wash:#f3f7f8; --mint:#d9f6e7; --green:#087a56; --orange:#ffb765; --navy:#102538; --shadow:0 20px 45px rgba(16,37,56,.08); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:5rem; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Pretendard","Noto Sans KR",Arial,sans-serif; line-height:1.65; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.skip-link { position:absolute; left:1rem; top:-4rem; padding:.7rem 1rem; color:#fff; background:var(--navy); z-index:10; }.skip-link:focus { top:1rem; }
.site-header { height:4.75rem; padding:0 max(1.5rem,calc((100vw - 1440px)/2)); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(255,255,255,.94); backdrop-filter:blur(12px); position:sticky; top:0; z-index:5; }
.brand { display:flex; gap:.65rem; align-items:center; font-size:.92rem; font-weight:700; letter-spacing:-.03em; }.brand b { color:var(--green); letter-spacing:.04em; font-size:.7rem; }.brand-mark { display:grid; place-items:center; width:1.85rem; height:1.85rem; color:white; background:var(--green); border-radius:50% 50% 50% 0; font-family:Georgia,serif; font-size:1.05rem; }
.header-action { font-size:.82rem; font-weight:700; }.header-action span { margin-left:.35rem; color:var(--green); }
.layout { width:min(1440px,100%); margin:auto; display:grid; grid-template-columns:220px minmax(0,1fr); }.section-nav { padding:4.2rem 1.5rem; position:sticky; top:4.75rem; height:calc(100vh - 4.75rem); }.section-nav p { margin:0 0:.8rem; color:#8c98a4; font-size:.72rem; font-weight:800; letter-spacing:.12em; }.section-nav a { display:flex; gap:.55rem; padding:.45rem 0; color:#596777; font-size:.83rem; }.section-nav a:hover { color:var(--green); }.section-nav a span { color:#aeb8c0; font:600 .68rem/1.9 monospace; }
main { border-left:1px solid var(--line); }.section { padding:6.5rem clamp(1.5rem,6vw,7rem); border-bottom:1px solid var(--line); }.hero { min-height:calc(100vh - 4.75rem); display:flex; flex-direction:column; justify-content:center; background:radial-gradient(circle at 88% 8%,#e4fbef 0,transparent 30%),#f7fbf9; }.eyebrow,.section-heading>p { margin:0 0:1rem; color:var(--green); font-size:.72rem; font-weight:800; letter-spacing:.13em; }.hero h1 { margin:0; max-width:850px; font-size:clamp(2.5rem,5vw,5.4rem); line-height:1.15; letter-spacing:-.075em; }.hero h1 em { color:var(--green); font-style:normal; }.hero-copy { max-width:580px; margin:1.7rem 0 2.1rem; color:#516071; font-size:1.05rem; }.hero-actions { display:flex; gap:.6rem; flex-wrap:wrap; }.button { display:inline-flex; align-items:center; gap:.7rem; min-height:3rem; padding:.8rem 1.2rem; font-size:.88rem; font-weight:800; border-radius:3px; }.button.primary { color:#fff; background:var(--green); }.button.primary:hover { background:#056c4b; }.button.text { border:1px solid #b8c5ca; }.hero-note { margin-top:4.25rem; color:#506271; font-size:.86rem; }.hero-note span { margin-right:.35rem; color:var(--green); }
.section-heading { margin-bottom:2.7rem; }.section-heading h2 { margin:0; font-size:clamp(2rem,3vw,3.2rem); line-height:1.2; letter-spacing:-.06em; }.section-heading>span { display:block; margin-top:.8rem; color:var(--muted); }.install-grid,.two-column { display:grid; grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr); gap:1.5rem; align-items:stretch; }.download-card { padding:2rem; border:1px solid #d6e1e5; background:#f6faf9; border-radius:6px; }.status-dot { display:inline-block; padding:.16rem .55rem; color:#796036; background:#fff0ce; border-radius:99px; font-size:.69rem; font-weight:800; }.download-card h3 { margin:1rem 0 .5rem; font-size:1.3rem; letter-spacing:-.04em; }.download-card p { min-height:4.7rem; color:var(--muted); font-size:.87rem; }.download-card button { width:100%; padding:.8rem; color:#8b969d; background:#e9eff1; border:0; border-radius:3px; cursor:not-allowed; font-size:.84rem; font-weight:800; }.download-card small { display:block; margin-top:.85rem; color:#8a969d; font-size:.72rem; }.install-steps { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }.install-steps li { display:flex; gap:1rem; padding:1.1rem 0; border-bottom:1px solid var(--line); }.install-steps b { display:grid; place-items:center; flex:0 0 1.75rem; height:1.75rem; color:var(--green); background:var(--mint); border-radius:50%; font-size:.78rem; }.install-steps strong,.install-steps span { display:block; }.install-steps strong { font-size:.95rem; }.install-steps span { margin-top:.15rem; color:var(--muted); font-size:.82rem; }.inline-tip { margin:2rem 0 0; padding:1rem 1.2rem; background:#f5f7f8; color:#536171; font-size:.85rem; }.inline-tip b { color:var(--ink); }
.soft-section { background:var(--wash); }.large-copy { margin-top:0; font-size:1.2rem; line-height:1.65; letter-spacing:-.03em; }.screen-placeholder { min-height:200px; padding:1.5rem; display:flex; flex-direction:column; justify-content:flex-end; background:linear-gradient(135deg,#c5d7db,#8fa9af); color:#fff; border-radius:4px; position:relative; overflow:hidden; }.screen-placeholder:before { content:""; position:absolute; top:18%; left:15%; width:62%; height:45%; border:1px solid rgba(255,255,255,.65); border-radius:3px; }.screen-placeholder span { color:#e2faee; font:700 .7rem monospace; letter-spacing:.1em; }.screen-placeholder strong { font-size:1.15rem; }.screen-placeholder small { opacity:.75; }.notice { display:flex; gap:.75rem; margin-top:2rem; padding:1rem 1.2rem; border-left:3px solid var(--orange); background:#fffaf2; font-size:.86rem; }.notice span { display:grid; place-items:center; flex:0 0 1.25rem; height:1.25rem; color:#835411; border:1px solid #b87a21; border-radius:50%; font-weight:800; }.notice p { margin:0; }
.workflow-list { display:grid; gap:.8rem; }.workflow-card { display:grid; grid-template-columns:64px minmax(0,1fr) 25px; gap:1rem; align-items:start; padding:1.6rem 1.3rem; border:1px solid var(--line); background:#fff; transition:transform .2s,box-shadow .2s; }.workflow-card:hover { transform:translateY(-2px); box-shadow:var(--shadow); }.step-number { color:var(--green); font:800 1rem/1 monospace; }.capture-label { margin:0 0:.35rem; color:#8895a0; font:700 .67rem/1 monospace; letter-spacing:.08em; }.workflow-body h3 { margin:0; font-size:1.18rem; letter-spacing:-.04em; }.workflow-body>p { margin:.45rem 0; color:var(--muted); font-size:.9rem; }.workflow-body small { color:#745016; font-size:.78rem; }.card-arrow { color:var(--green); font-size:1.25rem; }
.split-section { background:#fbfcfc; }.document-list { margin:0; padding:0; list-style:none; }.document-list li { display:flex; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); }.document-list b { font-size:.92rem; }.document-list span { color:var(--muted); font-size:.8rem; text-align:right; }.dark-section { color:#fff; background:var(--navy); border-color:#314658; }.dark-section .section-heading>p { color:#79d6ab; }.dark-intro { max-width:540px; color:#d7e1e8; font-size:1.05rem; }.flow { display:flex; align-items:stretch; gap:.6rem; margin:3rem 0; }.flow div { flex:1; min-height:120px; padding:1rem; display:flex; flex-direction:column; justify-content:space-between; background:#1a354a; }.flow b { color:#8be0ba; font:700 .75rem monospace; }.flow span { font-size:.85rem; line-height:1.45; }.flow i { align-self:center; font-style:normal; color:#83b7a2; }.inverted { border-left-color:#8be0ba; color:#e8f2f5; background:#173147; }.inverted span { color:#b5ecd1; border-color:#8be0ba; }
.warning-list { border-top:1px solid var(--line); }.warning-list details { border-bottom:1px solid var(--line); }.warning-list summary { display:grid; grid-template-columns:26px 1fr 22px; gap:.75rem; align-items:center; padding:1.1rem .2rem; cursor:pointer; list-style:none; }.warning-list summary::-webkit-details-marker { display:none; }.warning-icon { display:grid; place-items:center; width:1.25rem; height:1.25rem; color:#924211; background:#fff0dd; border-radius:50%; font-size:.78rem; font-weight:800; }.summary-arrow { color:var(--green); font-size:1.25rem; font-weight:300; text-align:right; }.warning-list details[open] .summary-arrow { transform:rotate(45deg); }.warning-list details>div { padding:0 2.75rem 1.25rem; color:var(--muted); font-size:.87rem; }.warning-list details p { margin:.4rem 0; }.warning-list details strong { display:inline-block; width:8rem; color:var(--ink); }.capture-message { margin:1.5rem 0 0; color:#87929a; font-size:.78rem; }
.support-section { background:#edfaf3; }.support-panel { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#bcdcc9; border:1px solid #bcdcc9; }.support-panel>div { padding:2rem; background:#f8fffb; }.support-kicker { color:var(--green); font:800 .7rem monospace; letter-spacing:.08em; }.support-panel h3 { margin:.55rem 0; font-size:1.6rem; letter-spacing:-.05em; }.support-panel p { margin:.35rem 0; color:#536b60; font-size:.88rem; }.pending-detail { background:#e1f5e8 !important; }.pending-detail b { color:#156540; }.pending-detail small { color:#5f796b; font-size:.72rem; }.support-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin:2rem 0; }.support-grid div { padding:1.1rem; border-top:2px solid var(--green); background:rgba(255,255,255,.6); }.support-grid b { color:var(--green); font:800 .75rem monospace; }.support-grid p { margin:.45rem 0 .1rem; font-weight:800; font-size:.92rem; }.support-grid span { color:#647b6e; font-size:.78rem; }.privacy-note { padding:1rem 1.2rem; border:1px solid #a8d2b8; color:#476455; background:#f9fffb; font-size:.83rem; }.practice-section { background:#fffaf2; }.practice-callout { display:flex; gap:.8rem; max-width:600px; margin:1.7rem 0; padding:1.2rem; border-left:3px solid #e88f2b; background:#fff; }.practice-callout span { color:#d87811; }.practice-callout p { margin:0; font-size:.88rem; }.sample-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.2rem; border:1px dashed #d7bc8d; color:#8a6b36; }.sample-row span { font-size:.86rem; font-weight:800; }.sample-row small { font-size:.75rem; text-align:right; }footer { width:min(1220px,100%); margin:auto; padding:1.4rem max(1.5rem,6vw); display:flex; justify-content:space-between; color:#75818e; font-size:.72rem; }footer p { margin:0; }
@media (max-width:900px) { .layout { display:block; }.section-nav { display:none; }main { border-left:0; }.section { padding:4.5rem clamp(1.25rem,6vw,3rem); }.hero { min-height:620px; }.flow { display:grid; grid-template-columns:1fr 18px 1fr; }.flow div { min-height:90px; }.flow i { align-self:center; }.flow i:nth-of-type(2) { transform:rotate(90deg); grid-column:1 / -1; justify-self:center; }.flow div:nth-of-type(3) { grid-column:1; }.flow div:nth-of-type(4) { grid-column:3; } }
@media (max-width:640px) { .site-header { height:4.2rem; }.header-action { font-size:.75rem; }.brand { font-size:.8rem; }.brand-mark { width:1.55rem; height:1.55rem; }.section { padding:3.7rem 1.25rem; }.hero h1 { font-size:2.55rem; }.hero-note { margin-top:3rem; }.install-grid,.two-column,.support-panel { grid-template-columns:1fr; }.section-heading { margin-bottom:2rem; }.workflow-card { grid-template-columns:43px minmax(0,1fr); padding:1.2rem .9rem; }.card-arrow { display:none; }.flow { display:flex; flex-direction:column; }.flow div { min-height:auto; flex-direction:row; align-items:center; }.flow i { align-self:center; transform:rotate(90deg); }.support-grid { grid-template-columns:1fr; gap:.5rem; }.warning-list details>div { padding:0 0 1rem; }.warning-list details strong { display:block; margin-bottom:.2rem; }.sample-row,footer { align-items:flex-start; flex-direction:column; }.sample-row small { text-align:left; } }
@media print { .site-header,.section-nav,.hero-actions,.skip-link { display:none; }.layout { display:block; }.section { padding:2rem; break-inside:avoid; }.hero { min-height:auto; }.dark-section { color:#000; background:#fff; }.flow div { color:#000; background:#fff; border:1px solid #aaa; }.dark-intro { color:#333; } }

.header-actions { display:flex; align-items:center; gap:.65rem; font-size:.82rem; font-weight:700; }.header-actions a:hover { color:var(--green); }.header-actions a span { margin-left:.35rem; color:var(--green); }.menu-divider { color:#c0c8ce; }.is-disabled { color:#9aa5ae; cursor:not-allowed; }.download-button { display:block; width:100%; padding:.8rem; color:#fff; background:var(--green); border:0; border-radius:3px; cursor:pointer; font-family:inherit; font-size:.84rem; font-weight:800; line-height:1.3; text-align:center; }.download-button:hover { background:#056c4b; }.status-dot.ready { color:#146342; background:#d9f6e7; }

/* Administrator screens remain inside the intranet-only application and require Basic authentication. */
.admin-page { background:#f2f6f6; }.admin-main { width:min(1280px,100%); margin:auto; padding:4rem clamp(1.25rem,5vw,4rem) 6rem; }.admin-intro { max-width:760px; margin-bottom:3.5rem; }.admin-intro h1 { margin:.3rem 0 1rem; font-size:clamp(2rem,4vw,3.5rem); letter-spacing:-.06em; }.admin-intro>p:last-child { color:var(--muted); }.admin-section { margin-top:1.75rem; padding:2rem; background:#fff; border:1px solid var(--line); }.admin-title { display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.5rem; }.admin-title p { margin:0 0:.3rem; color:var(--green); font:800 .7rem monospace; letter-spacing:.1em; }.admin-title h2 { margin:0; font-size:1.45rem; letter-spacing:-.05em; }.admin-title>span { color:var(--muted); font-size:.8rem; }.admin-table-wrap { overflow-x:auto; }.admin-table-wrap table { width:100%; border-collapse:collapse; min-width:900px; font-size:.82rem; }.admin-table-wrap th { padding:.7rem; color:#677482; background:#f6f8f8; text-align:left; font-size:.72rem; }.admin-table-wrap td { padding:.85rem .7rem; border-bottom:1px solid var(--line); vertical-align:top; }.admin-table-wrap small,.release-row small { display:block; color:#778491; font-size:.7rem; }.admin-table-wrap a,.release-row a { color:var(--green); font-weight:800; text-decoration:underline; }.status-form { display:grid; grid-template-columns:110px minmax(140px,1fr) 52px; gap:.35rem; }.status-form select,.status-form input,.release-form input { width:100%; padding:.45rem .55rem; border:1px solid #cbd6db; border-radius:2px; font:inherit; }.status-form button { border:0; color:#fff; background:var(--navy); border-radius:2px; font-size:.72rem; font-weight:800; }.empty-state { margin:0; padding:2rem; color:#7f8b95; background:#f7f9f9; text-align:center; }.release-admin-grid { display:grid; grid-template-columns:minmax(260px,.75fr) minmax(0,1.25fr); gap:2rem; }.release-form { padding:1.25rem; background:#eff8f3; }.release-form label { display:block; margin-bottom:1rem; font-size:.82rem; font-weight:800; }.release-form label small { display:block; margin:.1rem 0 .4rem; color:#687a70; font-weight:400; }.release-form .download-button { width:100%; }.release-list { border-top:1px solid var(--line); }.release-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--line); font-size:.85rem; }.release-row span { margin-left:.5rem; padding:.12rem .35rem; color:#13613f; background:#daf5e7; border-radius:99px; font-size:.64rem; font-weight:800; }
.editor-form { display:grid; gap:1rem; max-width:760px; }.editor-form label { display:grid; gap:.35rem; color:var(--navy); font-size:.82rem; font-weight:800; }.editor-form label small { color:var(--muted); font-weight:400; }.editor-form input,.editor-form textarea { width:100%; padding:.65rem .7rem; border:1px solid #cbd6db; border-radius:2px; background:#fff; color:inherit; font:inherit; font-weight:400; resize:vertical; }.editor-form .download-button { justify-self:start; }.release-actions { display:flex; align-items:center; gap:.75rem; }.release-actions form { margin:0; }.release-actions button { border:0; padding:.45rem .6rem; color:#fff; background:var(--navy); border-radius:2px; font:inherit; font-size:.75rem; font-weight:800; cursor:pointer; }.preview-banner { position:sticky; z-index:5; top:0; margin:0; padding:.75rem 1rem; color:#fff; background:#9a5c00; text-align:center; font-size:.85rem; font-weight:700; }.preview-banner a { margin-left:.75rem; color:#fff; text-decoration:underline; }
@media (max-width:760px) { .header-actions { gap:.4rem; font-size:.72rem; }.admin-main { padding-top:2.5rem; }.admin-section { padding:1.1rem; }.release-admin-grid { grid-template-columns:1fr; gap:1rem; }.status-form { grid-template-columns:1fr; } }

/* WEBGATE ERP application theme: derived from the official WEBGATE main and sub blue palette. */
:root { --ink:#073a82; --muted:#5f7597; --line:#c6d8ee; --paper:#fff; --wash:#edf4fd; --mint:#dcedff; --green:#00a5e5; --orange:#ffd84d; --navy:#0052a5; --shadow:0 16px 34px rgba(0,82,165,.12); }
body { background:var(--wash); color:var(--ink); }
.site-header { height:4.45rem; padding:0 clamp(1.25rem,3vw,2.7rem); border:0; border-bottom:3px solid #0064ad; background:#00a3e0; box-shadow:0 3px 12px rgba(0,73,135,.22); }
.brand { gap:.85rem; min-width:0; }.header-menu-icon { display:grid; gap:5px; width:26px; flex:0 0 26px; }.header-menu-icon i { display:block; height:2px; width:22px; background:#e7f7ff; border-radius:2px; }.brand-logo { display:block; width:137px; height:auto; max-height:33px; object-fit:contain; filter:brightness(.38) saturate(1.5) contrast(1.35); }.product-name { padding-left:1rem; border-left:1px solid rgba(230,248,255,.55); color:#fff; font-size:1.05rem; font-weight:800; letter-spacing:-.05em; white-space:nowrap; }.brand b { color:#d9f4ff; font-size:.68rem; letter-spacing:.11em; }.brand-mark { display:none; }
.header-actions { gap:1.25rem; color:#effaff; }.header-actions a { padding:.42rem 0; border-bottom:2px solid transparent; }.header-actions a:hover { color:#fff; border-bottom-color:#e8f8ff; }.header-action { color:#fff; }.header-actions .is-disabled { color:rgba(239,250,255,.72); }.header-actions .menu-divider { color:rgba(236,249,255,.58); }
.layout { width:min(1480px,100%); }.section-nav { background:#f7fbff; }.section-nav p { color:#4a79ad; }.section-nav a { color:#315b8e; }.section-nav a:hover { color:#007fcb; }.section-nav a span { color:#74a5d6; }
main { border-left-color:#c6d8ee; background:#fff; }.section { border-bottom-color:#d1e0f0; }.hero { min-height:calc(100vh - 5.2rem); background:linear-gradient(135deg,#eff7ff 0%,#e8f5ff 55%,#d4efff 100%); position:relative; overflow:hidden; }.hero:after { content:""; position:absolute; right:-10vw; bottom:-19vw; width:48vw; height:48vw; border:46px solid rgba(0,165,229,.15); border-radius:50%; }.hero>* { position:relative; z-index:1; }.eyebrow,.section-heading>p { color:#008ed1; }.hero h1 { color:#004b9b; }.hero h1 em { color:#00a5e5; }.hero-copy { color:#42658d; }.button { border-radius:4px; }.button.primary,.download-button { background:#00a5e5; box-shadow:0 8px 18px rgba(0,165,229,.22); }.button.primary:hover,.download-button:hover { background:#008bcb; }.button.text { color:#0052a5; border-color:#9abfe2; background:#fff; }.hero-note { color:#41678f; }.hero-note span { color:#00a5e5; }
.download-card { border-color:#a8cceb; border-radius:5px; background:#f4faff; box-shadow:0 8px 24px rgba(0,102,180,.06); }.status-dot { color:#8a6200; background:#fff2b7; }.status-dot.ready { color:#00529a; background:#dcefff; }.install-steps { border-top-color:#cbdced; }.install-steps li { border-bottom-color:#d5e3f1; }.install-steps b { color:#fff; background:#00a5e5; }.inline-tip { border-left:4px solid #00a5e5; background:#eef7ff; color:#38618d; }.inline-tip b { color:#0051a9; }
.soft-section { background:#f2f7fd; }.screen-placeholder { background:linear-gradient(135deg,#006bc1,#00a5e5); }.notice { border-left-color:#f2b600; background:#fff9df; }.notice span { color:#9a6800; border-color:#d99a00; }.workflow-card { border-color:#c8dbef; border-radius:5px; }.workflow-card:hover { border-color:#5db9eb; box-shadow:var(--shadow); }.step-number,.card-arrow { color:#0097d9; }.capture-label { color:#5e90c0; }.workflow-body>p { color:#59759a; }.workflow-body small { color:#8a6600; }
.error-log-steps { margin:.7rem 0 0; padding-left:1.2rem; color:#54749a; font-size:.82rem; line-height:1.65; }.error-log-steps b { color:#0051a9; }.error-log-note { display:flex; gap:.85rem; align-items:flex-start; margin-top:1rem; padding:1rem 1.2rem; border-left:4px solid #00a5e5; background:#f8fcff; color:#54749a; font-size:.83rem; }.error-log-note b { flex:0 0 auto; color:#0051a9; }
.workflow-capture { margin:1rem 0 .75rem; overflow:hidden; border:1px solid #bed5ea; border-radius:4px; background:#f6faff; }.workflow-capture img { display:block; width:100%; height:auto; }
.screen-capture { margin:0; overflow:hidden; border:1px solid #a8cceb; border-radius:5px; background:#fff; box-shadow:0 8px 24px rgba(0,102,180,.08); }.screen-capture img { display:block; width:100%; height:auto; }.screen-capture figcaption { display:grid; gap:.2rem; padding:.9rem 1rem 1rem; background:#f5faff; }.screen-capture figcaption span { color:#008fd2; font:800 .7rem monospace; letter-spacing:.08em; }.screen-capture figcaption strong { color:#0051a9; font-size:.95rem; }.screen-capture figcaption small { color:#59759a; font-size:.76rem; }
.split-section { background:#f8fbff; }.dark-section { background:linear-gradient(135deg,#004a98,#0068bd); border-color:#004a98; }.dark-section .section-heading>p,.flow b { color:#8fe0ff; }.flow div { background:#0a5ba7; }.flow i { color:#8fe0ff; }.inverted { border-left-color:#7ad8ff; background:#064d93; }.inverted span { color:#b7edff; border-color:#8fe0ff; }.support-section { background:#edf7ff; }.support-panel { border-color:#a8ceed; background:#a8ceed; }.support-panel>div { background:#f9fcff; }.support-kicker,.support-grid b { color:#008fd2; }.support-panel p,.support-grid span { color:#54749a; }.pending-detail { background:#ddf2ff !important; }.pending-detail b { color:#0057a7; }.pending-detail small { color:#47739a; }.support-grid div { border-top-color:#00a5e5; background:#fff; }.privacy-note { border-color:#aacce9; color:#365f8e; background:#f8fcff; }.practice-section { background:#f7fbff; }.practice-callout { border-left-color:#00a5e5; background:#fff; }.practice-callout span { color:#008fd2; }.sample-row { border-color:#8abce3; color:#356998; }
.app-statusbar { position:sticky; bottom:0; z-index:6; width:100%; margin:0; padding:.85rem clamp(1.25rem,4vw,3.2rem); display:flex; align-items:center; justify-content:space-between; gap:1rem; color:#fff; background:#00a3e0; border-top:3px solid #0064ad; box-shadow:0 -4px 12px rgba(0,73,135,.18); font-size:.8rem; }.app-statusbar span { color:#fff0a5; }.app-statusbar p { margin:0; }.preview-banner { background:#0054a8; }
.release-actions .release-delete-button { background:#c2410c; }.release-actions .release-delete-button:hover { background:#9a3412; }
.help-introduction { background:#f7fbff; }.help-intro-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; border:1px solid #b8d6ef; background:#b8d6ef; }.help-intro-grid>div { min-height:145px; padding:1.35rem; background:#fff; }.help-intro-grid b { color:#008ed1; font:800 .72rem monospace; letter-spacing:.08em; }.help-intro-grid p { margin:.55rem 0 0; color:#4c6f98; font-size:.88rem; line-height:1.65; }.help-intro-grid strong { color:#0051a9; }.help-guide { background:#fff; }.help-accordion { border-top:1px solid #b9d3e9; }.help-accordion details { scroll-margin-top:5.5rem; border-bottom:1px solid #c8dced; }.help-accordion summary { display:grid; grid-template-columns:46px minmax(0,1fr) 30px; gap:1rem; align-items:center; padding:1.25rem .4rem; cursor:pointer; list-style:none; }.help-accordion summary::-webkit-details-marker { display:none; }.help-section-number { display:grid; place-items:center; width:2.1rem; height:2.1rem; color:#fff; background:#00a5e5; border-radius:50%; font:800 .76rem/1 monospace; }.help-section-title { display:grid; gap:.15rem; }.help-section-title b { color:#004c9d; font-size:1.16rem; letter-spacing:-.04em; }.help-section-title small { color:#6683a7; font-size:.8rem; }.help-accordion .summary-arrow { color:#008ed1; }.help-accordion details[open] .summary-arrow { transform:rotate(45deg); }.help-accordion details[open] .help-section-number { background:#0051a9; }.help-section-content { padding:0 0 1.5rem; }.help-items { display:grid; gap:.7rem; }.help-item { padding:1.25rem 1.35rem; border:1px solid #d3e3f1; background:#f9fcff; }.help-item.has-capture { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.68fr); gap:1.4rem; align-items:start; }.help-item-number { color:#008ed1; font:800 .68rem monospace; letter-spacing:.08em; }.help-item h3 { margin:.25rem 0 .35rem; color:#0051a9; font-size:1rem; letter-spacing:-.035em; }.help-item p { margin:0; color:#466a94; font-size:.87rem; line-height:1.75; }.help-action-preview { display:grid; justify-items:start; gap:.6rem; margin-top:1rem; }.app-button-preview { display:inline-flex; align-items:center; min-height:2.65rem; padding:0 1rem; color:#174f8c; border:1px solid #9cbce0; border-radius:4px; background:#fff; box-shadow:0 1px 0 rgba(0,67,135,.04); font-size:.86rem; font-weight:700; }.help-action-preview small { max-width:660px; color:#5d7b9d; font-size:.76rem; line-height:1.55; }.help-capture { margin:0; overflow:hidden; border:1px solid #b9d5ec; background:#fff; }.help-capture img { display:block; width:100%; height:auto; }.help-capture figcaption { padding:.55rem .7rem; color:#5a7da5; background:#f1f8ff; font-size:.7rem; font-weight:700; }
.hero-download-pending { margin:1rem 0 -2.4rem; color:#6b7f96; font-size:.79rem; }
.installer-proof { max-width:720px; margin:1rem 0 -2.4rem; color:#53779e; font-size:.75rem; line-height:1.55; }.installer-proof b,.installer-proof span { color:#0051a9; }.installer-proof code,.release-sha { overflow-wrap:anywhere; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:.69rem; }.release-sha { margin-top:.25rem; color:#53779e !important; }
.admin-page { background:#edf4fd; }.admin-main { width:min(1360px,100%); padding-top:3rem; padding-bottom:3rem; }.admin-intro { padding:2.1rem 2.25rem; border-left:5px solid #00a5e5; background:linear-gradient(105deg,#fff 0%,#eef8ff 100%); box-shadow:0 8px 24px rgba(0,84,168,.06); }.admin-intro h1 { color:#0051a9; }.admin-section { border-color:#c7dcef; border-radius:4px; box-shadow:0 8px 22px rgba(0,84,168,.05); }.admin-title p { color:#008fd2; }.admin-table-wrap th { color:#165487; background:#eaf4fe; }.admin-table-wrap td { border-bottom-color:#d7e5f2; }.admin-table-wrap a,.release-row a { color:#007ec2; }.status-form select,.status-form input,.release-form input,.editor-form input,.editor-form textarea { border-color:#b7d0e8; }.status-form button,.release-actions button { background:#0054a8; }.release-form { background:#eef8ff; }.release-row span { color:#00539f; background:#dcefff; }.empty-state { color:#5d7b9d; background:#f4f9ff; }.admin-statusbar { position:fixed; }
@media (max-width:760px) { .site-header { height:4.2rem; padding:0 1rem; }.header-menu-icon { width:21px; flex-basis:21px; gap:4px; }.header-menu-icon i { width:19px; }.brand-logo { width:105px; }.product-name { padding-left:.65rem; font-size:.82rem; }.header-actions { gap:.55rem; font-size:.68rem; }.header-actions a:first-child { display:none; }.app-statusbar { align-items:flex-start; flex-direction:column; padding:.7rem 1rem; font-size:.7rem; }.admin-main { padding-bottom:5.5rem; }.admin-intro { padding:1.4rem; }.admin-statusbar p:last-child { display:none; } }
@media (max-width:760px) { .help-intro-grid { grid-template-columns:1fr; gap:1px; }.help-intro-grid>div { min-height:auto; }.help-accordion summary { grid-template-columns:40px minmax(0,1fr) 22px; gap:.65rem; padding:1rem 0; }.help-section-title b { font-size:1rem; }.help-section-title small { font-size:.75rem; }.help-section-content { padding-bottom:1rem; }.help-item,.help-item.has-capture { display:block; padding:1rem; }.help-capture { margin-top:1rem; } }
.notification-sent { color:#00723f; }.notification-pending { color:#7b5700; }.notification-failed { color:#b42318; }.retry-button { margin-top:.35rem; padding:.35rem .5rem; color:#0054a8; border:1px solid #9bc5e7; border-radius:3px; background:#fff; font:700 .7rem inherit; cursor:pointer; }
.alert-test-panel { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1.25rem; padding:1rem 1.1rem; border:1px solid #b7d8ef; background:#f3faff; }.alert-test-panel b,.alert-test-panel small { display:block; }.alert-test-panel small { margin-top:.2rem; color:#58799c; font-size:.75rem; }.alert-test-panel .retry-button { margin:0; padding:.5rem 1rem; }.alert-test-result { margin:0 0 1.25rem; padding:.75rem 1rem; font-size:.8rem; }.alert-test-result.sent { color:#09683f; background:#e7f8ef; }.alert-test-result.failed { color:#a11c14; background:#fff0ef; }
.recipient-panel { display:flex; align-items:center; justify-content:space-between; gap:1.2rem; margin:0 0 1rem; padding:1rem 1.1rem; border:1px solid #b7d8ef; background:#fff; }.recipient-panel b,.recipient-panel small { display:block; }.recipient-panel>div small { margin-top:.25rem; color:#58799c; font-size:.75rem; }.recipient-panel .retry-button { margin:0; padding:.48rem .8rem; }.recipient-dialog { width:min(520px,calc(100vw - 2rem)); padding:1.5rem; border:1px solid #9bc5e7; border-radius:5px; color:var(--ink); box-shadow:0 20px 50px rgba(0,55,120,.25); }.recipient-dialog::backdrop { background:rgba(0,38,83,.4); }.recipient-dialog h3 { margin:0; color:#0051a9; }.recipient-dialog>p { margin:.5rem 0 1.25rem; color:#58799c; font-size:.82rem; line-height:1.5; }.recipient-dialog form[data-recipient-picker] { display:grid; gap:.45rem; }.recipient-dialog label { color:#275784; font-size:.78rem; font-weight:800; }.recipient-dialog select { width:100%; min-width:0; padding:.58rem .65rem; border:1px solid #b7d0e8; border-radius:3px; background:#fff; color:var(--ink); font:inherit; font-size:.85rem; }.recipient-picker-message { min-height:1rem; color:#a11c14; font-size:.72rem; }.dialog-close { display:flex; justify-content:end; margin:-.75rem -.75rem 0 0; }.dialog-close button { border:0; color:#52769d; background:transparent; font-size:1.5rem; line-height:1; cursor:pointer; }.dialog-actions { display:flex; justify-content:end; gap:.5rem; margin-top:.6rem; }.dialog-actions .download-button { width:auto; padding:.5rem .9rem; }.dialog-actions .retry-button { margin:0; padding:.5rem .9rem; }
@media (max-width:760px) { .recipient-panel { align-items:stretch; flex-direction:column; } }