:root{color:#17324d;background:#f4f8fb;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea,select{font:inherit}button,a,input,textarea,select{outline-offset:3px}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid rgba(0,119,182,.38)}button{border:1px solid rgba(23,50,77,.14);border-radius:8px;background:#fff;color:#17324d;cursor:pointer;font-weight:800;min-height:38px;padding:9px 12px;transition:background .16s ease,border-color .16s ease,transform .16s ease}button:hover{border-color:#0077b661;transform:translateY(-1px)}button[aria-pressed=true],.primary-action{background:#0077b6;border-color:#0077b6;color:#fff}.danger-action,.text-danger{color:#b42318}.app-shell{min-height:100vh}.app-header{align-items:center;background:#fff;border-bottom:1px solid rgba(23,50,77,.1);display:flex;justify-content:space-between;gap:20px;padding:18px clamp(16px,4vw,34px);position:sticky;top:0;z-index:20}.app-header h1{font-size:clamp(22px,3vw,34px);line-height:1.08;margin:0}.eyebrow{color:#637b8f;font-size:12px;font-weight:900;letter-spacing:.08em;margin:0 0 5px;text-transform:uppercase}.mode-pill{background:#e9f7fb;border:1px solid rgba(0,119,182,.18);border-radius:999px;color:#005f92;flex:0 0 auto;font-size:13px;font-weight:900;padding:10px 14px}.workspace{display:grid;gap:22px;grid-template-columns:minmax(0,1fr) minmax(340px,420px);padding:22px clamp(16px,4vw,34px) 34px}.map-workbench{min-width:0}.image-setup,.toolbar,.category-filters{align-items:center;display:flex;flex-wrap:wrap;gap:10px}.image-setup{background:#fff;border:1px solid rgba(23,50,77,.1);border-radius:8px;margin-bottom:12px;padding:12px}.image-setup>div{display:grid;margin-right:auto}.image-setup span,.small-note,.map-hint{color:#637b8f;font-size:13px;line-height:1.45}.file-picker{align-items:center;background:#fff;border:1px solid rgba(23,50,77,.14);border-radius:8px;cursor:pointer;display:inline-flex;font-weight:800;min-height:38px;padding:9px 12px}.file-picker input{display:none}.url-form{display:flex;flex:1 1 290px;gap:8px}.url-form input{min-width:0}.storage-warning,.status-message{background:#fff7ed;border:1px solid #fed7aa;border-radius:8px;color:#9a3412;flex-basis:100%;font-size:13px;font-weight:800;margin:2px 0 0;padding:10px 12px}.toolbar{margin-bottom:12px}.category-filters{margin:0 0 12px}.category-filters button{border-radius:999px}.map-shell{min-width:0;position:relative}.map-zoom-controls{align-items:center;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 10px}.map-zoom-controls label{align-items:center;background:#fff;border:1px solid rgba(23,50,77,.1);border-radius:8px;color:#17324d;display:flex;flex:1 1 220px;flex-direction:row;gap:10px;min-height:38px;padding:8px 11px}.map-zoom-controls input{min-height:0;padding:0}.map-viewport{border-radius:8px;-webkit-overflow-scrolling:touch;overflow:auto;overscroll-behavior:contain;padding:0 0 4px;position:relative}.map-viewport.is-preview{cursor:grab}.map-viewport.is-preview:active{cursor:grabbing}.map-stage{background:#dff4f8;box-shadow:0 22px 60px #19425c29;overflow:hidden;position:relative;touch-action:none;width:100%}.map-stage.is-builder{cursor:crosshair}.map-image{display:block;height:auto;-webkit-user-select:none;user-select:none;width:100%}.hotspot-layer{top:0;right:0;bottom:0;left:0;position:absolute}.hotspot-button{align-items:center;background:var(--hotspot-color);border:var(--hotspot-border-width) solid var(--hotspot-border);border-radius:999px;box-shadow:0 10px 22px #0b233742;color:#fff;display:inline-grid;font-size:13px;font-weight:900;height:var(--hotspot-size);justify-content:center;left:var(--hotspot-x);min-height:0;padding:0;place-items:center;position:absolute;top:var(--hotspot-y);transform:translate(-50%,-50%);width:var(--hotspot-size);z-index:2}.hotspot-button:hover,.hotspot-button:focus-visible,.hotspot-button.is-selected{box-shadow:0 16px 32px #0b233752;transform:translate(-50%,-50%) scale(1.12)}.hotspot-button.is-selected{outline:3px solid rgba(0,119,182,.42)}.hotspot-button.is-pulsing:after{animation:hotspotPulse var(--pulse-speed) ease-out infinite;border:2px solid var(--hotspot-color);border-radius:inherit;content:"";top:-8px;right:-8px;bottom:-8px;left:-8px;position:absolute}.hotspot-glyph{align-items:center;display:inline-grid;justify-items:center;line-height:1;max-width:80%;overflow:hidden;position:relative;text-overflow:ellipsis;white-space:nowrap;z-index:1}.hotspot-glyph.is-icon{display:grid;height:74%;max-width:none;place-items:center;width:74%}.hotspot-glyph svg{display:block;fill:none;height:100%;overflow:visible;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2;width:100%}.hotspot-label{background:#0d2334f0;border-radius:999px;bottom:calc(100% + 10px);box-shadow:0 8px 18px #081c2a33;color:#fff;font-size:12px;font-weight:900;left:50%;opacity:0;padding:7px 10px;pointer-events:none;position:absolute;transform:translate(-50%);transition:opacity .16s ease,transform .16s ease;white-space:nowrap}.hotspot-button:hover .hotspot-label,.hotspot-button:focus-visible .hotspot-label{opacity:1;transform:translate(-50%) translateY(-2px)}.map-hint{margin:12px 2px 0}.side-panel{align-self:start;background:#fff;border:1px solid rgba(23,50,77,.1);border-radius:8px;box-shadow:0 18px 45px #17324d14;max-height:calc(100vh - 116px);overflow:auto;position:sticky;top:94px}.panel-tabs{background:#f7fbfd;border-bottom:1px solid rgba(23,50,77,.1);display:grid;gap:6px;grid-template-columns:repeat(6,minmax(0,1fr));padding:10px;position:sticky;top:0;z-index:3}.panel-tabs button{min-width:0;padding-inline:8px}.panel-section{border-bottom:1px solid rgba(23,50,77,.08);display:grid;gap:13px;padding:16px}.panel-section h2{font-size:18px;line-height:1.2;margin:0}.section-heading{align-items:center;display:flex;justify-content:space-between;gap:12px}.section-heading span{color:#637b8f;font-size:12px;font-weight:900}.empty-panel p{color:#637b8f;margin:0}label{color:#40576b;display:grid;font-size:13px;font-weight:900;gap:7px}input,textarea,select{background:#fff;border:1px solid rgba(23,50,77,.16);border-radius:8px;color:#17324d;min-height:40px;padding:10px 11px;width:100%}textarea{min-height:96px;resize:vertical}input[type=color]{min-height:42px;padding:4px}.field-row{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.toggle-field{align-items:center;color:#17324d;display:flex;flex-direction:row;gap:9px}.toggle-field input{height:18px;min-height:0;width:18px}.toggle-grid{display:grid;gap:10px}.category-manager{background:#f7fbfd;border:1px solid rgba(23,50,77,.1);border-radius:8px;padding:12px}.category-manager summary{cursor:pointer;font-weight:900}.category-editor-list{display:grid;gap:8px;margin:12px 0}.category-editor-row{display:grid;gap:8px;grid-template-columns:1fr 58px minmax(120px,1fr)}.hotspot-chooser-section{background:#fbfdff;gap:11px}.selected-hotspot-chip{align-items:center;background:#fff;border:1px solid rgba(23,50,77,.1);border-radius:8px;display:grid;gap:10px;grid-template-columns:20px minmax(0,1fr);padding:10px}.selected-hotspot-chip span:last-child{display:grid;gap:2px;min-width:0}.selected-hotspot-chip strong,.selected-hotspot-chip small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-hotspot-chip small{color:#637b8f}.cloud-status{border-radius:8px;font-size:13px;font-weight:900;padding:11px 12px}.cloud-status.is-ready{background:#ecfdf5;border:1px solid #bbf7d0;color:#166534}.cloud-status.is-missing{background:#fff7ed;border:1px solid #fed7aa;color:#9a3412}.subsection-divider{border-top:1px solid rgba(23,50,77,.1);display:grid;gap:6px;margin-top:6px;padding-top:14px}.subsection-divider h3{color:#17324d;font-size:16px;line-height:1.2;margin:0}.shared-project-list{display:grid;gap:9px}.shared-project-item{align-items:center;border:1px solid rgba(23,50,77,.1);border-radius:8px;display:flex;gap:10px;justify-content:space-between;padding:10px}.shared-project-item div{display:grid;gap:2px;min-width:0}.shared-project-item strong,.shared-project-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.shared-project-item small{color:#637b8f}.icon-designer-layout{align-items:center;display:grid;gap:14px;grid-template-columns:88px minmax(0,1fr)}.icon-preview-button{background:#0077b6;border:4px solid #ffffff;border-radius:999px;box-shadow:0 12px 28px #0b23373d;color:#fff;display:grid;height:76px;min-height:0;padding:18px;place-items:center;width:76px}.icon-preview-button:hover{transform:none}.icon-preview-button svg,.icon-template-grid svg,.custom-icon-preview svg{display:block;fill:none;height:100%;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.2;width:100%}.icon-template-grid{display:grid;gap:8px;grid-template-columns:repeat(5,minmax(38px,1fr))}.icon-template-grid button,.custom-icon-preview{align-items:center;background:#f7fbfd;color:#12355b;display:grid;height:42px;min-height:0;padding:9px;place-items:center}.icon-grid-wrap{background:linear-gradient(90deg,rgba(23,50,77,.04) 1px,transparent 1px),linear-gradient(rgba(23,50,77,.04) 1px,transparent 1px),#f7fbfd;background-size:24px 24px;border:1px solid rgba(23,50,77,.12);border-radius:8px;display:grid;padding:12px;place-items:center}.icon-drawing-grid{aspect-ratio:1;cursor:crosshair;max-width:260px;width:100%}.icon-drawing-grid line{stroke:#17324d29;stroke-width:.18}.icon-drawing-path{fill:none;stroke:#0077b6;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8}.icon-drawing-point{fill:#12355b;stroke:#fff;stroke-width:.25}.custom-icon-list{display:grid;gap:9px}.custom-icon-item{align-items:center;border:1px solid rgba(23,50,77,.1);border-radius:8px;display:grid;gap:10px;grid-template-columns:44px minmax(0,1fr) auto;padding:10px}.custom-icon-item div{display:grid;gap:2px;min-width:0}.custom-icon-item strong,.custom-icon-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.custom-icon-item small{color:#637b8f}.hotspot-list{display:grid;gap:10px}.hotspot-manager-section details{display:grid;gap:12px}.hotspot-manager-section summary{align-items:center;cursor:pointer;display:flex;font-weight:900;justify-content:space-between;list-style:none}.hotspot-manager-section summary::-webkit-details-marker{display:none}.hotspot-manager-section summary:before{color:#0077b6;content:"+";font-size:18px;margin-right:8px}.hotspot-manager-section details[open] summary:before{content:"-"}.hotspot-manager-section summary span{margin-right:auto}.hotspot-manager-section summary strong{align-items:center;background:#e9f7fb;border-radius:999px;color:#005f92;display:inline-flex;font-size:12px;height:26px;justify-content:center;min-width:26px;padding:0 8px}.hotspot-list-item{border:1px solid rgba(23,50,77,.1);border-radius:8px;display:grid;gap:8px;padding:10px}.hotspot-list-item.is-active{border-color:#0077b66b;box-shadow:0 0 0 3px #0077b61a}.hotspot-summary{align-items:center;background:transparent;border:0;display:flex;gap:10px;justify-content:flex-start;min-height:0;padding:0;text-align:left}.hotspot-summary:hover{transform:none}.hotspot-summary span:last-child{display:grid;gap:2px;min-width:0}.hotspot-summary strong,.hotspot-summary small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.hotspot-summary small{color:#637b8f}.mini-dot{border:2px solid #fff;border-radius:999px;box-shadow:0 0 0 1px #17324d29;height:18px;width:18px}.compact-actions{display:flex;flex-wrap:wrap;gap:6px}.compact-actions button{font-size:12px;min-height:32px;padding:6px 8px}.stacked-actions{display:flex;flex-wrap:wrap;gap:8px}.modal-backdrop{background:#071c2b8c;display:grid;top:0;right:0;bottom:0;left:0;padding:18px;place-items:center;position:absolute;z-index:20}.preview-modal{background:#fff;box-shadow:0 30px 80px #00142352;max-height:min(86vh,720px);overflow:auto;padding:24px;position:relative;width:min(94vw,480px)}.modal-close{background:#12355b14;border:0;border-radius:999px;color:#12355b;font-size:24px;height:36px;line-height:1;min-height:0;padding:0;position:absolute;right:12px;top:12px;width:36px}.modal-category{color:#637b8f;font-size:12px;font-weight:900;letter-spacing:.08em;margin:0 44px 8px 0;text-transform:uppercase}.preview-modal h2{font-size:26px;line-height:1.12;margin:0 44px 12px 0}.preview-modal p{color:#40576b;line-height:1.55}.modal-description{white-space:pre-line}.modal-image{aspect-ratio:16 / 9;border-radius:14px;display:block;margin-bottom:16px;object-fit:cover;width:100%}.modal-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.modal-link{align-items:center;border-radius:999px;color:#fff;display:inline-flex;font-weight:900;justify-content:center;min-height:44px;padding:12px 17px;text-align:center;text-decoration:none}.modal-link.secondary{background:#12355b1a;color:#12355b}@keyframes hotspotPulse{0%{opacity:.62;transform:scale(.82)}to{opacity:0;transform:scale(1.55)}}@media (max-width: 1120px){.workspace{grid-template-columns:1fr}.side-panel{max-height:none;position:static}}@media (max-width: 720px){.app-header{align-items:flex-start;flex-direction:column}.workspace{padding-inline:12px}.toolbar,.image-setup,.url-form{align-items:stretch;flex-direction:column}.toolbar button,.url-form button{width:100%}.field-row,.panel-tabs{grid-template-columns:1fr}.hotspot-button{height:calc(var(--hotspot-size) * 1.16);width:calc(var(--hotspot-size) * 1.16)}.map-viewport.is-preview{max-height:min(72vh,620px);touch-action:none}.hotspot-label{display:none}.modal-backdrop{background:transparent;display:block;padding:12px 0 0;position:static}.preview-modal{border:1px solid rgba(23,50,77,.1);border-radius:8px!important;box-shadow:0 16px 38px #17324d1f;max-height:none;width:100%}}
