/* An editable document, with controls where the decision lives. */
.op { --op-paper:#f1efe8; --op-ink:#10191e; --op-muted:#536268; --op-line:#a5ada9; color:var(--op-ink); font-size:15px; line-height:1.65; margin:0 auto; width:100%; max-width:1320px; padding:0 clamp(20px,4vw,64px) 64px; }
.op *, .op *::before,.op *::after { box-sizing:border-box; }
.op h1,.op h2,.op h3,.op h4,.op p { margin:0; }
.op button,.op input,.op select,.op textarea { font:inherit; color:inherit; }
.op button { min-height:48px; padding:10px 16px; border:1px solid var(--op-line); border-radius:0; background:transparent; cursor:pointer; text-align:left; line-height:1.4; display:inline-flex; align-items:center; justify-content:space-between; gap:16px; }
.op button:hover { background:#e4e5dc; border-color:var(--op-ink); }
.op button:disabled { opacity:.45; cursor:default; }
.op .op-primary { background:var(--op-ink); color:var(--op-paper); border-color:var(--op-ink); }
.op .op-primary:hover { background:#30464e; }
.op input,.op select,.op textarea { width:100%; min-height:48px; background:#faf8f2; border:1px solid var(--op-line); border-radius:0; padding:10px 12px; line-height:1.5; }
.op textarea { min-height:112px; resize:vertical; }
.op label { display:block; font-size:13px; margin-bottom:8px; font-weight:500; }
.op :focus-visible { outline:2px solid #426d76; outline-offset:3px; }
.op [hidden] { display:none!important; }
.op-eyebrow { font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--op-muted); }
.op-heading { display:grid; grid-template-columns:1.65fr 1fr; align-items:end; gap:48px; padding:32px 0 40px; }
.op-heading h2,.op-heading h1 { font-size:clamp(32px,4.2vw,58px); line-height:1.15; font-weight:400; margin:16px 0 24px; }
.op-heading>div>p:last-child { max-width:64ch; color:var(--op-muted); }
.op-start { max-width:360px; justify-self:end; width:100%; }
.op-start button { width:100%; margin-top:8px; }
.op-status { min-height:0; font-size:14px; color:#345b62; }
.op-status:not(:empty) { padding:16px 0; }
.op-document { border-top:2px solid var(--op-ink); }
.op-document-head { display:flex; gap:24px; align-items:center; justify-content:space-between; padding:32px 0 24px; }
.op-document-head h3 { font-size:clamp(27px,3vw,40px); font-weight:400; line-height:1.25; margin:12px 0 8px; }
.op-document-head button { flex-shrink:0; }
.op-subtitle { color:var(--op-muted); }
.op-contacts { display:grid; grid-template-columns:1fr 1fr; gap:16px 32px; padding-bottom:24px; }
.op-contacts p { color:var(--op-muted); font-size:14px; }
.op-contacts strong { display:block; color:var(--op-ink); font-weight:500; }
.op-principle { border-block:1px solid var(--op-line); padding:24px 0; max-width:none; color:var(--op-muted); }
.op-meta-editor,.op-row-editor { display:grid; grid-template-columns:1fr 1fr; gap:24px; padding:24px 0; }
.op-wide { grid-column:1/-1; }
.op-decisions { border-bottom:1px solid var(--op-line); padding:24px 0; }
.op-decisions h4 { font-size:17px; font-weight:500; }
.op-decisions p { margin-top:8px; color:var(--op-muted); }
.op-decision-list { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; }
.op-decision-list button { font-size:14px; }
.op-row { border-bottom:1px solid var(--op-line); padding:24px 0 32px; scroll-margin-top:120px; }
.op-row-head { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; }
.op-row-heading { display:flex; align-items:baseline; gap:16px; min-width:0; }
.op-row-number { font-size:12px; color:var(--op-muted); }
.op-row h4 { font-size:23px; font-weight:400; line-height:1.3; overflow-wrap:anywhere; }
.op-row-head button { flex-shrink:0; }
.op-rule-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px 40px; }
.op-rule { display:grid; grid-template-columns:112px 1fr; gap:12px; min-width:0; }
.op-rule dt { color:var(--op-muted); font-size:13px; padding-top:2px; }
.op-rule dd { margin:0; overflow-wrap:anywhere; }
.op-rule-grid dl { margin:0; }
.op-missing { color:#8a3d2c; font-style:italic; }
.op-editor-actions { grid-column:1/-1; display:flex; gap:12px; justify-content:space-between; }
.op .op-remove { color:#824437; border-color:#b5a69b; }
.op-add { margin-top:24px; }
.op-handover { padding:32px 0; max-width:90ch; }
.op-handover h3 { font-size:23px; margin-bottom:12px; }
.op-handover p { color:var(--op-muted); margin-top:8px; }
.op-footer { display:grid; grid-template-columns:1.1fr 1fr; gap:48px; padding:40px 0; border-block:1px solid var(--op-ink); }
.op-footer h3 { font-size:29px; line-height:1.3; margin:12px 0; }
.op-footer h4 { font-size:18px; font-weight:500; }
.op-footer p { color:var(--op-muted); margin-bottom:16px; }
.op-actions { display:flex; gap:8px; flex-wrap:wrap; }
.op-storage .op-actions { margin-bottom:8px; }
.op .op-small { font-size:13px; margin-top:12px; }
.op-discuss { display:flex; gap:32px; align-items:center; justify-content:space-between; padding-top:40px; }
.op-discuss h3 { font-size:27px; line-height:1.3; margin-bottom:12px; }
.op-discuss p { color:var(--op-muted); }
.op-discuss button { flex-shrink:0; }
.op-confirm { border:1px solid #806b4b; padding:20px; margin-bottom:16px; background:#ede8d9; scroll-margin-top:112px; }
.op-confirm p { margin-bottom:16px; }
@media(max-width:900px) { .op-rule-grid { grid-template-columns:1fr; } .op-heading { gap:24px; } .op-footer { gap:24px; } }
@media(max-width:760px) { .op { padding-inline:20px; } .op-heading { grid-template-columns:1fr; padding-top:16px; gap:24px; } .op-heading h2,.op-heading h1 { font-size:36px; } .op-start { justify-self:start; max-width:none; } .op-document-head { flex-direction:column; align-items:flex-start; gap:16px; } .op-document-head h3 { font-size:29px; } .op-contacts,.op-meta-editor,.op-row-editor,.op-footer { grid-template-columns:1fr; gap:16px; } .op-rule { grid-template-columns:96px 1fr; gap:12px; } .op-row-head { align-items:flex-start; } .op-row-heading { gap:10px; } .op-row h4 { font-size:21px; } .op-row-head button { padding:10px 12px; } .op input,.op textarea,.op select { font-size:16px; } .op-footer { gap:32px; } .op-footer .op-actions button { flex:1 1 170px; } .op-discuss { flex-direction:column; align-items:flex-start; } .op-heading br { display:none; } }
@media(prefers-reduced-motion:reduce) { .op { scroll-behavior:auto; } }
@media print { .op { padding:0; max-width:none; } .op-heading,.op-footer,.op-discuss,.op-status,.op-confirm,.op button,.op-row-editor,.op-meta-editor { display:none!important; } .op-document { border:0; } .op-row { break-inside:avoid; } }

/* A consistent touch target in Safari as well as Chromium. */
.op select{height:48px;appearance:none;-webkit-appearance:none;padding-right:36px;background-image:linear-gradient(45deg,transparent 50%,#536268 50%),linear-gradient(135deg,#536268 50%,transparent 50%);background-position:calc(100% - 18px) 21px,calc(100% - 13px) 21px;background-size:5px 5px;background-repeat:no-repeat}