/* SIGNATUREN. Tre riktningar (data-signatur på : "smide", "instrument", "valsat") och en strukturändring för Hem och Mat (data-struktur="ordnad"). Utan attributen ändrar filen ingenting. När en riktning är vald: stryk de två andra blocken OCH deras @font-face-rad. Snitten är subsatta till tal och versaler (rangnamnen) och bakade som base64 så inget hämtas utifrån. Källor: Big Shoulders Display, Martian Mono, Archivo, alla SIL OFL 1.1. */ @font-face{font-family:"Smide";font-display:block;src:url(data:font/woff2;base64,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) format("woff2")} @font-face{font-family:"Instrument";font-display:block;src:url(data:font/woff2;base64,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) format("woff2")} @font-face{font-family:"Valsat";font-display:block;src:url(data:font/woff2;base64,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) format("woff2")} /* ====================================================================== STRUKTUR html[data-struktur="ordnad"] Oberoende av signaturen: kan slås på ensam, och varje signatur nedan ritas lika bra med eller utan den. Hem hade sju kort i samma vikt, och det enda som säger något nytt varje dag (coachen) låg sist. Nu tre lager i fallande vikt: KÄRNAN saldot, snabbraden, dagens pass DAGENS ORD coachen, som en anteckning på grunden och inte ett kort DAGLIGT vatten + tillskott i ETT kort, tillskotten som bockbara brickor; karaktären och notiserna som smala rader sist Ingen funktion försvinner, ingenting i app.js ändras: allt görs med ordning (flex order) och täthet. Samma sak i Mat: skanna och dagens lista upp, veckan och målens ursprung ner under listan. ====================================================================== */ html[data-struktur="ordnad"] #vy-hem, html[data-struktur="ordnad"] #vy-tallriken{display:flex;flex-direction:column} html[data-struktur="ordnad"] #vy-hem>*, html[data-struktur="ordnad"] #vy-tallriken>*{flex:none} html[data-struktur="ordnad"] #vy-hem>.halsning{order:0} /* Bakåt: datumet och låset staplas i stället för att tryckas ihop i två brutna spalter. */ html[data-struktur="ordnad"] .halsning.last{flex-direction:column; align-items:flex-start;gap:4px} html[data-struktur="ordnad"] #vy-hem>.hjalte{order:1} html[data-struktur="ordnad"] #vy-hem>.snabb{order:2} html[data-struktur="ordnad"] #vy-hem>.passkort{order:3} html[data-struktur="ordnad"] #vy-hem>.vagkort{order:4} html[data-struktur="ordnad"] #vy-hem>.coachteaser{order:5} html[data-struktur="ordnad"] #vy-hem>.vattenkort{order:6} html[data-struktur="ordnad"] #vy-hem>.tillskottkort{order:7} html[data-struktur="ordnad"] #vy-hem>.karaktar{order:8} html[data-struktur="ordnad"] #vy-hem>.notiskort{order:9} /* Dagens pass är kärnans andra halva och får kärnans vikt: övningarna i brödtextens ton, inte i viloton. */ html[data-struktur="ordnad"] .passkort .passkort-ovn{color:var(--text); font-size:14.5px} /* Coachen: en anteckning med ett streck i marginalen, direkt på grunden. Det ENDA på Hem som inte är ett kort, och därför det ögat stannar vid. */ html[data-struktur="ordnad"] #vy-hem>.coachteaser{background:none;border:0; border-radius:0;box-shadow:none;border-left:2px solid var(--lyft); padding:2px 4px 2px 14px;margin:8px 0 26px} html[data-struktur="ordnad"] .coachteaser .kort-rubrik{margin-bottom:4px; min-height:0} html[data-struktur="ordnad"] .coachteaser h3{font:600 12.5px/1.2 var(--sans); color:var(--dov);letter-spacing:0} html[data-struktur="ordnad"] .coachteaser p{font-size:15.5px;line-height:1.48; -webkit-line-clamp:4} html[data-struktur="ordnad"] .coachteaser:active{background:none;opacity:.6} /* DAGLIGT: vatten och tillskott är ETT kort med en skarv, inte två. */ html[data-struktur="ordnad"] #vy-hem>.vattenkort{margin-bottom:0; border-bottom:0;border-radius:var(--r-kort) var(--r-kort) 0 0; padding-bottom:12px} html[data-struktur="ordnad"] #vy-hem>.vattenkort+.tillskottkort{ position:relative;border-top:0;border-radius:0 0 var(--r-kort) var(--r-kort); padding-top:14px} html[data-struktur="ordnad"] #vy-hem>.vattenkort+.tillskottkort::before{ content:"";position:absolute;left:16px;right:16px;top:0;height:1px; background:var(--lina)} html[data-struktur="ordnad"] #vy-hem .vattenkort .kort-rubrik, html[data-struktur="ordnad"] #vy-hem .tillskottkort .kort-rubrik{margin-bottom:6px} html[data-struktur="ordnad"] #vy-hem .vattenkort h3, html[data-struktur="ordnad"] #vy-hem .tillskottkort h3{font-size:14.5px} html[data-struktur="ordnad"] #vy-hem .glasrad{margin:0 0 10px} html[data-struktur="ordnad"] #vy-hem .glasrad svg{height:18px} /* Tillskotten som brickor i en rad: tre små saker ser ut som tre små saker. */ html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-rad{display:inline-flex; width:auto;max-width:100%;min-height:44px;margin:0 6px 8px 0; padding:0 14px 0 9px;gap:8px;border:1px solid var(--lina); border-radius:var(--r-pill);vertical-align:top} html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-rad:last-of-type{ border-bottom:1px solid var(--lina)} html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-rad .tagg{display:none} html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-namn{flex:0 1 auto; font-size:13.5px} html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-bock{flex-basis:20px; height:20px;font-size:11px} html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-rad.tagen{ background:var(--okbg);border-color:var(--okram)} html[data-struktur="ordnad"] #vy-hem .tillskottkort .tsk-hantera{margin-top:2px} /* Karaktären: en rad. Rang till vänster, dörren till spegeln till höger. */ html[data-struktur="ordnad"] #vy-hem>.karaktar{display:grid; grid-template-columns:minmax(0,1fr) auto;align-items:baseline; column-gap:10px;margin-top:16px} html[data-struktur="ordnad"] .karaktar .kort-rubrik{grid-column:2;grid-row:1; margin:0;min-height:0} html[data-struktur="ordnad"] .karaktar .kort-rubrik h3{display:none} html[data-struktur="ordnad"] .karaktar .rang-rad{grid-column:1;grid-row:1; justify-content:flex-start;gap:12px;margin:0;min-width:0;flex-wrap:wrap} html[data-struktur="ordnad"] .karaktar .rangbana, html[data-struktur="ordnad"] .karaktar .rang-text{grid-column:1/-1} html[data-struktur="ordnad"] .karaktar .rangbana{margin:11px 0 10px} html[data-struktur="ordnad"] .karaktar .rang-text{font-size:13.5px; font-weight:600} html[data-struktur="ordnad"] .karaktar .rang-nasta{text-align:left} /* Notiserna: ett val man gör en gång, inte en huvudsak. En rad. */ html[data-struktur="ordnad"] #vy-hem>.notiskort{display:flex; align-items:center;justify-content:space-between;gap:10px; padding:6px 8px 6px 16px} html[data-struktur="ordnad"] .notiskort .kort-rubrik{margin:0;gap:8px} html[data-struktur="ordnad"] .notiskort .kort-rubrik h3{font-size:14.5px} html[data-struktur="ordnad"] .notiskort .tsk-tom{display:none} html[data-struktur="ordnad"] .notiskort .stor-knapp{width:auto;margin:0; min-height:44px;padding:0 16px;font-size:14px;background:var(--panel2); color:var(--text);clip-path:none} html[data-struktur="ordnad"] .notiskort .lank{padding:12px 8px} /* MAT: kärnan är saldot, skannern och dagens lista. */ html[data-struktur="ordnad"] #vy-tallriken>.mal{order:1} html[data-struktur="ordnad"] #vy-tallriken>.skanna{order:2} html[data-struktur="ordnad"] #vy-tallriken>.sok-lank{order:3} html[data-struktur="ordnad"] #vy-tallriken>#vanligt-rad{order:4} html[data-struktur="ordnad"] #vy-tallriken>#matlista{order:5} html[data-struktur="ordnad"] #vy-tallriken>.ledtext{order:6} html[data-struktur="ordnad"] #vy-tallriken>.vecka-kort{order:7;margin-top:22px} html[data-struktur="ordnad"] #vy-tallriken>.mal-kalla{order:8} /* Varifrån målen kommer är en fotnot till veckan, inte ett kort. */ html[data-struktur="ordnad"] #vy-tallriken>.mal-kalla{background:none; border:0;border-left:2px solid var(--lina);border-radius:0; padding:2px 4px 2px 12px;margin:4px 0 0} html[data-struktur="ordnad"] #vy-tallriken>.mal-kalla.adaptiv{ border-left-color:var(--lyft)} html[data-struktur="ordnad"] #vy-tallriken>.mal-kalla.saknas{ border-left-color:var(--fail)} html[data-struktur="ordnad"] #vy-tallriken>.mal-kalla b{font-size:12.5px} /* Saldots tal krockade med profilsidans .mal-rad längre ner i stil.css och ritades i 20 px i stället för 36. Här får det sin storlek tillbaka. */ html[data-struktur="ordnad"] .mal .mal-rad b{font-size:40px; letter-spacing:-.035em;color:var(--text)} html[data-struktur="ordnad"] .mal .mal-rad b.over{color:var(--fail)} /* ====================================================================== A. SMIDE html[data-signatur="smide"] Sexkanten. Hantlarna i ett gym är sexkantiga för att de inte ska rulla; en mutter är sexkantig för att den ska gå att gripa. Allt runt man TRYCKER på blir en sexkant: setknapparna, snabbraden. Ett gjort set blir svart järn, inte grönt: raden svärtas medan man jobbar. Talen i ett kondenserat industrisnitt (Big Shoulders, byggt för Chicagos stålstad) som gjorts tabulärt i bygget. Mätare är segmenterade, som smidda länkar. Hörnen stramas från 20 till 14 px. ====================================================================== */ html[data-signatur="smide"]{--mono:"Smide",-apple-system,system-ui,sans-serif; --jarn:#141a17;--r-kort:14px;--r-inre:9px} html[data-signatur="smide"] .hjalte-tal b{font:800 54px/.9 var(--mono); letter-spacing:0} html[data-signatur="smide"] .hjalte-tal span{margin-top:8px} html[data-signatur="smide"] .mal .mal-rad b, html[data-signatur="smide"] .mal-rad b{font-size:38px;letter-spacing:0; line-height:.9} html[data-signatur="smide"] .matrad .kcal{font-size:17px;font-weight:800} html[data-signatur="smide"] .mat-del h3 span, html[data-signatur="smide"] .hjalte-meta b, html[data-signatur="smide"] .minibar-rubrik b, html[data-signatur="smide"] .makro b{font-size:15px;font-weight:800; letter-spacing:.01em} html[data-signatur="smide"] .kort-tal{font-size:17px;letter-spacing:.01em} html[data-signatur="smide"] .vila b{font-size:24px} html[data-signatur="smide"] .fokus-vila b{font-size:56px} html[data-signatur="smide"] .vecka-tal b{font-size:24px} html[data-signatur="smide"] .mangd-summa b{font-size:26px} html[data-signatur="smide"] .stegrad input{font-size:20px} /* Sexkanten: ramen är knappens egen bakgrund, ytan en inskjuten kopia. */ html[data-signatur="smide"] .setknapp, html[data-signatur="smide"] .snabb i{position:relative;isolation:isolate; border:0;border-radius:0;background:var(--lina); clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)} html[data-signatur="smide"] .setknapp::before, html[data-signatur="smide"] .snabb i::before{content:"";position:absolute; inset:1.5px;z-index:-1;background:var(--panel); clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)} html[data-signatur="smide"] .setknapp{width:48px;height:54px; font:800 18px/1 var(--mono)} html[data-signatur="smide"] .setrad{gap:8px} html[data-signatur="smide"] .setknapp.klar{background:var(--jarn);color:#fff} html[data-signatur="smide"] .setknapp.klar::before{background:var(--jarn)} html[data-signatur="smide"] .fokus-set .setknapp{width:58px;height:66px; font-size:22px} html[data-signatur="smide"] .fokus-set .setknapp.klar{background:var(--jarn)} html[data-signatur="smide"] .snabb i{width:48px;height:54px} html[data-signatur="smide"] .snabb .prim i{background:var(--lyft)} html[data-signatur="smide"] .snabb .prim i::before{background:var(--lyft)} html[data-signatur="smide"] .ovning.klar-hel{border-color:var(--lina)} /* Vikten på övningen: en platta med avfasade hörn. */ html[data-signatur="smide"] .vikt{border:0;border-radius:0; font:800 15px/1 var(--mono);padding:6px 12px 5px; clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 50%,calc(100% - 8px) 100%,8px 100%,0 50%)} html[data-signatur="smide"] .vikt.saknas{font:600 13px var(--sans)} /* Den stora knappen: en avfasad stång, som en sexkantsstång i genomskärning. */ html[data-signatur="smide"] .stor-knapp:not(.fara){border-radius:0;border:0; clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%)} html[data-signatur="smide"] .stor-knapp.klistrad{box-shadow:none} /* Mätarna i smidda länkar: ringen i 40 segment, staplarna i block. */ html[data-signatur="smide"] .hemring{ -webkit-mask:repeating-conic-gradient(#000 0 7deg,transparent 7deg 9deg); mask:repeating-conic-gradient(#000 0 7deg,transparent 7deg 9deg)} html[data-signatur="smide"] .hjalte .hemring{width:78px;height:78px} html[data-signatur="smide"] .hemring .ring-varde{stroke-linecap:butt} html[data-signatur="smide"] .hemring .ring-spar{stroke:var(--lina)} html[data-signatur="smide"] .hjalte .ring-spar, html[data-signatur="smide"] .hjalte .ring-varde{stroke-width:12} html[data-signatur="smide"] .stapel, html[data-signatur="smide"] .rangbana, html[data-signatur="smide"] .rang-bana{height:9px;border-radius:0; -webkit-mask:repeating-linear-gradient(90deg,#000 0 9px,transparent 9px 11px); mask:repeating-linear-gradient(90deg,#000 0 9px,transparent 9px 11px)} html[data-signatur="smide"] .stapel i, html[data-signatur="smide"] .rangbana i, html[data-signatur="smide"] .rang-bana i{border-radius:0} html[data-signatur="smide"] .rangbana i{background:var(--jarn)} html[data-signatur="smide"] .vecka-stapel{-webkit-mask:none;mask:none} html[data-signatur="smide"] .vecka-stapel i{border-radius:0} html[data-signatur="smide"] .rang{font:800 22px/1 var(--mono); letter-spacing:.04em} html[data-signatur="smide"] .rang-hero h1{font:800 46px/.9 var(--mono); letter-spacing:.03em} html[data-signatur="smide"] .stege-namn{font:800 15px/1 var(--mono); letter-spacing:.05em} html[data-signatur="smide"] .pagar{border-radius:0; clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 50%,calc(100% - 7px) 100%,7px 100%,0 50%); border:0} /* SPEGELN. Svart järn, rangen så stor att den bryts i två rader, och en sexkant i hårstreck bakom allt, som en stämpel i väggen. */ html[data-signatur="smide"] .spegel{background:#060807} html[data-signatur="smide"] .spegel::before, html[data-signatur="smide"] .spegel::after{content:"";position:fixed; left:50%;top:44%;width:190vw;max-width:1100px;aspect-ratio:.866; transform:translate(-50%,-50%);pointer-events:none; clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)} html[data-signatur="smide"] .spegel::before{background:#18201b} html[data-signatur="smide"] .spegel::after{background:#060807; width:calc(190vw - 3px);max-width:1097px} html[data-signatur="smide"] .spegel-inre{position:relative;z-index:1} html[data-signatur="smide"] .spegel h1{font:800 clamp(60px,20vw,100px)/1.08 var(--mono);letter-spacing:.01em;margin:14px 0 12px;color:#fff} html[data-signatur="smide"] .spegel-rader p{font-size:18px} html[data-signatur="smide"] .spegel-rader p:nth-child(2){color:#8fe0b6} html[data-signatur="smide"] .spegel-tal{border-top-color:#222c26} html[data-signatur="smide"] .spegel-tal b{font:800 40px/.9 var(--mono)} html[data-signatur="smide"] .spegel .stor-knapp{background:#fff;color:#060807} /* ====================================================================== B. INSTRUMENT html[data-signatur="instrument"] Kalibrerat. Appen mäter en kropp, och ett mätinstrument har skala: ringen blir en urtavla med sextio streck, staplarna linjaler med tiondelsstreck, setknapparna vred med en gradering runt kanten. Ett gjort set fylls i accenten inifrån. Talen i ett smalt eget monosnitt (Martian Mono, kondenserad) så mono-regeln blir husets egen och inte systemets. Hörnen 10 px: mätdon har inga mjuka kanter. ====================================================================== */ html[data-signatur="instrument"]{ --mono:"Instrument","SF Mono",ui-monospace,Menlo,monospace; --r-kort:12px;--r-inre:7px} html[data-signatur="instrument"] .hjalte-tal b{font:700 64px/.9 var(--mono); letter-spacing:-.04em} html[data-signatur="instrument"] .mal .mal-rad b, html[data-signatur="instrument"] .mal-rad b{font-size:44px;letter-spacing:-.04em} html[data-signatur="instrument"] .matrad .kcal{font-size:17px} html[data-signatur="instrument"] .fokus-vila b{font-size:60px} /* Vredet: graderingen är tolv streck i bakgrunden, ytan en platta ovanpå. */ html[data-signatur="instrument"] .setknapp{width:52px;height:52px; border:1px solid var(--lina);font:700 17px var(--mono);letter-spacing:-.03em; background: radial-gradient(circle closest-side,var(--panel) 0 72%,transparent 73%), repeating-conic-gradient(var(--dov) 0 1.6deg,transparent 1.6deg 30deg)} html[data-signatur="instrument"] .setknapp.klar{color:#fff; border-color:var(--lyft); background: radial-gradient(circle closest-side,var(--lyft) 0 72%,transparent 73%), repeating-conic-gradient(var(--lyft) 0 1.6deg,transparent 1.6deg 30deg)} html[data-signatur="instrument"] .fokus-set .setknapp{width:66px;height:66px; font-size:21px} html[data-signatur="instrument"] .fokus-set .setknapp.klar{ background: radial-gradient(circle closest-side,var(--lyft) 0 72%,transparent 73%), repeating-conic-gradient(var(--lyft) 0 1.6deg,transparent 1.6deg 30deg)} html[data-signatur="instrument"] .vikt{border-radius:6px;font-size:15px} html[data-signatur="instrument"] .stor-knapp{border-radius:10px} html[data-signatur="instrument"] .vatten-knappar button{border-radius:8px} html[data-signatur="instrument"] .snabb i{border-radius:14px} /* Urtavlan: sextio streck, samma mask på spåret och på värdet. */ html[data-signatur="instrument"] .hemring{ -webkit-mask:repeating-conic-gradient(#000 0 1.5deg,transparent 1.5deg 6deg); mask:repeating-conic-gradient(#000 0 1.5deg,transparent 1.5deg 6deg)} html[data-signatur="instrument"] .hjalte .hemring{width:96px;height:96px} html[data-signatur="instrument"] .hemring .ring-varde{stroke-linecap:butt} html[data-signatur="instrument"] .hemring .ring-spar{stroke:var(--lina)} html[data-signatur="instrument"] .hjalte .ring-spar, html[data-signatur="instrument"] .hjalte .ring-varde{stroke-width:16} /* Linjalen: tiondelsstreck i spåret, värdet en tunn list längs basen. */ html[data-signatur="instrument"] .stapel, html[data-signatur="instrument"] .rangbana, html[data-signatur="instrument"] .rang-bana{height:12px;border-radius:0; overflow:hidden; background: linear-gradient(var(--lina),var(--lina)) left bottom/100% 1px no-repeat, repeating-linear-gradient(90deg,var(--lina) 0 1px,transparent 1px 10%) left bottom/100% 7px no-repeat, repeating-linear-gradient(90deg,#c9cfcb 0 1px,transparent 1px 50%) left bottom/100% 12px no-repeat} html[data-signatur="instrument"] .stapel i, html[data-signatur="instrument"] .rangbana i, html[data-signatur="instrument"] .rang-bana i{height:5px;margin-top:7px; border-radius:0} html[data-signatur="instrument"] .rangbana i{background:var(--text)} html[data-signatur="instrument"] .rang{font:700 21px/1 var(--mono); letter-spacing:.14em} html[data-signatur="instrument"] .stege-namn{letter-spacing:.1em} /* SPEGELN: en avläsning i mörker. Rangen i skalans versaler, en halv urtavla i hårstreck bakom, talen stora som på en display. */ html[data-signatur="instrument"] .spegel{background:#050706} html[data-signatur="instrument"] .spegel::before{content:"";position:fixed; left:50%;top:-118vw;width:150vw;max-width:880px;aspect-ratio:1; transform:translateX(-50%);border-radius:50%;pointer-events:none; background:repeating-conic-gradient(#26322b 0 .5deg,transparent .5deg 3deg); -webkit-mask:radial-gradient(closest-side,transparent 0 88%,#000 88.5% 100%); mask:radial-gradient(closest-side,transparent 0 88%,#000 88.5% 100%)} html[data-signatur="instrument"] .spegel-inre{position:relative;z-index:1} html[data-signatur="instrument"] .spegel h1{font:700 clamp(44px,13vw,64px)/1.24 var(--mono);letter-spacing:.06em;margin:14px 0 8px} html[data-signatur="instrument"] .spegel-rader p:nth-child(2){color:#62d69b} html[data-signatur="instrument"] .spegel-tal{border-top:0;padding-top:0; gap:0;border:1px solid #1f2923;border-radius:10px} html[data-signatur="instrument"] .spegel-tal span{letter-spacing:.07em} html[data-signatur="instrument"] .spegel-tal>div{padding:14px 10px; border-left:1px solid #1f2923} html[data-signatur="instrument"] .spegel-tal>div:first-child{border-left:0} html[data-signatur="instrument"] .spegel-tal b{font:700 34px/1 var(--mono); letter-spacing:-.03em} /* ====================================================================== C. VALSAT html[data-signatur="valsat"] Stången och skivan. Talen i ett brett, svart snitt, så som siffrorna står gjutna på en viktskiva (Archivo, full bredd, full vikt). Varje setknapp är en skiva med nav; ett gjort set blir en skiva i stål. Framstegen fylls med räfflingen från en skivstångs grepp, två korsande hårstreck, det enda mönstret i appen. Hörnen ligger kvar. ====================================================================== */ html[data-signatur="valsat"]{--mono:"Valsat",-apple-system,system-ui,sans-serif; --stalskiva:#1a211e; --rafflor:repeating-linear-gradient(45deg,rgba(255,255,255,.28) 0 1px,transparent 1px 4px), repeating-linear-gradient(-45deg,rgba(255,255,255,.28) 0 1px,transparent 1px 4px)} html[data-signatur="valsat"] .hjalte-tal b{font:900 56px/.95 var(--mono); letter-spacing:-.02em} html[data-signatur="valsat"] .mal .mal-rad b, html[data-signatur="valsat"] .mal-rad b{font-size:34px;letter-spacing:-.02em} html[data-signatur="valsat"] .matrad .kcal{font-size:16px} html[data-signatur="valsat"] .mat-del h3 span, html[data-signatur="valsat"] .hjalte-meta b, html[data-signatur="valsat"] .minibar-rubrik b, html[data-signatur="valsat"] .makro b{font-size:11.5px} html[data-signatur="valsat"] .kort-tal{font-size:14px} html[data-signatur="valsat"] .vikt{font-size:12.5px;padding:6px 11px} html[data-signatur="valsat"] .fokus-vila b{font-size:46px} /* Skivan: kant, nav, hål. */ html[data-signatur="valsat"] .setknapp{width:52px;height:52px; border:1.5px solid var(--lina);font:900 16px var(--mono); background:radial-gradient(circle closest-side,var(--panel) 0 76%, var(--lina) 77% 80%,var(--panel) 81%)} html[data-signatur="valsat"] .setknapp.klar{color:#fff; border-color:var(--stalskiva); background:radial-gradient(circle closest-side,var(--stalskiva) 0 76%, #3a4540 77% 80%,var(--stalskiva) 81%)} html[data-signatur="valsat"] .fokus-set .setknapp{width:64px;height:64px; font-size:17px} html[data-signatur="valsat"] .fokus-set .setknapp.klar{ background:radial-gradient(circle closest-side,var(--stalskiva) 0 76%, #3a4540 77% 80%,var(--stalskiva) 81%)} html[data-signatur="valsat"] .ovning.klar-hel{border-color:var(--lina)} html[data-signatur="valsat"] .snabb i{ background:radial-gradient(circle closest-side,var(--panel) 0 70%, var(--lina) 71% 73%,var(--panel) 74%)} html[data-signatur="valsat"] .snabb .prim i{ background:radial-gradient(circle closest-side,var(--lyft) 0 70%, rgba(255,255,255,.28) 71% 73%,var(--lyft) 74%)} /* Greppet: räfflad fyllning i allt som växer mot ett mål. */ html[data-signatur="valsat"] .stapel, html[data-signatur="valsat"] .rangbana, html[data-signatur="valsat"] .rang-bana{height:10px;border-radius:2px} html[data-signatur="valsat"] .stapel i, html[data-signatur="valsat"] .rangbana i, html[data-signatur="valsat"] .rang-bana i{border-radius:2px; background-image:var(--rafflor)} html[data-signatur="valsat"] .rangbana i{background-color:var(--stalskiva)} /* Ringen: en skiva. Bred kant, rak ände, ett nav i hårstreck innanför. */ html[data-signatur="valsat"] .hemring .ring-varde{stroke-linecap:butt} html[data-signatur="valsat"] .hjalte .hemring{width:84px;height:84px; border-radius:50%; background:radial-gradient(circle closest-side,transparent 0 44%, var(--lina) 45% 47%,transparent 48%)} html[data-signatur="valsat"] .hjalte .ring-spar, html[data-signatur="valsat"] .hjalte .ring-varde{stroke-width:15} html[data-signatur="valsat"] .rang{font:900 19px/1 var(--mono); letter-spacing:.02em} html[data-signatur="valsat"] .rang-hero h1{font:900 30px/1 var(--mono); letter-spacing:.02em} html[data-signatur="valsat"] .stege-namn{font:900 12px/1 var(--mono); letter-spacing:.02em} /* SPEGELN: kallt stål. Rangen i borstad metall (en ljusgradient i bokstäverna, det enda stället i appen där färgen får glans), och greppets räffling som ett band tvärs över skärmen. */ html[data-signatur="valsat"] .spegel{background:#07090a} html[data-signatur="valsat"] .spegel h1{font:900 clamp(40px,12.4vw,60px)/1.04 var(--mono);letter-spacing:-.01em;margin:16px 0 10px; background:linear-gradient(180deg,#fbfdfd 0%,#c9d2d6 50%,#7f8a8f 58%,#dfe6e9 90%) 0 .06em/100% 1.04em repeat-y; -webkit-background-clip:text;background-clip:text;color:transparent} html[data-signatur="valsat"] .spegel-tal{border-top:0;padding-top:26px; position:relative} html[data-signatur="valsat"] .spegel-tal::before{content:"";position:absolute; left:-28px;right:-28px;top:0;height:12px; background: repeating-linear-gradient(45deg,#3b4448 0 1px,transparent 1px 4px), repeating-linear-gradient(-45deg,#3b4448 0 1px,transparent 1px 4px), #101416} html[data-signatur="valsat"] .spegel-tal b{font:900 30px/1 var(--mono); color:#e9eef0} html[data-signatur="valsat"] .spegel-rader p:nth-child(2){color:#7fd7a8}