/* Semantic surface owner. Mark the existing module explicitly; never infer a
   role from whether it currently happens to contain an input or a number. */
[data-ui-role="guide"] {
  --ui-role-bg:#f1eee6;--ui-role-head:#eae5d9;--ui-role-line:#cec4b4;
  --ui-role-ink:#595247;--ui-role-accent:#82735e;--ui-role-tag:#e5dfd2;
  --ui-role-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='6.1' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='M7.2 7h1.6v5H7.2zM7.2 4h1.6v1.7H7.2z'/%3E%3C/svg%3E");
}
[data-ui-role="input"] {
  --ui-role-bg:#fffdf7;--ui-role-head:#fff0d6;--ui-role-line:#c29b61;
  --ui-role-ink:#714519;--ui-role-accent:#b5762e;--ui-role-tag:#f8e5bb;
  --ui-role-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3 10 7.7-7.7 3 3L6 13l-4 1zm6.4-6.4 3 3' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
[data-ui-role="result"] {
  --ui-role-bg:#f0f5e7;--ui-role-head:#e3ecd5;--ui-role-line:#8da470;
  --ui-role-ink:#3a552a;--ui-role-accent:#6b884c;--ui-role-tag:#dbe8c6;
  --ui-role-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 13.5h12M3 11V8m5 3V3m5 8V5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
/* Existing page sheets already consume these tokens. Descendant modules reset
   them with their own role, so an input inside a result retains its identity. */
[data-ui-role] {
  --maple-surface:var(--ui-role-bg);--maple-panel:var(--ui-role-head);
  --maple-line:var(--ui-role-line);
  background:var(--ui-role-bg)!important;
  border-color:var(--ui-role-line)!important;
  border-style:solid;border-width:1px;
  border-radius:14px;
  box-shadow:none!important;
  min-width:0;
}
body.ui-maple-v2 [data-ui-role] {background:var(--ui-role-bg)!important;border-color:var(--ui-role-line)!important}
[data-ui-role="guide"] {border-inline-start:3px solid var(--ui-role-line)!important}
[data-ui-role="guide"] figcaption>strong {color:var(--ui-role-ink)!important}
[data-ui-role="input"] {border-inline-start:4px solid var(--ui-role-accent)!important;box-shadow:0 2px 0 #b5762e15!important}
[data-ui-role="result"] {border-block-start:4px solid var(--ui-role-accent)!important}
[data-ui-role="input"]:focus-within {outline:2px solid #b5762e66;outline-offset:3px}
/* Borders and spacing stay on the existing shell; do not change display,
   positioning, grid columns, dimensions, overflow, hidden or dialog behavior. */
[data-ui-surface="flat"] {border-radius:10px;box-shadow:none!important}
[data-ui-surface="metric"] {background:var(--ui-role-bg)!important;border-color:var(--ui-role-line)!important;box-shadow:none!important}
[data-ui-surface="cell"],:is(input,select,textarea)[data-ui-role] {border-width:1px!important;border-radius:0;box-shadow:none!important}
[data-ui-surface="cell"] {border-inline-start-width:1px!important;border-block-start-width:1px!important}
th[data-ui-surface="cell"] {white-space:normal!important}
th[data-ui-surface="cell"]>.ui-role-label {display:flex!important;margin-inline:auto;margin-block-end:5px}
:is(input,select,textarea)[data-ui-role] {border-radius:8px}
.ui-role-pad {padding:14px 16px}
.ui-role-label {
  display:inline-flex!important;align-items:center;gap:5px;
  width:max-content;max-width:100%;vertical-align:middle;
  margin:0 8px 2px 0;padding:3px 7px;
  border:1px solid var(--ui-role-line,#cec4b4);border-radius:6px;
  background:var(--ui-role-tag,#e5dfd2)!important;
  color:var(--ui-role-ink,#595247)!important;
  font-size:12px!important;font-weight:700!important;
  line-height:1.4!important;letter-spacing:0!important;text-decoration:none;
  white-space:nowrap;flex-shrink:0;
}
.ui-role-label::before {content:"";display:block;width:13px;height:13px;flex:0 0 13px;background:currentColor;mask:var(--ui-role-icon) center/contain no-repeat}
[data-ui-role]>.ui-role-label {grid-column:1/-1;justify-self:start;align-self:start;margin:0 0 8px}
[data-ui-role] :is(input,select,textarea):not(:disabled):not([aria-invalid="true"]) {background-color:#fffefb!important}
@media(max-width:600px){.ui-role-pad{padding:12px}.ui-role-label{margin-inline-end:6px;padding:2px 6px}}
@media(forced-colors:active){[data-ui-role],.ui-role-label{border-color:CanvasText!important;box-shadow:none!important}[data-ui-role="input"]:focus-within{outline-color:Highlight}}
