/* このプラグインはページ全体ではなく、ショートコードが出力する
   .globe-map-lab-wrapper / .gml-app の中だけにスタイルを閉じ込める。
   （元のスタンドアロン版にあった *, :root, html, body, button, canvas
     への直接指定は、サイト全体に影響するためすべて .gml-app 配下に
     スコープし直している） */
.gml-app,.gml-app *{box-sizing:border-box;margin:0;padding:0}
.gml-app{
 --base:#fff;--bg:#eaf0f5;--main:#1e3a5f;--main2:#2d5a8f;--main3:#0f1e3a;
 --accent:#d4af37;--accent2:#f4cf5f;--text:#2c3e50;--muted:#718294;
 --border:#d6e0e8;--ocean:#cce5f6;--land:#c8d6a0;--landline:#637c42;
 --route:#e74c3c;--route2:#2563eb;
}
.globe-map-lab-wrapper{position:relative;overflow:hidden}
.gml-app button{font:inherit}
.gml-app canvas{display:block;width:100%;height:100%;touch-action:none}
.gml-app{
 height:100%;display:flex;flex-direction:column;position:relative;
 font-family:"BIZ UDGothic","Noto Sans JP",system-ui,sans-serif;
 background:var(--bg);color:var(--text)
}
.gml-header{
 height:52px;flex:none;background:var(--main);border-bottom:3px solid var(--accent);
 color:#fff;display:flex;align-items:center;padding:0 14px;gap:10px;
 box-shadow:0 3px 12px rgba(15,30,58,.16);z-index:20
}
.gml-title{font-size:1rem;font-weight:900;letter-spacing:.04em}
.gml-sub{font-size:.72rem;color:#bcd0e0}
.gml-header-spacer{flex:1}
.gml-icon-btn{
 border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;
 min-width:42px;height:38px;border-radius:10px;cursor:pointer;font-weight:900;font-size:.72rem
}
.gml-stage{flex:1;min-height:0;padding:8px;display:flex;gap:8px}
.gml-panel{
 flex:1;min-width:0;background:#fff;border:1px solid #cbd7e1;border-radius:14px;
 overflow:hidden;display:flex;flex-direction:column;box-shadow:0 4px 15px rgba(30,58,95,.09)
}
.gml-panel.is-hidden{display:none}
.gml-panel-head{
 height:34px;flex:none;padding:0 10px;display:flex;align-items:center;justify-content:space-between;
 border-bottom:1px solid var(--border);background:linear-gradient(#fff,#f4f7fa);
 font-size:.82rem;color:var(--main);font-weight:900
}
.gml-panel-badge{
 padding:3px 8px;border-radius:999px;background:#edf3f7;border:1px solid #d5e0e8;
 font-size:.68rem;color:#60758a
}
.gml-canvas-wrap{flex:1;min-height:0;position:relative;background:#edf3f7}
.gml-coord{
 position:absolute;right:8px;bottom:8px;background:rgba(15,30,58,.86);color:#fff;
 border:1px solid rgba(212,175,55,.45);border-radius:8px;padding:5px 8px;font-size:.7rem;
 pointer-events:none
}
.gml-note{
 position:absolute;left:8px;bottom:8px;background:rgba(255,255,255,.9);
 border:1px solid #d2dde5;border-radius:8px;padding:5px 8px;font-size:.68rem;color:#50677a;
 pointer-events:none
}

/* 右下フロートUI */
.gml-fabs{
 position:absolute;right:14px;bottom:14px;z-index:40;display:flex;flex-direction:column;gap:8px;
 align-items:flex-end;max-height:calc(100% - 20px);overflow-y:auto;padding:2px;scrollbar-width:thin
}
.gml-fab{
 min-width:108px;height:42px;border:none;border-radius:14px;background:var(--main);color:#fff;
 padding:0 14px;font-weight:900;cursor:pointer;box-shadow:0 5px 14px rgba(15,30,58,.28);flex:none;
 transition:background .15s,color .15s
}

.gml-fab-icon{
 min-width:46px;width:46px;padding:0;display:flex;align-items:center;justify-content:center
}
.gml-fab-icon svg{width:25px;height:25px;fill:currentColor}

.gml-fab.primary{background:var(--accent);color:var(--main3)}
.gml-fab:hover{transform:translateY(-1px)}
.gml-fab-label{font-size:.6rem;letter-spacing:-.02em}
.gml-fab-label.is-on{background:var(--accent);color:var(--main3)}
.gml-pop{
 position:absolute;right:132px;bottom:0;width:210px;background:#fff;border:1px solid var(--border);
 border-radius:14px;padding:9px;box-shadow:0 10px 28px rgba(15,30,58,.20);display:none
}
.gml-pop.open{display:block}
.gml-pop-title{font-size:.72rem;color:var(--main);font-weight:900;margin:2px 2px 7px;border-left:4px solid var(--accent);padding-left:7px}
.gml-pop-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.gml-choice{
 border:1px solid #cbd7e1;background:#fff;border-radius:9px;padding:8px 6px;cursor:pointer;
 font-size:.75rem;font-weight:800;color:var(--text)
}
.gml-choice.active{background:var(--main);border-color:var(--main);color:#fff}
.gml-choice.wide{grid-column:1/-1}
.gml-choice.gold{background:var(--accent);border-color:var(--accent);color:var(--main3)}

/* 設定パネル */
.gml-settings{
 position:absolute;top:60px;right:10px;z-index:50;width:240px;background:#fff;border:1px solid var(--border);
 border-radius:14px;padding:12px;box-shadow:0 12px 32px rgba(15,30,58,.22);display:none
}
.gml-settings.open{display:block}
.gml-settings h3{font-size:.8rem;color:var(--main);margin-bottom:9px;border-left:4px solid var(--accent);padding-left:7px}
.gml-row{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:.78rem}
.gml-row input{accent-color:var(--main)}
.gml-preset{width:100%;margin-top:6px;border:1px solid #cbd7e1;background:#fff;border-radius:9px;padding:8px;font-weight:800;cursor:pointer;font-size:.77rem}
.gml-preset.gold{background:var(--accent);border-color:var(--accent);color:var(--main3)}
.gml-toast{
 position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:100;
 background:rgba(15,30,58,.94);color:#fff;border:1px solid rgba(212,175,55,.5);
 border-radius:10px;padding:8px 13px;font-size:.78rem;opacity:0;pointer-events:none;transition:.18s
}
.gml-toast.show{opacity:1}

.gml-header-modes{display:flex;gap:5px;align-items:center}
.gml-head-mode{
 border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.07);color:#dce8f2;
 border-radius:9px;padding:6px 9px;font-size:.66rem;font-weight:900;cursor:pointer
}
.gml-head-mode.active{background:var(--accent);border-color:var(--accent);color:var(--main3)}
.gml-compass{
 position:absolute;top:9px;right:9px;width:72px;height:72px;border-radius:50%;
 background:rgba(255,255,255,.9);border:1px solid #cbd7e1;box-shadow:0 2px 8px rgba(30,58,95,.12);
 pointer-events:none;z-index:4
}
.gml-compass span{position:absolute;font-size:.68rem;font-weight:900;color:var(--main)}
.gml-compass .n{left:50%;top:3px;transform:translateX(-50%);color:#d63a3a}
.gml-compass .s{left:50%;bottom:3px;transform:translateX(-50%)}
.gml-compass .e{right:4px;top:50%;transform:translateY(-50%)}
.gml-compass .w{left:4px;top:50%;transform:translateY(-50%)}
.gml-compass::before,.gml-compass::after{content:"";position:absolute;background:#8aa0b3}
.gml-compass::before{left:50%;top:17px;bottom:17px;width:1px}
.gml-compass::after{top:50%;left:17px;right:17px;height:1px}
.gml-compass .dot{position:absolute;left:50%;top:50%;width:5px;height:5px;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%)}




.gml-tokyo-guide-note{
 position:absolute;left:10px;top:10px;z-index:6;
 background:rgba(255,255,255,.94);border:1px solid #d4dee6;border-radius:10px;
 padding:6px 9px;font-size:.7rem;font-weight:900;color:var(--main);pointer-events:none
}

.gml-east-help{font-size:.7rem;line-height:1.55;background:#f5f8fb;border:1px solid #d8e2ea;border-radius:10px;padding:8px;margin-bottom:7px}
.gml-east-help b{display:block;color:var(--main);margin-bottom:4px}
.gml-east-help span{display:block;margin:3px 0}
.red-dot,.blue-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
.red-dot{background:#e74c3c}.blue-dot{background:#2563eb}
.gml-east-sign{
 position:absolute;z-index:10;pointer-events:none;display:none;
 background:#fff;border:2px solid var(--accent);color:var(--main3);font-weight:900;
 border-radius:10px;padding:5px 8px;font-size:.72rem;box-shadow:0 3px 10px rgba(15,30,58,.14);
 white-space:nowrap
}

#mapPlaneBlue,#mapLabelBlue,#globePlaneRed,#globeLabelRed{display:none !important}

.gml-app:not(.comparison-active) .gml-plane,
.gml-app:not(.comparison-active) .gml-flight-label{display:none !important}

.gml-animbar{display:none;
 position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:35;
 width:min(620px,calc(100% - 290px));background:rgba(255,255,255,.95);
 border:1px solid var(--border);border-radius:14px;padding:8px 10px;
 align-items:center;gap:10px;box-shadow:0 7px 20px rgba(15,30,58,.16)
}
.gml-app.comparison-active.is-compare .gml-animbar.show{display:flex}
.gml-anim-btn{
 border:none;border-radius:10px;background:var(--main);color:#fff;padding:8px 12px;
 font-weight:900;cursor:pointer;white-space:nowrap
}
.gml-animbar input[type=range]{flex:1;accent-color:var(--accent)}
.gml-anim-stage{
 min-width:150px;text-align:center;font-size:.72rem;font-weight:900;color:var(--main);
 background:#eef4f8;border:1px solid #d7e1e9;border-radius:9px;padding:6px 8px
}
.gml-flight-label{
 position:absolute;pointer-events:none;z-index:8;font-size:.68rem;font-weight:900;
 background:rgba(255,255,255,.94);border:1px solid #d5e0e8;border-radius:999px;
 padding:3px 7px;color:var(--main);white-space:nowrap;display:none
}















.gml-plane{
 position:absolute;z-index:9;pointer-events:none;display:none;font-size:22px;
 transform:translate(-50%,-50%)
}
@media(max-width:760px){
 .gml-animbar{display:none;
width:calc(100% - 24px);bottom:66px}
}

@media(max-width:760px){
 .gml-title{display:none}.gml-sub{display:none}
 .gml-header-modes{gap:3px;flex:1}.gml-head-mode{padding:5px 5px;font-size:.6rem}
 .gml-stage{padding:5px;gap:5px}
 .gml-fab{min-width:90px;height:40px;font-size:.66rem}
 .gml-pop{right:104px;width:190px}
}

/* v21: 右フロートボタンは丸形 */
.gml-fabs .gml-fab{
 width:56px !important;
 height:56px !important;
 min-width:56px !important;
 padding:0 !important;
 border-radius:50% !important;
 display:flex !important;
 align-items:center;
 justify-content:center;
}
.gml-fabs .gml-fab.primary{font-size:.72rem}
.gml-fabs .gml-fab-icon{width:56px !important;height:56px !important}


.gml-app:not(.is-compare) .gml-plane,
.gml-app:not(.is-compare) .gml-flight-label,
.gml-app:not(.is-compare) .gml-east-sign{display:none !important}

