@import '_content/Operandor.Blog.UI/Operandor.Blog.UI.e05szo8paz.bundle.scp.css';
@import '_content/Operandor.Contact.UI/Operandor.Contact.UI.vofzwd48kt.bundle.scp.css';
@import '_content/Operandor.DesignSystem/Operandor.DesignSystem.y2osqpsx8e.bundle.scp.css';

/* /Home/PaperToData.razor.rz.scp.css */
.op-paper[b-won8rah701]{position:relative;width:100%;min-width:0;font-family:var(--font-mono);font-size:13px;line-height:1.6;color:rgba(255,255,255,0.86)}
.op-paper__doc[b-won8rah701],.op-paper__table[b-won8rah701]{border:1px solid rgba(255,255,255,0.16);border-radius:8px;background:rgba(255,255,255,0.04)}
.op-paper__doc[b-won8rah701]{padding:14px 16px;max-width:260px}
.op-paper__file[b-won8rah701]{font-size:12px;color:var(--green-300)}
.op-paper__lines[b-won8rah701]{display:grid;gap:8px;margin-top:12px}
.op-paper__lines i[b-won8rah701]{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,0.16)}
.op-paper__lines i:nth-child(1)[b-won8rah701]{width:82%}
.op-paper__lines i:nth-child(2)[b-won8rah701]{width:64%}
.op-paper__lines i:nth-child(3)[b-won8rah701]{width:74%}
.op-paper__table[b-won8rah701]{overflow:hidden}
.op-paper__row[b-won8rah701]{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:10px 16px;border-top:1px solid rgba(255,255,255,0.08)}
.op-paper__row--head[b-won8rah701]{border-top:0;font-size:12px;color:var(--green-300)}
.op-paper__row i[b-won8rah701]{display:block;height:6px;margin-top:4px;border-radius:3px;background:rgba(255,255,255,0.14)}
.op-paper__row span:first-child i[b-won8rah701]{width:80%}
.op-paper__row span:nth-child(2) i[b-won8rah701]{width:40%}
.op-paper__row span:nth-child(3) i[b-won8rah701]{width:70%}
.op-paper__result[b-won8rah701]{margin-top:12px;color:var(--green-300)}

/* The documents take turns: every part that changes holds one layer per document in the same grid cell, and
   each layer shows for one five-second pulse of the 40-second loop of eight (PaperToData.razor). */
.op-paper__stack[b-won8rah701]{display:grid}
.op-paper__stack > .op-paper__scene[b-won8rah701]{grid-area:1 / 1;opacity:0;white-space:nowrap;animation:op-paper-scene-b-won8rah701 40s linear infinite;animation-delay:calc(var(--scene) * 5s)}

/* A calendar document fills a work week instead of rows: weekday names over a morning and an afternoon slot.
   Its height stays within the three rows', so the drawing does not jump when the target changes. */
.op-paper__calendar[b-won8rah701]{display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:auto 18px 18px;gap:6px;padding:8px 16px 12px;border-top:1px solid rgba(255,255,255,0.08)}
.op-paper__day[b-won8rah701]{font-size:11px;line-height:1.4;color:rgba(255,255,255,0.5)}
.op-paper__slot[b-won8rah701]{border-radius:3px;background:rgba(255,255,255,0.05)}
.op-paper__entry[b-won8rah701]{display:block;border-radius:3px;background:rgba(255,255,255,0.14)}

/* The wires run from under the document's text down to the start of each table column. The table's
   content starts 17px in (1px border + 16px padding), and its three columns share the rest with two 12px gaps. */
.op-paper__wires[b-won8rah701]{position:relative;height:36px;--column:calc((100% - 58px) / 3 + 12px)}
.op-paper__wire[b-won8rah701]{position:absolute;display:block;overflow:hidden;background:rgba(255,255,255,0.18)}
.op-paper__wire--trunk[b-won8rah701]{left:17px;top:0;width:1px;height:14px}
.op-paper__wire--bus[b-won8rah701]{left:17px;top:14px;height:1px;width:calc(var(--column) * 2)}
.op-paper__wire--drop[b-won8rah701]{top:14px;bottom:0;width:1px}
.op-paper__wire--first[b-won8rah701]{left:17px}
.op-paper__wire--second[b-won8rah701]{left:calc(17px + var(--column))}
.op-paper__wire--third[b-won8rah701]{left:calc(17px + var(--column) * 2)}

/* The pulse: one five-second loop, each part starting when the pulse reaches it. The document is read
   first, the pulse runs down the trunk, along the bus and down each column's wire as it passes it, and
   the rows light up one after the other. */
.op-paper__wire[b-won8rah701]::after{content:"";position:absolute;opacity:0;background:var(--green-300);box-shadow:0 0 6px var(--green-300)}
.op-paper__wire--trunk[b-won8rah701]::after,.op-paper__wire--drop[b-won8rah701]::after{left:0;width:1px;height:10px;animation:op-paper-down-b-won8rah701 5s linear infinite}
.op-paper__wire--bus[b-won8rah701]::after{top:0;height:1px;width:28px;animation:op-paper-across-b-won8rah701 5s linear infinite .9s}
.op-paper__wire--trunk[b-won8rah701]::after{animation-delay:.5s}
.op-paper__wire--first[b-won8rah701]::after{animation-delay:.95s}
.op-paper__wire--second[b-won8rah701]::after{animation-delay:1.3s}
.op-paper__wire--third[b-won8rah701]::after{animation-delay:1.65s}
.op-paper__lines i[b-won8rah701]{animation:op-paper-read-b-won8rah701 5s ease-in-out infinite}
.op-paper__body > .op-paper__row:nth-child(1) i[b-won8rah701]{animation:op-paper-fill-b-won8rah701 5s ease-in-out infinite 2.1s}
.op-paper__body > .op-paper__row:nth-child(2) i[b-won8rah701]{animation:op-paper-fill-b-won8rah701 5s ease-in-out infinite 2.4s}
.op-paper__body > .op-paper__row:nth-child(3) i[b-won8rah701]{animation:op-paper-fill-b-won8rah701 5s ease-in-out infinite 2.7s}
.op-paper__entry[b-won8rah701]{animation:op-paper-fill-b-won8rah701 5s ease-in-out infinite;animation-delay:calc(2.1s + var(--entry) * .3s)}

@keyframes op-paper-scene-b-won8rah701{
    0%{opacity:0}
    0.6%,11.9%{opacity:1}
    12.5%,100%{opacity:0}
}
@keyframes op-paper-down-b-won8rah701{
    0%{top:-10px;opacity:0}
    2%{opacity:1}
    8%{top:100%;opacity:1}
    9%,100%{top:100%;opacity:0}
}
@keyframes op-paper-across-b-won8rah701{
    0%{left:-28px;opacity:0}
    2%{opacity:1}
    16%{left:100%;opacity:1}
    17%,100%{left:100%;opacity:0}
}
@keyframes op-paper-read-b-won8rah701{
    0%,24%,100%{background:rgba(255,255,255,0.16)}
    4%,14%{background:color-mix(in srgb,var(--green-300) 70%,transparent)}
}
@keyframes op-paper-fill-b-won8rah701{
    0%,52%,100%{background:rgba(255,255,255,0.14)}
    6%,40%{background:color-mix(in srgb,var(--green-300) 55%,transparent)}
}

@media (prefers-reduced-motion:reduce){
    .op-paper__wire[b-won8rah701]::after{display:none}
    /* The row selector repeats the :nth-child form of the rules that start the fills; a plain .op-paper__row i
       is less specific and left the table's bars moving. */
    .op-paper__lines i[b-won8rah701],.op-paper__body > .op-paper__row:nth-child(n) i[b-won8rah701],.op-paper__entry[b-won8rah701],.op-paper__stack > .op-paper__scene[b-won8rah701]{animation:none}
    .op-paper__stack > .op-paper__scene:first-child[b-won8rah701]{opacity:1}
}
/* /Home/TaskToProcess.razor.rz.scp.css */
.op-task[b-2adihk3mud]{position:relative;width:100%;min-width:0;font-family:var(--font-mono);font-size:13px;line-height:1.6;color:rgba(255,255,255,0.86)}
.op-task__card[b-2adihk3mud],.op-task__program[b-2adihk3mud]{border:1px solid rgba(255,255,255,0.16);border-radius:8px;background:rgba(255,255,255,0.04)}
.op-task__card[b-2adihk3mud]{padding:14px 16px;max-width:260px}
.op-task__name[b-2adihk3mud]{font-size:12px;color:var(--green-300)}
.op-task__lines[b-2adihk3mud]{display:grid;gap:8px;margin-top:12px}
.op-task__lines i[b-2adihk3mud]{display:block;height:6px;border-radius:3px;background:rgba(255,255,255,0.16)}
.op-task__lines i:nth-child(1)[b-2adihk3mud]{width:82%}
.op-task__lines i:nth-child(2)[b-2adihk3mud]{width:64%}
.op-task__lines i:nth-child(3)[b-2adihk3mud]{width:74%}

/* The tasks take turns: the card's name holds one layer per task in the same grid cell, and each layer shows for
   one five-second pulse of the 40-second loop of eight (TaskToProcess.razor). */
.op-task__stack[b-2adihk3mud]{display:grid}
.op-task__stack > .op-task__scene[b-2adihk3mud]{grid-area:1 / 1;opacity:0;white-space:nowrap;animation:op-task-scene-b-2adihk3mud 40s linear infinite;animation-delay:calc(var(--scene) * 5s)}

/* The three programs share the width with two 12px gaps. A name that does not fit a narrow screen's box is cut
   with an ellipsis instead of pushing the boxes apart. */
.op-task__programs[b-2adihk3mud]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.op-task__program[b-2adihk3mud]{min-width:0;padding:10px 10px 12px;font-size:12px;color:rgba(255,255,255,0.72)}
.op-task__program span[b-2adihk3mud]{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.op-task__program i[b-2adihk3mud]{display:block;height:6px;margin-top:8px;border-radius:3px;background:rgba(255,255,255,0.14)}
.op-task__program i:nth-of-type(1)[b-2adihk3mud]{width:80%}
.op-task__program i:nth-of-type(2)[b-2adihk3mud]{width:52%}
.op-task__outcome[b-2adihk3mud]{margin-top:12px;color:var(--green-300)}
/* On the narrowest phones a box holds about six letters at this size, so the names shrink a little to stay whole. */
@media (max-width:359px){
    .op-task__program[b-2adihk3mud]{padding:8px 6px 10px;font-size:11px}
}

/* The wires run from under the card's text down to each program, 17px in from its left edge, where the card's
   own text starts (1px border + 16px padding). A program and the gap after it take a third of the width plus a
   third of a gap. */
.op-task__wires[b-2adihk3mud]{position:relative;height:36px;--column:calc((100% - 24px) / 3 + 12px)}
.op-task__wire[b-2adihk3mud]{position:absolute;display:block;overflow:hidden;background:rgba(255,255,255,0.18)}
.op-task__wire--trunk[b-2adihk3mud]{left:17px;top:0;width:1px;height:14px}
.op-task__wire--bus[b-2adihk3mud]{left:17px;top:14px;height:1px;width:calc(var(--column) * 2)}
.op-task__wire--drop[b-2adihk3mud]{top:14px;bottom:0;width:1px}
.op-task__wire--first[b-2adihk3mud]{left:17px}
.op-task__wire--second[b-2adihk3mud]{left:calc(17px + var(--column))}
.op-task__wire--third[b-2adihk3mud]{left:calc(17px + var(--column) * 2)}

/* The pulse: one five-second loop, each part starting when the pulse reaches it, with the paper-to-data drawing's
   timing. The task is read first, the pulse runs down the trunk, along the bus and down each program's wire as it
   passes it, the programs light up one after the other, and the outcome brightens last. */
.op-task__wire[b-2adihk3mud]::after{content:"";position:absolute;opacity:0;background:var(--green-300);box-shadow:0 0 6px var(--green-300)}
.op-task__wire--trunk[b-2adihk3mud]::after,.op-task__wire--drop[b-2adihk3mud]::after{left:0;width:1px;height:10px;animation:op-task-down-b-2adihk3mud 5s linear infinite}
.op-task__wire--bus[b-2adihk3mud]::after{top:0;height:1px;width:28px;animation:op-task-across-b-2adihk3mud 5s linear infinite .9s}
.op-task__wire--trunk[b-2adihk3mud]::after{animation-delay:.5s}
.op-task__wire--first[b-2adihk3mud]::after{animation-delay:.95s}
.op-task__wire--second[b-2adihk3mud]::after{animation-delay:1.3s}
.op-task__wire--third[b-2adihk3mud]::after{animation-delay:1.65s}
.op-task__lines i[b-2adihk3mud]{animation:op-task-read-b-2adihk3mud 5s ease-in-out infinite}
.op-task__program[b-2adihk3mud]{animation:op-task-lit-b-2adihk3mud 5s ease-in-out infinite;animation-delay:calc(1.3s + var(--program) * .35s)}
.op-task__program i[b-2adihk3mud]{animation:op-task-fill-b-2adihk3mud 5s ease-in-out infinite;animation-delay:calc(1.3s + var(--program) * .35s)}
.op-task__outcome[b-2adihk3mud]{animation:op-task-outcome-b-2adihk3mud 5s ease-in-out infinite 2.4s}

@keyframes op-task-scene-b-2adihk3mud{
    0%{opacity:0}
    0.6%,11.9%{opacity:1}
    12.5%,100%{opacity:0}
}
@keyframes op-task-down-b-2adihk3mud{
    0%{top:-10px;opacity:0}
    2%{opacity:1}
    8%{top:100%;opacity:1}
    9%,100%{top:100%;opacity:0}
}
@keyframes op-task-across-b-2adihk3mud{
    0%{left:-28px;opacity:0}
    2%{opacity:1}
    16%{left:100%;opacity:1}
    17%,100%{left:100%;opacity:0}
}
@keyframes op-task-read-b-2adihk3mud{
    0%,24%,100%{background:rgba(255,255,255,0.16)}
    4%,14%{background:color-mix(in srgb,var(--green-300) 70%,transparent)}
}
@keyframes op-task-lit-b-2adihk3mud{
    0%,52%,100%{border-color:rgba(255,255,255,0.16);background-color:rgba(255,255,255,0.04);color:rgba(255,255,255,0.72)}
    6%,40%{border-color:color-mix(in srgb,var(--green-300) 60%,transparent);background-color:color-mix(in srgb,var(--green-300) 9%,transparent);color:var(--green-300)}
}
@keyframes op-task-fill-b-2adihk3mud{
    0%,52%,100%{background:rgba(255,255,255,0.14)}
    6%,40%{background:color-mix(in srgb,var(--green-300) 55%,transparent)}
}
@keyframes op-task-outcome-b-2adihk3mud{
    0%,60%,100%{opacity:.62}
    8%,44%{opacity:1}
}

@media (prefers-reduced-motion:reduce){
    .op-task__wire[b-2adihk3mud]::after{display:none}
    .op-task__lines i[b-2adihk3mud],.op-task__program[b-2adihk3mud],.op-task__program i[b-2adihk3mud],.op-task__outcome[b-2adihk3mud],.op-task__stack > .op-task__scene[b-2adihk3mud]{animation:none}
    .op-task__stack > .op-task__scene:first-child[b-2adihk3mud]{opacity:1}
}
/* /Layout/MainLayout.razor.rz.scp.css */
.op-page[b-f2icjeb67i] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.op-main[b-f2icjeb67i] {
    flex: 1 0 auto;
}
/* /Localization/LinkedText.razor.rz.scp.css */
/* The link sits in running text, so an underline marks it as well as its colour. */
.op-inline-link[b-2lktfsb24z] {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}
/* /Work/Map/ExperienceMap.razor.rz.scp.css */
/* The experience map (ExperienceMap.razor): water and land from the surface tokens, so both themes read; the
   dots in the accent green with a ring of the band's surface; the names as small labels over the drawing, in lists
   that show no list marks. */
.op-map__heading[b-gu1ijtrra2]{font-family:var(--font-heading);font-weight:600;font-size:30px;line-height:1.15;letter-spacing:-0.014em;color:var(--text-heading);margin:0}
.op-map__lead[b-gu1ijtrra2]{font-size:17px;line-height:1.6;color:var(--text-muted);max-width:60ch;margin:14px 0 0}

.op-map[b-gu1ijtrra2]{--map-water:var(--surface-page);--map-land:var(--surface-active);--map-urban:var(--border-strong-c);display:grid;grid-template-columns:var(--map-columns);gap:16px;align-items:start;margin:32px 0 0}
.op-map__view[b-gu1ijtrra2]{position:relative;min-width:0;overflow:hidden;border:1px solid var(--border-subtle);border-radius:var(--radius-2);background:var(--map-water)}
.op-map__view svg[b-gu1ijtrra2]{position:absolute;inset:0;display:block;width:100%;height:100%}
.op-map__land[b-gu1ijtrra2]{fill:var(--map-land)}
.op-map__lake[b-gu1ijtrra2]{fill:var(--map-water)}
.op-map__urban[b-gu1ijtrra2]{fill:var(--map-urban);fill-opacity:0.5}
.op-map__river[b-gu1ijtrra2]{fill:none;stroke:var(--map-water);stroke-width:3px;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}

.op-map__names[b-gu1ijtrra2]{margin:0;padding:0;list-style:none}
.op-map__dot[b-gu1ijtrra2]{position:absolute;z-index:2;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:var(--accent);border:2px solid var(--surface-card)}
.op-map__label[b-gu1ijtrra2],.op-map__title[b-gu1ijtrra2]{position:absolute;z-index:1;padding:1px 6px;font-size:12px;line-height:16px;white-space:nowrap;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-1)}
.op-map__label[b-gu1ijtrra2]{font-weight:500;color:var(--text-body)}
.op-map__label--right[b-gu1ijtrra2]{transform:translate(10px,-50%)}
.op-map__label--left[b-gu1ijtrra2]{transform:translate(calc(-100% - 10px),-50%)}
.op-map__label--above-right[b-gu1ijtrra2]{transform:translate(-12px,calc(-100% - 10px))}
.op-map__label--below-left[b-gu1ijtrra2]{transform:translate(calc(-100% + 12px),10px)}
.op-map__title[b-gu1ijtrra2]{top:10px;left:10px;font-weight:600;color:var(--text-heading)}

/* Below the site's two-column width the views stack, the area's no wider than it needs to be. */
@media (max-width:960px){
  .op-map[b-gu1ijtrra2]{grid-template-columns:1fr}
  .op-map__view--area[b-gu1ijtrra2]{max-width:520px}
}
