@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap');

:root {
  font-family: 'DM Sans', 'Noto Sans SC', sans-serif;
  color: #172927;
  background: #f1f3ef;
  font-synthesis: none;
  --ink: #172927;
  --muted: #788580;
  --line: #e5e9e3;
  --paper: #fcfcf8;
  --canvas: #f8f9f5;
  --green: #1f6358;
  --green-deep: #173f3c;
  --mint: #d9ece3;
  --amber: #e8b568;
  --coral: #dd7c63;
  --navy: #122b2c;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-width: 320px; min-height: 100%; }
body { min-height: 100vh; background: #f1f3ef; }
button, input, select { font: inherit; }
button { color: inherit; }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #82bda5; outline-offset: 2px; }
.hidden { display: none !important; }

/* Access gate */
.login-screen { min-height: 100vh; display: grid; grid-template-columns: minmax(400px, 1.05fr) minmax(430px, .95fr); background: #fbfcf8; }
.login-visual { position: relative; overflow: hidden; min-height: 100vh; display: flex; flex-direction: column; justify-content: space-between; padding: 34px 42px 35px; color: #eff7ef; background: #153a38; }
.login-visual::before { content: ''; position: absolute; inset: 0; opacity: .55; background: radial-gradient(ellipse at 48% 50%, rgba(73,131,106,.24), transparent 56%), linear-gradient(130deg, transparent 54%, rgba(9,35,34,.6)); pointer-events: none; }
.login-mark, .sidebar-brand { position: relative; z-index: 1; display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 700; letter-spacing: .03em; }
.brand-mark { width: 30px; height: 30px; display: inline-grid; place-items: center; color: #143b36; background: #d2e2c1; border-radius: 9px 9px 9px 2px; font-size: 17px; line-height: 1; font-weight: 700; }
.login-art { position: absolute; width: min(74%, 660px); aspect-ratio: 1.12; left: 13%; top: 19%; transform: rotate(-8deg); border: 1px solid rgba(211,231,215,.15); border-radius: 50%; }
.login-art::before, .login-art::after { content: ''; position: absolute; border: 1px solid rgba(211,231,215,.14); border-radius: 50%; inset: 9%; }
.login-art::after { inset: 19%; border-color: rgba(211,231,215,.12); }
.art-stage { position: absolute; left: 23%; right: 23%; top: 14%; height: 19%; border: 1px solid rgba(225,240,222,.57); border-radius: 50% 50% 9px 9px; background: linear-gradient(180deg, rgba(152,192,156,.16), rgba(96,151,126,.03)); box-shadow: 0 0 40px rgba(173,211,173,.11); }
.art-stage::after { content: 'STAGE'; position: absolute; inset: 0; display: grid; place-items: center; color: rgba(235,245,221,.8); font-size: 11px; letter-spacing: .27em; }
.art-row { position: absolute; left: 17%; right: 17%; height: 12%; border-top: 1px solid rgba(198,221,200,.27); border-radius: 50%; }
.art-row::before, .art-row::after { content: ''; position: absolute; top: -5px; height: 9px; width: 9px; border: 1px solid #accfae; border-radius: 50%; box-shadow: 23px 0 #153a38, 23px 0 0 1px #accfae, 46px 0 #153a38, 46px 0 0 1px #accfae, 69px 0 #153a38, 69px 0 0 1px #accfae, 92px 0 #153a38, 92px 0 0 1px #accfae, 115px 0 #153a38, 115px 0 0 1px #accfae, 138px 0 #153a38, 138px 0 0 1px #accfae; }
.art-row::before { left: 22%; }.art-row::after { right: 22%; }
.art-row-a { top: 42%; }.art-row-b { top: 57%; left: 12%; right: 12%; }.art-row-c { top: 73%; left: 8%; right: 8%; }
.art-orbit { position: absolute; top: 43%; width: 13px; height: 13px; border-radius: 50%; background: #e9bd72; box-shadow: 0 0 0 7px rgba(233,189,114,.12), 0 0 32px rgba(233,189,114,.6); }
.orbit-a { left: 5%; }.orbit-b { right: 9%; top: 66%; background: #d98669; box-shadow: 0 0 0 7px rgba(217,134,105,.12), 0 0 30px rgba(217,134,105,.46); }
.art-label { position: absolute; color: #b8cfbf; font-size: 11px; letter-spacing: .08em; }.label-a { left: -3%; top: 48%; }.label-b { right: 22%; top: 18%; }
.login-caption { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 8px; padding-left: 3px; }.login-caption span:first-child { color: #c6dbca; font-size: 12px; letter-spacing: .13em; }.login-caption span:last-child { font-size: 19px; font-weight: 500; letter-spacing: .01em; }
.login-pane { position: relative; display: grid; place-items: center; padding: 48px 48px 82px; }
.login-copy { width: min(100%, 390px); margin-top: -10px; }
.eyebrow { margin: 0 0 18px; color: #779087; font-size: 10px; font-weight: 700; letter-spacing: .16em; }
.login-copy h1 { margin: 0; color: #193c36; font-size: 30px; font-weight: 600; letter-spacing: -.04em; }
.login-subtitle { margin: 10px 0 32px; color: #7b8983; font-size: 13px; }
.login-form { display: flex; flex-direction: column; }
.login-form label { margin: 0 0 8px; color: #40544c; font-size: 12px; font-weight: 600; }
.input-wrap { display: flex; height: 48px; align-items: center; gap: 12px; margin-bottom: 20px; padding: 0 14px; background: #fff; border: 1px solid #dfe6de; border-radius: 7px; transition: border .2s, box-shadow .2s; }
.input-wrap:focus-within { border-color: #78a796; box-shadow: 0 0 0 3px rgba(102,154,132,.12); }
.input-wrap input { width: 100%; padding: 0; color: #254039; background: transparent; border: 0; outline: 0; font-size: 13px; }
.input-icon { width: 15px; color: #91a099; font-size: 17px; text-align: center; }
.form-error { min-height: 19px; margin: -12px 0 4px; color: #be5947; font-size: 11px; }
.button { display: inline-flex; height: 37px; align-items: center; justify-content: center; gap: 8px; padding: 0 14px; border: 1px solid transparent; border-radius: 6px; cursor: pointer; font-size: 12px; font-weight: 600; transition: background .16s, border .16s, transform .16s, box-shadow .16s; white-space: nowrap; }
.button:active { transform: translateY(1px); }
.button-primary { color: #f5f8f1; background: #1e574d; box-shadow: 0 6px 16px rgba(25,78,67,.16); }.button-primary:hover { background: #174a41; }
.login-button { width: 100%; height: 47px; justify-content: space-between; padding: 0 16px; font-size: 13px; }.login-button span { font-size: 16px; }
.login-filing { position: absolute; left: 50%; bottom: 24px; color: #929e97; font-size: 11px; line-height: 1.6; text-decoration: none; transform: translateX(-50%); white-space: nowrap; transition: color .16s; }
.login-filing:hover { color: #315d52; }
.login-filing:focus-visible { border-radius: 3px; outline: 2px solid #82bda5; outline-offset: 4px; }

/* Workspace shell */
.app-shell { min-height: 100vh; display: flex; }
.sidebar { width: 226px; min-width: 226px; display: flex; flex-direction: column; padding: 19px 13px 12px; color: #e4eee7; background: var(--navy); }
.sidebar-brand { gap: 9px; padding: 0 10px 25px; font-size: 15px; }.sidebar-brand .brand-mark { width: 27px; height: 27px; color: #173f3b; background: #d7e5c4; border-radius: 8px 8px 8px 2px; font-size: 15px; }
.workspace-label { padding: 0 11px 8px; color: #77908a; font-size: 10px; font-weight: 600; letter-spacing: .06em; }
.nav-item { width: 100%; display: flex; align-items: center; gap: 11px; height: 37px; margin-bottom: 3px; padding: 0 11px; color: #a6b9b1; background: transparent; border: 0; border-radius: 5px; cursor: pointer; text-align: left; font-size: 11px; transition: .15s; }
.nav-item:hover { color: #eaf2ea; background: rgba(255,255,255,.055); }.nav-item.active { color: #e8f4e8; background: #24534b; box-shadow: inset 2px 0 #d5db9d; }.nav-icon { width: 15px; color: #91aca1; font-size: 16px; text-align: center; }.nav-item.active .nav-icon { color: #d4dfa9; }.nav-chevron { margin-left: auto; color: #90a59c; }.nav-count { margin-left: auto; padding: 1px 6px; color: #bfd0c4; background: #294846; border-radius: 10px; font-size: 9px; }
.sidebar-divider { height: 1px; margin: 14px 8px 15px; background: rgba(220,239,228,.1); }
.sidebar-section-head { display: flex; justify-content: space-between; align-items: center; padding: 0 8px 8px; color: #81968e; font-size: 10px; font-weight: 600; }
.icon-button { display: inline-grid; place-items: center; width: 27px; height: 27px; color: #71817b; background: transparent; border: 0; border-radius: 5px; cursor: pointer; font-size: 17px; }.icon-button:hover { color: #27584f; background: #ebf1e9; }.small-icon { width: 21px; height: 21px; color: #9bb0a4; font-size: 16px; }
.venue-list { display: flex; flex-direction: column; gap: 3px; }.venue-item { display: flex; align-items: center; gap: 8px; min-width: 0; height: 34px; padding: 0 9px; color: #9db0a7; background: transparent; border: 0; border-radius: 5px; cursor: pointer; text-align: left; font-size: 10px; }.venue-item:hover { background: rgba(255,255,255,.05); color: #e3efe5; }.venue-item.selected { color: #e7f1e8; background: rgba(218,236,220,.09); }.venue-square { width: 8px; height: 8px; flex: none; border: 1px solid #789189; border-radius: 2px; }.venue-item.selected .venue-square { background: #d6dc9c; border-color: #d6dc9c; }.venue-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.venue-item .mini-status { width: 5px; height: 5px; margin-left: auto; flex: none; border-radius: 50%; background: #667d73; }.venue-item.published .mini-status { background: #75b28e; }
.sidebar-spacer { flex: 1; min-height: 18px; }
.storage-card { margin: 0 5px 12px; padding: 11px 10px 10px; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.06); border-radius: 6px; }.storage-top { display: flex; align-items: center; gap: 7px; color: #b4c7bd; font-size: 10px; }.storage-indicator { width: 6px; height: 6px; border-radius: 50%; background: #82bd93; }.storage-sub { display: block; margin: 7px 0 9px 13px; color: #748c82; font-size: 9px; }.storage-track { height: 3px; overflow: hidden; background: #304b46; border-radius: 3px; }.storage-track span { display: block; width: 54%; height: 100%; background: #81ad89; border-radius: inherit; }
.profile-button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 10px 8px 4px; color: #dae7de; background: transparent; border: 0; border-top: 1px solid rgba(220,239,228,.1); cursor: pointer; text-align: left; }.avatar { width: 27px; height: 27px; display: grid; place-items: center; flex: none; color: #22463f; background: #d9e2c6; border-radius: 50%; font-size: 11px; font-weight: 700; }.profile-name { min-width: 0; display: flex; flex-direction: column; gap: 2px; }.profile-name strong { color: #d8e4dc; font-size: 10px; font-weight: 600; }.profile-name small { color: #82988d; font-size: 9px; }.profile-more { margin-left: auto; color: #89a097; font-size: 17px; letter-spacing: -2px; }
.main-area { min-width: 0; min-height: 100vh; flex: 1; display: flex; flex-direction: column; }
.topbar { height: 56px; min-height: 56px; display: flex; align-items: center; justify-content: space-between; padding: 0 24px; background: #fcfdfa; border-bottom: 1px solid #e6ebe5; }
.breadcrumbs { display: flex; align-items: center; gap: 9px; color: #89958e; font-size: 10px; }.breadcrumbs b { color: #c1c9c3; font-weight: 400; }.breadcrumbs strong { color: #41544b; font-weight: 600; }
.topbar-actions { display: flex; align-items: center; gap: 9px; }.save-state { display: flex; align-items: center; gap: 7px; margin-right: 4px; color: #87948e; font-size: 9px; }.save-dot { width: 6px; height: 6px; border-radius: 50%; background: #77ae88; }.topbar-divider { height: 20px; width: 1px; margin: 0 5px; background: #e4e9e3; }.button-quiet { color: #5f7068; background: transparent; border-color: transparent; }.button-quiet:hover { color: #244e43; background: #f0f4ef; }.button-icon { color: #7b9285; font-size: 14px; }.button-publish { color: #f2f5ef; background: #1d574d; box-shadow: 0 3px 9px rgba(24,83,71,.13); }.button-publish:hover { background: #17483f; }.publish-icon { font-size: 14px; }
.editor-heading { min-height: 97px; display: flex; align-items: center; justify-content: space-between; padding: 17px 24px 14px; }.editor-heading h1 { margin: 0; color: #1c3831; font-size: 20px; line-height: 1.35; font-weight: 600; letter-spacing: -.035em; }.venue-title-row { display: flex; align-items: center; gap: 9px; }.editor-heading p { display: flex; align-items: center; gap: 9px; margin: 6px 0 0; color: #87938c; font-size: 10px; }.meta-separator { color: #c3cbc5; }.draft-pill { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; color: #9a7850; background: #f8f1e5; border-radius: 11px; font-size: 9px; }.draft-pill i { width: 5px; height: 5px; border-radius: 50%; background: #d8a458; }.draft-pill.published-pill { color: #397760; background: #e9f3eb; }.draft-pill.published-pill i { background: #6ca27c; }.title-edit { width: 22px; height: 22px; color: #87958e; font-size: 12px; }
.heading-actions { display: flex; gap: 7px; }.button-outline { color: #50635a; background: #fcfdfa; border-color: #dce4dc; }.button-outline:hover { background: #f4f7f2; border-color: #c7d5ca; }.button-dark { color: #eef5ed; background: #244d44; }.button-dark:hover { background: #173d36; }
.editor-layout { flex: 1; min-height: 500px; display: grid; grid-template-columns: 204px minmax(360px, 1fr) 246px; gap: 12px; padding: 0 15px 15px; }
.panel-card { overflow: hidden; background: #fcfdfa; border: 1px solid #e3e8e1; border-radius: 7px; }
.tool-panel { display: flex; flex-direction: column; padding: 15px 12px 11px; }
.panel-heading { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }.panel-heading h2 { margin: 0; color: #2b4339; font-size: 12px; font-weight: 600; }.panel-heading p { margin: 4px 0 0; color: #99a29d; font-size: 9px; }.more-button { margin: -5px -4px 0 0; padding: 1px 5px; color: #93a099; background: none; border: 0; cursor: pointer; font-size: 17px; letter-spacing: -2px; }
.tool-group-label { margin-bottom: 8px; color: #909c94; font-size: 9px; font-weight: 600; }.tool-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }.tool-button { min-height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 5px 2px; color: #738179; background: #fafbf8; border: 1px solid #eff1ed; border-radius: 5px; cursor: pointer; font-size: 9px; transition: .15s; }.tool-button:hover, .tool-button:focus-visible { color: #2a6455; background: #f1f7f1; border-color: #d5e5d7; transform: translateY(-1px); }
.tool-art { width: 27px; height: 22px; display: grid; place-items: center; color: #5d8876; }.tool-art i { display: block; border: 1px solid #8aaa98; background: #edf4ed; }.table-round-art i { width: 17px; height: 17px; border-radius: 50%; box-shadow: 0 -9px #a6bfb0, 0 9px #a6bfb0, -9px 0 #a6bfb0, 9px 0 #a6bfb0; }.table-square-art i { width: 16px; height: 14px; box-shadow: 0 -6px #a6bfb0, 0 6px #a6bfb0, -8px 0 #a6bfb0, 8px 0 #a6bfb0; }.table-long-art i { width: 23px; height: 10px; box-shadow: 0 -7px #a6bfb0, 0 7px #a6bfb0; }.table-u-art i { width: 19px; height: 16px; border-bottom-color: transparent; border-radius: 3px 3px 0 0; }.classroom-art { gap: 3px; align-content: center; }.classroom-art i { width: 7px; height: 15px; }.custom-art i { width: 21px; height: 21px; display: grid; place-items: center; color: #81998a; border-style: dashed; border-radius: 4px; font-size: 13px; }
.panel-rule { height: 1px; margin: 14px 0 13px; background: #edf0eb; }.facility-list { display: flex; flex-direction: column; gap: 1px; }.facility-tool { display: flex; align-items: center; gap: 9px; width: 100%; height: 29px; padding: 0 4px; color: #66776f; background: transparent; border: 0; border-radius: 4px; cursor: pointer; text-align: left; font-size: 9px; }.facility-tool:hover { color: #2c6255; background: #f0f5ef; }.facility-icon { width: 17px; height: 17px; display: grid; place-items: center; color: #729385; background: #f0f5ef; border-radius: 4px; font-size: 13px; }.entrance-icon { color: #639278; }.exit-icon { color: #bf8663; background: #fbf2ea; }.restroom-icon { color: #777f99; }.pillar-icon { color: #b08a55; }.aisle-icon { color: #748999; }.blocked-icon { color: #c67b69; background: #fbefec; }.facility-plus { margin-left: auto; opacity: 0; color: #78a28d; font-size: 13px; }.facility-tool:hover .facility-plus { opacity: 1; }.upload-hint { width: 100%; display: flex; align-items: center; gap: 8px; margin-top: auto; padding: 9px 7px; color: #64766c; background: #f4f7f1; border: 1px dashed #d5e1d4; border-radius: 5px; cursor: pointer; text-align: left; }.upload-cloud { width: 19px; height: 19px; display: grid; place-items: center; flex: none; color: #477e6c; background: #e4efe4; border-radius: 5px; font-size: 12px; }.upload-hint strong, .upload-hint small { display: block; }.upload-hint strong { color: #50685b; font-size: 8px; font-weight: 600; }.upload-hint small { margin-top: 3px; color: #99a49c; font-size: 8px; }.upload-arrow { margin-left: auto; color: #94a89a; font-size: 11px; }

/* Canvas */
.canvas-column { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; background: #fcfdfa; border: 1px solid #e3e8e1; border-radius: 7px; }
.canvas-toolbar { min-height: 39px; display: flex; align-items: center; justify-content: space-between; padding: 0 9px; background: #fcfdfa; border-bottom: 1px solid #e8ece6; }.toolbar-left, .toolbar-right { display: flex; align-items: center; gap: 5px; }.tool-mode { display: flex; padding: 2px; background: #f0f3ee; border-radius: 4px; }.mode-button { width: 26px; height: 25px; color: #8a9790; background: transparent; border: 0; border-radius: 3px; cursor: pointer; font-size: 13px; }.mode-button.active { color: #245d50; background: #fff; box-shadow: 0 1px 3px rgba(25,57,42,.1); }.toolbar-split { width: 1px; height: 17px; margin: 0 4px; background: #e4e9e2; }.toolbar-icon { width: 25px; height: 26px; color: #6f8177; background: transparent; border: 0; border-radius: 4px; cursor: pointer; font-size: 19px; line-height: 1; }.toolbar-icon:hover:not(:disabled) { color: #295d4f; background: #edf3ed; }.toolbar-icon:disabled { color: #c0c8c1; cursor: default; }.toolbar-text-button { padding: 4px 5px; color: #78857e; background: transparent; border: 0; cursor: pointer; font-size: 9px; }.toolbar-text-button span { color: #9da8a1; }.toolbar-text-button:hover { color: #315e50; }.toolbar-right { color: #929e97; font-size: 9px; }.zoom-button { width: 21px; height: 22px; color: #708177; background: transparent; border: 0; border-radius: 3px; cursor: pointer; font-size: 14px; }.zoom-button:hover, .fit-button:hover { background: #edf2ec; }.zoom-value { min-width: 31px; color: #63766c; text-align: center; font-size: 9px; }.fit-button { width: 23px; height: 23px; color: #71847a; background: transparent; border: 0; border-radius: 3px; cursor: pointer; font-size: 13px; }
.canvas-scroll { min-height: 0; flex: 1; overflow: auto; background: #eff2ec; scrollbar-color: #cbd5ca transparent; scrollbar-width: thin; }.canvas-paper { position: relative; width: 100%; min-width: 680px; height: 100%; min-height: 500px; display: grid; place-items: center; overflow: hidden; background-color: #f7f8f3; background-image: radial-gradient(#d9ded5 .65px, transparent .65px); background-size: 12px 12px; }.canvas-paper svg { width: 100%; max-height: 100%; min-height: 500px; display: block; overflow: visible; }.canvas-legend { position: absolute; z-index: 2; left: 14px; top: 13px; display: flex; gap: 12px; color: #89958e; font-size: 8px; }.canvas-legend span { display: flex; align-items: center; gap: 4px; }.canvas-legend i { width: 7px; height: 7px; display: inline-block; border-radius: 50%; }.legend-seat { background: #66a18a; }.legend-empty { background: #fff; border: 1px solid #91a89b; }.legend-locked { background: #e6b76c; }.canvas-scale { position: absolute; right: 12px; bottom: 10px; padding: 4px 6px; color: #9aa59d; background: rgba(249,250,246,.85); border: 1px solid #e9ede7; border-radius: 3px; font-size: 8px; }.canvas-scale span { padding: 0 3px; color: #c6cec6; }.canvas-footer { min-height: 27px; display: flex; align-items: center; justify-content: space-between; padding: 0 11px; color: #9aa49d; background: #fcfdfa; border-top: 1px solid #e8ece6; font-size: 8px; }.canvas-footer > div { display: flex; align-items: center; gap: 5px; }.footer-mark { color: #739583; font-size: 13px; }.footer-dot { padding: 0 2px; color: #a7baaa; }

/* SVG drawing language */
#venue-canvas { touch-action: none; user-select: none; }.room-shell { fill: #fcfcf7; stroke: #cbd4cb; stroke-width: 1.5; }.room-inner-line { fill: none; stroke: #e8ece5; stroke-width: 1; }.stage-shape { fill: #e4eee4; stroke: #88aa91; stroke-width: 1.4; }.stage-face { fill: #d5e3d8; }.stage-label { fill: #476b59; font-size: 12px; font-weight: 600; letter-spacing: .12em; }.screen-shape { fill: #173b39; stroke: #173b39; }.screen-glint { stroke: #88ba9f; stroke-width: 2; }.element-label { fill: #708279; font-size: 10px; font-family: inherit; }.facility-shape { fill: #f1f5ef; stroke: #7da08b; stroke-width: 1.3; }.facility-text { fill: #607c6b; font-size: 9px; font-weight: 600; }.aisle-shape { fill: #f0f3ec; stroke: #bdcbbf; stroke-width: 1; }.aisle-dash { stroke: #c1cec2; stroke-dasharray: 4 5; }.blocked-shape { fill: url(#blocked-hatch); stroke: #dc9a89; stroke-dasharray: 5 3; }.pillar-shape { fill: #e8dfcd; stroke: #b39b70; stroke-width: 2; }.table-shape { fill: #e6eee5; stroke: #a6bca8; stroke-width: 1; }.table-top { fill: #c8dbc9; stroke: #85a48d; stroke-width: 1.2; }.table-seat { fill: #f8faf5; stroke: #91aa98; stroke-width: 1; }.object-group { cursor: grab; }.object-group:active { cursor: grabbing; }.object-group.selected .stage-shape, .object-group.selected .facility-shape, .object-group.selected .aisle-shape, .object-group.selected .blocked-shape, .object-group.selected .table-top { stroke: #d09741; stroke-width: 2; }.object-group.selected { filter: drop-shadow(0 0 3px rgba(212,163,79,.25)); }.region-bg { fill: rgba(226,236,225,.39); stroke: #dce5dc; stroke-width: 1; stroke-dasharray: 3 4; }.region-tag-bg { fill: #edf3ec; stroke: #d8e2d8; stroke-width: .8; }.region-tag { fill: #547462; font-size: 10px; font-weight: 600; }.region-note { fill: #95a399; font-size: 7px; letter-spacing: .03em; }.row-guide { stroke: #e9ede7; stroke-width: .65; stroke-dasharray: 2 4; }.desk { fill: #e5eee4; stroke: #b0c4b1; stroke-width: .8; }.classroom-zone { fill: #fcfcf8; stroke: #a8d9b9; stroke-width: 1; }.classroom-title-rule { fill: #fbfcfa; stroke: #edf2ec; stroke-width: .7; }.classroom-zone-title { fill: #39a768; font-size: 8px; font-weight: 700; }.classroom-column-label, .classroom-row-label { fill: #587597; font-size: 7px; }.classroom-seat-node .seat-chair { stroke: #fff; stroke-width: .9; }.classroom-seat-node .seat-chair.assigned, .classroom-seat-node .seat-chair.empty-seat { fill: #12b45c; stroke: #fff; }.classroom-seat-node .seat-chair.locked-seat { fill: #e7b869; stroke: #fff; }.classroom-seat-name { fill: #fff; font-size: 6.5px; font-weight: 600; dominant-baseline: central; pointer-events: none; }.classroom-seat-node .seat-number { fill: #577397; font-size: 5.5px; }.classroom-seat-node:hover .seat-chair { fill: #0f9b4f; stroke: #f4d889; stroke-width: 1.6; }.classroom-seat-node.selected .seat-chair { fill: #f0c35e; stroke: #9c6a2d; stroke-width: 1.8; filter: url(#seat-glow); }.classroom-seat-node.selected .classroom-seat-name { fill: #563d1f; }.seat-chair { fill: #f9fbf6; stroke: #87a593; stroke-width: 1.2; transition: fill .15s, stroke .15s; }.seat-chair.assigned { fill: #c4e0d0; stroke: #539070; }.seat-chair.empty-seat { fill: #fbfcf8; stroke: #a9b9ab; }.seat-chair.locked-seat { fill: #f1dcae; stroke: #bf9650; }.seat-number { fill: #537265; font-size: 6.5px; text-anchor: middle; dominant-baseline: central; pointer-events: none; }.seat-person-mark { fill: #43775d; font-size: 5px; text-anchor: middle; pointer-events: none; }.seat-node { cursor: pointer; }.seat-node:hover .seat-chair { fill: #c9e2d0; stroke: #3e8a65; stroke-width: 1.8; }.seat-node.selected .seat-chair { fill: #f0cb76; stroke: #b77d2d; stroke-width: 2; filter: url(#seat-glow); }.seat-node.selected .seat-number { fill: #563d1f; font-weight: 700; }.seat-node.focus-seat .seat-chair { fill: #efc363; stroke: #fff0be; stroke-width: 2.5; filter: url(#seat-glow); animation: seat-pulse 1.35s ease-in-out infinite alternate; }.seat-node.dimmed { opacity: .25; }.seat-node.locked { cursor: not-allowed; }.selection-rect { fill: rgba(95,151,121,.14); stroke: #52896b; stroke-width: 1; stroke-dasharray: 5 3; pointer-events: none; }
@keyframes seat-pulse { from { filter: drop-shadow(0 0 2px rgba(235,187,87,.3)); } to { filter: drop-shadow(0 0 8px rgba(235,187,87,.95)); } }

/* Inspector */
.inspector-panel { display: flex; flex-direction: column; }.inspector-tabs { height: 41px; display: flex; flex: none; gap: 15px; padding: 0 14px; border-bottom: 1px solid #e9ede7; }.inspector-tab { position: relative; display: flex; align-items: center; gap: 5px; padding: 0; color: #8b9890; background: transparent; border: 0; cursor: pointer; font-size: 10px; }.inspector-tab.active { color: #355b4b; font-weight: 600; }.inspector-tab.active::after { content: ''; position: absolute; height: 2px; left: 0; right: 0; bottom: -1px; background: #4f8c70; border-radius: 2px 2px 0 0; }.inspector-tab span { min-width: 14px; padding: 1px 4px; color: #829188; background: #f0f3ee; border-radius: 8px; font-size: 8px; text-align: center; }
.inspector-content { min-height: 0; flex: 1; overflow: auto; padding: 14px 13px; }.inspector-empty { min-height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #8b9990; text-align: center; }.inspector-empty-mark { width: 40px; height: 40px; display: grid; place-items: center; margin-bottom: 11px; color: #769584; background: #f0f5ef; border-radius: 12px; font-size: 20px; }.inspector-empty strong { color: #5a6e62; font-size: 10px; font-weight: 600; }.inspector-empty p { max-width: 155px; margin: 5px 0 0; color: #a0aaa3; font-size: 9px; line-height: 1.55; }.inspector-hint { margin-top: 22px; padding: 10px; color: #88978d; background: #f6f8f3; border-radius: 5px; font-size: 8px; line-height: 1.6; }.inspector-hint strong { color: #667b6c; font-weight: 600; }.inspector-section { padding: 12px 0; border-bottom: 1px solid #edf0eb; }.inspector-section:first-child { padding-top: 0; }.inspector-section:last-child { border-bottom: 0; }.section-title { display: flex; align-items: center; justify-content: space-between; margin: 0 0 10px; color: #50645a; font-size: 10px; font-weight: 600; }.section-title small { color: #a2aca4; font-size: 8px; font-weight: 400; }.field-label { display: block; margin: 0 0 5px; color: #8a9890; font-size: 8px; }.field-input, .field-select { width: 100%; height: 30px; padding: 0 8px; color: #52675b; background: #fff; border: 1px solid #e1e8e0; border-radius: 4px; font-size: 9px; }.field-input:focus, .field-select:focus { border-color: #89b098; outline: 0; box-shadow: 0 0 0 2px rgba(104,157,123,.1); }.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.field-stack { margin-bottom: 9px; }.seat-summary { display: flex; align-items: center; gap: 9px; padding-bottom: 12px; border-bottom: 1px solid #edf0eb; }.seat-summary-icon { width: 34px; height: 34px; display: grid; place-items: center; color: #4f8469; background: #e8f1e8; border: 1px solid #d8e6d9; border-radius: 7px; font-size: 16px; }.seat-summary strong { display: block; color: #334e41; font-size: 11px; font-weight: 600; }.seat-summary small { display: block; margin-top: 3px; color: #919d95; font-size: 8px; }.assignment-field { position: relative; }.assignment-field .field-input { padding-right: 27px; }.field-action { position: absolute; top: 20px; right: 5px; width: 20px; height: 20px; color: #70917c; background: transparent; border: 0; cursor: pointer; font-size: 13px; }.status-select { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 30px; padding: 0 8px; color: #5b7d69; background: #f1f7f0; border: 1px solid #e0ebdf; border-radius: 4px; cursor: pointer; font-size: 9px; }.status-select .status-dot { width: 6px; height: 6px; background: #63a07b; }.inspector-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 12px; }.mini-action { height: 29px; color: #6f8177; background: #fafbf8; border: 1px solid #e7ece5; border-radius: 4px; cursor: pointer; font-size: 8px; }.mini-action:hover { color: #31604e; background: #eef5ef; }.mini-action.danger:hover { color: #ad6455; background: #fbf1ee; }.object-type-badge { display: inline-flex; align-items: center; gap: 5px; padding: 4px 7px; color: #55735f; background: #eef4ed; border-radius: 4px; font-size: 8px; }.object-type-badge i { width: 5px; height: 5px; background: #71a282; border-radius: 50%; }.lock-toggle { display: flex; align-items: center; justify-content: space-between; color: #78877e; font-size: 9px; }.switch { position: relative; width: 28px; height: 16px; background: #dbe2da; border: 0; border-radius: 10px; cursor: pointer; }.switch::after { content: ''; position: absolute; width: 12px; height: 12px; top: 2px; left: 2px; background: #fff; border-radius: 50%; box-shadow: 0 1px 2px #0002; transition: .15s; }.switch.on { background: #65a07c; }.switch.on::after { left: 14px; }.layer-list { display: flex; flex-direction: column; gap: 4px; }.layer-row { display: flex; align-items: center; gap: 7px; width: 100%; padding: 7px 7px; color: #6d7e73; background: transparent; border: 0; border-radius: 4px; cursor: pointer; text-align: left; font-size: 8px; }.layer-row:hover { background: #f2f6f0; }.layer-swatch { width: 17px; height: 15px; display: grid; place-items: center; color: #5d836a; background: #eff4ec; border-radius: 3px; font-size: 10px; }.layer-row small { margin-left: auto; color: #a2ada5; font-size: 8px; }.attendee-row { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #f0f2ee; }.attendee-initial { width: 23px; height: 23px; display: grid; place-items: center; color: #486e59; background: #eaf1e7; border-radius: 50%; font-size: 8px; }.attendee-info { min-width: 0; }.attendee-info strong { display: block; color: #607168; font-size: 9px; font-weight: 500; }.attendee-info small { color: #a1aaa3; font-size: 8px; }.attendee-seat { margin-left: auto; color: #698873; font-size: 8px; }

/* Context menu, toast and modal */
.context-menu { position: fixed; z-index: 20; width: 177px; padding: 5px; background: #fff; border: 1px solid #e6ebe4; border-radius: 7px; box-shadow: 0 12px 35px rgba(27,51,38,.18); }.context-menu button { width: 100%; display: flex; align-items: center; gap: 9px; height: 30px; padding: 0 8px; color: #64746a; background: transparent; border: 0; border-radius: 4px; cursor: pointer; text-align: left; font-size: 9px; }.context-menu button:hover { color: #315c4b; background: #f0f5ef; }.context-menu button.danger { color: #b17060; }.context-menu button.danger:hover { background: #fbf0ed; }.context-menu button:disabled { color: #bcc4bd; cursor: not-allowed; }.context-menu .menu-icon { width: 13px; color: #80948a; font-size: 12px; text-align: center; }.context-menu .menu-shortcut { margin-left: auto; color: #afb9b1; font-size: 8px; }.menu-divider { height: 1px; margin: 4px 3px; background: #edf0eb; }
.toast { position: fixed; z-index: 50; left: 50%; bottom: 23px; max-width: min(90vw,480px); padding: 10px 15px; color: #eef5ee; background: #244c42; border: 1px solid #3a6758; border-radius: 6px; box-shadow: 0 8px 24px #152d2840; font-size: 11px; opacity: 0; pointer-events: none; transform: translate(-50%,12px); transition: opacity .2s, transform .2s; }.toast.show { opacity: 1; transform: translate(-50%,0); }
.qr-pattern img { display: block; width: 112px; height: 112px; object-fit: contain; }
.modal-backdrop { position: fixed; z-index: 80; inset: 0; display: grid; place-items: center; overflow: auto; padding: 24px; background: rgba(13,35,31,.48); backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); animation: backdrop-in .18s ease-out; }
.modal { width: min(520px,100%); max-height: min(86vh,760px); display: flex; flex-direction: column; overflow: hidden; color: #283b33; background: #fcfdfa; border: 1px solid rgba(226,234,226,.96); border-radius: 12px; box-shadow: 0 28px 80px rgba(12,32,27,.3), 0 2px 8px rgba(12,32,27,.1); animation: modal-in .2s ease-out; }
.modal.wide { width: min(780px,100%); }
.modal-head { flex: none; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; padding: 18px 20px 15px; border-bottom: 1px solid #e8ede7; }
.modal-head h2 { margin: 0; color: #193c36; font-size: 16px; line-height: 1.35; font-weight: 600; letter-spacing: -.02em; }
.modal-head p { margin: 5px 0 0; color: #8a9790; font-size: 9px; line-height: 1.55; }
.modal-close { width: 28px; height: 28px; flex: none; display: grid; place-items: center; padding: 0; color: #819087; background: #f2f5f1; border: 1px solid #e4e9e3; border-radius: 50%; cursor: pointer; font-size: 17px; line-height: 1; }
.modal-close:hover { color: #285a4d; background: #e9f0e9; }
.modal-body { min-height: 0; overflow: auto; padding: 18px 20px; scrollbar-color: #c9d3cb transparent; scrollbar-width: thin; }
.modal-foot { flex: none; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 12px 20px; background: #f8faf6; border-top: 1px solid #e8ede7; }
.modal-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
.modal-note { display: flex; align-items: flex-start; gap: 9px; margin-top: 13px; padding: 10px 11px; color: #6f7f76; background: #f3f7f1; border: 1px solid #e4ece2; border-radius: 6px; font-size: 9px; line-height: 1.55; }
.modal-note > span { color: #5d8c70; font-size: 13px; line-height: 1.2; }
.modal-note.error-note { color: #8e594c; background: #fff2ee; border-color: #f1d8cf; }
.layout-tabs { display: grid; grid-template-columns: repeat(4,1fr); gap: 7px; margin-bottom: 15px; }
.layout-choice { min-height: 46px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; color: #728279; background: #f6f8f4; border: 1px solid #e4eae2; border-radius: 6px; cursor: pointer; font-size: 9px; }
.layout-choice span { color: #668c76; font-size: 16px; }
.layout-choice:hover, .layout-choice.active { color: #285a49; background: #eaf3ea; border-color: #a9c9ae; }
.import-drop { min-height: 118px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 18px; color: #6f8177; background: #f8faf6; border: 1px dashed #bdcabe; border-radius: 8px; cursor: pointer; text-align: center; }
.import-drop:hover { background: #f0f6ef; border-color: #85a98d; }
.import-drop .import-icon { color: #5f9072; font-size: 25px; line-height: 1; }
.import-drop strong { margin-top: 8px; color: #4d6758; font-size: 11px; }
.import-drop small { max-width: 390px; margin-top: 6px; color: #97a39b; font-size: 8px; line-height: 1.55; }
.import-preview { max-height: 260px; overflow: auto; margin-top: 12px; border: 1px solid #e5ebe3; border-radius: 6px; }
.publish-layout { display: grid; grid-template-columns: minmax(0,1fr) 150px; gap: 22px; align-items: start; }
.publish-success { margin-bottom: 14px; padding: 10px 11px; color: #3f7458; background: #edf6ed; border: 1px solid #d7e9d8; border-radius: 6px; font-size: 10px; font-weight: 600; }
.publish-success i { margin-right: 5px; font-style: normal; }
.url-field { display: flex; align-items: center; gap: 7px; min-height: 36px; padding-left: 10px; overflow: hidden; background: #f5f8f3; border: 1px solid #e1e9df; border-radius: 5px; }
.url-field span { min-width: 0; flex: 1; overflow: hidden; color: #65776d; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.url-field button { align-self: stretch; padding: 0 11px; color: #2f6953; background: #e7f1e7; border: 0; cursor: pointer; font-size: 9px; }
.qr-card { width: 136px; height: 136px; display: grid; place-items: center; padding: 12px; background: #fff; border: 1px solid #e3e9e1; border-radius: 8px; box-shadow: 0 8px 24px rgba(29,61,46,.08); }
.qr-caption { margin-top: 7px; color: #8c9991; font-size: 9px; text-align: center; }
@keyframes backdrop-in { from { opacity: 0; } to { opacity: 1; } }@keyframes modal-in { from { opacity: .75; transform: translateY(6px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }

/* Public mobile seat finder */
.query-view { position: fixed; z-index: 30; inset: 0; overflow: hidden; color: #eef5ec; background: #102c2c; }.query-view::before { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 54% 43%, rgba(42,98,77,.22), transparent 48%), linear-gradient(180deg, #123231 0, #122d2e 64%, #0f292b 100%); }.query-top-glass { position: absolute; z-index: 2; top: 18px; left: 50%; display: flex; align-items: center; gap: 17px; width: min(690px,calc(100% - 34px)); min-height: 63px; padding: 10px 14px; transform: translateX(-50%); background: rgba(236,245,236,.11); border: 1px solid rgba(225,244,228,.16); border-radius: 14px; box-shadow: 0 12px 40px rgba(7,24,23,.14); backdrop-filter: blur(20px) saturate(1.4); }.query-brand { display: flex; align-items: center; gap: 8px; padding-right: 15px; color: #edf3e9; border-right: 1px solid rgba(234,242,231,.15); font-size: 12px; font-weight: 600; }.query-brand .brand-mark { width: 25px; height: 25px; color: #173c38; background: #d6e1c0; font-size: 14px; }.query-meeting { display: flex; flex-direction: column; gap: 4px; min-width: 0; }.query-meeting strong { overflow: hidden; color: #f1f4eb; font-size: 12px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }.query-meeting span { overflow: hidden; color: #b0c6bb; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.query-close { width: 27px; height: 27px; display: grid; place-items: center; margin-left: auto; color: #c0d1c5; background: rgba(226,241,226,.08); border: 1px solid rgba(226,241,226,.11); border-radius: 50%; cursor: pointer; font-size: 17px; }.query-close:hover { background: rgba(226,241,226,.18); }.query-instruction { position: absolute; z-index: 1; top: 18%; left: max(calc((100% - 850px) / 2),8%); pointer-events: none; }.query-kicker { color: #91b19f; font-size: 9px; letter-spacing: .2em; }.query-instruction h1 { margin: 10px 0 7px; color: #e9f1e7; font-size: clamp(23px,3vw,34px); font-weight: 500; letter-spacing: -.05em; }.query-instruction h1 em { color: #d7e1b6; font-style: normal; }.query-instruction p { margin: 0; color: #9bb5a8; font-size: 11px; }.query-map-wrap { position: absolute; inset: 0; overflow: hidden; }.query-map-shade { position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg,rgba(13,39,38,.1),transparent 22%,transparent 66%,rgba(12,34,35,.76)); }.query-map-wrap svg { position: absolute; inset: 16% 4% 10%; width: 92%; height: 75%; overflow: visible; transition: all .8s cubic-bezier(.18,.72,.23,1); }.query-map-wrap .room-shell { fill: #193638; stroke: #57746a; stroke-width: 1.6; }.query-map-wrap .room-inner-line { stroke: #304d49; }.query-map-wrap .stage-shape { fill: #24463f; stroke: #759980; }.query-map-wrap .stage-face { fill: #294b41; }.query-map-wrap .stage-label { fill: #c4dac3; }.query-map-wrap .screen-shape { fill: #bdd1b8; stroke: #d3e1c7; }.query-map-wrap .screen-glint { stroke: #edf1d1; }.query-map-wrap .element-label { fill: #a3bcae; }.query-map-wrap .region-bg { fill: rgba(69,104,81,.12); stroke: #37574a; }.query-map-wrap .region-tag-bg { fill: #25463e; stroke: #496a56; }.query-map-wrap .region-tag { fill: #b4cdb5; }.query-map-wrap .region-note { fill: #789785; }.query-map-wrap .row-guide { stroke: #304c43; }.query-map-wrap .desk { fill: #335345; stroke: #597b62; }.query-map-wrap .seat-chair { fill: #203f3b; stroke: #71917e; }.query-map-wrap .seat-chair.assigned { fill: #76a58a; stroke: #aac9ac; }.query-map-wrap .seat-chair.empty-seat { fill: #1a3736; stroke: #526f64; }.query-map-wrap .seat-chair.locked-seat { fill: #8b784d; stroke: #c1a974; }.query-map-wrap .seat-number { fill: #c1d7c4; }.query-map-wrap .seat-node.selected .seat-chair, .query-map-wrap .seat-node.focus-seat .seat-chair { fill: #e3be67; stroke: #fff1c6; }.query-map-wrap .facility-shape { fill: #24463e; stroke: #769681; }.query-map-wrap .facility-text { fill: #bfd4bf; }.query-map-wrap .aisle-shape { fill: #203c3a; stroke: #4c6b60; }.query-map-wrap .aisle-dash { stroke: #668576; }.query-map-wrap .blocked-shape { fill: #593f3b; stroke: #bf8c79; }.query-map-wrap .pillar-shape { fill: #70654d; stroke: #c5a96d; }.query-result-card { position: absolute; z-index: 3; right: max(calc((100% - 760px) / 2),8%); top: 47%; width: 175px; padding: 12px 13px; color: #e7f0e6; background: rgba(20,53,48,.87); border: 1px solid rgba(180,213,184,.26); border-radius: 7px; box-shadow: 0 10px 35px rgba(6,22,20,.3); backdrop-filter: blur(14px); animation: result-in .3s ease-out; }.query-result-card::before { content: ''; position: absolute; left: -4px; top: 18px; width: 7px; height: 7px; background: #244f43; border-left: 1px solid rgba(180,213,184,.3); border-bottom: 1px solid rgba(180,213,184,.3); transform: rotate(45deg); }.query-result-card small { color: #a8c4af; font-size: 8px; }.query-result-card strong { display: block; margin-top: 3px; color: #f2f4e7; font-size: 15px; font-weight: 600; }.query-result-card span { display: block; margin-top: 7px; color: #e8d493; font-size: 10px; }.query-map-hint { position: absolute; z-index: 2; right: 6%; bottom: 24%; display: flex; align-items: center; gap: 7px; color: #a5bbad; font-size: 9px; }.query-live-dot { width: 5px; height: 5px; border-radius: 50%; background: #80bc91; box-shadow: 0 0 0 4px rgba(128,188,145,.12); }.query-bottom { position: absolute; z-index: 3; bottom: 0; left: 0; right: 0; display: flex; flex-direction: column; align-items: center; padding: 16px 16px max(17px,env(safe-area-inset-bottom)); background: linear-gradient(180deg,transparent,rgba(13,35,35,.53) 12%,rgba(13,35,35,.94) 39%); }.query-search-shell { width: min(520px,100%); display: flex; align-items: center; gap: 10px; min-height: 51px; padding: 5px 6px 5px 14px; background: rgba(237,246,237,.97); border: 1px solid rgba(255,255,255,.65); border-radius: 8px; box-shadow: 0 10px 36px rgba(4,20,20,.22); }.query-search-icon { color: #6f8c7b; font-size: 20px; }.query-search-shell input { width: 100%; min-width: 0; height: 38px; color: #304a3e; background: transparent; border: 0; outline: none; font-size: 12px; }.query-search-shell input::placeholder { color: #9aa9a0; }.query-search-button { height: 39px; flex: none; display: flex; align-items: center; gap: 12px; padding: 0 13px; color: #f4f6eb; background: #285749; border: 0; border-radius: 5px; cursor: pointer; font-size: 10px; font-weight: 600; }.query-search-button:hover { background: #1e493d; }.query-search-button span { font-size: 14px; }.query-footer { width: min(520px,100%); display: flex; justify-content: space-between; margin-top: 11px; color: #718a7e; font-size: 8px; }.query-message { position: absolute; z-index: 5; left: 50%; bottom: 112px; padding: 9px 13px; color: #f8ede0; background: rgba(135,75,58,.92); border: 1px solid rgba(239,172,143,.25); border-radius: 5px; transform: translateX(-50%); font-size: 10px; animation: modal-in .2s ease-out; }
@keyframes result-in { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 1240px) {
  .sidebar { width: 194px; min-width: 194px; }.editor-layout { grid-template-columns: 184px minmax(340px,1fr) 220px; gap: 9px; padding-inline: 10px; }.editor-heading { padding-inline: 17px; }.topbar { padding-inline: 17px; }.heading-actions .button { padding-inline: 10px; }.tool-panel { padding-inline: 10px; }.inspector-tabs { gap: 11px; padding-inline: 11px; }
}
@media (max-width: 1020px) {
  .editor-layout { grid-template-columns: 174px minmax(0,1fr); grid-template-rows: minmax(430px,1fr) 225px; }.inspector-panel { grid-column: 1 / -1; grid-row: 2; }.inspector-content { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }.inspector-empty { min-height: 100px; }.inspector-hint { margin-top: 8px; }.canvas-column { grid-column: 2; grid-row: 1; }.tool-panel { grid-column: 1; grid-row: 1; }.facility-tool { height: 26px; }.topbar-actions .save-state { display: none; }.editor-heading { min-height: 90px; }
}
@media (max-width: 720px) {
  .login-screen { grid-template-columns: 1fr; }.login-visual { min-height: 230px; padding: 21px 23px; }.login-art { width: 280px; left: auto; right: 5%; top: 1%; opacity: .75; }.login-caption { margin-top: auto; }.login-caption span:last-child { font-size: 15px; }.login-pane { padding: 35px 25px 70px; }.login-copy { max-width: 420px; margin: 0; }.login-copy h1 { font-size: 26px; }.login-subtitle { margin-bottom: 25px; }.login-filing { bottom: 19px; }
  .modal-backdrop { place-items: end center; padding: 12px; }.modal { width: 100%; max-height: calc(100dvh - 24px); border-radius: 12px; }.modal.wide { width: 100%; }.modal-head { padding: 16px 16px 13px; }.modal-body { padding: 15px 16px; }.modal-foot { padding: 11px 16px max(11px,env(safe-area-inset-bottom)); }.modal-two-col { grid-template-columns: 1fr; }.layout-tabs { grid-template-columns: 1fr 1fr; }.publish-layout { grid-template-columns: 1fr; }.qr-card { margin: 0 auto; }.export-grid { grid-template-columns: 1fr; }
  .sidebar { width: 54px; min-width: 54px; padding: 15px 6px 9px; }.sidebar-brand { justify-content: center; padding: 0 0 20px; }.sidebar-brand > span:not(.brand-mark), .workspace-label, .nav-item > span:not(.nav-icon), .sidebar-divider, .sidebar-section-head, .venue-list, .storage-card, .profile-name, .profile-more { display: none; }.nav-item { justify-content: center; height: 38px; padding: 0; }.nav-icon { font-size: 17px; }.profile-button { justify-content: center; padding: 10px 0 4px; }.editor-heading { min-height: auto; align-items: flex-start; gap: 12px; padding: 13px 12px 11px; }.editor-heading h1 { max-width: 60vw; font-size: 15px; }.editor-heading p { flex-wrap: wrap; gap: 5px; font-size: 8px; }.heading-actions { gap: 4px; }.heading-actions .button { width: 32px; height: 31px; overflow: hidden; padding: 0; justify-content: center; font-size: 0; }.heading-actions .button .button-icon { font-size: 14px; }.venue-title-row { flex-wrap: wrap; gap: 5px; }.draft-pill { padding: 3px 5px; font-size: 8px; }.title-edit { width: 18px; height: 18px; }.topbar { height: 45px; min-height: 45px; padding: 0 10px; }.breadcrumbs { max-width: 46vw; gap: 5px; overflow: hidden; font-size: 8px; white-space: nowrap; }.breadcrumbs span:first-child, .breadcrumbs b:nth-of-type(1), .breadcrumbs span:nth-of-type(2) { display: none; }.breadcrumbs strong { overflow: hidden; text-overflow: ellipsis; }.topbar-actions { gap: 3px; }.topbar-divider { display: none; }.topbar-actions .button { height: 30px; padding: 0 8px; font-size: 9px; }.editor-layout { min-height: 0; flex: 1; grid-template-columns: 1fr; grid-template-rows: minmax(390px,1fr) 190px; gap: 7px; padding: 0 7px 7px; }.tool-panel { display: none; }.canvas-column { grid-column: 1; grid-row: 1; }.inspector-panel { grid-column: 1; grid-row: 2; }.inspector-tabs { height: 34px; }.inspector-content { padding: 9px; }.canvas-paper { min-width: 530px; min-height: 390px; }.canvas-paper svg { min-height: 390px; }.canvas-toolbar { min-height: 35px; padding-inline: 5px; }.toolbar-text-button, .toolbar-left > .toolbar-split:nth-of-type(2), #selection-count { display: none; }.canvas-footer { font-size: 7px; }.canvas-footer > span { max-width: 46%; text-align: right; }.query-top-glass { top: max(11px,env(safe-area-inset-top)); min-height: 56px; gap: 11px; width: calc(100% - 22px); padding: 8px 10px; border-radius: 12px; }.query-brand { gap: 6px; padding-right: 10px; font-size: 10px; }.query-meeting strong { font-size: 11px; }.query-meeting span { font-size: 8px; }.query-close { width: 25px; height: 25px; }.query-instruction { top: 17%; left: 8%; }.query-instruction h1 { font-size: 25px; }.query-instruction p { font-size: 10px; }.query-map-wrap svg { inset: 27% auto 19%; left: 50%; width: 820px; height: 54%; transform: translateX(-50%); }.query-map-wrap.focused svg { width: 100%; height: 60%; top: 22%; left: 0; inset-inline: 0; transform: none; }.query-result-card { top: 46%; right: 6%; transform: scale(.9); transform-origin: top right; }.query-map-hint { right: 7%; bottom: 22%; font-size: 8px; }.query-bottom { padding: 12px 13px max(13px,env(safe-area-inset-bottom)); }.query-search-shell { min-height: 48px; gap: 7px; padding-left: 11px; }.query-search-shell input { height: 35px; font-size: 11px; }.query-search-button { height: 36px; gap: 7px; padding: 0 10px; font-size: 9px; }.query-footer { margin-top: 9px; font-size: 7px; }.query-message { bottom: 102px; }
}
@media (max-width: 430px) {
  .sidebar { width: 44px; min-width: 44px; padding-inline: 4px; }.sidebar-brand .brand-mark { width: 25px; height: 25px; }.editor-heading { padding-inline: 9px; }.editor-heading h1 { max-width: 55vw; font-size: 14px; }.editor-heading p { max-width: 62vw; }.heading-actions .button { width: 29px; }.topbar-actions .button { padding: 0 6px; font-size: 8px; }.breadcrumbs { max-width: 43vw; }.editor-layout { padding-inline: 5px; }.canvas-paper { min-width: 475px; }.inspector-content { grid-template-columns: 1fr 1fr; }.query-instruction h1 { font-size: 23px; }.query-instruction p { font-size: 9px; }.query-map-hint { bottom: 23%; }.query-footer span:last-child { max-width: 50%; text-align: right; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* Classroom grid additions: visible row/column labels and empty-canvas guidance. */
.classroom-cell-bg { fill: #edf8ef; stroke: #d5ecd9; stroke-width: .5; }
.canvas-empty-state circle { fill: #eef6ef; stroke: #bdd7c2; stroke-width: 1; }
.canvas-empty-state text:first-of-type { fill: #5a8069; font-size: 12px; font-weight: 600; }
.canvas-empty-state text:last-of-type { fill: #9aaba0; font-size: 9px; }
.canvas-scroll.hand-mode { cursor: grab; }
.canvas-scroll.hand-mode:active { cursor: grabbing; }
.import-drop.is-dragging { background: #eaf5eb; border-color: #6ba37c; box-shadow: inset 0 0 0 2px rgba(107,163,124,.12); }
.query-map-wrap .classroom-zone { fill: rgba(69,104,81,.12); stroke: #37574a; }
.query-map-wrap .classroom-cell-bg { fill: #2b5445; stroke: #416c55; }
.query-map-wrap .classroom-column-label, .query-map-wrap .classroom-row-label { fill: #a9c4ad; }

/* Local prototype controls added for save/version/conflict workflows. */
.venue-search { width: calc(100% - 24px); height: 28px; margin: 2px 12px 9px; padding: 0 9px; color: #536a5b; background: #f6f9f4; border: 1px solid #e4ebe1; border-radius: 5px; outline: none; font: inherit; font-size: 9px; }
.venue-search:focus { border-color: #9dbca2; box-shadow: 0 0 0 2px rgba(112,158,123,.12); }
.venue-name { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
.venue-name strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.venue-name small { color: #a0ada2; font-size: 7px; }
.venue-empty { padding: 13px 12px; color: #a2afa5; font-size: 9px; text-align: center; }
.topbar-small-button { min-width: 34px; padding-inline: 7px !important; font-size: 9px !important; }
.topbar-small-button.active, .toolbar-text-button.active { color: #32654d; background: #edf5ed; border-color: #c2d8c3; }
.venue-manage-button { height: 29px !important; padding-inline: 8px !important; font-size: 9px !important; }
.selection-marquee { fill: rgba(104,159,119,.11); stroke: #659675; stroke-width: 1; stroke-dasharray: 4 3; pointer-events: none; }
.seat-chair.reserved-seat { fill: #ad9864; stroke: #d1bd87; }
.conflict-summary { margin-bottom: 10px; padding: 9px 11px; color: #587763; background: #f2f7f1; border-radius: 5px; font-size: 10px; }
.conflict-list { display: flex; flex-direction: column; gap: 6px; max-height: 330px; overflow: auto; }
.conflict-row { display: grid; grid-template-columns: 78px 1fr; gap: 8px; align-items: center; padding: 8px 9px; border-radius: 5px; font-size: 9px; }
.conflict-row.error { color: #8e594c; background: #fff2ee; border: 1px solid #f1d8cf; }
.conflict-row.warning { color: #876f43; background: #fff9e9; border: 1px solid #eee0b9; }
.conflict-row span { font-size: 8px; opacity: .8; }
.version-list { display: flex; flex-direction: column; gap: 5px; max-height: 350px; overflow: auto; }
.version-row { display: flex; justify-content: space-between; gap: 10px; align-items: center; padding: 9px 10px; border: 1px solid #e7ede5; border-radius: 5px; }
.version-row strong { display: block; color: #506b59; font-size: 9px; font-weight: 600; }
.version-row small { display: block; margin-top: 4px; color: #9aa79e; font-size: 8px; }
.privacy-option { display: flex; gap: 9px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid #edf0eb; cursor: pointer; }
.privacy-option:last-child { border-bottom: 0; }
.privacy-option input { margin-top: 2px; accent-color: #5e9973; }
.privacy-option strong { display: block; color: #526c5d; font-size: 10px; font-weight: 600; }
.privacy-option small { display: block; margin-top: 3px; color: #9aa69e; font-size: 8px; }
.export-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.export-choice { min-height: 74px; padding: 11px; color: #4f6c5b; background: #f6faf4; border: 1px solid #dfeade; border-radius: 6px; text-align: left; cursor: pointer; }
.export-choice:hover { background: #edf6ed; border-color: #afcdae; }
.export-choice strong { display: block; font-size: 10px; }
.export-choice small { display: block; margin-top: 5px; color: #94a298; font-size: 8px; }
.import-warning { margin-bottom: 8px; padding: 8px 9px; color: #8c7045; background: #fff8e9; border: 1px solid #ebdfbd; border-radius: 4px; font-size: 8px; }
@media print { .sidebar, .topbar, .editor-heading, .tool-panel, .inspector-panel, .canvas-toolbar, .canvas-footer { display: none !important; } .main-area { width: 100%; } .canvas-column { height: 100vh; } .canvas-scroll { overflow: visible; } .canvas-paper { min-width: 0; min-height: 0; } }

/* User-configurable seat status colors and compact object controls. */
#venue-canvas .classroom-seat-node .seat-chair.assigned { fill: var(--seat-assigned-fill, #12b45c); }
#venue-canvas .classroom-seat-node .seat-chair.empty-seat { fill: var(--seat-empty-fill, #ffffff); }
#query-canvas .seat-chair.assigned { fill: var(--seat-assigned-fill, #76a58a); }
#query-canvas .seat-chair.empty-seat { fill: var(--seat-empty-fill, #1a3736); }
.color-setting-row { display: flex; align-items: center; gap: 10px; padding: 10px 0; border-bottom: 1px solid #edf0eb; }
.color-setting-row .field-label { flex: 1; margin: 0; }
.color-setting-row code { min-width: 66px; color: #7b8b81; font-size: 9px; }
.color-input { width: 38px; height: 28px; padding: 2px; background: #fff; border: 1px solid #dfe7de; border-radius: 5px; cursor: pointer; }
.canvas-paper { background-image: none; }
.toolbar-menu-wrap { position: relative; }
.toolbar-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 12; min-width: 178px; padding: 4px; background: #fff; border: 1px solid #dce2df; border-radius: 6px; box-shadow: 0 8px 22px rgba(25,38,31,.12); }
.toolbar-menu button { display: block; width: 100%; padding: 9px 10px; border: 0; border-radius: 3px; text-align: left; white-space: nowrap; font: inherit; font-size: 12px; color: #33453b; background: transparent; cursor: pointer; }
.toolbar-menu button:hover, .toolbar-menu button:focus-visible { background: #edf2ef; outline: 1px solid #91aa98; }
.wayfinding-icon { color: #405a4d; pointer-events: none; }
.query-map-wrap .wayfinding-icon { color: #364452; }

/* Query canvas-first layout: only the meeting header and search stay fixed. */
body.query-open { overflow: hidden; background: #0b2524; }
.query-view { --query-screen-height: 100vh; --query-footer-height: max(calc(var(--query-screen-height) * .14), calc(72px + env(safe-area-inset-bottom, 0px))); inset: auto; top: var(--query-screen-top, 0px); left: var(--query-screen-left, 0px); width: var(--query-screen-width, 100%); height: var(--query-screen-height); min-height: 0; color: #f3f7ef; background: #0b2524; }
@supports (height: 100dvh) { .query-view { --query-screen-height: 100dvh; } }
.query-view::before { background: radial-gradient(circle at 50% 38%,rgba(49,102,84,.22),transparent 55%),#0b2524; }
.query-top-glass { position: fixed; z-index: 10; top: max(10px,env(safe-area-inset-top)); left: 50%; width: min(560px,calc(100% - 28px)); min-height: 0; height: clamp(52px,9dvh,76px); gap: 12px; padding: 10px 12px 10px 16px; transform: translateX(-50%); background: rgba(255,255,255,.78); border: 1px solid rgba(255,255,255,.92); border-radius: 16px; box-shadow: 0 14px 40px rgba(31,41,55,.12), inset 0 1px rgba(255,255,255,.9); backdrop-filter: blur(24px) saturate(1.35); -webkit-backdrop-filter: blur(24px) saturate(1.35); }
.query-meeting { gap: 3px; flex: 1; }
.query-meeting strong { color: #f4f7ee; font-size: 15px; font-weight: 600; letter-spacing: -.01em; }
.query-meeting span { color: #b8cbc0; font-size: 10px; }
.query-close { flex: none; color: #d1ddd5; background: rgba(239,247,239,.08); border-color: rgba(239,247,239,.14); }
.query-map-wrap { position: absolute; z-index: 1; inset: 0; overflow: hidden; cursor: grab; touch-action: none; user-select: none; }
.query-map-wrap.is-dragging { cursor: grabbing; }
.query-map-shade { z-index: 2; background: linear-gradient(180deg,rgba(5,25,23,.3),transparent 19%,transparent 76%,rgba(5,23,22,.42)); }
.query-map-wrap svg { inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; overflow: visible; transform: none; transform-origin: 0 0; transition: none; will-change: auto; }
.query-map-wrap.is-dragging svg { transition: none; }
.query-result-card { position: fixed; z-index: 11; top: auto; right: auto; left: 50%; bottom: calc(max(82px,env(safe-area-inset-bottom) + 72px)); display: flex; align-items: baseline; gap: 10px; width: auto; max-width: calc(100% - 28px); padding: 9px 13px; transform: translateX(-50%); color: #f5f7ef; background: rgba(20,55,48,.9); border: 1px solid rgba(206,231,208,.25); border-radius: 11px; box-shadow: 0 12px 34px rgba(3,20,18,.28); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); white-space: nowrap; }
.query-result-card::before { display: none; }
.query-result-card strong { display: inline; margin: 0; color: #f5f7ef; font-size: 13px; }
.query-result-card span { display: inline; margin: 0; color: #f0c96b; font-size: 11px; }
.query-bottom { position: fixed; z-index: 20; left: 0; right: 0; bottom: 0; min-height: 14dvh; padding: 10px 14px max(10px,env(safe-area-inset-bottom)); background: linear-gradient(180deg,transparent,rgba(244,246,248,.62) 25%,rgba(244,246,248,.96) 62%); pointer-events: none; }
.query-search-shell { width: min(520px,100%); min-height: 52px; gap: 9px; padding: 5px 5px 5px 14px; background: rgba(244,249,242,.96); border: 1px solid rgba(255,255,255,.72); border-radius: 13px; box-shadow: 0 12px 38px rgba(2,17,16,.3); pointer-events: auto; }
.query-search-icon { color: #6b8175; font-size: 18px; }
.query-search-shell input { height: 40px; color: #243d34; font-size: 13px; }
.query-search-shell input::placeholder { color: #87988e; }
.query-search-button { min-width: 70px; height: 42px; justify-content: center; padding: 0 17px; color: #f6f8ef; background: #285d4e; border-radius: 9px; font-size: 12px; }
.query-search-button:hover { background: #214f43; }
.query-message { position: fixed; z-index: 12; bottom: calc(max(84px,env(safe-area-inset-bottom) + 74px)); max-width: calc(100% - 28px); padding: 9px 13px; text-align: center; }
@media (max-width: 720px) {
  .query-top-glass { top: max(8px,env(safe-area-inset-top)); width: calc(100% - 20px); height: clamp(50px,9dvh,68px); padding: 8px 10px 8px 13px; border-radius: 14px; }
  .query-meeting strong { font-size: 13px; }
  .query-meeting span { font-size: 9px; }
  .query-close { width: 26px; height: 26px; }
  .query-map-wrap svg, .query-map-wrap.focused svg { inset: 0; left: 0; top: 0; width: 100%; height: 100%; transform-origin: 0 0; }
  .query-result-card { bottom: calc(max(78px,env(safe-area-inset-bottom) + 69px)); padding: 8px 11px; }
  .query-bottom { min-height: 14dvh; padding: 8px 10px max(8px,env(safe-area-inset-bottom)); }
  .query-search-shell { min-height: 49px; padding-left: 12px; border-radius: 12px; }
  .query-search-shell input { height: 37px; font-size: 12px; }
  .query-search-button { min-width: 62px; height: 39px; padding: 0 14px; font-size: 11px; }
  .query-message { bottom: calc(max(80px,env(safe-area-inset-bottom) + 70px)); }
}

/* Anchor all overlays to the same visual-viewport-sized root, not the document. */
.query-view > .query-top-glass { position: absolute; height: clamp(50px, calc(var(--query-screen-height) * .09), 76px); min-height: 0; width: min(560px, calc(100% - 24px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))); }
.query-view > .query-bottom { position: absolute; inset: auto 0 0; height: var(--query-footer-height); min-height: 0; justify-content: center; padding: 8px max(12px, env(safe-area-inset-right, 0px)) max(8px, env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px)); }
.query-view .query-search-shell { flex: none; min-height: 56px; }
.query-view .query-search-shell input { flex: 1; width: 0; min-width: 0; height: 44px; font-size: 16px; }
.query-view .query-search-button { height: 44px; min-width: 64px; font-size: 14px; }
.query-view > .query-result-card, .query-view > .query-message { position: absolute; bottom: calc(var(--query-footer-height) + 8px); max-width: calc(100% - 24px); white-space: normal; }
.query-view > .query-result-card { flex-wrap: wrap; gap: 4px 10px; width: max-content; }
.query-view .query-meeting strong { font-size: clamp(14px, 4vw, 17px); }
@media (max-height: 450px) { .query-view .query-meeting span { display: none; } }

/* Query view visual system: a light canvas with restrained, translucent glass chrome. */
body.query-open { background: #f4f6f8; }
.query-view { color: #18212b; background: #f4f6f8; }
.query-view::before { background: radial-gradient(circle at 18% 12%, rgba(255,255,255,.98), transparent 37%), radial-gradient(circle at 82% 76%, rgba(226,232,240,.7), transparent 45%), #f4f6f8; }
.query-top-glass { background: rgba(255,255,255,.68); border-color: rgba(255,255,255,.9); box-shadow: 0 18px 48px rgba(31,41,55,.12), inset 0 1px rgba(255,255,255,.9); backdrop-filter: blur(28px) saturate(1.25); -webkit-backdrop-filter: blur(28px) saturate(1.25); }
.query-meeting strong { color: #17202a; }
.query-meeting span { color: #647180; }
.query-close { color: #46515d; background: rgba(255,255,255,.62); border-color: rgba(148,163,184,.28); }
.query-close:hover { background: rgba(255,255,255,.92); }
.query-map-shade { background: linear-gradient(180deg, rgba(255,255,255,.18), transparent 19%, transparent 76%, rgba(226,232,240,.44)); }
.query-map-wrap .room-shell { fill: rgba(255,255,255,.76); stroke: #cbd5df; stroke-width: 1.5; }
.query-map-wrap .room-inner-line { stroke: #e1e6ec; }
.query-map-wrap .classroom-zone { fill: rgba(255,255,255,.58); stroke: #d7dee6; }
.query-map-wrap .classroom-cell-bg { fill: rgba(255,255,255,.7); stroke: #e1e6ec; }
.query-map-wrap .classroom-column-label, .query-map-wrap .classroom-row-label { fill: #7b8794; }
.query-map-wrap .desk { fill: #eef1f5; stroke: #cdd5df; }
.query-map-wrap .seat-chair { fill: #ffffff; stroke: #aeb8c3; }
#query-canvas .seat-chair.assigned, #query-minimap .seat-chair.assigned { fill: var(--seat-assigned-fill, #12b45c); }
#query-canvas .seat-chair.empty-seat, #query-minimap .seat-chair.empty-seat { fill: var(--seat-empty-fill, #ffffff); }
#query-canvas .seat-chair.locked-seat, #query-minimap .seat-chair.locked-seat { fill: #e7b869; }
.query-map-wrap .seat-number, .query-map-wrap .classroom-seat-name { fill: #334155; }
.query-map-wrap .seat-node .classroom-seat-name { font-size: 9px; font-weight: 700; text-rendering: geometricPrecision; }
.query-map-wrap .seat-node .seat-number { font-size: 7px; font-weight: 600; text-rendering: geometricPrecision; }
.query-map-wrap .seat-node.focus-seat .seat-chair, .query-map-wrap .seat-node.selected .seat-chair { fill: #fbbf24; stroke: #92400e; stroke-width: 2; filter: drop-shadow(0 5px 8px rgba(180,83,9,.24)); }
.query-map-wrap .seat-node.focus-seat .classroom-seat-name, .query-map-wrap .seat-node.focus-seat .seat-number { fill: #1f2937; font-weight: 700; }
.query-map-wrap .seat-node.dimmed { opacity: 1; }
.query-map-wrap .facility-shape, .query-map-wrap .aisle-shape { fill: #eef2f6; stroke: #b9c4cf; }
.query-map-wrap .facility-text, .query-map-wrap .element-label, .query-map-wrap .stage-label { fill: #52606d; }
.query-map-wrap .stage-shape { fill: #e6ebf0; stroke: #aeb9c4; }
.query-map-wrap .stage-face { fill: #d6dee6; }
.query-map-wrap .screen-shape { fill: #dce3ea; stroke: #aeb9c4; }
.query-map-wrap .screen-glint, .query-map-wrap .aisle-dash { stroke: #94a3b8; }
.query-map-wrap .blocked-shape { fill: #f1e7e5; stroke: #c58d85; }
.query-map-wrap .pillar-shape { fill: #d8dee5; stroke: #94a3af; }
.query-map-wrap .table-top { fill: #f6f8fa; stroke: #aeb8c3; }
.query-map-wrap .table-seat { fill: #ffffff; stroke: #aeb8c3; }
.query-result-card { color: #17202a; background: rgba(255,255,255,.78); border-color: rgba(255,255,255,.96); box-shadow: 0 16px 40px rgba(31,41,55,.14), inset 0 1px rgba(255,255,255,.9); backdrop-filter: blur(24px) saturate(1.25); -webkit-backdrop-filter: blur(24px) saturate(1.25); }
.query-result-card small { color: #7b8794; }
.query-result-card strong { color: #17202a; }
.query-result-card span { color: #8a5d12; }
.query-bottom { background: linear-gradient(180deg, transparent, rgba(244,246,248,.62) 32%, rgba(244,246,248,.9)); }
.query-search-shell { background: rgba(255,255,255,.76); border-color: rgba(255,255,255,.95); box-shadow: 0 18px 42px rgba(31,41,55,.14), inset 0 1px rgba(255,255,255,.9); backdrop-filter: blur(24px) saturate(1.2); -webkit-backdrop-filter: blur(24px) saturate(1.2); }
.query-search-icon { color: #64748b; }
.query-search-shell input { color: #1f2937; }
.query-search-shell input::placeholder { color: #8a96a3; }
.query-search-button { color: #ffffff; background: #1f2937; box-shadow: 0 5px 12px rgba(31,41,55,.2); }
.query-search-button:hover { background: #111827; }
.query-message { color: #7f1d1d; background: rgba(254,242,242,.86); border-color: rgba(248,113,113,.32); box-shadow: 0 14px 30px rgba(127,29,29,.1); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }

/* Query navigation stays outside the draggable map. */
.query-rotated { transform-origin: 0 0; transform: translateX(var(--query-physical-width)) rotate(90deg); }
.query-navigation { position: absolute; z-index: 9; top: calc(clamp(50px, var(--query-screen-height) * .09, 76px) + max(10px, env(safe-area-inset-top)) + 12px); right: max(12px, env(safe-area-inset-right)); width: 124px; padding: 5px; background: rgba(255,255,255,.84); border: 1px solid rgba(255,255,255,.95); border-radius: 12px; box-shadow: 0 6px 20px rgba(31,41,55,.1); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
#query-minimap { display: block; width: 100%; height: 68px; border-radius: 7px; background: #f4f6f8; cursor: crosshair; touch-action: manipulation; overflow: hidden; }
.minimap-facility { fill: #d7dee6; stroke: #8794a2; }
.minimap-window { fill: rgba(51,65,85,.07); stroke: #334155; stroke-width: 1.5; vector-effect: non-scaling-stroke; pointer-events: none; }
#query-minimap .minimap-focus { stroke: #b7791f; stroke-width: 2; vector-effect: non-scaling-stroke; }
.query-navigation-actions { display: flex; gap: 4px; margin-top: 4px; }
.query-navigation-actions button { min-width: 0; min-height: 44px; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 3px 0; border: 0; border-radius: 6px; background: transparent; color: #334155; font: inherit; font-size: 10px; cursor: pointer; }
.query-navigation-actions svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.query-navigation-actions button:hover, .query-navigation-actions button[aria-pressed="true"] { background: #e8edf2; }
.query-navigation button:focus-visible, #query-minimap:focus-visible { outline: 2px solid #64748b; outline-offset: 2px; }
.query-wide .query-navigation { width: 104px; }
.query-wide #query-minimap { height: 48px; }
.query-wide .query-meeting span { display: none; }
#query-canvas .seat-chair.reserved-seat { fill: #ad9864; }
#query-canvas .seat-node.focus-seat .seat-chair { stroke: #b7791f; stroke-width: 2.5; }
.query-map-wrap .seat-node .classroom-seat-name { paint-order: normal; stroke: none; }
#query-canvas .seat-node.focus-seat .classroom-seat-name { font-size: 10px; }
.query-result-card { font-size: 14px; font-weight: 600; }
@media (prefers-reduced-motion: reduce) { .query-map-wrap svg { transition: none; } #query-canvas .focus-seat .seat-chair { animation: none; } }

/* Keep the meeting identity centered independently of the preview close button. */
.query-view > .query-top-glass { padding: 8px 38px; }
.query-view .query-meeting { width: 100%; height: 100%; align-items: center; justify-content: center; text-align: center; }
.query-view .query-meeting strong { width: 100%; white-space: normal; overflow-wrap: anywhere; font-size: clamp(21px, calc(var(--query-screen-width, 100vw) * .058), 30px); line-height: 1.16; font-weight: 700; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.query-view .query-meeting strong.hidden { display: none; }
.query-view .query-meeting span { max-width: 100%; flex-shrink: 0; }
.query-view .query-close { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); }
.query-title-art { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.query-view .has-title-art span { display: none; }
.query-title-preview { min-height: 96px; padding: 16px; display: grid; place-items: center; text-align: center; background: #f4f6f8; border: 1px solid #d7dee6; border-radius: 12px; margin: 16px 0 10px; }
.query-title-preview img { max-width: 100%; max-height: 100px; object-fit: contain; }
.query-title-preview strong { font-size: 24px; overflow-wrap: anywhere; }
#title-upload-message { min-height: 20px; font-size: 12px; color: #52606d; }
#query-seat-bubble { pointer-events: none; }
.query-seat-bubble-shape { fill: #fff; stroke: #b7791f; stroke-width: 1.5px; filter: drop-shadow(0 4px 8px rgba(31,41,55,.2)); }
.query-seat-bubble-label { fill: #17202a; font-size: 16px; font-weight: 700; }
#query-canvas .seat-node.focus-seat .seat-chair { vector-effect: non-scaling-stroke; animation: query-seat-breathe 1.8s ease-in-out infinite; }
@keyframes query-seat-breathe {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(255,239,184,.85)) drop-shadow(0 0 7px rgba(255,209,91,.35)); }
  50% { filter: drop-shadow(0 0 3px rgba(255,247,213,1)) drop-shadow(0 0 13px rgba(255,209,91,.72)); }
}
@media (prefers-reduced-motion: reduce) { #query-canvas .seat-node.focus-seat .seat-chair { animation: none; } }
/* Import workflow controls */
.import-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; padding: 10px 11px; color: #738279; background: #f5f8f3; border: 1px solid #e7eee5; border-radius: 6px; font-size: 9px; line-height: 1.45; }
.import-actions .button { flex: none; height: 30px; padding-inline: 11px; font-size: 9px; }
.import-template-buttons { display: flex; flex: none; gap: 6px; }
.import-template-buttons .button { min-width: 98px; }
.import-file-message { min-height: 18px; margin-top: 8px; color: #54745f; font-size: 9px; }
.import-file-message.error { color: #b96c5a; }
.query-focus-halo { pointer-events: none; }
#query-canvas .seat-node.focus-seat { filter: drop-shadow(0 0 2px rgba(255,239,184,.9)) drop-shadow(0 0 8px rgba(255,209,91,.5)); animation: query-seat-breathe 1.8s ease-in-out infinite; }
#query-canvas .seat-node.focus-seat .seat-chair { fill: #f7cf72; stroke: rgba(255,247,213,.95); stroke-width: 1px; filter: none; animation: none; }
#query-canvas .seat-node.focus-seat .classroom-seat-name, #query-canvas .seat-node.focus-seat .seat-number { fill: #16251f; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { #query-canvas .seat-node.focus-seat { animation: none; } }
#query-canvas .seat-node.focus-seat .query-seat-halo { fill: none; stroke: rgba(255,224,132,.92); stroke-width: 1.1px; vector-effect: non-scaling-stroke; filter: drop-shadow(0 0 2px rgba(255,238,177,.9)) drop-shadow(0 0 7px rgba(255,196,61,.42)); animation: query-halo-pulse 1.8s ease-in-out infinite; }
#query-canvas .seat-node.focus-seat .classroom-seat-name { animation: query-name-pulse 1.8s ease-in-out infinite; }
@keyframes query-halo-pulse {
  0%, 100% { opacity: .42; stroke-width: 1px; }
  50% { opacity: 1; stroke-width: 2.4px; filter: drop-shadow(0 0 3px rgba(255,247,213,1)) drop-shadow(0 0 14px rgba(255,196,61,.78)); }
}
@keyframes query-name-pulse {
  0%, 100% { opacity: .78; filter: drop-shadow(0 0 1px rgba(255,247,213,.65)); }
  50% { opacity: 1; filter: drop-shadow(0 0 3px rgba(255,247,213,1)); }
}
@media (prefers-reduced-motion: reduce) { #query-canvas .seat-node.focus-seat .query-seat-halo, #query-canvas .seat-node.focus-seat .classroom-seat-name { animation: none; } }