/* The existing layout and styles are the baseline. Only clarity is changed. */
.clarity{--bg:#eef3f4;--surface:#fff;--ink:#22383e;--muted:#596d74;--line:#ced9dc;--pale:#e6f1ed}
.clarity body{font-size:14px}
.clarity .sidebar,.clarity .topbar{border-color:#ced9dc}
.clarity .nav-item{font-size:15px;color:#496069;font-weight:500}
.clarity .nav-item.active{color:#173d42;background:#dfede7;font-weight:650}
.clarity .nav-item:hover{background:#edf3f0;color:#173d42}
.clarity .icon{stroke-width:1.8}
.clarity .side-section{font-size:12px;color:#60747c;letter-spacing:.4px}
.clarity .brand small,.clarity .brand-foot{color:#657d82}
.clarity .breadcrumb,.clarity .global-search{font-size:13px;color:#596f77}
.clarity .top-asset>span{font-size:11px;color:#596f77}
.clarity .top-asset b{color:#21464c;font-weight:600}
.clarity .top-asset.eggs b{color:#81642d}
.clarity .top-avatar{color:#38554e;border-color:#bacdc5;background:#eef3ef}
.clarity .home-welcome p,.clarity .page-heading p{font-size:13px;color:#596d74}
.clarity .home-hero{border-color:#c4d8d7;background:linear-gradient(110deg,#e9f2ed 0%,#edf4f2 42%,#e0eff3 100%)}
.clarity .hero-content p{font-size:13px;color:#526f67}
.clarity .hero-content .eyebrow{color:#397f7a}
.clarity .hero-content .quiet{color:#4b756b;font-size:12px}
.clarity .hero-coordinate{color:#61868a}
.clarity .quick-card,.clarity .panel{border-color:#cbd7db;box-shadow:0 2px 5px #233e4405,0 8px 24px #233e4403}
.clarity .quick-card:hover{border-color:#8fb2ad;box-shadow:0 5px 18px #284e4910}
.clarity .quick-card h3{font-size:15px;font-weight:600}
.clarity .quick-card p{font-size:13px;color:#596d74;line-height:1.65}
.clarity .quick-card>.icon{color:#6c858d}
.clarity .section-head h2{font-size:16px}
.clarity .btn{border-color:#bdcdd0;font-size:13px}
.clarity .btn.dark{border-color:var(--dark)}
.clarity .btn:hover{border-color:#86a9a4}
.clarity .btn.dark:hover{border-color:#245459}
.clarity input,.clarity select,.clarity textarea{font-size:14px;background:#fff;border:1px solid #809598;line-height:1.65;color:#22383e;caret-color:#247d7b;box-shadow:0 1px 2px #213b4203}
.clarity input:hover,.clarity select:hover,.clarity textarea:hover{border-color:#557d80}
.clarity input:focus,.clarity select:focus,.clarity textarea:focus{outline:none;border-color:#247d7b;box-shadow:0 0 0 3px #247d7b18}
.clarity input::placeholder,.clarity textarea::placeholder{color:#647b83;opacity:1}
.clarity .form-stack>label,.clarity .live-studio label{font-size:13px;color:#3d565e;font-weight:600}
.clarity .form-note,.clarity .tiny{font-size:12px;color:#596d74}
.clarity .side-help p{font-size:12px;color:#60766d}
.clarity .side-help{background:#f2f7f4;border-color:#cadbd1}
.clarity .pill{font-size:12px;font-weight:500}
.clarity .pill.green{color:#256147;background:#e7f1e9}
.clarity .pill.amber{color:#76561e;background:#f7efdf}


.clarity .form-note,.clarity .notice{line-height:1.7}
.clarity th{color:#506871;font-size:12px}.clarity td{font-size:13px}.clarity td small{font-size:12px;color:#596d74}
.clarity .table-foot,.clarity .pagination{font-size:12px;color:#596d74}
.clarity .text-link,.clarity .tab{font-size:13px}
.clarity .panel-title h2,.clarity .tracker-heading h2{color:#22383e}
.clarity .tracker-summary,.clarity .tracker-card small{color:#596d74}
.workspace-loader{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;padding:24px;min-height:184px;max-width:100%;color:#49666d;font-size:13px;line-height:1.6}
#route-content[aria-busy="true"]:has(> .workspace-loader){opacity:1}
.workspace-loader-startup{min-height:65vh}
.tide-loading-sea{position:relative;display:block;width:240px;height:80px;max-width:100%;overflow:hidden;isolation:isolate;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.tide-loading-glow{position:absolute;inset:18% 10% 0;border-radius:50%;background:radial-gradient(ellipse,#88c7ba46,transparent 68%);animation:tide-breathe 3s ease-in-out infinite}
.tide-loading-sea svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.tide-loading-wave{stroke:#398f88;stroke-width:1.3;animation:tide-current 2.8s linear infinite}
.tide-loading-wave path:nth-child(2){stroke:#a58f70;stroke-dasharray:1 5;stroke-linecap:round;opacity:.7}
.tide-loading-wave path:nth-child(3){stroke:#9b96bd;opacity:.55}
.tide-loading-sea i{position:absolute;left:var(--x);top:var(--y);width:3px;height:3px;border-radius:50%;background:#3c8f86;opacity:.5;animation:tide-particle 2.8s ease-in-out var(--delay) infinite}
.tide-loading-sea i:nth-of-type(3n){background:#ad936a;width:2px;height:2px}.tide-loading-sea i:nth-of-type(4n){background:#9694b9}
.tide-loading-horizon{position:absolute;left:15%;right:15%;bottom:5px;height:1px;background:linear-gradient(90deg,transparent,#9cbeb6,transparent);opacity:.5}
.tide-loading-copy{display:flex;flex-direction:column;text-align:center;gap:4px}.tide-loading-copy strong{font-weight:500;color:#365951;font-size:13px}.tide-loading-copy small{font-size:11px;color:#647c78;letter-spacing:1px}
@keyframes tide-current{to{transform:translateX(-240px)}}
@keyframes tide-particle{0%,100%{transform:translate(0,8px);opacity:.18}45%{transform:translate(7px,-7px);opacity:.85}70%{transform:translate(11px,-2px);opacity:.5}}
@keyframes tide-breathe{50%{opacity:.45;transform:scaleX(.85)}}
.entrance-open{overflow:hidden}.entrance:not([hidden]){animation:entrance-reveal .48s ease-out both;transition:opacity .24s ease}
.entrance:not([hidden]) .entrance-copy{animation:entrance-copy-in .65s cubic-bezier(.2,.7,.2,1) both}
.entrance-copy p{color:#607e78}.skip-intro{color:#52766e}.entrance-bottom{color:#607e78}
.entrance.travelling .entrance-copy{animation:none;opacity:0;transform:translateY(-18px) scale(1.04)}
.entrance.travelling canvas{transform:scale(1.22);transition:transform .9s cubic-bezier(.3,.1,.6,1)}
.entrance.departing{animation:none;opacity:0}.workspace-arrived{animation:workspace-arrive .4s ease-out}
@keyframes entrance-reveal{from{opacity:0}to{opacity:1}}
@keyframes entrance-copy-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes workspace-arrive{from{opacity:.35;translate:0 7px}to{opacity:1;translate:0 0}}
.image-config-status{margin-bottom:16px;border-bottom:1px solid #d8e3df;padding-bottom:12px}.image-config-status[hidden]{display:none}
.image-config-status .workspace-loader{flex-direction:row;gap:14px;min-height:64px;padding:0;justify-content:flex-start}
.image-config-status .tide-loading-sea{width:112px;height:48px;flex-shrink:0}.image-config-status .tide-loading-copy{text-align:left}
.image-config-status .tide-loading-copy small{letter-spacing:0;font-size:11px}.image-config-status .error-message{margin-bottom:10px}
form[data-awaiting-config] button[type=submit]{opacity:.5;cursor:wait}
@media(prefers-reduced-motion:reduce){.tide-loading-wave,.tide-loading-sea i,.tide-loading-glow{animation:none}.entrance:not([hidden]),.entrance:not([hidden]) .entrance-copy,.workspace-arrived{animation:none;transition:none}.entrance.travelling canvas{transform:none}}
@media(max-width:960px) and (min-width:721px){.clarity .side-section{font-size:0}}
@media(max-width:720px){.clarity .side-section{font-size:12px}.clarity .quick-card p{font-size:12px}.clarity .quick-card h3{font-size:14px}.clarity input,.clarity select,.clarity textarea{font-size:16px}.clarity .top-asset>span{font-size:10px}.clarity .wallet-actions .btn{font-size:11px}.clarity .btn{min-height:38px}.clarity .form-note{font-size:12px}}