:root{
  --bg:#f4f6fb;
  --surface:#ffffff;
  --surface-soft:#f7f8fc;
  --border:#e8ebf3;
  --border-strong:#d8deeb;
  --text:#1c2340;
  --muted:#6e7693;
  --muted-soft:#a0a8c0;

  --blue:#5b6cff;
  --green:#19c37d;
  --violet:#7b61ff;
  --orange:#ff9f43;
  --pink:#e955a3;
  --cyan:#27b8d0;
  --yellow:#f7a51d;
  --red:#f05252;

  --font-main:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --sidebar-width:200px;
  --radius-xs:8px;
  --radius-sm:11px;
  --radius-md:14px;
  --radius-lg:20px;
  --shadow:0 8px 24px rgba(78,91,140,.08);
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

html,
body{
  min-height:100%;
}

body.embedded{
  width:100%;
}

body{
  min-height:100vh;
  display:flex;
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-main);
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}

body,
body *{
  -webkit-user-select:text;
  user-select:text;
}

button,
input,
textarea,
select{
  font:inherit;
}

button{
  cursor:pointer;
}

a{
  color:inherit;
  text-decoration:none;
}

/* ===== Sidebar ===== */

.sb{
  width:var(--sidebar-width);
  min-width:var(--sidebar-width);
  height:100vh;
  min-height:100vh;
  position:sticky;
  top:0;
  display:flex;
  flex-direction:column;
  flex-shrink:0;
  background:rgba(255,255,255,.82);
  border-right:1px solid rgba(224,229,242,.95);
}

.logo{
  padding:14px 14px 12px;
  border-bottom:1px solid rgba(230,234,244,.95);
}

.logo-n{
  font-size:24px;
  line-height:1.06;
  font-weight:800;
  letter-spacing:-.9px;
  background:linear-gradient(135deg,#6d3df5 0%,#5b6cff 45%,#7f56d9 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.nv{
  flex:1;
  overflow-y:auto;
  padding:9px 7px;
}

.nav-group{
  background:transparent;
  border:1px solid #eceff7;
  border-radius:var(--radius-md);
  padding:5px;
  margin:0 0 8px;
}

.nav-sep{
  height:1px;
  background:#eceff7;
  margin:5px 4px;
}

.ni{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:32px;
  padding:8px 10px;
  border-radius:var(--radius-sm);
  color:#68718e;
  font-size:14px;
  font-weight:500;
  line-height:1.1;
  transition:background .15s,color .15s;
}

.ni:hover{
  background:#f5f7fc;
  color:var(--text);
}

.ni.ac{
  background:linear-gradient(135deg,rgba(109,61,245,.11),rgba(91,108,255,.08));
  color:#4438ca;
  font-weight:600;
}

.dot{
  width:10px;
  height:10px;
  flex:0 0 10px;
  border-radius:50%;
  background:var(--nav-color,var(--blue));
  opacity:.9;
  -webkit-user-select:none;
  user-select:none;
}

.sf{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
  padding:9px 8px 10px;
  border-top:1px solid rgba(230,234,244,.95);
  background:rgba(255,255,255,.88);
}

.sf-r{
  min-height:36px;
  padding:8px 7px;
  border:1px solid #e6eaf5;
  border-radius:var(--radius-md);
  background:#fff;
  color:var(--text);
  font-size:13px;
  font-weight:500;
  line-height:1.1;
  text-align:center;
  transition:background .15s,border-color .15s;
}

.sf-r:hover{
  background:#f7f9ff;
  border-color:#d9def0;
}

.sf-r.danger{
  color:#d92d20;
  background:#fff7f7;
  border-color:#ffd5d2;
  font-weight:600;
}

/* ===== Main ===== */

.mn-w{
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}

.tb{
  display:none;
}

.ct{
  flex:1;
  padding:10px 14px 14px;
}

.page-card{
  background:rgba(255,255,255,.88);
  border:1px solid rgba(231,235,246,.95);
  border-radius:var(--radius-lg);
  padding:8px;
}

.placeholder{
  min-height:105px;
  display:grid;
  place-items:center;
  padding:12px;
  border:1px dashed #d8deed;
  border-radius:16px;
  background:rgba(255,255,255,.76);
  color:#7d86a5;
  font-size:13px;
  line-height:1.45;
  text-align:center;
}

.placeholder strong{
  display:block;
  margin-bottom:4px;
  color:var(--text);
  font-size:15px;
  font-weight:700;
}

/* ===== Common UI ===== */

.stack{
  display:grid;
  gap:10px;
}

.row{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.panel{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  padding:12px;
}

.panel-title{
  margin-bottom:8px;
  font-size:15px;
  font-weight:700;
  letter-spacing:-.2px;
}

.label{
  display:block;
  margin-bottom:5px;
  color:var(--muted-soft);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.input,
.select{
  min-height:38px;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  color:var(--text);
  font-size:14px;
  outline:none;
}

.input:focus,
.select:focus{
  border-color:#cfd8ee;
}

.btn{
  min-height:38px;
  padding:8px 12px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-md);
  background:#fff;
  color:var(--text);
  font-size:14px;
  font-weight:600;
}

.btn:hover{
  background:var(--surface-soft);
}

.btn.primary{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#6d3df5 0%,#4f6df5 100%);
}

.btn.danger{
  color:#d92d20;
  background:#fff7f7;
  border-color:#ffd5d2;
}

.color-preview{
  width:38px;
  height:38px;
  border:1px solid var(--border-strong);
  border-radius:var(--radius-md);
  background:var(--preview-color,#ffffff);
}

.swatch-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.swatch{
  width:28px;
  height:28px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:999px;
  background:var(--swatch-color,#ffffff);
}

.palette-card{
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  padding:10px;
}

.palette-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
}

.palette-name{
  font-size:14px;
  font-weight:700;
}

.muted{
  color:var(--muted);
  font-size:13px;
}

.notice{
  padding:10px 12px;
  border:1px solid #dbe2f0;
  border-radius:var(--radius-md);
  background:#fbfcff;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

@media (max-width:860px){
  body{
    display:block;
  }

  .sb{
    position:relative;
    width:100%;
    min-width:0;
    height:auto;
    min-height:0;
    border-right:0;
    border-bottom:1px solid var(--border);
  }

  .ct{
    padding:10px;
  }
}

/* ===== Notes module v3 ===== */
.notes-page{
  display:grid;
  gap:10px;
}

.notes-head,
.notes-tools{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.seg-tabs{
  display:flex;
  align-items:center;
  gap:4px;
  flex-wrap:wrap;
  width:fit-content;
  max-width:100%;
  padding:4px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.72);
}

.seg-btn,
.tool-btn,
.chip-btn{
  min-height:32px;
  padding:7px 11px;
  border:1px solid transparent;
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
}

.seg-btn:hover,
.tool-btn:hover,
.chip-btn:hover{
  background:#fff;
  color:var(--text);
}

.seg-btn.active,
.tool-btn.active,
.chip-btn.active{
  background:#fff;
  color:#4f46e5;
  border-color:#eef1f8;
}

.reset-note-sizes{
  margin-left:4px;
  color:#5f6680;
}

.reset-note-sizes:disabled{
  opacity:.42;
  cursor:not-allowed;
}

.notes-search{
  width:190px;
  min-height:34px;
}

.chip-strip{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
}

.chip-btn{
  min-height:30px;
  padding:6px 10px;
  border-color:var(--border);
  background:#fff;
  font-size:12px;
}

.tools-right{
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
  margin-left:auto;
}

.mini-label{
  color:var(--muted-soft);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}

.note-grid{
  display:flex;
  align-items:flex-start;
  flex-wrap:wrap;
  gap:12px;
}

.note-card{
  position:relative;
  display:flex;
  flex:0 0 var(--note-card-width,calc((100% - 36px) / 4));
  flex-direction:column;
  width:var(--note-card-width,calc((100% - 36px) / 4));
  max-width:100%;
  height:148px;
  min-height:148px;
  min-width:min(220px,100%);
  overflow:hidden;
  box-sizing:border-box;
  border:1px solid rgba(231,235,246,.95);
  border-radius:18px;
  background:var(--note-bg,#fff);
}

.note-card.has-custom-size .note-content,
.note-card.resizing .note-content{
  height:100% !important;
}

.note-card.resizing{
  user-select:none;
}

.note-resize-handle{
  position:absolute;
  right:2px;
  bottom:2px;
  z-index:5;
  width:18px;
  height:18px;
  cursor:nwse-resize;
  touch-action:none;
}

.note-resize-handle::after{
  content:"";
  position:absolute;
  right:3px;
  bottom:3px;
  width:8px;
  height:8px;
  border-right:2px solid #aab4ca;
  border-bottom:2px solid #aab4ca;
  opacity:.8;
}

.note-card.dragging{
  opacity:.45;
}

.note-card.drag-over{
  outline:2px dashed #91a1ff;
  outline-offset:2px;
}

.priority-line{
  display:none;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  background:linear-gradient(180deg,#ffb648 0%,#ff8c42 100%);
}

.note-card.priority .priority-line{
  display:block;
}

.drag-handle{
  position:absolute;
  top:6px;
  right:8px;
  border:0;
  background:transparent;
  color:var(--muted-soft);
  font-size:12px;
  line-height:1;
}

.note-card-body{
  flex:1;
  padding:12px 14px 5px;
  overflow:hidden;
}

.note-content{
  height:94px;
  overflow:hidden;
  color:var(--text);
  font-size:13px;
  line-height:1.45;
  word-break:break-word;
}

.note-content table,
.rich-editor table{
  width:100%;
  border-collapse:collapse;
  margin:4px 0;
  font-size:12px;
}

.note-content td,
.note-content th,
.rich-editor td,
.rich-editor th{
  min-width:50px;
  padding:4px 6px;
  border:1px solid var(--border);
  text-align:left;
  vertical-align:top;
}

.note-card-footer{
  display:flex;
  align-items:center;
  gap:6px;
  width:100%;
  min-height:34px;
  padding:6px 12px 8px;
  border:0;
  border-top:1px solid rgba(0,0,0,.06);
  background:transparent;
  text-align:left;
}

.note-card-footer:hover{
  background:rgba(255,255,255,.45);
}

.note-tag{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:3px 8px;
  border-radius:999px;
  background:#eef2ff;
  color:#5b6cff;
  font-family:var(--font-mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.note-priority{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:19px;
  height:19px;
  border-radius:999px;
  background:#fff4d6;
  color:#f59e0b;
  font-size:10px;
}

.note-date{
  margin-left:auto;
  color:var(--muted-soft);
  font-family:var(--font-mono);
  font-size:10px;
}

.notes-page[data-scale="normal"] .note-grid{
  gap:14px;
}

.notes-page[data-scale="normal"] .note-card{
  flex-basis:var(--note-card-width,calc((100% - 28px) / 3));
  width:var(--note-card-width,calc((100% - 28px) / 3));
  height:190px;
  min-height:190px;
  border-radius:20px;
}

.notes-page[data-scale="normal"] .note-card-body{
  padding:16px 18px 8px;
}

.notes-page[data-scale="normal"] .note-content{
  height:132px;
  font-size:14px;
  line-height:1.62;
}

.notes-page[data-scale="large"] .note-grid{
  gap:16px;
}

.notes-page[data-scale="large"] .note-card{
  flex-basis:var(--note-card-width,calc((100% - 16px) / 2));
  width:var(--note-card-width,calc((100% - 16px) / 2));
  height:260px;
  min-height:260px;
  border-radius:22px;
}

.notes-page[data-scale="large"] .note-card-body{
  padding:18px 20px 10px;
}

.notes-page[data-scale="large"] .note-content{
  height:198px;
  font-size:15px;
  line-height:1.7;
}

.empty-state{
  flex:1 0 100%;
  grid-column:1/-1;
  display:grid;
  place-items:center;
  min-height:120px;
  border:1px dashed #d8deed;
  border-radius:18px;
  background:rgba(255,255,255,.76);
  color:var(--muted);
  font-size:13px;
}

.modal-layer{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(15,15,18,.45);
}

.modal-layer[hidden]{
  display:none;
}

.modal-card{
  width:700px;
  max-width:96vw;
  max-height:92vh;
  overflow:auto;
  padding:18px;
  border:1px solid var(--border);
  border-radius:24px;
  background:rgba(255,255,255,.97);
}

.manager-modal{
  width:620px;
}

.modal-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:14px;
}

.modal-head h2{
  font-size:18px;
  font-weight:800;
  letter-spacing:-.4px;
}

.form-grid{
  display:grid;
  gap:10px;
  margin-bottom:12px;
}

.form-grid.two{
  grid-template-columns:1fr 1fr;
}

.inline-control{
  display:flex;
  align-items:center;
  gap:8px;
}

.inline-control .select,
.inline-control .input{
  flex:1;
  min-width:0;
}

.btn.icon{
  width:38px;
  min-width:38px;
  padding:0;
}

.btn.small{
  min-height:32px;
  padding:6px 10px;
  font-size:13px;
}

.note-meta-row{
  align-items:end;
}

.priority-check{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  color:var(--muted);
  font-size:13px;
  font-weight:600;
}

.bg-list{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  flex-wrap:wrap;
}

.bg-dot,
.text-color{
  width:24px;
  height:24px;
  border:2px solid #fff;
  border-radius:999px;
  background:var(--bg-dot,#fff);
  box-shadow:0 0 0 1px #dbe2f0;
}

.bg-dot.active,
.text-color:focus{
  box-shadow:0 0 0 2px #fff,0 0 0 4px #1f2a44;
}

.text-color{
  width:22px;
  height:22px;
  background:var(--text-color,#000);
}

.editor-toolbar{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:8px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fafbfe;
}

.editor-btn{
  min-width:34px;
  min-height:32px;
  padding:6px 9px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#fff;
  color:#4b5573;
  font-size:13px;
  font-weight:700;
}

.editor-btn:hover,
.editor-btn.active{
  background:#f4f7ff;
}

.rich-editor{
  min-height:230px;
  padding:14px 16px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  color:var(--text);
  font-size:15px;
  line-height:1.65;
  outline:none;
}

.rich-editor:focus{
  border-color:#cfd8ee;
}

.rich-editor font[size="1"]{font-size:11px;}
.rich-editor font[size="3"]{font-size:15px;}
.rich-editor font[size="5"]{font-size:19px;}

.modal-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid var(--border);
}

.modal-actions.split{
  justify-content:space-between;
}

.dirty{
  color:var(--muted-soft);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:600;
}

.add-row{
  margin-bottom:12px;
}

.manager-list{
  display:grid;
  gap:8px;
}

.manager-row{
  display:flex;
  align-items:center;
  gap:7px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fbfcff;
}

.manager-index{
  width:22px;
  color:var(--muted-soft);
  font-family:var(--font-mono);
  font-size:10px;
  text-align:center;
}

.manager-input{
  flex:1;
  min-width:0;
}

@media (max-width:1400px){
  .note-card{
    flex-basis:var(--note-card-width,calc((100% - 24px) / 3));
    width:var(--note-card-width,calc((100% - 24px) / 3));
  }
}

@media (max-width:980px){
  .note-card,
  .notes-page[data-scale="normal"] .note-card,
  .notes-page[data-scale="large"] .note-card{
    flex-basis:var(--note-card-width,calc((100% - 14px) / 2));
    width:var(--note-card-width,calc((100% - 14px) / 2));
  }

  .tools-right{
    margin-left:0;
  }
}

@media (max-width:680px){
  .note-card,
  .notes-page[data-scale="normal"] .note-card,
  .notes-page[data-scale="large"] .note-card{
    flex-basis:var(--note-card-width,100%);
    width:var(--note-card-width,100%);
  }

  .form-grid.two{
    grid-template-columns:1fr;
  }

  .modal-actions.split{
    align-items:stretch;
    flex-direction:column;
  }
}


/* workbook_modular_v5 — compact category badge in note footer */
.note-card-footer{
  gap:5px !important;
}

.note-section{
  display:inline-flex !important;
  align-items:center !important;
  max-width:120px !important;
  min-height:20px !important;
  padding:3px 8px !important;
  border-radius:999px !important;
  background:#eef2ff !important;
  color:#5b6cff !important;
  font-family:var(--font-mono) !important;
  font-size:9px !important;
  font-weight:700 !important;
  letter-spacing:.04em !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  flex:0 1 auto !important;
}

.note-tag{
  flex:0 1 auto !important;
}

.note-date{
  margin-left:auto !important;
  flex:0 0 auto !important;
}


/* workbook_modular_v6 — category badge visually separated from tag */
.note-section{
  background:#f2f4f7 !important;
  color:#667085 !important;
}


/* ===== Prompts module v7 ===== */
.prompts-page{
  display:grid;
  gap:10px;
}

.prompt-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.prompt-card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:148px;
  min-height:148px;
  overflow:hidden;
  border:1px solid rgba(231,235,246,.95);
  border-radius:18px;
  background:rgba(255,255,255,.88);
}

.prompt-card.dragging{
  opacity:.45;
}

.prompt-card.drag-over{
  outline:2px dashed #91a1ff;
  outline-offset:2px;
}

.prompt-card.priority .priority-line{
  display:block;
}

.prompt-card-body{
  flex:1;
  padding:12px 14px 5px;
  overflow:hidden;
}

.prompt-title{
  margin-bottom:5px;
  color:var(--text);
  font-size:15px;
  font-weight:700;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.prompt-text{
  height:72px;
  overflow:hidden;
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.45;
  white-space:pre-wrap;
  word-break:break-word;
}

.prompt-card-footer{
  display:flex;
  align-items:center;
  gap:5px;
  width:100%;
  min-height:34px;
  padding:6px 12px 8px;
  border:0;
  border-top:1px solid rgba(0,0,0,.06);
  background:transparent;
  text-align:left;
  overflow:hidden;
}

.prompt-card-footer:hover{
  background:rgba(255,255,255,.45);
}

.prompt-category-badge{
  max-width:120px !important;
}

.prompt-model{
  display:inline-flex;
  align-items:center;
  max-width:92px;
  min-height:20px;
  padding:3px 8px;
  border-radius:999px;
  font-family:var(--font-mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:.04em;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:0 1 auto;
}

.prompt-model.model-cl{
  background:#f3eeff;
  color:#7c3aed;
}

.prompt-model.model-gpt{
  background:#edfaf4;
  color:#0ea84f;
}

.prompt-model.model-gm{
  background:#fffbeb;
  color:#b45309;
}

.prompt-model.model-oth{
  background:#f2f4f7;
  color:#667085;
}

.prompts-page[data-scale="normal"] .prompt-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.prompts-page[data-scale="normal"] .prompt-card{
  height:190px;
  min-height:190px;
  border-radius:20px;
}

.prompts-page[data-scale="normal"] .prompt-card-body{
  padding:16px 18px 8px;
}

.prompts-page[data-scale="normal"] .prompt-title{
  font-size:18px;
}

.prompts-page[data-scale="normal"] .prompt-text{
  height:112px;
  font-size:13px;
  line-height:1.55;
}

.prompts-page[data-scale="large"] .prompt-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.prompts-page[data-scale="large"] .prompt-card{
  height:260px;
  min-height:260px;
  border-radius:22px;
}

.prompts-page[data-scale="large"] .prompt-card-body{
  padding:18px 20px 10px;
}

.prompts-page[data-scale="large"] .prompt-title{
  font-size:21px;
}

.prompts-page[data-scale="large"] .prompt-text{
  height:178px;
  font-size:14px;
  line-height:1.62;
}

.prompt-modal-card{
  width:720px;
}

.prompt-priority-row{
  align-self:end;
}

.prompt-textarea{
  width:100%;
  min-height:150px;
  max-height:420px;
  resize:none;
  overflow:hidden;
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.7;
}

.translation-panel{
  display:grid;
  gap:8px;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fbfcff;
}

.translation-output{
  min-height:54px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
  color:var(--text);
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.65;
  white-space:pre-wrap;
  word-break:break-word;
}

@media (max-width:1400px){
  .prompt-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:980px){
  .prompt-grid,
  .prompts-page[data-scale="normal"] .prompt-grid,
  .prompts-page[data-scale="large"] .prompt-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:680px){
  .prompt-grid,
  .prompts-page[data-scale="normal"] .prompt-grid,
  .prompts-page[data-scale="large"] .prompt-grid{
    grid-template-columns:1fr;
  }
}


/* ===== Discord module v8 ===== */
.discord-page{
  display:grid;
  gap:10px;
}

.discord-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.discord-card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:148px;
  min-height:148px;
  overflow:hidden;
  border:1px solid rgba(231,235,246,.95);
  border-radius:18px;
  background:rgba(255,255,255,.88);
}

.discord-card.done{
  opacity:.55;
}

.discord-card.dragging{
  opacity:.45;
}

.discord-card.drag-over{
  outline:2px dashed #91a1ff;
  outline-offset:2px;
}

.discord-card.priority .priority-line{
  display:block;
}

.discord-card-body{
  flex:1;
  padding:12px 14px 5px;
  overflow:hidden;
}

.discord-title{
  margin-bottom:5px;
  color:var(--text);
  font-size:15px;
  font-weight:700;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.discord-card.done .discord-title{
  text-decoration:line-through;
}

.discord-text{
  height:72px;
  overflow:hidden;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  white-space:normal;
  word-break:break-word;
}

.discord-text ul,
.discord-text ol{
  padding-left:18px;
}

.discord-card-footer{
  display:flex;
  align-items:center;
  gap:5px;
  width:100%;
  min-height:34px;
  padding:6px 12px 8px;
  border:0;
  border-top:1px solid rgba(0,0,0,.06);
  background:transparent;
  text-align:left;
  overflow:hidden;
}

.discord-card-footer:hover{
  background:rgba(255,255,255,.45);
}

.discord-type-badge{
  max-width:120px !important;
}

.discord-status-badge{
  display:inline-flex;
  align-items:center;
  max-width:92px;
  min-height:20px;
  padding:3px 8px;
  border-radius:999px;
  font-family:var(--font-mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:.04em;
  line-height:1;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:0 1 auto;
}

.discord-status-badge.open{
  background:#eef2ff;
  color:#5b6cff;
}

.discord-status-badge.done{
  background:#edfaf4;
  color:#0ea84f;
}

.discord-page[data-scale="normal"] .discord-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.discord-page[data-scale="normal"] .discord-card{
  height:190px;
  min-height:190px;
  border-radius:20px;
}

.discord-page[data-scale="normal"] .discord-card-body{
  padding:16px 18px 8px;
}

.discord-page[data-scale="normal"] .discord-title{
  font-size:18px;
}

.discord-page[data-scale="normal"] .discord-text{
  height:112px;
  font-size:14px;
  line-height:1.55;
}

.discord-page[data-scale="large"] .discord-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.discord-page[data-scale="large"] .discord-card{
  height:260px;
  min-height:260px;
  border-radius:22px;
}

.discord-page[data-scale="large"] .discord-card-body{
  padding:18px 20px 10px;
}

.discord-page[data-scale="large"] .discord-title{
  font-size:21px;
}

.discord-page[data-scale="large"] .discord-text{
  height:178px;
  font-size:15px;
  line-height:1.62;
}

.discord-modal-card{
  width:700px;
}

.rich-editor{
  min-height:180px;
  max-height:420px;
  overflow:auto;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fff;
  color:var(--text);
  font-size:14px;
  line-height:1.65;
  outline:none;
}

.rich-editor:focus{
  border-color:#cfd8ee;
}

.rich-editor ul,
.rich-editor ol{
  padding-left:22px;
}

.editor-toolbar{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  padding:8px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:#fbfcff;
}

@media (max-width:1400px){
  .discord-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:980px){
  .discord-grid,
  .discord-page[data-scale="normal"] .discord-grid,
  .discord-page[data-scale="large"] .discord-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:680px){
  .discord-grid,
  .discord-page[data-scale="normal"] .discord-grid,
  .discord-page[data-scale="large"] .discord-grid{
    grid-template-columns:1fr;
  }
}


/* ===== File Name module v10 ===== */
.file-name-page{
  display:grid;
  gap:10px;
}

.file-template-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.file-age-card{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid rgba(231,235,246,.95);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.88);
}

.file-age-head{
  display:flex;
  align-items:center;
  gap:8px;
}

.file-age-title{
  color:var(--text);
  font-size:15px;
  font-weight:800;
  letter-spacing:-.2px;
}

.file-age-suffix{
  margin-left:auto;
  padding:3px 8px;
  border-radius:999px;
  background:#f2f4f7;
  color:#667085;
  font-family:var(--font-mono);
  font-size:9px;
  font-weight:700;
  letter-spacing:.04em;
  white-space:nowrap;
}

.file-age-fields{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.file-input{
  width:100%;
}

.file-results{
  display:grid;
  gap:6px;
}

.file-result-row{
  display:grid;
  grid-template-columns:22px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:7px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  background:#fff;
}

.file-row-index{
  color:var(--muted-soft);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:700;
}

.file-result-text{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--text);
  font-family:var(--font-mono);
  font-size:13px;
  font-weight:600;
}

.file-static{
  color:#7b86a5;
  font-weight:500;
}

.file-variable{
  color:#ff8c42;
  font-weight:800;
}

.copy-btn{
  min-height:28px;
  padding:5px 10px;
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:#f4eefe;
  color:#8b5cf6;
  font-size:12px;
  font-weight:700;
}

.copy-btn.ok{
  background:#ecfdf3;
  color:#16a34a;
}

.copy-btn.disabled{
  opacity:.45;
  cursor:default;
}

.parsed-panel{
  display:grid;
  gap:10px;
  min-height:420px;
  outline:none;
}

.parsed-panel.paste-ready .parsed-table{
  border-color:#c9d4ef;
}

.parsed-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.88);
}

.parsed-hint{
  color:var(--muted);
  font-size:13px;
}

.parsed-table{
  overflow:hidden;
  border:1px solid #dfe6f3;
  border-radius:var(--radius-lg);
  background:#fff;
}

.parsed-row{
  display:grid;
  grid-template-columns:155px minmax(0,1fr) 80px;
  min-height:42px;
}

.parsed-row + .parsed-row{
  border-top:1px solid #e8ecf5;
}

.parsed-label{
  display:flex;
  align-items:center;
  padding:8px 10px;
  border-right:1px solid #e8ecf5;
  background:#f7f8fc;
  color:#8b95ad;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.parsed-value{
  display:flex;
  align-items:center;
  padding:8px 10px;
  color:var(--text);
  font-size:14px;
  line-height:1.45;
  white-space:pre-wrap;
  word-break:break-word;
}

.parsed-copy{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6px 8px;
  border-left:1px solid #e8ecf5;
}

.parsed-empty{
  color:#9aa4bf;
}

@media (max-width:1180px){
  .file-template-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:760px){
  .file-age-fields{
    grid-template-columns:1fr;
  }

  .parsed-row{
    grid-template-columns:1fr;
  }

  .parsed-label,
  .parsed-copy{
    border:0;
  }

  .parsed-copy{
    justify-content:flex-end;
  }
}


/* workbook_modular_v11 — File Name paste UX fix */
.parsed-actions{
  justify-content:flex-end;
}

.parsed-panel{
  caret-color:transparent;
}

.parsed-panel:focus{
  outline:none;
}

.parsed-panel.paste-ready{
  box-shadow:0 0 0 3px rgba(91,108,255,.12);
}

.parsed-panel[contenteditable="true"]{
  -webkit-user-select:text;
  user-select:text;
}


/* workbook_modular_v13 — reliable paste field for File Name parser */
.paste-box{
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.88);
}

.paste-textarea{
  width:100%;
  min-height:86px;
  max-height:220px;
  resize:vertical;
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.55;
}

.parsed-panel[contenteditable="true"]{
  caret-color:auto;
}


/* workbook_modular_v15 — removed visible paste textarea */
.paste-box,
.paste-textarea{
  display:none !important;
}

.parsed-panel{
  cursor:text;
}


/* workbook_modular_v16 — age emoji badge in File Name cards */
.age-emoji-badge{
  min-width:34px;
  height:26px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 8px !important;
  font-family:var(--font-main) !important;
  font-size:16px !important;
  line-height:1 !important;
  letter-spacing:0 !important;
}


/* workbook_modular_v18 — compact File Name parser controls */
.parsed-toolbar{
  display:none !important;
}

.parsed-actions-bar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin-bottom:8px;
}

.parsed-actions-bar .btn{
  min-height:36px;
}

.parsed-panel{
  gap:8px;
}


/* File Name parsed table */
.parsed-panel{
  max-width:1720px;
}

.parsed-table-layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  align-items:stretch;
}

.parsed-table-wrap{
  min-width:0;
}

.parsed-table{
  width:100%;
}

.parsed-row{
  grid-template-columns:150px minmax(0,1fr) 76px;
}

.file-age-suffix.age-emoji-badge{
  margin-left:auto;
}


/* ===== Color module v22 ===== */
.color-page{
  display:grid;
  gap:10px;
}

.color-top{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);
  gap:10px;
}

.active-color-panel,
.add-to-palette-panel,
.color-tools,
.color-board-tabs{
  display:flex;
  align-items:end;
  gap:8px;
  flex-wrap:wrap;
  padding:10px;
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  background:rgba(255,255,255,.88);
}

.add-to-palette-panel{
  align-items:end;
  justify-content:flex-end;
}

.active-color-preview{
  width:52px;
  height:52px;
  border:1px solid var(--border-strong);
  border-radius:16px;
  background:var(--active-color,#6D3DF5);
}

.color-hex-field{
  min-width:160px;
}

.color-hex-field .input{
  width:150px;
  font-family:var(--font-mono);
  font-weight:700;
  text-transform:uppercase;
}

.color-board-tabs{
  padding:5px;
  width:fit-content;
  max-width:100%;
}

.color-tools{
  align-items:end;
}

.color-search{
  min-width:240px;
}

.color-name-input,
.color-tags-input{
  min-width:180px;
}

.color-board{
  display:grid;
  gap:12px;
}

.color-spectrum-group{
  display:grid;
  gap:8px;
}

.color-spectrum-title{
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--muted);
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.color-spectrum-title span{
  padding:2px 7px;
  border-radius:999px;
  background:#f2f4f7;
  color:#667085;
}

.color-card-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}

.color-card{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 28px;
  align-items:center;
  gap:8px;
  min-height:58px;
  padding:7px;
  border:1px solid rgba(231,235,246,.95);
  border-radius:16px;
  background:#fff;
}

.color-swatch-card{
  width:44px;
  height:44px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:13px;
  background:var(--swatch-color,#fff);
}

.color-card-main{
  min-width:0;
  display:grid;
  gap:3px;
}

.color-hex-code{
  width:fit-content;
  max-width:100%;
  border:0;
  background:transparent;
  color:var(--text);
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:800;
  text-align:left;
}

.color-hex-code.ok,
.btn.ok,
.color-swatch-card.ok{
  outline:2px solid rgba(25,195,125,.35);
}

.color-card-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:12px;
  font-weight:600;
}

.color-tags{
  display:flex;
  align-items:center;
  gap:4px;
  flex-wrap:wrap;
}

.color-mini-tag{
  max-width:90px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:2px 6px;
  border-radius:999px;
  background:#eef2ff;
  color:#5b6cff;
  font-family:var(--font-mono);
  font-size:8px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.color-delete{
  width:26px;
  height:26px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff7f7;
  color:#d92d20;
  font-size:17px;
  line-height:1;
}

.color-delete:hover{
  background:#ffeceb;
}

@media (max-width:1280px){
  .color-card-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:980px){
  .color-top{
    grid-template-columns:1fr;
  }

  .color-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:640px){
  .color-card-grid{
    grid-template-columns:1fr;
  }

  .active-color-panel,
  .add-to-palette-panel,
  .color-tools{
    align-items:stretch;
  }
}


/* ===== Color module v23 — old structure recreated in clean Workbook CSS ===== */
.color-ct{
  padding:8px 14px 14px;
}

.color-page-v23{
  display:grid;
  gap:10px;
}

.color-toolbar-v23{
  display:grid;
  grid-template-columns:minmax(260px,auto) auto minmax(420px,1fr);
  align-items:center;
  gap:10px;
}

.color-tabs-v23{
  display:flex;
  align-items:center;
  gap:4px;
  padding:4px;
  border:1px solid var(--border);
  border-radius:18px;
  background:rgba(255,255,255,.72);
  width:fit-content;
  max-width:100%;
  overflow-x:auto;
}

.color-tab-v23{
  min-height:36px;
  padding:0 18px;
  border:0;
  border-radius:14px;
  background:transparent;
  color:#68718e;
  font-size:14px;
  font-weight:700;
  white-space:nowrap;
}

.color-tab-v23.active{
  background:#fff;
  color:#5b4df0;
}

.color-order-v23{
  display:flex;
  align-items:center;
  gap:8px;
  justify-content:center;
  padding:0 10px;
  border-left:1px solid rgba(216,222,235,.55);
  border-right:1px solid rgba(216,222,235,.55);
}

.icon-btn{
  width:36px;
  height:36px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
  color:#7d86a5;
  font-size:13px;
  font-weight:800;
}

.icon-btn:hover{
  background:#f7f8fc;
}

.color-actions-v23{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}

.color-active-row-v23{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.color-add-row-v23,
.color-palette-row-v23{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.color-row-label{
  color:#111827;
  font-size:18px;
  font-weight:800;
}

.active-color-square-v23{
  width:44px;
  height:44px;
  border:1px solid var(--border-strong);
  border-radius:14px;
  background:var(--active-color,#7E95B9);
}

.active-color-square-v23.ok,
.color-chip-v23.ok{
  outline:3px solid rgba(91,108,255,.22);
}

.color-hex-input-v23{
  width:138px;
  height:44px;
  padding:0 14px;
  border:1px solid var(--border);
  border-radius:14px;
  background:#fff;
  color:#24304a;
  font-family:var(--font-mono);
  font-size:13px;
  font-weight:800;
  text-transform:uppercase;
  outline:none;
}

.color-add-btn-v23{
  height:44px;
  padding:0 24px;
  border:0;
  border-radius:16px;
  background:#11172b;
  color:#fff;
  font-size:15px;
  font-weight:800;
}

.color-palette-select-v23{
  max-width:160px;
}

.color-count-v23{
  min-height:36px;
  display:inline-flex;
  align-items:center;
  padding:0 14px;
  border-radius:999px;
  background:#fff;
  color:#7b86a5;
  font-size:13px;
  font-weight:800;
}

.color-board-v23{
  display:block;
}

.color-category-grid-v23{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 12px;
}

.color-category-card-v23{
  min-height:84px;
  padding:12px 12px 10px;
  border:1px solid rgba(231,235,246,.95);
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.color-category-head-v23{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
  color:#68718e;
  font-size:13px;
  font-weight:800;
}

.color-category-head-v23 span{
  color:#43527b;
  font-family:var(--font-mono);
  font-size:12px;
}

.color-chip-row-v23{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.color-chip-v23{
  width:42px;
  height:42px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:10px;
  background:var(--chip-color,#fff);
}

.color-chip-v23:hover{
  transform:translateY(-1px);
}

.color-chip-v23.selected{
  outline:3px solid rgba(37,99,235,.95);
  outline-offset:2px;
}

.color-chip-v23.added{
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.7);
}

@media (max-width:1180px){
  .color-toolbar-v23{
    grid-template-columns:1fr;
  }

  .color-order-v23{
    justify-content:flex-start;
    border:0;
    padding:0;
  }

  .color-actions-v23{
    justify-content:flex-start;
  }

  .color-category-grid-v23{
    grid-template-columns:1fr;
  }
}


/* workbook_modular_v24 — working Color add/remove/clear */
.color-chip-wrap-v24{
  position:relative;
  display:inline-flex;
}

.color-chip-delete-v24{
  position:absolute;
  top:-7px;
  right:-7px;
  width:18px;
  height:18px;
  display:none;
  align-items:center;
  justify-content:center;
  border:1px solid #ffd5d2;
  border-radius:999px;
  background:#fff7f7;
  color:#d92d20;
  font-size:13px;
  font-weight:900;
  line-height:1;
}

.color-chip-wrap-v24:hover .color-chip-delete-v24{
  display:flex;
}

.color-category-card-v23{
  min-height:84px;
}

.empty-state{
  padding:24px;
  border:1px dashed #d8deed;
  border-radius:18px;
  background:rgba(255,255,255,.78);
  color:#7d86a5;
  text-align:center;
  font-size:13px;
}


/* workbook_modular_v27 — compact scale for Color module */
.color-page-v23{
  gap:8px;
}

.color-toolbar-v23{
  gap:8px;
}

.color-tabs-v23{
  padding:3px;
  border-radius:16px;
}

.color-tab-v23{
  min-height:32px;
  padding:0 14px;
  border-radius:12px;
  font-size:13px;
}

.color-order-v23{
  gap:6px;
  padding:0 8px;
}

.color-order-v23 .icon-btn{
  width:32px;
  height:32px;
  font-size:12px;
}

.color-actions-v23{
  gap:5px;
}

.color-actions-v23 .btn,
.color-palette-row-v23 .btn{
  min-height:32px;
  padding:6px 11px;
  border-radius:13px;
  font-size:13px;
}

.color-active-row-v23{
  gap:9px;
}

.color-add-row-v23,
.color-palette-row-v23{
  gap:7px;
}

.color-row-label{
  font-size:16px;
}

.active-color-square-v23{
  width:38px;
  height:38px;
  border-radius:12px;
}

.color-hex-input-v23{
  width:124px;
  height:38px;
  padding:0 12px;
  border-radius:12px;
  font-size:12px;
}

.color-add-btn-v23{
  height:38px;
  padding:0 20px;
  border-radius:14px;
  font-size:14px;
}

.color-palette-select-v23{
  min-height:38px;
  max-width:150px;
  border-radius:14px;
  font-size:14px;
}

.color-count-v23{
  min-height:32px;
  padding:0 12px;
  font-size:12px;
}

.color-category-grid-v23{
  gap:8px 10px;
}

.color-category-card-v23{
  min-height:74px;
  padding:10px 10px 9px;
  border-radius:16px;
}

.color-category-head-v23{
  margin-bottom:7px;
  font-size:12px;
}

.color-category-head-v23 span{
  font-size:11px;
}

.color-chip-row-v23{
  gap:5px;
}

.color-chip-v23{
  width:36px;
  height:36px;
  border-radius:9px;
}

.color-chip-delete-v24{
  top:-6px;
  right:-6px;
  width:17px;
  height:17px;
  font-size:12px;
}


/* workbook_modular_v28 — Color item structure, context menu, divider/row break */
.color-chip-wrap-v24.selected-item{
  outline:2px solid rgba(91,108,255,.75);
  outline-offset:3px;
  border-radius:12px;
}

.favorite-mark-v28{
  position:absolute;
  top:-8px;
  left:-6px;
  z-index:2;
  color:#111827;
  font-size:13px;
  line-height:1;
  pointer-events:none;
}

.color-inline-divider-v28{
  width:2px;
  height:34px;
  display:inline-block;
  margin:0 5px;
  border-radius:999px;
  background:#111827;
  opacity:.82;
  vertical-align:middle;
}

.color-row-break-v28{
  flex-basis:100%;
  height:0;
  display:block;
}

.color-context-menu-v28{
  position:fixed;
  z-index:9999;
  width:300px;
  padding:12px;
  border:1px solid #e8ebf3;
  border-radius:18px;
  background:#fff;
  box-shadow:0 18px 60px rgba(30,41,59,.18);
}

.color-context-menu-v28 button{
  width:100%;
  min-height:38px;
  display:flex;
  align-items:center;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#111827;
  font-size:15px;
  font-weight:600;
  text-align:left;
}

.color-context-menu-v28 button:hover{
  background:#f7f8fc;
}

.color-context-menu-v28 button.danger{
  color:#d92d20;
}

.color-editor-shell-v28{
  width:520px;
}

.color-editor-placeholder-v28{
  display:grid;
  grid-template-columns:60px minmax(0,1fr);
  gap:12px;
  align-items:end;
  padding:14px;
}

.color-editor-placeholder-v28 .notice{
  grid-column:1 / -1;
}

.editor-preview{
  width:54px;
  height:54px;
}


/* workbook_modular_v29 — robust Color context menu visibility */
.color-context-menu-v28[hidden]{
  display:none !important;
}

.color-context-menu-v28.is-open{
  display:block !important;
  pointer-events:auto;
}


/* workbook_modular_v30 — reliable visible fallback for Color context menu */
.color-chip-menu-v30{
  position:absolute;
  right:-7px;
  bottom:-7px;
  width:18px;
  height:18px;
  display:none;
  align-items:center;
  justify-content:center;
  border:1px solid #dfe6f3;
  border-radius:999px;
  background:#fff;
  color:#667085;
  font-size:13px;
  font-weight:900;
  line-height:1;
}

.color-chip-wrap-v24:hover .color-chip-menu-v30{
  display:flex;
}

.color-chip-menu-v30:hover{
  background:#f7f8fc;
  color:#111827;
}

.color-context-menu-v28{
  z-index:2147483000 !important;
}


/* workbook_modular_v31 — old-file style Color context menu */
.color-context-menu-v28{
  display:none !important;
  position:fixed !important;
  z-index:2147483000 !important;
}

.color-context-menu-v28.open{
  display:block !important;
}

.color-context-menu-v28 button:disabled{
  opacity:.48;
  cursor:default;
}


/* workbook_modular_v32 — Chrome context menu fix + no hover delete */
.color-chip-delete-v24{
  display:none !important;
}

.color-chip-menu-v30{
  right:-7px;
  bottom:-7px;
}

.color-chip-wrap-v24{
  -webkit-user-select:none;
  user-select:none;
}


/* workbook_modular_v33 — Chrome-safe visible menu button */
.color-chip-menu-v30{
  display:flex !important;
  opacity:.72;
  z-index:5;
  pointer-events:auto;
}

.color-chip-wrap-v24:hover .color-chip-menu-v30{
  display:flex !important;
  opacity:1;
}

.color-chip-menu-v30:active{
  transform:scale(.94);
}

.color-context-menu-v28.open{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}


/* workbook_modular_v34 — stable Color item ids + cleaner menu fallback */
.color-chip-menu-v30{
  display:none !important;
  opacity:1 !important;
}

.color-chip-wrap-v24:hover .color-chip-menu-v30{
  display:flex !important;
}

.color-context-menu-v28.open{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}


/* workbook_modular_v35 — compact Color context menu */
.color-context-menu-v28{
  width:250px !important;
  padding:8px !important;
  border-radius:14px !important;
  box-shadow:0 12px 36px rgba(30,41,59,.14) !important;
}

.color-context-menu-v28 button{
  min-height:30px !important;
  padding:5px 8px !important;
  border-radius:9px !important;
  font-size:13px !important;
  font-weight:650 !important;
  line-height:1.22 !important;
  gap:6px !important;
}

.color-context-menu-v28 button + button{
  margin-top:2px !important;
}


/* workbook_modular_v36 — Color service item delete access + drag and drop */
.color-inline-divider-v28{
  position:relative;
  width:10px !important;
  height:36px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  margin:0 4px !important;
  cursor:grab;
}

.color-inline-divider-v28::before{
  content:"";
  width:2px;
  height:34px;
  display:block;
  border-radius:999px;
  background:#111827;
  opacity:.72;
}

.color-row-break-v28{
  position:relative;
  flex-basis:100% !important;
  height:12px !important;
  display:block !important;
  border-top:1px dashed rgba(107,114,128,.34);
  margin:1px 0 2px;
  cursor:grab;
}

.service-menu-v36{
  position:absolute;
  right:-8px;
  bottom:-8px;
  width:18px;
  height:18px;
  display:none;
  align-items:center;
  justify-content:center;
  border:1px solid #dfe6f3;
  border-radius:999px;
  background:#fff;
  color:#667085;
  font-size:12px;
  font-weight:900;
  line-height:1;
  z-index:6;
}

.service-menu-v36.row{
  right:4px;
  bottom:-9px;
}

.color-inline-divider-v28:hover .service-menu-v36,
.color-row-break-v28:hover .service-menu-v36{
  display:flex;
}

.color-chip-wrap-v24{
  cursor:grab;
}

.color-chip-wrap-v24:active,
.color-inline-divider-v28:active,
.color-row-break-v28:active{
  cursor:grabbing;
}

.dragging-color-item{
  opacity:.45;
}

.drag-over-color-item{
  outline:2px dashed rgba(91,108,255,.82);
  outline-offset:3px;
  border-radius:12px;
}

.color-row-break-v28.drag-over-color-item{
  outline-offset:1px;
}


/* workbook_modular_v37 — thinner vertical divider + better drag/drop placement */
.color-inline-divider-v28{
  width:5px !important;
  min-width:5px !important;
  margin:0 3px !important;
  background:transparent !important;
}

.color-inline-divider-v28::before{
  width:1px !important;
  height:32px !important;
  background:#1f2937 !important;
  opacity:.62 !important;
}

.color-inline-divider-v28:hover::before{
  width:2px !important;
  opacity:.82 !important;
}

.color-chip-wrap-v24.drop-before::before,
.color-chip-wrap-v24.drop-after::after,
.color-inline-divider-v28.drop-before::before,
.color-inline-divider-v28.drop-after::after{
  content:"";
  position:absolute;
  top:-4px;
  bottom:-4px;
  width:2px;
  border-radius:999px;
  background:#5b6cff;
  z-index:9;
}

.color-chip-wrap-v24.drop-before::before,
.color-inline-divider-v28.drop-before::before{
  left:-5px;
}

.color-chip-wrap-v24.drop-after::after,
.color-inline-divider-v28.drop-after::after{
  right:-5px;
}

.color-row-break-v28.drop-before::before,
.color-row-break-v28.drop-after::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  height:2px;
  border-radius:999px;
  background:#5b6cff;
  z-index:9;
}

.color-row-break-v28.drop-before::before{
  top:-2px;
}

.color-row-break-v28.drop-after::after{
  bottom:-2px;
}

.color-board-v23.drop-end-target{
  outline:2px dashed rgba(91,108,255,.35);
  outline-offset:4px;
  border-radius:18px;
}

.drag-over-color-item{
  outline:none !important;
}


/* workbook_modular_v38 — regular font weight for Color context menu */
.color-context-menu-v28 button{
  font-weight:500 !important;
}

.color-context-menu-v28 button.danger{
  font-weight:500 !important;
}


/* workbook_modular_v39 — compact horizontal divider in Color */
.color-row-break-v28{
  position:relative !important;
  flex-basis:100% !important;
  height:6px !important;
  min-height:6px !important;
  margin:0 !important;
  padding:0 !important;
  border-top:0 !important;
  background:transparent !important;
  cursor:grab;
}

.color-row-break-v28::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:50% !important;
  height:1px !important;
  transform:translateY(-50%) !important;
  border-radius:999px !important;
  background:#1f2937 !important;
  opacity:.62 !important;
}

.color-row-break-v28:hover::before{
  height:2px !important;
  opacity:.82 !important;
}

.color-row-break-v28 .service-menu-v36.row{
  right:2px !important;
  bottom:-8px !important;
}


/* workbook_modular_v40 — draggable hitbox for Color dividers */
.color-inline-divider-v28{
  width:14px !important;
  min-width:14px !important;
  height:36px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 1px !important;
  cursor:grab !important;
  background:transparent !important;
  -webkit-user-drag:element;
  user-select:none;
}

.color-inline-divider-v28::before{
  content:none !important;
}

.divider-line-v40{
  width:1px;
  height:32px;
  display:block;
  border-radius:999px;
  background:#1f2937;
  opacity:.62;
  pointer-events:auto;
}

.color-inline-divider-v28:hover .divider-line-v40{
  width:2px;
  opacity:.82;
}

.color-row-break-v28{
  position:relative !important;
  flex-basis:100% !important;
  height:12px !important;
  min-height:12px !important;
  display:flex !important;
  align-items:center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  cursor:grab !important;
  -webkit-user-drag:element;
  user-select:none;
}

.color-row-break-v28::before{
  content:none !important;
}

.divider-line-v40.horizontal{
  width:100%;
  height:1px;
  display:block;
  border-radius:999px;
  background:#1f2937;
  opacity:.62;
  pointer-events:auto;
}

.color-row-break-v28:hover .divider-line-v40.horizontal{
  height:2px;
  opacity:.82;
}

.color-inline-divider-v28:active,
.color-row-break-v28:active{
  cursor:grabbing !important;
}

.service-menu-v36{
  pointer-events:auto;
}


/* workbook_modular_v41 — drop into empty space of the current Color block */
.color-category-card-v23.drop-category-end{
  outline:2px dashed rgba(91,108,255,.38);
  outline-offset:3px;
}

.color-category-card-v23.drop-category-end .color-chip-row-v23::after{
  content:"";
  width:28px;
  height:36px;
  display:inline-block;
  border:2px dashed rgba(91,108,255,.72);
  border-radius:10px;
  margin-left:2px;
}


/* workbook_modular_v42 — consistent insertion slot for Color drag-and-drop */
.color-chip-wrap-v24.drop-before::before,
.color-chip-wrap-v24.drop-after::after,
.color-inline-divider-v28.drop-before::before,
.color-inline-divider-v28.drop-after::after{
  content:"" !important;
  position:absolute !important;
  top:50% !important;
  width:30px !important;
  height:36px !important;
  transform:translateY(-50%) !important;
  border:2px dashed rgba(91,108,255,.72) !important;
  border-radius:10px !important;
  background:rgba(91,108,255,.045) !important;
  z-index:9 !important;
  pointer-events:none !important;
}

.color-chip-wrap-v24.drop-before::before,
.color-inline-divider-v28.drop-before::before{
  left:-36px !important;
}

.color-chip-wrap-v24.drop-after::after,
.color-inline-divider-v28.drop-after::after{
  right:-36px !important;
}

.color-row-break-v28.drop-before::before,
.color-row-break-v28.drop-after::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  width:30px !important;
  height:36px !important;
  border:2px dashed rgba(91,108,255,.72) !important;
  border-radius:10px !important;
  background:rgba(91,108,255,.045) !important;
  z-index:9 !important;
  pointer-events:none !important;
}

.color-row-break-v28.drop-before::before{
  top:-38px !important;
}

.color-row-break-v28.drop-after::after{
  bottom:-38px !important;
}

.color-category-card-v23.drop-category-end .color-chip-row-v23::after{
  content:"" !important;
  width:30px !important;
  height:36px !important;
  display:inline-block !important;
  border:2px dashed rgba(91,108,255,.72) !important;
  border-radius:10px !important;
  background:rgba(91,108,255,.045) !important;
  margin-left:2px !important;
}


/* workbook_modular_v43 — cleaner Color drag insertion indicator */
.color-chip-wrap-v24.drop-before::before,
.color-chip-wrap-v24.drop-after::after,
.color-inline-divider-v28.drop-before::before,
.color-inline-divider-v28.drop-after::after{
  content:"" !important;
  position:absolute !important;
  top:50% !important;
  width:2px !important;
  height:38px !important;
  transform:translateY(-50%) !important;
  border:0 !important;
  border-radius:999px !important;
  background:#5b6cff !important;
  box-shadow:0 0 0 3px rgba(91,108,255,.13) !important;
  z-index:12 !important;
  pointer-events:none !important;
}

.color-chip-wrap-v24.drop-before::before,
.color-inline-divider-v28.drop-before::before{
  left:-5px !important;
}

.color-chip-wrap-v24.drop-after::after,
.color-inline-divider-v28.drop-after::after{
  right:-5px !important;
}

.color-row-break-v28.drop-before::before,
.color-row-break-v28.drop-after::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  width:auto !important;
  height:2px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#5b6cff !important;
  box-shadow:0 0 0 3px rgba(91,108,255,.13) !important;
  z-index:12 !important;
  pointer-events:none !important;
}

.color-row-break-v28.drop-before::before{
  top:-4px !important;
}

.color-row-break-v28.drop-after::after{
  bottom:-4px !important;
}

.color-category-card-v23.drop-category-end{
  outline:1px dashed rgba(91,108,255,.32) !important;
  outline-offset:2px !important;
}

.color-category-card-v23.drop-category-end .color-chip-row-v23::after{
  content:"" !important;
  width:2px !important;
  height:38px !important;
  display:inline-block !important;
  border:0 !important;
  border-radius:999px !important;
  background:#5b6cff !important;
  box-shadow:0 0 0 3px rgba(91,108,255,.13) !important;
  margin-left:5px !important;
}


/* workbook_modular_v44 — full Color Picker */
.color-editor-layer-v44{
  position:fixed;
  inset:0;
  z-index:2147482000;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(15,23,42,.22);
}

.color-editor-layer-v44[hidden]{
  display:none !important;
}

.color-editor-modal-v44{
  width:min(760px, calc(100vw - 36px));
  padding:0;
  overflow:hidden;
  border:1px solid #e7ebf5;
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 80px rgba(30,41,59,.20);
}

.color-editor-head-v44{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid #edf0f7;
}

.color-editor-head-v44 h2{
  margin:0;
  color:#1c2340;
  font-size:15px;
  font-weight:650;
}

.color-editor-close-v44{
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:10px;
  background:#fff;
  color:#6e7693;
  font-size:22px;
  line-height:1;
}

.color-editor-close-v44:hover{
  background:#f7f8fc;
  color:#111827;
}

.color-editor-body-v44{
  display:grid;
  grid-template-columns:minmax(280px, 1fr) 240px;
  gap:12px;
  padding:14px;
}

.color-editor-left-v44{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 22px;
  gap:10px;
  min-width:0;
}

.color-sv-v44{
  position:relative;
  min-height:300px;
  border:1px solid #dfe6f3;
  border-radius:12px;
  overflow:hidden;
  background:var(--editor-hue-color, #ff0000);
  cursor:crosshair;
  touch-action:none;
}

.color-sv-white-v44,
.color-sv-black-v44{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.color-sv-white-v44{
  background:linear-gradient(to right, #fff, rgba(255,255,255,0));
}

.color-sv-black-v44{
  background:linear-gradient(to top, #000, rgba(0,0,0,0));
}

.color-sv-pointer-v44{
  position:absolute;
  width:16px;
  height:16px;
  border:2px solid #fff;
  border-radius:999px;
  box-shadow:0 0 0 2px rgba(0,0,0,.65);
  transform:translate(-50%, -50%);
  pointer-events:none;
  z-index:2;
}

.color-hue-v44{
  position:relative;
  min-height:300px;
  border:1px solid #dfe6f3;
  border-radius:999px;
  background:linear-gradient(
    to bottom,
    #ff0000 0%,
    #ffff00 16.66%,
    #00ff00 33.33%,
    #00ffff 50%,
    #0000ff 66.66%,
    #ff00ff 83.33%,
    #ff0000 100%
  );
  cursor:ns-resize;
  touch-action:none;
}

.color-hue-pointer-v44{
  position:absolute;
  left:50%;
  width:28px;
  height:8px;
  border:2px solid #fff;
  border-radius:999px;
  background:rgba(17,24,39,.25);
  box-shadow:0 0 0 1px rgba(17,24,39,.42);
  transform:translate(-50%, -50%);
  pointer-events:none;
}

.color-editor-right-v44{
  display:grid;
  gap:9px;
  align-content:start;
}

.color-preview-pair-v44{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.color-editor-preview-v44{
  display:block;
  height:36px;
  border:1px solid #dfe6f3;
  border-radius:10px;
}

.color-editor-grid-v44{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px 8px;
}

.color-editor-grid-v44 .input,
.color-editor-hex-wrap-v44 .input,
.color-editor-slider-row-v44 .input{
  min-height:34px;
  height:34px;
  padding:6px 9px;
  border-radius:10px;
  font-family:var(--font-mono);
  font-size:12px;
}

.color-editor-hex-wrap-v44{
  display:grid;
}

.color-editor-slider-row-v44{
  display:grid;
  grid-template-columns:74px minmax(0,1fr) 54px;
  align-items:center;
  gap:8px;
  color:#6e7693;
  font-size:12px;
}

.color-editor-slider-row-v44 input[type="range"]{
  width:100%;
  accent-color:#3182ce;
}

.color-editor-actions-v44{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:2px;
}

.color-editor-actions-v44 .btn{
  min-height:34px;
  padding:7px 14px;
  border-radius:10px;
}

@media (max-width:760px){
  .color-editor-body-v44{
    grid-template-columns:1fr;
  }

  .color-sv-v44,
  .color-hue-v44{
    min-height:240px;
  }
}


/* workbook_modular_v45 — compact Color Picker */
.color-editor-modal-v44{
  width:min(650px, calc(100vw - 32px)) !important;
  border-radius:16px !important;
}

.color-editor-head-v44{
  padding:10px 12px !important;
}

.color-editor-head-v44 h2{
  font-size:14px !important;
}

.color-editor-close-v44{
  width:26px !important;
  height:26px !important;
  border-radius:8px !important;
  font-size:19px !important;
}

.color-editor-body-v44{
  grid-template-columns:minmax(250px, 1fr) 210px !important;
  gap:10px !important;
  padding:10px !important;
}

.color-editor-left-v44{
  grid-template-columns:minmax(0, 1fr) 18px !important;
  gap:8px !important;
}

.color-sv-v44{
  min-height:240px !important;
  border-radius:10px !important;
}

.color-hue-v44{
  min-height:240px !important;
}

.color-sv-pointer-v44{
  width:13px !important;
  height:13px !important;
  border-width:2px !important;
}

.color-hue-pointer-v44{
  width:24px !important;
  height:7px !important;
}

.color-editor-right-v44{
  gap:7px !important;
}

.color-preview-pair-v44{
  gap:7px !important;
}

.color-editor-preview-v44{
  height:30px !important;
  border-radius:8px !important;
}

.color-editor-grid-v44{
  gap:6px 7px !important;
}

.color-editor-grid-v44 .input,
.color-editor-hex-wrap-v44 .input,
.color-editor-slider-row-v44 .input{
  min-height:30px !important;
  height:30px !important;
  padding:5px 8px !important;
  border-radius:8px !important;
  font-size:11px !important;
}

.color-editor-slider-row-v44{
  grid-template-columns:66px minmax(0,1fr) 48px !important;
  gap:6px !important;
  font-size:11px !important;
}

.color-editor-actions-v44{
  gap:7px !important;
}

.color-editor-actions-v44 .btn{
  min-height:30px !important;
  padding:6px 12px !important;
  border-radius:9px !important;
  font-size:13px !important;
}

.color-editor-modal-v44 .label{
  font-size:9px !important;
  margin-bottom:3px !important;
}

@media (max-width:760px){
  .color-editor-modal-v44{
    width:min(520px, calc(100vw - 24px)) !important;
  }

  .color-editor-body-v44{
    grid-template-columns:1fr !important;
  }

  .color-sv-v44,
  .color-hue-v44{
    min-height:210px !important;
  }
}


/* ===== Palette module v47 ===== */
.palette-ct-v47{
  padding:8px 14px 14px !important;
}

.palette-page-v47{
  display:grid;
  gap:10px;
}

.palette-tabs-v47{
  display:flex;
  gap:4px;
  width:fit-content;
  max-width:100%;
  padding:3px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.72);
  overflow-x:auto;
}

.palette-tab-v47{
  min-height:32px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#68718e;
  font-size:13px;
  font-weight:700;
  white-space:nowrap;
}

.palette-tab-v47.active{
  background:#fff;
  color:#5b4df0;
}

.pg-shell-v47{
  display:grid;
  gap:10px;
}

.pg-controls-v47{
  display:grid;
  gap:9px;
  padding:10px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:rgba(255,255,255,.88);
}

.pg-controls-grid-v47{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px 14px;
}

.pg-control-v47{
  display:grid;
  gap:6px;
}

.pg-label-v47{
  color:#7d86a5;
  font-size:11px;
  font-weight:800;
}

.pg-count-row-v47{
  display:grid;
  grid-template-columns:minmax(0,1fr) 30px 34px 30px;
  align-items:center;
  gap:7px;
}

.pg-step-v47{
  width:30px;
  height:30px;
  border:1px solid #dfe6f3;
  border-radius:10px;
  background:#fff;
  color:#1c2340;
  font-size:17px;
  font-weight:800;
}

.pg-step-value-v47{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:800;
}

.pg-range-v47,
.pg-range-track-v47 input[type="range"]{
  width:100%;
  accent-color:#5b6cff;
}

.pg-dual-range-v47{
  display:grid;
  gap:4px;
}

.pg-range-track-v47{
  position:relative;
  height:28px;
  display:grid;
  align-items:center;
}

.pg-range-track-v47 input[type="range"]{
  position:absolute;
  inset-inline:0;
  background:transparent;
  pointer-events:none;
}

.pg-range-track-v47 input[type="range"]::-webkit-slider-thumb{
  pointer-events:auto;
}

.pg-range-track-v47 input[type="range"]::-moz-range-thumb{
  pointer-events:auto;
}

.pg-range-fill-v47{
  position:absolute;
  height:4px;
  border-radius:999px;
  background:#5b6cff;
  opacity:.85;
}

.pg-range-fill-v47.hue{
  background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);
}

.pg-range-values-v47,
.pg-range-hint-v47{
  display:flex;
  justify-content:space-between;
  gap:8px;
  color:#7d86a5;
  font-size:10px;
}

.pg-presets-v47{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
}

.pg-preset-v47{
  min-height:28px;
  padding:5px 10px;
  border:1px solid #e7ebf6;
  border-radius:999px;
  background:#fff;
  color:#68718e;
  font-size:12px;
  font-weight:700;
}

.pg-preset-v47.active{
  background:#eef2ff;
  color:#5b4df0;
  border-color:#dfe3ff;
}

.pg-actions-v47{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.pg-actions-v47 .btn,
.pg-actions-v47 .select{
  min-height:32px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.pg-actions-v47 .active-soft{
  background:#eef2ff;
  color:#5b4df0;
}

.pg-palette-select-v47{
  min-width:170px;
}

.pg-rules-v47{
  display:none;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:6px;
  padding:9px 10px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
  color:#68718e;
  font-size:12px;
}

.pg-rules-v47.open{
  display:grid;
}

.pg-result-v47{
  display:grid;
  gap:10px;
}

.pg-strip-v47{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(24px,1fr));
  min-height:52px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:#fff;
}

.pg-seg-v47{
  min-height:52px;
  border:0;
}

.pg-seg-v47:hover,
.pg-color-swatch-v47:hover{
  outline:2px solid rgba(0,0,0,.12);
  outline-offset:-2px;
}

.pg-cards-v47{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:8px;
}

.pg-color-card-v47{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:6px;
  align-items:center;
  min-height:58px;
  padding:7px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.pg-color-swatch-v47{
  width:42px;
  height:42px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:10px;
}

.pg-hex-v47{
  width:fit-content;
  border:0;
  background:transparent;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:800;
  text-align:left;
}

.pg-mini-actions-v47{
  display:flex;
  gap:4px;
  margin-top:3px;
}

.pg-mini-actions-v47 button{
  min-height:22px;
  padding:3px 6px;
  border:1px solid #e7ebf6;
  border-radius:8px;
  background:#f8faff;
  color:#667085;
  font-size:10px;
  font-weight:800;
}

.palette-lib-v47{
  display:grid;
  gap:10px;
}

.palette-lib-toolbar-v47{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  padding:10px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:rgba(255,255,255,.88);
}

.palette-lib-toolbar-v47 .input{
  width:180px;
}

.palette-lib-toolbar-v47 .btn{
  min-height:32px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.palette-layout-v47{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:10px;
  align-items:start;
}

.palette-list-v47{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.palette-layout-v47.list-mode .palette-list-v47{
  grid-template-columns:1fr;
}

.palette-card-v47{
  display:grid;
  gap:7px;
  padding:8px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:#fff;
}

.palette-card-v47.active{
  outline:2px solid rgba(91,108,255,.55);
  outline-offset:1px;
}

.palette-card-v47.list{
  grid-template-columns:160px minmax(0,1fr);
  align-items:center;
}

.palette-card-strip-v47{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(10px,1fr);
  min-height:54px;
  overflow:hidden;
  border-radius:12px;
  background:#f7f8fc;
}

.palette-card-strip-v47 span{
  display:block;
}

.palette-card-strip-v47 em{
  display:flex;
  align-items:center;
  justify-content:center;
  color:#9aa4bf;
  font-size:12px;
}

.palette-card-foot-v47{
  display:flex;
  align-items:center;
  gap:7px;
}

.palette-card-name-v47{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#1c2340;
  font-size:13px;
  font-weight:750;
}

.palette-card-count-v47{
  padding:2px 7px;
  border-radius:999px;
  background:#f2f4f7;
  color:#667085;
  font-size:11px;
  font-weight:800;
}

.pal-fav-v47{
  width:26px;
  height:26px;
  margin-left:auto;
  border:1px solid #e7ebf6;
  border-radius:999px;
  background:#fff;
  color:#a0a8c0;
}

.pal-fav-v47.active{
  background:#fff8dd;
  color:#e4a400;
  border-color:#f4d26b;
}

.palette-detail-v47{
  position:sticky;
  top:10px;
  display:grid;
  gap:9px;
  padding:10px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:#fff;
}

.palette-detail-head-v47{
  display:flex;
  align-items:start;
  gap:8px;
}

.palette-detail-head-v47 strong{
  display:block;
  color:#1c2340;
  font-size:14px;
}

.palette-detail-head-v47 span{
  color:#7d86a5;
  font-size:12px;
}

.palette-active-v47{
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:8px;
  align-items:center;
}

.palette-active-swatch-v47{
  width:44px;
  height:44px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:12px;
}

.palette-active-hex-v47{
  min-height:34px;
  border:1px solid #e7ebf6;
  border-radius:12px;
  background:#f8faff;
  color:#1c2340;
  font-family:var(--font-mono);
  font-weight:800;
}

.palette-color-grid-v47{
  display:grid;
  gap:6px;
}

.palette-color-v47{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) 26px;
  align-items:center;
  gap:6px;
  padding:5px;
  border:1px solid #eef1f8;
  border-radius:12px;
}

.palette-color-v47.active{
  outline:2px solid rgba(91,108,255,.45);
}

.palette-color-swatch-v47{
  width:34px;
  height:34px;
  border:1px solid rgba(0,0,0,.08);
  border-radius:9px;
}

.palette-color-hex-v47{
  border:0;
  background:transparent;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:800;
  text-align:left;
}

.palette-color-remove-v47{
  width:24px;
  height:24px;
  border:1px solid #ffd5d2;
  border-radius:999px;
  background:#fff7f7;
  color:#d92d20;
  font-size:15px;
}

@media (max-width:1280px){
  .pg-cards-v47{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }

  .palette-layout-v47{
    grid-template-columns:1fr;
  }

  .palette-detail-v47{
    position:static;
  }
}

@media (max-width:980px){
  .pg-controls-grid-v47{
    grid-template-columns:1fr;
  }

  .pg-cards-v47,
  .palette-list-v47{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:640px){
  .pg-cards-v47,
  .palette-list-v47{
    grid-template-columns:1fr;
  }

  .pg-rules-v47{
    grid-template-columns:1fr;
  }
}


/* workbook_modular_v48 — compact vertical generated color cards */
.pg-cards-v47{
  grid-template-columns:repeat(auto-fill, minmax(92px, 1fr)) !important;
  gap:8px !important;
}

.pg-color-card-v47.compact{
  display:grid !important;
  grid-template-columns:1fr !important;
  grid-template-rows:78px auto !important;
  gap:0 !important;
  min-height:118px !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:14px !important;
  background:#fff !important;
}

.pg-color-card-v47.compact .pg-color-swatch-v47{
  width:100% !important;
  height:78px !important;
  border:0 !important;
  border-radius:0 !important;
}

.pg-color-card-v47.compact .pg-mini-actions-v47{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  padding:7px !important;
  margin:0 !important;
  border-top:1px solid #edf0f7 !important;
  background:#fff !important;
}

.pg-color-card-v47.compact .pg-mini-actions-v47 button{
  min-height:28px !important;
  min-width:30px !important;
  padding:4px 7px !important;
  border-radius:9px !important;
  background:#fff !important;
  font-size:12px !important;
}

.pg-color-card-v47.compact .pg-mini-actions-v47 button:hover{
  background:#f7f8fc !important;
}

@media (max-width:1280px){
  .pg-cards-v47{
    grid-template-columns:repeat(auto-fill, minmax(88px, 1fr)) !important;
  }
}

@media (max-width:640px){
  .pg-cards-v47{
    grid-template-columns:repeat(auto-fill, minmax(82px, 1fr)) !important;
  }

  .pg-color-card-v47.compact{
    grid-template-rows:68px auto !important;
    min-height:106px !important;
  }

  .pg-color-card-v47.compact .pg-color-swatch-v47{
    height:68px !important;
  }
}


/* workbook_modular_v49 — compact Palette Generation buttons + corrected range UI */

/* Generated color cards */
.pg-cards-v47{
  grid-template-columns:repeat(auto-fill, minmax(88px, 1fr)) !important;
  gap:7px !important;
}

.pg-color-card-v47.compact{
  grid-template-rows:78px auto !important;
  min-height:112px !important;
}

.pg-color-card-v47.compact .pg-mini-actions-v47{
  gap:3px !important;
  padding:5px !important;
  justify-content:flex-start !important;
  overflow:hidden !important;
}

.pg-color-card-v47.compact .pg-mini-actions-v47 button{
  min-height:24px !important;
  min-width:24px !important;
  height:24px !important;
  padding:2px 5px !important;
  border-radius:8px !important;
  font-size:10px !important;
  line-height:1 !important;
  flex:0 0 auto !important;
}

/* Palette generator sliders */
.pg-range-track-v47{
  position:relative !important;
  height:24px !important;
  display:block !important;
}

.pg-range-track-v47::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:6px;
  transform:translateY(-50%);
  border-radius:999px;
  background:#e8ebf2;
}

.pg-range-fill-v47{
  position:absolute !important;
  top:50% !important;
  height:6px !important;
  transform:translateY(-50%) !important;
  border-radius:999px !important;
  background:#5b6cff !important;
  opacity:.95 !important;
  pointer-events:none !important;
}

.pg-range-fill-v47.hue{
  background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00) !important;
}

.pg-range-track-v47 input[type="range"]{
  -webkit-appearance:none !important;
  appearance:none !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  width:100% !important;
  height:24px !important;
  margin:0 !important;
  background:transparent !important;
  pointer-events:none !important;
  z-index:2 !important;
}

.pg-range-track-v47 input[type="range"]::-webkit-slider-runnable-track{
  height:6px !important;
  background:transparent !important;
  border:0 !important;
}

.pg-range-track-v47 input[type="range"]::-moz-range-track{
  height:6px !important;
  background:transparent !important;
  border:0 !important;
}

.pg-range-track-v47 input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none !important;
  appearance:none !important;
  width:18px !important;
  height:18px !important;
  margin-top:-6px !important;
  border:2px solid #fff !important;
  border-radius:999px !important;
  background:#5b6cff !important;
  box-shadow:0 1px 4px rgba(31,41,55,.24) !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}

.pg-range-track-v47 input[type="range"]::-moz-range-thumb{
  width:18px !important;
  height:18px !important;
  border:2px solid #fff !important;
  border-radius:999px !important;
  background:#5b6cff !important;
  box-shadow:0 1px 4px rgba(31,41,55,.24) !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}

.pg-range-values-v47{
  margin-top:1px !important;
  color:#7d86a5 !important;
  font-family:var(--font-mono) !important;
  font-size:11px !important;
  font-weight:700 !important;
}

.pg-range-hint-v47{
  margin-top:0 !important;
  font-size:10px !important;
  color:#8a94ad !important;
}

@media (max-width:640px){
  .pg-cards-v47{
    grid-template-columns:repeat(auto-fill, minmax(82px, 1fr)) !important;
  }

  .pg-color-card-v47.compact .pg-mini-actions-v47 button{
    min-width:23px !important;
    padding:2px 4px !important;
    font-size:9px !important;
  }
}


/* workbook_modular_v50 — fixed generator scale labels and static hue gradient */
.pg-range-values-v47.fixed{
  color:#7d86a5 !important;
  font-family:var(--font-main) !important;
  font-size:11px !important;
  font-weight:700 !important;
}

.pg-range-fill-v47.hue{
  left:0 !important;
  width:100% !important;
  background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00) !important;
  opacity:1 !important;
}

.pg-range-track-v47:has(.pg-range-fill-v47.hue)::before{
  background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00) !important;
  opacity:.95;
}

.pg-range-track-v47:has(.pg-range-fill-v47.hue) .pg-range-fill-v47{
  box-shadow:none !important;
}

.pg-range-track-v47:has(.pg-range-fill-v47.hue) input[type="range"]::-webkit-slider-runnable-track{
  background:transparent !important;
}

.pg-range-track-v47:has(.pg-range-fill-v47.hue) input[type="range"]::-moz-range-track{
  background:transparent !important;
}


/* workbook_modular_v52 — Palette tab active color tools only */
.palette-active-v52{
  display:grid;
  grid-template-columns:44px minmax(110px,1fr) auto auto;
  align-items:end;
  gap:7px;
}

.palette-active-hex-edit-v52{
  display:grid;
  gap:3px;
}

.palette-active-hex-edit-v52 .input{
  min-height:34px;
  height:34px;
  padding:6px 9px;
  border-radius:10px;
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
}

.palette-active-v52 .btn{
  min-height:34px;
  height:34px;
  padding:6px 10px;
  border-radius:10px;
  font-size:12px;
}

.palette-native-picker-v52{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.palette-active-actions-v52{
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
}

.palette-active-actions-v52 .btn{
  min-height:30px;
  padding:5px 9px;
  border-radius:9px;
  font-size:12px;
}

.palette-active-actions-v52 .btn:disabled,
.palette-active-v52 .btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.palette-color-v47{
  cursor:pointer;
}

.palette-color-v47.active{
  outline:2px solid rgba(91,108,255,.65);
  outline-offset:1px;
}

.palette-color-remove-v47{
  opacity:.78;
}

.palette-color-remove-v47:hover{
  opacity:1;
}

@media (max-width:520px){
  .palette-active-v52{
    grid-template-columns:44px 1fr;
  }

  .palette-active-v52 .btn{
    width:100%;
  }
}


/* workbook_modular_v53 — Palette tab closer to source layout. Palette Generation untouched. */
.palette-old-v53{
  display:grid;
  gap:10px;
}

.palette-top-actions-v53{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:center;
}

.palette-arrow-group-v53{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding-right:14px;
  border-right:1px solid #e7ebf6;
}

.palette-action-group-v53{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  padding:4px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:rgba(255,255,255,.78);
}

.palette-action-group-v53 .btn,
.palette-create-row-v53 .btn,
.palette-editor-head-v53 .btn,
.palette-active-tools-v53 .btn,
.palette-tag-row-v53 .btn{
  min-height:32px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.palette-create-row-v53{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  padding:10px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:rgba(255,255,255,.88);
}

.palette-create-row-v53 .input{
  min-height:34px;
  border-radius:12px;
}

.palette-create-row-v53 > .input:first-child{
  width:210px;
}

.palette-count-input-v53{
  width:72px;
  font-family:var(--font-mono);
  font-weight:800;
}

.palette-divider-v53{
  width:1px;
  height:28px;
  display:inline-block;
  background:#e2e7f1;
  margin:0 4px;
}

.palette-spacer-v53{
  flex:1 1 auto;
}

.palette-count-pill-v53{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  padding:0 13px;
  border-radius:999px;
  background:#fff;
  color:#8a94ad;
  font-size:12px;
  font-weight:800;
}

.palette-sort-map-v53{
  display:flex;
  gap:5px;
  flex-wrap:wrap;
  padding:8px 10px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.palette-sort-map-v53 span{
  padding:3px 8px;
  border-radius:999px;
  background:#f5f6fa;
  color:#68718e;
  font-size:11px;
  font-weight:750;
}

.palette-editor-v53{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.palette-editor-head-v53{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto auto auto auto;
  gap:8px;
  align-items:center;
}

.palette-edit-label-v53{
  color:#68718e;
  font-size:12px;
  font-weight:800;
}

.palette-editor-head-v53 .input{
  min-height:34px;
  border-radius:12px;
  font-weight:700;
}

.palette-strip-edit-v53{
  display:flex;
  min-height:74px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#f8faff;
}

.palette-strip-part-v53{
  flex:1 1 36px;
  min-width:28px;
  border:0;
  outline:0;
}

.palette-strip-part-v53.active{
  box-shadow:inset 0 0 0 3px rgba(37,99,235,.90);
}

.palette-active-tools-v53{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.palette-active-hex-edit-v53{
  width:124px;
  min-height:34px;
  border-radius:12px;
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
}

.palette-color-input-visible-v53,
.palette-add-color-v53{
  width:34px;
  height:34px;
  padding:3px;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
}

.palette-active-tools-v53 .icon-only,
.palette-create-row-v53 .icon-only{
  min-width:34px;
  width:34px;
  padding-inline:0;
}

.palette-tag-row-v53{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.palette-tag-row-v53 .input{
  width:140px;
  min-height:34px;
  border-radius:12px;
}

.palette-tag-v53{
  padding:4px 9px;
  border-radius:999px;
  background:#eef2ff;
  color:#5b4df0;
  font-size:11px;
  font-weight:800;
}

.palette-grid-v53{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
}

.palette-grid-v53.list-mode{
  grid-template-columns:1fr;
}

.palette-card-v53{
  min-width:0;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:12px;
  background:#fff;
}

.palette-card-v53.active{
  outline:2px solid rgba(37,99,235,.90);
  outline-offset:1px;
}

.palette-card-v53.list{
  display:grid;
  grid-template-columns:minmax(220px,320px) minmax(0,1fr);
  align-items:center;
}

.palette-card-strip-v53{
  display:flex;
  min-height:62px;
  overflow:hidden;
  background:#f8faff;
}

.palette-card-strip-v53 span{
  flex:1 1 18px;
  min-width:10px;
}

.palette-card-foot-v53{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:6px 8px;
}

.palette-card-foot-v53 strong{
  min-width:0;
  flex:1 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#111827;
  font-size:12px;
  font-weight:800;
}

.palette-card-foot-v53 > span{
  color:#8a94ad;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:800;
}

.palette-card-foot-v53 .pal-fav-v47{
  width:22px;
  height:22px;
  font-size:11px;
}

@media (max-width:1500px){
  .palette-grid-v53{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media (max-width:1100px){
  .palette-editor-head-v53{
    grid-template-columns:auto minmax(0,1fr);
  }

  .palette-grid-v53{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:760px){
  .palette-grid-v53{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .palette-top-actions-v53{
    grid-template-columns:1fr;
  }

  .palette-action-group-v53{
    justify-content:flex-start;
  }
}


/* workbook_modular_v54 — global color sorting map */
.palette-sort-map-v54{
  display:grid;
  gap:9px;
  padding:12px 14px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:#fff;
}

.palette-sort-map-v54 h3{
  margin:0;
  color:#68718e;
  font-size:13px;
  font-weight:800;
}

.palette-sort-map-grid-v54{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 28px;
}

.palette-sort-map-item-v54{
  color:#111827;
  font-size:13px;
  line-height:1.35;
}

.palette-sort-map-item-v54 strong{
  color:#0f172a;
  font-weight:800;
}

.palette-sort-map-item-v54 span{
  color:#111827;
  font-weight:500;
}

.palette-sort-map-note-v54{
  margin:0;
  color:#7d86a5;
  font-size:12px;
  line-height:1.45;
}

.palette-sort-map-note-v54 strong{
  color:#5f687f;
  font-weight:800;
}

@media (max-width:760px){
  .palette-sort-map-grid-v54{
    grid-template-columns:1fr;
  }
}


/* workbook_modular_v55 — normalize button font weight in color blocks */
.pg-mini-actions-v47 button,
.pg-color-card-v47.compact .pg-mini-actions-v47 button,
.palette-active-tools-v53 .btn,
.palette-tag-row-v53 .btn,
.palette-editor-head-v53 .btn,
.palette-color-remove-v47,
.palette-card-foot-v53 .pal-fav-v47,
.pal-fav-v47{
  font-weight:500 !important;
}

.pg-hex-v47,
.palette-color-hex-v47,
.palette-active-hex-edit-v53,
.palette-card-foot-v53 > span{
  font-weight:600 !important;
}


/* workbook_modular_v56 — Palette top controls one row, actions right */
.palette-top-actions-v53{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
}

.palette-arrow-group-v53{
  flex:0 0 auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:7px !important;
  padding-right:0 !important;
  border-right:0 !important;
}

.palette-action-group-v53{
  flex:0 0 auto !important;
  margin-left:auto !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
  flex-wrap:nowrap !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
}

.palette-action-group-v53 .btn{
  white-space:nowrap !important;
}

@media (max-width:980px){
  .palette-top-actions-v53{
    flex-wrap:wrap !important;
  }

  .palette-action-group-v53{
    width:100% !important;
    margin-left:0 !important;
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }
}


/* workbook_modular_v57 — Palette action cleanup */
.palette-top-actions-v53{
  display:flex !important;
  justify-content:flex-end !important;
  align-items:center !important;
  width:100% !important;
}

.palette-action-group-v53{
  margin-left:auto !important;
  justify-content:flex-end !important;
  align-items:center !important;
  gap:6px !important;
}

.palette-nav-btn-v57{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  border-radius:12px !important;
}

.palette-create-row-v53{
  justify-content:flex-start !important;
}

.palette-create-row-v53 .palette-count-pill-v53{
  margin-left:auto !important;
}

/* Keep destructive action styling only for actual deletion of selected palette */
.palette-action-group-v53 [data-clear-selected-palette]{
  color:#1c2340 !important;
  border-color:#dfe6f3 !important;
  background:#fff !important;
}


/* workbook_modular_v58 — Palette tabs and controls in one row */
.palette-tabs-v47{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  overflow:visible !important;
}

.palette-tabs-left-v58{
  display:flex;
  align-items:center;
  gap:4px;
  width:fit-content;
  max-width:100%;
  padding:3px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.72);
  overflow-x:auto;
}

.palette-header-actions-v58{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex:0 0 auto;
  margin-left:auto;
  white-space:nowrap;
}

.palette-header-actions-v58 .btn{
  min-height:34px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.palette-header-actions-v58 [data-clear-selected-palette]{
  color:#1c2340 !important;
  border-color:#dfe6f3 !important;
  background:#fff !important;
}

.palette-header-actions-v58 .palette-nav-btn-v57{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  border-radius:12px !important;
}

@media (max-width:1160px){
  .palette-tabs-v47{
    flex-wrap:wrap !important;
  }

  .palette-header-actions-v58{
    width:100%;
    justify-content:flex-start;
    flex-wrap:wrap;
    margin-left:0;
  }
}


/* workbook_modular_v59 — separate tab controls from palette deletion */
.palette-header-actions-v58 [data-palette-tab-delete]{
  color:#ef2f24 !important;
  border-color:#ffd4d0 !important;
  background:#fff7f6 !important;
}

.palette-editor-head-v53{
  grid-template-columns:auto minmax(0,1fr) auto auto auto auto auto !important;
}

.palette-editor-head-v53 [data-delete-selected]{
  white-space:nowrap !important;
}


/* workbook_modular_v60 — scoped Palette tabs + no tags */
.palette-tag-row-v53,
.palette-tag-v53,
[data-palette-tag-filter],
[data-pal-new-tag],
[data-pal-add-tag]{
  display:none !important;
}

.palette-header-actions-v58 .palette-nav-btn-v57:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.palette-create-row-v53 .palette-divider-v53:first-of-type{
  margin-left:4px;
}

.palette-grid-v53 .empty-state{
  grid-column:1 / -1;
}


/* workbook_modular_v61 — clarify palette counter and remove confusing add-color control */
.palette-count-label-v61{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  padding:0 4px;
  color:#8a94ad;
  font-size:12px;
  font-weight:650;
  white-space:nowrap;
  pointer-events:none;
  user-select:text;
}

.palette-create-row-v53 .palette-count-label-v61{
  margin-left:auto;
}

.palette-add-color-v53,
[data-pal-add-picker-color],
[data-pal-add-color-picker]{
  display:none !important;
}


/* workbook_modular_v62 — remove confusing '+ 3 вкладки' placeholder */
.palette-editor-head-v53{
  grid-template-columns:auto minmax(0,1fr) auto auto auto !important;
}


/* workbook_modular_v63 — Palette list view as full horizontal color rows */
.palette-grid-v53.list-mode{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:7px !important;
}

.palette-grid-v53.list-mode .palette-card-v53.list,
.palette-grid-v53.list-mode .palette-card-v53{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 176px !important;
  align-items:stretch !important;
  min-height:56px !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid #e7ebf6 !important;
  border-radius:12px !important;
  background:#fff !important;
}

.palette-grid-v53.list-mode .palette-card-v53.active{
  outline:2px solid rgba(37,99,235,.95) !important;
  outline-offset:0 !important;
}

.palette-grid-v53.list-mode .palette-card-strip-v53{
  display:flex !important;
  min-height:56px !important;
  height:56px !important;
  overflow:hidden !important;
  border-radius:0 !important;
  background:#f8faff !important;
}

.palette-grid-v53.list-mode .palette-card-strip-v53 span{
  flex:1 1 0 !important;
  min-width:16px !important;
  height:100% !important;
}

.palette-grid-v53.list-mode .palette-card-strip-v53 em{
  flex:1 1 auto !important;
  min-height:56px !important;
  background:#f7f4ee !important;
}

.palette-grid-v53.list-mode .palette-card-foot-v53{
  display:grid !important;
  grid-template-columns:18px minmax(0, 1fr) auto !important;
  align-items:center !important;
  gap:6px !important;
  min-height:56px !important;
  padding:0 10px !important;
  border-left:1px solid #e7ebf6 !important;
  background:#fff !important;
}

.palette-grid-v53.list-mode .palette-card-foot-v53 .pal-fav-v47{
  grid-column:1 !important;
  grid-row:1 !important;
  width:18px !important;
  height:18px !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#efd98a !important;
  font-size:13px !important;
  line-height:1 !important;
}

.palette-grid-v53.list-mode .palette-card-foot-v53 strong{
  grid-column:2 !important;
  grid-row:1 !important;
  min-width:0 !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  color:#111827 !important;
  font-size:12px !important;
  font-weight:650 !important;
}

.palette-grid-v53.list-mode .palette-card-foot-v53 > span{
  grid-column:3 !important;
  grid-row:1 !important;
  color:#8a94ad !important;
  font-family:var(--font-mono) !important;
  font-size:11px !important;
  font-weight:500 !important;
  white-space:nowrap !important;
}

@media (max-width:760px){
  .palette-grid-v53.list-mode .palette-card-v53.list,
  .palette-grid-v53.list-mode .palette-card-v53{
    grid-template-columns:minmax(0, 1fr) 138px !important;
  }

  .palette-grid-v53.list-mode .palette-card-foot-v53{
    padding:0 8px !important;
    gap:4px !important;
  }
}


/* workbook_modular_v64 — Palette list rows: more space for colors, less empty white space */
.palette-grid-v53.list-mode .palette-card-v53.list,
.palette-grid-v53.list-mode .palette-card-v53{
  display:flex !important;
  align-items:stretch !important;
  width:100% !important;
  min-height:56px !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid #e7ebf6 !important;
  border-radius:12px !important;
  background:#fff !important;
}

.palette-grid-v53.list-mode .palette-card-strip-v53{
  flex:1 1 auto !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  display:flex !important;
  min-height:56px !important;
  height:56px !important;
  overflow:hidden !important;
  border-radius:0 !important;
  background:#f8faff !important;
}

.palette-grid-v53.list-mode .palette-card-strip-v53 span{
  flex:1 1 0 !important;
  min-width:8px !important;
  height:100% !important;
}

.palette-grid-v53.list-mode .palette-card-foot-v53{
  flex:0 0 188px !important;
  width:188px !important;
  min-width:188px !important;
  max-width:188px !important;
  display:grid !important;
  grid-template-columns:18px minmax(0, 1fr) auto !important;
  align-items:center !important;
  gap:6px !important;
  min-height:56px !important;
  padding:0 10px !important;
  border-left:1px solid #e7ebf6 !important;
  background:#fff !important;
}

.palette-grid-v53.list-mode .palette-card-foot-v53 strong{
  min-width:0 !important;
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

@media (max-width:760px){
  .palette-grid-v53.list-mode .palette-card-foot-v53{
    flex-basis:150px !important;
    width:150px !important;
    min-width:150px !important;
    max-width:150px !important;
    padding:0 8px !important;
  }

  .palette-grid-v53.list-mode .palette-card-strip-v53 span{
    min-width:6px !important;
  }
}


/* ===== Combi module v66 ===== */
.combi-ct-v66{
  padding:8px 14px 14px !important;
}

.combi-page-v66{
  display:grid;
  gap:10px;
}

.combi-tabs-row-v66{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.combi-tabs-left-v66{
  display:flex;
  align-items:center;
  gap:4px;
  width:fit-content;
  max-width:100%;
  padding:3px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(255,255,255,.72);
  overflow-x:auto;
}

.combi-tab-v66{
  min-height:32px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#68718e;
  font-size:13px;
  font-weight:650;
  white-space:nowrap;
}

.combi-tab-v66.active{
  background:#fff;
  color:#f7a51d;
  box-shadow:0 1px 4px rgba(31,41,55,.06);
}

.combi-header-actions-v66{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex:0 0 auto;
  margin-left:auto;
  white-space:nowrap;
}

.combi-header-actions-v66 .btn,
.combi-nav-btn-v66{
  min-height:34px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.combi-nav-btn-v66{
  width:34px;
  min-width:34px;
  padding:0;
}

.combi-nav-btn-v66:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.combi-content-v66{
  display:grid;
  gap:10px;
}

.combi-form-v66{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.combi-form-head-v66{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.combi-form-head-v66 strong{
  color:#1c2340;
  font-size:15px;
  font-weight:700;
}

.combi-form-head-v66 span{
  min-height:26px;
  display:inline-flex;
  align-items:center;
  padding:0 9px;
  border-radius:999px;
  background:#f5f6fa;
  color:#7d86a5;
  font-size:12px;
  font-weight:650;
}

.combi-inputs-v66{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}

.combi-color-field-v66{
  display:grid;
  grid-template-columns:minmax(0,1fr) 38px;
  gap:6px;
  align-items:end;
}

.combi-color-field-v66 span{
  grid-column:1 / -1;
  color:#9aa4bf;
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.combi-color-field-v66 .input{
  height:36px;
  min-height:36px;
  border-radius:12px;
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:650;
  text-transform:uppercase;
}

.combi-picker-v66{
  width:38px;
  height:36px;
  padding:3px;
  border:1px solid #e7ebf6;
  border-radius:12px;
  background:#fff;
}

.combi-form-actions-v66{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}

.combi-form-actions-v66 .btn,
.combi-list-head-v66 .btn{
  min-height:32px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.combi-list-head-v66{
  display:flex;
  align-items:center;
  gap:6px;
  justify-content:flex-end;
  color:#8a94ad;
  font-size:12px;
  font-weight:650;
}

.combi-list-head-v66 .active-soft{
  background:#fff2d9;
  color:#b86b00;
  border-color:#ffd99b;
}

.combi-grid-v66{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:8px;
}

.combi-card-v66{
  display:grid;
  grid-template-rows:76px auto;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:#fff;
  cursor:default;
}

.combi-card-v66.active{
  outline:2px solid rgba(247,165,29,.72);
  outline-offset:1px;
}

.combi-card-v66.dragging{
  opacity:.45;
}

.combi-card-v66.combi-drop-target{
  outline:2px dashed rgba(247,165,29,.82);
  outline-offset:3px;
}

.combi-preview-v66{
  display:flex;
  width:100%;
  height:76px;
  border:0;
  padding:0;
  background:#f8faff;
}

.combi-preview-v66 span{
  flex:1 1 0;
}

.combi-card-body-v66{
  display:grid;
  gap:6px;
  padding:7px;
}

.combi-hex-row-v66{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
}

.combi-hex-row-v66 button{
  min-height:24px;
  padding:3px 6px;
  border:1px solid #eef1f8;
  border-radius:8px;
  background:#f8faff;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:500;
}

.combi-card-actions-v66{
  display:flex;
  gap:4px;
  flex-wrap:wrap;
}

.combi-card-actions-v66 button{
  min-height:24px;
  padding:3px 7px;
  border:1px solid #e7ebf6;
  border-radius:8px;
  background:#fff;
  color:#667085;
  font-size:10px;
  font-weight:500;
}

.combi-card-actions-v66 button.active{
  background:#fff7dd;
  color:#d49a00;
  border-color:#f3d27a;
}

.combi-card-actions-v66 button.danger{
  color:#ef2f24;
  border-color:#ffd4d0;
  background:#fff7f6;
}

.combi-card-actions-v66 button.ok,
.combi-hex-row-v66 button.ok{
  color:#16a34a !important;
  border-color:#a7efc1 !important;
  background:#f0fff5 !important;
}

.combi-grid-v66.list-mode{
  grid-template-columns:1fr;
}

.combi-grid-v66.list-mode .combi-card-v66{
  grid-template-columns:minmax(0,1fr) 310px;
  grid-template-rows:1fr;
  min-height:58px;
}

.combi-grid-v66.list-mode .combi-preview-v66{
  height:58px;
}

.combi-grid-v66.list-mode .combi-card-body-v66{
  border-left:1px solid #e7ebf6;
}

@media (max-width:1100px){
  .combi-tabs-row-v66{
    flex-wrap:wrap;
  }

  .combi-header-actions-v66{
    width:100%;
    justify-content:flex-start;
    flex-wrap:wrap;
    margin-left:0;
  }

  .combi-inputs-v66{
    grid-template-columns:1fr;
  }

  .combi-grid-v66.list-mode .combi-card-v66{
    grid-template-columns:1fr;
  }
}


/* workbook_modular_v67 — Combi card block actions: favorite / swap / delete */
.combi-card-actions-v66.compact-actions{
  display:flex !important;
  gap:5px !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
}

.combi-card-actions-v66.compact-actions button{
  width:32px !important;
  height:32px !important;
  min-height:32px !important;
  padding:0 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #e7ebf6 !important;
  border-radius:9px !important;
  background:#fffaf4 !important;
  color:#101828 !important;
  font-size:15px !important;
  font-weight:500 !important;
  line-height:1 !important;
}

.combi-card-actions-v66.compact-actions button:hover{
  background:#fff3e5 !important;
  border-color:#f2d5ad !important;
}

.combi-card-actions-v66.compact-actions button.active{
  background:#fff7dd !important;
  color:#d49a00 !important;
  border-color:#f3d27a !important;
}

.combi-card-actions-v66.compact-actions button.danger{
  background:#fffaf4 !important;
  color:#ef2f24 !important;
  border-color:#f0dcd5 !important;
}

.combi-card-actions-v66.compact-actions button.danger:hover{
  background:#fff0ef !important;
  border-color:#ffc7c2 !important;
}

.combi-card-body-v66{
  align-content:start !important;
}

.combi-hex-row-v66{
  display:none !important;
}


/* workbook_modular_v68 — compact Combi input row + sorting buttons */
.combi-form-v66.compact-v68{
  padding:8px 10px !important;
  border-radius:16px !important;
}

.combi-compact-row-v68{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
}

.combi-type-title-v68{
  flex:0 0 auto;
  min-width:82px;
  color:#111827;
  font-size:16px;
  font-weight:700;
}

.combi-compact-inputs-v68{
  display:flex;
  align-items:center;
  gap:7px;
  flex:0 1 auto;
  min-width:0;
}

.combi-color-pill-v68{
  position:relative;
  display:grid;
  grid-template-columns:42px 130px;
  align-items:center;
  min-height:44px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.combi-color-copy-v68{
  width:42px;
  height:44px;
  border:0;
  border-right:1px solid #edf0f7;
  border-radius:12px;
  cursor:pointer;
}

.combi-color-copy-v68:hover{
  outline:2px solid rgba(91,108,255,.38);
  outline-offset:-2px;
}

.combi-color-pill-v68 .input{
  height:44px !important;
  min-height:44px !important;
  padding:8px 12px !important;
  border:0 !important;
  border-radius:0 !important;
  background:#fff !important;
  font-family:var(--font-mono) !important;
  font-size:13px !important;
  font-weight:500 !important;
  text-transform:uppercase !important;
}

.combi-color-pill-v68 .combi-picker-v66{
  position:absolute;
  left:7px;
  top:7px;
  width:28px !important;
  height:28px !important;
  opacity:0;
  pointer-events:none;
}

.combi-add-btn-v68{
  flex:0 0 auto;
  min-height:44px !important;
  padding:8px 18px !important;
  border-radius:14px !important;
}

.combi-sort-actions-v68{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  margin-left:auto;
  flex-wrap:wrap;
}

.combi-sort-actions-v68 .btn{
  min-height:34px !important;
  padding:6px 12px !important;
  border-radius:999px !important;
  font-size:12px !important;
  font-weight:500 !important;
}

.combi-count-pill-v68{
  min-height:34px;
  display:inline-flex;
  align-items:center;
  padding:0 14px;
  border-radius:999px;
  background:#fff;
  color:#8a94ad;
  font-size:12px;
  font-weight:650;
  white-space:nowrap;
}

.combi-secondary-actions-v68{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  padding-left:90px;
}

.combi-secondary-actions-v68 .btn{
  min-height:30px !important;
  padding:5px 10px !important;
  border-radius:10px !important;
  font-size:12px !important;
}

.combi-list-head-v66{
  display:none !important;
}

@media (max-width:1300px){
  .combi-compact-row-v68{
    flex-wrap:wrap;
  }

  .combi-sort-actions-v68{
    width:100%;
    margin-left:90px;
    justify-content:flex-start;
  }
}

@media (max-width:760px){
  .combi-type-title-v68{
    min-width:100%;
  }

  .combi-color-pill-v68{
    grid-template-columns:40px minmax(0,1fr);
    width:100%;
  }

  .combi-compact-inputs-v68{
    width:100%;
    flex-direction:column;
  }

  .combi-sort-actions-v68,
  .combi-secondary-actions-v68{
    margin-left:0;
    padding-left:0;
  }
}


/* workbook_modular_v69 — Combi cleanup + spectrum sorted column */
.combi-secondary-actions-v68{
  display:none !important;
}

.combi-grid-v66.list-mode{
  grid-template-columns:1fr !important;
}

.combi-grid-v66.list-mode .combi-card-v66{
  width:100% !important;
}


/* workbook_modular_v70 — compact Combi overview */
/* Grid: компактніші картки для великої кількості комбінацій */
.combi-grid-v66{
  grid-template-columns:repeat(auto-fill, minmax(128px, 1fr)) !important;
  gap:7px !important;
}

.combi-card-v66{
  grid-template-rows:54px auto !important;
  border-radius:14px !important;
}

.combi-preview-v66{
  height:54px !important;
  min-height:54px !important;
  border-radius:0 !important;
}

.combi-card-body-v66{
  padding:5px !important;
}

.combi-card-actions-v66.compact-actions{
  gap:4px !important;
}

.combi-card-actions-v66.compact-actions button{
  width:26px !important;
  height:26px !important;
  min-height:26px !important;
  border-radius:8px !important;
  font-size:13px !important;
}

/* Spectrum/list mode: тільки режим Спектр показується в один стовпчик */
.combi-grid-v66.list-mode{
  grid-template-columns:1fr !important;
  gap:5px !important;
}

.combi-grid-v66.list-mode .combi-card-v66{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) auto !important;
  grid-template-rows:34px !important;
  align-items:stretch !important;
  min-height:34px !important;
  height:34px !important;
  overflow:hidden !important;
  border-radius:10px !important;
  background:#fff !important;
}

.combi-grid-v66.list-mode .combi-preview-v66{
  height:34px !important;
  min-height:34px !important;
}

.combi-grid-v66.list-mode .combi-card-body-v66{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:4px !important;
  padding:3px 5px !important;
  border-left:1px solid #e7ebf6 !important;
  background:#fff !important;
}

.combi-grid-v66.list-mode .combi-card-actions-v66.compact-actions{
  display:flex !important;
  gap:3px !important;
  align-items:center !important;
  flex-wrap:nowrap !important;
}

.combi-grid-v66.list-mode .combi-card-actions-v66.compact-actions button{
  width:24px !important;
  height:24px !important;
  min-height:24px !important;
  border-radius:7px !important;
  font-size:12px !important;
}

.combi-grid-v66.list-mode .combi-card-v66.active{
  outline:2px solid rgba(247,165,29,.72) !important;
  outline-offset:1px !important;
}

@media (max-width:760px){
  .combi-grid-v66{
    grid-template-columns:repeat(auto-fill, minmax(112px, 1fr)) !important;
  }

  .combi-grid-v66.list-mode .combi-card-v66{
    grid-template-columns:minmax(0,1fr) 86px !important;
  }
}


/* workbook_modular_v71 — Combi spectrum groups in columns, combos stay in compact rows/grid */
.combi-list-head-visible-v71{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:6px !important;
}

.combi-spectrum-groups-v71{
  display:grid;
  gap:10px;
}

.combi-spectrum-group-v71{
  display:grid;
  gap:6px;
}

.combi-spectrum-title-v71{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:26px;
  color:#68718e;
}

.combi-spectrum-title-v71 strong{
  color:#1c2340;
  font-size:13px;
  font-weight:700;
}

.combi-spectrum-title-v71 span{
  min-height:22px;
  display:inline-flex;
  align-items:center;
  padding:0 8px;
  border-radius:999px;
  background:#fff;
  color:#8a94ad;
  font-size:11px;
  font-weight:650;
}

.combi-spectrum-grid-v71{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(128px, 1fr)) !important;
  gap:7px !important;
}

.combi-spectrum-grid-v71 .combi-card-v66{
  grid-template-rows:54px auto !important;
  min-height:auto !important;
  height:auto !important;
}

.combi-spectrum-grid-v71 .combi-preview-v66{
  height:54px !important;
  min-height:54px !important;
}

.combi-spectrum-grid-v71 .combi-card-body-v66{
  display:grid !important;
  padding:5px !important;
  border-left:0 !important;
}

@media (max-width:760px){
  .combi-spectrum-grid-v71{
    grid-template-columns:repeat(auto-fill, minmax(112px, 1fr)) !important;
  }
}


/* workbook_modular_v72 — compact Combi cards, spectrum labels left, click color to copy */
.combi-grid-v66{
  grid-template-columns:repeat(auto-fill, minmax(112px, 1fr)) !important;
  gap:6px !important;
}

.combi-card-v66{
  grid-template-rows:46px auto !important;
  border-radius:12px !important;
}

.combi-preview-v66{
  display:flex !important;
  width:100% !important;
  height:46px !important;
  min-height:46px !important;
  border:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#f8faff !important;
}

.combi-preview-v66 button{
  flex:1 1 0 !important;
  min-width:0 !important;
  height:100% !important;
  border:0 !important;
  border-radius:0 !important;
  cursor:pointer !important;
}

.combi-preview-v66 button:hover{
  outline:2px solid rgba(91,108,255,.45) !important;
  outline-offset:-2px !important;
}

.combi-card-body-v66{
  padding:4px !important;
}

.combi-card-actions-v66.compact-actions{
  gap:3px !important;
}

.combi-card-actions-v66.compact-actions button{
  width:23px !important;
  height:23px !important;
  min-height:23px !important;
  border-radius:7px !important;
  font-size:12px !important;
}

/* Spectrum mode: groups in a vertical stack, label on the left side */
.combi-spectrum-groups-v71{
  display:grid !important;
  gap:7px !important;
}

.combi-spectrum-group-v71{
  display:grid !important;
  grid-template-columns:92px minmax(0, 1fr) !important;
  gap:7px !important;
  align-items:start !important;
}

.combi-spectrum-title-v71{
  position:sticky;
  top:8px;
  min-height:46px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:center !important;
  gap:3px !important;
  padding:5px 6px !important;
  border:1px solid #e7ebf6 !important;
  border-radius:10px !important;
  background:rgba(255,255,255,.82) !important;
}

.combi-spectrum-title-v71 strong{
  color:#1c2340 !important;
  font-size:12px !important;
  font-weight:650 !important;
  line-height:1.1 !important;
}

.combi-spectrum-title-v71 span{
  min-height:18px !important;
  padding:0 6px !important;
  font-size:10px !important;
}

.combi-spectrum-grid-v71{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(108px, 1fr)) !important;
  gap:6px !important;
}

.combi-spectrum-grid-v71 .combi-card-v66{
  grid-template-rows:46px auto !important;
  border-radius:12px !important;
}

.combi-spectrum-grid-v71 .combi-preview-v66{
  height:46px !important;
  min-height:46px !important;
}

.combi-spectrum-grid-v71 .combi-card-body-v66{
  padding:4px !important;
}

@media (max-width:760px){
  .combi-spectrum-group-v71{
    grid-template-columns:1fr !important;
  }

  .combi-spectrum-title-v71{
    position:static !important;
    min-height:30px !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
  }

  .combi-grid-v66,
  .combi-spectrum-grid-v71{
    grid-template-columns:repeat(auto-fill, minmax(96px, 1fr)) !important;
  }
}


/* workbook_modular_v73 — Combi form swatch opens color picker */
.combi-color-copy-v68{
  cursor:pointer !important;
}

.combi-color-copy-v68:hover{
  outline:2px solid rgba(91,108,255,.55) !important;
  outline-offset:-2px !important;
}


/* workbook_modular_v75 — Combi uses base Color editor modal */
.combi-color-copy-v68{
  cursor:pointer !important;
}


/* workbook_modular_v77 — Combi: move grid toggle into main sorting row and remove extra row */
.combi-list-head-visible-v71{
  display:none !important;
}

.combi-grid-toggle-v77{
  min-width:34px !important;
  width:34px !important;
  padding-inline:0 !important;
  border-radius:12px !important;
}

.combi-sort-actions-v68 .combi-grid-toggle-v77{
  order:0;
}

.combi-sort-actions-v68 [data-combi-sort="spectrum"]{
  order:1;
}

.combi-sort-actions-v68 [data-combi-sort="soft"]{
  order:2;
}

.combi-sort-actions-v68 [data-combi-sort="lightDark"]{
  order:3;
}

.combi-sort-actions-v68 [data-combi-sort="contrast"]{
  order:4;
}

.combi-sort-actions-v68 .combi-count-pill-v68{
  order:5;
}

.combi-sort-actions-v68 [data-combi-clear-list]{
  order:6;
}


/* ===== Import Color module v78 ===== */
.import-color-ct-v78{
  padding:8px 14px 14px !important;
}

.import-color-page-v78{
  display:grid;
  gap:10px;
}

.import-color-head-v78{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.import-color-head-v78 h1{
  margin:0 0 3px;
  color:#1c2340;
  font-size:18px;
  font-weight:750;
}

.import-color-head-v78 p{
  margin:0;
  color:#7d86a5;
  font-size:12px;
}

.import-color-actions-v78,
.import-color-target-actions-v78{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.import-color-actions-v78 .btn,
.import-color-target-actions-v78 .btn{
  min-height:34px;
  padding:6px 12px;
  border-radius:12px;
  font-size:13px;
}

.import-color-grid-v78{
  display:grid;
  grid-template-columns:minmax(320px, 480px) minmax(0, 1fr);
  gap:10px;
}

.import-color-panel-v78{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.import-color-textarea-wrap-v78{
  display:grid;
  gap:5px;
}

.import-color-textarea-v78{
  min-height:230px;
  resize:vertical;
  padding:12px;
  border-radius:14px;
  font-family:var(--font-mono);
  font-size:12px;
  line-height:1.55;
}

.import-color-options-v78{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.import-color-options-v78 label:not(.import-check-v78){
  display:grid;
  gap:5px;
}

.import-color-options-v78 .input,
.import-color-options-v78 .select{
  min-height:36px;
  border-radius:12px;
}

.import-check-v78{
  display:flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:6px 8px;
  border:1px solid #eef1f8;
  border-radius:12px;
  background:#f8faff;
  color:#667085;
  font-size:12px;
  font-weight:500;
}

.import-check-v78 input{
  width:16px;
  height:16px;
}

.import-color-preview-head-v78{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.import-color-preview-head-v78 strong{
  color:#1c2340;
  font-size:14px;
  font-weight:750;
}

.import-color-preview-head-v78 span{
  min-height:28px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border-radius:999px;
  background:#f5f6fa;
  color:#8a94ad;
  font-size:12px;
  font-weight:650;
}

.import-color-preview-v78{
  display:grid;
  gap:8px;
  max-height:560px;
  overflow:auto;
  padding-right:3px;
}

.import-spectrum-group-v78{
  display:grid;
  grid-template-columns:92px minmax(0, 1fr);
  gap:7px;
  align-items:start;
}

.import-spectrum-label-v78{
  min-height:34px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
  padding:5px 7px;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
}

.import-spectrum-label-v78 strong{
  color:#1c2340;
  font-size:12px;
  font-weight:650;
}

.import-spectrum-label-v78 span{
  width:max-content;
  min-height:18px;
  display:inline-flex;
  align-items:center;
  padding:0 6px;
  border-radius:999px;
  background:#f5f6fa;
  color:#8a94ad;
  font-size:10px;
  font-weight:650;
}

.import-swatch-row-v78{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(74px, 1fr));
  gap:5px;
}

.import-swatch-v78{
  min-height:42px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.08);
  border-radius:10px;
  padding:0;
  cursor:pointer;
}

.import-swatch-v78 span{
  width:100%;
  padding:3px 4px;
  background:rgba(255,255,255,.82);
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:9px;
  font-weight:600;
}

.import-swatch-v78.ok{
  outline:2px solid rgba(22,163,74,.62);
  outline-offset:1px;
}

.import-color-log-v78{
  min-height:22px;
  color:#7d86a5;
  font-size:12px;
  font-weight:600;
}

.import-color-log-v78 .ok{
  color:#16a34a;
}

.import-color-log-v78 .warn{
  color:#ef2f24;
}

@media (max-width:1040px){
  .import-color-grid-v78{
    grid-template-columns:1fr;
  }

  .import-color-head-v78{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (max-width:640px){
  .import-color-options-v78{
    grid-template-columns:1fr;
  }

  .import-spectrum-group-v78{
    grid-template-columns:1fr;
  }

  .import-spectrum-label-v78{
    flex-direction:row;
    align-items:center;
    justify-content:flex-start;
    min-height:30px;
  }
}


/* ===== Import Color module v79 — two tabs: photo / pairs ===== */
.import-color-ct-v79{
  padding:8px 14px 14px !important;
}

.import-color-page-v79{
  display:grid;
  gap:10px;
}

.import-tabs-row-v79{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.import-tabs-left-v79{
  display:flex;
  align-items:center;
  gap:4px;
  width:fit-content;
  max-width:100%;
  padding:3px;
  border:1px solid #e7ebf6;
  border-radius:16px;
  background:rgba(255,255,255,.72);
  overflow-x:auto;
}

.import-tab-v79{
  min-height:32px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#68718e;
  font-size:13px;
  font-weight:650;
  white-space:nowrap;
}

.import-tab-v79.active{
  background:#fff;
  color:#1c2340;
  box-shadow:0 1px 4px rgba(31,41,55,.06);
}

.import-header-actions-v79{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  flex-wrap:wrap;
}

.import-header-actions-v79 .btn{
  min-height:34px;
  padding:6px 11px;
  border-radius:12px;
  font-size:13px;
}

.disabled-soft-v79{
  opacity:.48;
  cursor:not-allowed !important;
}

.import-content-v79{
  display:grid;
  gap:10px;
}

.import-top-v79{
  display:grid;
  grid-template-columns:260px minmax(0, 1fr);
  gap:14px;
  align-items:start;
}

.import-drop-col-v79{
  display:grid;
  gap:8px;
}

.import-drop-v79{
  min-height:112px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:15px 12px;
  border:2px dashed #dfe6f3;
  border-radius:16px;
  background:#fffdf9;
  color:#667085;
  text-align:center;
  cursor:pointer;
  transition:.15s;
}

.import-drop-v79.over,
.import-drop-v79:hover{
  background:#f8f1e8;
  border-color:#c8a980;
}

.import-drop-icon-v79{
  font-size:22px;
}

.import-drop-v79 small{
  color:#8a94ad;
  font-size:11px;
}

.import-image-preview-v79{
  display:grid;
  gap:5px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.import-image-preview-v79 img{
  width:100%;
  max-height:220px;
  object-fit:contain;
  display:block;
  background:#f7f4ee;
}

.import-image-preview-v79 span{
  padding:0 8px 8px;
  color:#8a94ad;
  font-size:11px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.import-control-col-v79{
  display:grid;
  gap:10px;
}

.import-control-card-v79{
  display:grid;
  gap:8px;
  padding:12px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.import-control-head-v79{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  color:#667085;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.import-mode-row-v79{
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
}

.import-mode-btn-v79{
  min-height:28px;
  padding:4px 10px;
  border:1px solid #dfe6f3;
  border-radius:10px;
  background:#fff;
  color:#667085;
  font-size:12px;
  font-weight:600;
  cursor:pointer;
}

.import-mode-btn-v79.active{
  color:#1c2340;
  border-color:#c8a980;
  background:#fff8ec;
}

.import-hint-v79{
  padding:7px 10px;
  border-radius:10px;
  background:#f7f0e9;
  color:#667085;
  font-size:12px;
  line-height:1.45;
}

.import-hint-v79 b{
  color:#9a7040;
}

.import-control-row-v79{
  display:grid;
  grid-template-columns:140px minmax(0, 1fr) 60px;
  align-items:center;
  gap:8px;
}

.import-control-row-v79.wrap-v79{
  grid-template-columns:140px auto auto;
  justify-content:start;
}

.import-control-row-v79 span{
  color:#1c2340;
  font-size:13px;
  white-space:nowrap;
}

.import-control-row-v79 input[type="range"]{
  width:100%;
}

.import-num-v79{
  height:34px !important;
  min-height:34px !important;
  text-align:center;
  border-radius:10px !important;
}

.import-main-btn-v79{
  min-height:42px;
  border-radius:14px;
  background:#121826 !important;
  border-color:#121826 !important;
}

.import-results-v79{
  display:grid;
  gap:10px;
  padding:12px;
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.import-results-head-v79{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.import-results-head-v79 > div{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.import-results-head-v79 strong{
  color:#1c2340;
  font-size:15px;
  font-weight:750;
}

.import-results-head-v79 span{
  color:#8a94ad;
  font-size:12px;
  font-weight:650;
}

.import-results-head-v79 em{
  padding:3px 8px;
  border:1px solid #f1c986;
  border-radius:999px;
  background:#fff6e5;
  color:#a26719;
  font-size:11px;
  font-style:normal;
  font-weight:650;
}

.link-btn-v79{
  border:0;
  background:transparent;
  color:#3b82f6;
  font-size:12px;
  font-weight:650;
  text-decoration:underline;
  cursor:pointer;
}

.import-color-grid-v79{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(104px, 1fr));
  gap:7px;
}

.import-color-card-v79{
  position:relative;
  display:grid;
  gap:4px;
  padding:6px;
  border:1px solid #e7ebf6;
  border-radius:12px;
  background:#fff;
}

.import-color-card-v79.warn{
  border-color:#f1c986;
  background:#fffaf0;
}

.import-color-card-v79 input[type="checkbox"],
.import-pair-card-v79 input[type="checkbox"]{
  position:absolute;
  top:6px;
  left:6px;
  z-index:2;
}

.import-color-swatch-v79{
  height:52px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:10px;
  cursor:pointer;
}

.import-color-card-v79 strong{
  text-align:center;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:650;
}

.import-color-card-v79 small{
  color:#a26719;
  font-size:10px;
  text-align:center;
  line-height:1.25;
}

.import-save-row-v79{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  padding-top:10px;
  border-top:1px solid #eef1f8;
}

.import-save-row-v79 .btn,
.import-board-select-v79{
  min-height:34px;
  border-radius:12px;
  font-size:13px;
}

.import-board-select-v79{
  min-width:140px;
}

.import-empty-v79{
  min-height:80px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#8a94ad;
  font-size:13px;
}

.import-pair-grid-v79{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(126px, 1fr));
  gap:8px;
}

.import-pair-card-v79{
  position:relative;
  display:grid;
  gap:5px;
  padding:6px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.import-pair-preview-v79{
  display:flex;
  height:60px;
  overflow:hidden;
  border-radius:11px;
}

.import-pair-preview-v79 button{
  flex:1 1 0;
  border:0;
  cursor:pointer;
}

.import-pair-preview-v79 button:hover,
.import-color-swatch-v79:hover{
  outline:2px solid rgba(91,108,255,.45);
  outline-offset:-2px;
}

.import-pair-hex-v79{
  display:flex;
  flex-direction:column;
  gap:2px;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:600;
  text-align:center;
}

.ok{
  outline:2px solid rgba(22,163,74,.62) !important;
  outline-offset:1px !important;
}

@media (max-width:1060px){
  .import-tabs-row-v79,
  .import-control-head-v79{
    align-items:flex-start;
    flex-direction:column;
  }

  .import-header-actions-v79{
    justify-content:flex-start;
  }

  .import-top-v79{
    grid-template-columns:1fr;
  }
}

@media (max-width:680px){
  .import-control-row-v79,
  .import-control-row-v79.wrap-v79{
    grid-template-columns:1fr;
  }
}


/* workbook_modular_v80 — Import Color visual cleanup: remove old warm/yellow styling */
.import-drop-v79{
  background:#ffffff !important;
  border-color:#dfe6f3 !important;
  color:#667085 !important;
}

.import-drop-v79.over,
.import-drop-v79:hover{
  background:#f8faff !important;
  border-color:#d7ddff !important;
}

.import-image-preview-v79 img{
  background:#f8faff !important;
}

.import-control-card-v79,
.import-results-v79{
  background:rgba(255,255,255,.92) !important;
  border-color:#e7ebf6 !important;
}

.import-hint-v79{
  background:#f8faff !important;
  color:#667085 !important;
  border:1px solid #eef1f8 !important;
}

.import-hint-v79 b{
  color:#4f46e5 !important;
}

.import-mode-btn-v79{
  background:#ffffff !important;
  border-color:#e7ebf6 !important;
  color:#667085 !important;
}

.import-mode-btn-v79:hover{
  background:#f8faff !important;
  border-color:#dfe6f3 !important;
}

.import-mode-btn-v79.active{
  background:#eef2ff !important;
  color:#4f46e5 !important;
  border-color:#d7ddff !important;
}

.import-results-head-v79 em{
  background:#fff7f6 !important;
  border-color:#ffd4d0 !important;
  color:#d92d20 !important;
}

.import-color-card-v79.warn{
  background:#fffafa !important;
  border-color:#ffd4d0 !important;
}

.import-color-card-v79 small{
  color:#d92d20 !important;
}

.import-main-btn-v79{
  background:#121826 !important;
  border-color:#121826 !important;
  color:#ffffff !important;
}


/* workbook_modular_v83 — Import Color: pipette + larger image + results under controls */
.import-top-v79.import-photo-layout-v83{
  grid-template-columns:minmax(360px, 430px) minmax(0, 1fr) !important;
  align-items:start !important;
}

.import-drop-v79{
  min-height:136px !important;
}

.import-image-preview-v79{
  min-height:460px !important;
  align-content:start !important;
}

.import-image-preview-v79 img{
  width:100% !important;
  max-height:none !important;
  min-height:390px !important;
  object-fit:contain !important;
}

.import-image-preview-v79 em{
  padding:0 10px 10px;
  color:#4f46e5;
  font-size:12px;
  font-style:normal;
  font-weight:650;
}

.import-image-preview-v79.pipette-active-v83{
  border-color:#b8c2ff !important;
  box-shadow:0 0 0 3px rgba(91,108,255,.10) !important;
}

.import-image-preview-v79.pipette-active-v83 img{
  cursor:crosshair !important;
}

.pipette-btn-v83.active{
  background:#eef2ff !important;
  color:#4f46e5 !important;
  border-color:#b8c2ff !important;
}

.pipette-btn-v83:disabled{
  opacity:.45 !important;
  cursor:not-allowed !important;
}

.import-control-col-v79 .import-results-v79{
  margin-top:0 !important;
}

.import-color-card-v79 .picked-v83{
  color:#4f46e5 !important;
}

@media (max-width:1060px){
  .import-top-v79.import-photo-layout-v83{
    grid-template-columns:1fr !important;
  }

  .import-image-preview-v79{
    min-height:auto !important;
  }

  .import-image-preview-v79 img{
    min-height:260px !important;
  }
}


/* workbook_modular_v85 — Import pairs: Color_Palette_v37 behavior */
.pair-eyedrop-bar-v85{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
  padding:8px;
  border:1px solid #e7ebf6;
  border-radius:12px;
  background:#fff;
}

.pair-eyedrop-slot-v85{
  width:32px;
  height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:2px dashed #c8d0e4;
  border-radius:9px;
  background:#f8faff;
  color:#8a94ad;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  flex:0 0 32px;
}

.pair-eyedrop-slot-v85.filled{
  border-style:solid;
  border-color:rgba(15,23,42,.14);
}

.pair-eyedrop-slot-v85.active-slot{
  border-color:#4f46e5;
  border-style:solid;
  box-shadow:0 0 0 2px rgba(79,70,229,.16);
}

.pair-eyedrop-arrow-v85{
  color:#8a94ad;
  font-size:14px;
}

.pair-eyedrop-label-v85{
  color:#8a94ad;
  font-size:12px;
  font-weight:600;
}

.import-image-preview-v79.pair-pipette-active-v85{
  border-color:#b8c2ff !important;
  box-shadow:0 0 0 3px rgba(91,108,255,.10) !important;
}

.import-image-preview-v79.pair-pipette-active-v85 img{
  cursor:crosshair !important;
}

.import-pair-card-v79.picked-v85{
  border-color:#b8c2ff !important;
  box-shadow:0 0 0 2px rgba(91,108,255,.08) !important;
}

.pair-picked-label-v85{
  color:#4f46e5;
  font-size:10px;
  font-weight:650;
  text-align:center;
}


/* workbook_modular_v86 — Import pairs pipette: show selected colors in slots */
.pair-eyedrop-slot-v85.filled{
  border-style:solid !important;
  border-color:rgba(15,23,42,.16) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55) !important;
  color:transparent !important;
  position:relative !important;
  overflow:hidden !important;
}

.pair-eyedrop-slot-v85.filled span{
  position:absolute;
  left:50%;
  bottom:-22px;
  transform:translateX(-50%);
  padding:2px 6px;
  border:1px solid #e7ebf6;
  border-radius:999px;
  background:#fff;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:9px;
  line-height:1.1;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .12s ease, bottom .12s ease;
  z-index:3;
}

.pair-eyedrop-slot-v85.filled:hover span{
  bottom:2px;
  opacity:1;
}

.pair-eyedrop-slot-v85.filled::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:7px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.55);
  pointer-events:none;
}

.pair-eyedrop-slot-v85.filled.active-slot{
  border-color:#4f46e5 !important;
  box-shadow:0 0 0 2px rgba(79,70,229,.18), inset 0 0 0 1px rgba(255,255,255,.55) !important;
}


/* workbook_modular_v88 — Import photo can add selected colors to Combi */
.import-save-row-v79 [data-photo-to-combi]{
  border-color:#d7ddff !important;
  color:#4f46e5 !important;
  background:#f8faff !important;
}

.import-save-row-v79 [data-photo-to-combi]:hover{
  background:#eef2ff !important;
}


/* workbook_modular_v90 — Wheel Itten clean module */
.itten-ct-v90{
  padding:8px 14px 14px !important;
}

.itten-module-v90{
  display:grid;
  gap:12px;
}

.itten-layout-v90{
  display:grid;
  grid-template-columns:410px minmax(0,1fr);
  gap:14px;
  align-items:start;
}

.itten-wheel-card-v90,
.itten-schemes-card-v90,
.itten-pairs-card-v90,
.itten-grid-card-v90{
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.itten-wheel-card-v90{
  display:grid;
  gap:10px;
  padding:12px;
  position:sticky;
  top:10px;
}

#ittenCanvasV90{
  width:380px;
  height:380px;
  max-width:100%;
  display:block;
  margin:0 auto;
  cursor:crosshair;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}

.itten-active-row-v90{
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 9px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#f8faff;
}

.itten-active-swatch-v90{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:10px;
  cursor:pointer;
}

.itten-active-info-v90{
  display:grid;
  gap:1px;
  min-width:0;
  flex:1;
}

.itten-active-info-v90 strong{
  color:#1c2340;
  font-size:13px;
  font-weight:750;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.itten-active-info-v90 span{
  color:#7d86a5;
  font-size:11px;
  font-weight:600;
}

.itten-active-row-v90 code{
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:700;
}

.itten-controls-card-v90{
  display:grid;
  gap:8px;
  padding:10px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.itten-mini-title-v90,
.itten-option-title-v90{
  color:#68718e;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.itten-level-buttons-v90{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:5px;
}

.itten-level-btn-v90,
.itten-scheme-btn-v90,
.itten-mode-btn-v90,
.itten-ratio-btn-v90{
  border:1px solid #e7ebf6;
  background:#fff;
  color:#667085;
  border-radius:10px;
  cursor:pointer;
  font-weight:650;
}

.itten-level-btn-v90{
  min-height:42px;
  display:grid;
  place-items:center;
  gap:1px;
  padding:4px;
}

.itten-level-btn-v90 strong{
  color:#1c2340;
  font-size:14px;
}

.itten-level-btn-v90 span{
  color:#7d86a5;
  font-size:9px;
}

.itten-level-btn-v90.active,
.itten-scheme-btn-v90.active,
.itten-mode-btn-v90.active,
.itten-ratio-btn-v90.active{
  background:#eef2ff;
  border-color:#d7ddff;
  color:#4f46e5;
}

.itten-level-note-v90,
.itten-control-hint-v90,
.itten-control-footer-v90{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:#8a94ad;
  font-size:11px;
}

.itten-control-row-v90{
  display:grid;
  grid-template-columns:92px minmax(0,1fr) 58px;
  align-items:center;
  gap:8px;
}

.itten-control-label-v90{
  color:#1c2340;
  font-size:12px;
  font-weight:650;
}

.itten-control-value-v90{
  min-height:32px !important;
  height:32px !important;
  text-align:center;
  border-radius:10px !important;
}

.itten-actions-v90,
.itten-scheme-actions-v90{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}

.itten-actions-v90 .btn,
.itten-scheme-actions-v90 .btn{
  min-height:34px;
  padding:6px 10px;
  border-radius:12px;
  font-size:13px;
}

.itten-side-v90{
  display:grid;
  gap:10px;
  min-width:0;
}

.itten-schemes-card-v90,
.itten-pairs-card-v90,
.itten-grid-card-v90{
  display:grid;
  gap:10px;
  padding:12px;
}

.itten-scheme-buttons-v90,
.itten-option-buttons-v90{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}

.itten-scheme-btn-v90,
.itten-mode-btn-v90,
.itten-ratio-btn-v90{
  min-height:30px;
  padding:5px 10px;
  font-size:12px;
}

.itten-wearable-btn-v90{
  border-color:#d7ddff !important;
  color:#4f46e5 !important;
  background:#f8faff !important;
}

.itten-option-block-v90{
  display:grid;
  gap:6px;
}

.itten-scheme-preview-v90{
  display:flex;
  height:86px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.itten-scheme-color-v90{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end;
  gap:2px;
  border:0;
  padding:7px;
  color:var(--overlay-color);
  cursor:pointer;
  min-width:0;
  text-align:left;
}

.itten-scheme-color-v90:hover,
.itten-pairs-item-v90:hover,
.itten-pairs-base-v90:hover{
  outline:2px solid rgba(15,23,42,.14);
  outline-offset:-2px;
}

.itten-scheme-color-v90 span{
  display:inline-flex;
  padding:2px 6px;
  border-radius:999px;
  background:rgba(255,255,255,.76);
  color:#1c2340;
  font-size:10px;
  font-weight:700;
}

.itten-scheme-meta-v90{
  color:#68718e;
  font-size:12px;
  line-height:1.45;
}

.itten-pairs-strip-v90{
  display:grid;
  grid-template-rows:1fr 1fr;
  height:148px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.itten-pairs-items-v90{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(0,1fr);
}

.itten-pairs-item-v90,
.itten-pairs-base-v90{
  position:relative;
  border:0;
  cursor:pointer;
}

.itten-pairs-item-v90.selected{
  outline:3px solid rgba(255,255,255,.98);
  outline-offset:-3px;
  z-index:2;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.22);
}

.itten-pairs-item-v90.selected::before{
  content:"✓";
  position:absolute;
  top:6px;
  right:6px;
  width:20px;
  height:20px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#1c2340;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
}

.itten-pairs-base-v90::before{
  content:"база";
  position:absolute;
  top:8px;
  left:10px;
  padding:3px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.06);
  color:#1c2340;
  font-size:10px;
  font-weight:700;
}

.itten-grid-v90{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(180px,1fr));
  gap:7px;
}

.itten-chip-v90{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:52px;
  padding:6px;
  border:1px solid #e7ebf6;
  border-radius:13px;
  background:#fff;
  cursor:pointer;
  text-align:left;
}

.itten-chip-v90.active{
  outline:2px solid #4f46e5;
  outline-offset:1px;
}

.itten-chip-swatch-v90{
  width:38px;
  height:38px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:10px;
  flex:0 0 38px;
}

.itten-chip-body-v90{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}

.itten-chip-index-v90{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#f4f6fb;
  color:#68718e;
  font-size:11px;
  font-weight:800;
  flex:0 0 22px;
}

.itten-chip-text-v90{
  display:grid;
  gap:2px;
  min-width:0;
}

.itten-chip-name-v90{
  color:#1c2340;
  font-size:12px;
  font-weight:750;
}

.itten-chip-hex-v90{
  color:#8a94ad;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:650;
}

.itten-toast-v90{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:9999;
  transform:translateX(-50%) translateY(12px);
  opacity:0;
  padding:8px 12px;
  border:1px solid #d7ddff;
  border-radius:999px;
  background:#fff;
  color:#4f46e5;
  font-size:12px;
  font-weight:750;
  box-shadow:0 12px 28px rgba(31,41,55,.14);
  pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}

.itten-toast-v90.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

@media (max-width:1080px){
  .itten-layout-v90{
    grid-template-columns:1fr;
  }

  .itten-wheel-card-v90{
    position:static;
  }

  #ittenCanvasV90{
    width:340px;
    height:340px;
  }
}

@media (max-width:620px){
  .itten-control-row-v90{
    grid-template-columns:1fr;
  }

  .itten-level-buttons-v90{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .itten-grid-v90{
    grid-template-columns:1fr;
  }
}


/* workbook_modular_v91 — Wheel / Кольорове коло */
.wheel-ct-v91{
  padding:8px 14px 14px !important;
}

.wheel-module-v91{
  display:grid;
  gap:12px;
}

.wheel-layout-v91{
  display:grid;
  grid-template-columns:410px minmax(0,1fr);
  gap:14px;
  align-items:start;
}

.wheel-panel-v91,
.wheel-card-v91{
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.wheel-panel-v91{
  display:grid;
  gap:10px;
  padding:12px;
  position:sticky;
  top:10px;
}

#wheelCanvasV91{
  width:380px;
  height:380px;
  max-width:100%;
  display:block;
  margin:0 auto;
  cursor:crosshair;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}

.wheel-view-toggle-v91{
  display:grid;
  gap:8px;
  padding:9px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.wheel-view-head-v91{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}

.wheel-view-head-v91.compact{
  align-items:flex-start;
}

.wheel-view-label-v91,
.wheel-section-title-v91,
.wheel-slider-label-v91{
  color:#68718e;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.wheel-view-buttons-v91,
.wheel-mode-row-v91{
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
}

.wheel-view-btn-v91,
.wheel-mode-btn-v91{
  min-height:30px;
  padding:5px 10px;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
  color:#667085;
  font-size:12px;
  font-weight:650;
  cursor:pointer;
}

.wheel-view-btn-v91.active,
.wheel-mode-btn-v91.active{
  background:#eef2ff;
  border-color:#d7ddff;
  color:#4f46e5;
}

.wheel-active-row-v91{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#f8faff;
}

.wheel-active-swatch-v91{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:10px;
  cursor:pointer;
}

.wheel-active-row-v91 .input{
  flex:1;
  min-width:0;
  font-family:var(--font-mono);
}

.wheel-slider-block-v91{
  display:grid;
  gap:4px;
}

.wheel-slider-row-v91{
  display:flex;
  align-items:center;
  gap:8px;
}

.wheel-slider-row-v91 input[type="range"]{
  flex:1;
  min-width:0;
}

.wheel-slider-number-v91{
  width:58px !important;
  min-height:32px !important;
  height:32px !important;
  text-align:center;
  border-radius:10px !important;
}

.wheel-side-v91{
  display:grid;
  gap:10px;
  min-width:0;
}

.wheel-card-v91{
  display:grid;
  gap:10px;
  padding:12px;
}

.wheel-mode-group-v91{
  display:grid;
  gap:6px;
}

.wheel-harmony-preview-v91{
  display:grid;
  gap:0;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.wheel-harmony-top-v91{
  display:grid;
  height:84px;
}

.wheel-harmony-bottom-v91{
  height:84px;
}

.wheel-harmony-block-v91,
.wheel-harmony-bottom-v91{
  border:0;
  cursor:pointer;
  position:relative;
}

.wheel-harmony-block-v91:hover,
.wheel-harmony-bottom-v91:hover,
.wheel-pairs-item-v91:hover,
.wheel-pairs-base-v91:hover{
  outline:2px solid rgba(15,23,42,.14);
  outline-offset:-2px;
}

.wheel-pairs-strip-v91{
  display:grid;
  grid-template-rows:1fr 1fr;
  height:150px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.wheel-pairs-items-v91{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(0,1fr);
}

.wheel-pairs-item-v91,
.wheel-pairs-base-v91{
  position:relative;
  border:0;
  cursor:pointer;
}

.wheel-pairs-item-v91.selected{
  outline:3px solid rgba(255,255,255,.98);
  outline-offset:-3px;
  z-index:2;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.22);
}

.wheel-pairs-item-v91.selected::before{
  content:"✓";
  position:absolute;
  top:6px;
  right:6px;
  width:20px;
  height:20px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#1c2340;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
}

.wheel-pairs-base-v91::before{
  content:"база";
  position:absolute;
  top:8px;
  left:10px;
  padding:3px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(0,0,0,.06);
  color:#1c2340;
  font-size:10px;
  font-weight:700;
}

.wheel-pairs-custom-v91{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  padding:8px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#f8faff;
}

.wheel-pairs-custom-v91 > span{
  color:#68718e;
  font-size:12px;
  font-weight:700;
}

.wheel-pairs-custom-v91 .input{
  width:130px;
  min-height:32px;
  height:32px;
  font-family:var(--font-mono);
}

.wheel-pair-picker-v91{
  width:34px;
  height:34px;
  flex:0 0 34px;
  overflow:hidden;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
  position:relative;
}

.wheel-pair-picker-v91 input[type="color"]{
  position:absolute;
  inset:-4px;
  width:calc(100% + 8px);
  height:calc(100% + 8px);
  padding:0;
  border:0;
  cursor:pointer;
}

.wheel-base-variants-v91{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
}

.wheel-variant-card-v91{
  display:grid;
  gap:5px;
  min-width:0;
  padding:6px;
  border:1px solid #e7ebf6;
  border-radius:12px;
  background:#fff;
  cursor:pointer;
  text-align:left;
}

.wheel-variant-card-v91:hover{
  outline:2px solid rgba(15,23,42,.10);
  outline-offset:-2px;
}

.wheel-variant-swatch-v91{
  height:32px;
  border-radius:8px;
  border:1px solid rgba(15,23,42,.08);
}

.wheel-variant-name-v91{
  color:#1c2340;
  font-size:11px;
  font-weight:750;
}

.wheel-variant-hex-v91{
  color:#8a94ad;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:650;
}

.wheel-refine-grid-v91{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.wheel-save-row-v91{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.wheel-save-row-v91 .input{
  min-width:150px;
}

.wheel-toast-v91{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:9999;
  transform:translateX(-50%) translateY(12px);
  opacity:0;
  padding:8px 12px;
  border:1px solid #d7ddff;
  border-radius:999px;
  background:#fff;
  color:#4f46e5;
  font-size:12px;
  font-weight:750;
  box-shadow:0 12px 28px rgba(31,41,55,.14);
  pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}

.wheel-toast-v91.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

@media (max-width:1080px){
  .wheel-layout-v91{
    grid-template-columns:1fr;
  }

  .wheel-panel-v91{
    position:static;
  }

  #wheelCanvasV91{
    width:340px;
    height:340px;
  }
}

@media (max-width:720px){
  .wheel-refine-grid-v91,
  .wheel-base-variants-v91{
    grid-template-columns:1fr;
  }

  .wheel-slider-row-v91{
    flex-wrap:wrap;
  }
}


/* workbook_modular_v92 — Wheel Adobe */
.wa5-ct-v92{
  padding:8px 14px 14px !important;
}

.wa5-module-v92{
  display:grid;
  gap:12px;
}

.wa5-shell-v92{
  display:grid;
  grid-template-columns:420px minmax(0,1fr);
  grid-template-areas:
    "wheel controls"
    "palette palette";
  gap:14px;
  align-items:start;
}

.wa5-wheel-panel-v92,
.wa5-card-v92,
.wa5-palette-group-v92{
  border:1px solid #e7ebf6;
  border-radius:18px;
  background:rgba(255,255,255,.92);
}

.wa5-wheel-panel-v92{
  grid-area:wheel;
  display:grid;
  gap:10px;
  padding:14px;
  position:sticky;
  top:10px;
}

.wa5-wheel-outer-v92{
  position:relative;
  width:380px;
  height:380px;
  margin:0 auto;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}

.wa5-wheel-disc-v92{
  position:absolute;
  inset:0;
  border-radius:50%;
  cursor:crosshair;
  box-shadow:0 16px 38px rgba(31,41,55,.16);
}

.wa5-grid-overlay-v92{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:2;
}

.wa5-grid-line-v92{
  stroke:rgba(255,255,255,.48);
  stroke-width:1.05;
}

.wa5-grid-ring-v92{
  fill:none;
  stroke:rgba(255,255,255,.38);
  stroke-width:1.05;
}

.wa5-marker-v92{
  position:absolute;
  width:22px;
  height:22px;
  border:3px solid #fff;
  border-radius:999px;
  box-shadow:0 3px 10px rgba(15,23,42,.32);
  transform:translate(-50%, -50%);
  cursor:grab;
  z-index:5;
}

.wa5-marker-v92.primary{
  width:30px;
  height:30px;
  border-width:4px;
  z-index:6;
}

.wa5-marker-v92.extra{
  border-color:#111827;
}

.wa5-marker-v92.overridden{
  box-shadow:0 0 0 3px rgba(79,70,229,.45), 0 3px 10px rgba(15,23,42,.32);
}

.wa5-base-card-v92{
  display:grid;
  gap:5px;
}

.wa5-base-box-v92{
  min-height:46px;
  border:1px solid rgba(15,23,42,.10);
  border-radius:14px;
  font-family:var(--font-mono);
  font-size:16px;
  font-weight:800;
  cursor:pointer;
}

.wa5-base-card-v92 > span{
  color:#8a94ad;
  font-size:11px;
  font-weight:600;
  text-align:center;
}

.wa5-base-input-v92{
  width:100%;
  height:40px;
  border:0;
  border-radius:12px;
  background:rgba(255,255,255,.92);
  color:#111827;
  font-family:var(--font-mono);
  font-size:14px;
  font-weight:800;
  text-align:center;
}

.wa5-actions-row-v92{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.wa5-actions-row-v92 .btn{
  min-height:34px;
  border-radius:12px;
  font-size:13px;
}

.wa5-controls-v92{
  grid-area:controls;
  display:grid;
  gap:10px;
  min-width:0;
}

.wa5-card-v92{
  display:grid;
  gap:9px;
  padding:12px;
}

.wa5-card-title-v92,
.wa5-palette-label-v92{
  color:#68718e;
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.wa5-button-row-v92{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.wa5-harmony-btn-v92{
  min-height:30px;
  padding:5px 10px;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
  color:#667085;
  font-size:12px;
  font-weight:650;
  cursor:pointer;
}

.wa5-harmony-btn-v92.active{
  background:#eef2ff;
  border-color:#d7ddff;
  color:#4f46e5;
}

.wa5-slider-block-v92{
  display:grid;
  gap:5px;
}

.wa5-slider-block-v92.hidden{
  display:none !important;
}

.wa5-slider-block-v92 span{
  color:#667085;
  font-size:12px;
  font-weight:650;
}

.wa5-slider-block-v92 b{
  color:#1c2340;
  font-weight:800;
}

.wa5-slider-block-v92 input[type="range"]{
  width:100%;
}

.wa5-slider-with-lock-v92{
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  gap:7px;
  align-items:center;
}

.wa5-lock-btn-v92{
  width:34px;
  height:34px;
  border:1px solid #e7ebf6;
  border-radius:10px;
  background:#fff;
  cursor:pointer;
}

.wa5-lock-btn-v92.locked{
  background:#eef2ff;
  border-color:#d7ddff;
}

.wa5-step-card-v92 .btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.wa5-palette-section-v92{
  grid-area:palette;
  display:grid;
  gap:10px;
}

.wa5-palette-group-v92{
  display:grid;
  gap:9px;
  padding:12px;
}

.wa5-palette-group-v92.hidden{
  display:none !important;
}

.wa5-palette-v92{
  display:flex;
  align-items:stretch;
  gap:7px;
  flex-wrap:wrap;
}

.wa5-swatch-v92{
  position:relative;
  width:120px;
  display:grid;
  gap:5px;
  padding:7px;
  border:1px solid #e7ebf6;
  border-radius:14px;
  background:#fff;
}

.wa5-swatch-v92.is-primary{
  outline:2px solid rgba(79,70,229,.35);
}

.wa5-swatch-role-v92{
  color:#8a94ad;
  font-size:10px;
  font-weight:750;
  text-transform:uppercase;
  letter-spacing:.03em;
}

.wa5-swatch-role-v92.main{
  color:#4f46e5;
}

.wa5-swatch-color-v92{
  height:44px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:10px;
  cursor:pointer;
}

.wa5-swatch-hex-v92{
  border:0;
  background:transparent;
  color:#1c2340;
  font-family:var(--font-mono);
  font-size:11px;
  font-weight:750;
  cursor:pointer;
}

.wa5-swatch-del-v92{
  position:absolute;
  top:5px;
  right:5px;
  width:22px;
  height:22px;
  border:1px solid #ffd4d0;
  border-radius:999px;
  background:#fff7f6;
  color:#d92d20;
  font-size:14px;
  font-weight:800;
  cursor:pointer;
}

.wa5-palette-plus-v92{
  width:32px;
  min-height:92px;
  align-self:stretch;
  border:1px dashed #c8d0e4;
  border-radius:12px;
  background:#f8faff;
  color:#4f46e5;
  font-size:18px;
  font-weight:800;
  cursor:pointer;
}

.wa5-palette-plus-v92:disabled{
  opacity:.4;
  cursor:not-allowed;
}

.wa5-toast-v92{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:9999;
  transform:translateX(-50%) translateY(12px);
  opacity:0;
  padding:8px 12px;
  border:1px solid #d7ddff;
  border-radius:999px;
  background:#fff;
  color:#4f46e5;
  font-size:12px;
  font-weight:750;
  box-shadow:0 12px 28px rgba(31,41,55,.14);
  pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}

.wa5-toast-v92.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

@media (max-width:1080px){
  .wa5-shell-v92{
    grid-template-columns:1fr;
    grid-template-areas:
      "wheel"
      "controls"
      "palette";
  }

  .wa5-wheel-panel-v92{
    position:static;
  }
}

@media (max-width:560px){
  .wa5-wheel-outer-v92{
    width:340px;
    height:340px;
  }

  .wa5-swatch-v92{
    width:100%;
  }

  .wa5-palette-plus-v92{
    width:100%;
    min-height:36px;
  }
}


/* workbook_modular_v94 — Wheel Adobe S */
.was-ct-v94{
  padding:8px 14px 14px !important;
}

.was-module-v94{
  display:grid;
  gap:12px;
}

.was-wrap-v94{
  width:100%;
}

.was-panel-v94{
  width:100%;
  display:grid;
  gap:18px;
  padding:22px;
  border:1px solid #e7ebf6;
  border-radius:24px;
  background:rgba(255,255,255,.92);
}

.was-head-v94{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  flex-wrap:wrap;
}

.was-mini-v94{
  margin-bottom:5px;
  color:#9aa4bf;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.was-head-v94 h2{
  margin:0;
  color:#1c2340;
  font-size:25px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-.04em;
}

.was-controls-v94{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:wrap;
}

.was-field-v94,
.was-harmony-group-v94,
.was-range-row-v94 label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:#8b95ad;
  font-family:var(--font-mono);
  font-size:10px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.was-field-v94 .input{
  width:112px;
  height:38px !important;
  min-height:38px !important;
  border-radius:12px !important;
  font-family:var(--font-mono);
  text-transform:uppercase;
}

.was-harmony-row-v94{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
}

.was-harmony-btn-v94{
  height:38px;
  padding:0 12px;
  border:1px solid #e5eaf4;
  border-radius:12px;
  background:#fbfcff;
  color:#42506e;
  font-family:var(--font-main);
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
  transition:background .15s, border-color .15s, color .15s;
}

.was-harmony-btn-v94:hover{
  background:#f3f5fb;
  border-color:#d9e0ef;
}

.was-harmony-btn-v94.active{
  background:#7c3aed;
  border-color:#7c3aed;
  color:#ffffff;
}

.was-grid-v94{
  display:grid;
  grid-template-columns:460px minmax(520px, 1fr);
  gap:24px;
  align-items:start;
}

.was-canvas-box-v94{
  padding:20px;
  border:1px solid #eef1f8;
  border-radius:22px;
  background:#f7f9ff;
  text-align:center;
}

.was-canvas-box-v94 canvas{
  width:380px;
  height:380px;
  max-width:100%;
  cursor:grab;
  touch-action:none;
  user-select:none;
  -webkit-user-select:none;
}

.was-canvas-box-v94 canvas.dragging{
  cursor:grabbing;
}

.was-hint-v94{
  margin-top:10px;
  color:#8b95ad;
  font-size:12px;
}

.was-side-v94{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.was-range-row-v94{
  padding:12px 14px;
  border:1px solid #eef1f8;
  border-radius:18px;
  background:#f7f9ff;
}

.was-range-row-v94 label{
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.was-range-value-v94{
  color:#6f7b98;
  white-space:nowrap;
}

.was-range-row-v94 input[type="range"]{
  width:100%;
  accent-color:#7c3aed;
}

.was-actions-v94{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
}

.was-actions-v94 .btn{
  min-height:34px;
  padding:6px 10px;
  border-radius:12px;
  font-size:13px;
}

.was-palette-v94{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
}

.was-swatch-v94{
  display:grid;
  overflow:hidden;
  padding:0;
  border:1px solid #e7ebf5;
  border-radius:16px;
  background:#fff;
  cursor:pointer;
  text-align:left;
}

.was-swatch-v94:hover{
  outline:2px solid rgba(124,58,237,.18);
  outline-offset:1px;
}

.was-swatch-color-v94{
  height:54px;
}

.was-swatch-code-v94{
  display:flex;
  justify-content:space-between;
  gap:8px;
  padding:8px 10px;
  color:#5f6b85;
  font-family:var(--font-mono);
  font-size:11px;
}

.was-swatch-code-v94 b{
  color:#1c2340;
}

.was-toast-v94{
  position:fixed;
  left:50%;
  bottom:22px;
  z-index:9999;
  transform:translateX(-50%) translateY(12px);
  opacity:0;
  padding:8px 12px;
  border:1px solid #d7ddff;
  border-radius:999px;
  background:#fff;
  color:#4f46e5;
  font-size:12px;
  font-weight:750;
  box-shadow:0 12px 28px rgba(31,41,55,.14);
  pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}

.was-toast-v94.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

@media (max-width:1400px){
  .was-grid-v94{
    grid-template-columns:440px minmax(360px, 1fr);
  }

  .was-palette-v94{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }
}

@media (max-width:1180px){
  .was-harmony-row-v94{
    flex-wrap:wrap;
  }

  .was-grid-v94{
    grid-template-columns:1fr;
  }

  .was-canvas-box-v94{
    max-width:460px;
  }

  .was-palette-v94{
    grid-template-columns:repeat(4, minmax(0, 1fr));
  }
}

@media (max-width:760px){
  .was-palette-v94{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}


/* workbook_modular_v95 — Wheel: equal harmony preview height with base-pairs block */
.wheel-harmony-preview-v91{
  height:150px !important;
  grid-template-rows:75px 75px !important;
}

.wheel-harmony-top-v91{
  height:75px !important;
}

.wheel-harmony-bottom-v91{
  height:75px !important;
}

.wheel-pairs-strip-v91{
  height:150px !important;
}