:root {
  --ink: #252e29;
  --mut: #566058;
  --paper: #f8f8f1;
  --line: #ccd0c3;
  --lime: #d9e9ad;
  --dark: #29352e;
  --orange: #ee774a;
  --serif: Georgia, "Times New Roman", serif;
  --mono: ui-monospace, SFMono-Regular, Consolas, monospace;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font:
    16px/1.5 -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;
}
button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}
button,
a {
  touch-action: manipulation;
}
button,
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  cursor: pointer;
  border: 1px solid #adb5a9;
  border-radius: 5px;
  background: transparent;
  text-decoration: none;
  padding: 0.64rem 1rem;
  font-weight: 650;
  font-size: 0.92rem;
  color: var(--ink);
}
button:hover,
.btn:hover {
  background: #e9eddd;
}
button:disabled {
  opacity: 0.55;
  cursor: wait;
}
button.primary,
.btn.primary {
  background: var(--dark);
  color: #fff;
  border-color: var(--dark);
}
button.primary:hover,
.btn.primary:hover {
  background: #405443;
}
a {
  color: inherit;
  text-underline-offset: 3px;
}
button.bare {
  border: 0;
  text-decoration: underline;
  padding: 0.45rem 0.2rem;
}
header,
footer,
main {
  max-width: 1490px;
  margin: auto;
  padding-left: clamp(18px, 5vw, 80px);
  padding-right: clamp(18px, 5vw, 80px);
}
header {
  height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
  gap: 18px;
}
.logo {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 21px;
  letter-spacing: -1px;
  font-weight: 750;
  text-decoration: none;
}
.logo img {
  width: 32px;
}
.logo span,
nav,
.label,
.tag,
.cap {
  font: 650 11px/1.45 var(--mono);
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
.logo span {
  color: var(--mut);
  margin-left: 3px;
}
nav {
  display: flex;
  gap: 18px;
  align-items: center;
}
nav a {
  text-decoration: none;
}
nav button {
  font-size: 0.72rem;
}
.hero {
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  gap: 7vw;
  align-items: center;
  padding: clamp(40px, 6vw, 95px) 0;
}
.hero h1,
.intro h1,
.portfolio h1 {
  font: normal clamp(50px, 6.65vw, 108px) / 0.98 var(--serif);
  letter-spacing: -0.068em;
  margin: 0.32em 0;
}
.hero h1 em,
.portfolio h1 em {
  color: #586950;
  font-weight: normal;
}
.hero p,
.intro p,
.phead p {
  font-size: clamp(17px, 1.4vw, 21px);
  max-width: 565px;
  color: var(--mut);
}
.actions,
.row {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}
.hero .actions {
  margin-top: 25px;
}
.label {
  color: #52654d;
}
.proof {
  position: relative;
  border: 1px solid #bac6af;
  border-radius: 8px;
  background: #e1e8d8;
  padding: 24px;
  transform: rotate(1deg);
  box-shadow: 9px 10px 0 #c7d1bc;
}
.proof .sample {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 14px;
  margin-top: 18px;
}
.paper {
  background: #fcfcf2;
  border: 1px solid #c1c5b6;
  padding: 15px;
  border-radius: 3px;
}
.paper p {
  font: 17px/1.35 var(--serif);
  color: var(--ink);
  margin-top: 5px;
}
.proof img {
  width: 100%;
  display: block;
  border-radius: 2px;
}
.proof .metric {
  font: normal clamp(30px, 4vw, 53px) / 1 var(--serif);
  letter-spacing: -3px;
  margin: 6px 0;
}
.proofcol {
  display: grid;
  gap: 12px;
  align-content: space-between;
}
.dots {
  border-bottom: 1px solid var(--line);
  padding-bottom: 10px;
}
.band {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--ink);
  padding: 24px 0 48px;
  gap: 24px;
}
.band p {
  margin: 0.45em 0;
  color: var(--mut);
  max-width: 340px;
}
.band h3 {
  font: normal 25px var(--serif);
  margin: 0.3em 0;
}
footer {
  display: flex;
  justify-content: space-between;
  border-top: 1px solid var(--line);
  font: 11px var(--mono);
  color: var(--mut);
  padding-top: 22px;
  padding-bottom: 30px;
  margin-top: 32px;
  gap: 20px;
}
.intro,
.phead {
  padding: 55px 0 25px;
}
.intro h1,
.portfolio h1 {
  font-size: clamp(43px, 5.4vw, 83px);
}
h2 {
  font: normal clamp(28px, 3.2vw, 46px) / 1.13 var(--serif);
  letter-spacing: -0.044em;
  margin: 0.45em 0;
}
h3 {
  font-size: 18px;
  margin: 0 0 5px;
}
.bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  border-top: 1px solid var(--ink);
  padding: 20px 0;
}
.empty,
.panel {
  padding: 24px;
  background: #f0f2e7;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.empty {
  text-align: center;
  padding: 48px 18px;
}
.empty p,
.sub {
  color: var(--mut);
}
.sub {
  font-size: 14px;
}
.library {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(295px, 100%), 1fr));
  gap: 17px;
}
.casecard {
  border: 1px solid var(--line);
  border-radius: 7px;
  overflow: hidden;
  background: #fffef8;
  display: flex;
  flex-direction: column;
}
.thumb {
  display: grid;
  place-items: center;
  min-height: 94px;
  height: 150px;
  background: repeating-linear-gradient(
    135deg,
    #e2e8d8,
    #e2e8d8 9px,
    #e8ecdf 9px,
    #e8ecdf 18px
  );
  font: italic 34px var(--serif);
  color: #495b49;
  overflow: hidden;
}
.thumb img,
.thumb video {
  height: 100%;
  width: 100%;
  object-fit: contain;
  background: #26302a;
}
.cardtext {
  padding: 17px;
  display: grid;
  gap: 8px;
}
.tag {
  display: inline-block;
  background: #e7ebdf;
  color: #42523e;
  padding: 3px 7px;
  border-radius: 3px;
  letter-spacing: 0.5px;
}
.space {
  margin: 36px 0;
}
.linkrow,
.filelist {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  overflow-wrap: anywhere;
}
.linkrow > div {
  min-width: 0;
}
.portfolio .phead {
  border-bottom: 2px solid var(--ink);
}
.portfolio h1 {
  max-width: 950px;
}
.byline {
  margin: 20px 0 0;
  font-weight: 650;
}
.caseview {
  margin: 30px 0 50px;
  scroll-margin: 20px;
}
.casegrid {
  display: grid;
  grid-template-columns: repeat(var(--n, 3), minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}
.cols1 {
  --n: 1;
}
.cols2 {
  --n: 2;
}
.lane {
  border-top: 3px solid #9cae90;
  background: #eeefe6;
  padding: 16px;
  min-width: 0;
  border-radius: 2px;
}
.lane.ad {
  background: #e7eae2;
  border-color: #536c58;
}
.lane.result {
  background: #e8eede;
  border-color: #a3b776;
}
.lane p {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.lane img,
.lane video,
.lane iframe {
  max-width: 100%;
  width: 100%;
  max-height: 460px;
  object-fit: contain;
  border: 0;
  display: block;
  margin: 10px auto;
  border-radius: 4px;
}
.lane iframe {
  height: 260px;
  background: white;
}
.lane figure {
  margin: 14px 0;
}
.lane figcaption {
  font: 11px/1.5 var(--mono);
  overflow-wrap: anywhere;
  margin-top: 4px;
}
.lane a {
  overflow-wrap: anywhere;
}
.index {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin: 24px 0;
}
.index a {
  background: #e6ebdc;
  border-radius: 3px;
  padding: 6px 10px;
  font-size: 14px;
}
.lane .cap {
  color: #465640;
}
.number {
  font: normal clamp(33px, 4vw, 58px) / 1.1 var(--serif);
  letter-spacing: -3px;
}
.panel label,
label.field {
  display: grid;
  gap: 4px;
  font-size: 14px;
  font-weight: 650;
  margin: 10px 0;
}
.field input,
.field textarea,
.field select,
input.text {
  padding: 10px;
  width: 100%;
  border: 1px solid #aeb6a8;
  border-radius: 4px;
  background: #fffef8;
  min-height: 44px;
}
.field textarea {
  min-height: 78px;
  resize: vertical;
}
.field small {
  font-weight: 400;
  color: var(--mut);
}
dialog {
  width: min(720px, calc(100vw - 24px));
  max-height: 90dvh;
  overflow: auto;
  padding: clamp(20px, 3vw, 37px);
  background: var(--paper);
  border: 1px solid #7b8979;
  border-radius: 8px;
  color: var(--ink);
}
dialog::backdrop {
  background: #18251ed4;
}
.dhead {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}
.dhead button {
  padding: 5px 10px;
}
.dhead h2 {
  font-size: 34px;
  margin-top: 2px;
}
.editlane {
  border-top: 1px solid var(--line);
  padding: 14px 0;
}
.editlane .label {
  display: block;
}
.mini {
  font-size: 0.81rem;
  padding: 0.45rem 0.65rem;
}
.smallrow {
  gap: 7px;
}
.checkline {
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 8px 0;
}
.checkline input {
  width: 19px;
  height: 19px;
}
details {
  margin: 12px 0;
}
summary {
  cursor: pointer;
  font-weight: 650;
}
input[type="file"] {
  max-width: 100%;
  font-size: 14px;
}
.err,
#notice:not(:empty) {
  background: #26382d;
  color: #fff;
  border-radius: 6px;
  padding: 12px 16px;
}
.err:empty {
  display: none;
}
#notice {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  max-width: 92vw;
  font-size: 14px;
  pointer-events: none;
}
.skip {
  position: absolute;
  top: -100px;
}
.skip:focus {
  top: 5px;
  background: white;
  z-index: 10;
}
:focus-visible {
  outline: 3px solid #6b7c3e;
  outline-offset: 3px;
}
.loading {
  padding: 60px 0;
}
.key {
  overflow-wrap: anywhere;
  padding: 12px;
  background: #e3ebd8;
  display: block;
}
.sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
}
.providerlist {
  max-height: 48vh;
  overflow: auto;
}
.txtlink {
  color: var(--mut);
  font: 12px var(--mono);
}
@media (max-width: 800px) {
  .hero {
    gap: 28px;
    grid-template-columns: 1fr 1fr;
  }
  .casegrid {
    grid-template-columns: 1fr;
  }
  .proof {
    padding: 12px;
  }
  .proof .sample {
    gap: 7px;
  }
  .paper {
    padding: 10px;
  }
  .paper p {
    font-size: 15px;
  }
}
@media (max-width: 650px) {
  header {
    height: 63px;
  }
  .logo {
    font-size: 18px;
  }
  .logo span {
    display: none;
  }
  nav {
    font-size: 10px;
    gap: 10px;
  }
  .hero {
    grid-template-columns: 1fr;
    padding: 34px 0 38px;
  }
  .hero h1 {
    font-size: 57px;
  }
  .hero .actions {
    margin-top: 17px;
  }
  .proof {
    max-width: 425px;
    margin: 0 auto;
    width: 94%;
  }
  .proof .sample {
    grid-template-columns: 1fr 1.15fr;
  }
  .proof .sample img {
    max-height: 245px;
    object-fit: cover;
  }
  .band {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .band article {
    border-bottom: 1px solid var(--line);
    padding-bottom: 11px;
  }
  .intro,
  .phead {
    padding-top: 32px;
  }
  .bar {
    align-items: start;
  }
  .linkrow {
    align-items: start;
    flex-direction: column;
  }
  footer {
    font-size: 10px;
  }
  .lane img,
  .lane video {
    max-height: 420px;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
.proof {
  text-decoration: none;
}
.dhead button {
  flex-shrink: 0;
}
nav .btn {
  text-transform: none;
}

/* Direct-to-site intake */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.drop-page {
  max-width: 820px;
  margin: 0 auto;
  padding: 48px 0 28px;
}
.drop-heading {
  text-align: center;
  margin: 0 0 30px;
}
.drop-heading h1 {
  font: normal clamp(42px, 5.6vw, 76px) / 0.99 var(--serif);
  letter-spacing: -0.055em;
  margin: 16px 0;
}
.drop-heading h1 em {
  color: #a8442d;
}
.drop-heading p {
  font-size: 17px;
  color: var(--mut);
  margin: 18px 0;
}
.drop-composer {
  background: #fffefa;
  border: 1px solid #bfc3b5;
  border-radius: 14px;
  padding: clamp(18px, 3.5vw, 34px);
  box-shadow: 0 6px 28px #24301e09;
}
.drop-composer > label {
  display: block;
  font-weight: 650;
  font-size: 15px;
  margin: 0 0 8px;
}
.drop-composer > label span {
  color: var(--mut);
  font-weight: 400;
  margin-left: 6px;
  font-size: 13px;
}
.drop-composer > textarea {
  width: 100%;
  resize: vertical;
  border: 1px solid var(--line);
  border-radius: 7px;
  padding: 13px 15px;
  background: #fafbf5;
  min-height: 80px;
  margin-bottom: 19px;
  line-height: 1.5;
}
.drop-zone {
  border: 1px dashed #98a18c;
  border-radius: 7px;
  text-align: center;
  padding: 20px 12px 15px;
  background: #f3f5eb;
  transition: background 0.15s;
}
.drop-zone.dragging {
  background: #d9e9ad;
  border-color: #35432a;
}
.drop-file-label {
  display: flex;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
  gap: 4px;
}
.drop-file-label span:not(.drop-plus) {
  font-size: 14px;
  color: var(--mut);
}
.drop-plus {
  font: 34px/1 var(--serif);
}
.drop-cloud {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin: 17px 0 10px;
}
.drop-zone > small {
  color: var(--mut);
  font-size: 11px;
}
.drop-submit {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 24px;
}
.drop-submit .primary {
  font-size: 17px;
  padding: 12px 23px;
  border-radius: 7px;
}
.drop-disclosure {
  font-size: 12px;
  color: var(--mut);
  margin: 12px 0 0;
  max-width: 580px;
}
#drop-status {
  font-size: 14px;
  margin: 12px 0 0;
}
.drop-file {
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--line);
  padding: 12px 0;
  font-size: 14px;
}
.drop-file > div {
  flex: 1;
  min-width: 0;
}
.drop-file b {
  display: block;
  overflow-wrap: anywhere;
  font-weight: 550;
}
.drop-file small {
  color: var(--mut);
}
.drop-error {
  color: #9a342b;
  font-size: 13px;
  padding: 8px 0;
}
.drop-after {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: center;
  margin: 18px 0;
  font-size: 14px;
  flex-wrap: wrap;
}
.quick-toolbar {
  position: sticky;
  top: 0;
  z-index: 5;
  background: #f8f8f1f5;
  backdrop-filter: blur(16px);
  padding: 14px 0;
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--line);
}
.quick-toolbar .actions {
  gap: 8px;
}
.quick-edit {
  padding: 14px 0;
}
.quick-edit summary {
  cursor: pointer;
  font-weight: 650;
}
.quick-edit textarea {
  display: block;
  width: 100%;
  max-width: 850px;
  min-height: 75px;
  margin: 12px 0;
  padding: 12px;
  background: #fffefa;
  border: 1px solid var(--line);
  border-radius: 5px;
}
.quick-edit .sub {
  font-size: 12px;
}
.quick-status {
  padding: 8px 0;
  font-size: 13px;
  color: var(--mut);
}
@media (max-width: 600px) {
  .drop-page {
    padding-top: 30px;
  }
  .drop-heading p {
    font-size: 15px;
  }
  .drop-submit {
    flex-direction: column;
    align-items: stretch;
  }
  .drop-submit .sub:empty {
    display: none;
  }
  .quick-toolbar {
    position: static;
  }
  .quick-toolbar button {
    padding: 8px 10px;
    font-size: 12px;
  }
}
@media (min-width: 800px) {
  .drop-page {
    padding-top: 24px;
  }
  .drop-heading {
    margin-bottom: 24px;
  }
  .drop-heading h1 {
    font-size: 62px;
    margin: 10px 0;
  }
  .drop-heading p {
    margin: 12px 0;
    font-size: 16px;
  }
  .drop-composer {
    padding: 24px 30px;
  }
  .drop-composer > textarea {
    min-height: 64px;
    margin-bottom: 15px;
    padding: 10px 12px;
  }
  .drop-zone {
    padding: 12px 10px;
  }
  .drop-cloud {
    margin: 10px 0 7px;
  }
  .drop-plus {
    font-size: 25px;
  }
  .drop-submit {
    margin-top: 18px;
  }
}
.drop-zone:focus-within {
  outline: 2px solid #657d49;
  outline-offset: 3px;
}
.quick-status:empty {
  display: none;
}

/* A visual, persistent upload queue: the content is visible before it is saved. */
.drop-files {display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin:24px 0}
.drop-card {min-width:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.drop-thumbnail {height:210px;background:#eeede8;display:grid;place-items:center;overflow:hidden}
.drop-thumbnail img,.drop-thumbnail video,.drop-thumbnail iframe {display:block;width:100%;height:100%;object-fit:contain;border:0}
.drop-thumbnail iframe {pointer-events:none}
.drop-card-info {padding:12px;display:grid;gap:7px}
.drop-card-info>b {font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.drop-card-info small {font-size:12px;color:var(--mut)}
.drop-card-info>div {display:flex;justify-content:space-between}
.drop-card .bare {padding:4px;font-size:12px}
.drop-document {padding:20px;display:grid;gap:18px;font-size:13px;overflow-wrap:anywhere}
.drop-document>span {font:bold 28px Georgia;color:#81735d}
.drop-error {grid-column:1/-1;padding:14px;border:1px solid #b56042;background:#fff6ef}
.drop-full-preview :is(img,video,iframe) {display:block;width:100%;max-height:75vh;object-fit:contain;border:0}
.drop-full-preview iframe {height:70vh}
.drop-full-preview pre {white-space:pre-wrap;max-height:70vh;overflow:auto;font-size:14px}
.drop-source {padding:12px 15px;border-left:3px solid #7a9270;background:#f2f4ee;margin:10px 0;display:grid;gap:4px;font-size:13px;overflow-wrap:anywhere}
.drop-source small {font-weight:600}
.drop-source p {margin:3px 0;line-height:1.5}
.source-unread {border-color:#ac7a37;background:#fbf5e9}
@media(max-width:480px){.drop-files{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.drop-thumbnail{height:165px}.drop-card-info{padding:9px}}
.cloud-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;max-height:55vh;overflow:auto;padding:5px}
.cloud-gallery .filelist{grid-column:1/-1}
.cloud-card{position:relative;display:grid;gap:9px;border:1px solid var(--line);border-radius:7px;overflow:hidden;padding:10px;font-size:13px;cursor:pointer;overflow-wrap:anywhere}
.cloud-card:has(:checked){border-color:var(--ink);background:#e9efdf}
.cloud-card input{position:absolute;top:12px;left:12px;z-index:1;width:20px;height:20px}
.cloud-card img,.cloud-type{width:100%;height:140px;object-fit:contain;background:#eee;display:grid;place-items:center}
.cloud-import-preview img{display:block;max-height:300px;max-width:100%;margin:auto;object-fit:contain}
.drop-thumbnail {display:block}
.drop-thumbnail :is(img,video,iframe) {height:210px;max-height:210px;min-height:0;object-fit:contain}
.drop-path {font-size:10px!important;opacity:.8;overflow-wrap:anywhere}
@media(max-width:480px){.drop-thumbnail :is(img,video,iframe){height:165px;max-height:165px}}
.code-workspace{width:100%;max-width:1480px;margin:auto}.code-page{display:block;width:100%;border:1px solid #d6d8d0;min-height:650px;background:#fff;border-radius:4px}.code-progress{padding:12px 0;font-size:14px;line-height:1.5}.code-progress.is-building::before{content:"";display:inline-block;width:10px;height:10px;margin-right:10px;border-radius:50%;background:#45674d;animation:code-pulse 1.6s infinite}.code-building{padding:70px 30px;min-height:340px;background:#efeee6}.code-building h1{font-size:clamp(38px,7vw,72px);max-width:650px}.code-workspace pre{white-space:pre-wrap;overflow-wrap:anywhere}.code-workspace textarea{width:100%;min-height:100px}.code-workspace .quick-toolbar{flex-wrap:wrap}@keyframes code-pulse{50%{opacity:.25}}@media(prefers-reduced-motion:reduce){.code-progress.is-building::before{animation:none}}
.code-page{contain:layout style paint;position:relative;isolation:isolate}

/* TCSA family branding: framed wordmark and clear, compact product name. */
.logo{gap:12px;color:#191919;letter-spacing:-.6px;flex-shrink:0}
.logo img{width:60px;height:45px;flex:none;object-fit:contain}
.logo .brand-name{font:750 20px/1.05 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:-.65px}
.platform-footer{align-items:center;flex-wrap:wrap;font:12px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:0}
.platform-footer .credit-heart{color:#ff5532}
@media(max-width:650px){body>header{height:auto;min-height:78px;flex-wrap:wrap;padding-top:13px;padding-bottom:13px;gap:12px}.logo img{width:48px;height:36px}.logo .brand-name{font-size:16px}.logo{gap:9px}body>header nav{margin-left:auto;flex-wrap:wrap}body>header:has(nav button) nav{width:100%;justify-content:flex-end}.platform-footer{align-items:flex-start;gap:12px}.platform-footer>a:first-child{width:100%}}

.portfolio-url-field{display:flex;flex-wrap:wrap;gap:8px;align-items:center;border:1px solid var(--line);padding:12px;border-radius:5px;background:var(--paper)}
.portfolio-url-field>span{font-size:12px;overflow-wrap:anywhere;color:var(--mut)}
.portfolio-url-field input{flex:1 1 190px;min-width:0;width:auto;background:white;margin:0;padding:10px;border:1px solid var(--line)}
#portfolio-url-status{font-size:14px;overflow-wrap:anywhere;min-height:1.6em}