.onb{background:var(--color-canvas);min-height:100dvh;color:var(--color-fg-primary)}.onb-bar{z-index:20;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-6);background:var(--color-chrome);color:var(--color-fg-on-chrome);border-bottom:3px solid var(--color-accent);display:flex;position:sticky;top:0}.onb-bar-title{flex-direction:column;line-height:1.2;display:flex}.onb-bar-title small{letter-spacing:.12em;text-transform:uppercase;color:color-mix(in srgb, var(--color-fg-on-chrome) 62%, transparent);font-size:11px}.onb-bar-title strong{font-family:var(--font-display);font-size:15px}.onb-save{align-items:center;gap:var(--space-2);color:color-mix(in srgb, var(--color-fg-on-chrome) 70%, transparent);margin-inline-start:auto;font-size:12px;display:inline-flex}.onb-save[data-state=saving] .onb-save-dot{animation:onb-pulse 1s var(--ease-in-out) infinite alternate}.onb-save-dot{background:var(--color-success-live);border-radius:999px;width:7px;height:7px}.onb-save[data-state=error] .onb-save-dot{background:var(--color-warning)}@keyframes onb-pulse{to{opacity:.25}}.onb-grid{gap:var(--space-8);max-width:1240px;padding:var(--space-8) var(--space-6) var(--space-16);margin:0 auto;display:grid}@media (width>=1024px){.onb-grid{grid-template-columns:360px minmax(0,1fr);align-items:start}.onb-aside{position:sticky;top:92px}}.onb-card{border-radius:var(--radius-panel);background:var(--color-chrome);color:var(--color-fg-on-chrome);box-shadow:var(--elevation-high);padding:var(--space-8) var(--space-6) var(--space-5);isolation:isolate;position:relative;overflow:hidden}.onb-card:before{content:"";top:var(--space-3);background:var(--color-canvas);width:54px;height:8px;box-shadow:inset 0 1px 2px color-mix(in srgb, var(--color-chrome) 60%, transparent);border-radius:999px;position:absolute;left:50%;translate:-50%}.onb-card:after{content:"";background:repeating-radial-gradient(circle, transparent 0 14px, color-mix(in srgb, var(--color-fg-on-chrome) 7%, transparent) 14px 15px);z-index:-1;border-radius:999px;width:320px;height:320px;position:absolute;inset:-40% -40% auto auto}.onb-card-head{letter-spacing:.18em;text-transform:uppercase;color:color-mix(in srgb, var(--color-fg-on-chrome) 66%, transparent);justify-content:space-between;align-items:center;font-size:10px;display:flex}.onb-card-photo{margin-top:var(--space-6);border-radius:var(--radius-card);background:color-mix(in srgb, var(--color-fg-on-chrome) 10%, transparent);border:1px solid color-mix(in srgb, var(--color-fg-on-chrome) 22%, transparent);place-items:center;width:128px;height:152px;display:grid;position:relative;overflow:hidden}.onb-card-photo img{object-fit:cover;width:100%;height:100%}.onb-card-name{margin-top:var(--space-5);font-family:var(--font-display);font-weight:var(--font-display-weight);overflow-wrap:anywhere;min-height:1.15em;font-size:24px;line-height:1.15}.onb-card-name[data-empty=true]{color:color-mix(in srgb, var(--color-fg-on-chrome) 38%, transparent)}.onb-card-ar{margin-top:var(--space-1);font-family:var(--font-arabic);color:color-mix(in srgb, var(--color-fg-on-chrome) 80%, transparent);min-height:1.4em;font-size:17px}.onb-card-role{margin-top:var(--space-3);align-items:center;gap:var(--space-2);border-radius:var(--radius-pill);background:color-mix(in srgb, var(--color-gold) 20%, transparent);color:var(--color-gold);padding:4px 10px;font-size:12px;font-weight:700;display:inline-flex}.onb-card-rows{margin-top:var(--space-5);gap:var(--space-1-5) var(--space-4);grid-template-columns:auto 1fr;font-size:12px;display:grid}.onb-card-rows dt{color:color-mix(in srgb, var(--color-fg-on-chrome) 55%, transparent)}.onb-card-rows dd{text-align:end}.onb-card-rows dd.onb-card-no{font-family:var(--font-mono);letter-spacing:.04em}.onb-stamps{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px dashed color-mix(in srgb, var(--color-fg-on-chrome) 24%, transparent);gap:var(--space-1);text-align:center;grid-template-columns:repeat(5,1fr);display:grid}.onb-stamp{letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb, var(--color-fg-on-chrome) 55%, transparent);transition:color var(--dur-hover) var(--ease-out);flex-direction:column;align-items:center;gap:6px;font-size:10px;display:flex}.onb-stamp-mark{border:1.5px dashed color-mix(in srgb, var(--color-fg-on-chrome) 35%, transparent);width:30px;height:30px;transition:background-color var(--dur-hover) var(--ease-out), border-color var(--dur-hover) var(--ease-out), color var(--dur-hover) var(--ease-out);border-radius:999px;place-items:center;display:grid}.onb-stamp[data-done=true]{color:var(--color-fg-on-chrome)}.onb-stamp[data-done=true] .onb-stamp-mark{border-style:solid;border-color:var(--color-gold);background:var(--color-gold);color:var(--color-chrome)}.onb-stamp[data-flag=true] .onb-stamp-mark{border-color:var(--color-warning)}@media (width<=1023px){.onb-card{column-gap:var(--space-4);padding:var(--space-4);grid-template-columns:76px minmax(0,1fr);align-items:center;display:grid}.onb-card:before,.onb-card-head,.onb-card-rows{display:none}.onb-card-photo{grid-area:1/1/span 3;width:76px;height:92px;margin-top:0}.onb-card-name,.onb-card-ar,.onb-card-role{grid-column:2;margin-top:0}.onb-card-name{font-size:19px}.onb-card-ar{min-height:0;font-size:14px}.onb-card-role{margin-top:var(--space-1-5);justify-self:start}.onb-stamps{margin-top:var(--space-4);padding-top:var(--space-3);grid-column:1/-1}}@media (width<=639px){.onb-bar{padding:var(--space-2-5) var(--space-4);gap:var(--space-3)}.onb-bar-title small,.onb-hide-sm{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.onb-grid{padding:var(--space-5) var(--space-4) var(--space-12);gap:var(--space-5)}}.onb-progress{margin-top:var(--space-4);color:var(--color-fg-secondary);justify-content:space-between;align-items:baseline;font-size:13px;display:flex}.onb-progress strong{font-family:var(--font-display);color:var(--color-fg-primary);font-size:20px}.onb-meter{margin-top:var(--space-2);background:var(--color-fill-soft);border-radius:999px;height:6px;overflow:hidden}.onb-meter>span{background:var(--color-success);transform-origin:0;width:100%;height:100%;transition:transform var(--dur-modal) var(--ease-out);display:block}[dir=rtl] .onb-meter>span{transform-origin:100%}.onb-rail{gap:var(--space-1-5);margin-bottom:var(--space-6);grid-template-columns:repeat(6,minmax(0,1fr));display:grid}.onb-rail-step{min-height:44px;padding:var(--space-2) var(--space-1) var(--space-3);text-align:start;color:var(--color-fg-muted);border-radius:var(--radius-control);transition:color var(--dur-hover) var(--ease-out);flex-direction:column;align-items:flex-start;gap:2px;display:flex;position:relative}.onb-rail-step:after{content:"";background:var(--color-line);height:3px;transition:background-color var(--dur-hover) var(--ease-out);border-radius:999px;position:absolute;inset:auto 0 0}.onb-rail-step:hover{color:var(--color-fg-primary)}.onb-rail-step:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.onb-rail-step[data-done=true]:after{background:var(--color-success)}.onb-rail-step[aria-current=step]{color:var(--color-fg-primary)}.onb-rail-step[aria-current=step]:after{background:var(--color-accent)}.onb-rail-step[data-flag=true]:after{background:var(--color-warning)}.onb-rail-no{font-family:var(--font-mono);align-items:center;gap:4px;font-size:11px;display:inline-flex}.onb-rail-label{white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:13px;font-weight:700;overflow:hidden}@media (width<=640px){.onb-rail-label{display:none}}.onb-drop{align-items:center;gap:var(--space-3);min-height:96px;padding:var(--space-3) var(--space-4);border:1.5px dashed var(--color-line-dashed);border-radius:var(--radius-card);background:var(--color-raised);color:var(--color-fg-secondary);cursor:pointer;transition:background-color var(--dur-hover) var(--ease-out), border-color var(--dur-hover) var(--ease-out);display:flex;position:relative}.onb-drop:hover,.onb-drop[data-over=true]{border-color:var(--color-line-strong);background:var(--color-fill-subtle)}.onb-drop:focus-within{outline:2px solid var(--color-focus);outline-offset:2px}.onb-drop[data-filled=true]{border-style:solid;border-color:var(--color-line)}.onb-drop[data-missing=true]{border-color:var(--color-warn-line)}.onb-drop input{opacity:0;cursor:pointer;position:absolute;inset:0}.onb-drop-thumb{border-radius:var(--radius-control);background:var(--color-fill-soft);width:72px;height:56px;color:var(--color-fg-muted);flex:none;place-items:center;display:grid;overflow:hidden}.onb-drop-thumb img{object-fit:cover;width:100%;height:100%}.onb-drop-text{flex-direction:column;gap:2px;min-width:0;display:flex}.onb-drop-text strong{color:var(--color-fg-primary);font-size:14px}.onb-drop-text span{text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.onb-photo{background:var(--color-fill-soft);border:2px dashed var(--color-line-dashed);width:120px;height:120px;color:var(--color-fg-muted);cursor:pointer;border-radius:999px;flex:none;place-items:center;display:grid;position:relative;overflow:hidden}.onb-photo[data-filled=true]{border:3px solid var(--color-raised);box-shadow:var(--elevation-raised)}.onb-photo img{object-fit:cover;width:100%;height:100%}.onb-photo input{opacity:0;cursor:pointer;position:absolute;inset:0}.onb-photo:focus-within{outline:2px solid var(--color-focus);outline-offset:3px}.onb-paper{border:1px solid var(--color-line);border-radius:var(--radius-card);background:var(--color-raised);padding:var(--space-5);gap:var(--space-4);display:grid}.onb-paper-head{align-items:center;gap:var(--space-3);display:flex}.onb-paper-head h3{font-size:15px;font-weight:700}.onb-paper-head p{color:var(--color-fg-muted);font-size:12px}.onb-paper-icon{border-radius:var(--radius-control);background:var(--color-fill-soft);width:36px;height:36px;color:var(--color-fg-secondary);flex:none;place-items:center;display:grid}.onb-two{gap:var(--space-4);display:grid}@media (width>=640px){.onb-two{grid-template-columns:1fr 1fr}}.onb-offer{border-radius:var(--radius-card);background:var(--color-surface);border:1px solid var(--color-line);padding:var(--space-5);gap:var(--space-3);display:grid}.onb-offer dl{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(160px,1fr));display:grid}.onb-offer dt{letter-spacing:.1em;text-transform:uppercase;color:var(--color-fg-hint);font-size:11px}.onb-offer dd{font-family:var(--font-display);margin-top:4px;font-size:18px}.onb-timeline{gap:0;display:grid}.onb-tl-step{gap:var(--space-3);padding-bottom:var(--space-5);grid-template-columns:28px 1fr;display:grid;position:relative}.onb-tl-step:not(:last-child):before{content:"";inset-inline-start:13px;background:var(--color-line);width:2px;position:absolute;top:28px;bottom:0}.onb-tl-step[data-state=done]:not(:last-child):before{background:var(--color-success)}.onb-tl-mark{border:2px solid var(--color-line);background:var(--color-raised);width:28px;height:28px;color:var(--color-fg-muted);border-radius:999px;place-items:center;display:grid}.onb-tl-step[data-state=done] .onb-tl-mark{border-color:var(--color-success);background:var(--color-success);color:var(--color-fg-on-accent)}.onb-tl-step[data-state=now] .onb-tl-mark{border-color:var(--color-gold);color:var(--color-gold-deep)}.onb-tl-step strong{font-size:14px;display:block}.onb-tl-step span{color:var(--color-fg-muted);font-size:13px}.onb-welcome{background:var(--color-canvas);min-height:100dvh;display:grid}@media (width>=1024px){.onb-welcome{grid-template-columns:1.05fr 1fr}.onb-welcome-hero{gap:var(--space-10);padding:var(--space-10)}}.onb-welcome-hero{justify-content:space-between;gap:var(--space-8);padding:var(--space-8) var(--space-6);background:var(--color-chrome);color:var(--color-fg-on-chrome);isolation:isolate;flex-direction:column;display:flex;position:relative;overflow:hidden}.onb-welcome-hero:after{content:"";background:repeating-radial-gradient(circle, transparent 0 22px, color-mix(in srgb, var(--color-fg-on-chrome) 6%, transparent) 22px 23px);z-index:-1;border-radius:999px;width:640px;height:640px;position:absolute;inset:auto -20% -35% auto}.onb-welcome-hero h1{color:var(--color-fg-on-chrome);font-family:var(--font-display);font-weight:var(--font-display-weight);max-width:13ch;font-size:clamp(34px,4.4vw,56px);line-height:1.04}.onb-welcome-hero h1 em{color:var(--color-gold);font-style:normal}.onb-welcome-form{padding:var(--space-10) var(--space-6);justify-content:center;align-items:center;display:flex}.onb-strength{grid-template-columns:repeat(4,1fr);gap:4px;display:grid}.onb-strength>span{background:var(--color-fill-soft);height:4px;transition:background-color var(--dur-hover) var(--ease-out);border-radius:999px}.onb-strength>span[data-on=true]{background:var(--color-success)}.onb-facts{gap:var(--space-4) var(--space-6);grid-template-columns:repeat(auto-fit,minmax(190px,1fr));display:grid}.onb-facts dt{letter-spacing:.08em;text-transform:uppercase;color:var(--color-fg-hint);font-size:11px}.onb-facts dd{overflow-wrap:anywhere;margin-top:3px;font-size:14px}.onb-facts dd[data-empty=true]{color:var(--color-fg-faint)}.onb-scans{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(150px,1fr));display:grid}.onb-scan{gap:var(--space-2);padding:var(--space-2);border:1px solid var(--color-line);border-radius:var(--radius-card);background:var(--color-raised);text-align:start;transition:border-color var(--dur-hover) var(--ease-out);flex-direction:column;display:flex}.onb-scan:hover{border-color:var(--color-line-strong)}.onb-scan:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}.onb-scan-face{aspect-ratio:4/3;border-radius:var(--radius-control);background:var(--color-fill-soft);color:var(--color-fg-muted);place-items:center;display:grid;overflow:hidden}.onb-scan-face img{object-fit:cover;width:100%;height:100%}.onb-scan strong{font-size:12px}.onb-scan span{color:var(--color-fg-muted);text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}@media (prefers-reduced-motion:reduce){.onb-save[data-state=saving] .onb-save-dot{animation:none}}
