{ "id": "v1-te-4444", "long_id": "v1.table-era-90s.portal.s04.p04.t04.u04", "name": "Table-era catalogue front, 1999", "era": { "slug": "table-era-90s", "code": "te", "name": "Table-era web", "years": [ 1996, 2000 ], "description": "The first commercial web, 1996 to 2000: narrow fixed pages built from tables, blue underlined links on white or grey, Times and Arial at their default sizes, bevelled form buttons, and flat colour strips where a designer wanted emphasis." }, "archetype": "portal", "mode": "pure", "viewport": { "width": 800, "fluid": false }, "summary": "A catalogue and company front page as built between 1996 and 2000: one fixed 760px table centred in an 800px window, a row of square folder tabs standing on a filled strip, and under it three columns, outlined link boxes on the left, the features in the middle and outlined boxes on the right. Running text is the browser's 16px serif, everything else (tabs, boxes, lists of links, controls, small print) is 13px or 10px sans-serif, and links are underlined pure red on white, with a navy wordmark, one gold strip and light grey fills. It was the standard skeleton of shops, software companies and institutions that had more departments than a single column could list, until stylesheet layouts replaced it after 2000.", "url": "https://chrono.skin/s/v1-te-4444", "preview_url": "https://chrono.skin/s/v1-te-4444/specimen.html", "files": { "STYLE.md": "# Table-era catalogue front, 1999\n\n## Summary\n\nA catalogue and company front page as built between 1996 and 2000: one fixed 760px table centred in an 800px window, a row of square folder tabs standing on a filled strip, and under it three columns, outlined link boxes on the left, the features in the middle and outlined boxes on the right. Running text is the browser's 16px serif, everything else (tabs, boxes, lists of links, controls, small print) is 13px or 10px sans-serif, and links are underlined pure red on white, with a navy wordmark, one gold strip and light grey fills. It was the standard skeleton of shops, software companies and institutions that had more departments than a single column could list, until stylesheet layouts replaced it after 2000.\n\n## Layout\n\n- The page is fixed, not fluid, and centred: `--size-page` is 760px and `.ds-page__frame` sits in the middle of the window with the spare width split on both sides. Nothing stretches with the window and nothing is pushed to one side.\n- The specimen is one example site, a catalogue shop, of five views. `.ds-nav` and `.ds-footer` are written once, outside the views; each view is a `.ds-view` section and one shows at a time.\n- Order from the top: `.ds-nav`, then the view, then the `.ds-footer`. The `.ds-nav` is three rows: `.ds-nav__top` (the `.ds-brand` at the left, a 10px tagline, three 10px account links at the right), the `.ds-nav__links` row of folder tabs, and the `.ds-nav__strip`, a filled strip the tabs stand on, holding the search form at the left and three 10px links at the right. There is no vertical navigation rail and no row of text links.\n- The home view is `.ds-page__columns`, three columns: `--size-left` (150px) for the `.ds-sidebar`, a stack of outlined link boxes; the middle column `.ds-page__main` (416px); and `--size-right` (170px) for `.ds-page__side`, a stack of `.ds-panel` boxes closed by a small centred `.ds-notice`. Gutters are `--space-4` (12px). The middle column runs: the `.ds-hero` feature box, a `.ds-heading` over the `.ds-list` of new items, then the `.ds-grid` of four department boxes. The side columns carry enough boxes to end near the foot of the middle one.\n- Inner pages (a department, a request form, the basket, a help page) keep the `.ds-nav` with its tabs and strip and the `.ds-footer`, and drop all three columns. `.ds-page__inner` is one column at the full 760px. It opens with `.ds-page__head`, which stacks without gaps the `.ds-breadcrumb`, the `.ds-page-header` (title and one line at the left, one button at the right) and the `.ds-tabs` row of small folder tabs standing on a 2px rule. Below come `.ds-stat` when the page has figures and the `.ds-table` at full width with the `.ds-pagination` under it, or a full-width `.ds-empty`, or `.ds-page__pair`: two equal halves, running text or a list in the left `.ds-page__half` and notices, the `.ds-form`, a message box, a small table or panels in the right one, which carries `.ds-page__half--ruled` for the 1px rule between them. What the side columns held on the home page is reached through the tabs.\n- Views: `welcome` is the shop front (link boxes, feature of the month, new items, department boxes, panels). `gardening` is one department: figures, the table of titles with its status key, and the page keys. `request` is the book search form with its notices and the message box that cancelling a request opens, beside a short account of how the search works and a list of recent finds. `basket` is the order basket while it is empty: the empty state over new titles and a panel of assurances. `help` is a page of running text with a line of related links, beside the postage table, a panel of questions and a notice. The folder tab of the view that is showing is raised and takes the fill of the strip; the welcome tab is raised when the address names no view; on the basket view no tab is raised and the basket link above the tabs is bold instead.\n- Blocks are separated by 1px outlines, title strips and flat fills, never by cards with shadows or wide gutters. Every box in a side column has an outline and a title strip.\n- Spacing scale: `--space-1` 2px is the padding of title strips, tabs and controls and the gap between tabs; `--space-2` 4px is cell padding and the gap between a mark and its name; `--space-3` 8px is the page margin, the padding of boxes, paragraph spacing and the gap between buttons, figure boxes and department boxes; `--space-4` 12px is the gutter between columns and the gap between neighbouring blocks; `--space-5` 16px is the foot of the page; `--space-6` 20px is the indent of numbered and bulleted lists.\n- Fixed sizes: `--size-art` 84px cover block in the feature box, `--size-search` 200px search field, `--size-label` 110px form label column, `--size-field` 180px text input, `--size-area` 220px textarea, `--size-check` 13px checkbox, `--size-dialog` 340px message box.\n\n## Typography and colour roles\n\n- Family: pure red links and navy on white, with one gold strip, three light greys, maroon for visited links and errors, dark green and orange for status.\n- `--color-page`, `--color-canvas`, `--color-surface` are white `#ffffff`; `--color-surface-alt` `#efefef` is the resting folder tabs of an inner page, alternate table rows and the empty state; `--color-surface-strong` `#e0e0e0`.\n- `--color-bar` `#ffe888` (gold, black text, red links) is the current tab, the strip under the tabs, panel title strips, the table head and the 2px rule under the view tabs. `--color-bar-alt` `#e0e0e0` (grey, black text) is the resting tabs, sidebar and form title strips, figure labels and the footer link strip.\n- `--color-inverse` `#003098` (navy, white text) is the message box title bar only. The same navy is `--color-heading-alt` (the brand name, section headings, h3, positive figures), `--color-accent` (the solid badge, white text) and `--color-link-active`.\n- Links are pure red `--color-link` `#ff0000`, always underlined; visited is maroon `--color-link-visited` `#900000`; hover equals the link colour because the era had no hover effect.\n- Text is `--color-text` black; `--color-text-muted` `#686868` is for counts, the meta line under a list entry and the legal line. `--color-heading` is black.\n- `--color-accent-alt` `#900000` (maroon) is the kicker over the feature title, prices, the \"New!\" word, the star of a required field and negative figures. `--color-danger` is the same maroon: error text is bold and never underlined, which is what tells it from a red link.\n- `--color-fill-1` to `--color-fill-4` are `#efefef`, `#e0e0e0`, `#ffe888`, `#ffffff`: the title strips of the four department boxes. `--color-fill-1` is also the feature box and the form box; `--color-fill-3` is the cover block. They carry black text and red links.\n- `--color-success` `#006600` and `--color-danger` `#900000` carry white text as fills; `--color-warning` `#ff5000` (orange) is a fill only and carries black text. Notices are grey `#efefef`; the error notice is maroon text on white in a maroon outline.\n- Borders: `--color-border` `#989898` for every outline, `--color-border-strong` `#000000` for the cover block and the rule under a section heading, `--color-border-muted` `#c0c0c0` for the rules between rows and for bevels, `--color-input-border` `#c0c0c0` for input bevels.\n- Two families and a code face. `--font-body` (Times New Roman, Times) sets running text, feature text and table data. `--font-heading` and `--font-ui` (Trebuchet MS, one of the 1996 core web fonts, falling back to Arial) set the brand name, headings, title strips, tabs, every list of links in a box, forms, buttons, notices and all small print. `--font-mono` (Courier New) is for code and textareas.\n- Sizes: `--text-base` 16px for running text; `--text-ui` 12px for tabs, the strip, box lists, meta lines, the line under a table entry, department box text, forms and buttons; `--text-small` 11px for the tagline, account links, kickers, table heads, figure labels, view tabs, captions and the footer; `--text-h3` 13px bold for title strips; `--text-h2` 16px bold for section headings; `--text-large` 18px for the feature title, figures and a lead line; `--text-h1` 20px for a page title; `--text-display` 24px for the brand name only. Line height is `normal` everywhere; bold is 700.\n- No uppercase transform and no letter spacing; capitals in kickers and status labels are typed. All three link decorations are `underline`.\n- `--border-width` 1px `solid` for outlines and rules, `--border-width-strong` 2px for the rule the view tabs stand on and control bevels. The surface is shaded the way shop fronts of 1999 shaded their bars with a strip of picture: `--fill-bar`, `--fill-bar-alt`, `--fill-inverse` and `--fill-accent` run from a much lighter mix of the palette colour at the top to the colour itself at the bottom, and so do the three button fills. `--fill-panel`, `--fill-input` and `--fill-page` stay flat. Boxes and the sheet carry a 1px outline with a 2px edge at the right and bottom (`--shadow-panel`, in `--color-border-muted`) and the message box a 2px one (`--shadow-dialog`, in `--color-border`), none of them blurred; the control and text shadows are `none`. Radius 0; `--focus-ring` is `1px dotted`; `--transition` is `none`.\n- Not expressible by a token, written literally in `components.css`: the bevel of buttons, selects, page keys, the brand tile and the message box is `border-style: outset` and of inputs, checkboxes, pressed buttons and the current page key `inset`, drawn in `--color-border-muted` and `--color-input-border`.\n\n## Components\n\n- `.ds-page`: on ``; page fill and body type. `.ds-page__frame` is the centred 760px column; `.ds-page__columns` the three-column grid of the home page; `.ds-page__main` the middle column and `.ds-page__side` the right one, both with `--space-4` between blocks. On inner pages `.ds-page__inner` is the single full-width column, `.ds-page__head` stacks path, page header and view tabs, and `.ds-page__pair` sets two `.ds-page__half` columns side by side, the second with `.ds-page__half--ruled`. The page margin is padding inside `.ds-page__frame`, not on ``: when a palette gives `--color-canvas` a colour of its own the frame shows as a sheet on the page and its content keeps that margin from the sheet edge. `.ds-page__frame` takes `--shadow-panel` as well, so a surface set that outlines its boxes also outlines the sheet.\n- `.ds-nav`: header. `.ds-nav__top` holds the `.ds-brand`, `.ds-nav__tagline` and `.ds-nav__tools` (`.ds-nav__tool` items separated by bars). `.ds-nav__links` is the row of folder tabs: each `.ds-nav__link` is an outlined cell in `--fill-bar-alt` with no bottom border; the tab of the view that is showing is taller, bold and takes `--fill-bar`, the fill of the strip it stands on (`components.css` has one selector per view for this, and `is-current` does the same by hand). `.ds-nav__strip` is that strip: `.ds-nav__search` (a bold `.ds-nav__label`, a select, `.ds-nav__field`, a button) at the left and `.ds-nav__aside`, a 10px line of links, at the right.\n- `.ds-brand`: the site's mark and name, at the left of `.ds-nav__top`. `.ds-brand__mark` is a small square tile dressed like the button (`--fill-button` over `--color-button`, `--color-button-text` for the drawing, the 2px `outset` bevel in `--color-border-muted`, `--radius-control`, `--shadow-control`), so every palette and surface reskins it; it holds the mark as inline SVG painted with `currentColor`, drawn with square line caps, a 3 unit stroke and crisp edges. `.ds-brand__name` is the name in the heading family at `--text-display`, with the heading weight, tracking and transform, in `--color-heading-alt`. The name `chronoskin` and its mark are placeholders for the installing project's own name and logo.\n- `.ds-hero`: the feature of the week, the era's page introduction: an outlined box on `--color-fill-1` with `.ds-hero__art` (a flat `--color-fill-3` block holding a `.ds-hero__glyph`, standing where the period put a cover picture) at the left, and at the right `.ds-hero__kicker` (10px bold capitals), `.ds-hero__title` (18px bold), `.ds-hero__lead` and `.ds-hero__action` (a bold `.ds-hero__price`, one button, a 10px `.ds-hero__more` link). Never a full-width banner and never taller than its text.\n- `.ds-page-header`: the head of an inner page, used instead of `.ds-hero`: `.ds-page-header__text` with `.ds-page-header__title` (20px bold) and `.ds-page-header__lead` (one line), and `.ds-page-header__action` with one button at the right. No fill and no border of its own: the view tabs and their rule close it.\n- `.ds-prose`: running text; styles `h1`, `h2`, `h3`, `p`, `ul`, `ol`, `strong`, `code`; `.ds-prose__lead` for an 18px lead line.\n- `.ds-link`: every link. States `is-visited`, `is-hover`, `is-active`, `is-focus`. `.ds-link--quiet` for secondary links in the sans face, `.ds-link--strong` for bold links. `.ds-links` wraps a line of links.\n- `.ds-button`: grey bevelled button with a 12px label, on a `\n \n

Browse by subject | Bestsellers | Out of print?

\n \n \n\n
\n\n
\n\n
\n\n \n\n
\n\n
\n
\n
\n

BOOK OF THE MONTH

\n

A Year on the Salt Marsh

\n

Twelve walks, one for each month, with tide tables and a bird list for every season. Hardback, 240 pages, posted the day you order.

\n
\n Our price: $14.95\n \n Read chapter one\n
\n
\n
\n\n
\n

New This Week see all 48

\n
    \n
  • \n Ledgerbook Home Accounts 3.0\n Keeps a household's books and prints the forms at the end of the year.\n Software, CD-ROM. $39.00. Ships in 24 hours.\n
    • \n
  • \n Songs from the Lower Deck\n Twenty shanties recorded on a working ferry, with the words in the booklet.\n Music, compact disc. $11.50. Ships in 2 to 3 days.\n
    • \n
  • \n The Allotment Almanac\n What to sow and when, month by month, for a plot of any size.\n Books, paperback. $8.95. Ships in 24 hours.\n
    • \n
\n

More new titles...

\n
\n\n
\n
\n

Books

\n

Fiction, travel, cookery, crafts and 30 more subjects.

\n
\n
\n

Music

\n

Folk, jazz, brass bands and the classical catalogue.

\n
\n
\n

Software

\n

Home, school and small office, with free trial copies.

\n
\n
\n

Gifts

\n

Vouchers, boxed sets and wrapping for a dollar.

\n
\n
\n\n
\n\n
\n
\n

Top Sellers all 100

\n
\n
    \n
  1. The Tide Clock
    2. \n
  2. Bread at Home
    3. \n
  3. Typing Tutor 5
    4. \n
  4. Hill Farm Diary
    5. \n
  5. Atlas of Canals
    6. \n
\n

Updated hourly

\n
\n
\n
\n

Company News

\n
\n

New warehouse opens in Port Alder

\n

Free trial of Ledgerbook 3.0

\n

Autumn catalogue now in the post

\n

Press room

\n
\n
\n
\n

Order With Confidence

\n
\n

Every page that asks for a card number is sent in code. If you would rather not, order by telephone.

\n

Anything may be returned within 30 days.

\n
\n
\n
\n

Bargain Shelf all 60

\n
\n

Roses for Cold Gardens, hardback, now $19.50.

\n

Typing Tutor 4, boxed, now $12.00.

\n
\n
\n

Free postage on every order of three items or more until June 30.

\n
\n\n
\n\n
\n\n
\n
\n\n
\n \n
\n
\n

Gardening

\n

Every gardening title in stock, with the date it can leave the warehouse.

\n
\n
\n View Basket\n
\n
\n \n
\n\n
    \n
  • 412 titles in stock
    • \n
  • 36 new this month
    • \n
  • 24 hrs usual dispatch
    • \n
  • 1,208 readers' reviews
    • \n
\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
\n Key: IN STOCK leaves today ON ORDER two weeks OUT OF PRINT we will search for a copy NEW added this month\n Prices are in US dollars and do not include postage. Postage rates | Sort by author\n
TitleFormatStatusOur PriceYou Save
The Allotment Almanac NEW R. Okafor. What to sow and when, month by month.PaperbackIN STOCK8.951.00
Roses for Cold Gardens M. Lindqvist. Sixty hardy kinds, with pruning charts.HardbackIN STOCK19.503.45
The Small Greenhouse P. Arden. Building, heating and filling one.PaperbackON ORDER12.002.00
Hedges and Their Keeping T. Marsh. The 1974 handbook, long sought after.HardbackOUT OF PRINT24.000.00
A Year on the Salt Marsh J. Whitlow. Twelve walks, with a bird list for every season.HardbackIN STOCK14.952.55
Titles 6 to 10 of 412. Show 25 to a page
\n\n
    \n
  1. Page 2 of 83
    2. \n
  2. < Previous
    3. \n
  3. 1
    4. \n
  4. 2
    5. \n
  5. 3
    6. \n
  6. 4
    7. \n
  7. 5
    8. \n
  8. Next >
    9. \n
\n\n
\n
\n\n
\n
\n\n
\n \n
\n
\n

Book Search

\n

Out of print? Leave a request and our desk will look for a copy.

\n
\n
\n Back to Books\n
\n
\n \n
\n\n
\n
\n
\n

How the search works

\n

Our book search desk writes to 200 second-hand dealers each week. When a copy turns up we tell you its condition and its price, and you decide.

\n
    \n
  • A request costs nothing and stays open for a year.
    • \n
  • You are never obliged to buy the copy we find.
    • \n
  • Most titles are found within six weeks.
    • \n
\n
\n
\n

Found This Month see all 61

\n
    \n
  • \n Hedges and Their Keeping\n The 1974 handbook, in its dust jacket, from a dealer in Port Alder.\n Hardback, good. $24.00. Found in 3 weeks.\n
    • \n
  • \n Knots for Small Boats\n A school prize copy with the owner's notes in pencil.\n Paperback, fair. $6.50. Found in 5 weeks.\n
    • \n
\n
\n
\n\n
\n
\n

Note: requests sent before 3 p.m. reach the desk the same day.

\n

Sorry! We could not take your request. Please correct the marked field.

\n
\n
\n

Book Search Request

\n
\n \n
\n \n Please give the title or the author.\n
\n \n
\n \n
\n \n
\n \n (whole dollars)\n
\n \n
\n \n
\n Also:\n
\n \n \n
\n \n
\n \n
\n
\n
\n \n \n \n \n
\n
\n
\n

Cancel this request?

\n

The desk will stop looking for this title. Your other requests are not changed.

\n
\n \n \n
\n
\n
\n
\n\n
\n
\n\n
\n
\n\n
\n \n
\n
\n

Order Basket

\n

Titles you choose wait here until you are ready to order.

\n
\n
\n Continue Shopping\n
\n
\n \n
\n\n
\n

Your basket is empty.

\n

Titles you choose are kept here for 30 days. Browse the gardening shelf to begin.

\n Continue Shopping\n
\n\n
\n
\n

New This Week see all 48

\n
    \n
  • \n The Allotment Almanac\n What to sow and when, month by month, for a plot of any size.\n Books, paperback. $8.95. Ships in 24 hours.\n
    • \n
  • \n Songs from the Lower Deck\n Twenty shanties recorded on a working ferry, with the words in the booklet.\n Music, compact disc. $11.50. Ships in 2 to 3 days.\n
    • \n
\n
\n
\n
\n

Order With Confidence how it works

\n
\n

Every page that asks for a card number is sent in code. We do not charge your card until the parcel is sealed.

\n

Anything may be returned within 30 days.

\n
\n
\n

Free postage on every order of three items or more until June 30.

\n
\n
\n\n
\n
\n\n
\n
\n\n
\n \n
\n
\n

Support

\n

How ordering, paying, posting and returning work.

\n
\n
\n Order Basket\n
\n
\n \n
\n\n
\n
\n
\n

How ordering works

\n

Choose, fill in one form, and the parcel leaves the next working day.

\n

Everything marked in stock is on our own shelves. We do not charge your card until the parcel is sealed.

\n

Paying

\n

Pay by card on this site, or print the order form and post it with a cheque. Quote the code CS-GARDEN on the back.

\n
    \n
  • Postage is charged once for each parcel.
    • \n
  • Three items or more travel free.
    • \n
  • Anything may be returned within 30 days.
    • \n
\n

Out of print titles

\n

Leave a request and our book search desk will write to you when a copy is found.

\n
\n

\n See also:\n book search,\n the gardening shelf,\n gift wrapping,\n the order form to print,\n catalogue by post,\n your basket\n

\n
\n\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
Postage for one parcel, in US dollars. Three items or more travel free.
ParcelInlandAbroad
One book or disc2.505.00
Two items3.507.50
Boxed software4.009.00
Gift wrapping1.001.00
\n
\n

Most Asked all 40

\n
\n
    \n
  1. Where is my parcel?
    2. \n
  2. How do I send something back?
    3. \n
  3. Can you find an old book?
    4. \n
  4. Is it safe to type my card number?
    5. \n
\n

Write to the desk

\n
\n
\n

By telephone: the order desk answers from 8 a.m. to 8 p.m., Monday to Saturday.

\n
\n
\n\n
\n
\n\n
\n\n \n\n\n\n\n", "style.json": "{\n \"id\": \"v1.table-era-90s.portal.s04.p04.t04.u04\",\n \"library\": \"2026.10.07-2111\",\n \"era\": {\n \"slug\": \"table-era-90s\",\n \"years\": [\n 1996,\n 2000\n ]\n },\n \"archetype\": \"portal\",\n \"mode\": \"pure\",\n \"markup\": \"modern\",\n \"viewport\": {\n \"width\": 800,\n \"fluid\": false\n },\n \"source\": \"https://chrono.skin/s/v1-te-4444\",\n \"short\": \"v1-te-4444\"\n}\n", "tokens.css": "/* @part palette */\n:root {\n --color-page: #ffffff;\n --color-canvas: #ffffff;\n --color-surface: #ffffff;\n --color-surface-alt: #efefef;\n --color-surface-strong: #e0e0e0;\n --color-bar: #ffe888;\n --color-bar-text: #000000;\n --color-bar-alt: #e0e0e0;\n --color-bar-alt-text: #000000;\n --color-inverse: #003098;\n --color-inverse-text: #ffffff;\n --color-text: #000000;\n --color-text-muted: #686868;\n --color-heading: #000000;\n --color-heading-alt: #003098;\n --color-link: #ff0000;\n --color-link-quiet: #ff0000;\n --color-link-visited: #900000;\n --color-link-hover: #ff0000;\n --color-link-active: #003098;\n --color-border: #989898;\n --color-border-strong: #000000;\n --color-border-muted: #c0c0c0;\n --color-accent: #003098;\n --color-accent-text: #ffffff;\n --color-accent-alt: #900000;\n --color-fill-1: #efefef;\n --color-fill-2: #e0e0e0;\n --color-fill-3: #ffe888;\n --color-fill-4: #ffffff;\n --color-button: #efefef;\n --color-button-text: #000000;\n --color-button-hover-text: #000000;\n --color-button-secondary: #c0c0c0;\n --color-button-secondary-text: #000000;\n --color-input: #ffffff;\n --color-input-text: #000000;\n --color-input-border: #c0c0c0;\n --color-disabled: #efefef;\n --color-disabled-text: #989898;\n --color-danger: #900000;\n --color-danger-surface: #ffffff;\n --color-success: #006600;\n --color-warning: #ff5000;\n --color-notice: #efefef;\n --color-notice-text: #000000;\n --color-focus: #000000;\n --color-shadow: #000000;\n --color-overlay: #ffffff;\n}\n\n/* @part type */\n:root {\n --font-body: \"Times New Roman\", Times, serif;\n --font-heading: \"Trebuchet MS\", Arial, Helvetica, sans-serif;\n --font-ui: \"Trebuchet MS\", Arial, Helvetica, sans-serif;\n --font-mono: \"Courier New\", Courier, monospace;\n --text-base: 16px;\n --text-small: 11px;\n --text-ui: 12px;\n --text-large: 18px;\n --text-display: 24px;\n --text-h1: 20px;\n --text-h2: 16px;\n --text-h3: 13px;\n --line-body: normal;\n --line-heading: normal;\n --line-display: 1;\n --weight-body: 400;\n --weight-bold: 700;\n --weight-heading: 700;\n --weight-display: 700;\n --weight-ui: 400;\n --heading-transform: none;\n --heading-tracking: 0;\n --display-tracking: 0;\n --ui-transform: none;\n --link-decoration: underline;\n --link-decoration-hover: underline;\n --link-decoration-quiet: underline;\n}\n\n/* @part surface */\n:root {\n --border-width: 1px;\n --border-width-strong: 2px;\n --border-style: solid;\n --radius-control: 0;\n --radius-panel: 0;\n --radius-pill: 0;\n --radius-page: 0;\n --shadow-panel: 0 0 0 1px var(--color-border-muted), 2px 2px 0 1px var(--color-border-muted);\n --shadow-control: none;\n --shadow-control-hover: none;\n --shadow-control-pressed: none;\n --shadow-dialog: 2px 2px 0 var(--color-border);\n --shadow-text: none;\n --fill-page: var(--color-page);\n --fill-bar: linear-gradient(color-mix(in srgb, var(--color-bar) 20%, white), var(--color-bar));\n --fill-bar-alt: linear-gradient(color-mix(in srgb, var(--color-bar-alt) 20%, white), var(--color-bar-alt));\n --fill-inverse: linear-gradient(color-mix(in srgb, var(--color-inverse) 55%, white), var(--color-inverse));\n --fill-accent: linear-gradient(color-mix(in srgb, var(--color-accent) 55%, white), var(--color-accent));\n --fill-panel: var(--color-surface);\n --fill-button: linear-gradient(color-mix(in srgb, var(--color-button) 30%, white), var(--color-button));\n --fill-button-hover: linear-gradient(color-mix(in srgb, var(--color-button) 30%, white), var(--color-button));\n --fill-button-secondary: linear-gradient(color-mix(in srgb, var(--color-button-secondary) 45%, white), var(--color-button-secondary));\n --fill-input: var(--color-input);\n --focus-ring: 1px dotted var(--color-focus);\n --transition: none;\n --backdrop-blur: 0px;\n}\n" } }