@materialwebunofficial/antigravity-themes 1.0.4 → 1.0.13

package/themes/paper-tokens.css

@@ -0,0 +1,54 @@
+/* AGY "E-Ink / Paper" — tokens. Shared by the window (paper.css) and by
+   sidecar frames (frames/paper.css), which load no other part of the theme. */
+
+:root[data-agy-theme="paper"] {
+  /* Inverted E-Ink Dark Mode (Kindle Dark / Night Reading) */
+  --p-window:  #111111;
+  --p-panel:   #181818;
+  --p-raised:  #222222;
+  --p-high:    #2c2c2c;
+  --p-inset:   #0d0d0d;
+
+  --p-line:    #2f2f2f;
+  --p-line-2:  #444444;
+  --p-line-3:  #666666;
+  --p-hover:   #252525;
+  --p-select:  #333333;
+
+  --p-text-max: #ffffff;
+  --p-text:     #e2e2e2;
+  --p-text-2:   #9e9e9e;
+  --p-text-3:   #707070;
+
+  --p-primary:     #ffffff;
+  --p-primary-ink: #000000;
+  --p-accent:      #d4d4d4;
+
+  --p-font-ui:   -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
+  --p-font-read: "Charter", "Georgia", "Cambria", serif;
+  --p-font-mono: "Consolas", "Courier New", monospace;
+}
+
+:root[data-agy-theme="paper"][data-agy-mode="light"] {
+  /* True E-Paper Light Mode (reMarkable / Fresh Book Page) */
+  --p-window:  #e7e7e7;
+  --p-panel:   #f6f6f6;
+  --p-raised:  #ffffff;
+  --p-high:    #ebebeb;
+  --p-inset:   #dedede;
+
+  --p-line:    #d4d4d4;
+  --p-line-2:  #bcbcbc;
+  --p-line-3:  #888888;
+  --p-hover:   #eeeeee;
+  --p-select:  #e0e0e0;
+
+  --p-text-max: #000000;
+  --p-text:     #1a1a1a;
+  --p-text-2:   #555555;
+  --p-text-3:   #777777;
+
+  --p-primary:     #000000;
+  --p-primary-ink: #ffffff;
+  --p-accent:      #222222;
+}

package/themes/paper.css

@@ -5,57 +5,8 @@
    and clean typography tailored for deep focus and reading.
    ========================================================================== */
 
-:root[data-agy-theme="paper"] {
-  /* Inverted E-Ink Dark Mode (Kindle Dark / Night Reading) */
-  --p-window:  #111111;
-  --p-panel:   #181818;
-  --p-raised:  #222222;
-  --p-high:    #2c2c2c;
-  --p-inset:   #0d0d0d;
-
-  --p-line:    #2f2f2f;
-  --p-line-2:  #444444;
-  --p-line-3:  #666666;
-  --p-hover:   #252525;
-  --p-select:  #333333;
-
-  --p-text-max: #ffffff;
-  --p-text:     #e2e2e2;
-  --p-text-2:   #9e9e9e;
-  --p-text-3:   #707070;
-
-  --p-primary:     #ffffff;
-  --p-primary-ink: #000000;
-  --p-accent:      #d4d4d4;
-
-  --p-font-ui:   -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
-  --p-font-read: "Charter", "Georgia", "Cambria", serif;
-  --p-font-mono: "Consolas", "Courier New", monospace;
-}
-
-:root[data-agy-theme="paper"][data-agy-mode="light"] {
-  /* True E-Paper Light Mode (reMarkable / Fresh Book Page) */
-  --p-window:  #e7e7e7;
-  --p-panel:   #f6f6f6;
-  --p-raised:  #ffffff;
-  --p-high:    #ebebeb;
-  --p-inset:   #dedede;
-
-  --p-line:    #d4d4d4;
-  --p-line-2:  #bcbcbc;
-  --p-line-3:  #888888;
-  --p-hover:   #eeeeee;
-  --p-select:  #e0e0e0;
-
-  --p-text-max: #000000;
-  --p-text:     #1a1a1a;
-  --p-text-2:   #555555;
-  --p-text-3:   #777777;
-
-  --p-primary:     #000000;
-  --p-primary-ink: #ffffff;
-  --p-accent:      #222222;
-}
+/* 00 — Tokens: paper-tokens.css (loaded before this file) */
+
 
 /* 01 — App token bridge */
 :root[data-agy-theme="paper"] {
@@ -74,6 +25,12 @@
   --sidebar: var(--p-window) !important;
   --sidebar-secondary: var(--p-select) !important;
   --sidebar-muted: var(--p-raised) !important;
+  --link: var(--p-text-max) !important;   /* monochrome: links are underlined ink */
+}
+:root[data-agy-theme="paper"] .text-link {
+  text-decoration: underline;
+  text-decoration-thickness: 1px;
+  text-underline-offset: 2px;
 }
 
 /* 05 — Onyx layer override */
@@ -93,27 +50,34 @@
 }
 
 /* 10 — Main Reading Panel & Book Layout */
-:root[data-agy-theme="paper"] .group\/pane,
-:root[data-agy-theme="paper"] .agy-sheet:not(:has(.group\/pane)) .browser-hole-opaque {
+/* The app lays the panel out itself (.agy-sheet, with --card-gap,
+   --card-radius, --card-edge and --shell-canvas); the theme sets those
+   variables. The page: a sheet with 4px corners and a crisp 1px rule, no
+   shadow. A rule is how e-ink draws structure, so the app's hairline stays,
+   at a full pixel. A docked side panel is the facing page: it shares the rule. */
+:root[data-agy-theme="paper"] .agy-inset-shell {
+  --shell-canvas: var(--p-window);
+  --card-gap: 10px;
+  --card-radius: 4px;
+  --card-edge: var(--p-line-2);
+  --sash-line: var(--p-line-3);
+  --sash-glow: transparent;
+}
+:root[data-agy-theme="paper"] .agy-sheet [data-main-content-body],
+:root[data-agy-theme="paper"] .agy-inset-shell [data-side-panel-body],
+:root[data-agy-theme="paper"] [data-testid="sidecar-iframe-slot"] {   /* a sidecar's frame is mounted over its pane, not in it */
   --background: var(--p-panel);
   --color-background: var(--p-panel);
-  width: auto;
-  height: calc(100% - 10px);
-  margin: 0 10px 10px 6px;
-  border-radius: 4px;
-  border: 1px solid var(--p-line-2);
-  background: var(--p-panel);
-  box-shadow: none;
-  overflow: hidden;
+}
+:root[data-agy-theme="paper"] .agy-sheet[data-sheet-inset] [data-main-content-body]::after,
+:root[data-agy-theme="paper"] .agy-inset-shell [data-side-panel-body]::after {
+  box-shadow: inset 0 0 0 1px var(--card-edge);
 }
 :root[data-agy-theme="paper"] .agy-sheet {
   background-image: none !important;
 }
-:root[data-agy-theme="paper"] .bg-border.flex-shrink-0.z-30.h-full {
-  background: var(--p-window);
-}
 
-/* Inactive webview occlusion guard */
+/* Inactive webview occlusion guard: prevent GPU compositor bleeding */
 div[style*="opacity: 0.005"] webview,
 div[style*="display: none"] webview,
 webview[style*="opacity: 0.005"] {
@@ -121,6 +85,7 @@ webview[style*="opacity: 0.005"] {
   pointer-events: none !important;
 }
 
+
 /* 20 — Sidebar: Clean E-Ink Document Index (Fixed header overflow) */
 :root[data-agy-theme="paper"] aside,
 :root[data-agy-theme="paper"] nav {
@@ -224,7 +189,9 @@ webview[style*="opacity: 0.005"] {
   font-family: var(--p-font-mono) !important;
   font-size: 13px !important;
 }
-:root[data-agy-theme="paper"] pre {
+/* Fenced code in the chat is the app's own ruled block (.agy-code): a
+   second box around a pre inside it would draw two rules */
+:root[data-agy-theme="paper"] pre:not(.agy-code pre) {
   background: var(--p-inset) !important;
   border: 1px solid var(--p-line) !important;
   border-radius: 3px !important;
@@ -253,8 +220,9 @@ webview[style*="opacity: 0.005"] {
   font-family: var(--p-font-ui);
   font-size: 13px;
 }
-:root[data-agy-theme="paper"] [role="menuitem"]:hover,
-:root[data-agy-theme="paper"] [role="menuitemradio"]:hover {
+/* disabled items (an unavailable model) take no hover fill: it only dims them */
+:root[data-agy-theme="paper"] [role="menuitem"]:not([data-disabled], [aria-disabled="true"]):hover,
+:root[data-agy-theme="paper"] [role="menuitemradio"]:not([data-disabled], [aria-disabled="true"]):hover {
   background: var(--p-select);
 }
 
@@ -271,6 +239,475 @@ webview[style*="opacity: 0.005"] {
   background: var(--p-line-3);
 }
 
+/* 60 — Dialogs & Settings: a printed form ---------------------------------- */
+/* Settings as a page of a printed manual: an ink-ruled sheet with square
+   corners and no shadow; the index set in the reading serif, the current
+   entry printed in reverse; group titles in small capitals; each group a
+   ruled box with dashed lines between entries; controls drawn in ink
+   outline, chosen ones in reverse; fields are lines to write on. Strictly
+   monochrome. Selectors go through .agy-dialog to outrank the app's glass
+   rules (body[data-newux-theme]). */
+:root[data-agy-theme="paper"] .agy-dialog {
+  border: 1px solid var(--p-line-3) !important;
+  border-radius: 2px !important;
+  background: var(--p-panel);
+  box-shadow: none !important;
+  color: var(--p-text);
+}
+:root[data-agy-theme="paper"] .settings-modal-backdrop {
+  background: rgb(0 0 0 / 0.45);
+}
+:root[data-agy-theme="paper"] .agy-dialog > button[aria-label="Close"] {
+  border-radius: 0 !important;
+  color: var(--p-text);
+}
+:root[data-agy-theme="paper"] .agy-dialog > button[aria-label="Close"]:hover {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+}
+:root[data-agy-theme="paper"] .settings-modal-container .bg-background {
+  background: transparent;
+}
+
+/* the index, in the reading serif */
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] {
+  border-right: 1px solid var(--p-line-2);
+  background: var(--p-window);
+  font-family: var(--p-font-read);
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] > div:first-child {
+  gap: 0;
+  padding: 20px 0 12px;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] .px-4 {
+  padding: 0 20px;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] h1 {
+  margin-bottom: 10px;
+  padding-bottom: 8px;
+  flex: 1;
+  border-bottom: 1px solid var(--p-text);
+  font-size: 19px;
+  font-weight: 600;
+  color: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] .px-4.mt-2 {
+  margin-top: 16px;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] h2 {
+  margin-bottom: 4px;
+  font-size: 14px;
+  font-weight: 600;
+  font-variant-caps: all-small-caps;
+  letter-spacing: 0.08em;
+  color: var(--p-text-2);
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] .mx-2 {
+  margin: 0 12px;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] button[data-testid^="settings-nav-item-"] {
+  min-height: 30px;
+  padding: 0 8px;
+  border-radius: 0;
+  color: var(--p-text);
+  font-size: 15px;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] button[data-testid^="settings-nav-item-"] span {
+  color: inherit;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] button[data-testid^="settings-nav-item-"]:hover {
+  background: transparent;
+  color: var(--p-text-max);
+  text-decoration: underline;
+  text-decoration-thickness: 1px;
+  text-underline-offset: 4px;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] button[data-testid^="settings-nav-item-"].bg-sidebar-secondary {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+  text-decoration: none;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] button.mx-4 {
+  margin: 2px 20px 0;
+  color: var(--p-text-2);
+  font-style: italic;
+  font-weight: 400;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] button.mx-4:hover {
+  color: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] > .border-t {
+  border-color: var(--p-line-2);
+  font-family: var(--p-font-ui);
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] > .border-t > button {
+  border-radius: 0;
+}
+:root[data-agy-theme="paper"] [data-testid="settings-sidebar"] > .border-t > button > div:first-child {
+  border: 1px solid var(--p-text);
+  background: transparent;
+  color: var(--p-text);
+}
+
+/* the page: a serif title over a rule, small-capital group titles */
+:root[data-agy-theme="paper"] .settings-modal-container .p-6.max-w-2xl {
+  gap: 24px;
+  padding: 34px 40px 48px;
+}
+:root[data-agy-theme="paper"] .settings-modal-container .p-6.max-w-2xl > div:first-child {
+  margin-bottom: 0;
+  padding-bottom: 14px;
+  border-bottom: 2px solid var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .settings-modal-container h2.text-2xl {
+  font-family: var(--p-font-read);
+  font-size: 30px;
+  font-weight: 600;
+  line-height: 1.15;
+  color: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .settings-modal-container h2.text-2xl + div {
+  font-family: var(--p-font-read);
+  font-size: 15px;
+  font-style: italic;
+  color: var(--p-text-2);
+}
+:root[data-agy-theme="paper"] .settings-modal-container h3 {
+  font-family: var(--p-font-read);
+  font-size: 17px;
+  font-weight: 600;
+  font-variant-caps: all-small-caps;
+  letter-spacing: 0.06em;
+  color: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .settings-modal-container .leading-relaxed {
+  font-family: var(--p-font-read);
+  font-size: 14px;
+  color: var(--p-text-2);
+}
+
+/* ruled boxes, dashed lines between entries */
+:root[data-agy-theme="paper"] .agy-dialog .agy-card {
+  --color-border: var(--p-line-2);
+  border: 1px solid var(--p-line-3);
+  border-radius: 0;
+  background: transparent;
+}
+:root[data-agy-theme="paper"] .agy-dialog .agy-card > :not(:last-child) {
+  border-bottom-style: dashed !important;
+}
+:root[data-agy-theme="paper"] .agy-dialog .agy-card .py-2.px-3 {
+  min-height: 54px;
+  padding: 12px 16px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .agy-dialog .agy-card .text-sm {
+  font-family: var(--p-font-read);
+  font-size: 13.5px;
+  font-weight: 400;
+  color: var(--p-text-2);
+}
+:root[data-agy-theme="paper"] .agy-dialog .agy-card > button:hover {
+  background: transparent;
+  color: var(--p-text-max);
+  text-decoration: underline;
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-testid="settings-row-badge"] {
+  padding: 2px 5px;
+  border: 0;
+  border-radius: 0;
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+  font-family: var(--p-font-mono);
+  font-size: 10.5px;
+}
+:root[data-agy-theme="paper"] .agy-dialog code {
+  border: 1px solid var(--p-line-2);
+  border-radius: 0;
+  background: transparent;
+  font-family: var(--p-font-mono);
+}
+
+/* controls: ink outlines, square; hover and the chosen state print in
+   reverse */
+:root[data-agy-theme="paper"] .agy-dialog :is(.agy-button-sm, .agy-button-md).bg-secondary,
+:root[data-agy-theme="paper"] .agy-dialog .agy-select-trigger {
+  height: 30px;
+  padding: 0 12px;
+  border: 1px solid var(--p-text) !important;
+  border-radius: 0 !important;
+  background: transparent;
+  color: var(--p-text-max);
+  font-size: 13px;
+  font-weight: 600;
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(.agy-button-sm, .agy-button-md).bg-secondary:hover,
+:root[data-agy-theme="paper"] .agy-dialog .agy-select-trigger:is(:hover, [aria-expanded="true"]) {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+}
+:root[data-agy-theme="paper"] .agy-dialog .agy-select-trigger svg {
+  opacity: 1;
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(a, button:not([role])).bg-primary {
+  padding: 5px 14px;
+  border: 1px solid var(--p-primary);
+  border-radius: 0 !important;
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+  font-weight: 600;
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(a, button:not([role])).bg-primary:hover {
+  background: transparent;
+  color: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-testid="delete-project-button"] {
+  border: 1px solid var(--p-text);
+  border-radius: 0 !important;
+  background: transparent;
+  color: var(--p-text-max);
+  text-decoration: line-through;
+  text-decoration-thickness: 1px;
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-testid="delete-project-button"]:hover {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(.agy-button-sm.text-link, button.self-start.rounded-md) {
+  border-radius: 0 !important;
+  color: var(--p-text-max);
+  font-style: italic;
+  font-family: var(--p-font-read);
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(.agy-button-sm.text-link, button.self-start.rounded-md):hover {
+  background: transparent;
+  text-decoration: underline;
+  text-underline-offset: 3px;
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(.agy-button-icon-sm, .agy-button-icon):not(.bg-secondary) {
+  border-radius: 0 !important;
+  color: var(--p-text-2);
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(.agy-button-icon-sm, .agy-button-icon):not(.bg-secondary):hover {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+}
+/* keys: square caps with a printed offset edge */
+:root[data-agy-theme="paper"] .agy-dialog .agy-button-xs.border {
+  height: 24px;
+  padding: 0 7px;
+  border: 1px solid var(--p-text);
+  border-radius: 0 !important;
+  background: var(--p-panel);
+  box-shadow: 2px 2px 0 var(--p-text);
+  color: var(--p-text-max);
+  font-family: var(--p-font-mono);
+  font-size: 12px;
+}
+:root[data-agy-theme="paper"] .agy-dialog .agy-button-xs.border:hover {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+}
+
+/* segmented control: one ruled strip; the chosen segment in reverse */
+:root[data-agy-theme="paper"] .agy-dialog [data-slot="toggle-group"] {
+  height: 30px;
+  padding: 0;
+  gap: 0;
+  border: 1px solid var(--p-text) !important;
+  border-radius: 0;
+  background: transparent !important;
+  box-shadow: none !important;
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-slot="toggle-group"] > button {
+  padding: 0 12px;
+  border-radius: 0;
+  background: transparent !important;
+  color: var(--p-text) !important;
+  font-size: 13px;
+  box-shadow: none !important;
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-slot="toggle-group"] > button + button {
+  border-left: 1px solid var(--p-text);
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-slot="toggle-group"] > button:hover {
+  text-decoration: underline;
+}
+:root[data-agy-theme="paper"] .agy-dialog [data-slot="toggle-group"] > button[data-pressed] {
+  background: var(--p-primary) !important;
+  color: var(--p-primary-ink) !important;
+  font-weight: 600;
+  text-decoration: none;
+}
+
+/* switch: a square ink box; on, it prints in reverse */
+:root[data-agy-theme="paper"] [role="switch"].rounded-full {
+  width: 36px;
+  height: 18px;
+  padding: 0;
+  border: 1px solid var(--p-text);
+  border-radius: 0;
+  background: transparent !important;
+}
+:root[data-agy-theme="paper"] [role="switch"].rounded-full:is([aria-checked="true"], [data-checked]) {
+  background: var(--p-primary) !important;
+}
+:root[data-agy-theme="paper"] [role="switch"].rounded-full > span {
+  width: 12px;
+  height: 12px;
+  border-radius: 0;
+  background: var(--p-text-2);
+  box-shadow: none !important;
+  transform: translateX(2px) !important;
+  transition: none;   /* e-ink: no in-between frames */
+}
+:root[data-agy-theme="paper"] [role="switch"].rounded-full:is([aria-checked="true"], [data-checked]) > span {
+  background: var(--p-primary-ink);
+  transform: translateX(20px) !important;
+}
+
+/* slider: an ink line and a tick */
+:root[data-agy-theme="paper"] .agy-dialog input[type="range"] {
+  --primary: var(--p-text-max);
+  --secondary: var(--p-line-2);
+  height: 2px;
+  border-radius: 0;
+}
+:root[data-agy-theme="paper"] .agy-dialog input[type="range"]::-webkit-slider-thumb {
+  width: 4px;
+  height: 16px;
+  border-radius: 0;
+  background: var(--p-text-max);
+}
+
+/* option cards: ruled boxes; the chosen one in a heavy rule */
+:root[data-agy-theme="paper"] .agy-dialog [role="radio"].rounded-xl {
+  border: 1px solid var(--p-line-3);
+  border-radius: 0;
+  background: transparent;
+  box-shadow: none;
+  color: var(--p-text);
+}
+:root[data-agy-theme="paper"] .agy-dialog [role="radio"].rounded-xl:hover {
+  border-color: var(--p-text);
+}
+:root[data-agy-theme="paper"] .agy-dialog [role="radio"].rounded-xl:is([data-checked], [aria-checked="true"]) {
+  border-color: var(--p-text-max);
+  box-shadow: inset 0 0 0 1px var(--p-text-max);
+  color: var(--p-text-max);
+}
+
+/* fields: a line to write on (the app's layered !important utilities are
+   steered through the variables they read) */
+:root[data-agy-theme="paper"] .agy-dialog :is(input.agy-field, input.bg-muted, .h-8.rounded-lg.bg-muted.border) {
+  --tw-border-style: none;
+  --color-muted: transparent;
+  --tw-inset-shadow: inset 0 -1px 0 var(--p-text);
+  border-style: none;
+  border-radius: 0 !important;
+  background: transparent;
+  box-shadow: var(--tw-inset-shadow);
+  color: var(--p-text-max);
+  font-family: var(--p-font-mono);
+  font-size: 13px !important;
+}
+:root[data-agy-theme="paper"] .agy-dialog :is(input.agy-field:focus, input.bg-muted:focus, .h-8.rounded-lg.bg-muted.border:focus-within) {
+  --tw-inset-shadow: inset 0 -2px 0 var(--p-text-max);
+  outline: none;
+}
+:root[data-agy-theme="paper"] .agy-dialog button[aria-label="Show Remote Control QR code"] {
+  border-color: var(--p-line-3);
+  border-radius: 0;
+}
+:root[data-agy-theme="paper"] .agy-dialog button[aria-label$="color picker"] {
+  border-color: var(--p-text);
+  border-radius: 0;
+}
+
+/* usage rings and token bars: ink on a light rule */
+:root[data-agy-theme="paper"] circle:has(+ [data-testid="quota-progress-circle"]) {
+  stroke: var(--p-line-2);
+  stroke-opacity: 1;
+}
+:root[data-agy-theme="paper"] .rounded-full:has(> svg [data-testid="quota-progress-circle"]) {
+  background: transparent;
+}
+:root[data-agy-theme="paper"] [data-testid="quota-progress-circle"] {
+  stroke: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .agy-dialog {
+  --chart-blue: var(--p-text-max);
+  --chart-green: var(--p-text-2);
+  --chart-purple: var(--p-text-3);
+  --chart-yellow: var(--p-line-3);
+  --chart-orange: var(--p-line-3);
+  --chart-red: var(--p-text-max);
+}
+:root[data-agy-theme="paper"] .agy-dialog .h-2.rounded-full.bg-muted {
+  height: 6px;
+  border: 1px solid var(--p-text);
+  border-radius: 0;
+  background: transparent;
+}
+:root[data-agy-theme="paper"] .agy-dialog .h-2.rounded-full.bg-muted > * {
+  border-radius: 0;
+}
+:root[data-agy-theme="paper"] [data-testid="workspace-customizations-view"] .border.border-border.rounded-xl {
+  --color-border: var(--p-line-2);
+  border-color: var(--p-line-3);
+  border-radius: 0;
+}
+:root[data-agy-theme="paper"] .agy-dialog span.rounded:is(.bg-blue-500\/10, .bg-purple-500\/10, .bg-green-500\/10, .bg-orange-500\/10) {
+  border: 1px solid var(--p-line-3);
+  border-radius: 0;
+  background: transparent;
+  color: var(--p-text-2);
+}
+
+/* "Restart to Update": an ink-ruled square label in small capitals,
+   printed in reverse on hover; no pulse (e-ink) */
+:root[data-agy-theme="paper"] [data-testid="app-update-button"] {
+  animation: none !important;
+}
+:root[data-agy-theme="paper"] [data-testid="app-update-button"]:not(.w-6) {
+  width: auto;
+  height: 24px;
+  padding: 0 10px;
+  border: 1px solid var(--p-text);
+  border-radius: 0;
+  background: transparent;
+  color: var(--p-text-max);
+  font-size: 13px;
+  font-weight: 600;
+  font-variant-caps: all-small-caps;
+  letter-spacing: 0.06em;
+}
+:root[data-agy-theme="paper"] [data-testid="app-update-button"]:not(.w-6):hover {
+  background: var(--p-primary);
+  color: var(--p-primary-ink);
+}
+:root[data-agy-theme="paper"] [data-testid="app-update-button"].w-6 {
+  border-radius: 0;
+  color: var(--p-text-max);
+}
+
+/* Chips in a sent message (quotes, files, terminals): they take the bubble's
+   own ink, not the app's text colors, which are meant for the panel; a 12%
+   tint of that ink marks them, the icon and supporting parts at 80% */
+:root[data-agy-theme="paper"] .agy-user-bubble .inline-pill {
+  color: inherit;
+  background: color-mix(in srgb, currentColor 12%, transparent);
+  border-radius: 0;
+}
+:root[data-agy-theme="paper"] .agy-user-bubble .inline-pill :is(.text-foreground, .text-secondary-foreground) {
+  color: inherit;
+}
+:root[data-agy-theme="paper"] .agy-user-bubble .inline-pill .text-muted-foreground {
+  color: color-mix(in srgb, currentColor 80%, transparent);
+}
+
 /* 80 — Voice Mode & Gemini Live: E-Ink Paper Aesthetic */
 :root[data-agy-theme="paper"] [data-testid="voice-live-pill"] {
   background: var(--p-raised) !important;
@@ -412,3 +849,6 @@ webview[style*="opacity: 0.005"] {
   border-color: var(--p-line-3) !important;
 }
 
+
+/* 90 — Swarm and other sidecar panes: themes/frames/paper.css. They are
+   cross-origin frames; frame-host.js loads that stylesheet inside them. */