:root {
    --bg: #f4f5f7;
    --panel: #ffffff;
    --text: #1d2430;
    --muted: #667085;
    --line: #d9dee7;
    --primary: #222b3a;
    --soft: #eef1f5;
    --success-bg: #edf9f1;
    --success-line: #a9d9b8;
    --error-bg: #fff0f0;
    --error-line: #e6aaaa;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; font-family: Inter, Segoe UI, Arial, sans-serif; color: var(--text); background: var(--bg); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.app-shell { min-height: 100vh; }
.topbar {
    height: 58px; display: flex; align-items: center; gap: 24px; padding: 0 20px;
    background: #fff; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 1000;
}
.brand { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; background: #ffdf68; border-radius: 7px; font-weight: 900; box-shadow: 0 2px 7px #0002; }
.brand strong, .brand small { display: block; }
.brand small { color: var(--muted); font-size: 11px; }
.topnav { display: flex; align-items: stretch; gap: 4px; height: 100%; }
.topnav a { display: flex; align-items: center; padding: 0 12px; color: #4d5767; text-decoration: none; border-bottom: 2px solid transparent; }
.topnav a.active { color: #111827; border-bottom-color: #111827; font-weight: 650; }
.userbox { margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 3px 8px; background: #eef0f4; font-size: 10px; font-weight: 800; letter-spacing: .04em; }
.main-content { padding: 18px; }

.page-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin: 2px 0 16px; }
.page-heading h1 { margin: 0 0 4px; font-size: 24px; }
.page-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.page-card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 16px; margin-bottom: 14px; box-shadow: 0 1px 2px #00000008; }
.section-title { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; border-bottom: 1px solid #edf0f4; padding-bottom: 10px; margin-bottom: 12px; }
.section-title h2 { margin: 0; font-size: 16px; }
.section-title span { color: var(--muted); font-size: 12px; }

.primary-button, .secondary-button, .mini-button {
    border-radius: 6px; border: 1px solid #cfd5de; min-height: 34px; padding: 6px 12px; background: #fff; color: #1f2937;
}
.primary-button { background: var(--primary); color: #fff; border-color: var(--primary); }
.mini-button { min-height: 26px; padding: 3px 8px; font-size: 11px; }
button:disabled { opacity: .45; cursor: not-allowed; }
input, select, textarea { width: 100%; border: 1px solid #cfd5de; border-radius: 6px; background: #fff; padding: 7px 9px; color: var(--text); }
input:disabled { background: #eef0f3; color: #555e6c; }
label { display: grid; gap: 5px; font-size: 12px; color: #4b5565; }
.check-label { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.check-label input { width: auto; }
.wide-input { min-width: 260px; }
.success-message, .error-message { padding: 10px 12px; border-radius: 7px; margin-bottom: 12px; font-size: 13px; }
.success-message { background: var(--success-bg); border: 1px solid var(--success-line); }
.error-message { background: var(--error-bg); border: 1px solid var(--error-line); }

.stat-grid { display: grid; grid-template-columns: repeat(5, minmax(150px, 1fr)); gap: 10px; margin-bottom: 14px; }
.stat-card { background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 13px; }
.stat-card span, .stat-card small { display: block; color: var(--muted); font-size: 11px; }
.stat-card strong { display: block; font-size: 24px; margin: 4px 0 2px; }
.table-scroll { overflow: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.data-table th { text-align: left; font-size: 11px; color: #667085; background: #f7f8fa; border-bottom: 1px solid var(--line); padding: 8px; position: sticky; top: 0; }
.data-table td { border-bottom: 1px solid #edf0f4; padding: 8px; vertical-align: top; }
.data-table td strong, .data-table td small { display: block; }
.data-table td small { color: var(--muted); margin-top: 2px; }
.usage-track { width: 100px; height: 5px; background: #e9edf2; border-radius: 999px; margin-top: 4px; overflow: hidden; }
.usage-track span { display: block; height: 100%; background: #596579; border-radius: inherit; }

.policy-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.policy-grid > div { border: 1px solid #e2e6ec; border-radius: 8px; padding: 10px; background: #fafbfc; }
.policy-grid strong, .policy-grid span { display: block; }
.policy-grid span { color: var(--muted); font-size: 11px; margin-top: 4px; }
.setting-row { display: grid; grid-template-columns: minmax(250px, 1fr) minmax(300px, 1fr) auto; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px solid #eff1f4; }
.setting-description strong, .setting-description small { display: block; }
.setting-description small { color: var(--muted); margin-top: 3px; }
.storage-card { border: 1px solid #e2e6ec; border-radius: 8px; padding: 11px; margin-bottom: 8px; }
.storage-head { display: flex; justify-content: space-between; margin-bottom: 9px; }
.storage-head strong, .storage-head small { display: block; }
.storage-head small { color: var(--muted); }
.storage-edit-row { display: grid; grid-template-columns: 1fr auto auto; align-items: end; gap: 10px; }
.filetype-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.filetype-item { border: 1px solid #e2e6ec; border-radius: 7px; padding: 8px; display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: center; }
.filetype-item label { display: flex; align-items: center; gap: 7px; color: var(--text); }
.filetype-item label input { width: auto; }
.filetype-item span, .filetype-item small { color: var(--muted); font-size: 10px; }
.filetype-item small { grid-column: 1 / -1; overflow: hidden; text-overflow: ellipsis; }
.filetype-item .mini-button { justify-self: end; }
.form-grid { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 10px; margin-bottom: 10px; }

.theme-admin-card { display: grid; grid-template-columns: 190px 1fr; gap: 14px; border: 1px solid #e1e5eb; border-radius: 9px; padding: 11px; margin-bottom: 10px; }
.theme-preview { min-height: 135px; border-radius: 8px; display: grid; place-items: center; padding: 10px; font-weight: 800; border: 1px solid #d2d8e1; }
.theme-preview.classic-cork { background: radial-gradient(circle at 30% 20%, #c69d70 0 2px, transparent 3px), #b78656; background-size: 16px 16px; }
.theme-preview.clean-white { background: #f6f6f3; }
.theme-preview.dark-desk { background: linear-gradient(135deg, #31363c, #171a1f); color: #fff; }
.theme-fields textarea { resize: vertical; font-family: Consolas, monospace; font-size: 11px; margin: 8px 0; }

.board-toolbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; margin-bottom: 12px; }
.board-toolbar h1 { margin: 0; font-size: 22px; }
.board-toolbar p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.quick-actions { display: flex; gap: 8px; align-items: center; }
.user-search-wrap { position: relative; width: 320px; }
.search-popup { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: #fff; border: 1px solid var(--line); border-radius: 7px; box-shadow: 0 8px 22px #0002; z-index: 50; overflow: hidden; }
.search-result { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid #eef0f3; padding: 8px 10px; background: #fff; }
.search-result:hover { background: #f6f7f9; }
.search-result strong, .search-result span, .search-result small { display: block; }
.search-result span, .search-result small { color: var(--muted); font-size: 10px; }
.cork-board { position: relative; min-height: calc(100vh - 130px); border-radius: 8px; overflow: auto; border: 1px solid #8d6741; background: radial-gradient(circle at 15% 20%, #a77448 0 1.5px, transparent 2px), radial-gradient(circle at 65% 70%, #94623b 0 1px, transparent 2px), #bd8c5b; background-size: 15px 15px, 23px 23px; box-shadow: inset 0 0 30px #5d391f45; }
.board-zone { position: absolute; left: 40px; top: 40px; width: 360px; height: 330px; border: 2px dashed #ffffff80; border-radius: 12px; }
.board-zone span { position: absolute; top: -22px; left: 4px; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.postit { position: absolute; width: 260px; min-height: 220px; padding: 18px 15px 12px; box-shadow: 0 7px 15px #45290f44; transform: rotate(-.6deg); }
.postit.yellow { background: #ffe985; }
.postit.blue { background: #aadef3; transform: rotate(.8deg); }
.postit h2 { margin: 5px 0 12px; font-size: 17px; }
.postit label { display: flex; grid-template-columns: none; align-items: flex-start; gap: 7px; color: #2c3137; margin: 6px 0; font-size: 12px; }
.postit label input { width: auto; }
.postit footer { margin-top: 14px; font-size: 11px; color: #5d5e58; }
.postit-owner { font-size: 9px; font-weight: 900; letter-spacing: .08em; color: #5c5023; }
.postit-owner.shared { color: #275367; }

@media (max-width: 1100px) {
    .stat-grid { grid-template-columns: repeat(3, 1fr); }
    .form-grid { grid-template-columns: repeat(2, 1fr); }
    .policy-grid { grid-template-columns: repeat(2, 1fr); }
}
.admin-user-list { display: grid; gap: 8px; }
.admin-user-card { display: grid; grid-template-columns: minmax(220px, .7fr) 2fr; gap: 14px; border: 1px solid #e1e5eb; border-radius: 8px; padding: 10px; align-items: end; }
.admin-user-name strong, .admin-user-name small, .admin-user-name span { display: block; }
.admin-user-name small, .admin-user-name span { color: var(--muted); font-size: 10px; margin-top: 3px; }
.admin-user-fields { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)) auto; gap: 8px; align-items: end; }
.disabled-rule { opacity: .58; background: #f2f3f5; }

/* ============================================================
   BOARD V1 - layout operativo PC
   ============================================================ */
.board-page { min-width:0; height:calc(100dvh - 58px); margin:-18px; padding:10px 12px 12px; display:flex; flex-direction:column; overflow:hidden; }
.board-commandbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:10px; }
.board-title-block h1 { margin:0; font-size:22px; }
.board-title-block span { display:block; margin-top:2px; font-size:11px; color:var(--muted); }
.board-command-actions { display:flex; align-items:end; gap:8px; }
.compact-select { min-width:190px; }
.compact-select span { font-size:10px; }
.compact-select select { padding:5px 7px; min-height:34px; }
.board-message { margin-bottom:8px; }
.board-workspace { display:grid; grid-template-columns:74px minmax(0,1fr); gap:9px; flex:1; min-height:0; position:relative; }
.board-tools { border:1px solid var(--line); border-radius:9px; background:#fff; padding:7px; display:flex; flex-direction:column; gap:7px; overflow:auto; }
.postit-pad { height:94px; position:relative; border-radius:5px; background:#ffe77a; box-shadow:0 4px 8px #0002; display:flex; flex-direction:column; align-items:center; justify-content:center; user-select:none; cursor:grab; margin-bottom:5px; }
.postit-pad::before,.postit-pad::after { content:""; position:absolute; inset:4px -3px -3px 4px; background:#f4d966; border-radius:4px; z-index:-1; }
.postit-pad button { border:0; background:transparent; font-size:28px; line-height:1; cursor:pointer; width:100%; }
.postit-pad strong { font-size:9px; letter-spacing:.08em; }
.postit-pad span { font-size:8px; color:#635a2a; }
.tool-button { width:100%; min-height:48px; border:1px solid #e0e4e9; border-radius:7px; background:#fff; display:grid; place-items:center; gap:1px; padding:4px; position:relative; color:#424b58; }
.tool-button:hover { background:#f6f7f8; }
.tool-button .tool-icon { font-size:18px; line-height:1; }
.tool-button span:last-of-type { font-size:9px; }
.tool-button b { position:absolute; right:3px; top:3px; min-width:16px; height:16px; display:grid; place-items:center; border-radius:50%; background:#d64040; color:#fff; font-size:8px; }
.tool-section-title { font-size:9px; text-transform:uppercase; letter-spacing:.08em; color:#7c8490; text-align:center; padding-top:6px; border-top:1px solid #edf0f3; }
.board-viewport { position:relative; min-width:0; min-height:0; overflow:hidden; border:1px solid #8c6947; border-radius:9px; background:#98704c; }
.postit-board-canvas { position:relative; width:100%; height:100%; min-width:0; min-height:0; transform-origin:top left; overflow:hidden; }
.postit-card { position:absolute; min-width:180px; min-height:140px; touch-action:none; padding:10px 12px 9px; box-shadow:0 8px 16px #38241040; overflow:auto; resize:both; border:1px solid #00000010; color:#282a2d; transition:box-shadow .12s ease,opacity .12s ease; }
.postit-card.is-dragging { box-shadow:0 18px 30px #0005; cursor:grabbing; z-index:9999 !important; }
.postit-card.color-yellow,.inbox-postit.color-yellow,.color-swatch.color-yellow { background:#ffe77a; }
.postit-card.color-blue,.inbox-postit.color-blue,.color-swatch.color-blue { background:#a8ddf1; }
.postit-card.color-green,.inbox-postit.color-green,.color-swatch.color-green { background:#c6e9a8; }
.postit-card.color-pink,.inbox-postit.color-pink,.color-swatch.color-pink { background:#f5bfd5; }
.postit-card.color-orange,.inbox-postit.color-orange,.color-swatch.color-orange { background:#ffc987; }
.postit-card.color-white,.inbox-postit.color-white,.color-swatch.color-white { background:#f8f6ed; }
.postit-card.skin-classic { border-radius:2px; }
.postit-card.skin-minimal { border-radius:8px; box-shadow:0 5px 15px #0002; }
.postit-card.skin-tape::before { content:""; position:absolute; width:72px; height:20px; left:50%; top:-7px; transform:translateX(-50%) rotate(-2deg); background:#f3e8ccaa; box-shadow:0 1px 3px #0002; }
.postit-card.is-closed { opacity:.76; filter:saturate(.6); }
.postit-card-header { display:flex; justify-content:space-between; align-items:center; min-height:23px; cursor:grab; user-select:none; }
.postit-source { display:flex; gap:4px; align-items:center; }
.owner-chip,.shared-chip,.new-chip { border-radius:999px; padding:2px 5px; font-size:7px; font-weight:800; letter-spacing:.07em; background:#00000012; }
.shared-chip { background:#24637b22; color:#285d6d; }
.new-chip { background:#c63131; color:#fff; }
.postit-menu-button { border:0; background:transparent; padding:0 3px; min-height:20px; cursor:pointer; font-weight:900; }
.postit-card h2 { margin:3px 0 9px; font-size:17px; line-height:1.15; }
.postit-title-input { border:0; border-bottom:1px dashed #0002; border-radius:0; background:transparent; padding:2px 0 5px; font-size:17px; font-weight:750; margin-bottom:7px; }
.postit-title-input:focus { outline:none; border-bottom-color:#0006; }
.postit-task-list { display:grid; gap:3px; }
.postit-task-row { display:grid; grid-template-columns:16px minmax(0,1fr) auto auto; gap:5px; align-items:start; font-size:12px; min-height:20px; }
.postit-task-row input { width:auto; margin-top:2px; }
.postit-task-row.done span { text-decoration:line-through; opacity:.62; }
.postit-task-row small { font-size:8px; opacity:.7; }
.task-you { font-size:7px; border-radius:999px; padding:2px 4px; color:#fff; background:#2b6d48; }
.quick-task-input { border:0; border-bottom:1px solid #0002; border-radius:0; background:transparent; font-size:11px; padding:5px 1px; margin-top:5px; }
.quick-task-input:focus { outline:none; border-bottom-color:#0007; }
.postit-footer { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:8px; font-size:9px; color:#5b5745; }
.closed-mark { margin-left:auto; font-weight:900; color:#27613d; }
.inbox-panel { position:absolute; z-index:80; width:310px; right:12px; top:12px; bottom:12px; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 15px 35px #0003; display:flex; flex-direction:column; padding:10px; overflow:auto; }
.inbox-head { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:10px; }
.inbox-head strong,.inbox-head span { display:block; }
.inbox-head span { color:var(--muted); font-size:10px; margin-top:2px; }
.inbox-head button { border:0; background:transparent; font-size:20px; }
.inbox-postit { padding:12px; margin-bottom:8px; min-height:112px; box-shadow:0 5px 10px #0002; }
.inbox-postit span,.inbox-postit strong,.inbox-postit small { display:block; }
.inbox-postit span,.inbox-postit small { font-size:9px; opacity:.7; }
.inbox-postit strong { margin:5px 0 8px; }
.inbox-postit > div { display:flex; gap:5px; margin-top:8px; }
.empty-state { padding:15px; border:1px dashed #d9dde3; border-radius:7px; color:var(--muted); text-align:center; font-size:11px; background:#fafbfc; }
.postit-drag-ghost { position:fixed; z-index:100000; width:90px; height:90px; display:grid; place-items:center; pointer-events:none; background:#ffe77a; box-shadow:0 15px 25px #0004; font-size:28px; transform:rotate(-3deg); }
.context-menu { position:fixed; z-index:10000; min-width:185px; background:#fff; border:1px solid #d9dde3; border-radius:8px; box-shadow:0 10px 28px #0003; padding:5px; }
.context-menu > button { width:100%; border:0; text-align:left; background:#fff; border-radius:5px; padding:7px 8px; }
.context-menu > button:hover { background:#f1f3f5; }
.context-separator { height:1px; background:#e8ebef; margin:5px 0; }
.context-label { display:block; padding:4px 7px; color:var(--muted); font-size:9px; }
.color-row { display:flex; gap:5px; padding:4px 7px 7px; }
.color-swatch { width:22px; height:22px; border-radius:50%; border:1px solid #0002; padding:0; min-height:0; }
.board-element { position:absolute; box-sizing:border-box; }
.board-element.is-editable { cursor:move; touch-action:none; }
.board-element-rectangle { border:2px dashed #ffffff99; border-radius:11px; background:#ffffff10; padding:20px 8px 8px; }
.board-element-text { border:0; background:transparent; font-size:18px; font-weight:800; color:inherit; padding:3px; }
.board-element-sticker { display:grid; place-items:center; background:transparent !important; }
.board-element-sticker .board-element-text { font-size:40px; text-align:center; }
.board-sticker-emoji { width:100%; height:100%; display:grid; place-items:center; font-size:clamp(34px,5vw,72px); line-height:1; user-select:none; }
.board-sticker-image { width:100%; height:100%; object-fit:contain; display:block; user-select:none; pointer-events:none; }
.board-sticker-image.is-animated { image-rendering:auto; }
.animation-pulse.is-animated, .is-animated.animation-pulse { animation:postitStickerPulse var(--sticker-animation-duration,1.8s) ease-in-out infinite; }
.animation-wiggle.is-animated, .is-animated.animation-wiggle { animation:postitStickerWiggle var(--sticker-animation-duration,2.2s) ease-in-out infinite; }
@keyframes postitStickerPulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.12)} }
@keyframes postitStickerWiggle { 0%,100%{transform:rotate(0)} 25%{transform:rotate(-8deg)} 75%{transform:rotate(8deg)} }
.board-element-line .board-line { position:absolute; left:0; right:0; top:50%; height:2px; background:#ffffffaa; }
.board-element-handle { position:absolute; left:0; top:0; padding:2px 5px; border-radius:4px; background:#fff; color:#4a5260; font-size:10px; cursor:grab; box-shadow:0 1px 5px #0002; z-index:3; }
.board-element-delete { position:absolute; right:-7px; top:-7px; width:20px; height:20px; padding:0; min-height:0; border-radius:50%; border:0; background:#b93a3a; color:#fff; z-index:3; }
.detail-overlay { position:fixed; inset:0; z-index:20000; background:#0007; display:flex; justify-content:flex-end; }
.postit-detail { width:min(760px,92vw); height:100%; background:#f7f8fa; box-shadow:-12px 0 35px #0004; display:grid; grid-template-rows:auto minmax(0,1fr) auto; }
.detail-header { display:flex; justify-content:space-between; align-items:flex-start; padding:16px 18px 12px; background:#fff; border-bottom:1px solid var(--line); }
.detail-header span { font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.07em; }
.detail-header h2 { margin:3px 0 0; font-size:20px; }
.detail-header button { border:0; background:transparent; font-size:26px; }
.detail-scroll { overflow:auto; padding:14px 18px; }
.detail-note { white-space:pre-wrap; background:#fff; border:1px solid var(--line); border-radius:8px; padding:12px; margin-bottom:12px; }
.detail-section { background:#fff; border:1px solid var(--line); border-radius:9px; padding:12px; margin-top:12px; }
.detail-section-head { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:9px; }
.detail-section-head h3 { margin:0; font-size:14px; }
.detail-section-head span { color:var(--muted); font-size:10px; }
.share-box { position:relative; }
.share-results { position:absolute; z-index:10; left:0; right:0; top:calc(100% + 3px); background:#fff; border:1px solid var(--line); border-radius:7px; box-shadow:0 8px 20px #0002; max-height:220px; overflow:auto; }
.share-results button { display:block; width:100%; border:0; border-bottom:1px solid #eef0f2; background:#fff; text-align:left; padding:7px 9px; }
.share-results strong,.share-results small { display:block; }
.share-results small { color:var(--muted); }
.detail-task { display:grid; grid-template-columns:20px minmax(0,1fr) auto; gap:7px; align-items:start; min-height:34px; padding:6px 0; border-bottom:1px solid #eef0f2; }
.detail-task > input { width:auto; }
.detail-task.done strong { text-decoration:line-through; opacity:.58; }
.detail-task-main { display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; min-width:0; padding:1px 0; white-space:normal; overflow-wrap:anywhere; }
.detail-task-title,.detail-task-main small { display:block; width:100%; min-width:0; text-align:left; }
.detail-task-title { font-weight:400; line-height:1.24; white-space:normal; overflow-wrap:anywhere; word-break:normal; }
.detail-task-main small { color:var(--muted); font-size:9px; line-height:1.25; white-space:normal; overflow-wrap:anywhere; }
.detail-add-task { display:grid; grid-template-columns:1fr auto; gap:7px; margin-top:9px; }
.file-drop-control { position:relative; min-height:75px; border:2px dashed #bdc5cf; border-radius:8px; background:#fafbfc; display:grid; place-items:center; text-align:center; padding:9px; overflow:hidden; transition:border-color .12s ease,background-color .12s ease,box-shadow .12s ease; }
.file-drop-control input[type=file] { position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; z-index:3; }
.file-drop-control strong,.file-drop-control span { position:relative; z-index:1; pointer-events:none; }
.file-drop-control strong,.file-drop-control span { display:block; }
.file-drop-control span { font-size:9px; color:var(--muted); margin-top:3px; }
.file-drop-control.is-dragover { border-color:#3b82f6; background:#eaf4ff; box-shadow:inset 0 0 0 1px #93c5fd,0 0 0 3px #3b82f61f; }
.file-drop-control.is-dragover strong { color:#1d4ed8; }
.document-head-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; flex-wrap:wrap; }
.document-delete-modal { width:min(560px,calc(100vw - 28px)); }
.document-card { border:1px solid #e0e4e9; border-radius:8px; padding:9px; margin-top:8px; }
.document-head { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:6px; }
.document-head strong,.document-head span { display:block; }
.document-head span { color:var(--muted); font-size:9px; }
.mini-upload { position:relative; overflow:hidden; border:1px solid #d2d7de; border-radius:5px; padding:4px 7px; background:#fff; font-size:9px; }
.mini-upload input[type=file] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.version-row { display:grid; grid-template-columns:72px minmax(0,1fr) auto; gap:7px; align-items:center; border-top:1px solid #eef0f2; padding:6px 0; }
.version-number { font-weight:800; font-size:10px; }
.version-info a,.version-info small { display:block; }
.version-info a { color:#245b91; text-decoration:none; font-size:11px; overflow:hidden; text-overflow:ellipsis; }
.version-info small { color:var(--muted); font-size:8px; margin-top:2px; }
.mini-button.danger { color:#a42626; border-color:#e1b9b9; }
.mini-button.active { background:#e8edf3; border-color:#aeb8c5; }
.detail-footer { padding:10px 18px; border-top:1px solid var(--line); background:#fff; display:flex; justify-content:space-between; align-items:center; }
.detail-footer > span { font-size:9px; font-weight:800; color:var(--muted); }

@media (max-width:1100px) {
  .board-workspace { grid-template-columns:62px minmax(0,1fr); }
  .board-commandbar { align-items:flex-start; }
  .board-command-actions { flex-wrap:wrap; justify-content:flex-end; }
}


/* Patch 003 - board full-screen, context menu, colori elementi e sticker */
.element-color-white { --element-color:#ffffff; --element-ink:#25303d; }
.element-color-black { --element-color:#252a31; --element-ink:#ffffff; }
.element-color-yellow { --element-color:#ffe77a; --element-ink:#3d3516; }
.element-color-blue { --element-color:#a8ddf1; --element-ink:#173846; }
.element-color-green { --element-color:#c6e9a8; --element-ink:#254217; }
.element-color-red { --element-color:#f1b0b0; --element-ink:#5c2020; }
.board-element-rectangle { background:color-mix(in srgb, var(--element-color, #fff) 28%, transparent); border-color:color-mix(in srgb, var(--element-color, #fff) 75%, transparent); color:var(--element-ink,#fff); }
.board-element-text { color:var(--element-ink,inherit); }
.board-element-text.element-color-black, .element-color-black .board-element-text { color:#fff; }
.board-element-line .board-line { background:var(--element-color,#ffffffaa); }
.element-swatch.element-color-white { background:#fff; }
.element-swatch.element-color-black { background:#252a31; }
.element-swatch.element-color-yellow { background:#ffe77a; }
.element-swatch.element-color-blue { background:#a8ddf1; }
.element-swatch.element-color-green { background:#c6e9a8; }
.element-swatch.element-color-red { background:#e68181; }
.danger-context { color:#a42626 !important; }

.sticker-picker-backdrop { position:fixed; inset:0; z-index:22000; background:#0006; display:grid; place-items:center; padding:24px; }
.sticker-picker { width:min(720px,94vw); max-height:min(680px,88vh); background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 20px 55px #0005; display:grid; grid-template-rows:auto minmax(0,1fr); overflow:hidden; }
.sticker-picker > header { display:flex; justify-content:space-between; align-items:flex-start; padding:13px 15px; border-bottom:1px solid var(--line); }
.sticker-picker > header strong,.sticker-picker > header span { display:block; }
.sticker-picker > header span { color:var(--muted); font-size:10px; margin-top:2px; }
.sticker-picker > header button { border:0; background:transparent; font-size:24px; padding:0 4px; }
.sticker-picker-scroll { overflow:auto; padding:14px; }
.sticker-picker h3 { margin:0 0 8px; font-size:13px; }
.sticker-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(105px,1fr)); gap:8px; margin-bottom:18px; }
.sticker-choice { width:100%; min-height:105px; border:1px solid #dde2e8; background:#fafbfc; border-radius:9px; padding:8px; display:grid; place-items:center; gap:4px; }
.sticker-choice:hover { background:#f1f4f7; border-color:#bcc5d0; }
.sticker-choice-visual { font-size:48px; line-height:1; }
.sticker-choice small { font-size:9px; color:var(--muted); max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sticker-choice img { width:64px; height:64px; object-fit:contain; }
.sticker-section-head { display:flex; align-items:end; justify-content:space-between; gap:12px; margin-bottom:8px; }
.sticker-section-head h3 { margin:0; }
.sticker-section-head span { display:block; color:var(--muted); font-size:9px; margin-top:2px; }
.sticker-upload { min-width:72px; text-align:center; }
.user-sticker-card { position:relative; }
.user-sticker-delete { position:absolute; right:-4px; top:-4px; z-index:2; width:22px; height:22px; padding:0; border:0; border-radius:50%; background:#ad3434; color:#fff; }
.theme-tech-note { border:1px solid #e2e6ec; border-radius:8px; padding:9px 10px; background:#f8fafc; margin:8px 0 10px; }
.theme-tech-note strong,.theme-tech-note span { display:block; }
.theme-tech-note span { color:var(--muted); font-size:10px; margin-top:3px; }

@media (max-width:760px) {
  .board-page { padding:8px; }
  .board-commandbar { gap:7px; }
  .board-title-block { display:none; }
  .board-command-actions { width:100%; }
  .board-workspace { grid-template-columns:58px minmax(0,1fr); }
}

body:has(.board-page) { overflow:hidden; }
body:has(.board-page) .main-content { height:calc(100dvh - 58px); padding:0; overflow:hidden; }
body:has(.board-page) .board-page { height:100%; margin:0; }
.postit-board-canvas .board-element-line .board-line { background:var(--element-color,#ffffffaa); }

/* ============================================================
   Patch 004 - board fullscreen, toolbar flottante, tabs admin
   ============================================================ */
.settings-tabs {
    display:flex; align-items:flex-end; gap:2px; padding:0 8px;
    border-bottom:1px solid var(--line); margin:0 0 14px;
}
.settings-tab {
    min-height:34px; padding:7px 14px; border:1px solid transparent; border-bottom:0;
    border-radius:8px 8px 0 0; background:#eceff3; color:#4f5968; font-size:12px;
    position:relative; top:1px;
}
.settings-tab:hover { background:#f5f6f8; }
.settings-tab.active { background:#fff; color:#1d2430; border-color:var(--line); font-weight:700; }
.settings-tab-content { min-width:0; }

body:has(.board-page) .topbar { display:none; }
body:has(.board-page) .main-content { height:100dvh; min-height:100dvh; padding:0; overflow:hidden; }
body:has(.board-page) .app-shell { min-height:100dvh; height:100dvh; overflow:hidden; }
body:has(.board-page) { overflow:hidden; background:#000; }

.board-page { position:relative; width:100%; height:100dvh !important; margin:0 !important; padding:0 !important; overflow:hidden; }
.board-workspace { position:absolute; inset:0; display:block !important; min-width:0; min-height:0; }
.board-viewport { position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:0; overflow:hidden; }
.postit-board-canvas { width:100%; height:100%; }

.board-message {
    position:fixed; left:50%; top:14px; transform:translateX(-50%); z-index:65000;
    max-width:min(720px,70vw); margin:0; box-shadow:0 8px 24px #0003;
}

.board-hud-actions {
    position:fixed; z-index:15000; top:12px; right:12px; display:flex; gap:7px;
    padding:5px; border:1px solid #ffffff50; border-radius:11px;
    background:#ffffffc9; backdrop-filter:blur(8px); box-shadow:0 6px 20px #0002;
    opacity:.58; transition:opacity .16s ease,background .16s ease;
}
.board-hud-actions:hover { opacity:1; background:#fffffff2; }
.board-hud-button {
    width:34px; height:34px; min-height:0; padding:0; display:grid; place-items:center;
    border:1px solid #d5dae2; border-radius:8px; background:#fff; font-size:17px;
}
.board-hud-button:hover,.board-hud-button.active { background:#e9edf2; border-color:#aeb7c4; }

.board-flyout {
    position:fixed; z-index:15500; top:60px; right:12px; width:min(330px,calc(100vw - 24px));
    background:#fffffff5; backdrop-filter:blur(12px); border:1px solid #d7dde5;
    border-radius:11px; box-shadow:0 18px 45px #0004; padding:10px;
}
.board-flyout > header { display:flex; justify-content:space-between; align-items:center; padding:2px 3px 8px; border-bottom:1px solid #e5e8ed; margin-bottom:8px; }
.board-flyout > header button { border:0; background:transparent; font-size:20px; padding:0 4px; min-height:0; }
.board-flyout > a { display:block; padding:8px 9px; border-radius:7px; color:#26303d; text-decoration:none; font-size:12px; }
.board-flyout > a:hover { background:#edf0f4; }
.board-flyout .secondary-button { width:100%; margin-top:8px; }
.board-flyout-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:5px; margin:3px 0 10px; }
.board-flyout-stats span { padding:7px 5px; border-radius:7px; background:#f0f2f5; text-align:center; font-size:9px; color:#616a77; }
.board-flyout-stats b { display:block; color:#252c37; font-size:15px; }

.board-tools-top {
    position:absolute; z-index:12000; left:12px; top:12px; display:flex; align-items:center; gap:6px;
    padding:6px; border:1px solid #ffffff55; border-radius:11px;
    background:#fff; backdrop-filter:none; box-shadow:0 8px 24px #0003;
    opacity:1; transition:max-width .2s ease;
    max-width:calc(100vw - 180px);
}
.board-tools-top:hover { opacity:1; background:#fff; }
.board-tools-top.collapsed { padding:4px; }
.toolbar-toggle { width:28px; height:42px; min-height:0; padding:0; border:0; border-radius:7px; background:#eef1f4; font-size:20px; }
.toolbar-divider { width:1px; height:38px; background:#dce1e7; margin:0 2px; }
.toolbar-postit-pad { width:58px; height:44px; min-width:58px; margin:0; box-shadow:0 2px 7px #0002; }
.toolbar-postit-pad::before,.toolbar-postit-pad::after { inset:3px -2px -2px 3px; }
.toolbar-postit-pad button { font-size:20px; }
.toolbar-postit-pad strong { font-size:7px; }

.tool-button.horizontal {
    width:auto; min-width:64px; height:44px; min-height:44px; padding:4px 8px;
    display:grid; grid-template-columns:auto auto; grid-template-rows:1fr; align-items:center; justify-content:center;
    column-gap:5px; white-space:nowrap;
}
.tool-button.horizontal .tool-icon { font-size:17px; }
.tool-button.horizontal span:last-of-type { font-size:9px; }
.tool-button.horizontal b { right:2px; top:2px; }
.tool-button[data-postit-drop-zone]:hover { outline:2px solid #75869b; outline-offset:1px; }
.archive-stack-icon { position:relative; text-shadow:2px 2px 0 #c7ccd3,4px 4px 0 #e0e3e7; }
.trash-tool:hover { background:#fff0f0; }
.archive-stack:hover { background:#f3f6fa; }

.quick-task-wrap { position:relative; min-width:0; }
.task-user-suggestions {
    position:absolute; left:0; right:0; top:calc(100% + 2px); z-index:13000;
    max-height:210px; overflow:auto; background:#fff; border:1px solid #cfd5dd;
    border-radius:7px; box-shadow:0 10px 24px #0003;
}
.task-user-suggestions button {
    position:relative; width:100%; border:0; border-bottom:1px solid #eef0f3;
    background:#fff; padding:6px 8px; text-align:left;
}
.task-user-suggestions button:hover { background:#f3f5f7; }
.task-user-suggestions strong,.task-user-suggestions small { display:block; }
.task-user-suggestions strong { font-size:10px; }
.task-user-suggestions small { font-size:8px; color:#717987; }
.task-user-suggestions span,.recent-result-chip {
    position:absolute; right:6px; top:6px; border-radius:999px; padding:1px 5px;
    background:#eef1f5; color:#596473; font-size:7px; font-weight:800;
}
.share-results button { position:relative; }
.detail-suggestions { top:calc(100% + 3px); }

.detail-footer-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; }
.secondary-button.danger { color:#a22929; border-color:#ddb4b4; }

.postit-drag-ghost.archive-ghost { background:#e9edf3; color:#576171; font-size:12px; font-weight:900; }

@media (max-width:900px) {
    .board-tools-top { max-width:calc(100vw - 118px); overflow-x:auto; }
    .tool-button.horizontal { min-width:54px; padding:3px 5px; }
    .tool-button.horizontal span:last-of-type { display:none; }
    .board-hud-actions { right:7px; top:7px; }
    .board-tools-top { left:7px; top:7px; }
}

/* Patch 005 - ricerca, lifecycle, palette modifica e texture */
.board-edit-palette {
    position:fixed; z-index:15450; top:58px; right:12px;
    display:grid; gap:5px; width:132px; padding:7px;
    background:#fff; backdrop-filter:none;
    border:1px solid #d8dde4; border-radius:10px; box-shadow:0 12px 30px #0003;
    opacity:1; transition:background .15s ease;
}
.board-edit-palette:hover { opacity:1; background:#fff; }
.board-edit-palette button {
    min-height:34px; padding:5px 8px; display:flex; align-items:center; gap:8px;
    border:1px solid #d8dde4; border-radius:7px; background:#f8f9fb; color:#28313d;
    font-size:10px; text-align:left;
}
.board-edit-palette button:hover { background:#edf1f5; border-color:#b9c2cd; }
.board-edit-palette button span { width:20px; text-align:center; font-size:16px; font-weight:800; }

.board-search-flyout { width:min(440px,calc(100vw - 24px)); }
.board-search-box { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px; align-items:center; }
.board-search-box input { min-width:0; }
.search-hint { display:block; margin:6px 2px 8px; color:#707986; font-size:9px; }
.board-search-results { max-height:min(450px,60vh); overflow:auto; display:grid; gap:4px; }
.board-search-results > button {
    width:100%; padding:8px 9px; border:1px solid #e0e4e9; border-radius:7px;
    background:#fff; text-align:left;
}
.board-search-results > button:hover { background:#f3f5f8; border-color:#c5cbd4; }
.board-search-results strong,.board-search-results span,.board-search-results small { display:block; }
.board-search-results strong { font-size:11px; color:#26303b; }
.board-search-results span { margin-top:2px; font-size:9px; color:#596575; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.board-search-results small { margin-top:3px; font-size:8px; color:#8a929d; }

.lifecycle-overlay {
    position:fixed; inset:0; z-index:21000; display:grid; place-items:center;
    padding:24px; background:#0006; backdrop-filter:blur(2px);
}
.lifecycle-panel {
    width:min(720px,94vw); max-height:min(720px,88vh); display:grid;
    grid-template-rows:auto minmax(0,1fr) auto; overflow:hidden;
    background:#fffffff8; border:1px solid #d7dce3; border-radius:12px;
    box-shadow:0 22px 55px #0005;
}
.lifecycle-panel > header {
    display:flex; justify-content:space-between; align-items:flex-start; gap:12px;
    padding:13px 15px; border-bottom:1px solid #e2e6eb;
}
.lifecycle-panel > header strong,.lifecycle-panel > header span { display:block; }
.lifecycle-panel > header strong { font-size:14px; }
.lifecycle-panel > header span { margin-top:2px; color:#737d8a; font-size:9px; }
.lifecycle-panel > header button { border:0; background:transparent; font-size:24px; min-height:0; padding:0 4px; }
.lifecycle-list { min-height:120px; overflow:auto; padding:10px; display:grid; align-content:start; gap:6px; }
.lifecycle-row {
    display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center;
    padding:9px 10px; border:1px solid #e0e4e9; border-radius:8px; background:#fff;
}
.lifecycle-row strong,.lifecycle-row small { display:block; }
.lifecycle-row strong { font-size:11px; }
.lifecycle-row small { margin-top:3px; color:#737c88; font-size:8px; }
.lifecycle-actions { display:flex; gap:5px; align-items:center; }
.lifecycle-footer {
    display:flex; justify-content:flex-end; align-items:center; gap:7px;
    padding:10px 12px; border-top:1px solid #e2e6eb; background:#fafbfc;
}
.lifecycle-footer > span { margin-right:auto; color:#7b4d4d; font-size:9px; }
.primary-button.danger { background:#ad3030; border-color:#922525; }

/* Texture procedurali: nessun asset esterno, restano leggere e scalabili. */
.postit-card.color-yellow { --postit-paper:#ffe77a; }
.postit-card.color-blue { --postit-paper:#a8ddf1; }
.postit-card.color-green { --postit-paper:#c6e9a8; }
.postit-card.color-pink { --postit-paper:#f5bfd5; }
.postit-card.color-orange { --postit-paper:#ffc987; }
.postit-card.color-white { --postit-paper:#f8f6ed; }
.postit-card {
    background-color:var(--postit-paper,#ffe77a) !important;
    background-image:
        linear-gradient(108deg,rgba(255,255,255,.14),transparent 34%,rgba(90,65,20,.035) 76%,rgba(255,255,255,.08)),
        repeating-linear-gradient(2deg,rgba(75,55,20,.018) 0 1px,transparent 1px 4px),
        repeating-linear-gradient(91deg,rgba(255,255,255,.025) 0 1px,transparent 1px 6px);
    box-shadow:0 7px 16px #2d21113d, inset 0 1px 0 #ffffff55, inset 0 -1px 0 #7b5f2430;
}
/* Geometria canonica: stesso centro di JS e BOARD_PostItLayout. */
.postit-card { transform-origin:50% 50%; }
.postit-card.skin-minimal { background-image:linear-gradient(135deg,rgba(255,255,255,.12),transparent 58%) !important; }


@media (max-width:900px) {
    .board-edit-palette { right:7px; top:54px; }
    .lifecycle-overlay { padding:10px; }
    .lifecycle-row { grid-template-columns:1fr; }
    .lifecycle-actions { justify-content:flex-end; }
}

/* Patch 006 - ricerca rapida sulla lavagna */
.board-search-box-quick {
    grid-template-columns: minmax(180px, 1fr) auto auto;
}

.postit-card.search-no-match {
    opacity: .32;
    filter: saturate(.55);
}

.postit-card.search-match {
    opacity: 1;
    filter: none;
    outline: 3px solid rgba(124, 58, 237, .95);
    outline-offset: 3px;
    box-shadow: 0 0 0 7px rgba(124, 58, 237, .16), 0 12px 30px rgba(0, 0, 0, .20);
}

.postit-search-field-match {
    background-image: linear-gradient(90deg,
        transparent 0,
        transparent var(--search-start, 0px),
        #d8b4fe var(--search-start, 0px),
        #d8b4fe calc(var(--search-start, 0px) + var(--search-width, 100%)),
        transparent calc(var(--search-start, 0px) + var(--search-width, 100%)),
        transparent 100%) !important;
    box-shadow: inset 0 -2px 0 #7c3aed !important;
}

/* Patch 045 - ricerca leggibile anche sui Post-it gialli e sugli altri sfondi chiari. */
::highlight(postit-search) {
    background-color: #d8b4fe;
    color: #2e1065;
}

@media (max-width: 760px) {
    .board-search-box-quick {
        grid-template-columns: 1fr auto;
    }

    .board-search-box-quick .primary-button {
        grid-column: 1 / -1;
    }
}

/* Patch 007 - multi-selezione, gruppi, resize, rotazione, color picker e texture */
.flyout-separator { height:1px; margin:5px 0; background:#d8dde4; }

.color-picker-swatch {
    position:relative;
    width:24px;
    height:24px;
    border-radius:50%;
    border:1px solid #79818c;
    overflow:hidden;
    cursor:pointer;
    display:inline-grid;
    place-items:center;
    background:conic-gradient(#f33,#ff3,#3f3,#3ff,#33f,#f3f,#f33);
    box-shadow:inset 0 0 0 2px #fff;
}
.color-picker-swatch input { position:absolute; inset:-8px; width:42px; height:42px; opacity:0; cursor:pointer; }
.color-picker-swatch span { pointer-events:none; color:#fff; font-weight:900; font-size:12px; text-shadow:0 1px 2px #0008; }

.selection-toolbar {
    position:absolute;
    z-index:18500;
    left:50%;
    transform:translateX(-50%) translateY(-8px);
    display:flex;
    align-items:center;
    gap:6px;
    padding:6px 8px;
    border:1px solid #b8c0ca;
    border-radius:9px;
    background:#f7f9fce8;
    box-shadow:0 8px 22px #0003;
    opacity:0;
    pointer-events:none;
    transition:opacity .12s ease,transform .12s ease;
    backdrop-filter:blur(5px);
}
.selection-toolbar.has-selection { opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.selection-toolbar > span { font-size:10px; white-space:nowrap; }
.postit-selection-toolbar { top:58px; }
.element-selection-toolbar { top:98px; }

.postit-card.is-multi-selected {
    outline:3px solid #3b82f6;
    outline-offset:3px;
    box-shadow:0 13px 26px #0b4e9645, inset 0 1px 0 #ffffff55, inset 0 -1px 0 #7b5f2430;
}
.board-element.is-element-selected {
    outline:2px solid #67a8ff;
    outline-offset:3px;
    box-shadow:0 0 0 4px #2f76c326;
}
.board-element-resize-handle {
    position:absolute;
    right:-6px;
    bottom:-6px;
    width:16px;
    height:16px;
    border-radius:4px;
    border:1px solid #64748b;
    background:linear-gradient(135deg,#fff 0 45%,#64748b 46% 54%,#fff 55% 70%,#64748b 71% 79%,#fff 80%);
    cursor:nwse-resize;
    z-index:8;
}

.board-element-line > .board-element-resize-handle {
    top:50%;
    bottom:auto;
    transform:translateY(-50%);
    cursor:ew-resize;
}

.postit-rotate-handle {
    position:absolute;
    right:34px;
    top:2px;
    left:auto;
    transform:none;
    width:24px;
    height:24px;
    padding:0;
    border-radius:50%;
    border:1px solid #6d737b;
    background:#f9fafbe6;
    color:#374151;
    box-shadow:0 3px 8px #0003;
    cursor:grab;
    z-index:20;
    opacity:0;
    transition:opacity .12s ease;
}
.postit-card:hover .postit-rotate-handle,
.postit-card.is-multi-selected .postit-rotate-handle { opacity:.9; }
.postit-rotate-handle:active { cursor:grabbing; }

/* Carta più percepibile: fibre, micro-grana e bordo leggermente irregolare. */
.postit-card.skin-classic {
    background-image:
        radial-gradient(ellipse at 13% 17%,rgba(88,61,20,.075) 0 .7px,transparent 1.2px),
        radial-gradient(ellipse at 78% 63%,rgba(255,255,255,.18) 0 .7px,transparent 1.2px),
        repeating-linear-gradient(3deg,rgba(73,54,22,.028) 0 1px,transparent 1px 4px),
        repeating-linear-gradient(92deg,rgba(255,255,255,.045) 0 1px,transparent 1px 7px),
        linear-gradient(109deg,rgba(255,255,255,.2),transparent 34%,rgba(83,60,22,.055) 76%,rgba(255,255,255,.1)) !important;
    background-size:13px 17px,19px 23px,auto,auto,auto !important;
    border-color:#6d54222f;
}
.postit-card.skin-classic::after {
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    border-radius:inherit;
    box-shadow:inset 0 0 16px rgba(93,67,24,.07), inset 0 -2px 3px rgba(65,47,20,.08);
    z-index:0;
}
.postit-card.skin-classic > * { position:relative; z-index:1; }
.postit-card.skin-tape {
    background-image:
        repeating-linear-gradient(1deg,rgba(65,48,20,.025) 0 1px,transparent 1px 5px),
        linear-gradient(120deg,rgba(255,255,255,.16),transparent 55%) !important;
}
.postit-card.skin-minimal { background-image:linear-gradient(135deg,rgba(255,255,255,.18),transparent 58%) !important; }

.user-storage-card .section-title { align-items:flex-end; }
.user-usage-track { height:10px; margin-top:10px; }
.postit-card.skin-classic > .postit-rotate-handle { position:absolute; z-index:20; }

/* 008 - UX rapida: autocomplete flottante, lifecycle animation, hotkey. */
.board-user-suggestions {
    position:fixed;
    left:0;
    top:0;
    right:auto;
    width:260px;
    z-index:21000;
    max-height:260px;
    overflow:auto;
    transform:none;
}

.postit-card.is-leaving-board {
    pointer-events:none;
    opacity:0;
    translate:var(--postit-exit-x,0) var(--postit-exit-y,0);
    scale:.22;
    filter:saturate(.55) blur(.35px);
    transition:
        translate .18s cubic-bezier(.4,0,.2,1),
        scale .18s cubic-bezier(.4,0,.2,1),
        opacity .15s ease,
        filter .18s ease;
}

.toolbar-postit-pad,
.toolbar-postit-pad button {
    touch-action:none;
}
.toolbar-postit-pad button { cursor:grab; }
.toolbar-postit-pad:active,
.toolbar-postit-pad button:active { cursor:grabbing; }

.board-hotkeys-flyout { width:min(390px,calc(100vw - 24px)); }
.hotkey-list { display:flex; flex-direction:column; gap:6px; }
.hotkey-row {
    display:grid;
    grid-template-columns:42px 1fr;
    align-items:center;
    gap:9px;
    padding:8px;
    border:1px solid #e3e7ed;
    border-radius:8px;
    background:#f8f9fb;
}
.hotkey-row kbd {
    display:grid;
    place-items:center;
    min-width:34px;
    height:30px;
    padding:0 8px;
    border:1px solid #b9c1cc;
    border-bottom-width:3px;
    border-radius:6px;
    background:#fff;
    color:#273142;
    font:700 13px/1 system-ui,sans-serif;
    box-shadow:0 1px 2px #0001;
}
.hotkey-row span { font-size:11px; line-height:1.35; color:#354052; }
.hotkey-hint { display:block; margin-top:8px; color:#77808d; font-size:9px; }

/* 009 - selezione a rettangolo, focus contestuale, visibilità per colore. */
.board-marquee-selection {
    position:fixed;
    z-index:23500;
    pointer-events:none;
    border:1px solid rgba(48,126,219,.95);
    background:rgba(48,126,219,.16);
    box-shadow:0 0 0 1px rgba(255,255,255,.28) inset;
}

.postit-card.is-context-target,
.board-element.is-context-target {
    z-index:24000 !important;
    outline:3px solid rgba(64,151,255,.95);
    outline-offset:3px;
    box-shadow:0 16px 38px rgba(0,0,0,.42), 0 0 0 5px rgba(64,151,255,.14) !important;
}

.context-menu { z-index:26000; }

.postit-card.is-visibility-hidden { display:none !important; }

.board-visibility-flyout {
    width:min(340px,calc(100vw - 24px));
}
.visibility-actions {
    display:flex;
    justify-content:flex-end;
    margin-bottom:8px;
}
.visibility-color-list {
    display:flex;
    flex-direction:column;
    gap:5px;
    max-height:320px;
    overflow:auto;
}
.visibility-color-row {
    display:grid;
    grid-template-columns:28px minmax(0,1fr) auto;
    align-items:center;
    gap:8px;
    width:100%;
    border:1px solid #e0e4ea;
    border-radius:8px;
    background:#fff;
    padding:6px 8px;
    text-align:left;
}
.visibility-color-row:hover { background:#f4f6f8; }
.visibility-color-row.is-hidden { opacity:.55; }
.visibility-color-row small { color:#6f7782; font-size:9px; }
.visibility-color-swatch {
    display:block;
    width:22px;
    height:22px;
    border-radius:6px;
    border:1px solid rgba(0,0,0,.18);
    box-shadow:0 1px 2px rgba(0,0,0,.14);
}

/* 010 - multi-board / product foundation */
.board-switcher {
    position:fixed;
    top:12px;
    left:14px;
    z-index:22050;
    display:flex;
    align-items:center;
    gap:5px;
    padding:5px;
    border:1px solid rgba(255,255,255,.38);
    border-radius:12px;
    background:rgba(30,34,40,.56);
    backdrop-filter:blur(10px);
    box-shadow:0 8px 24px rgba(0,0,0,.18);
    opacity:.72;
    transition:opacity .15s ease,background .15s ease;
}
.board-switcher:hover,
.board-switcher:focus-within { opacity:1; background:rgba(30,34,40,.82); }
.board-switcher select {
    min-width:150px;
    max-width:240px;
    border:0;
    border-radius:8px;
    background:rgba(255,255,255,.94);
    color:#20242a;
    padding:7px 30px 7px 10px;
    font-size:11px;
    font-weight:700;
}
.board-switcher-add {
    width:30px;
    height:30px;
    border:0;
    border-radius:8px;
    background:#fff;
    color:#20242a;
    font-size:19px;
    line-height:1;
    cursor:pointer;
}
.board-new-board-flyout {
    position:fixed;
    top:56px;
    left:14px;
    right:auto;
    width:min(300px,calc(100vw - 28px));
    z-index:22100;
}
.board-new-board-flyout input { width:100%; margin-bottom:8px; }

.settings-row > span small { display:block; color:#77808d; font-size:9px; margin-top:2px; }

/* 015 - board pinning, resize ruotato, menu batch e admin console coerente */
.board-switcher.board-switcher-inline {
    position:static;
    inset:auto;
    z-index:auto;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    opacity:1;
}
.board-switcher.board-switcher-inline select { min-width:142px; max-width:210px; }
.board-new-board-flyout { top:66px; left:14px; }

.postit-card { resize:none !important; }
.postit-resize-handle {
    position:absolute !important;
    right:-7px;
    bottom:-7px;
    width:18px;
    height:18px;
    z-index:30 !important;
    border:1px solid #667085;
    border-radius:4px;
    background:linear-gradient(135deg,transparent 0 42%,#667085 43% 50%,transparent 51% 62%,#667085 63% 70%,#fff 71%);
    box-shadow:0 1px 4px #0003;
    cursor:nwse-resize;
    opacity:.18;
}
.postit-card:hover .postit-resize-handle,
.postit-card.is-multi-selected .postit-resize-handle { opacity:.9; }
.postit-pin-indicator {
    position:absolute !important;
    z-index:31 !important;
    left:50%;
    top:-13px;
    transform:translateX(-50%);
    font-size:19px;
    line-height:1;
    filter:drop-shadow(0 2px 2px #0005);
    pointer-events:none;
}

.postit-marquee-active,
.postit-marquee-active body,
.postit-marquee-active .postit-board-canvas,
.postit-marquee-active .postit-board-canvas * {
    user-select:none !important;
    -webkit-user-select:none !important;
}
.postit-board-canvas.is-marquee-selecting { cursor:crosshair; }

.selected-contact-chip {
    display:inline-flex;
    align-items:center;
    gap:4px;
    max-width:100%;
    margin-top:4px;
    padding:2px 6px;
    border:1px solid #4f8bd8;
    border-radius:999px;
    background:#e8f2ff;
    color:#244d80;
    font-size:8px;
    font-weight:700;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.selected-contact-chip b { color:#236cc7; }
.selected-contact-chip span { color:#1f8a4c; }

/* layout comune amministrazione: tabella + azioni a destra */
.admin-table-wrap { overflow:auto; border:1px solid #dfe4ea; border-radius:10px; background:#fff; }
.admin-table { width:100%; border-collapse:collapse; font-size:12px; }
.admin-table th,.admin-table td { padding:9px 10px; border-bottom:1px solid #edf0f3; vertical-align:middle; text-align:left; }
.admin-table th { position:sticky; top:0; z-index:2; background:#f4f6f8; color:#4c5665; font-size:10px; text-transform:uppercase; letter-spacing:.03em; }
.admin-table tr:last-child td { border-bottom:0; }
.admin-table tbody tr:hover { background:#fafbfc; }
.admin-table .actions-cell { width:1%; white-space:nowrap; text-align:right; }
.admin-table .actions-cell button { margin-left:4px; }
.admin-status { display:inline-flex; align-items:center; gap:5px; border-radius:999px; padding:2px 7px; background:#eef1f5; font-size:9px; font-weight:800; }
.admin-status.ok { background:#e8f6ed; color:#277143; }
.admin-status.off { background:#f4ecec; color:#965151; }
.admin-help-box { margin:8px 0 12px; padding:9px 11px; border-left:3px solid #4f8bd8; background:#eef5fd; color:#41536b; font-size:11px; line-height:1.45; }

.admin-modal-backdrop { position:fixed; inset:0; z-index:30000; display:grid; place-items:center; padding:24px; background:#11182780; backdrop-filter:blur(3px); }
.admin-modal { width:min(760px,calc(100vw - 32px)); max-height:calc(100vh - 48px); display:flex; flex-direction:column; background:#fff; border:1px solid #d9dfe7; border-radius:12px; box-shadow:0 24px 70px #0005; }
.admin-modal.wide { width:min(1040px,calc(100vw - 32px)); }
.admin-modal > header { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #e6e9ee; }
.admin-modal > header h2 { margin:0; font-size:16px; }
.admin-modal > header button { border:0; background:transparent; font-size:20px; }
.admin-modal-body { overflow:auto; padding:14px; }
.admin-modal-footer { display:flex; align-items:center; justify-content:flex-end; gap:7px; padding:10px 14px; border-top:1px solid #e6e9ee; }
.admin-modal-tabs { display:flex; gap:3px; padding:0 14px; border-bottom:1px solid #e6e9ee; background:#fafbfc; }
.admin-modal-tabs button { border:0; border-bottom:3px solid transparent; background:transparent; padding:9px 11px; font-size:11px; }
.admin-modal-tabs button.active { border-color:#4f8bd8; color:#245f9f; font-weight:800; }
.admin-toolbar { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
.admin-toolbar h2 { margin:0; font-size:15px; }
.admin-action-group { display:flex; gap:5px; justify-content:flex-end; flex-wrap:wrap; }

.asset-preview-mini { width:44px; height:44px; display:grid; place-items:center; border-radius:7px; background:#f2f3f5; overflow:hidden; font-size:26px; }
.asset-preview-mini img { max-width:100%; max-height:100%; object-fit:contain; }

.topnav { align-items:stretch; }
.nav-group { display:flex; align-items:center; gap:2px; position:relative; padding-top:11px; }
.nav-group + .nav-group { margin-left:7px; padding-left:8px; border-left:1px solid #dfe3e8; }
.nav-group-label { position:absolute; top:0; left:7px; color:#8992a0; font-size:6px; font-weight:900; letter-spacing:.06em; white-space:nowrap; }
.vendor-nav .nav-group-label { color:#7855a6; }
.flyout-section-label { display:block; padding:5px 9px 2px; color:#7d8795; font-size:7px; font-weight:900; letter-spacing:.08em; }

/* Patch 015 - runtime theme assets and snap-to-grid settings. */
.postit-card.theme-skin-image {
    background-image:var(--postit-theme-skin) !important;
    background-size:cover !important;
    background-position:center !important;
}
.theme-ui-icon { width:1em; height:1em; object-fit:contain; display:inline-block; vertical-align:-.12em; pointer-events:none; }
.sticker-choice img.sticker-choice-visual { width:56px; height:56px; object-fit:contain; display:block; }
.board-snap-setting { margin-top:8px; }
.board-setting-hint { display:block; margin:-2px 0 8px; color:#68707d; }

/* Patch 017 - board UX, context menu, finestre amministrative e leggibilita'. */
.postit-card {
    overflow:visible !important;
    -webkit-font-smoothing:antialiased;
    text-rendering:geometricPrecision;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
}
.postit-card input,.postit-card textarea,.postit-card select { max-width:100%; }
.postit-task-list { min-width:0; overflow:hidden; }
.postit-task-row { min-width:0; }
.postit-task-row > span { min-width:0; overflow:hidden; text-overflow:ellipsis; }
.postit-pin-indicator {
    top:-18px !important;
    font-size:22px !important;
    z-index:80 !important;
}
.postit-card.is-context-target { z-index:24000 !important; }

.context-menu-layer {
    position:fixed;
    inset:0;
    z-index:25990;
    background:transparent;
    pointer-events:none;
}
.context-menu {
    z-index:26000 !important;
    min-width:158px !important;
    width:max-content;
    max-width:220px;
    pointer-events:auto;
}
.context-menu > button { white-space:nowrap; }
.context-menu > button:disabled { opacity:.42; cursor:not-allowed; }
.context-menu .context-label { max-width:205px; }

.lifecycle-actions > .mini-button,
.lifecycle-actions > .primary-button,
.lifecycle-actions > .secondary-button {
    min-width:82px;
    justify-content:center;
}

.visibility-color-row:disabled,
.visibility-color-row.is-disabled {
    opacity:.42;
    cursor:not-allowed;
}

.admin-modal {
    min-width:min(420px,calc(100vw - 24px));
    min-height:220px;
    resize:both;
    overflow:hidden;
}
.admin-modal > header {
    justify-content:flex-start;
    gap:2px;
    cursor:move;
    user-select:none;
}
.admin-modal > header h2 { margin-right:auto; }
.admin-modal > header button,
.admin-modal-maximize {
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    padding:0 !important;
    border:0 !important;
    border-radius:6px;
    background:transparent !important;
    color:#394150;
    cursor:pointer;
    font-size:19px !important;
    line-height:1;
}
.admin-modal > header button:hover,
.admin-modal-maximize:hover { background:#eef1f5 !important; }
.admin-modal.is-maximized {
    position:fixed !important;
    inset:10px !important;
    width:auto !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    resize:none !important;
    border-radius:9px;
}
.admin-modal.is-maximized .admin-modal-body { flex:1 1 auto; }
.admin-modal.is-user-positioned { max-height:none; }

.theme-editor-steps {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:8px;
    margin:0 0 12px;
}
.theme-editor-step {
    padding:10px;
    border:1px solid #dfe4ea;
    border-radius:9px;
    background:#fafbfc;
    font-size:10px;
    line-height:1.4;
}
.theme-editor-step b { display:block; margin-bottom:3px; color:#315f91; }
.asset-library-head { display:flex; justify-content:space-between; align-items:flex-end; gap:10px; margin:16px 0 8px; }
.asset-library-head h2 { margin:0; font-size:15px; }
.asset-library-head p { margin:2px 0 0; color:#737d8a; font-size:10px; }
.asset-guide { display:grid; gap:6px; margin:0 0 10px; }
.asset-guide strong { font-size:11px; }
.asset-guide small { color:#667085; line-height:1.45; }
.asset-preview-large {
    width:96px;
    height:96px;
    display:grid;
    place-items:center;
    margin:4px 0 10px;
    overflow:hidden;
    border:1px solid #dfe4ea;
    border-radius:10px;
    background:#f7f8fa;
    font-size:46px;
}
.asset-preview-large img { max-width:100%; max-height:100%; object-fit:contain; }

@media (max-width:800px) {
    .theme-editor-steps { grid-template-columns:1fr; }
    .admin-modal { min-width:calc(100vw - 24px); resize:none; }
}

/* 017 - finestre di modifica Post-it: resize, drag e massimizzazione */
.postit-detail {
    min-width:min(420px,calc(100vw - 24px));
    min-height:300px;
    resize:both;
    overflow:hidden;
}
.postit-detail > header {
    cursor:move;
    user-select:none;
}
.postit-detail > header > div:first-child { margin-right:auto; }
.postit-detail > header .admin-modal-maximize {
    flex:0 0 30px;
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    padding:0 !important;
    border:0 !important;
    border-radius:6px;
    background:transparent !important;
    color:#394150;
    cursor:pointer;
    font-size:19px !important;
    line-height:1;
}
.postit-detail > header .admin-modal-maximize:hover { background:#eef1f5 !important; }
.postit-detail.is-maximized {
    position:fixed !important;
    inset:10px !important;
    width:auto !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    resize:none !important;
    border-radius:9px;
}
.postit-detail.is-user-positioned { max-height:none; }
@media (max-width:800px) {
    .postit-detail { min-width:calc(100vw - 24px); resize:none; }
}


/* Patch 018 - menu contestuale, libreria oggetti e cancellazione lavagna. */
.context-menu { pointer-events:auto !important; }
.board-switcher-delete {
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    border:1px solid #d6dbe2;
    border-radius:7px;
    background:#fff;
    color:#9b3131;
    cursor:pointer;
}
.board-switcher-delete:hover { background:#fff2f2; border-color:#e8b8b8; }
.board-delete-summary {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
    margin:10px 0;
}
.board-delete-summary > div { padding:9px; border:1px solid #e1e5ea; border-radius:8px; background:#f8f9fb; }
.board-delete-summary b { display:block; font-size:17px; }
.board-delete-options { display:grid; gap:9px; margin-top:12px; }
.board-delete-option {
    display:grid;
    grid-template-columns:auto 1fr;
    gap:8px;
    align-items:start;
    padding:10px;
    border:1px solid #dfe4ea;
    border-radius:9px;
    cursor:pointer;
}
.board-delete-option:has(input:checked) { border-color:#7398c4; background:#f2f7fc; }
.board-delete-option strong,.board-delete-option small { display:block; }
.board-delete-option small { margin-top:2px; color:#667085; }
.board-delete-target { margin:8px 0 0 27px; max-width:420px; }
.board-delete-danger { color:#a12f2f; }

.library-object-section { margin-top:16px; }
.library-object-section > h3 { margin-bottom:3px; }
.library-object-section > p { margin:0 0 8px; color:#68707d; font-size:11px; }
.library-object-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:8px; }
.library-object-card {
    min-width:0;
    padding:7px;
    border:1px solid #dfe4ea;
    border-radius:9px;
    background:#fff;
    cursor:pointer;
    text-align:center;
}
.library-object-card:hover { border-color:#93afd0; background:#f7faff; }
.library-object-preview { width:64px; height:64px; margin:0 auto 5px; display:grid; place-items:center; font-size:36px; overflow:hidden; }
.library-object-preview img { width:100%; height:100%; object-fit:contain; }
.library-object-card small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.free-bundle-list { display:grid; gap:7px; margin-top:8px; }
.free-bundle-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 9px; border:1px solid #dfe4ea; border-radius:9px; background:#fafbfc; }
.free-bundle-row span { min-width:0; }
.free-bundle-row strong,.free-bundle-row small { display:block; }
.free-bundle-row small { color:#697381; }

.asset-library-tabs { display:flex; flex-wrap:wrap; gap:5px; margin:8px 0; }
.asset-library-tabs button { border:1px solid #d9dfe7; border-radius:999px; background:#fff; padding:5px 9px; cursor:pointer; font-size:10px; }
.asset-library-tabs button.active { background:#315f91; border-color:#315f91; color:#fff; }
.theme-association-head { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin:14px 0 7px; }
.theme-association-head h3,.theme-association-head p { margin:0; }
.theme-association-head p { margin-top:2px; color:#667085; font-size:10px; }
.theme-asset-select-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:7px; max-height:360px; overflow:auto; padding:2px; }
.theme-asset-select-card { display:grid; grid-template-columns:auto 48px 1fr; align-items:center; gap:7px; padding:7px; border:1px solid #dfe4ea; border-radius:8px; background:#fff; cursor:pointer; }
.theme-asset-select-card.selected { border-color:#7398c4; background:#f2f7fc; }
.theme-asset-select-card span,.theme-asset-select-card strong,.theme-asset-select-card small { min-width:0; }
.theme-asset-select-card strong,.theme-asset-select-card small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.theme-asset-select-card small { color:#68707d; }
.asset-preview-mini { width:44px; height:44px; display:grid; place-items:center; overflow:hidden; font-size:26px; }
.asset-preview-mini img { max-width:100%; max-height:100%; object-fit:contain; }

@media (max-width:700px) {
    .board-delete-summary { grid-template-columns:1fr; }
    .theme-asset-select-grid { grid-template-columns:1fr; }
}

.board-delete-confirm { background:#a93636 !important; border-color:#a93636 !important; }
.board-delete-confirm:hover { background:#922d2d !important; border-color:#922d2d !important; }

/* 018 - zoom, selezione mista, sfondo per board e spray */
.postit-board-canvas {
    transition: transform .16s ease, width .16s ease, height .16s ease;
}
.inbox-panel { top:68px; }
.board-element.is-element-selected { cursor:move; touch-action:none; }
.board-spray-svg {
    display:block;
    width:100%;
    height:100%;
    overflow:visible;
    pointer-events:none;
}
.board-element-spray { background:transparent !important; }
.board-spray-preview {
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    overflow:visible;
    pointer-events:none;
    z-index:50000;
}
.board-spray-settings {
    position:fixed;
    z-index:15100;
    left:12px;
    top:74px;
    width:250px;
    padding:9px;
    border:1px solid #d7dde5;
    border-radius:10px;
    background:#fffffff2;
    backdrop-filter:blur(10px);
    box-shadow:0 12px 28px #0003;
}
.board-spray-settings header { display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.board-spray-settings header button { border:0; background:transparent; font-size:19px; min-height:0; padding:0 4px; }
.board-spray-settings label { display:grid; grid-template-columns:82px minmax(0,1fr); gap:7px; align-items:center; margin:6px 0; font-size:10px; }
.board-spray-settings input[type="color"] { width:100%; min-height:30px; padding:2px; }
.board-spray-settings input[type="range"] { width:100%; }
.board-spray-settings small { display:block; margin-top:7px; color:#667085; font-size:9px; line-height:1.35; }
.board-edit-palette button.active { background:#dcecff; border-color:#6d9ed9; }
.board-setting-group { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px; align-items:end; margin-bottom:8px; }
.board-setting-group label { min-width:0; }
.board-setting-group label span,.board-zoom-control > span { display:block; margin-bottom:3px; font-size:10px; color:#596273; }
.board-setting-group input { width:100%; }
.board-zoom-control { margin:9px 0; }
.board-zoom-control > div { display:grid; grid-template-columns:30px minmax(90px,1fr) 30px 42px; gap:5px; align-items:center; }
.board-zoom-control button { min-height:28px; padding:0; }
.board-zoom-control input[type="range"] { width:100%; }
.board-zoom-control b { font-size:10px; text-align:right; }
.context-range { display:grid; grid-template-columns:54px minmax(90px,1fr) 38px; align-items:center; gap:6px; padding:4px 7px 7px; font-size:9px; }
.context-range input { width:100%; }
.context-range b { text-align:right; font-size:9px; }
.board-zoom-hud {
    position:fixed;
    z-index:14950;
    right:12px;
    bottom:12px;
    display:flex;
    align-items:center;
    gap:3px;
    padding:4px;
    border:1px solid #ffffff55;
    border-radius:9px;
    background:#ffffffcc;
    backdrop-filter:blur(8px);
    box-shadow:0 6px 18px #0002;
    opacity:.66;
    transition:opacity .15s ease;
}
.board-zoom-hud:hover { opacity:1; }
.board-zoom-hud button { min-width:28px; height:28px; min-height:0; padding:0 6px; border:1px solid #d5dae2; border-radius:6px; background:#fff; }
.board-zoom-hud .board-zoom-value { min-width:50px; font-size:9px; font-weight:800; }
.board-element:not(.is-editable) .board-element-text { pointer-events:none; }