.mood-surface{min-width:0}.mood-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.mood-heading h2{font-size:24px;margin:5px 0 0}.mood-actions{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:15px}.mood-heading .mood-actions{margin:0}.mood-actions button{font-size:14px;padding:8px 10px}.mood-stage{width:100%;aspect-ratio:4/3;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:var(--panel);box-shadow:0 10px 35px #0000000c}.mood-canvas{position:absolute;left:0;top:0;width:1200px;height:900px;transform:scale(var(--mood-scale,.75));transform-origin:top left;isolation:isolate}.mood-card{position:absolute;display:flex;flex-direction:column;background:#fff;color:#202527;box-shadow:0 5px 18px #0002;outline:2px solid transparent;outline-offset:3px;border-radius:3px;min-width:0;min-height:0}.mood-card.selected{outline-color:#6028ef}.mood-move{border:0;border-radius:3px 3px 0 0;display:flex;justify-content:space-between;gap:10px;align-items:center;height:32px;min-height:32px;width:100%;padding:4px 10px;color:#4c5155;background:#fafafa;cursor:grab;touch-action:none;font:16px/1.3 Arial,sans-serif;white-space:nowrap;overflow:hidden}.mood-move span{font-size:20px}.mood-move:active,.mood-note-handle:active{cursor:grabbing}.mood-card-content{min-height:0;flex:1;position:relative;overflow:hidden;cursor:pointer}.mood-card-content img{width:100%;height:calc(100% - 32px);display:block;object-fit:cover;pointer-events:none}.mood-caption{display:block;height:32px;padding:6px 10px;font:16px/1.2 Arial,sans-serif;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.mood-swatch{width:100%;height:100%;position:relative}.mood-swatch>span{position:absolute;bottom:0;left:0;right:0;background:#ffffffed;padding:8px 12px;font:16px/1.25 Arial,sans-serif}.mood-swatch b{margin-left:10px;font-family:monospace;font-weight:400}.mood-words{height:100%;padding:20px 24px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:32px;line-height:1.3}.mood-resize{position:absolute;right:-9px;bottom:-9px;width:26px;height:26px;padding:0;border:2px solid #6028ef;background:#fff;color:#6028ef;border-radius:4px;font-size:18px;cursor:nwse-resize;touch-action:none;z-index:2}.mood-missing{padding:24px;color:#697277}.mood-sticky{position:absolute;width:260px;height:220px;z-index:10;background:#ffe69a;color:#302717;box-shadow:0 5px 12px #0002;overflow:hidden}.mood-note-handle{background:#ffdb74;border:0;border-radius:0;color:#302717;width:100%;display:flex;justify-content:space-between;padding:8px 12px;font:16px/1.3 Arial,sans-serif;touch-action:none;cursor:grab}.mood-sticky p{font:20px/1.35 Arial,sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;margin:14px 16px}.mood-footer{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:14px;color:var(--muted);margin-top:12px}.mood-reference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.mood-reference-grid button{padding:0;overflow:hidden;text-align:left}.mood-reference-grid img{display:block;width:100%;height:90px;object-fit:cover}.mood-reference-grid span{display:block;font-size:14px;padding:7px}.mood-material-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px}.mood-material-grid button{padding:4px;min-width:0;height:76px}.mood-material-grid img{display:block;width:100%;height:100%;object-fit:contain}.mood-material-grid .help{grid-column:1/-1}.mood-add-color{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0}.mood-add-color input{width:40px;height:36px;border:0;padding:0;background:none}.mood-note-list article{border-top:1px solid var(--line);margin-top:15px;padding-top:12px}.mood-note-list label{display:block;color:var(--muted);margin-bottom:7px}.mood-note-list textarea{min-height:75px}.mood-note-list .mood-actions{margin-top:8px}.mood-card button:focus-visible,.mood-sticky button:focus-visible{outline:4px solid #6028ef;outline-offset:3px}.mood-heading button.account-locked{opacity:.65}@media(max-width:1000px){.mood-heading{align-items:flex-start;flex-direction:column}.mood-heading .mood-actions{width:100%}}@media(max-width:760px){.mood-reference-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mood-heading h2{font-size:21px}.mood-stage{border-radius:4px}.mood-reference-grid img{height:80px}}

.mood-new-color-preview{flex-basis:100%;min-height:60px;border:1px solid var(--line);border-radius:4px;display:flex;align-items:flex-end;padding:8px}
.mood-new-color-preview span{background:#fff;color:#202527;border-radius:3px;padding:3px 7px;font:14px/1.4 monospace}