From cd536b1c8fb27607553cabb54115289554a7a31d Mon Sep 17 00:00:00 2001 From: samantha42 Date: Fri, 28 Aug 2026 11:10:00 +0200 Subject: [PATCH] adding fonts and css change --- .gitignore | 3 +- source/index.html | 208 ------- source/pages/index.html | 7 +- source/pages/research.html | 38 +- source/templates/main.html | 17 +- static/index.html | 517 ---------------- static/input.css | 73 ++- static/output.css | 2 +- static/style/styles.css | 1169 ------------------------------------ 9 files changed, 103 insertions(+), 1931 deletions(-) delete mode 100644 source/index.html delete mode 100644 static/index.html delete mode 100644 static/style/styles.css diff --git a/.gitignore b/.gitignore index 4bec488..c2e483c 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,3 @@ .env -tailwindcss-* \ No newline at end of file +tailwindcss-* +site \ No newline at end of file diff --git a/source/index.html b/source/index.html deleted file mode 100644 index b70d288..0000000 --- a/source/index.html +++ /dev/null @@ -1,208 +0,0 @@ - - - - - - - Samantha Vero Friis - - - - - - - - - - -
- -
-
-

About Me · 2026

-

Samantha
Vero Friis -

-

Bachelor's student in Business Administration seeking an entry-level analyst or - finance-related role while studying. Strong numerical skills, advanced Excel, and experience in company, risk, - and financial analysis. Analytical, detail-oriented, and efficiency-focused.

-
- -
- samantha42.xyz - me@samantha42.xyz -
-
-
-
-

experience

-
-
-
-
- Independent Equity Research - finance -
-

Fundamental analysis using SEC filings (10-K, 10-Q) and earnings reports. Assess - profitability, liquidity, risk factors, and long-term business sustainability. Handle incomplete or - low-transparency information through structured cross-validation.

-
-
-
- Bookkeeping & Administration - Record keeping -
-

Excel to In house Bookkeeping tooling and backups and safe sql databse for larger scale. made to better comply to lawmakers in KLACQ ApS(small self owned company) currently selling SaaS products. klacq website

-
- -
-
- Technical Tools & Automation - programing -
-

Build lightweight backend tools to automate repetitive analytical and operational tasks. - Python for data processing, validation, and workflow automation. Lightweight online services in Go, - focusing on speed and reliability.

-
-
-
-
-
-

education

-
-
-
-
2025 — present
-
-
Bachelor of Economics & Business Administration (HA)
-
Aalborg University · Expected 2028
-
-
-
-
2024 — 2025 -
- discontinued -
-
-
Mathematics-Technology (BSc)
-
Aalborg University · 1 semester
- -
-
- -
-
2020 — 2023
-
-
HTX – Technical Upper Secondary Education
-
Viden Gymnasier
-
Mathematics A, Biology B · Study project: Mathematics & Technology
-
-
-
-
- - -
-
-

interests

-
-
-
-
- Personal Free Time Interest - Personal -
-

Movies, computers, PC gaming and oard games

-
-
-
- - -
-
- - - - - - - - \ No newline at end of file diff --git a/source/pages/index.html b/source/pages/index.html index b1e175c..4ac73e6 100644 --- a/source/pages/index.html +++ b/source/pages/index.html @@ -44,17 +44,16 @@ {{end}} {{define "body"}} -
+

About Me · 2026

-

Samantha
Vero Friis +

Samantha
Vero Friis

Bachelor's student in Business Administration seeking an entry-level analyst or finance-related role while studying. Strong numerical skills, advanced Excel, and experience in company, risk, and financial analysis. Analytical, detail-oriented, and efficiency-focused.

-
- samantha42.xyz + Available me@samantha42.xyz
diff --git a/source/pages/research.html b/source/pages/research.html index 05f0437..632e1d3 100644 --- a/source/pages/research.html +++ b/source/pages/research.html @@ -30,26 +30,39 @@


+

Current stock analysis

+

+ Reports listed is what i consider still actionable and align with my opinion on the given company at this time. Understand that the infomaion and the time of writing may be dated. The mispricing of the thesis remain valuable. +

+
- MSTR: Strategy (Sell) - due diligence + MSTR: Strategy +
+ due diligence + Sell +

The company only owns btc by issuing debt and preferred stock offering.
- The company is a ponzi scheme at its best. + The company is expensive btc at its best and ponzi scheme at its worst.


- Novo.B/NVO: Novo Nordisk A/S (buy) - due diligence -
+ Novo.B/NVO: Novo Nordisk A/S +
+ due diligence + buy +
+ + +

The product sales of wieght loss drugs are highclass, pipeline is undervalued.
@@ -61,6 +74,19 @@

Equity portfolio performance

+

+ year to date performance has its risked and luck based issues. hard to say if these numbers will continue year by year. +

+
+
+ Trades +
+
+

mostly long trades on NOVO, MEARSK, ORTSED and VWS with a low wieght of puts on RGTI

+
+ +
+
diff --git a/source/templates/main.html b/source/templates/main.html index 6873194..57a0671 100644 --- a/source/templates/main.html +++ b/source/templates/main.html @@ -16,7 +16,11 @@
@@ -25,19 +29,10 @@
- {{if .Sub}} -
-
- BACK -
-
- {{end}} - {{template "nav" .}} -
-
+
{{template "body" .}}
diff --git a/static/index.html b/static/index.html deleted file mode 100644 index b38b7f3..0000000 --- a/static/index.html +++ /dev/null @@ -1,517 +0,0 @@ - - - - - - - Samantha Vero Friis - - - - - - - - - - -
- -
-
-

About Me · 2026

-

Samantha
Vero Friis -

-

Bachelor's student in Business Administration seeking an entry-level analyst or - finance-related role while studying. Strong numerical skills, advanced Excel, and experience in company, risk, - and financial analysis. Analytical, detail-oriented, and efficiency-focused.

-
- -
- samantha42.xyz - me@samantha42.xyz -
-
-
-
-

experience

-
-
-
-
- Independent Equity Research - finance -
-

Fundamental analysis using SEC filings (10-K, 10-Q) and earnings reports. Assess - profitability, liquidity, risk factors, and long-term business sustainability. Handle incomplete or - low-transparency information through structured cross-validation.

- // Go to Analysis -
-
-
- Technical Tools & Automation - engineering -
-

Build lightweight backend tools to automate repetitive analytical and operational tasks. - Python for data processing, validation, and workflow automation. Lightweight online services in Go, - focusing on speed and reliability.

- // Go to Tools -
-
-
-
-
-

education

-
-
-
-
2025 — present
-
-
Bachelor of Economics & Business Administration (HA)
-
Aalborg University · Expected 2028
-
-
-
-
2024 — 2025 -
- discontinued -
-
-
Mathematics-Technology (BSc)
-
Aalborg University · 1 semester
- -
-
- -
-
2020 — 2023
-
-
HTX – Technical Upper Secondary Education
-
Viden Gymnasier
-
Mathematics A, Biology B · Study project: Mathematics & Technology
-
-
-
-
-
-
-

opinion

-
-
- cinema - finance - infra -
-
-
-
-

Technical Tools & Automation

- engineering/programing -
-
-

- The task here is simple: to reduce work, it's a simple investment. The choice of picking the correct - bottleneck is as important as the tool itself, as this gives it use. If it's never used, it never creates - value. The same goes for uptime, it's important that stability is almost perfect, as downtime undermines - the utility of having the tool. Remember that making and using a tool also creates debt for future - maintenance of the tool. -
- To adhere to this, I often choose Golang or Python as they are cheap to maintain. Golang has good - stability because it is easy to code and compile checks give early error detection. A word of caution on - AI generated tools: while they are cheap to make, the maintenance debt grows exponentially, as the code is - often poorly understood by the team and difficult to reason about over time. - -

-
-
- Portfolio Engine -
-

A lightweight portfolio and financial data backend written in Go. Tracks companies, - currencies, revenue reports, and trades across configurable time periods — replacing spreadsheets with a - proper database, REST API, and interactive shell.

- Roadmap -
    -
  • Price update endpoint
    • -
  • Multi-currency conversion
    • -
  • Frontend dashboard
    • -
  • Shares outstanding history database table
    • -
  • Earnings per share (EPS) based on shares owned
    • -
  • First-In, First-Out (FIFO) realized gains
    • -
  • Dividends earned and related taxes
    • -
  • Total tax obligations
    • -
- Git repo -
-
-
- Accounting Management -
-

- A lightweight, SQL-backed, web-based CLI system designed to track assets and liabilities. The goal is to - provide a simple, fast, and scalable financial tracking tool that can grow from personal use to more - advanced scenarios.

-
-
-
-
-
-

Equity Research

-
- -
-
- Story vs Fundamental value -
-

- - The truth I keep coming back to is simple: find value grounded in the fundamental numbers of a company. -
- My approach is rooted in fundamental analysis using SEC filings (10-K, 10-Q), earnings reports, profitability, liquidity, risk factors, and long-term business sustainability. In low-transparency situations I rely on structured cross-validation across sources. -
- A pattern I keep seeing is CEOs speaking just close enough to reality to generate a short-term price boost, then moving the goalposts when reality catches up. What companies state in filings and what they communicate to retail or even professional investors can be two very different stories. Guidance only needs to reach far enough into the future to say almost anything. -

-
-
-
-

Current stock analysis

-
-
-
- MSTR: Strategy (Sell) -
-

- The company only owns btc by issuing debt and preferred stock offering. -
- The company is a ponzi scheme at its best. -

- Read file -
-
-
-
- Novo.B/NVO: Novo Nordisk A/S (buy) -
-

- The product sales of wieght loss drugs are highclass, pipeline is undervalued. -
- Pipeline and wegovy pil is not reconsiced correctly as high focus on expireation of current sold product. high pisimistic view of pipeline. -

- Read file -
-
- -
-

Equity portfolio performance

-
-
-
- -
-
- - -
-
-
-

Equity Research · Newsletter

-
- -
-
- When the numbers say something worth saying. -
-

- Not a scheduled publication. Sent when there is a specific, well-reasoned case to make — a mispricing, a narrative the market has wrong, or an implied expectation that doesn't survive contact with the filings. -

- Fundamental analysis. SEC filings. No macro noise. -

- -
-
-
// thesis
-

A specific position on a specific company. Long or short. With a reason.

-
-
-
// filings-first
-

10-K, 10-Q, earnings. The numbers, not the press release.

-
-
- -
- - -
-

// no schedule. no spam. unsubscribe anytime.

- -
-
- -
-
-

- Interests -

- -
-
-
-

Contact

-
-
- Open to opportunities -
-

- Looking for an entry-level analyst or finance-adjacent role alongside my studies. If you're working on something interesting. -

- write to me → -
-
-
-
- - - - - - - - - \ No newline at end of file diff --git a/static/input.css b/static/input.css index 3e07d92..b221187 100644 --- a/static/input.css +++ b/static/input.css @@ -1,3 +1,35 @@ +@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap'); + +.ibm-plex-serif-thin { + font-family: "IBM Plex Serif", serif; + font-weight: 100; + font-style: normal; +} + +.ibm-plex-serif-extralight { + font-family: "IBM Plex Serif", serif; + font-weight: 200; + font-style: normal; +} + +.ibm-plex-serif-light { + font-family: "IBM Plex Serif", serif; + font-weight: 300; + font-style: normal; +} + +.ibm-plex-serif-regular { + font-family: "IBM Plex Serif", serif; + font-weight: 400; + font-style: normal; +} + +.ibm-plex-serif-medium { + font-family: "IBM Plex Serif", serif; + font-weight: 500; + font-style: normal; +} + .theme-root.night { --bg: #1c1c1c; --surface: #252525; @@ -55,7 +87,6 @@ body::before{ position:fixed;inset:0; background-image:radial-gradient(circle, var(--border) 1px, transparent 1px); background-size:24px 24px; - opacity:0.5; pointer-events:none;z-index:0; } @@ -74,6 +105,8 @@ nav{ } .nav-logo::before{content:'>';color:var(--green);font-weight:500;} .nav-logo.sub::before{content:'/';color:var(--green);font-weight:500;} +.nav-logo.back::before{content:'<-';color:var(--green);font-weight:500;} + .nav-links{display:flex;gap:0.2rem;align-items:center;} .nav-links a{ @@ -96,15 +129,6 @@ nav{ } -.sidebar-links a.hidden { - opacity: 0; - transition: opacity 0.4s linear; -} - -.sidebar-links:hover a.hidden { - opacity: 1; -} - aside{ border-right:1px solid var(--border); padding:2.5rem 1.5rem; @@ -149,9 +173,10 @@ main{ } .hero-eyebrow::before{content:'';display:block;width:20px;height:1px;background:var(--green);} h1{ - font-family:var(--ff-mono); - font-size:clamp(1.8rem,4vw,2.8rem); - font-weight:500;color:var(--text); + font-family: "IBM Plex Serif", serif; + font-weight: 300; + font-style: normal; + font-size: 4rem; letter-spacing:-0.02em;line-height:1.1; } h1 span{color:var(--accent);} @@ -193,7 +218,13 @@ h1 span{color:var(--accent);} } -.exp-title{font-family:var(--ff-mono);font-size:0.9rem;font-weight:500;color:var(--text);} +.exp-title{ + font-family: "IBM Plex Serif", serif; + font-weight: 500; + font-style: normal; + color:var(--text);} + + .exp-tag{ font-family:var(--ff-mono);font-size:0.65rem; letter-spacing:0.1em;text-transform:uppercase; @@ -201,6 +232,20 @@ h1 span{color:var(--accent);} border:1px solid rgba(26,86,219,0.2); padding:2px 8px;border-radius:3px; } + +.exp-tag.green{ + color: green; + background:rgba(61, 219, 26, 0.07); + border:1px solid rgba(38, 103, 13, 0.2); +} + +.exp-tag.red{ + color: red; + background:rgba(219, 26, 26, 0.07); + border:1px solid rgba(219, 26, 26, 0.2); +} + + .exp-body{font-size:0.85rem;color:var(--muted);line-height:1.8;} .edu-grid{display:flex;flex-direction:column;gap:8px;} diff --git a/static/output.css b/static/output.css index c08fa86..8327a21 100644 --- a/static/output.css +++ b/static/output.css @@ -1 +1 @@ -.theme-root.night{--bg:#1c1c1c;--surface:#252525;--surface2:#2a2a2a;--border:#363636;--border2:#ccc7be;--text:#fff;--muted:#d9d9d9;--dim:#b0aa9f;--navback:#1c1c1ccc;--accent:#5389ff;--accent2:#1447b8;--green:#0eaf74;--amber:#ffd78e;--accent-dim:#5da7ca1f;--accent-border:#5d66ca40}.theme-root{--bg:#f7f6f3;--surface:#fff;--surface2:#f0eeea;--border:#e2ddd6;--border2:#ccc7be;--text:#1a1917;--muted:#6b6560;--dim:#b0aa9f;--accent:#1a56db;--accent2:#1447b8;--green:#0a7c52;--amber:#92620a;--navback:#f7f6f3cc --ff-mono:"IBM Plex Mono",monospace;--ff-sans:"IBM Plex Sans",sans-serif;--accent-dim:#5da7ca1f;--accent-border:#5d66ca40}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:15px}body{background:var(--bg);color:var(--text);font-family:var(--ff-sans);min-height:100vh;font-weight:300;line-height:1.7}body:before{content:"";background-image:radial-gradient(circle, var(--border) 1px, transparent 1px);opacity:.5;pointer-events:none;z-index:0;background-size:24px 24px;position:fixed;inset:0}nav{background:var(--navback);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);height:52px;padding:0 clamp(1rem,5vw,3rem);display:flex}.nav-logo{font-family:var(--ff-mono);color:var(--accent);align-items:center;gap:6px;font-size:.78rem;font-weight:500;text-decoration:none;display:flex}.nav-logo:before{content:">";color:var(--green);font-weight:500}.nav-logo.sub:before{content:"/";color:var(--green);font-weight:500}.nav-links{align-items:center;gap:.2rem;display:flex}.nav-links a{font-family:var(--ff-mono);color:var(--muted);border-radius:4px;padding:.3rem .7rem;font-size:.72rem;text-decoration:none;transition:color .15s,background .15s}.nav-links a:hover{color:var(--text);background:var(--surface2)}.nav-links .cta{color:var(--accent);border:1px solid var(--accent);margin-left:.4rem}.nav-links .cta:hover{background:var(--accent2);color:#fff}.shell{z-index:1;grid-template-columns:220px 1fr;max-width:1100px;min-height:calc(100vh - 52px);margin:0 auto;display:grid;position:relative}.sidebar-links a.hidden{opacity:0;transition:opacity .4s linear}.sidebar-links:hover a.hidden{opacity:1}aside{border-right:1px solid var(--border);background:var(--surface);flex-direction:column;gap:1rem;height:calc(100vh - 52px);padding:2.5rem 1.5rem;display:flex;position:sticky;top:52px;overflow-y:auto}.sidebar-label{font-family:var(--ff-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:.8rem;font-size:.65rem}.sidebar-links{flex-direction:column;gap:2px;display:flex}.sidebar-links a{font-family:var(--ff-mono);color:var(--muted);border-radius:4px;align-items:center;gap:6px;padding:.3rem .6rem;font-size:.78rem;text-decoration:none;transition:color .15s,background .15s;display:flex}.sidebar-links a:before{content:"//";color:var(--dim);font-size:.65rem}.sidebar-links.back a:before{content:"<-";color:var(--dim);font-size:.65rem}.sidebar-links a:hover{color:var(--text);background:var(--surface2)}.skill-list{flex-direction:column;gap:4px;display:flex}.skill-item{font-family:var(--ff-mono);color:var(--muted);border-left:2px solid var(--border2);cursor:default;padding:.3rem .6rem;font-size:.78rem;transition:border-color .15s,color .15s}.skill-item:hover{border-color:var(--accent);color:var(--text)}main{flex-direction:column;gap:4rem;padding:3rem clamp(1.5rem,4vw,3rem);display:flex}.hero-eyebrow{font-family:var(--ff-mono);color:var(--green);letter-spacing:.18em;align-items:center;gap:8px;margin-bottom:1rem;font-size:.72rem;display:flex}.hero-eyebrow:before{content:"";background:var(--green);width:20px;height:1px;display:block}h1{font-family:var(--ff-mono);color:var(--text);letter-spacing:-.02em;font-size:clamp(1.8rem,4vw,2.8rem);font-weight:500;line-height:1.1}h1 span{color:var(--accent)}.hero-bio{color:var(--muted);max-width:560px;margin-top:1.2rem;font-size:.9rem;line-height:1.8}.hero-meta{font-family:var(--ff-mono);color:var(--dim);flex-wrap:wrap;gap:1.5rem;margin-top:1.5rem;font-size:.72rem;display:flex}.hero-meta span{align-items:center;gap:5px;display:flex}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.section-head{align-items:center;gap:10px;margin-bottom:1.8rem;display:flex}.section-head h2{font-family:var(--ff-mono);letter-spacing:.25em;text-transform:uppercase;color:var(--muted);white-space:nowrap;font-size:.72rem;font-weight:400}.section-head:after{content:"";background:var(--border);flex:1;height:1px}.exp-grid{flex-direction:column;gap:8px;display:flex}.exp-card{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:1.4rem 1.5rem;transition:border-color .2s,box-shadow .2s}.exp-card:hover{border-color:var(--border2);box-shadow:0 2px 12px #0000000f}.exp-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.6rem;display:flex}.exp-card.link:hover{border-color:var(--accent)}.exp-title{font-family:var(--ff-mono);color:var(--text);font-size:.9rem;font-weight:500}.exp-tag{font-family:var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);background:#1a56db12;border:1px solid #1a56db33;border-radius:3px;padding:2px 8px;font-size:.65rem}.exp-body{color:var(--muted);font-size:.85rem;line-height:1.8}.edu-grid{flex-direction:column;gap:8px;display:flex}.edu-card{background:var(--surface);border:1px solid var(--border);border-radius:6px;grid-template-columns:80px 1fr;gap:1.2rem;padding:1.2rem 1.4rem;transition:border-color .2s,box-shadow .2s;display:grid}.edu-card:hover{border-color:var(--border2);box-shadow:0 2px 12px #0000000f}.edu-year{font-family:var(--ff-mono);color:var(--green);padding-top:2px;font-size:.7rem;line-height:1.6}.edu-degree{color:var(--text);font-size:.9rem;font-weight:500}.edu-inst{font-family:var(--ff-mono);color:var(--muted);margin-top:2px;font-size:.75rem}.edu-detail{color:var(--dim);margin-top:4px;font-size:.82rem}.lang-row{flex-wrap:wrap;gap:.6rem;display:flex}.lang-badge{font-family:var(--ff-mono);color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:.35rem .9rem;font-size:.78rem}.interests-row{flex-wrap:wrap;gap:.6rem;display:flex}.interest-chip{font-family:var(--ff-mono);color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:.3rem .75rem;font-size:.75rem}.interest-chip:before{content:"# ";color:var(--dim)}.opinion-grid{flex-wrap:wrap;gap:.6rem;display:flex}.opinion-link{font-family:var(--ff-mono);color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:4px;align-items:center;gap:6px;padding:.4rem .9rem;font-size:.78rem;text-decoration:none;transition:border-color .2s,color .2s,box-shadow .2s;display:flex}.opinion-link:before{content:"→";color:var(--dim);font-size:.75rem}.opinion-link:hover{border-color:var(--accent2);color:var(--text);box-shadow:0 2px 8px #0000000f}footer{z-index:1;border-top:1px solid var(--border);background:var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;padding:1.4rem clamp(1rem,5vw,3rem);display:flex;position:relative}.footer-contact a{font-family:var(--ff-mono);color:var(--accent);font-size:.78rem;text-decoration:none}.footer-contact a:hover{text-decoration:underline}.footer-copy{font-family:var(--ff-mono);color:var(--dim);font-size:.7rem}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero{animation:.6s both fadeUp}.exp-card:first-child{animation:.5s 50ms both fadeUp}.exp-card:nth-child(2){animation:.5s .12s both fadeUp}.edu-card:first-child{animation:.5s 80ms both fadeUp}.edu-card:nth-child(2){animation:.5s .15s both fadeUp}@media (max-width:700px){.shell{grid-template-columns:1fr}aside{display:none}.edu-card{grid-template-columns:1fr;gap:.3rem}}.edu-tag{letter-spacing:.1em;text-transform:uppercase;border-radius:3px;margin-top:8px;padding:3px 5px;font-family:DM Mono,monospace;font-size:9px;display:inline-block}.tag-dropped{background:var(--surface2);color:var(--muted)}.toplist-ranked li{counter-increment:rank;align-items:center;gap:14px;display:flex}.toplist-ranked{counter-reset:rank}.toplist-ranked li:before{content:counter(rank);color:var(--muted);text-align:right;min-width:16px;font-family:DM Mono,monospace;font-size:11px}.toplist-ranked li img{object-fit:cover;border-radius:4px;flex-shrink:0;width:42px;height:62px}.toplist-toggle{text-align:center;width:100%;display:block}.poster-grid{flex-wrap:wrap;justify-content:center;gap:1.5rem;padding:1rem 0;display:flex}.poster-item{flex-direction:column;align-items:center;width:120px;display:flex}.poster-item img{object-fit:cover;border-radius:6px;width:120px;height:180px}.poster-item p{text-align:center;margin-top:8px;font-size:12px;line-height:1.4}.game-grid{justify-content:center;gap:1.5rem;padding:1rem 0}.game-item{flex-direction:column;align-items:center;width:180px;display:flex}.page-header{flex-direction:column;gap:6px;margin-bottom:2.5rem;display:flex}.page-title{font-family:var(--ff-mono);letter-spacing:-.02em;color:var(--accent);font-size:clamp(1rem,4vw,2rem);font-weight:500;line-height:1}.page-title:before{content:"> ";color:var(--green);font-weight:500}.page-sub{font-family:var(--ff-mono);color:var(--muted);letter-spacing:.08em;padding-left:1.1rem;font-size:.72rem}.posterhover:hover img{transform:scale(1.07)}#rain-canvas{pointer-events:none;z-index:999;opacity:0;width:100%;height:100%;transition:opacity .8s;position:fixed;top:0;left:0}#dragon-grid{pointer-events:none;z-index:999;opacity:.15;position:fixed;top:0;left:0}.outlink{font-family:var(--ff-mono);color:var(--accent);font-size:.78rem;text-decoration:none}.outlink:hover{text-decoration:underline}a{font-family:var(--ff-mono);color:var(--muted);border-radius:4px;align-items:center;gap:6px;padding:.3rem .6rem;font-size:.78rem;text-decoration:none;transition:color .15s,background .15s;display:flex}.rabbit-svg path{fill:gray;transition:fill .3s}.rabbit-svg:hover path{fill:#7f77dd}.scene{font-family:var(--font-sans);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem 1rem;display:flex}.label{letter-spacing:.03em;-webkit-user-select:none;user-select:none;font-size:13px;font-weight:500;transition:color .4s}.label.day-label{color:#b8860b}.label.night-label{color:#9090d0}.state-label{color:var(--color-text-secondary);letter-spacing:.05em;text-transform:uppercase;font-size:11px}.row{align-items:center;gap:12px;display:flex}.copy-block{background:var(--color-background-secondary);border:.5px solid var(--color-border-tertiary);border-radius:var(--border-radius-lg);width:100%;max-width:420px;padding:1rem 1.25rem}.copy-block p{color:var(--color-text-secondary);margin:0 0 8px;font-size:13px}.copy-block code{font-family:var(--font-mono);color:var(--color-text-primary);white-space:nowrap;font-size:12px;display:block;overflow-x:auto}.copy-btn{border-radius:var(--border-radius-md);cursor:pointer;border:.5px solid var(--color-border-secondary);color:var(--color-text-secondary);background:0 0;margin-top:10px;padding:4px 10px;font-size:12px}.copy-btn:hover{background:var(--color-background-secondary)}.Hitchhiker{text-align:center;width:100%;max-width:480px;display:none}.matrix-hidden{color:green;font-family:var(--ff-mono);letter-spacing:.08em;padding-left:1.1rem;font-size:.72rem;display:none}.dot{border-radius:50%;width:6px;height:6px;animation:2s infinite pulse;display:inline-block}.dot--available{background:var(--green)}.dot--busy{background:red}.overlay{z-index:100;background:#0009;justify-content:center;align-items:center;display:none;position:fixed;inset:0}button{font-family:var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);background:#1a56db12;border:1px solid #1a56db33;border-radius:3px;padding:2px 8px;font-size:.65rem}button:hover{border:1px solid #1a57db}.hidden{display:none}section .cta{border:.5px solid var(--accent-border);background:var(--accent-dim);border-radius:8px;margin-top:3rem;padding:2rem}.cta-hed{font-family:var(--mono);color:var(--accent);margin-bottom:.4rem;font-size:13px}.cta-body{color:var(--muted);margin-bottom:1.25rem;font-size:13px;line-height:1.65}.cta-btn{font-family:var(--mono);color:var(--bg);background:var(--accent);cursor:pointer;border:none;border-radius:4px;padding:9px 20px;font-size:12px;text-decoration:none;transition:opacity .15s;display:inline-block}.cta-btn:hover{opacity:.85}.available{color:var(--green);border:1px solid var(--green);background:#41db1a12;border-radius:3px;padding:2px 8px}.busy{color:var(--red);border:1px solid var(--red);background:#db1a1a12;border-radius:3px;padding:2px 8px} \ No newline at end of file +@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Rubik:ital,wght@0,300..900;1,300..900&display=swap";.ibm-plex-serif-thin{font-family:IBM Plex Serif,serif;font-style:normal;font-weight:100}.ibm-plex-serif-extralight{font-family:IBM Plex Serif,serif;font-style:normal;font-weight:200}.ibm-plex-serif-light{font-family:IBM Plex Serif,serif;font-style:normal;font-weight:300}.ibm-plex-serif-regular{font-family:IBM Plex Serif,serif;font-style:normal;font-weight:400}.ibm-plex-serif-medium{font-family:IBM Plex Serif,serif;font-style:normal;font-weight:500}.theme-root.night{--bg:#1c1c1c;--surface:#252525;--surface2:#2a2a2a;--border:#363636;--border2:#ccc7be;--text:#fff;--muted:#d9d9d9;--dim:#b0aa9f;--navback:#1c1c1ccc;--accent:#5389ff;--accent2:#1447b8;--green:#0eaf74;--amber:#ffd78e;--accent-dim:#5da7ca1f;--accent-border:#5d66ca40}.theme-root{--bg:#f7f6f3;--surface:#fff;--surface2:#f0eeea;--border:#e2ddd6;--border2:#ccc7be;--text:#1a1917;--muted:#6b6560;--dim:#b0aa9f;--accent:#1a56db;--accent2:#1447b8;--green:#0a7c52;--amber:#92620a;--navback:#f7f6f3cc --ff-mono:"IBM Plex Mono",monospace;--ff-sans:"IBM Plex Sans",sans-serif;--accent-dim:#5da7ca1f;--accent-border:#5d66ca40}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:15px}body{background:var(--bg);color:var(--text);font-family:var(--ff-sans);min-height:100vh;font-weight:300;line-height:1.7}body:before{content:"";background-image:radial-gradient(circle, var(--border) 1px, transparent 1px);pointer-events:none;z-index:0;background-size:24px 24px;position:fixed;inset:0}nav{background:var(--navback);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);height:52px;padding:0 clamp(1rem,5vw,3rem);display:flex}.nav-logo{font-family:var(--ff-mono);color:var(--accent);align-items:center;gap:6px;font-size:.78rem;font-weight:500;text-decoration:none;display:flex}.nav-logo:before{content:">";color:var(--green);font-weight:500}.nav-logo.sub:before{content:"/";color:var(--green);font-weight:500}.nav-logo.back:before{content:"<-";color:var(--green);font-weight:500}.nav-links{align-items:center;gap:.2rem;display:flex}.nav-links a{font-family:var(--ff-mono);color:var(--muted);border-radius:4px;padding:.3rem .7rem;font-size:.72rem;text-decoration:none;transition:color .15s,background .15s}.nav-links a:hover{color:var(--text);background:var(--surface2)}.nav-links .cta{color:var(--accent);border:1px solid var(--accent);margin-left:.4rem}.nav-links .cta:hover{background:var(--accent2);color:#fff}.shell{z-index:1;grid-template-columns:220px 1fr;max-width:1100px;min-height:calc(100vh - 52px);margin:0 auto;display:grid;position:relative}aside{border-right:1px solid var(--border);background:var(--surface);flex-direction:column;gap:1rem;height:calc(100vh - 52px);padding:2.5rem 1.5rem;display:flex;position:sticky;top:52px;overflow-y:auto}.sidebar-label{font-family:var(--ff-mono);letter-spacing:.2em;text-transform:uppercase;color:var(--dim);margin-bottom:.8rem;font-size:.65rem}.sidebar-links{flex-direction:column;gap:2px;display:flex}.sidebar-links a{font-family:var(--ff-mono);color:var(--muted);border-radius:4px;align-items:center;gap:6px;padding:.3rem .6rem;font-size:.78rem;text-decoration:none;transition:color .15s,background .15s;display:flex}.sidebar-links a:before{content:"//";color:var(--dim);font-size:.65rem}.sidebar-links.back a:before{content:"<-";color:var(--dim);font-size:.65rem}.sidebar-links a:hover{color:var(--text);background:var(--surface2)}.skill-list{flex-direction:column;gap:4px;display:flex}.skill-item{font-family:var(--ff-mono);color:var(--muted);border-left:2px solid var(--border2);cursor:default;padding:.3rem .6rem;font-size:.78rem;transition:border-color .15s,color .15s}.skill-item:hover{border-color:var(--accent);color:var(--text)}main{flex-direction:column;gap:4rem;padding:3rem clamp(1.5rem,4vw,3rem);display:flex}.hero-eyebrow{font-family:var(--ff-mono);color:var(--green);letter-spacing:.18em;align-items:center;gap:8px;margin-bottom:1rem;font-size:.72rem;display:flex}.hero-eyebrow:before{content:"";background:var(--green);width:20px;height:1px;display:block}h1{letter-spacing:-.02em;font-family:IBM Plex Serif,serif;font-size:4rem;font-style:normal;font-weight:300;line-height:1.1}h1 span{color:var(--accent)}.hero-bio{color:var(--muted);max-width:560px;margin-top:1.2rem;font-size:.9rem;line-height:1.8}.hero-meta{font-family:var(--ff-mono);color:var(--dim);flex-wrap:wrap;gap:1.5rem;margin-top:1.5rem;font-size:.72rem;display:flex}.hero-meta span{align-items:center;gap:5px;display:flex}@keyframes pulse{0%,to{opacity:1}50%{opacity:.35}}.section-head{align-items:center;gap:10px;margin-bottom:1.8rem;display:flex}.section-head h2{font-family:var(--ff-mono);letter-spacing:.25em;text-transform:uppercase;color:var(--muted);white-space:nowrap;font-size:.72rem;font-weight:400}.section-head:after{content:"";background:var(--border);flex:1;height:1px}.exp-grid{flex-direction:column;gap:8px;display:flex}.exp-card{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:1.4rem 1.5rem;transition:border-color .2s,box-shadow .2s}.exp-card:hover{border-color:var(--border2);box-shadow:0 2px 12px #0000000f}.exp-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.6rem;display:flex}.exp-card.link:hover{border-color:var(--accent)}.exp-title{color:var(--text);font-family:IBM Plex Serif,serif;font-style:normal;font-weight:500}.exp-tag{font-family:var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);background:#1a56db12;border:1px solid #1a56db33;border-radius:3px;padding:2px 8px;font-size:.65rem}.exp-tag.green{color:green;background:#3ddb1a12;border:1px solid #26670d33}.exp-tag.red{color:red;background:#db1a1a12;border:1px solid #db1a1a33}.exp-body{color:var(--muted);font-size:.85rem;line-height:1.8}.edu-grid{flex-direction:column;gap:8px;display:flex}.edu-card{background:var(--surface);border:1px solid var(--border);border-radius:6px;grid-template-columns:80px 1fr;gap:1.2rem;padding:1.2rem 1.4rem;transition:border-color .2s,box-shadow .2s;display:grid}.edu-card:hover{border-color:var(--border2);box-shadow:0 2px 12px #0000000f}.edu-year{font-family:var(--ff-mono);color:var(--green);padding-top:2px;font-size:.7rem;line-height:1.6}.edu-degree{color:var(--text);font-size:.9rem;font-weight:500}.edu-inst{font-family:var(--ff-mono);color:var(--muted);margin-top:2px;font-size:.75rem}.edu-detail{color:var(--dim);margin-top:4px;font-size:.82rem}.lang-row{flex-wrap:wrap;gap:.6rem;display:flex}.lang-badge{font-family:var(--ff-mono);color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:.35rem .9rem;font-size:.78rem}.interests-row{flex-wrap:wrap;gap:.6rem;display:flex}.interest-chip{font-family:var(--ff-mono);color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:.3rem .75rem;font-size:.75rem}.interest-chip:before{content:"# ";color:var(--dim)}.opinion-grid{flex-wrap:wrap;gap:.6rem;display:flex}.opinion-link{font-family:var(--ff-mono);color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:4px;align-items:center;gap:6px;padding:.4rem .9rem;font-size:.78rem;text-decoration:none;transition:border-color .2s,color .2s,box-shadow .2s;display:flex}.opinion-link:before{content:"→";color:var(--dim);font-size:.75rem}.opinion-link:hover{border-color:var(--accent2);color:var(--text);box-shadow:0 2px 8px #0000000f}footer{z-index:1;border-top:1px solid var(--border);background:var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;padding:1.4rem clamp(1rem,5vw,3rem);display:flex;position:relative}.footer-contact a{font-family:var(--ff-mono);color:var(--accent);font-size:.78rem;text-decoration:none}.footer-contact a:hover{text-decoration:underline}.footer-copy{font-family:var(--ff-mono);color:var(--dim);font-size:.7rem}@keyframes fadeUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.hero{animation:.6s both fadeUp}.exp-card:first-child{animation:.5s 50ms both fadeUp}.exp-card:nth-child(2){animation:.5s .12s both fadeUp}.edu-card:first-child{animation:.5s 80ms both fadeUp}.edu-card:nth-child(2){animation:.5s .15s both fadeUp}@media (max-width:700px){.shell{grid-template-columns:1fr}aside{display:none}.edu-card{grid-template-columns:1fr;gap:.3rem}}.edu-tag{letter-spacing:.1em;text-transform:uppercase;border-radius:3px;margin-top:8px;padding:3px 5px;font-family:DM Mono,monospace;font-size:9px;display:inline-block}.tag-dropped{background:var(--surface2);color:var(--muted)}.toplist-ranked li{counter-increment:rank;align-items:center;gap:14px;display:flex}.toplist-ranked{counter-reset:rank}.toplist-ranked li:before{content:counter(rank);color:var(--muted);text-align:right;min-width:16px;font-family:DM Mono,monospace;font-size:11px}.toplist-ranked li img{object-fit:cover;border-radius:4px;flex-shrink:0;width:42px;height:62px}.toplist-toggle{text-align:center;width:100%;display:block}.poster-grid{flex-wrap:wrap;justify-content:center;gap:1.5rem;padding:1rem 0;display:flex}.poster-item{flex-direction:column;align-items:center;width:120px;display:flex}.poster-item img{object-fit:cover;border-radius:6px;width:120px;height:180px}.poster-item p{text-align:center;margin-top:8px;font-size:12px;line-height:1.4}.game-grid{justify-content:center;gap:1.5rem;padding:1rem 0}.game-item{flex-direction:column;align-items:center;width:180px;display:flex}.page-header{flex-direction:column;gap:6px;margin-bottom:2.5rem;display:flex}.page-title{font-family:var(--ff-mono);letter-spacing:-.02em;color:var(--accent);font-size:clamp(1rem,4vw,2rem);font-weight:500;line-height:1}.page-title:before{content:"> ";color:var(--green);font-weight:500}.page-sub{font-family:var(--ff-mono);color:var(--muted);letter-spacing:.08em;padding-left:1.1rem;font-size:.72rem}.posterhover:hover img{transform:scale(1.07)}#rain-canvas{pointer-events:none;z-index:999;opacity:0;width:100%;height:100%;transition:opacity .8s;position:fixed;top:0;left:0}#dragon-grid{pointer-events:none;z-index:999;opacity:.15;position:fixed;top:0;left:0}.outlink{font-family:var(--ff-mono);color:var(--accent);font-size:.78rem;text-decoration:none}.outlink:hover{text-decoration:underline}a{font-family:var(--ff-mono);color:var(--muted);border-radius:4px;align-items:center;gap:6px;padding:.3rem .6rem;font-size:.78rem;text-decoration:none;transition:color .15s,background .15s;display:flex}.rabbit-svg path{fill:gray;transition:fill .3s}.rabbit-svg:hover path{fill:#7f77dd}.scene{font-family:var(--font-sans);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem 1rem;display:flex}.label{letter-spacing:.03em;-webkit-user-select:none;user-select:none;font-size:13px;font-weight:500;transition:color .4s}.label.day-label{color:#b8860b}.label.night-label{color:#9090d0}.state-label{color:var(--color-text-secondary);letter-spacing:.05em;text-transform:uppercase;font-size:11px}.row{align-items:center;gap:12px;display:flex}.copy-block{background:var(--color-background-secondary);border:.5px solid var(--color-border-tertiary);border-radius:var(--border-radius-lg);width:100%;max-width:420px;padding:1rem 1.25rem}.copy-block p{color:var(--color-text-secondary);margin:0 0 8px;font-size:13px}.copy-block code{font-family:var(--font-mono);color:var(--color-text-primary);white-space:nowrap;font-size:12px;display:block;overflow-x:auto}.copy-btn{border-radius:var(--border-radius-md);cursor:pointer;border:.5px solid var(--color-border-secondary);color:var(--color-text-secondary);background:0 0;margin-top:10px;padding:4px 10px;font-size:12px}.copy-btn:hover{background:var(--color-background-secondary)}.Hitchhiker{text-align:center;width:100%;max-width:480px;display:none}.matrix-hidden{color:green;font-family:var(--ff-mono);letter-spacing:.08em;padding-left:1.1rem;font-size:.72rem;display:none}.dot{border-radius:50%;width:6px;height:6px;animation:2s infinite pulse;display:inline-block}.dot--available{background:var(--green)}.dot--busy{background:red}.overlay{z-index:100;background:#0009;justify-content:center;align-items:center;display:none;position:fixed;inset:0}button{font-family:var(--ff-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--accent);background:#1a56db12;border:1px solid #1a56db33;border-radius:3px;padding:2px 8px;font-size:.65rem}button:hover{border:1px solid #1a57db}.hidden{display:none}section .cta{border:.5px solid var(--accent-border);background:var(--accent-dim);border-radius:8px;margin-top:3rem;padding:2rem}.cta-hed{font-family:var(--mono);color:var(--accent);margin-bottom:.4rem;font-size:13px}.cta-body{color:var(--muted);margin-bottom:1.25rem;font-size:13px;line-height:1.65}.cta-btn{font-family:var(--mono);color:var(--bg);background:var(--accent);cursor:pointer;border:none;border-radius:4px;padding:9px 20px;font-size:12px;text-decoration:none;transition:opacity .15s;display:inline-block}.cta-btn:hover{opacity:.85}.available{color:var(--green);border:1px solid var(--green);background:#41db1a12;border-radius:3px;padding:2px 8px}.busy{color:var(--red);border:1px solid var(--red);background:#db1a1a12;border-radius:3px;padding:2px 8px} \ No newline at end of file diff --git a/static/style/styles.css b/static/style/styles.css deleted file mode 100644 index a8b28ad..0000000 --- a/static/style/styles.css +++ /dev/null @@ -1,1169 +0,0 @@ -/* ─── Variables ─── */ -:root { - --bg: #f7f6f3; - --surface: #ffffff; - --surface2: #f0eeea; - --border: #e2ddd6; - --border-focus: #ccc7be; - --text: #1a1917; - --muted: #6b6560; - --dim: #b0aa9f; - --accent: #1a56db; - --accent2: #1447b8; - --green: #0a7c52; - --red: #b91c1c; - --yellow: #92620a; - --ff-mono: 'IBM Plex Mono', monospace; - --ff-sans: 'IBM Plex Sans', sans-serif; -} - -/* ─── Reset ─── */ -*, -*::before, -*::after { - box-sizing: border-box; - margin: 0; - padding: 0; -} -html { - scroll-behavior: smooth; -} - -/* ─── Base ─── */ -body { - background: var(--bg); - color: var(--text); - font-family: var(--ff-mono); - font-weight: 300; - min-height: 100vh; - overflow-x: hidden; -} - -/* Dot grid overlay */ -body::before { - content: ""; - position: fixed; - inset: 0; - background-image: radial-gradient(circle, var(--border) 1px, transparent 1px); - background-size: 24px 24px; - opacity: 0.5; - pointer-events: none; - z-index: 0; -} - -/* ─── Layout ─── */ -.container { - max-width: 860px; - margin: 0 auto; - padding: 0 2rem; -} -.container--wide { - max-width: 1100px; - margin: 0 auto; - padding: 0 2rem; -} -.container--narrow { - max-width: 720px; - margin: 0 auto; - padding: 0 2rem; -} - -/* ─── Header ─── */ -header { - border-bottom: 1px solid var(--border); - animation: fadeUp 0.6s ease both; - position: relative; - z-index: 1; -} - -.back { - display: inline-flex; - align-items: center; - gap: 0.4rem; - font-size: 0.72rem; - color: var(--muted); - text-decoration: none; - letter-spacing: 0.1em; - text-transform: uppercase; - margin-bottom: 2rem; - transition: color 0.2s; - font-family: var(--ff-mono); -} -.back:hover { - color: var(--accent); -} - -.tag { - font-size: 0.7rem; - letter-spacing: 0.2em; - text-transform: uppercase; - color: var(--accent); - margin-bottom: 1rem; - font-family: var(--ff-mono); -} - -h1 { - font-family: var(--ff-mono); - font-size: clamp(2rem, 5vw, 3.2rem); - font-weight: 500; - line-height: 1.05; - letter-spacing: -0.02em; - color: var(--text); -} -h1 span { - color: var(--accent); - font-size: clamp(1.6rem, 2.5vw, 2.8rem); -} - -.header-sub { - margin-top: 0.6rem; - font-size: 0.78rem; - color: var(--muted); -} - -.byline { - margin-top: 1.2rem; - font-size: 0.72rem; - color: var(--muted); - display: flex; - gap: 1.5rem; - font-family: var(--ff-mono); -} -.byline span { - color: var(--accent); -} - -/* ─── Typography ─── */ -h2 { - font-family: var(--ff-mono); - font-size: 1rem; - font-weight: 500; - color: var(--accent); - margin: 2.8rem 0 1rem; - letter-spacing: -0.01em; -} -h2::before { - content: "// "; - color: var(--dim); - font-family: var(--ff-mono); - font-weight: 300; -} - -p { - font-family: var(--ff-sans); - font-size: 0.88rem; - line-height: 1.9; - color: var(--muted); - margin-bottom: 1.2rem; - font-weight: 300; -} - -code { - font-family: var(--ff-mono); - font-size: 0.78rem; - color: var(--accent); - background: rgba(26, 86, 219, 0.06); - padding: 0.1rem 0.4rem; - border: 1px solid rgba(26, 86, 219, 0.15); - border-radius: 2px; -} - -hr { - border: none; - border-top: 1px solid var(--border); - margin: 2.5rem 0; -} - -.section-label { - font-family: var(--ff-mono); - font-size: 0.65rem; - letter-spacing: 0.2em; - text-transform: uppercase; - color: var(--dim); - margin-bottom: 1.2rem; -} - -.lead { - font-family: var(--ff-sans); - font-size: 0.95rem; - line-height: 1.9; - color: var(--text); - font-weight: 300; - border-left: 2px solid var(--accent2); - padding-left: 1.5rem; - margin-bottom: 3rem; -} - -blockquote { - margin: 2.5rem 0; - padding: 1.6rem 2rem; - background: var(--surface); - border: 1px solid var(--border); - border-left: 3px solid var(--accent); - font-family: var(--ff-mono); - font-size: 0.95rem; - font-weight: 400; - color: var(--text); - line-height: 1.6; - border-radius: 0 4px 4px 0; -} -blockquote span { - color: var(--accent); -} - -/* ─── Color utilities ─── */ -.up { - color: var(--green); -} -.down { - color: var(--red); -} -.neutral { - color: var(--muted); -} - -/* ─── Cards ─── */ -.cards { - display: grid; - grid-template-columns: repeat(4, 1fr); - gap: 8px; - margin: 3rem 0 2.5rem; - animation: fadeUp 0.6s 0.1s ease both; -} -.card { - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 1.4rem 1.6rem; - transition: border-color 0.2s, box-shadow 0.2s; -} -.card:hover { - border-color: var(--border-focus); - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); -} -.card-label { - font-family: var(--ff-mono); - font-size: 0.62rem; - letter-spacing: 0.15em; - text-transform: uppercase; - color: var(--dim); - margin-bottom: 0.5rem; -} -.card-value { - font-family: var(--ff-mono); - font-size: 1.4rem; - font-weight: 500; - color: var(--text); -} - -/* ─── Nav grid (homepage) ─── */ -.nav-grid { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 8px; -} -.nav-item { - display: block; - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 2rem 2rem 1.8rem; - text-decoration: none; - color: var(--text); - position: relative; - overflow: hidden; - transition: border-color 0.2s, box-shadow 0.2s; - animation: fadeUp 0.7s ease both; -} -.nav-item::after { - content: ""; - position: absolute; - bottom: 0; - left: 0; - width: 0; - height: 2px; - background: var(--accent); - transition: width 0.3s ease; -} -.nav-item:hover { - border-color: var(--accent2); - box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07); -} -.nav-item:hover::after { - width: 100%; -} -.nav-item:hover .arrow { - transform: translate(4px, -4px); -} -.nav-number { - font-family: var(--ff-mono); - font-size: 0.65rem; - color: var(--dim); - letter-spacing: 0.15em; - margin-bottom: 1.4rem; -} -.nav-title { - font-family: var(--ff-mono); - font-size: 1.1rem; - font-weight: 500; - margin-bottom: 0.5rem; - display: flex; - align-items: center; - justify-content: space-between; - gap: 0.5rem; - color: var(--text); -} -.arrow { - font-size: 1rem; - color: var(--accent); - transition: transform 0.25s ease; - flex-shrink: 0; -} -.nav-desc { - font-family: var(--ff-sans); - font-size: 0.78rem; - color: var(--muted); - line-height: 1.6; - font-weight: 300; -} - -/* ─── Table ─── */ -.table-wrap { - overflow-x: auto; - animation: fadeUp 0.6s 0.2s ease both; - margin-bottom: 2.5rem; - border: 1px solid var(--border); - border-radius: 6px; -} -table { - width: 100%; - border-collapse: collapse; - font-size: 0.78rem; - font-family: var(--ff-mono); -} -thead tr { - border-bottom: 1px solid var(--border); - background: var(--surface2); -} -thead th { - font-size: 0.62rem; - letter-spacing: 0.12em; - text-transform: uppercase; - color: var(--dim); - padding: 0.7rem 1rem; - text-align: right; - white-space: nowrap; - font-weight: 400; -} -thead th:first-child { - text-align: left; -} -tbody tr { - border-bottom: 1px solid var(--border); - transition: background 0.15s; - background: var(--surface); -} -tbody tr:hover { - background: var(--surface2); -} -tbody td { - padding: 1rem; - text-align: right; - white-space: nowrap; - color: var(--text); -} -tbody td:first-child { - text-align: left; -} - -.ticker { - font-family: var(--ff-mono); - font-weight: 500; - font-size: 0.88rem; - color: var(--text); -} -.currency-badge { - display: inline-block; - font-size: 0.6rem; - padding: 0.15rem 0.4rem; - border: 1px solid var(--border); - color: var(--muted); - margin-left: 0.4rem; - vertical-align: middle; - border-radius: 2px; -} -.weight-cell { - display: flex; - align-items: center; - justify-content: flex-end; - gap: 0.6rem; -} -.weight-bar-track { - width: 60px; - height: 3px; - background: var(--border); - border-radius: 2px; - overflow: hidden; -} -.weight-bar-fill { - height: 100%; - background: var(--accent); - border-radius: 2px; - opacity: 0.5; -} -.watchlist-row td { - color: var(--muted); -} -.watchlist-label { - font-size: 0.62rem; - letter-spacing: 0.12em; - text-transform: uppercase; - color: var(--dim); - padding: 1.2rem 1rem 0.5rem; -} - -/* ─── Skill bars ─── */ -.skills-list { - display: flex; - flex-direction: column; - gap: 0.75rem; -} -.skill-row { - display: grid; - grid-template-columns: 80px 1fr; - align-items: center; - gap: 1rem; - font-size: 0.78rem; - color: var(--muted); - font-family: var(--ff-mono); -} -.skill-bar-track { - height: 3px; - background: var(--border); - border-radius: 2px; - overflow: hidden; -} -.skill-bar-fill { - height: 100%; - background: var(--accent); - border-radius: 2px; - opacity: 0.6; - transform-origin: left; - animation: growBar 0.8s ease both; -} - -/* ─── Compare grid ─── */ -.compare { - display: grid; - grid-template-columns: 1fr 1fr; - gap: 8px; - margin: 2rem 0; -} -.compare-col { - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 1.4rem 1.6rem; - transition: border-color 0.2s; -} -.compare-col:hover { - border-color: var(--border-focus); -} -.compare-col h3 { - font-family: var(--ff-mono); - font-size: 0.82rem; - font-weight: 500; - margin-bottom: 1rem; - padding-bottom: 0.6rem; - border-bottom: 1px solid var(--border); -} -.compare-col.bad h3 { - color: var(--red); -} -.compare-col.good h3 { - color: var(--green); -} -.compare-col ul { - list-style: none; - display: flex; - flex-direction: column; - gap: 0.6rem; -} -.compare-col ul li { - font-family: var(--ff-sans); - font-size: 0.78rem; - color: var(--muted); - line-height: 1.5; - padding-left: 1rem; - position: relative; - font-weight: 300; -} -.compare-col.bad ul li::before { - content: "—"; - position: absolute; - left: 0; - color: var(--red); -} -.compare-col.good ul li::before { - content: "+"; - position: absolute; - left: 0; - color: var(--green); -} - -/* ─── Experience & Education ─── */ -.exp-block { - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 1.5rem; - margin-bottom: 8px; - transition: border-color 0.2s, box-shadow 0.2s; -} -.exp-block:hover { - border-color: var(--border-focus); - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05); -} -.exp-block p { - font-size: 0.78rem; - color: var(--muted); - line-height: 1.7; - margin-top: 0.4rem; -} - -.edu-item { - display: grid; - grid-template-columns: 80px 1fr; - gap: 1.5rem; - margin-bottom: 1.5rem; - padding-bottom: 1.5rem; - border-bottom: 1px solid var(--border); -} -.edu-item:last-child { - border-bottom: none; - margin-bottom: 0; -} -.edu-year { - font-family: var(--ff-mono); - font-size: 0.65rem; - color: var(--yellow); - letter-spacing: 0.1em; - padding-top: 0.15rem; -} -.edu-title { - font-family: var(--ff-mono); - font-size: 0.92rem; - font-weight: 500; - margin-bottom: 0.25rem; - color: var(--text); -} -.edu-sub { - font-family: var(--ff-sans); - font-size: 0.78rem; - color: var(--muted); - line-height: 1.6; - font-weight: 300; -} - -.tags { - display: flex; - flex-wrap: wrap; - gap: 0.5rem; -} -.tag-pill { - font-family: var(--ff-mono); - font-size: 0.7rem; - padding: 0.3rem 0.75rem; - border: 1px solid var(--border); - color: var(--muted); - letter-spacing: 0.05em; - border-radius: 3px; - transition: border-color 0.15s, color 0.15s; -} -.tag-pill:hover { - border-color: var(--accent2); - color: var(--accent); -} - -/* ─── Forms / Login ─── */ -.form-group { - margin-bottom: 1.2rem; -} -label { - display: block; - font-family: var(--ff-mono); - font-size: 0.62rem; - letter-spacing: 0.14em; - text-transform: uppercase; - color: var(--muted); - margin-bottom: 0.5rem; -} -input[type="text"], -input[type="password"] { - width: 100%; - background: var(--bg); - border: 1px solid var(--border); - color: var(--text); - font-family: var(--ff-mono); - font-size: 0.82rem; - padding: 0.7rem 0.9rem; - outline: none; - border-radius: 4px; - transition: border-color 0.2s, box-shadow 0.2s; -} -input[type="text"]:focus, -input[type="password"]:focus { - border-color: var(--accent2); - box-shadow: 0 0 0 3px rgba(26, 71, 184, 0.1); -} -input::placeholder { - color: var(--dim); -} - -.btn { - width: 100%; - background: var(--accent2); - color: #ffffff; - font-family: var(--ff-mono); - font-size: 0.78rem; - letter-spacing: 0.1em; - text-transform: uppercase; - padding: 0.8rem 1rem; - border: none; - border-radius: 4px; - cursor: pointer; - transition: background 0.2s, opacity 0.2s; -} -.btn:hover { - background: var(--accent); -} -.btn:active { - opacity: 0.85; -} - -/* ─── Footer ─── */ -footer { - padding: 2.5rem 0 3rem; - border-top: 1px solid var(--border); - display: flex; - flex-direction: column; - align-items: center; - gap: 0.6rem; - text-align: center; - animation: fadeUp 0.6s 0.4s ease both; - position: relative; - z-index: 1; -} -footer a { - font-family: var(--ff-mono); - color: var(--accent); - text-decoration: none; - font-size: 0.82rem; - transition: opacity 0.2s; -} -footer a:hover { - opacity: 0.7; -} -.footer-copy { - font-family: var(--ff-mono); - font-size: 0.68rem; - color: var(--dim); - letter-spacing: 0.05em; -} - -/* ─── Animations ─── */ -@keyframes fadeUp { - from { - opacity: 0; - transform: translateY(12px); - } - to { - opacity: 1; - transform: translateY(0); - } -} -@keyframes growBar { - from { - transform: scaleX(0); - } - to { - transform: scaleX(1); - } -} -@keyframes shake { - 0%, 100% { transform: translateX(0); } - 20% { transform: translateX(-6px); } - 40% { transform: translateX(6px); } - 60% { transform: translateX(-4px); } - 80% { transform: translateX(4px); } -} -@keyframes pulse { - 0%, 100% { opacity: 1; } - 50% { opacity: 0.35; } -} -.shake { - animation: shake 0.4s ease; -} - -/* ─── Article layout ─── */ -article { - padding: 3.5rem 0; - animation: fadeUp 0.6s 0.1s ease both; - position: relative; - z-index: 1; -} -main { - padding: 3.5rem 0; - position: relative; - z-index: 1; -} - -/* ─── Classify grid (cyber page) ─── */ -.classify-grid { - display: grid; - grid-template-columns: repeat(3, 1fr); - gap: 8px; - margin: 2rem 0; -} -.classify-card { - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 1.4rem 1.3rem; - transition: border-color 0.2s, box-shadow 0.2s; -} -.classify-card:hover { - border-color: var(--border-focus); - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06); -} -.classify-card h3 { - font-family: var(--ff-mono); - font-size: 0.88rem; - font-weight: 500; - margin-bottom: 0.5rem; - color: var(--text); -} -.classify-card p { - font-size: 0.72rem; - color: var(--muted); - margin: 0; - line-height: 1.6; -} -.level { - font-family: var(--ff-mono); - font-size: 0.6rem; - letter-spacing: 0.18em; - text-transform: uppercase; - margin-bottom: 0.6rem; - font-weight: 500; -} -.level-critical { - color: var(--red); -} -.level-high { - color: var(--yellow); -} -.level-standard { - color: var(--green); -} - -/* ─── Principles (cyber page) ─── */ -.principles { - display: flex; - flex-direction: column; - gap: 8px; - margin: 2rem 0; -} -.principle { - display: grid; - grid-template-columns: 2.5rem 1fr; - gap: 1.2rem; - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 1.2rem 1.4rem; - align-items: start; - transition: border-color 0.2s; -} -.principle:hover { - border-color: var(--border-focus); -} -.principle-num { - font-family: var(--ff-mono); - font-size: 1rem; - font-weight: 500; - color: var(--accent2); - padding-top: 0.1rem; -} -.principle-title { - font-family: var(--ff-mono); - font-size: 0.88rem; - font-weight: 500; - color: var(--text); - margin-bottom: 0.35rem; -} -.principle p { - font-size: 0.77rem; - color: var(--muted); - line-height: 1.65; - margin: 0; -} - -.counter { - color: var(--green); - font-size: 0.72rem; - font-family: var(--ff-mono); -} - -/* ─── Login panel ─── */ -.login-panel { - border: 1px solid var(--border); - border-radius: 6px; - background: var(--surface); - padding: 2rem; -} -.login-panel h2 { - font-family: var(--ff-mono); - font-size: 0.95rem; - font-weight: 500; - margin-bottom: 0.3rem; - color: var(--text); -} -.login-panel h2::before { - display: none; -} -.login-panel .desc { - font-family: var(--ff-sans); - font-size: 0.78rem; - color: var(--muted); - margin-bottom: 2rem; - line-height: 1.6; - font-weight: 300; -} -.twofa-group { - display: none; - margin-bottom: 1.2rem; -} -.twofa-group.visible { - display: block; -} -.twofa-hint { - font-family: var(--ff-mono); - font-size: 0.68rem; - color: var(--muted); - margin-top: 0.4rem; -} -.btn-login { - width: 100%; - background: var(--accent2); - color: #ffffff; - font-family: var(--ff-mono); - font-size: 0.78rem; - letter-spacing: 0.1em; - text-transform: uppercase; - padding: 0.8rem 1rem; - border: none; - border-radius: 4px; - cursor: pointer; - transition: background 0.2s, opacity 0.2s; - margin-top: 0.4rem; -} -.btn-login:hover { - background: var(--accent); -} -.btn-login:active { - opacity: 0.85; -} -.login-error { - font-family: var(--ff-mono); - font-size: 0.72rem; - color: var(--red); - margin-top: 1rem; - display: none; -} -.login-error.visible { - display: block; -} - -/* ─── Private dashboard ─── */ -#private-dashboard { - display: none; -} -#private-dashboard.visible { - display: block; -} -.repo-list { - display: flex; - flex-direction: column; - gap: 8px; -} -.repo-item { - background: var(--surface); - border: 1px solid var(--border); - border-radius: 6px; - padding: 1.1rem 1.3rem; - display: flex; - justify-content: space-between; - align-items: flex-start; - gap: 1rem; - transition: border-color 0.2s, box-shadow 0.15s; - cursor: pointer; - text-decoration: none; -} -.repo-item:hover { - border-color: var(--border-focus); - box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06); -} -.repo-name { - font-family: var(--ff-mono); - font-size: 0.88rem; - font-weight: 500; - color: var(--text); - margin-bottom: 0.2rem; -} -.repo-desc { - font-family: var(--ff-sans); - font-size: 0.72rem; - color: var(--muted); - font-weight: 300; -} -.repo-badge { - font-family: var(--ff-mono); - font-size: 0.6rem; - padding: 0.2rem 0.5rem; - border: 1px solid var(--border); - color: var(--muted); - white-space: nowrap; - flex-shrink: 0; - border-radius: 3px; -} -.repo-badge.private { - color: var(--red); - border-color: rgba(185, 28, 28, 0.25); - background: rgba(185, 28, 28, 0.04); -} -.repo-badge.active { - color: var(--green); - border-color: rgba(10, 124, 82, 0.25); - background: rgba(10, 124, 82, 0.04); -} -.logout-btn { - margin-top: 1.2rem; - font-family: var(--ff-mono); - font-size: 0.65rem; - letter-spacing: 0.12em; - text-transform: uppercase; - color: var(--muted); - background: none; - border: none; - cursor: pointer; - padding: 0; - transition: color 0.2s; -} -.logout-btn:hover { - color: var(--red); -} - -/* ─── Empty state ─── */ -.empty-state { - border: 1px dashed var(--border); - border-radius: 6px; - padding: 3rem 2rem; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - text-align: center; - gap: 0.8rem; - min-height: 280px; - background: var(--surface); -} -.empty-icon { - font-size: 1.8rem; - opacity: 0.2; -} -.empty-title { - font-family: var(--ff-mono); - font-size: 0.88rem; - font-weight: 500; - color: var(--muted); -} -.empty-sub { - font-family: var(--ff-sans); - font-size: 0.72rem; - color: var(--muted); - opacity: 0.6; - max-width: 200px; - line-height: 1.6; - font-weight: 300; -} - -/* ─── Two column main ─── */ -main.two-col { - padding: 3.5rem 0; - display: grid; - grid-template-columns: 1fr 1fr; - gap: 3rem; - animation: fadeUp 0.6s 0.1s ease both; - position: relative; - z-index: 1; -} - -/* ─── Page nav ─── */ -.page-nav { - display: flex; - justify-content: center; - gap: 6px; - flex-wrap: wrap; - margin-bottom: 40px; - padding-top: 6px; - width: 100%; - font-family: var(--ff-mono); -} -.page-nav a { - font-family: var(--ff-mono); - font-size: 0.72rem; - color: var(--muted); - border: 1px solid var(--border); - padding: 5px 12px; - border-radius: 3px; - text-decoration: none; - letter-spacing: 0.04em; - transition: color 0.15s, border-color 0.15s, background 0.15s; - position: relative; - overflow: hidden; -} -.page-nav a:hover { - color: var(--accent); - border-color: var(--accent2); - background: rgba(26, 86, 219, 0.05); -} -.page-nav a span { - position: relative; - z-index: 1; -} -.page-nav a.active { - color: var(--accent); - border-color: var(--accent); - background: rgba(26, 86, 219, 0.06); -} - -/* ─── Attack table (cyber page) ─── */ -.attack-table { - width: 100%; - border-collapse: collapse; - table-layout: fixed; - font-size: 0.76rem; - margin: 2rem 0; - font-family: var(--ff-mono); - border-radius: 6px; - overflow: hidden; - border: 1px solid var(--border); -} -.attack-table thead th { - font-size: 0.6rem; - letter-spacing: 0.14em; - text-transform: uppercase; - color: var(--dim); - padding: 0.6rem 1rem; - text-align: left; - border-bottom: 1px solid var(--border); - word-wrap: break-word; - background: var(--surface2); - font-weight: 400; -} -.attack-table tbody tr { - border-bottom: 1px solid var(--border); - transition: background 0.15s; - background: var(--surface); -} -.attack-table tbody tr:hover { - background: var(--surface2); -} -.attack-table tbody td { - padding: 0.9rem 1rem; - color: var(--muted); - vertical-align: top; - line-height: 1.55; - text-align: left; - word-wrap: break-word; - overflow-wrap: break-word; - white-space: normal; -} -.attack-table td:first-child { - color: var(--red); - font-weight: 500; - width: 18%; -} -.attack-table td:nth-child(2) { - width: 40%; -} -.attack-table td:nth-child(3) { - width: 42%; - color: var(--green); - font-size: 0.72rem; -} -.attack-table thead th:nth-child(1) { width: 18%; } -.attack-table thead th:nth-child(2) { width: 42%; } -.attack-table thead th:nth-child(3) { width: 40%; } - -nav .section-label { - margin: 0; - padding: 0; -} - -/* ─── Responsive ─── */ -@media (max-width: 700px) { - .cards { - grid-template-columns: 1fr 1fr; - } -} -@media (max-width: 640px) { - main.two-col { - grid-template-columns: 1fr; - gap: 2.5rem; - } -} -@media (max-width: 560px) { - .nav-grid { - grid-template-columns: 1fr; - } - .edu-item { - grid-template-columns: 1fr; - gap: 0.4rem; - } - .skill-row { - grid-template-columns: 70px 1fr; - } - .compare { - grid-template-columns: 1fr; - } - footer { - flex-direction: column; - gap: 0.5rem; - } - .classify-grid { - grid-template-columns: 1fr; - } -} -@media (max-width: 420px) { - .cards { - grid-template-columns: 1fr; - } -} - - .edu-tag { - display: inline-block; - margin-top: 8px; - font-family: 'DM Mono', monospace; - font-size: 8px; - letter-spacing: 0.1em; - text-transform: uppercase; - padding: 3px 5px; - border-radius: 3px; - } - - .tag-dropped { - background: #F0EBE4; - color: #8A5C2E; - }