/* Self-hosted A-Town webfonts via @fontsource (replaces the design skill's
   CDN tokens/fonts.css — a desktop app must not depend on Google Fonts).
   Bebas Neue ships 400 only (the system forbids synthetic-bolding it). */
/* bebas-neue-latin-ext-400-normal */
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./bebas-neue-latin-ext-400-normal-DWiEslNC.woff2) format('woff2'), url(./bebas-neue-latin-ext-400-normal-HFKRJXnW.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* bebas-neue-latin-400-normal */
@font-face {
  font-family: 'Bebas Neue';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./bebas-neue-latin-400-normal-9mHNbWWO.woff2) format('woff2'), url(./bebas-neue-latin-400-normal-Bi-ndsyu.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-cyrillic-ext-400-normal-BQZuk6qB.woff2) format('woff2'), url(./inter-cyrillic-ext-400-normal-DQukG94-.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}
/* inter-cyrillic-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-cyrillic-400-normal-obahsSVq.woff2) format('woff2'), url(./inter-cyrillic-400-normal-HOLc17fK.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* inter-greek-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-greek-ext-400-normal-DGGRlc-M.woff2) format('woff2'), url(./inter-greek-ext-400-normal-KugGGMne.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}
/* inter-greek-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-greek-400-normal-B4URO6DV.woff2) format('woff2'), url(./inter-greek-400-normal-q2sYcFCs.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}
/* inter-vietnamese-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-vietnamese-400-normal-DMkecbls.woff2) format('woff2'), url(./inter-vietnamese-400-normal-Bbgyi5SW.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* inter-latin-ext-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-latin-ext-400-normal-C1nco2VV.woff2) format('woff2'), url(./inter-latin-ext-400-normal-77YHD8bZ.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* inter-latin-400-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./inter-latin-400-normal-C38fXH4l.woff2) format('woff2'), url(./inter-latin-400-normal-CyCys3Eg.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-cyrillic-ext-500-normal-B0yAr1jD.woff2) format('woff2'), url(./inter-cyrillic-ext-500-normal-BmqWE9Dz.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}
/* inter-cyrillic-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-cyrillic-500-normal-BasfLYem.woff2) format('woff2'), url(./inter-cyrillic-500-normal-CxZf_p3X.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* inter-greek-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-greek-ext-500-normal-C4iEst2y.woff2) format('woff2'), url(./inter-greek-ext-500-normal-2j5mBUwD.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}
/* inter-greek-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-greek-500-normal-BIZE56-Y.woff2) format('woff2'), url(./inter-greek-500-normal-Xzm54t5V.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}
/* inter-vietnamese-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-vietnamese-500-normal-DOriooB6.woff2) format('woff2'), url(./inter-vietnamese-500-normal-mJboJaSs.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* inter-latin-ext-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-latin-ext-500-normal-CV4jyFjo.woff2) format('woff2'), url(./inter-latin-ext-500-normal-BxGbmqWO.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* inter-latin-500-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./inter-latin-500-normal-Cerq10X2.woff2) format('woff2'), url(./inter-latin-500-normal-BL9OpVg8.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* inter-cyrillic-ext-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-cyrillic-ext-600-normal-Dfes3d0z.woff2) format('woff2'), url(./inter-cyrillic-ext-600-normal-Bcila6Z-.woff) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}
/* inter-cyrillic-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-cyrillic-600-normal-CWCymEST.woff2) format('woff2'), url(./inter-cyrillic-600-normal-4D_pXhcN.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* inter-greek-ext-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-greek-ext-600-normal-DRtmH8MT.woff2) format('woff2'), url(./inter-greek-ext-600-normal-B8X0CLgF.woff) format('woff');
  unicode-range: U+1F00-1FFF;
}
/* inter-greek-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-greek-600-normal-plRanbMR.woff2) format('woff2'), url(./inter-greek-600-normal-BZpKdvQh.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}
/* inter-vietnamese-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-vietnamese-600-normal-Cc8MFFhd.woff2) format('woff2'), url(./inter-vietnamese-600-normal-BuLX-rYi.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* inter-latin-ext-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-latin-ext-600-normal-D2bJ5OIk.woff2) format('woff2'), url(./inter-latin-ext-600-normal-CIVaiw4L.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* inter-latin-600-normal */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 600;
  src: url(./inter-latin-600-normal-LgqL8muc.woff2) format('woff2'), url(./inter-latin-600-normal-CiBQ2DWP.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* jetbrains-mono-cyrillic-ext-400-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(data:font/woff2;base64,d09GMgABAAAAAASIABAAAAAACQQAAAQuAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhwbHhwoBmA/U1RBVF4AdBEICoRkhAALIAABNgIkAzoEIAWFAAeBFAwHG2oHKJ6DceNW4lJEFHn9tEOE37LNsvkjHr7f739rn3u+OSrSxLQytE91Dw2PYtNVq3Qaw/vJ7fUBMdOj/u2ImB98cT5WUx9F13ZKt06mU7tG1sAYcM26yCRX4f/0904bmwq8hwkUUMTRX61pa9C3xlpAGYw1vOu8C2SBZZFlld7DAW82RJWmwYMI1AJCKBNCIASqdZGFmtPSNQRhMpR0EKjWTwm6z6sJ+4jqhxjovTinVdRpZaQjaQzAYjI8NgAKDJCokgunCn9oUQE8VZd/F//+v6P4F1U9gLr58yNI/dJX9BAshEoJbTDogz7ocKoUsPvES8UK/aQIUQgpGgECBVLkOEV6iASTYgNAPKdNXayhDPL7IJuAZnEYSZ0eOLc9i5Rv5/+lEi3sW/kfnCf/+fTe0sxS7CKLx5erRJkKOixEqQaoqrvx5HN4iz4VhX0gS6DjFIWUzn/fIXJRVFY1NFRVNVeFt+SYmrK6vCU6eJsnKnJj5HTESMTQZOTI3Y/tzr3rUcOsiRy/ciP50s3Mycgxmhz9GMXhjzVH30ut796NHP0UUa31/Zoa6vCH6iPvdIM0IRANaT60FablmZlZd+UKNFy9NrvnFGxb5NC2CRxR0/rIyF/WNn+35sv9r+tHVhkseuWGKkCPPh96+GXt8Lc/Sh24ujfjf+tNw1lZWreiPuHb/PSpyjdv2rf/++ZE5TSKjFdZxYsBvr1sEHl5STuHZqYR7jGYGvGBBdjcaB5bODY1GAxMjsd0wDMIzXAXODRd74DxNMtO4YuYHclgLQRzp9KlUmxptCwv9bYgvWGD2xBW7r9413fdJu+mxzvzAUYeeONQvZP4kgfqZle4jhH/MWh+UbxgtJdrLdXLymNL53PRU0D3Q6FcXTfGqGcul6vrqhgLGAVSv+IVIfZOHpu+mlLqSlnj903j8mazXDsba/wbxhS/4Oubh1c5/uXDgt4j5KtnGEy5BIJHo0ur+jD+r2qCkuP1aRVM8EpUoRYSJyqNRA38uwDvHBNo0AejO2Z+ZYLLal1QiFyFh1EDQOgSCSCpjwwKU8yDbIjroEwne0G5Qca49cYp4AlqtQNZfWTQoFb1tRpFYAmRD+HXTkV4uQhG2bg4OKmyoypAsUGtWgQXyFxYrkpODeUxvGqIZA61erXo0sFG1UBGuPgpuon8RNUG2DhovAjZCBuZwtXrU3mQGki9+pm0eVZAXoWxLWTQoYHBPrJR4WunNxIFbCHfkTyPK+sqxjxDmGArZvf79JGJ3GwEqjwc7a7NIrl/7bJ7Nzu4+n1Ow6shEPnUrtVo7cnd5Wi5qCUbBIQbNKCP95FMCSZylEV5VCiiMqqiOmrKZ/I/C0gI1fyuulVcM2E1r4MhtcV/fbCD+HwEvVzH1dGNAzFE0FTbKzyQz3gootrNbN2a4PuG0j0JOgE=) format('woff2'), url(data:font/woff;base64,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) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}
/* jetbrains-mono-cyrillic-400-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./jetbrains-mono-cyrillic-400-normal-BEIGL1Tu.woff2) format('woff2'), url(./jetbrains-mono-cyrillic-400-normal-ugxPyKxw.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* jetbrains-mono-greek-400-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./jetbrains-mono-greek-400-normal-C190GLew.woff2) format('woff2'), url(./jetbrains-mono-greek-400-normal-B9oWc5Lo.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}
/* jetbrains-mono-vietnamese-400-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(data:font/woff2;base64,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) format('woff2'), url(./jetbrains-mono-vietnamese-400-normal-CqNFfHCs.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* jetbrains-mono-latin-ext-400-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./jetbrains-mono-latin-ext-400-normal-Bc8Ftmh3.woff2) format('woff2'), url(./jetbrains-mono-latin-ext-400-normal-fXTG6kC5.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* jetbrains-mono-latin-400-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./jetbrains-mono-latin-400-normal-V6pRDFza.woff2) format('woff2'), url(./jetbrains-mono-latin-400-normal-6-qcROiO.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* jetbrains-mono-cyrillic-ext-500-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(data:font/woff2;base64,d09GMgABAAAAAASUABAAAAAACRAAAAQ3AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGhwbHhwoBmA/U1RBVEwAdBEICoRkg3oLIAABNgIkAzoEIAWFHgeBFAwHG3AHKB4HzukrRjyF5Gb4kQ/B873d17mv8TWkoqUUGaHodJCtoqntw7m8tiPWyGkfWDU/IMpzVk4zAs9Czv3c7Os5NvKFG1Ht9vBVXySRZpJc4tTrbM3sTRFcLa3zVboKWRIoAksKSKgqUQWEwlSoqjp44V5J9/kjd0+Fi5xaFjwJArgBAIJgIAgCCAI4CdNMqGuYXYUKdADLAkAAJwl6iX0+bZqEm1AH0Hu9rvrJHwxQG1Q/gFYwWYbgTRWgwEESVzbmtjQAt3DXO7Tu/+9Q/KNKWhTCgZ8fQSWoL0CUUgTBjgL8iEAcce7YHBeA8ZvogieCnxI0BCVeACCAAhBD/oDcAdUPABSgAX4kBPBTwjCAjwYSCneiqF65LUo/qXdYFrRwTujtMrKm07plTbSqLQFAiHBN7E4DG5wkiGXhCYBNETh3K/AciHN69iFfQjFOr9EXQQAAQXRNszs8PR0OH4fDV/dwGe76CHdj1MQa11DXYGcfZ6+B1X0OfwjY+i7KpQ1w9d+1z3/HydCB1f3U8A0fRFv+0bXxPWrZu3d9Nn4UcbLs/QCXLH/j3PCKblKOiZxLOR78W9brPo7eGTLz/F27ZPmePQdCB1YP4nJU91o4gU9cy64L3c3SPu8GfDn6ZXD2cGmllVqSxtD5vCXHm5xaeHlnpffx7DcPvXog5NnjA//cPz2btsz3yf+0MI8ri33tuv7upNbYmW5STbosW8bYItV/SPzxvXC0KnpWnFdC91oojit5Lyo6WcJQ1YzwBYbi52ohJVpcxfcHBqsv0nFz8U74rzS6M7r0RVlXZ3jJC4G92O//7Lm78VOtnUx+aQxAzsqPnrRr1t9zDrezKePvZ027x+fGte4s4NXu7/jEp3G9cM1bICYgACbuETUUD5wmenGXA/IBpAKVrl0AEJ5cqr6Q89tGq+SpqkDfX2DtG+pZ9teuae0AX98c301CX179InyErnSG8WCiABB4HFbVrw/lpTdBIOk82nXbpHKoQGyBpUovAAD4XQA8ZTUCeBJHIpI0v0FRrgcnckV3ANckrwYJKXEihQfdSKPER6XeExmEeEMmSe6QBwWmkZdmSOSthhibgIkBlUYreBKd/0NeVAE9WAyEaQpH6KikDWlUVg43Jy2FOmaYlsZhDEGZXO3mWEyWHI6zuaJkMlcSQ9k4F+KidIiFyZItGDc7r1pUj6wP6zrWB0/fbeeFeHl4YOvETMNiM8Ny+7OO6Qh2wur20YVxFts5dlORdl5Kwd5utR7SRcxqX8RA5Ehacha76hg7c6yzNm/Xf6vOLNrv544lIEkWg7xWo/ItBAeIJEmt0XgBwgM8gTifoiiLJroYYooNTeziEKe4zOoR/wvIKp89hSr+6jFAqw/LaonjmZHSscMNg4iPlWpFrO1RN3zkMU+/xUP+JQ99TbvTl1Vg0gtirT6lbwYAAAA=) format('woff2'), url(data:font/woff;base64,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) format('woff');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}
/* jetbrains-mono-cyrillic-500-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./jetbrains-mono-cyrillic-500-normal-DmUKJPL_.woff2) format('woff2'), url(./jetbrains-mono-cyrillic-500-normal-DJqRU3vO.woff) format('woff');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
/* jetbrains-mono-greek-500-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./jetbrains-mono-greek-500-normal-JpySY46c.woff2) format('woff2'), url(./jetbrains-mono-greek-500-normal-D7SFKleX.woff) format('woff');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}
/* jetbrains-mono-vietnamese-500-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(data:font/woff2;base64,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) format('woff2'), url(./jetbrains-mono-vietnamese-500-normal-DNRqzVM1.woff) format('woff');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}
/* jetbrains-mono-latin-ext-500-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./jetbrains-mono-latin-ext-500-normal-Cut-4mMH.woff2) format('woff2'), url(./jetbrains-mono-latin-ext-500-normal-ckzbgY84.woff) format('woff');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
/* jetbrains-mono-latin-500-normal */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url(./jetbrains-mono-latin-500-normal-BWZEU5yA.woff2) format('woff2'), url(./jetbrains-mono-latin-500-normal-CJOVTJB7.woff) format('woff');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* A-Town token index. fonts.css (Google Fonts CDN) is intentionally NOT
   imported — DISPATCH self-hosts via @fontsource (see ../fonts.css). */
/* ── A-Town Enterprises · Color tokens ─────────────────────────────────────
   Dark-first. Near-black canvas, warm cream ink, gold = crown authority,
   lime = action. Values lifted verbatim from the A-Town codebases. */
:root {
  /* base — canvas & surfaces */
  --at-black:      #0d0e0a;   /* the A-Town black (warm, near-black) */
  --at-panel:      #121419;
  --at-surface-1:  #16181d;
  --at-surface-2:  #1d2026;
  --at-line:       #2a2e36;
  --at-border-dim: #262a32;

  /* base — cream ink */
  --at-cream: #f4ede0;   /* ink on dark; sticker-card surface */
  --at-dim:   #8a8f9c;
  --at-faint: #565b66;

  /* brand accents */
  --at-gold: #E9A83A;   /* CROWN — authority, rank, premium, official */
  --at-lime: #C6FF3D;   /* ACTION — CTAs, progress, activation */
  --at-hot:  #FF4FA3;   /* hype — drops, wins, alerts (rare) */
  --at-iris: #8E7BFF;   /* secondary accent (rare) */
  --at-clay: #E07A5F;   /* secondary accent (rare) */
  --at-mint: #3FE0A6;   /* success / ok */
  --at-red:  #E2533F;   /* error / wrong */

  /* semantic aliases */
  --bg-app:            var(--at-black);
  --surface-panel:     var(--at-panel);
  --surface-raised:    var(--at-surface-1);
  --surface-raised-2:  var(--at-surface-2);
  --surface-card:      var(--at-cream);    /* the cream "pass" card */
  --text-body:         var(--at-cream);
  --text-dim:          var(--at-dim);
  --text-faint:        var(--at-faint);
  --text-on-card:      var(--at-black);
  --text-on-accent:    var(--at-black);
  --border-line:       var(--at-line);
  --border-ink:        var(--at-black);    /* the hard 2px border color */
  --accent-action:     var(--at-lime);
  --accent-crown:      var(--at-gold);
}
/* ── A-Town Enterprises · Type tokens ─────────────────────────────────────
   Display: Bebas Neue (400 only — NEVER synthetic-bold it).
   Body/UI: Inter. System text: JetBrains Mono. Hype scrawl: Permanent Marker.
   Editorial serif (rare): Instrument Serif. */
:root {
  --font-display: 'Bebas Neue', 'Anton', sans-serif;
  --font-display-alt: 'Anton', 'Bebas Neue', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --font-marker: 'Permanent Marker', cursive;
  --font-hand: 'Caveat', cursive;
  --font-serif: 'Instrument Serif', Georgia, serif;

  /* display scale — tight leading, slight tracking, ALWAYS uppercase */
  --display-hero-size: 72px;      /* landing hero */
  --display-xl-size: 46px;        /* page titles */
  --display-lg-size: 28px;        /* card / modal titles */
  --display-md-size: 22px;        /* section headers */
  --display-leading: 0.92;
  --display-tracking: 0.01em;

  /* body */
  --body-size: 14px;
  --body-lg-size: 15px;
  --body-sm-size: 12.5px;
  --body-leading: 1.5;

  /* mono micro-label — uppercase, wide tracking */
  --label-size: 10px;
  --label-tracking: 0.18em;
  --label-weight: 600;
}
/* ── A-Town Enterprises · Spacing ─────────────────────────────────────────
   Loose 2px base; real components use exact values (e.g. 14px card padding,
   36px 34px 30px login card). These are the common stops. */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-9: 36px;
  --space-12: 48px;

  /* component-specific stops used across products */
  --pad-card: 14px;
  --pad-card-lg: 24px;
  --pad-btn: 10px 20px;
  --pad-btn-lg: 14px 26px;
  --pad-input: 12px 14px;
}
/* ── A-Town Enterprises · Borders, shadows, radii, motion, texture ─────── */
:root {
  /* hard offset shadows — THE A-Town depth system. No blur, ever. */
  --shadow-hard-xs: 2px 2px 0 var(--at-black);
  --shadow-hard-sm: 3px 3px 0 var(--at-black);
  --shadow-hard-md: 4px 4px 0 var(--at-black);
  --shadow-hard-lg: 8px 8px 0 var(--at-black);
  --shadow-hard-action: 8px 8px 0 var(--at-lime);   /* hero cards */
  --shadow-hard-crown: 4px 4px 0 var(--at-gold);

  /* hard borders */
  --border-hard: 2px solid var(--at-black);
  --border-hard-thin: 1.5px solid var(--at-black);
  --border-dark-line: 1px solid var(--at-line);

  /* radii — sharp-ish. Pills only for buttons/chips. */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 10px;
  --radius-xl: 14px;
  --radius-pill: 999px;

  /* motion — quick, decisive; hover = lift up-left, shadow grows */
  --ease-snap: cubic-bezier(0.2, 0.8, 0.4, 1);
  --speed-fast: 0.12s;
  --speed-base: 0.15s;

  /* canvas texture — 14px dot grid + corner glows */
  --texture-dots: radial-gradient(circle at 1px 1px, var(--dots) 1px, transparent 0);
  --texture-dots-size: 14px 14px;
  --glow-gold: radial-gradient(circle at 12% 8%, rgba(233, 173, 20, 0.10), transparent 42%);
  --glow-hype: radial-gradient(circle at 88% 92%, rgba(255, 79, 163, 0.08), transparent 42%);
}
/* ── DISPATCH BY A-TOWN — app chrome ─────────────────────────────────────
   Everything brand-valued comes from the token custom properties.
   Depth = hard offset shadows only (x=y, zero blur). */

:root {
  /* dot for --texture-dots (tokens/effects.css leaves --dots to the app) */
  --dots: color-mix(in srgb, var(--at-cream) 5%, transparent);
  /* input surface on cream cards — never pure #fff */
  --input-bg: color-mix(in srgb, var(--at-cream) 55%, white);
  /* chrome metrics */
  --titlebar-h: 52px;
  --teamrail-w: 72px;
  --agentstrip-w: 224px;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body,
#root {
  height: 100%;
}

body {
  background-color: var(--bg-app);
  background-image: var(--texture-dots);
  background-size: var(--texture-dots-size);
  color: var(--text-body);
  font-family: var(--font-body);
  font-size: var(--body-size);
  line-height: var(--body-leading);
  overflow: hidden;
  user-select: none;
  -webkit-font-smoothing: antialiased;
}

::selection {
  background: var(--at-lime);
  color: var(--at-black);
}

:focus-visible {
  outline: 2px solid var(--at-lime);
  outline-offset: 2px;
}

/* scrollbars tuned to the control room */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: var(--at-line);
  border-radius: 0;
  border: 2px solid var(--bg-app);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--at-faint);
}
::-webkit-scrollbar-corner {
  background: transparent;
}

img {
  max-width: 100%;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
}

input,
textarea,
select {
  font: inherit;
}

/* ── shared type utilities ─────────────────────────────────────────────── */

.display {
  font-family: var(--font-display);
  font-weight: 400; /* Bebas is 400-only — never synthetic-bold */
  text-transform: uppercase;
  line-height: var(--display-leading);
  letter-spacing: var(--display-tracking);
}

.label-mono {
  font-family: var(--font-mono);
  font-size: var(--label-size);
  font-weight: 500; /* 500 is the heaviest self-hosted mono weight */
  letter-spacing: var(--label-tracking);
  text-transform: uppercase;
}

/* system text: authored lowercase ("quick · clean · your move.") — no
   text-transform so canonical straplines keep their casing */
.sys-mono {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.08em;
}

/* ── buttons ───────────────────────────────────────────────────────────── */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: var(--radius-pill);
  border: 2px solid var(--border-ink);
  font-family: var(--font-display);
  font-weight: 400;
  text-transform: uppercase;
  font-size: 16px;
  letter-spacing: 0.04em;
  line-height: 1;
  padding: var(--pad-btn);
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap),
    background var(--speed-fast) var(--ease-snap);
}
.btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.btn-action {
  background: var(--accent-action);
  color: var(--text-on-accent);
  box-shadow: var(--shadow-hard-sm);
}
.btn-action:hover:not(:disabled) {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-md);
}
.btn-action:active:not(:disabled) {
  transform: translate(0, 0);
  box-shadow: var(--shadow-hard-sm);
}

/* ghost on a cream card */
.btn-ghost-card {
  background: transparent;
  color: var(--text-on-card);
  box-shadow: none;
}
.btn-ghost-card:hover:not(:disabled) {
  background: color-mix(in srgb, var(--at-black) 8%, transparent);
}
.btn-ghost-card:active:not(:disabled) {
  background: color-mix(in srgb, var(--at-black) 14%, transparent);
}

/* ghost on dark chrome */
.btn-ghost-dark {
  background: transparent;
  color: var(--text-body);
  border-color: var(--border-line);
}
.btn-ghost-dark:hover:not(:disabled) {
  background: color-mix(in srgb, var(--at-cream) 9%, transparent);
}
.btn-ghost-dark:active:not(:disabled) {
  background: color-mix(in srgb, var(--at-cream) 14%, transparent);
}

/* gold outline — authority, not action: PARK SESSION (never lime — that's
   reserved for primary CTAs like NEW SESSION / SEND HANDOVER). */
.btn-crown-outline {
  background: transparent;
  color: var(--accent-crown);
  border-color: var(--accent-crown);
}
.btn-crown-outline:hover:not(:disabled) {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-crown);
}
.btn-crown-outline:active:not(:disabled) {
  transform: translate(0, 0);
  box-shadow: none;
}

/* ── chips / badges ────────────────────────────────────────────────────── */

.chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: var(--radius-pill);
  padding: 3px 10px;
  white-space: nowrap;
}
.chip-runtime {
  border: 1px solid var(--border-line);
  background: var(--surface-raised);
  color: var(--text-dim);
}
.chip-crown {
  border: 1px solid var(--accent-crown);
  color: var(--accent-crown);
  background: transparent;
}

/* step 9: PolicyControl chip is an actual button (guarded/auto neutral,
   full send reuses chip-crown — gold marks authority/danger, not routine ops) */
.chip-clickable {
  cursor: pointer;
  transition:
    transform var(--speed-fast) var(--ease-snap),
    background var(--speed-fast) var(--ease-snap);
}
.chip-clickable:hover {
  transform: translate(-1px, -1px);
}

/* issue 4: PolicyControl's "· inherited" hint sits OUTSIDE the uppercase
   .label-mono chip on purpose — text-transform inherits, and system-text hints
   stay lowercase per the design language (never nest inside the chip button). */
.chip-inherited-hint {
  color: var(--text-faint);
}

/* ── cream pass card ───────────────────────────────────────────────────── */

.pass-card {
  background: var(--surface-card);
  color: var(--text-on-card);
  border: var(--border-hard);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-hard-md);
}

/* ── crown-A plate chip (logo on dark always sits on a cream plate) ────── */

.logo-plate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--surface-card);
  border: var(--border-hard);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-hard-xs);
  flex: none;
}
.logo-plate img {
  display: block;
  width: 68%;
  height: 68%;
  object-fit: contain;
}

/* ── sub-brand lockup ──────────────────────────────────────────────────── */

.lockup {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}
.lockup-name {
  color: var(--text-body);
}
.lockup-by {
  color: var(--accent-crown);
  font-family: var(--font-mono);
  font-size: var(--label-size);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}

/* ── form fields (live on cream cards) ─────────────────────────────────── */

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.field-label {
  color: var(--text-on-card);
  opacity: 0.75;
}
.field-input,
.field-textarea {
  background: var(--input-bg);
  border: var(--border-hard);
  border-radius: var(--radius-sm);
  padding: var(--pad-input);
  color: var(--text-on-card);
  width: 100%;
}
.field-input::placeholder,
.field-textarea::placeholder {
  color: var(--text-faint);
}
.field-textarea {
  resize: vertical;
  min-height: 84px;
  line-height: 1.45;
}
.field-error {
  color: var(--at-red);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.06em;
  text-transform: lowercase;
}
/* neutral mono hint inside a cream-card field — no error connotation, e.g.
   CreateAgentModal's ollama MODEL picker "no local models…" state. */
.field-hint {
  color: color-mix(in srgb, var(--text-on-card) 55%, transparent);
}

/* switch — pill track, lime when on */
.switch {
  position: relative;
  width: 46px;
  height: 24px;
  border-radius: var(--radius-pill);
  border: 2px solid var(--border-ink);
  background: var(--input-bg);
  transition: background var(--speed-fast) var(--ease-snap);
  flex: none;
}
.switch::after {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--at-black);
  transition: transform var(--speed-fast) var(--ease-snap);
}
.switch[aria-checked='true'] {
  background: var(--accent-action);
}
.switch[aria-checked='true']::after {
  transform: translateX(22px);
}

/* ── app shell grid ────────────────────────────────────────────────────── */

.app-shell {
  display: grid;
  height: 100vh;
  grid-template-rows: var(--titlebar-h) 1fr;
  grid-template-columns: var(--teamrail-w) var(--agentstrip-w) 1fr;
}

/* ── TitleBar ──────────────────────────────────────────────────────────── */

.titlebar {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px 0 12px;
  background: var(--surface-panel);
  border-bottom: var(--border-dark-line);
}
.titlebar-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.titlebar-right {
  display: flex;
  align-items: center;
  gap: 14px;
  color: var(--text-faint);
}

/* mono, gear-less — step 9 SettingsPanel toggle */
.titlebar-settings-btn {
  padding: 5px 12px;
  border: 1px solid var(--border-line);
  border-radius: var(--radius-pill);
  color: var(--text-dim);
  transition:
    background var(--speed-fast) var(--ease-snap),
    color var(--speed-fast) var(--ease-snap);
}
.titlebar-settings-btn:hover {
  background: color-mix(in srgb, var(--at-cream) 9%, transparent);
  color: var(--text-body);
}

/* ── TeamRail ──────────────────────────────────────────────────────────── */

.team-rail {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 14px 0;
  background: var(--surface-panel);
  border-right: var(--border-dark-line);
  overflow-y: auto;
  overflow-x: hidden;
}
.team-rail-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  flex: 1;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  /* Vertical padding must clear the active tile's outline ring (outline-width
     2px + outline-offset 2px = 4px extension beyond the tile's own border box,
     see .team-tile.is-active below) PLUS its 1px hover lift (translate(-1px,-1px)).
     This list is its own overflow-y:auto clip box (distinct from .team-rail's),
     so anything a first/last child's ring pokes above/below its own padding box
     gets clipped — found live: 2px top padding cut the top (and visually the
     top-left corner of the left edge) off team 1's ring whenever it was active,
     the FIRST child ever having only that thin 2px of clearance above it,
     while every other tile has the full 12px flex gap for the same clearance. */
  padding: 6px 0 6px;
}

.team-tile {
  width: 48px;
  height: 48px;
  flex: none;
  border: var(--border-hard);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-hard-xs);
  background: var(--surface-card);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap);
}
.team-tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.team-tile-initial {
  font-family: var(--font-display);
  font-size: 26px;
  text-transform: uppercase;
  color: var(--text-on-card);
}
.team-tile:hover {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-sm);
}
.team-tile:active {
  transform: translate(0, 0);
  box-shadow: var(--shadow-hard-xs);
}
.team-tile.is-active {
  /* gold ring = the crown marks the seat you hold */
  outline: 2px solid var(--accent-crown);
  outline-offset: 2px;
}
.team-tile.is-active:focus-visible {
  outline-color: var(--at-lime);
}

.rail-add {
  width: 40px;
  height: 40px;
  flex: none;
  border: 2px solid var(--border-ink);
  border-radius: var(--radius-md);
  background: var(--accent-action);
  color: var(--text-on-accent);
  box-shadow: var(--shadow-hard-xs);
  font-size: 20px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap);
}
.rail-add:hover {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-sm);
}
.rail-add:active {
  transform: translate(0, 0);
  box-shadow: var(--shadow-hard-xs);
}

.team-skeleton {
  width: 48px;
  height: 48px;
  flex: none;
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  animation: skeleton-pulse 1.1s ease-in-out infinite alternate;
}
@keyframes skeleton-pulse {
  from {
    opacity: 0.45;
  }
  to {
    opacity: 1;
  }
}

/* ── AgentStrip ────────────────────────────────────────────────────────── */

.agent-strip {
  display: flex;
  flex-direction: column;
  background: var(--surface-raised);
  border-right: var(--border-dark-line);
  min-height: 0;
}
.agent-strip-head {
  padding: 14px 14px 10px;
  color: var(--text-faint);
  border-bottom: var(--border-dark-line);
}
.agent-strip-list {
  flex: 1;
  overflow-y: auto;
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-height: 0;
}
.agent-strip-foot {
  padding: 10px;
  border-top: var(--border-dark-line);
}
.agent-strip-hint {
  padding: 14px;
  color: var(--text-faint);
}

.agent-row {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  text-align: left;
  transition: background var(--speed-fast) var(--ease-snap);
}
.agent-row:hover {
  background: color-mix(in srgb, var(--at-cream) 7%, transparent);
}
.agent-row.is-active {
  background: var(--surface-raised-2);
  border-color: var(--border-line);
}
.agent-row-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
  color: var(--text-body);
}

.avatar {
  flex: none;
  border-radius: 50%;
  border: var(--border-hard);
  background: var(--surface-card);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.avatar-initial {
  font-family: var(--font-display);
  text-transform: uppercase;
  color: var(--text-on-card);
}
.avatar.is-active {
  outline: 2px solid var(--accent-crown);
  outline-offset: 1px;
}

.new-agent-btn {
  width: 100%;
  font-size: 15px;
  padding: 8px 16px;
}

/* ── WorkspaceView ─────────────────────────────────────────────────────── */

.workspace {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.agent-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px 12px;
  /* REAL BUG found in polish pass: FilesDrawer/RoutinesPanel are
     position:fixed, top:var(--titlebar-h), right:0, z-index:65 — the exact
     top-right corner the agent-header (and its right-aligned action row:
     SWITCH MODEL, FILES, ROUTINES, HANDOVER/PARK) already occupies. Without
     an explicit stacking context here, the header had no z-index of its own
     (auto = 0), so an open drawer fully covered it — every one of those
     buttons became unreachable, including the OTHER drawer's own toggle, the
     one control a user would need to switch FILES <-> ROUTINES without
     closing first. Same "reserved space vs. z-index fight" lesson as
     .chat-input-row's crew-btn clearance below, applied the other way: here
     the PERMANENT control (the header) needs to win the fight, since it owns
     controls (the other drawer's toggle, SWITCH MODEL, HANDOVER/PARK) a user
     legitimately needs while a drawer is open. z-index 70 (above the
     drawers' 65) + an opaque background (flat var(--bg-app), matching what
     already shows through here — nested surfaces in this file never re-add
     --texture-dots, that's a page-level-only decoration, see body/.gate) so
     the drawer visibly slides in UNDER the header instead of over it. */
  position: relative;
  z-index: 70;
  background: var(--bg-app);
}
.agent-header-name {
  font-size: var(--display-xl-size);
  color: var(--text-body);
}
.agent-header-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
}
.agent-header-actions {
  margin-left: auto;
  flex: none;
  /* REAL BUG found in polish pass: no display:flex/gap here meant this row's
     children (PolicyControl's chip, SwitchControl's button, FILES, ROUTINES,
     HandoverControl/ParkControl) rendered edge-to-edge with ZERO pixel gap —
     verified via getBoundingClientRect: the policy chip's right edge and
     FILES's left edge were the exact same x, same for FILES→ROUTINES. Only
     invisible before now because SwitchControl/HandoverControl both return
     null with no session yet, so a freshly-created agent's header (the very
     first thing a user sees) showed "GUARDED · inherited" text running
     straight into the FILES pill's border with no breathing room. gap:12px
     matches .handover-control's own internal gap (this row sits directly
     beside it) and .toggle-row elsewhere in this file. */
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ── HandoverControl (step 8.5) ───────────────────────────────────────── */

.handover-control {
  display: flex;
  align-items: center;
  gap: 12px;
}
.handover-hint {
  color: var(--text-faint);
  white-space: nowrap;
}

/* ── FilesDrawer toggle (step 9) — mono micro-label button in the agent header ── */

.files-toggle-btn {
  padding: 5px 12px;
  border: 1px solid var(--border-line);
  border-radius: var(--radius-pill);
  color: var(--text-dim);
  transition:
    background var(--speed-fast) var(--ease-snap),
    color var(--speed-fast) var(--ease-snap);
}
.files-toggle-btn:hover {
  background: color-mix(in srgb, var(--at-cream) 9%, transparent);
  color: var(--text-body);
}
.files-toggle-btn[aria-expanded='true'] {
  border-color: var(--accent-action);
  color: var(--accent-action);
}

/* ── FilesDrawer (step 9) — slides over the workspace, NOT a modal (no scrim) ── */

.files-drawer {
  position: fixed;
  top: var(--titlebar-h);
  right: 0;
  bottom: 0;
  /* above .crew-btn/.crew-panel (60) — the drawer's own footer controls sit in
     the same bottom-right corner CrewButton floats in; the drawer wins while open */
  z-index: 65;
  width: min(420px, 92vw);
  display: flex;
  flex-direction: column;
  background: var(--surface-panel);
  border-left: var(--border-dark-line);
  box-shadow: var(--shadow-hard-lg);
  animation: files-drawer-in var(--speed-base) var(--ease-snap);
}
@keyframes files-drawer-in {
  from {
    transform: translateX(100%);
  }
  to {
    transform: translateX(0);
  }
}
.files-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 12px;
  border-bottom: var(--border-dark-line);
}
.files-drawer-title {
  font-size: var(--display-md-size);
  color: var(--text-body);
}
.files-drawer-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 14px 16px;
}
.files-drawer-foot {
  padding: 12px 16px 16px;
  border-top: var(--border-dark-line);
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.files-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.files-list-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
  padding: 10px 12px;
  text-align: left;
  border: 1px solid var(--border-line);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap),
    background var(--speed-fast) var(--ease-snap);
}
.files-list-row:hover {
  background: var(--surface-raised-2);
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-xs);
}
.files-list-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--text-body);
}
.files-cap-over {
  border: 1px solid var(--at-red);
  color: var(--at-red);
}
.files-cap-meter {
  height: 5px;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--at-cream) 12%, transparent);
  overflow: hidden;
}
.files-cap-fill {
  height: 100%;
  background: var(--accent-action);
  transition: width var(--speed-base) var(--ease-snap);
}
.files-cap-fill.is-hot {
  background: var(--accent-crown);
}
.files-cap-fill.is-over {
  background: var(--at-red);
}
.files-cap-label {
  color: var(--text-faint);
}

/* editor state — mono textarea on a cream card, per the build brief */
.files-editor {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.files-editor-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.files-editor-back {
  font-size: 12px;
  padding: 5px 10px;
}
.files-editor-textarea {
  font-family: var(--font-mono);
  font-size: 12.5px;
  min-height: 320px;
  flex: 1;
}
.files-editor-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.files-regen-btn {
  align-self: flex-start;
  font-size: 14px;
  padding: 8px 16px;
}
.files-bridge-list {
  color: var(--text-dim);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

/* ── SettingsPanel (step 9) ───────────────────────────────────────────────── */

.settings-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-bottom: 16px;
  border-bottom: 1px solid color-mix(in srgb, var(--at-black) 14%, transparent);
}
.settings-section:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.settings-exe-row {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.settings-exe-row-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.settings-exe-resolved {
  color: color-mix(in srgb, var(--text-on-card) 65%, transparent);
  word-break: break-all;
}
.settings-exe-row-fields {
  display: flex;
  gap: 8px;
}
.settings-exe-row-fields .field-input {
  flex: 1;
}
.settings-reset-btn {
  font-size: 13px;
  padding: 8px 14px;
  flex: none;
}
.settings-hint {
  color: color-mix(in srgb, var(--text-on-card) 55%, transparent);
  margin-top: 3px;
}
.settings-datafolder-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.settings-datafolder-path {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: color-mix(in srgb, var(--text-on-card) 65%, transparent);
}

/* ── SessionTabs ───────────────────────────────────────────────────────── */

.session-tabs {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
.session-tabstrip {
  display: flex;
  align-items: flex-end;
  gap: 6px;
  padding: 6px 20px 0;
  border-bottom: var(--border-dark-line);
  overflow-x: auto;
}
.session-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid var(--border-line);
  border-bottom: none;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  background: var(--surface-raised);
  color: var(--text-dim);
  max-width: 220px;
  white-space: nowrap;
  transition: background var(--speed-fast) var(--ease-snap);
}
.session-tab:hover {
  background: var(--surface-raised-2);
}
.session-tab.is-active {
  /* active tab reads as the cream pass you're holding */
  background: var(--surface-card);
  color: var(--text-on-card);
  border: 2px solid var(--border-ink);
  border-bottom: none;
}
.session-tab-title {
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: var(--body-sm-size);
  font-weight: 500;
}
.session-tab-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: none;
}
.session-tab-dot.live {
  background: var(--accent-action);
}
.session-tab-dot.dormant {
  background: var(--text-faint);
}
.session-tab-dot.exited {
  background: var(--at-red);
}
.session-tab-close {
  flex: none;
  width: 16px;
  height: 16px;
  line-height: 1;
  font-size: 12px;
  border-radius: var(--radius-sm);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  opacity: 0.6;
}
.session-tab-close:hover {
  opacity: 1;
  background: color-mix(in srgb, var(--at-black) 12%, transparent);
}
.session-tab-add {
  flex: none;
  width: 28px;
  height: 28px;
  margin-bottom: 4px;
  border: 2px solid var(--border-ink);
  border-radius: var(--radius-sm);
  background: var(--accent-action);
  color: var(--text-on-accent);
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-hard-xs);
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap);
}
.session-tab-add:hover:not(:disabled) {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-sm);
}
.session-tab-add:active:not(:disabled) {
  transform: translate(0, 0);
  box-shadow: var(--shadow-hard-xs);
}
.session-tab-content {
  flex: 1;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ── EmptyState ────────────────────────────────────────────────────────── */

.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  text-align: center;
  padding: 40px;
  height: 100%;
}
.empty-state-title {
  font-size: var(--display-lg-size);
  color: var(--text-body);
}
.empty-state-msg {
  color: var(--text-dim);
  letter-spacing: 0.1em;
}

/* ── Modal ─────────────────────────────────────────────────────────────── */

.modal-scrim {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(8px); /* the ONLY sanctioned blur surface */
}
.modal-card {
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-hard-lg);
  width: min(480px, calc(100vw - 48px));
  max-height: calc(100vh - 64px);
  overflow-y: auto;
  padding: 28px 26px 24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.modal-title {
  font-size: var(--display-lg-size);
  color: var(--text-on-card);
}
.modal-close {
  flex: none;
  width: 28px;
  height: 28px;
  border: 2px solid var(--border-ink);
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-on-card);
  font-size: 13px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background var(--speed-fast) var(--ease-snap);
}
.modal-close:hover {
  background: color-mix(in srgb, var(--at-black) 8%, transparent);
}
.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 4px;
}

/* plain explanatory copy inside a modal (e.g. HANDOVER) — muted ink on cream */
.modal-copy {
  color: color-mix(in srgb, var(--text-on-card) 70%, transparent);
  line-height: 1.5;
}

/* photo picker row inside modals */
.photo-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.photo-preview {
  width: 48px;
  height: 48px;
  flex: none;
  border: var(--border-hard);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-faint);
  font-family: var(--font-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: lowercase;
}
.photo-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* runtime choice cards (CreateAgentModal/SwitchControl/RoutesSection) — 6
   cards as of the Gemini harness (claude/codex/copilot/grok/gemini/ollama);
   3-column grid now lays out as an even 3+3, same grid as the 5-card 3+2
   wrap before it. */
.runtime-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.runtime-card {
  border: var(--border-hard);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  color: var(--text-on-card);
  padding: 14px 12px 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  text-align: left;
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap),
    background var(--speed-fast) var(--ease-snap);
}
.runtime-card:hover {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-xs);
}
.runtime-card:active {
  transform: translate(0, 0);
  box-shadow: none;
}
.runtime-card.is-selected {
  background: var(--at-black);
  color: var(--at-cream);
  box-shadow: var(--shadow-hard-sm);
  transform: translate(-1px, -1px);
}
.runtime-card-name {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 22px;
}
.runtime-card-sub {
  font-family: var(--font-mono);
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: lowercase;
  opacity: 0.65;
}

.toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* policy choice cards (PolicyControl) — vertical stack, reuses .runtime-card look */
.policy-cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.policy-hint {
  color: color-mix(in srgb, var(--text-on-card) 55%, transparent);
}

/* ── GateScreen ────────────────────────────────────────────────────────── */

.gate {
  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 26px;
  background-color: var(--bg-app);
  background-image: var(--glow-gold), var(--glow-hype), var(--texture-dots);
  background-size:
    auto,
    auto,
    var(--texture-dots-size);
}
.gate-lockup {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.gate-title {
  font-size: var(--display-hero-size);
  color: var(--text-body);
}
.gate-by {
  color: var(--accent-crown);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-align: center;
}
.gate-card {
  width: min(360px, calc(100vw - 48px));
  padding: 36px 34px 30px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.gate-strapline {
  color: var(--text-faint);
  text-align: center;
}

/* ── CrewButton / CrewPanel ────────────────────────────────────────────── */

.crew-btn {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 60;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: var(--radius-pill);
  border: 2px solid var(--border-ink);
  background: var(--surface-card);
  color: var(--text-on-card);
  box-shadow: var(--shadow-hard-sm);
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap);
}
.crew-btn:hover {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-md);
}
.crew-btn:active {
  transform: translate(0, 0);
  box-shadow: var(--shadow-hard-sm);
}
.crew-panel {
  position: fixed;
  right: 18px;
  bottom: 68px;
  z-index: 60;
  width: 300px;
  height: 340px;
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-xl);
}
.crew-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 10px;
  border-bottom: 2px solid var(--border-ink);
}
.crew-panel-title {
  font-size: var(--display-md-size);
  color: var(--text-on-card);
}
.crew-panel-body {
  flex: 1;
  min-height: 0;
}
.crew-panel-body .empty-state-msg {
  color: var(--at-faint);
}

/* ── ErrorBanner ───────────────────────────────────────────────────────── */

.error-banner {
  position: fixed;
  top: calc(var(--titlebar-h) + 12px);
  left: 50%;
  transform: translateX(-50%);
  z-index: 200;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  background: var(--at-red);
  color: var(--at-black);
  border: var(--border-hard);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-hard-sm);
  max-width: min(560px, calc(100vw - 48px));
}
.error-banner-msg {
  font-family: var(--font-mono);
  font-size: 11.5px;
  letter-spacing: 0.05em;
  text-transform: lowercase;
}
.error-banner-close {
  flex: none;
  width: 20px;
  height: 20px;
  border: 2px solid var(--border-ink);
  border-radius: var(--radius-sm);
  font-size: 11px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background var(--speed-fast) var(--ease-snap);
}
.error-banner-close:hover {
  background: color-mix(in srgb, var(--at-black) 15%, transparent);
}

/* ---- terminal (step 5): panes stay mounted, stacked; hidden keeps dims for fit */
.terminal-stack {
  position: relative;
  flex: 1;
  min-height: 0;
  /* .session-tab-content centers its children (right for EmptyState) — without
     stretch, this stack's only child is absolutely positioned, so it collapses
     to 0px height and FitAddon computes rows:1 (invisible terminal). */
  align-self: stretch;
  background: var(--at-black);
}
.terminal-pane {
  position: absolute;
  inset: 0;
  padding: var(--space-2, 8px);
  /* SWITCH marker banner (build 3.5a integrate-verify fix) needs a sibling
     slot above the xterm host that never steals its height — flex column
     with the host as the only flexible child. */
  display: flex;
  flex-direction: column;
}
.terminal-pane.is-hidden {
  visibility: hidden;
  z-index: 0;
}
.terminal-pane-host {
  flex: 1;
  min-height: 0;
}
.terminal-pane-host .xterm {
  height: 100%;
}
/* One-time "SWITCHED · X → Y · PORTABLE CONTEXT" banner (Layer 3.5
   SWITCHBOARD, build 3.5a) — a React-rendered row, NOT written into the
   xterm buffer: claude/codex/copilot's TUIs switch to the terminal's
   ALTERNATE SCREEN buffer on boot, which would make a term.write()'d marker
   permanently invisible once the child process takes over (verified live).
   Mirrors ChatPane's .chat-msg-system-text tone (muted, lowercase, never
   mistaken for real terminal output). */
.switch-marker-banner {
  flex: none;
  padding: 2px 2px 8px;
  color: var(--text-faint);
  letter-spacing: 0.04em;
  text-transform: lowercase;
}

/* ── Memory v2 migrate/reset (decision 7, FilesDrawer footer) ──────────── */

.files-v2-actions {
  display: flex;
  gap: 8px;
}
.files-v2-btn {
  flex: 1;
  font-size: 13px;
  padding: 8px 10px;
}

/* ink/danger-adjacent outline — red, never lime: RESET TO V2 TEMPLATE is
   destructive, and the "your call" gold of btn-crown-outline already means
   FULL SEND elsewhere, so this gets its own color. */
.btn-danger-outline {
  background: transparent;
  color: var(--at-red);
  border-color: var(--at-red);
}
.btn-danger-outline:hover:not(:disabled) {
  transform: translate(-1px, -1px);
  box-shadow: 4px 4px 0 var(--at-red);
}
.btn-danger-outline:active:not(:disabled) {
  transform: translate(0, 0);
  box-shadow: none;
}

/* preview modal body — stacked before/after <pre> blocks, no diff lib */
.v2-diff-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.v2-diff-file {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.v2-diff-file-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  color: var(--text-on-card);
}
.v2-diff-note,
.v2-diff-label {
  color: color-mix(in srgb, var(--text-on-card) 55%, transparent);
}
.v2-diff-pre {
  font-family: var(--font-mono);
  font-size: 11.5px;
  line-height: 1.5;
  white-space: pre;
  max-height: 220px;
  overflow: auto;
  background: var(--input-bg);
  border: var(--border-hard);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  color: var(--text-on-card);
}

/* ── RoutinesPanel (Layer 2 UI) — slides over the workspace, same slot/z-index
   as FilesDrawer (mutually exclusive, stores/ui.ts enforces it) ──────────── */

.routines-drawer {
  position: fixed;
  top: var(--titlebar-h);
  right: 0;
  bottom: 0;
  z-index: 65;
  width: min(440px, 92vw);
  display: flex;
  flex-direction: column;
  background: var(--surface-panel);
  border-left: var(--border-dark-line);
  box-shadow: var(--shadow-hard-lg);
  animation: files-drawer-in var(--speed-base) var(--ease-snap);
}
.routines-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 16px 12px;
  border-bottom: var(--border-dark-line);
}
.routines-drawer-title {
  font-size: var(--display-md-size);
  color: var(--text-body);
}
.routines-drawer-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 14px 16px;
}
.routines-drawer-foot {
  padding: 10px;
  border-top: var(--border-dark-line);
}
.routines-new-btn {
  width: 100%;
  font-size: 15px;
  padding: 8px 16px;
}

.routines-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.routine-row {
  border: 1px solid var(--border-line);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  padding: 10px 12px;
}
.routine-row-top {
  display: flex;
  align-items: center;
  gap: 8px;
}
.routine-row-toggle {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  text-align: left;
  color: var(--text-body);
}
.routine-row-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}
.routine-row-schedule {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-dim);
}
.routine-row-actions {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
}
.routine-run-now-btn,
.routine-edit-btn {
  font-size: 11px;
  padding: 4px 10px;
}

/* status dot — same shape as .session-tab-dot, distinct semantic palette:
   mint = ok (success, not lime — lime is reserved for CTAs/progress per
   colors.css), lime = running (in progress right now), red = error/timeout,
   faint = skipped or no run yet. */
.routine-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex: none;
}
.routine-status-dot.is-ok {
  background: var(--at-mint);
}
.routine-status-dot.is-running {
  background: var(--accent-action);
}
.routine-status-dot.is-error {
  background: var(--at-red);
}
.routine-status-dot.is-skipped,
.routine-status-dot.is-none {
  background: var(--text-faint);
}

.routine-run-history {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border-line);
}
.routine-history-empty {
  color: var(--text-faint);
  padding: 4px 2px;
}
.routine-run-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 5px 6px;
  border-radius: var(--radius-sm);
  text-align: left;
  color: var(--text-dim);
  transition: background var(--speed-fast) var(--ease-snap);
}
.routine-run-row:hover {
  background: color-mix(in srgb, var(--at-cream) 7%, transparent);
  color: var(--text-body);
}
.routine-run-started {
  flex: 1;
  min-width: 0;
}
.routine-run-duration {
  flex: none;
  color: var(--text-faint);
}

/* ── RoutineModal (Layer 2 UI) — SCHEDULE choice chips + per-kind pickers ── */

.schedule-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.schedule-chip {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: var(--radius-pill);
  border: var(--border-hard);
  background: var(--input-bg);
  color: var(--text-on-card);
  transition:
    transform var(--speed-fast) var(--ease-snap),
    box-shadow var(--speed-fast) var(--ease-snap),
    background var(--speed-fast) var(--ease-snap);
}
.schedule-chip:hover {
  transform: translate(-1px, -1px);
  box-shadow: var(--shadow-hard-xs);
}
.schedule-chip.is-selected {
  background: var(--at-black);
  color: var(--at-cream);
  box-shadow: var(--shadow-hard-sm);
  transform: translate(-1px, -1px);
}
.schedule-picker-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.schedule-picker-row .field-input {
  width: auto;
}
.schedule-num-input {
  width: 90px;
}
.schedule-cron-input {
  font-family: var(--font-mono);
  font-size: 12.5px;
  min-height: 56px;
}
.schedule-cron-preview {
  display: block;
  background: var(--input-bg);
  border: var(--border-hard-thin);
  border-radius: var(--radius-sm);
  padding: 8px 10px;
  color: var(--text-on-card);
}

/* ── RunOutputModal (Layer 2 UI) ───────────────────────────────────────── */

.run-output-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

/* ── ChatPane (Layer 3, Ollama) ────────────────────────────────────────────
   Same keep-mounted stacked pattern as .terminal-stack/.terminal-pane, a
   chat surface instead of an xterm pane for runtime==='ollama' sessions. */

.chat-stack {
  position: relative;
  flex: 1;
  min-height: 0;
  /* same GOTCHA .terminal-stack documents: .session-tab-content centers its
     children, so an absolutely-positioned-only child collapses to 0 height
     without stretch. */
  align-self: stretch;
  background: var(--bg-app);
}
.chat-pane {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.chat-pane.is-hidden {
  visibility: hidden;
  z-index: 0;
}
.chat-messages {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 20px;
}
.chat-msg {
  display: flex;
  flex-direction: column;
  max-width: 72%;
}
.chat-msg-user {
  align-self: flex-end;
  align-items: flex-end;
}
.chat-msg-agent {
  align-self: flex-start;
  align-items: flex-start;
  max-width: 84%;
}
.chat-bubble {
  padding: 10px 14px;
}
.chat-msg-body {
  color: var(--text-body);
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
}
.chat-msg-meta {
  color: var(--text-faint);
  margin-top: 4px;
}
/* lime block cursor — grows the streaming assistant bubble live, per
   chat:delta; never shown once the turn lands in .messages (chat:done). */
.chat-cursor {
  display: inline-block;
  width: 8px;
  height: 1em;
  margin-left: 2px;
  vertical-align: text-bottom;
  background: var(--at-lime);
  animation: chat-cursor-blink 1s step-end infinite;
}
@keyframes chat-cursor-blink {
  0%,
  49% {
    opacity: 1;
  }
  50%,
  100% {
    opacity: 0;
  }
}
.chat-error-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0 20px 10px;
  padding: 8px 12px;
  border: 1px solid var(--at-red);
  border-radius: var(--radius-sm);
  color: var(--at-red);
}
.chat-error-close {
  flex: none;
  width: 18px;
  height: 18px;
  border: 1px solid var(--at-red);
  border-radius: var(--radius-sm);
  font-size: 10px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--at-red);
  transition: background var(--speed-fast) var(--ease-snap);
}
.chat-error-close:hover {
  background: color-mix(in srgb, var(--at-red) 15%, transparent);
}
.chat-input-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  /* REAL BUG found + fixed (Layer 3 integrate-verify, 2026-07-11): a plain
     20px right padding put the SEND/STOP button directly underneath
     .crew-btn (position:fixed, right:18px, bottom:18px, z-index:60, ~67px
     wide — CrewButton.tsx) whenever the chat pane fills the full workspace
     width, exactly as it always does — verified live via getBoundingClientRect,
     crewRect.x=1178.8 vs sendRect.x=1172.3 at a 1264px-wide window, near-total
     overlap, and Playwright's click() failing with "<span class=label-mono>
     CREW</span> ... intercepts pointer events". Unlike FilesDrawer/RoutinesPanel
     (ephemeral overlays that intentionally WIN over crew-btn via a higher
     z-index — see .files-drawer's own comment above), the chat input row is
     the pane's permanent primary control and can never be temporarily
     covered, so this needs reserved space, not a z-index fight: 108px clears
     crew-btn's full fixed footprint (18+67=85px from the window edge) with a
     comfortable margin, verified live post-fix (no more pointer-event
     interception, SEND/STOP click through cleanly with the crew panel
     closed AND open). */
  padding: 12px 108px 18px 20px;
  border-top: var(--border-dark-line);
}
.chat-input {
  flex: 1;
  font-family: var(--font-mono);
  font-size: 12.5px;
  line-height: 1.5;
  min-height: 40px;
  max-height: 160px;
  resize: vertical;
  background: var(--surface-raised);
  border: 1px solid var(--border-line);
  border-radius: var(--radius-sm);
  padding: 9px 11px;
  color: var(--text-body);
}
.chat-input::placeholder {
  color: var(--text-faint);
}
.chat-input-row .btn {
  flex: none;
}
.run-output-meta-item {
  color: color-mix(in srgb, var(--text-on-card) 60%, transparent);
}
.run-status-chip.is-ok {
  border: 1px solid var(--at-mint);
  color: color-mix(in srgb, var(--at-mint) 70%, var(--at-black));
}
.run-status-chip.is-running {
  border: 1px solid var(--accent-action);
  color: color-mix(in srgb, var(--accent-action) 55%, var(--at-black));
}
.run-status-chip.is-error {
  border: 1px solid var(--at-red);
  color: var(--at-red);
}
.run-status-chip.is-skipped {
  border: 1px solid var(--border-line);
  color: var(--text-faint);
}
.run-output-error {
  color: var(--at-red);
}
.run-output-pre {
  font-family: var(--font-mono);
  font-size: 12px;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
  max-height: 50vh;
  overflow: auto;
  background: var(--input-bg);
  border: var(--border-hard);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  color: var(--text-on-card);
}

/* ── FilesDrawer: SEARCH HISTORY (transcript FTS search) ─────────────────
   Lives directly on the drawer's dark .files-drawer-body, not inside a
   .pass-card — .field-input already carries its own cream --input-bg
   regardless of parent background, so it pops correctly as-is (no new
   input primitive invented). ─────────────────────────────────────────── */

.files-search {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: var(--border-dark-line);
}
.files-search-input {
  width: 100%;
}
.files-search-results {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.files-search-result {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--border-line);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
}
.files-search-result-snippet {
  color: var(--text-body);
  font-size: 13px;
  line-height: 1.45;
  word-break: break-word;
  white-space: pre-wrap;
}
.files-search-result-meta {
  color: var(--text-faint);
  text-transform: lowercase;
}

/* Layer 2 integrate-verify fix: .modal-close is styled for the CREAM modal
   card (--text-on-card / --border-ink both resolve to --at-black — correct
   there, ink-on-cream). FilesDrawer/RoutinesPanel reuse the same class for
   their OWN close button, but their header sits on the dark drawer surface,
   not a cream card — same near-black ink on near-black background made the
   ✕ glyph and its border functionally invisible (confirmed live via
   screenshot during Layer 2 E2E verification). Scoped override, light-on-dark
   tokens already used elsewhere in these same dark headers (.files-toggle-btn). */
.files-drawer-head .modal-close,
.routines-drawer-head .modal-close {
  border-color: var(--border-line);
  color: var(--text-body);
}
.files-drawer-head .modal-close:hover,
.routines-drawer-head .modal-close:hover {
  background: color-mix(in srgb, var(--at-cream) 9%, transparent);
}

/* ── SWITCH action (Layer 3.5 SWITCHBOARD, build 3.5a) ──────────────────── */

/* ChatPane's rendering of the one-time "SWITCHED · X → Y · PORTABLE CONTEXT"
   marker row (TerminalPane's own .switch-marker-banner, above the terminal
   stack rules, is the PTY-side equivalent — both render via React state now,
   not a term.write() into a buffer a TUI's alternate-screen switch could
   hide). Centered, muted, never mistaken for a real chat bubble from either
   side. */
.chat-msg-system {
  align-self: center;
  max-width: 92%;
  align-items: center;
}
.chat-msg-system-text {
  color: var(--text-faint);
  text-align: center;
  letter-spacing: 0.04em;
  text-transform: lowercase;
}

/* ── RoutesSection (SettingsPanel, MESH CORE 3.5b delegation routes) ─────── */

.routes-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
/* lives on SettingsPanel's cream pass-card, not the dark app chrome — same
   --input-bg cream tint .field-input already carries there, NOT
   .routine-row's dark --surface-raised (that class is scoped to the
   RoutinesPanel dark drawer). */
.routes-row {
  border: 1px solid color-mix(in srgb, var(--at-black) 14%, transparent);
  border-radius: var(--radius-md);
  background: var(--input-bg);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.routes-row-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.routes-row-head {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}
.routes-row-name {
  color: var(--text-on-card);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.routes-row-chips {
  display: flex;
  gap: 6px;
  flex: none;
}
.routes-row-actions {
  flex: none;
  display: flex;
  gap: 8px;
}
.routes-row-btn {
  font-size: 12px;
  padding: 5px 12px;
}
.routes-row-desc,
.routes-row-meta {
  color: color-mix(in srgb, var(--text-on-card) 55%, transparent);
}
.routes-add-btn {
  align-self: flex-start;
  font-size: 14px;
  padding: 8px 18px;
}

/* ── RoutinesPanel delegation-run history (MESH CORE 3.5b) ───────────────── */

/* Runs with kind === 'delegation' have no routineId to bucket under, so they
   get their own section below the ordinary per-routine list/empty-state
   instead of being folded into it (BINDING ARCHITECTURE: "DELEGATED badge, or
   a separate section — keep minimal"). Reuses .routine-run-row/-status-dot/
   -started/-duration verbatim; only the badge + parent-session hint are new. */
.routine-delegated-section {
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--border-line);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.routine-delegated-heading {
  color: var(--text-dim);
}
.routine-delegated-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.routine-delegated-badge {
  flex: none;
}
.routine-delegated-parent-hint {
  flex: none;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-faint);
}

/* ── Layer 4.2 sync engine — SyncSection / TeamSyncModal / TitleBar chip ── */

.sync-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.sync-status-line {
  color: color-mix(in srgb, var(--text-on-card) 70%, transparent);
}
.sync-node-id {
  color: color-mix(in srgb, var(--text-on-card) 45%, transparent);
}

/* Layer 4.3 device tokens (SettingsPanel SYNC DEVICES) — the freshly-minted
   token is shown ONCE (device-tokens.ts never persists the plaintext) inside
   a .routes-row; this forces the long dsk_… string to wrap instead of
   overflowing the cream card. */
.device-token-value {
  word-break: break-all;
  color: var(--text-on-card);
}

/* TitleBar chip — three states only (task brief item 3: "SYNC ok/off/
   queueing"), a dot + label pill matching .titlebar-settings-btn's own
   pill-bordered dark-chrome shape so it reads as chrome, not a data row. */
.sync-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--border-line);
  border-radius: var(--radius-pill);
  color: var(--text-dim);
}
.sync-chip-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex: none;
}
.sync-chip.is-ok .sync-chip-dot {
  background: var(--at-mint);
}
.sync-chip.is-queueing .sync-chip-dot {
  background: var(--accent-action);
}
.sync-chip.is-off .sync-chip-dot {
  background: var(--text-faint);
}
/**
 * Copyright (c) 2014 The xterm.js authors. All rights reserved.
 * Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
 * https://github.com/chjj/term.js
 * @license MIT
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 *
 * Originally forked from (with the author's permission):
 *   Fabrice Bellard's javascript vt100 for jslinux:
 *   http://bellard.org/jslinux/
 *   Copyright (c) 2011 Fabrice Bellard
 *   The original design remains. The terminal itself
 *   has been extended to include xterm CSI codes, among
 *   other features.
 */

/**
 *  Default styles for xterm.js
 */

.xterm {
    cursor: text;
    position: relative;
    user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
}

.xterm.focus,
.xterm:focus {
    outline: none;
}

.xterm .xterm-helpers {
    position: absolute;
    top: 0;
    /**
     * The z-index of the helpers must be higher than the canvases in order for
     * IMEs to appear on top.
     */
    z-index: 5;
}

.xterm .xterm-helper-textarea {
    padding: 0;
    border: 0;
    margin: 0;
    /* Move textarea out of the screen to the far left, so that the cursor is not visible */
    position: absolute;
    opacity: 0;
    left: -9999em;
    top: 0;
    width: 0;
    height: 0;
    z-index: -5;
    /** Prevent wrapping so the IME appears against the textarea at the correct position */
    white-space: nowrap;
    overflow: hidden;
    resize: none;
}

.xterm .composition-view {
    /* TODO: Composition position got messed up somewhere */
    background: #000;
    color: #FFF;
    display: none;
    position: absolute;
    white-space: nowrap;
    z-index: 1;
}

.xterm .composition-view.active {
    display: block;
}

.xterm .xterm-viewport {
    /* On OS X this is required in order for the scroll bar to appear fully opaque */
    background-color: #000;
    overflow-y: scroll;
    cursor: default;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
}

.xterm .xterm-screen {
    position: relative;
}

.xterm .xterm-screen canvas {
    position: absolute;
    left: 0;
    top: 0;
}

.xterm-char-measure-element {
    display: inline-block;
    visibility: hidden;
    position: absolute;
    top: 0;
    left: -9999em;
    line-height: normal;
}

.xterm.enable-mouse-events {
    /* When mouse events are enabled (eg. tmux), revert to the standard pointer cursor */
    cursor: default;
}

.xterm.xterm-cursor-pointer,
.xterm .xterm-cursor-pointer {
    cursor: pointer;
}

.xterm.column-select.focus {
    /* Column selection mode */
    cursor: crosshair;
}

.xterm .xterm-accessibility:not(.debug),
.xterm .xterm-message {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 10;
    color: transparent;
    pointer-events: none;
}

.xterm .xterm-accessibility-tree:not(.debug) *::selection {
  color: transparent;
}

.xterm .xterm-accessibility-tree {
  font-family: monospace;
  user-select: text;
  white-space: pre;
}

.xterm .xterm-accessibility-tree > div {
  transform-origin: left;
  width: fit-content;
}

.xterm .live-region {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.xterm-dim {
    /* Dim should not apply to background, so the opacity of the foreground color is applied
     * explicitly in the generated class and reset to 1 here */
    opacity: 1 !important;
}

.xterm-underline-1 { text-decoration: underline; }
.xterm-underline-2 { text-decoration: double underline; }
.xterm-underline-3 { text-decoration: wavy underline; }
.xterm-underline-4 { text-decoration: dotted underline; }
.xterm-underline-5 { text-decoration: dashed underline; }

.xterm-overline {
    text-decoration: overline;
}

.xterm-overline.xterm-underline-1 { text-decoration: overline underline; }
.xterm-overline.xterm-underline-2 { text-decoration: overline double underline; }
.xterm-overline.xterm-underline-3 { text-decoration: overline wavy underline; }
.xterm-overline.xterm-underline-4 { text-decoration: overline dotted underline; }
.xterm-overline.xterm-underline-5 { text-decoration: overline dashed underline; }

.xterm-strikethrough {
    text-decoration: line-through;
}

.xterm-screen .xterm-decoration-container .xterm-decoration {
	z-index: 6;
	position: absolute;
}

.xterm-screen .xterm-decoration-container .xterm-decoration.xterm-decoration-top-layer {
	z-index: 7;
}

.xterm-decoration-overview-ruler {
    z-index: 8;
    position: absolute;
    top: 0;
    right: 0;
    pointer-events: none;
}

.xterm-decoration-top {
    z-index: 2;
    position: relative;
}



/* Derived from vs/base/browser/ui/scrollbar/media/scrollbar.css */

/* xterm.js customization: Override xterm's cursor style */
.xterm .xterm-scrollable-element > .scrollbar {
    cursor: default;
}

/* Arrows */
.xterm .xterm-scrollable-element > .scrollbar > .scra {
	cursor: pointer;
	font-size: 11px !important;
}

.xterm .xterm-scrollable-element > .visible {
	opacity: 1;

	/* Background rule added for IE9 - to allow clicks on dom node */
	background:rgba(0,0,0,0);

	transition: opacity 100ms linear;
	/* In front of peek view */
	z-index: 11;
}
.xterm .xterm-scrollable-element > .invisible {
	opacity: 0;
	pointer-events: none;
}
.xterm .xterm-scrollable-element > .invisible.fade {
	transition: opacity 800ms linear;
}

/* Scrollable Content Inset Shadow */
.xterm .xterm-scrollable-element > .shadow {
	position: absolute;
	display: none;
}
.xterm .xterm-scrollable-element > .shadow.top {
	display: block;
	top: 0;
	left: 3px;
	height: 3px;
	width: 100%;
	box-shadow: var(--vscode-scrollbar-shadow, #000) 0 6px 6px -6px inset;
}
.xterm .xterm-scrollable-element > .shadow.left {
	display: block;
	top: 3px;
	left: 0;
	height: 100%;
	width: 3px;
	box-shadow: var(--vscode-scrollbar-shadow, #000) 6px 0 6px -6px inset;
}
.xterm .xterm-scrollable-element > .shadow.top-left-corner {
	display: block;
	top: 0;
	left: 0;
	height: 3px;
	width: 3px;
}
.xterm .xterm-scrollable-element > .shadow.top.left {
	box-shadow: var(--vscode-scrollbar-shadow, #000) 6px 0 6px -6px inset;
}