Standalone per-card browser model/security/view modules for HUX-01..10 plus node+pytest suites that read the hux.v1 contract schemas directly. Reconciled drift found on integration: the activity model now accepts all 32 hux.event.v1 kinds (delegation.*, memory.suppressed, memory.retrieval_removed, budget.exhausted, side_effect.*), the autonomy model carries the external_side_effect capability, and the foundation boundary test now asserts the shipped static HUX surface exists on disk and that images never bake activated HUX_FLAGS. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01BvMSXH8VH2tMWXanb8SJdf
148 lines
2.5 KiB
CSS
148 lines
2.5 KiB
CSS
.hux-multimodal {
|
|
--mm-border: color-mix(in srgb, currentColor 16%, transparent);
|
|
display: grid;
|
|
gap: 1rem;
|
|
min-width: 0;
|
|
}
|
|
|
|
.hux-multimodal > header,
|
|
.hux-mm-capture,
|
|
.hux-mm-workspace,
|
|
.hux-mm-editor {
|
|
display: flex;
|
|
gap: .75rem;
|
|
}
|
|
|
|
.hux-multimodal > header {
|
|
align-items: start;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.hux-multimodal h2,
|
|
.hux-multimodal h3,
|
|
.hux-multimodal p {
|
|
margin-block: .2rem;
|
|
}
|
|
|
|
.hux-mm-kicker {
|
|
font-size: .72rem;
|
|
letter-spacing: .14em;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.hux-mm-upload {
|
|
border: 1px dashed var(--mm-border);
|
|
border-radius: .8rem;
|
|
padding: 1.25rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.hux-mm-workspace {
|
|
align-items: stretch;
|
|
min-height: 24rem;
|
|
}
|
|
|
|
.hux-mm-workspace > nav,
|
|
.hux-mm-workspace > aside {
|
|
flex: 0 0 min(18rem, 25%);
|
|
}
|
|
|
|
.hux-mm-workspace > main {
|
|
border-inline: 1px solid var(--mm-border);
|
|
flex: 1;
|
|
min-width: 0;
|
|
padding-inline: 1rem;
|
|
}
|
|
|
|
.hux-mm-workspace ul,
|
|
.hux-mm-workspace ol {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.hux-mm-workspace nav button {
|
|
align-items: center;
|
|
display: flex;
|
|
gap: .5rem;
|
|
overflow-wrap: anywhere;
|
|
width: 100%;
|
|
}
|
|
|
|
.hux-mm-workspace button[aria-current="page"] {
|
|
outline: 2px solid currentColor;
|
|
outline-offset: -2px;
|
|
}
|
|
|
|
.hux-mm-image img {
|
|
display: block;
|
|
height: auto;
|
|
max-height: 28rem;
|
|
max-width: 100%;
|
|
object-fit: contain;
|
|
}
|
|
|
|
.hux-mm-safe-preview {
|
|
align-items: center;
|
|
border: 1px solid var(--mm-border);
|
|
border-radius: .6rem;
|
|
display: grid;
|
|
gap: .35rem;
|
|
justify-items: center;
|
|
min-height: 12rem;
|
|
padding: 1rem;
|
|
text-align: center;
|
|
}
|
|
|
|
.hux-mm-editor,
|
|
.hux-mm-transcript {
|
|
flex-direction: column;
|
|
margin-top: 1rem;
|
|
}
|
|
|
|
.hux-mm-editor textarea,
|
|
.hux-mm-transcript textarea {
|
|
min-height: 6rem;
|
|
resize: vertical;
|
|
}
|
|
|
|
.hux-mm-error,
|
|
.hux-mm-warning {
|
|
border-inline-start: .25rem solid currentColor;
|
|
padding: .65rem .85rem;
|
|
}
|
|
|
|
.hux-mm-workspace aside li {
|
|
border-bottom: 1px solid var(--mm-border);
|
|
display: grid;
|
|
padding-block: .5rem;
|
|
}
|
|
|
|
@media (max-width: 62rem) {
|
|
.hux-mm-workspace,
|
|
.hux-multimodal > header {
|
|
flex-direction: column;
|
|
}
|
|
|
|
.hux-mm-workspace > nav,
|
|
.hux-mm-workspace > aside {
|
|
flex-basis: auto;
|
|
}
|
|
|
|
.hux-mm-workspace > main {
|
|
border-block: 1px solid var(--mm-border);
|
|
border-inline: 0;
|
|
padding-block: 1rem;
|
|
padding-inline: 0;
|
|
}
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.hux-multimodal *,
|
|
.hux-multimodal *::before,
|
|
.hux-multimodal *::after {
|
|
scroll-behavior: auto !important;
|
|
transition-duration: .01ms !important;
|
|
}
|
|
}
|