/* C-GESTUS Planner 2.2 · Navigation Hub */
:root{
    --hub-blue:#118fd2;
    --hub-blue-deep:#0966bf;
    --hub-navy:#102532;
    --hub-surface:rgba(255,255,255,.91);
    --hub-line:rgba(92,130,150,.18);
    --hub-shadow:0 24px 70px rgba(20,47,61,.18);
}

.v220-wordmark small{
    color:var(--hub-blue-deep);
    letter-spacing:.15em;
    font-size:7px
}
.v220-brand{min-width:max-content}
.v220-topbar{justify-content:flex-start}
.v220-top-actions{margin-left:auto}

.v220-menu-trigger{
    min-height:42px;
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:0 16px;
    border:1px solid rgba(108,151,174,.24);
    border-radius:11px;
    background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(240,247,250,.76));
    color:#173340;
    box-shadow:0 8px 22px rgba(20,58,77,.09),inset 0 1px rgba(255,255,255,.85);
    font-size:11px;
    font-weight:850;
    cursor:pointer
}
.v220-menu-trigger .apm-icon{width:19px;height:19px;color:#1389ca}
.v220-menu-trigger:hover{transform:translateY(-1px);box-shadow:0 11px 28px rgba(20,58,77,.14)}

.v220-classic-desktop-nav{display:none}
body[data-menu-desktop="classic"] .v220-classic-desktop-nav{display:flex}
body[data-menu-desktop="classic"] .v220-hub-trigger-desktop{display:none}

.v220-classic-mobile-dock,
.v220-mobile-menu-dock{display:none}

/* Hub */
.v220-hub-modal{
    width:min(920px,calc(100vw - 28px));
    max-height:min(790px,calc(100vh - 34px));
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    overflow:hidden;
    border:1px solid rgba(116,154,174,.28);
    background:rgba(249,252,253,.94);
    box-shadow:0 32px 100px rgba(11,35,48,.28);
    backdrop-filter:blur(24px) saturate(1.16)
}
.v220-hub-modal[hidden]{display:none}
.v220-hub-head{
    padding:15px 18px;
    border-bottom:1px solid var(--hub-line);
    background:rgba(255,255,255,.66)
}
.v220-hub-head h2{font-size:20px}
.v220-hub-head p{font-size:7px;letter-spacing:.17em;color:#758b96}
.v220-hub-head-actions{display:flex;gap:6px}
.v220-hub-head-actions button{
    width:38px;height:38px;display:grid;place-items:center;
    border:1px solid var(--hub-line);border-radius:10px;background:rgba(247,250,251,.92);color:#61757e
}
.v220-hub-body{min-height:0;overflow:auto;padding:18px}
.v220-hub-panel{min-height:470px}
.v220-panel-intro{margin:2px 0 16px}
.v220-panel-intro>span{display:block;color:#173340;font-size:18px;font-weight:900}
.v220-panel-intro p{margin:3px 0 0;color:#7b8d95;font-size:9px}

/* Main radial hub */
.v220-hub-orbit{
    position:relative;
    width:min(610px,100%);
    height:465px;
    margin:2px auto;
    border-radius:50%;
    background:
      radial-gradient(circle at 50% 48%,rgba(20,145,211,.13) 0 2px,transparent 3px),
      radial-gradient(circle at 50% 48%,transparent 0 92px,rgba(31,149,211,.11) 93px 94px,transparent 95px 160px,rgba(31,149,211,.08) 161px 162px,transparent 163px),
      radial-gradient(circle at 50% 48%,rgba(255,255,255,.92),rgba(239,247,251,.56) 62%,transparent 63%);
}
.v220-hub-center{
    position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);
    width:94px;height:94px;border-radius:50%;display:grid;place-items:center;align-content:center;gap:4px;
    color:#fff;background:linear-gradient(145deg,#24afe5,#0865c7);box-shadow:0 14px 38px rgba(10,108,185,.28),0 0 0 10px rgba(21,145,211,.08)
}
.v220-hub-center .apm-icon{width:26px;height:26px}
.v220-hub-center span{font-size:8px;font-weight:850}
.v220-hub-node{
    position:absolute;width:138px;min-height:88px;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left;column-gap:8px;
    padding:12px;border:1px solid rgba(112,151,171,.23);border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 13px 32px rgba(25,65,83,.11),inset 0 1px rgba(255,255,255,.95);color:#183440;cursor:pointer
}
.v220-hub-node .apm-icon{grid-row:1/3;width:30px;height:30px;color:#148bd0}
.v220-hub-node strong{font-size:11px}
.v220-hub-node small{color:#80929a;font-size:7px}
.v220-hub-node:hover{transform:translateY(-3px);border-color:rgba(18,143,208,.34);box-shadow:0 18px 42px rgba(25,65,83,.16)}
.v220-node-create{left:50%;top:15px;transform:translateX(-50%);border-color:rgba(16,143,211,.3)}
.v220-node-create:hover{transform:translateX(-50%) translateY(-3px)}
.v220-node-organize{left:10px;top:42%;transform:translateY(-50%)}
.v220-node-organize:hover{transform:translateY(calc(-50% - 3px))}
.v220-node-apps{right:10px;top:42%;transform:translateY(-50%)}
.v220-node-apps:hover{transform:translateY(calc(-50% - 3px))}
.v220-node-customize{left:105px;bottom:22px}
.v220-node-system{right:105px;bottom:22px}
.v220-node-create .apm-icon,.v220-node-organize .apm-icon{color:#087ed0}
.v220-node-customize .apm-icon{color:#725ac1}
.v220-node-system .apm-icon{color:#52656d}

/* Create radial */
.v220-create-ring{
    position:relative;width:520px;height:420px;margin:5px auto 0;border-radius:50%;
    background:radial-gradient(circle,rgba(26,148,213,.08) 0 1px,transparent 2px 85px,rgba(29,148,211,.10) 86px 87px,transparent 88px 158px,rgba(29,148,211,.07) 159px 160px,transparent 161px)
}
.v220-create-action,.v220-create-center{
    position:absolute;width:104px;height:104px;border:1px solid rgba(107,148,168,.24);border-radius:50%;display:grid;place-items:center;align-content:center;gap:5px;background:rgba(255,255,255,.93);color:#193844;box-shadow:0 13px 28px rgba(23,63,82,.12);text-decoration:none;cursor:pointer
}
.v220-create-action .apm-icon{width:29px;height:29px;color:#0b83d0}
.v220-create-action span{font-size:9px;font-weight:850}
.v220-create-action:hover{transform:scale(1.045);box-shadow:0 17px 38px rgba(23,63,82,.17)}
.v220-create-center{left:50%;top:50%;transform:translate(-50%,-50%);width:92px;height:92px;background:linear-gradient(145deg,#25ace5,#0766c7);color:#fff;border:0;box-shadow:0 15px 38px rgba(7,103,192,.28)}
.v220-create-center .apm-icon{width:24px;height:24px}.v220-create-center span{font-size:8px;font-weight:800}
.action-task{left:50%;top:0;transform:translateX(-50%)}.action-task:hover{transform:translateX(-50%) scale(1.045)}
.action-event{right:30px;top:58px}.action-finance{right:30px;bottom:58px}.action-followup{left:50%;bottom:0;transform:translateX(-50%)}.action-followup:hover{transform:translateX(-50%) scale(1.045)}
.action-project{left:30px;bottom:58px}.action-routine{left:30px;top:58px}

/* Organize / feature grids */
.v220-organize-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.v220-organize-grid>a,.v220-feature-grid>a{
    min-height:76px;display:grid;grid-template-columns:30px 1fr auto;align-items:center;gap:8px;padding:11px;border:1px solid rgba(109,149,169,.19);border-radius:12px;background:rgba(255,255,255,.72);color:#18343f;text-decoration:none
}
.v220-organize-grid>a:hover,.v220-feature-grid>a:hover{border-color:rgba(18,142,207,.3);background:#fff;box-shadow:0 8px 22px rgba(20,55,72,.08)}
.v220-organize-grid .apm-icon,.v220-feature-grid .apm-icon{width:24px;height:24px;color:#107fc4}
.v220-organize-grid strong,.v220-feature-grid strong{display:block;font-size:9px}.v220-organize-grid small,.v220-feature-grid small{display:block;margin-top:2px;color:#89989e;font-size:6.7px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v220-organize-grid b{min-width:20px;height:20px;display:grid;place-items:center;border-radius:999px;background:#fff0ef;color:#c74940;font-size:7px}
.v220-organize-grid>a[aria-current="page"]{border-color:#9dd4ef;background:#eff9fe}
.v220-feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.v220-theme-inline{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:9px;border:1px solid var(--hub-line);border-radius:12px;background:rgba(255,255,255,.55)}
.v220-theme-inline button{min-height:42px;display:flex;justify-content:center;align-items:center;gap:7px;border:1px solid var(--hub-line);border-radius:9px;background:#fff;color:#52656d}
.v220-theme-inline button.active{border-color:#83c7e9;background:#edf9ff;color:#087fc4}

.v220-hub-footer{position:sticky;bottom:0;z-index:4;background:rgba(250,252,253,.97);backdrop-filter:blur(16px)}
.v220-logout-modal{width:min(410px,calc(100vw - 28px))}
.v220-logout-body{display:grid;place-items:center;text-align:center;gap:14px;padding:26px}.v220-logout-body>.apm-icon{width:38px;height:38px;color:#d34a43}.v220-logout-body p{margin:0;color:#62767f;font-size:11px}.v220-logout-body>div{display:flex;gap:8px}.v220-logout-body form{margin:0}.v220-logout-confirm{background:#a63f3a}

/* Compact menu option */
.v220-hub-modal[data-active-style="compact"] .v220-hub-orbit{height:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;background:none}
.v220-hub-modal[data-active-style="compact"] .v220-hub-node{position:static!important;width:auto;min-height:72px;transform:none!important}
.v220-hub-modal[data-active-style="compact"] .v220-hub-center{display:none}
.v220-hub-modal[data-active-style="compact"] .v220-create-ring{width:auto;height:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:9px;background:none}
.v220-hub-modal[data-active-style="compact"] .v220-create-action{position:static!important;width:auto;height:95px;transform:none!important;border-radius:14px}
.v220-hub-modal[data-active-style="compact"] .v220-create-center{display:none}
body[data-menu-density="compact"] .v220-organize-grid{gap:5px}body[data-menu-density="compact"] .v220-organize-grid>a{min-height:62px;padding:8px}

/* Settings */
.v220-menu-settings{margin-bottom:14px}.v220-recommended{padding:5px 8px;border-radius:999px;background:#eef9ff;color:#1779ad;font-size:7px;font-weight:850}.v220-style-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.v220-style-columns fieldset{min-width:0;padding:0;border:0}.v220-style-columns legend{margin-bottom:7px;color:#687b83;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.12em}.v220-style-picker{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.v220-style-picker label{position:relative}.v220-style-picker input{position:absolute;opacity:0;pointer-events:none}.v220-style-picker span{min-height:86px;display:grid;align-content:center;gap:4px;padding:11px;border:1px solid #dce6e9;border-radius:12px;background:#fbfdfd;cursor:pointer}.v220-style-picker strong{font-size:9px}.v220-style-picker small{color:#829399;font-size:7px;line-height:1.4}.v220-style-picker input:checked+span{border-color:#66bce6;background:#eff9fe;box-shadow:0 0 0 2px rgba(19,144,207,.08)}.v220-menu-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.v220-menu-options label{display:grid;gap:4px;color:#6b7d85;font-size:8px}.v220-menu-toggles{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin:12px 0}.v220-menu-toggles label{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:start;padding:10px;border:1px solid #dde6e8;border-radius:11px;background:#fbfcfc}.v220-menu-toggles strong,.v220-menu-toggles small{display:block}.v220-menu-toggles strong{font-size:8px}.v220-menu-toggles small{margin-top:2px;color:#8a989d;font-size:6.8px}

/* Dark */
html[data-theme="dark"]{
    --hub-surface:rgba(32,42,48,.95);--hub-line:rgba(152,178,190,.16)
}
html[data-theme="dark"] .v220-menu-trigger{background:linear-gradient(145deg,rgba(42,55,62,.94),rgba(31,42,48,.84));border-color:rgba(143,180,198,.22);color:#eef7fa;box-shadow:0 9px 25px rgba(0,0,0,.23)}
html[data-theme="dark"] .v220-hub-modal{background:rgba(29,39,45,.96);border-color:rgba(147,177,191,.19);box-shadow:0 35px 100px rgba(0,0,0,.5)}
html[data-theme="dark"] .v220-hub-head,html[data-theme="dark"] .v220-hub-footer{background:rgba(34,45,51,.95)}
html[data-theme="dark"] .v220-hub-orbit{background:radial-gradient(circle at 50% 48%,rgba(27,152,217,.18) 0 2px,transparent 3px),radial-gradient(circle at 50% 48%,transparent 0 92px,rgba(41,160,221,.13) 93px 94px,transparent 95px 160px,rgba(41,160,221,.08) 161px 162px,transparent 163px),radial-gradient(circle at 50% 48%,rgba(45,57,64,.9),rgba(32,43,49,.35) 62%,transparent 63%)}
html[data-theme="dark"] .v220-hub-node,html[data-theme="dark"] .v220-create-action,html[data-theme="dark"] .v220-organize-grid>a,html[data-theme="dark"] .v220-feature-grid>a{background:rgba(40,52,59,.92);border-color:rgba(141,174,190,.16);color:#eef5f7;box-shadow:0 14px 34px rgba(0,0,0,.23)}
html[data-theme="dark"] .v220-panel-intro>span{color:#eef5f7}html[data-theme="dark"] .v220-panel-intro p,html[data-theme="dark"] .v220-hub-node small{color:#9dafb7}
html[data-theme="dark"] .v220-theme-inline{background:rgba(38,50,57,.72)}html[data-theme="dark"] .v220-theme-inline button{background:#2a383f;color:#c7d4d9;border-color:rgba(145,174,188,.16)}
html[data-theme="dark"] .v220-style-picker span,html[data-theme="dark"] .v220-menu-toggles label{background:#27363d;border-color:#3b4d55;color:#eef5f7}

@media(max-width:1100px){
    .v220-organize-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:820px){
    .v220-hub-trigger-desktop,.v220-classic-desktop-nav{display:none!important}
    .v220-topbar{padding-left:12px;padding-right:12px}
    .v220-brand{margin-right:auto}
    .v220-wordmark strong{font-size:10px}.v220-wordmark small{font-size:6px}
    .v220-top-actions{gap:3px}.v220-top-actions .v21-icon-button{width:37px;height:37px}

    body:not([data-menu-mobile="classic"]) .v220-mobile-menu-dock{
        position:fixed;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));z-index:92;display:block;transform:translateX(-50%)
    }
    .v220-mobile-menu-dock button{
        min-width:126px;height:52px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(124,163,182,.26);border-radius:17px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(238,247,251,.91));color:#173643;box-shadow:0 13px 36px rgba(18,60,80,.19);font-size:11px;font-weight:900;backdrop-filter:blur(20px)
    }
    .v220-mobile-menu-dock .apm-icon{width:20px;height:20px;color:#0d89cf}
    body[data-menu-mobile="classic"] .v220-classic-mobile-dock{display:grid}
    body[data-menu-mobile="classic"] .v220-mobile-menu-dock{display:none}
    body:not([data-menu-mobile="classic"]){padding-bottom:calc(74px + env(safe-area-inset-bottom))}

    .v220-hub-modal{width:calc(100vw - 16px);max-height:calc(100dvh - 18px);border-radius:20px}
    .v220-hub-body{padding:12px}.v220-hub-panel{min-height:510px}
    .v220-hub-orbit{width:100%;height:500px}
    .v220-hub-center{width:82px;height:82px}
    .v220-hub-node{width:116px;min-height:78px;grid-template-columns:28px 1fr;padding:9px;border-radius:15px}
    .v220-hub-node .apm-icon{width:25px;height:25px}.v220-hub-node strong{font-size:9px}.v220-hub-node small{font-size:6px}
    .v220-node-create{top:12px}.v220-node-organize{left:2px;top:42%}.v220-node-apps{right:2px;top:42%}.v220-node-customize{left:32px;bottom:28px}.v220-node-system{right:32px;bottom:28px}
    .v220-create-ring{width:330px;height:430px;max-width:100%}.v220-create-action{width:88px;height:88px}.v220-create-center{width:78px;height:78px}.action-event{right:2px;top:72px}.action-finance{right:2px;bottom:72px}.action-project{left:2px;bottom:72px}.action-routine{left:2px;top:72px}
    .v220-organize-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v220-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .v220-style-columns{grid-template-columns:1fr}.v220-menu-toggles{grid-template-columns:1fr}.v220-menu-options{grid-template-columns:1fr}
}

@media(max-width:420px){
    .v220-wordmark em{font-size:9px}.v220-top-actions .v21-icon-button{width:34px;height:34px}
    .v220-hub-node{width:105px}.v220-node-customize{left:12px}.v220-node-system{right:12px}
    .v220-organize-grid,.v220-feature-grid{grid-template-columns:1fr 1fr}
    .v220-hub-modal[data-active-style="compact"] .v220-create-ring{grid-template-columns:repeat(2,1fr)}
}