/* M01 「새로 만들기」 모달 — 접두 m01w__ */ .m01w__backdrop { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; background: rgb(0 0 0 / 45%); } .m01w { display: flex; flex-direction: column; gap: var(--spacing-8); width: min(960px, 96vw); max-height: 92vh; padding: var(--spacing-12); box-sizing: border-box; border-radius: var(--radius-cards); background: var(--color-surface); color: var(--color-text-body); font-size: var(--text-body-sm); } .m01w__top, .m01w__nav, .m01w__inline { display: flex; align-items: center; gap: var(--spacing-8); flex-wrap: wrap; } .m01w__top h2 { margin: 0 auto 0 0; font-size: 18px; color: var(--color-text); } .m01w__nav { justify-content: flex-end; } .m01w__main { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: var(--spacing-12); min-height: 0; overflow: hidden; } .m01w__body, .m01w__preview { min-height: 0; overflow: auto; } .m01w__preview { padding: var(--spacing-8); border-left: 1px solid var(--color-border); } .m01w__page, .m01w__stack, .m01w__found { display: flex; flex-direction: column; gap: var(--spacing-8); } .m01w__page h3, .m01w__page h4, .m01w__preview h4 { margin: 0; color: var(--color-text); } .m01w__step, .m01w__muted, .m01w__picked { margin: 0; color: var(--color-text-muted); } .m01w__bad { margin: 0; color: var(--color-danger, #c0392b); } .m01w__reasons { padding: var(--spacing-8); border: 1px solid var(--color-border); border-radius: var(--radius-cards); } .m01w__row { padding: var(--spacing-4) var(--spacing-8); border: 1px solid var(--color-border); border-radius: var(--radius-cards); background: transparent; color: inherit; text-align: left; cursor: pointer; } .m01w__row:hover { background: var(--color-bg, rgb(0 0 0 / 4%)); } .m01w__table, .m01w__card, .m01w__branch, .m01w__atom { display: flex; gap: var(--spacing-8); padding: var(--spacing-8); border: 1px solid var(--color-border); border-radius: var(--radius-cards); } .m01w__card, .m01w__atom, .m01w__branch { flex-direction: column; } .m01w__atom { padding: var(--spacing-4); border-style: dashed; } .m01w__line { display: flex; flex-direction: column; padding: var(--spacing-4) 0; border-bottom: 1px solid var(--color-border); } .m01w__grid { border-collapse: collapse; } .m01w__grid td { padding: var(--spacing-4) var(--spacing-8); border-bottom: 1px solid var(--color-border); } .m01w__money, .m01w__total { text-align: right; font-variant-numeric: tabular-nums; } .m01w__total { margin: 0; font-weight: 600; } @media (width <= 720px) { .m01w__main { grid-template-columns: 1fr; } } .m01w__row.is-active { border-color: var(--color-accent, #2b6cb0); font-weight: 600; }