.ocp-list,.ocp-item,.ocp-panel,.ocp-panel *{font-family:'Open Sans',sans-serif}
.ocp-list{--ocp-accent:#d9b13f;--ocp-text:#222;display:flex;flex-direction:column;gap:12px;margin:16px 0}
.ocp-item{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:12px 24px;background:#fff;border:1px solid var(--ocp-accent);border-radius:16px;color:var(--ocp-text);font-family:'Open Sans',sans-serif;font-size:16px;font-weight:600;line-height:1.4;cursor:pointer;transition:background .2s,box-shadow .2s}
.ocp-item:hover,.ocp-item:focus-visible{background:#fffaf0;box-shadow:0 2px 10px rgba(217,177,63,.25)}
.ocp-item:focus-visible{outline:2px solid var(--ocp-accent);outline-offset:3px}
.ocp-item__icon{color:var(--ocp-accent);font-size:20px;font-weight:400;line-height:1}

.ocp-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;z-index:99998}
.ocp-overlay.is-open{opacity:1;visibility:visible}
.ocp-panel{position:fixed;top:0;right:0;bottom:0;width:min(520px,100%);display:flex;flex-direction:column;background:#fff;box-shadow:-8px 0 30px rgba(0,0,0,.2);transform:translateX(100%);visibility:hidden;transition:transform .35s ease,visibility .35s;z-index:99999}
.ocp-panel.is-open{transform:none;visibility:visible}
.ocp-panel__head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;border-bottom:1px solid #d9b13f}
.ocp-panel__title{margin:0;font-size:18px;line-height:1.3;color:#222}
.ocp-panel__close{all:unset;box-sizing:border-box;padding:6px 16px;border:1px solid #d9b13f;border-radius:16px;background:#fff;color:#222;font-family:'Open Sans',sans-serif;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s}
.ocp-panel__close:hover,.ocp-panel__close:focus-visible{background:#d9b13f}
.ocp-panel__body{flex:1;overflow-y:auto;padding:20px 24px;color:#333;font-size:14px;line-height:1.6}
.ocp-panel__body p{margin:0 0 1em}
.ocp-panel__body table{width:100%;border-collapse:collapse;margin:0 0 1em;font-size:13px}
.ocp-panel__body th,.ocp-panel__body td{padding:8px 10px;border-bottom:1px solid #eadfba;text-align:left;vertical-align:top}
.ocp-panel__body thead th{background:#fbf3d9}
body.ocp-lock{overflow:hidden}

@media (prefers-reduced-motion:reduce){.ocp-panel,.ocp-overlay{transition:none}}
