:root{--ink:#18191d;--muted:#777b87;--line:#e5e6ea;--soft:#f6f6f8;--blue:#2477f3;--nav:#202125;--danger:#ef476f}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Exo,system-ui,sans-serif;color:var(--ink);background:#fff}button,input,textarea,select{font:inherit}button,a{transition:.18s ease}button{cursor:pointer}.app-brand{display:flex;align-items:center;gap:7px;color:#111;text-decoration:none;font-weight:800;font-size:22px;letter-spacing:-1px}.app-brand span,.brand-logo span{display:grid;place-items:center;width:31px;height:31px;border-radius:10px;background:linear-gradient(145deg,#116cf1,#58a7ff);color:#fff;font-size:18px}.primary{border:0;border-radius:9px;background:var(--blue);color:#fff;padding:11px 17px;font-weight:700;box-shadow:0 4px 12px #2477f32c}.primary:hover{background:#1268e3;transform:translateY(-1px)}.primary:disabled{background:#cbd1da;box-shadow:none;cursor:default;transform:none}.secondary{border:1px solid var(--line);background:#fff;border-radius:9px;padding:10px 16px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em;color:var(--blue);margin:0 0 5px}.toast{position:fixed;z-index:100;bottom:24px;left:50%;transform:translate(-50%,20px);background:#202125;color:#fff;border-radius:9px;padding:11px 16px;font-size:13px;opacity:0;pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}
/* Login */.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 15% 15%,#e8f3ff 0,transparent 32%),radial-gradient(circle at 90% 80%,#fff2d4 0,transparent 30%),#fafbfc}.login-card{width:min(440px,calc(100% - 32px));text-align:center;background:#fff;border:1px solid var(--line);border-radius:22px;padding:45px;box-shadow:0 20px 60px #1b2e4b12}.brand-logo{display:flex;justify-content:center;align-items:center;gap:8px;font-size:26px;font-weight:800;letter-spacing:-1px}.login-card h1{font-size:29px;letter-spacing:-1.2px;margin:30px 0 8px}.login-card p{color:var(--muted);font-size:14px}.google-login{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:26px;padding:12px;border:1px solid #d9dbe0;border-radius:10px;text-decoration:none;color:#222;font-weight:650;box-shadow:0 3px 8px #0000000a}.google-login:hover{border-color:#aaa;background:#fafafa}.google-login svg{width:20px}.dev-login{display:block;margin-top:18px;color:#777;font-size:12px}.alert{margin-top:18px;background:#fff0f2;color:#b82d4c;border-radius:8px;padding:10px;font-size:13px}
/* Dashboard */.dashboard{display:grid;grid-template-columns:245px 1fr;min-height:100vh;background:#fafafa}.app-nav{position:sticky;top:0;height:100vh;padding:26px 18px;display:flex;flex-direction:column;background:#fff;border-right:1px solid var(--line)}.app-nav .app-brand{padding:0 10px 24px}.app-nav nav{display:grid;gap:5px}.app-nav nav a,.app-nav nav button{display:flex;align-items:center;gap:12px;border:0;background:transparent;color:#6e727d;text-decoration:none;padding:12px;border-radius:9px;text-align:left;font-weight:650}.app-nav nav .active{color:#176ce6;background:#edf5ff}.nav-user{margin-top:auto;padding:14px 7px 0;border-top:1px solid var(--line);display:flex;align-items:center;gap:9px}.nav-user>div:first-child{width:35px;height:35px;display:grid;place-items:center;background:#e8f2ff;border-radius:50%;color:#176ce6;font-weight:800;overflow:hidden}.nav-user img{width:100%;height:100%;object-fit:cover}.nav-user>div:nth-child(2){min-width:0;display:grid}.nav-user b{font-size:12px}.nav-user small{font-size:9px;color:#999;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nav-user a{margin-left:auto;text-decoration:none;color:#888}.maps-page{padding:50px clamp(25px,5vw,70px)}.maps-page>header{display:flex;justify-content:space-between;align-items:end;max-width:1260px;margin:auto}.maps-page h1{font-size:34px;margin:0;letter-spacing:-1.5px}.maps-page header p:last-child{margin:7px 0 0;color:var(--muted);font-size:14px}.map-grid{max-width:1260px;margin:34px auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:20px}.map-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 4px 15px #18233308}.map-thumb{position:relative;display:grid;place-items:center;aspect-ratio:16/9;background:#f1f2f5;color:#bbc0ca;text-decoration:none;font-size:45px;overflow:hidden}.map-thumb img{width:100%;height:100%;object-fit:cover}.status{position:absolute;right:10px;top:10px;padding:5px 8px;border-radius:6px;background:#fff;color:#797d85;font-size:10px;font-style:normal;font-weight:700;box-shadow:0 2px 6px #0002}.status.published{background:#e4f8ed;color:#16834a}.map-card-body{display:flex;align-items:center;padding:17px}.map-card-body>div{min-width:0}.map-card-body h2{margin:0;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.map-card-body p{margin:5px 0 0;color:#9296a0;font-size:10px}.more{margin-left:auto;border:0;background:none;color:#777}.embed-row{display:flex;margin:0 14px 14px;background:#f7f7f9;border-radius:7px;padding:7px}.embed-row code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:#777;flex:1}.embed-row button{border:0;background:none;color:var(--blue);font-size:10px;font-weight:700}.empty{max-width:650px;margin:80px auto;text-align:center;padding:70px;border:1px dashed #ccd0d8;border-radius:18px;background:#fff}.empty>div{font-size:46px;color:#8ab9f7}.empty h2{margin-bottom:6px}.empty p{color:var(--muted);font-size:13px;margin:0 0 20px}dialog{border:0;border-radius:15px;padding:0;box-shadow:0 25px 70px #0004}dialog::backdrop{background:#12151c88;backdrop-filter:blur(2px)}#newMapDialog form{position:relative;width:min(430px,90vw);padding:30px}#newMapDialog h2{margin:0 0 24px}.dialog-close{position:absolute;right:12px;top:12px;border:0;background:#f4f4f6;width:30px;height:30px;border-radius:50%;font-size:19px}#newMapDialog label{display:grid;gap:7px;font-size:12px;font-weight:700}#newMapDialog input{border:1px solid #d9dbe0;border-radius:8px;padding:11px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:24px}
/* Editor */.editor-page{height:100vh;overflow:hidden;background:#fff}.editor-top{height:70px;display:grid;grid-template-columns:210px minmax(120px,1fr) auto 1fr;gap:20px;align-items:center;padding:0 18px;border-bottom:1px solid #eee}.title-input{border:0;font-weight:800;font-size:17px;font-style:italic;min-width:0;padding:7px}.title-input:focus{outline:0;background:#f7f7f8;border-radius:6px}.device-switch{display:flex;padding:3px;background:#f1f1f3;border-radius:9px}.device-switch button,.editor-actions button{border:0;background:transparent;min-width:32px;height:32px;border-radius:7px;color:#888}.device-switch button.active{background:#fff;color:#222;box-shadow:0 2px 7px #0002}.editor-actions{display:flex;justify-content:flex-end;gap:5px}.editor-actions .primary{height:35px;padding:0 14px;color:#fff}.editor-shell{height:calc(100vh - 70px);display:grid;grid-template-columns:54px 300px 1fr}.rail{background:var(--nav);padding:13px 8px;display:flex;flex-direction:column;gap:7px}.rail button{width:38px;height:38px;border:0;border-radius:8px;background:transparent;color:#8d9099;font-size:17px}.rail button.active{background:#414249;color:#fff}.editor-panel{border-right:1px solid var(--line);overflow-y:auto;background:#fff}.panel-head{position:sticky;z-index:2;top:0;min-height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px;padding:13px 20px}.panel-head h2{font-size:16px;margin:2px 0}.panel-head h2 span{display:inline-grid;place-items:center;background:#f1f2f4;color:#777;min-width:21px;height:18px;border-radius:5px;font-size:10px}.panel-head small{font-size:9px;color:#999;font-weight:700}.panel-head button{border:0;background:#f6f6f8;border-radius:7px;width:30px;height:30px}.panel-head>div:first-child{margin-right:auto}.panel-head .grow{flex:1}.danger-icon{color:var(--danger)!important}.location-list{padding:10px}.location-row{width:100%;display:flex;align-items:center;gap:11px;border:0;border-bottom:1px solid #eee;background:#fff;padding:11px 8px;text-align:left}.location-row:hover,.location-row.active{background:#f6f9fe;border-radius:8px}.location-row.is-hidden{opacity:.48;background:#f0f0f0}.location-row i{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--marker);color:#fff;font-size:10px;font-style:normal}.location-row span{display:grid;min-width:0}.location-row b{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.location-row small{color:#a0a3aa;font-size:9px;margin-top:2px}.location-row em{margin-left:auto;color:#aaa;font-style:normal}.list-empty,.coming-soon{padding:45px 22px;text-align:center;color:#999}.list-empty p,.coming-soon p{font-size:11px;line-height:1.6}.fields{padding:15px 20px 35px;display:grid;gap:15px}.fields label{display:grid;gap:6px;color:#70737c;font-size:10px;font-weight:700}.fields input:not([type=checkbox]):not([type=color]),.fields textarea,.fields select{width:100%;border:1px solid #e2e3e7;background:#f7f7f8;border-radius:7px;padding:9px;color:#24252a;font-size:11px;outline:0}.fields input:focus,.fields textarea:focus,.fields select:focus{border-color:#8ab9f7;background:#fff}.fields textarea{resize:vertical}.fields fieldset{border:0;border-top:1px solid var(--line);padding:16px 0 0;margin:2px 0 0;display:grid;gap:12px}.fields legend{padding:0 7px 0 0;font-size:10px;font-weight:800;color:#333;text-transform:uppercase}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fields input[type=color]{width:100%;height:34px;border:1px solid #ddd;background:#fff;border-radius:7px;padding:3px}.check-row{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:9px!important;color:#333!important}.check-row input{margin-top:2px}.check-row small{color:#999;font-weight:400}.field-help{font-size:9px;color:#a0a3aa;margin:0;line-height:1.5}.image-upload{position:relative;min-height:85px;border:1px dashed #ccd0d8;border-radius:8px;display:grid;place-items:center;overflow:hidden;background:#fafafa}.image-upload input{position:absolute;inset:0;opacity:0;cursor:pointer}.image-upload span{color:var(--blue);font-size:10px}.image-upload img{position:absolute;width:100%;height:100%;object-fit:cover}.map-upload{min-height:110px}.canvas-area{min-width:0;min-height:0;background:#fafafa;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px;overflow:auto}.viewport{width:100%;height:100%;max-width:1200px;max-height:760px;transition:.25s;display:flex;align-items:center;justify-content:center}.viewport.tablet{width:min(760px,100%)}.viewport.mobile{width:min(390px,100%)}.map-stage{position:relative;width:100%;max-height:100%;aspect-ratio:16/10;background:#f1f2f4;border-radius:14px;overflow:hidden;box-shadow:0 1px 4px #0000000a}.map-stage>img{width:100%;height:100%;object-fit:contain;user-select:none}.map-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#9a9da5}.map-empty span{font-size:42px;color:#b8cfea}.map-empty h2{font-size:16px;margin:9px 0 3px}.map-empty p{font-size:10px;margin:0}.markers{position:absolute;inset:0}.marker{position:absolute;z-index:1;transform:translate(-50%,-50%);width:var(--size);height:var(--size);display:grid;place-items:center;border:3px solid #fff;background:var(--color);color:var(--text);opacity:var(--opacity);border-radius:50%;font-size:calc(var(--size) * .32);font-weight:800;box-shadow:0 2px 8px #0004;cursor:grab;touch-action:none}.marker.rounded{border-radius:25%}.marker.square{border-radius:2px}.marker.selected{outline:3px solid #2477f355;outline-offset:3px;z-index:3}.marker.pulse:before{content:"";position:absolute;inset:-4px;border-radius:inherit;border:2px solid var(--color);animation:pulse 1.8s infinite}.marker i{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#202125;color:#fff;border-radius:5px;padding:5px 7px;white-space:nowrap;font-size:9px;font-weight:600;font-style:normal;pointer-events:none;opacity:0;transition:.15s}.marker:hover i{opacity:1}.canvas-tip{color:#999;font-size:9px;margin:11px 0 0}.preview-dialog{width:min(1200px,94vw);height:min(820px,90vh);overflow:hidden}.preview-dialog .dialog-close{z-index:2}.preview-dialog iframe{width:100%;height:100%;border:0}.preview-dialog[open]{display:block}
@keyframes pulse{0%{transform:scale(.9);opacity:.85}75%,100%{transform:scale(1.8);opacity:0}}
@media(max-width:800px){.dashboard{grid-template-columns:1fr}.app-nav{height:64px;position:sticky;z-index:3;flex-direction:row;align-items:center;padding:10px 16px;border-right:0;border-bottom:1px solid var(--line)}.app-nav .app-brand{padding:0}.app-nav nav{display:flex;margin-left:auto}.app-nav nav a,.app-nav nav button{padding:9px}.app-nav nav span,.nav-user{display:none}.maps-page{padding:28px 16px}.maps-page>header{align-items:flex-start}.maps-page>header>div>p:last-child{display:none}.maps-page h1{font-size:28px}.editor-top{height:60px;grid-template-columns:auto 1fr auto;padding:0 10px;gap:7px}.editor-top .app-brand{font-size:0}.editor-top .app-brand span{font-size:15px;width:28px;height:28px}.device-switch{display:none}.editor-actions button:not(.primary){display:none}.editor-shell{height:calc(100vh - 60px);grid-template-columns:46px minmax(245px,72vw) 1fr}.rail{padding:8px 4px}.editor-panel{width:auto}.canvas-area{padding:12px}.map-grid{grid-template-columns:1fr}}