/* ========================================================================= AANGAN · PAINTED ENAMEL — the menus stop being chalk (skin) ------------------------------------------------------------------------- Owner, 2026-08-01: "Get rid of the chalk based thing in any menu other than hopscotch. It's not going well on the menu." Chalk was right when every screen was a courtyard floor. It is not right now: the menus are ROOMS — a painted almirah, a kirana, a showcase, a dressing table, a baithak, a wall — and a chalk outline floating on teak or on enamel is a drawing of a control sitting on a photograph of a room. It never belonged to the surface it was on. WHAT REPLACES IT IS ALREADY IN THE HOUSE. Three things in this app are painted the same way, and all three shipped before this file existed: the almirah's compartment name plaques (cream ground, blue lettering), the kirana's tin signs, and the notice board's enamel board. So the menus become that — PAINTED ENAMEL: a cream plaque with a thin keyline, lit along its top edge, sitting on the room rather than hovering over it. Nothing new is invented; the room's own sign-painter did the controls too. SCOPE: every pane EXCEPT #panePlay, PLUS the games drawer. The courtyard keeps its chalk, because there the chalk IS the drawing — the hopscotch is chalk on the ground and nothing about it changed. The drawer had to be named separately and that is worth remembering: it hangs off #homeOv rather than living inside a pane (it is fixed to the viewport, see css/almirah.css), so a pane-scoped sweep misses it entirely. It came out of the first pass as the one screen still drawn in chalk, and it is the screen you see every time you pick a game. Two rooms are left alone inside that scope, because they already replaced chalk with something of their own and are not floating cards: · #gamewrap .gcard the almirah's compartments (css/almirah.css) · #paneShop .shoptile the kirana's bill-book rows (css/kirana.css) Loads last, after every chalk sheet and after every room, so it can undo the outline without touching the stylesheets that draw it. A SKIN. No element, id or listener changes. Remove this file and the chalk menus come back exactly as they were. ========================================================================= */ /* ---------------- 1. take the chalk outline off ---------------- Every one of these is a `::before` carrying a roughened border and `filter:url(#ckRoughFine)`. The filter is the expensive part — an SVG filter on a few dozen elements — so this is also the cheapest the menus have been. */ #homeOv :is(.pane:not(#panePlay), .almsheet) .gcard::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .wallrow::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .achgame::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcard::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .subcard::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .cbtn::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .pftile::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .memberrow::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcall::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .selgame::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .galipill::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .grouprow::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .btn::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .codechip::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourg::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .subtier::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .achclaim::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .tcall-chk::before, #homeOv :is(.pane:not(#panePlay), .almsheet) .se-t::before, /* THE SHOP'S SUB-TABS ARE EXEMPT, and this is why. This list strips the CHALK OUTLINE that chalk-home.css draws on every button in every pane — a real cleanup, because a chalk scribble has no business on a tin tab. But the four sub-tabs in the kirana are the one place where ::before is not an outline: it carries the CATEGORY ICON (kirana.css, `--ico` per tab, masked in currentColor). This blanket kill loads after kirana.css and with !important, so it silently deleted all four icons — the owner saw four bare word labels with an empty 27px of padding above each one where the mark should have been (owner 2026-08-10, "these tabs in shop section do not have any icon"). The chalk outline is already neutralised there by kirana.css's own `border:0 !important` on the same pseudo-element, so exempting the shop brings back the icon without bringing back the scribble. */ #homeOv :is(.pane:not(#panePlay):not(#paneShop), .almsheet) .subtabs > button::before{ content:none !important} /* the sub-tabs across the top of the Wall and the Profile: three tin tabs on a rail, the chosen one brass. Found by listing what still carried the chalk filter rather than by reading the markup — they have no class at all, only ids, which is exactly the kind of thing a selector sweep misses. */ #homeOv :is(.pane:not(#panePlay), .almsheet) .subtabs > button{ background:linear-gradient(180deg,#f7f0df,#e6dbc2) !important; border:1.3px solid rgba(28,80,127,.38) !important;border-radius:3px !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.9), 0 1px 3px rgba(24,14,5,.3) !important; color:#3b2a14 !important;text-shadow:0 1px 0 rgba(255,255,255,.55) !important} #homeOv :is(.pane:not(#panePlay), .almsheet) .subtabs > button.on{ background:linear-gradient(180deg,#f7dc95,#d3a63f) !important; border-color:#8d6a1c !important;color:#3d2a06 !important} /* the skin thumbnails keep a ring — it is how "equipped" is shown — but it is a brass bead now rather than a chalk scribble */ #homeOv :is(.pane:not(#panePlay), .almsheet) .se-t{ box-shadow:0 0 0 2px rgba(24,80,127,.3), 0 2px 4px rgba(24,14,5,.4) !important; border-radius:4px !important} #homeOv :is(.pane:not(#panePlay), .almsheet) .se-t.sel{ box-shadow:0 0 0 3px #d3a63f, 0 2px 6px rgba(24,14,5,.5) !important} #homeOv :is(.pane:not(#panePlay), .almsheet) .tcall-chk{ background:linear-gradient(180deg,#fbf5e6,#e9dec4) !important; border:1.4px solid rgba(28,80,127,.42) !important;border-radius:3px !important} /* ---------------- 2. the plaque ---------------- Enamel over pressed tin: a cream ground that is very slightly warmer at the bottom, one hairline keyline, a lit top edge and a shadow under it. The radius is 4px, not 16 — a painted sign is cut square and only the corners of the tin are eased. */ #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn, #homeOv :is(.pane:not(#panePlay), .almsheet) .selgame, #homeOv :is(.pane:not(#panePlay), .almsheet) .galipill, #homeOv :is(.pane:not(#panePlay), .almsheet) .grouprow, #homeOv :is(.pane:not(#panePlay), .almsheet) .cbtn, #homeOv :is(.pane:not(#panePlay), .almsheet) .subcard, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcard, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcall, #homeOv :is(.pane:not(#panePlay), .almsheet) .achgame, #homeOv :is(.pane:not(#panePlay), .almsheet) .wallrow, #homeOv :is(.pane:not(#panePlay), .almsheet) .pftile, #homeOv :is(.pane:not(#panePlay), .almsheet) .memberrow, #homeOv :is(.pane:not(#panePlay), .almsheet) .btn, #homeOv :is(.pane:not(#panePlay), .almsheet) .codechip, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourg, #homeOv :is(.pane:not(#panePlay), .almsheet) .subtier, #homeOv :is(.pane:not(#panePlay), .almsheet) .achclaim, #homeOv #gamewrap ~ * .cbtn{ /* HALDI PAPER, not white paper (owner 2026-08-04). This was linear-gradient(#fbf5e6,#f3ebd6,#e9dec4) with a cobalt hairline — a near-white that made every sheet read as white plastic once there were six plaques stacked on one screen. The tint moved into --hp-paper in chalk.css so this rule and gamemenu.css cannot drift apart again. */ background:var(--hp-paper) !important; border:1.4px solid var(--hp-edge) !important; border-radius:4px !important; box-shadow:var(--hp-lift) !important; /* THE INK. Overriding the four chalk tokens here — and only here, inside a plaque — flips every label, sub-label, number and icon this control contains from cream to ink in one move, without naming a hundred selectors. That is what the tokens are for. Text OUTSIDE a plaque is left alone: it sits directly on a dark room and has to stay light. */ --ck-chalk:var(--hp-ink); --ck-chalk-2:var(--hp-ink-2); --ck-chalk-3:var(--hp-ink-3); --ck-chalk-4:var(--hp-ink-4); --ck-shadow:var(--hp-ink-shadow); --ck-yellow:#8a5f12; --ck-pink:#9c3a58; --ck-blue:var(--hp-title); color:var(--hp-ink) !important} /* the sign-painter's own lettering, on the plaques that carry a title */ #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn .bt, #homeOv :is(.pane:not(#panePlay), .almsheet) .selgame .sgt b{ color:var(--hp-title) !important; font-family:var(--ck-disp) !important; letter-spacing:.3px !important;text-transform:none !important; font-size:15.5px !important} #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn .bs{color:var(--hp-ink-2) !important} /* pressed: enamel does not scale, it takes the light differently */ #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn:active, #homeOv :is(.pane:not(#panePlay), .almsheet) .selgame:active, #homeOv :is(.pane:not(#panePlay), .almsheet) .cbtn:active, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcard:active{ transform:none !important; box-shadow:inset 0 2px 4px rgba(60,40,14,.3), 0 1px 2px rgba(24,14,5,.3) !important} /* ---------------- 3. chosen, and the one that leads ---------------- Brass, which is what every fitting in this house is. It survives at a glance and in a screenshot, where a change of border colour does not. */ #homeOv :is(.pane:not(#panePlay), .almsheet) .cbtn.sel, #homeOv :is(.pane:not(#panePlay), .almsheet) .subcard.on, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcard.live, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourg.sel, #homeOv :is(.pane:not(#panePlay), .almsheet) .subtier.best, #homeOv :is(.pane:not(#panePlay), .almsheet) .achgame.isready, #homeOv :is(.pane:not(#panePlay), .almsheet) .achclaim, #homeOv :is(.pane:not(#panePlay), .almsheet) .btn.primary, #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn.primary{ background:linear-gradient(180deg,#f7dc95 0,#e6bd5c 60%,#d3a63f 100%) !important; border-color:#8d6a1c !important; box-shadow:inset 0 1px 0 rgba(255,248,222,.9), inset 0 -1px 0 rgba(90,64,12,.3), 0 2px 6px rgba(24,14,5,.4) !important; --ck-chalk:#3d2a06; --ck-chalk-2:rgba(61,42,6,.84); --ck-chalk-3:rgba(61,42,6,.62); --ck-shadow:0 1px 0 rgba(255,250,230,.55); color:#3d2a06 !important} #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn.primary .bt, #homeOv :is(.pane:not(#panePlay), .almsheet) .tourcard.live .tc-h{color:#4a3208 !important} /* the achievement rows: a paper slip pinned to the wall, which is what the Wall room is made of. They were the one thing the first pass missed — their ink went dark but their ground stayed chalk-transparent, so they read as dark text on nothing. */ #homeOv #paneWall .achgame{ background:var(--hp-paper) !important; border:1.4px solid var(--hp-edge-soft) !important;border-radius:3px !important; box-shadow:var(--hp-lift) !important; --ck-chalk:var(--hp-ink); --ck-chalk-2:var(--hp-ink-2); --ck-chalk-3:var(--hp-ink-3); --ck-shadow:var(--hp-ink-shadow); color:var(--hp-ink) !important} /* ---------------- 4. the icons ---------------- They are stroked in chalk with the same roughening filter. On enamel they are drawn in ink, and the filter goes with the outline. */ #homeOv :is(.pane:not(#panePlay), .almsheet) [data-ck-ico] svg{ stroke:#3a2a14 !important;filter:none !important;stroke-width:1.6 !important} #homeOv :is(.pane:not(#panePlay), .almsheet) .cbtn.sel [data-ck-ico] svg, #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn.primary [data-ck-ico] svg{ stroke:#4a3208 !important} #homeOv :is(.pane:not(#panePlay), .almsheet) [data-ck-ico="marble"] svg{filter:none !important} /* ---------------- 5. what is NOT a plaque ---------------- Section headings and body copy sit directly on the room. They stay light — ink on a dark cabinet is unreadable — but they lose the chalky glow and pick up a plain shadow, which is what paint on a wall does. */ #homeOv :is(.pane:not(#panePlay), .almsheet) > .ck-sec, #homeOv :is(.pane:not(#panePlay), .almsheet) > .ck-eyebrow, #homeOv :is(.pane:not(#panePlay), .almsheet) > .sthdr, #homeOv :is(.pane:not(#panePlay), .almsheet) > h3{ text-shadow:0 1px 2px rgba(18,10,3,.6) !important} /* the panes that already replaced chalk with their own thing keep it */ #homeOv #gamewrap .gcard, #homeOv #paneShop .shoptile{ background:none !important;border:0 !important;box-shadow:none !important; border-radius:0 !important;color:inherit !important} @media (prefers-reduced-motion: reduce){ #homeOv :is(.pane:not(#panePlay), .almsheet) .bigbtn, #homeOv :is(.pane:not(#panePlay), .almsheet) .cbtn{transition:none !important} }