/* Laravel-only additions to the template CSS: flash messages, form errors, sign-in screens, footer legal row. */
.form__thanks, .form__error { padding: .8rem 1rem; border: 1px solid var(--line); font-size: .95rem; }
.form__thanks { color: var(--accent); }
.form__error { color: #F2B3A8; border-color: #F2B3A8; list-style: none; margin: 0; }
.form__note { font-size: .85rem; color: var(--muted); }
.form__note a { text-decoration: underline; text-underline-offset: 3px; }
.works__group { margin: 3rem 0 1.2rem; }
.works__group:first-of-type { margin-top: 2rem; }
.auth { max-width: 460px; margin: 0 auto; padding: clamp(5rem, 14vh, 8rem) 16px 4rem; }
.auth .brand { display: inline-block; margin-bottom: 2rem; }
.auth .form { margin-top: 1.5rem; }
.pw { position: relative; }
.field .pw input { padding-right: 3rem; }
.pw__btn { position: absolute; right: 0; top: 0; bottom: 0; width: 3rem; display: grid; place-items: center; background: none; border: 0; color: var(--muted); cursor: pointer; }
.pw__btn:hover, .pw__btn:focus-visible { color: var(--text); }
.pw__off, .pw__btn[aria-pressed="true"] .pw__on { display: none; }
.pw__btn[aria-pressed="true"] .pw__off { display: block; }
.auth__note { margin: 0 0 1.2rem; font-size: .92rem; color: var(--muted); }
.auth__links { display: grid; gap: .6rem; margin-top: 1.5rem; font-size: .92rem; color: var(--muted); }
.auth__links a { text-decoration: underline; text-underline-offset: 3px; }
.field--check { display: flex; align-items: center; gap: .6rem; }
.field--check input { width: auto; }
.btn--text { background: none; border: 0; padding: 0; color: var(--muted); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; font: inherit; }
.site-footer__base { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 2rem; }
.footer-list--inline { display: flex; flex-wrap: wrap; gap: .4rem 1.6rem; }
.crumbs { margin-bottom: 1.4rem; }
.crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; margin: 0; padding: 0; list-style: none; font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.crumbs li + li::before { content: "/"; margin-right: .6rem; color: var(--accent); }
.crumbs a:hover { color: var(--accent); }
.crumbs [aria-current] { color: var(--text); display: inline-block; max-width: 60vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }

/* The home strip can carry the studio's own messages and links (an offer, a launch). Those get a hover style and pause
   while someone points at them or tabs into them. The strip of project names is the template's and is left alone. */
.marquee--notices .marquee__track a { color: inherit; text-decoration: none; }
.marquee--notices .marquee__track a:hover, .marquee--notices .marquee__track a:focus-visible { text-decoration: underline; text-underline-offset: .22em; }
.marquee--notices:hover .marquee__track, .marquee--notices:focus-within .marquee__track { animation-play-state: paused; }