/* Application chrome only; the sheet and export styling are independent. */
:root {--studio-panel:#202936;--studio-border:#384556;--studio-muted:#a8b8ca;--studio-accent:#efb77e;--studio-blue:#8ec8f1}
.workspace {grid-template-columns:240px minmax(300px,1fr) 326px}
.topbar {gap:20px;background:#192330;box-shadow:0 1px 12px #0002;position:sticky;top:0;z-index:8}
.topbar nav {align-items:center}
.topbar button {min-height:36px;font-size:12px}
.mode-state {font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#bbd9f0;background:#253d51;border:1px solid #42647f;border-radius:20px;padding:6px 10px}
.fill-mode .mode-state {color:#d1e6c9;background:#2a4037;border-color:#4f7663}
.library {padding:0;display:flex;flex-direction:column;overflow:hidden}
.library-top {padding:20px 16px 14px;border-bottom:1px solid var(--studio-border);background:#202936;flex-shrink:0}
.sidebar-heading h1 {font-size:23px;margin:8px 0}
.sidebar-heading p {line-height:1.5;margin-bottom:14px}
.library-content {flex:1;overflow:auto;min-height:90px;padding:16px;scrollbar-width:thin;scrollbar-color:#53677d transparent}
.library-nav {display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:3px;background:#151e2a;border:1px solid #344557;border-radius:8px;margin-bottom:12px}
.library-nav button {padding:7px 3px;font-size:11px;border-color:transparent;background:transparent;border-radius:5px}
.library-nav button:hover,.library-nav button[aria-current=true] {background:#354c63;color:#fff}
.library-search {display:flex;gap:4px;align-items:center}
.library-search input {font-size:11px;min-height:34px;background:#151e2a}
.library-search button {padding:4px 8px;font-size:18px;background:transparent;border-color:transparent}
.library-content [hidden],.library-top [hidden],.inspector-top [hidden] {display:none}
.library-content .palette {gap:8px}
.palette button {border-radius:8px;padding:11px 10px;transition:background .12s,transform .12s}
.palette button:hover {background:#32475e;transform:translateY(-1px)}
.palette .component-icon {height:27px;font-size:20px;color:#b6d5ef}
.library-content .presets-section,.library-content .layers-section {margin-top:20px;padding-top:16px}
.library-content .section-label {font-size:10px;letter-spacing:1.1px}
.field-help {margin-top:12px}.field-help summary {font-size:10px;color:var(--studio-muted);cursor:pointer}
.starter-card {border-radius:7px}
.layer {min-height:36px}
.objects-panel {flex:0 0 clamp(210px,31vh,320px);min-height:0;border-top:2px solid #6584a1;background:#192533;display:flex;flex-direction:column}
.objects-panel.collapsed {flex-basis:44px}
.objects-heading {display:flex;align-items:center;justify-content:space-between;gap:5px;padding:9px 12px;border-bottom:1px solid #35495e}
.objects-heading strong {font-size:12px;color:#d5e8f8}.objects-heading strong span {color:#98bddb;margin-left:4px;font-weight:400}
.objects-heading button {padding:0 7px;font-size:18px;line-height:23px;background:transparent;border-color:transparent}
.objects-body {display:flex;flex:1;min-height:0;flex-direction:column;padding:8px 10px}
.objects-search {display:flex;gap:3px;flex-shrink:0}.objects-search input {font-size:11px;min-height:30px}
.objects-search button {font-size:16px;padding:1px 6px;background:transparent;border-color:transparent}
.objects-body>.hint {margin:7px 0;flex-shrink:0}
.objects-panel #layers {flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#53677d transparent}
.objects-panel [hidden] {display:none}
.object-tree-row {display:flex;align-items:center;gap:2px;padding-left:calc(var(--object-depth,0)*12px)}
.object-tree-row .layer {flex:1;min-width:0;margin:1px 0;padding:7px 4px;gap:5px}
.object-tree-toggle,.object-tree-spacer {width:17px;min-width:17px;flex-shrink:0}
.object-tree-toggle {padding:2px 0;font-size:15px;line-height:26px;background:transparent;border-color:transparent;color:#a9c9e5}
.object-tree-toggle:hover {background:#2e455c}
.object-child-count {font-size:10px;color:#a1b9cf;margin-left:auto}
.object-tree-row .layer .layer-name {font-size:11px}
.object-tree-row .layer .layer-icon {min-width:13px}
.object-tree-row .layer.selected {background:#354e68;border-color:#789bbb}
.object-tree-row .layer {touch-action:none;user-select:none}.object-tree-row .layer[data-move-locked=false] {cursor:grab}.object-dragging .layer {cursor:grabbing}
.object-tree-row[data-drop-position=before] {box-shadow:inset 0 2px #efb77e}
.object-tree-row[data-drop-position=after] {box-shadow:inset 0 -2px #efb77e}
.object-tree-row[data-drop-position=inside] {outline:2px solid #8ec8f1;outline-offset:-2px;background:#325575}
.object-tree-row[data-drop-position=invalid] {outline:1px solid #d67e7e;outline-offset:-1px}
#object-page-drop {display:none;border:1px dashed #7193b1;border-radius:5px;padding:8px 5px;margin:0 0 6px;text-align:center;font-size:11px;color:#c9e3f7;flex-shrink:0}
.object-dragging #object-page-drop {display:block}#object-page-drop.drop-active {background:#355b77;border-color:#efb77e}
.fill-mode .objects-panel {display:none}
.canvas-toolbar {gap:8px;padding:9px 12px;background:#202c3a}
.canvas-toolbar button {min-height:30px;border-radius:5px}
.canvas-toolbar #delete {color:#e5aaa9}
.canvas-toolbar #show-properties {border:1px solid #4d6881;color:#c7e5ff;white-space:nowrap}
.canvas-scroll {background-color:#141e2a;background-image:radial-gradient(#344456 .65px,transparent .65px);padding-top:32px}
.page-wrap {box-shadow:0 12px 40px #0006,0 0 0 1px #ffffff18}
.page-wrap::before {content:'01 / CHARACTER SHEET';color:#b0c3d8;font-size:8px}
.canvas-footer {background:#1a2533;min-height:35px;letter-spacing:.3px}
.inspector {padding:0;display:flex;flex-direction:column;overflow:hidden;background:#202936}
.inspector-top {padding:18px 18px 12px;flex-shrink:0;border-bottom:1px solid #456078;background:linear-gradient(135deg,#283b50,#202c3c)}
#inspector-top {scroll-margin-top:76px}
.inspector-top>strong {display:block;font-size:16px;font-weight:600;line-height:1.4;margin:6px 0 12px;overflow-wrap:anywhere}
.quick-actions {display:grid;grid-template-columns:1fr 1.25fr .7fr;gap:6px;margin-bottom:12px}
.quick-actions button {padding:7px 4px;font-size:11px;background:#2c4056;border-color:#536b84}
.quick-actions [data-quick-action=preset] {color:#f4c38d}
.inspector-nav {display:grid;grid-template-columns:repeat(4,1fr);gap:4px}
.inspector-nav button {font-size:11px;padding:7px 2px;background:#172637;border-color:#40576e}
.inspector-nav button:disabled {opacity:.35}
#inspector {flex:1;min-height:0;overflow:auto;padding:18px;scrollbar-width:thin;scrollbar-color:#53677d transparent}
#inspector .property-section,#inspector .field-settings {scroll-margin-top:12px}
.property-section {margin-top:18px;padding-top:16px}
.property-section h3,.field-settings h3 {font-size:10px;letter-spacing:1.1px}
.property-grid {gap:12px}
.property-grid input,.property-grid select,.field-settings input,.field-settings select {min-height:34px}
.property-grid input[type=checkbox],.field-settings input[type=checkbox] {min-height:0}
.field-settings {border-top-color:var(--studio-border)}
.column-field-settings {padding:12px;background:#172637;border:1px solid #425e78;border-radius:8px}
.column-field-settings summary {color:#c6e1f7;line-height:1.5}
.column-field-settings button {width:100%;background:#355b77;border-color:#628bad;margin-top:6px}
.inspector-actions {grid-template-columns:1fr 1fr}
.inspector-actions button {padding:9px 6px;line-height:1.4}
.group-edit-nav {padding:10px;background:#172637;border:1px solid #425e78;border-radius:7px}
.field-summary {padding:0}
.field-summary dt {padding-top:8px;border-top:1px solid #384c60;margin-top:16px}
.fill-mode .library-top {padding-bottom:4px}
@media(max-width:1200px) {
  .workspace {grid-template-columns:210px minmax(260px,1fr) 292px}
  .topbar {padding:0 16px;gap:12px}.brand b {display:none}.mode-state {display:none}
  .topbar nav {gap:5px}.topbar button {font-size:11px;padding:7px 9px}
  .library-top,.library-content {padding-left:12px;padding-right:12px}
  #inspector {padding:14px}.inspector-top {padding:16px 14px 10px}
}
@media(max-width:800px) {
  .workspace {grid-template-columns:180px minmax(300px,1fr);height:auto;min-height:calc(100dvh - 76px)}
  .library {grid-row:1/3;max-height:calc(100dvh - 76px);position:sticky;top:76px;align-self:start}
  .inspector {grid-column:2;height:560px;max-height:none;border-top:1px solid #456078}
  .canvas-area {min-height:580px}.canvas-scroll {padding:30px 20px}
  .inspector-top>strong {font-size:15px}.property-grid {grid-template-columns:1fr 1fr}
  .library-nav {grid-template-columns:1fr 1fr}.topbar .brand {font-size:9px;gap:5px}.brand-mark {display:none}
  .topbar button {min-height:32px;font-size:10px;padding:6px}.topbar nav .primary {padding:7px 9px}
}
@media(max-width:520px) {
  .workspace {grid-template-columns:140px minmax(230px,1fr)}
  .topbar {padding:8px;min-height:76px;height:auto;flex-wrap:wrap;gap:6px}
  .topbar .brand {display:none}.topbar nav {width:100%;justify-content:space-between}
  .library-top,.library-content {padding-left:8px;padding-right:8px}.library-search button {padding:3px}
  .library-search input {font-size:10px}.sidebar-heading h1 {font-size:18px}
  .quick-actions {gap:4px}.inspector-nav button {font-size:10px}
}
@media(prefers-reduced-motion:reduce) {.palette button {transition:none}.palette button:hover {transform:none}}


#sheet [data-selection="move"] {cursor:move}


.left-tabs {display:flex;gap:4px;padding:10px;border-bottom:1px solid #344253;flex:none}
.left-tabs button {flex:1;font-size:11px;padding:9px 5px;border-color:transparent}
.left-tabs button[aria-selected="true"] {background:#31475f;color:#fff;border-color:#6186aa}
.library>[hidden] {display:none!important}
#insert-panel {display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
.library>.objects-panel {flex:1;min-height:0;max-height:none;border-top:0}
.objects-heading #toggle-objects {display:none}
.canvas-toolbar {flex-wrap:wrap}
.page-navigation {display:flex;align-items:center;gap:10px;width:100%;padding-bottom:8px;border-bottom:1px solid #344253;font-size:11px}
.page-navigation select {min-width:160px;max-width:220px}.page-navigation button {margin-left:auto}
.page-wrap::before {content:attr(data-page-label)}

.canvas-area {grid-template-rows:auto minmax(0,1fr) 35px}.canvas-toolbar {padding-top:9px;padding-bottom:9px;gap:8px}.canvas-toolbar .page-navigation select {width:180px}

.brand-mark {width:94px;height:41px;display:flex;align-items:center}.brand-mark img {width:94px;height:41px;object-fit:contain}
@media(max-width:1150px) {.brand-mark,.brand-mark img {width:68px;height:32px}}
@media(max-width:800px) {.brand-mark {display:none}}