/* The rules of the device pf-riddim (src/devices/pf-riddim.js). index.html loads this file after src/tokens.css, so at the same
   specificity a rule of this file wins over a rule of tokens.css. */
pf-riddim { --color: #ded3c1; --radius-device: .15; --ink: #08452c; --accent: #fe5a0e; --label-size: .45; --keybed: #050505; }
pf-riddim[material] > * { --gap: .07; --seat-radius: .05; --seat-edge: .03; --seat-free: 1; }   /* tight holes with nearly square corners */
pf-riddim pf-key { --color: #e2d6c4; --mark: #08452c; }
pf-riddim pf-key.num { --color: #e4e4e2; }
pf-riddim pf-key.orange { --color: #f54a06; --mark: #fff6ee; }
pf-riddim pf-key.green { --color: #034a36; --mark: #f1faf5; }
pf-riddim pf-key.enter { --mark: #f3481d; }
pf-riddim pf-knob { --color: #eeedea; }
pf-riddim pf-knob.x { --color: #fe5716; }
pf-riddim pf-knob.y { --color: #034231; }
pf-riddim pf-led { --color: #ff3d0f; }
pf-riddim > pf-led { --milk: var(--keybed); --diffuser-white: 0; }   /* the lights over the pads: dark when they are off */
/* The lit icons of the display, by the class of their color. */
pf-riddim pf-led.orange { --color: #ffa012; } pf-riddim pf-led.green { --color: #3cff86; } pf-riddim pf-led.blue { --color: #4fc4ff; } pf-riddim pf-led.white { --color: #eefcff; }
pf-riddim pf-led.red { --color: #ff4f1c; } pf-riddim pf-led[label=box] { --color: #ff5a1c; --icon-colors: #45befb; } pf-riddim pf-led[label=square] { --color: #ff6a2a; } pf-riddim pf-led[label=finger] { --color: #f2ffe0; }
pf-riddim pf-led:is([label=conga], [label=guitar]) { --icon-colors: #ff7a1a; } pf-riddim pf-led[label=square-in] { --icon-colors: #ffc58a; }   /* the second color of an icon in two colors */
pf-riddim pf-glass pf-led:where(:not([class])) { --color: #eefcff; }   /* an icon of the display with no color of its own lights white */
pf-riddim pf-key:is([label=sound], [label=fx], [label=erase]) { --plate: #e8e8e6; } pf-riddim pf-key[label=main] { --plate: #fe5410; } pf-riddim pf-key[label=tempo] { --plate: #023a2a; }   /* the plates under the keys with a second function */
pf-riddim pf-key[label=power] { --color: #fd5c19; }
pf-riddim pf-key.art { --mark: #02472c; --icon-colors: #fe5410; } pf-riddim pf-key.art:is([label=ball], [label=square]) { --mark: #fe5410; }   /* the art of the keys: green, and orange over it */
pf-riddim [label=record] > pf-led { --color: none; }   /* a backlight with no color of its own: the orange key lights */
pf-riddim pf-fader { --color: #e6dccb; --mark: #08452c; }
pf-riddim pf-glass { --color: #34aa83; --glass-veil: .04; --glass-floor: tint; }   /* the display is an LCD: its floor is the tint */
pf-riddim pf-digits { --color: #e8fdfd; }
pf-riddim pf-plate.label { --color: #eeede9; --ring: #d9d8d3; --brand: #fe6b0b; --tagline: #0c3220; }   /* the colors that the pieces of a plate name, as fill="var(--brand)" */
pf-riddim [label=logo] { --color: #025633; }
pf-riddim pf-plate.grill { --color: #e9dfcf; --pinhole: #151412; }
pf-riddim [label=ports] { --band: #e6dbc9; --output: #f3f3ef; --output-ink: #127a49; --input: #fe5102; --sync: #014f3c; --usb: #e9dcc8; --paper: #fbfaf6; }
pf-riddim [label="speaker cavity"] { --color: #0c2e22; } pf-riddim pf-plate.cap { --color: #4c3d3d; }
pf-riddim pf-screw { --color: #5a5c5e; }
pf-riddim pf-speaker { --color: #141312; }