aboutsummaryrefslogtreecommitdiffstats
path: root/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'style.css')
-rw-r--r--style.css1022
1 files changed, 0 insertions, 1022 deletions
diff --git a/style.css b/style.css
deleted file mode 100644
index 6f3f24e..0000000
--- a/style.css
+++ /dev/null
@@ -1,1022 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600;700&display=swap");
-
-* {
- margin: 0;
- padding: 0;
- box-sizing: border-box;
-}
-
-:root {
- /* DARK MODE (DEFAULT) */
- --bg: #000000;
- --fg: #ffffff;
- --gray: #666666;
- --panel: #0a0a0a;
- --border-color: #ffffff;
- --border-thin-color: #333333;
- --input-ph: #333333;
- --hover-bg: #111111;
-}
-
-body.light-mode {
- /* LIGHT MODE (INVERTED) */
- --bg: #f4f4f5;
- --fg: #09090b;
- --gray: #52525b;
- --panel: #e4e4e7;
- --border-color: #09090b;
- --border-thin-color: #a1a1aa;
- --input-ph: #a1a1aa;
- --hover-bg: #d4d4d8;
-}
-
-/* Variables used in CSS */
-:root {
- --border: 3px solid var(--border-color);
- --border-thin: 1px solid var(--border-thin-color);
-}
-
-::selection {
- background: var(--fg);
- color: var(--bg);
-}
-
-html {
- font-size: 14px;
-}
-
-body {
- font-family: "IBM Plex Mono", monospace;
- background: var(--bg);
- color: var(--fg);
- min-height: 100vh;
- cursor: crosshair;
- transition:
- background 0.2s,
- color 0.2s;
-}
-
-a {
- color: inherit;
- text-decoration: none;
-}
-
-/* HERO SEARCH */
-.hero {
- min-height: 50vh;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- padding: 40px 20px;
- border-bottom: var(--border);
- position: relative;
-}
-
-.hero.compact {
- min-height: auto;
- padding: 20px;
- position: sticky;
- top: 0;
- background: var(--bg);
- z-index: 1000;
-}
-
-.logo-large {
- font-size: 72px;
- font-weight: 700;
- letter-spacing: -4px;
- margin-bottom: 10px;
- display: flex;
- align-items: center;
- gap: 10px;
-}
-
-.hero.compact .logo-large {
- font-size: 24px;
- letter-spacing: -1px;
- margin-bottom: 0;
- position: absolute;
- left: 30px;
- top: 50%;
- transform: translateY(-50%);
-}
-
-.logo-large::before {
- content: ">";
- animation: blink 1s infinite;
-}
-
-@keyframes blink {
- 0%,
- 49% {
- opacity: 1;
- }
- 50%,
- 100% {
- opacity: 0;
- }
-}
-
-.tagline {
- font-size: 12px;
- color: var(--gray);
- letter-spacing: 4px;
- text-transform: uppercase;
- margin-bottom: 50px;
-}
-
-.hero.compact .tagline {
- display: none;
-}
-
-.search-container {
- width: 100%;
- max-width: 800px;
-}
-
-.search-box {
- display: flex;
- border: var(--border);
- background: var(--bg);
-}
-
-.search-prefix {
- padding: 25px 25px;
- font-size: 28px;
- font-weight: 700;
- border-right: var(--border);
- background: var(--fg);
- color: var(--bg);
-}
-
-#search-input {
- flex: 1;
- padding: 25px 30px;
- font-size: 24px;
- font-family: inherit;
- font-weight: 600;
- background: transparent;
- color: var(--fg);
- border: none;
- outline: none;
- letter-spacing: -0.5px;
-}
-
-#search-input::placeholder {
- color: var(--input-ph);
-}
-
-.search-actions {
- display: flex;
-}
-
-.action-btn {
- width: 80px;
- background: transparent;
- border: none;
- border-left: var(--border);
- color: var(--fg);
- font-size: 20px;
- cursor: pointer;
- transition: all 0.1s;
- font-family: inherit;
-}
-
-.action-btn:hover {
- background: var(--fg);
- color: var(--bg);
-}
-
-.hero.compact .search-container {
- max-width: 600px;
-}
-
-.hero.compact .search-box {
- border-width: 2px;
-}
-
-.hero.compact .search-prefix {
- padding: 15px 20px;
- font-size: 20px;
- border-width: 2px;
-}
-
-.hero.compact #search-input {
- padding: 15px 20px;
- font-size: 18px;
-}
-
-.hero.compact .action-btn {
- width: 60px;
- border-width: 2px;
-}
-
-/* SHORTCUTS */
-.shortcuts {
- display: flex;
- flex-wrap: wrap;
- justify-content: center;
- gap: 10px;
- margin-top: 30px;
-}
-
-.hero.compact .shortcuts {
- display: none;
-}
-
-.shortcut {
- padding: 12px 20px;
- border: 2px solid var(--border-thin-color);
- font-size: 11px;
- letter-spacing: 2px;
- cursor: pointer;
- transition: all 0.1s;
- text-transform: uppercase;
-}
-
-.shortcut:hover {
- border-color: var(--fg);
- background: var(--fg);
- color: var(--bg);
-}
-
-/* STATS BAR */
-.stats-bar {
- display: none;
- justify-content: center;
- gap: 40px;
- padding: 15px;
- font-size: 11px;
- letter-spacing: 2px;
- color: var(--gray);
- border-bottom: var(--border-thin);
-}
-
-.stats-bar.visible {
- display: flex;
-}
-
-.stat-item {
- display: flex;
- gap: 10px;
-}
-
-.stat-value {
- color: var(--fg);
- font-weight: 700;
-}
-
-/* MAIN LAYOUT */
-.main {
- display: grid;
- grid-template-columns: 300px 1fr 300px;
- min-height: 50vh;
-}
-
-@media (max-width: 1200px) {
- .main {
- grid-template-columns: 1fr;
- }
- .sidebar-left,
- .sidebar-right {
- border: none !important;
- border-bottom: var(--border) !important;
- }
-}
-
-/* SIDEBARS */
-.sidebar-left,
-.sidebar-right {
- border-right: var(--border);
-}
-
-.sidebar-right {
- border-right: none;
- border-left: var(--border);
-}
-
-/* WIDGET */
-.widget {
- border-bottom: var(--border-thin);
-}
-
-.widget-header {
- padding: 15px 20px;
- display: flex;
- justify-content: space-between;
- align-items: center;
- cursor: pointer;
- transition: background 0.1s;
-}
-
-.widget-header:hover {
- background: var(--hover-bg);
-}
-
-.widget-title {
- font-size: 10px;
- text-transform: uppercase;
- letter-spacing: 3px;
- color: var(--gray);
-}
-
-.widget-toggle {
- font-size: 16px;
- color: var(--gray);
- transition: transform 0.2s;
-}
-
-.widget.open .widget-toggle {
- transform: rotate(45deg);
-}
-
-.widget-body {
- display: none;
- padding: 20px;
- border-top: var(--border-thin);
-}
-
-.widget.open .widget-body {
- display: block;
-}
-
-/* TOOLS GRID */
-.tools-grid {
- display: grid;
- grid-template-columns: repeat(2, 1fr);
- gap: 8px;
-}
-
-.tool-btn {
- padding: 15px 10px;
- border: 2px solid var(--border-thin-color);
- background: transparent;
- color: var(--gray);
- font-family: inherit;
- font-size: 9px;
- text-transform: uppercase;
- letter-spacing: 1px;
- cursor: pointer;
- transition: all 0.1s;
- display: flex;
- flex-direction: column;
- align-items: center;
- gap: 8px;
-}
-
-.tool-btn:hover {
- background: var(--fg);
- color: var(--bg);
- border-color: var(--fg);
-}
-
-.tool-btn .icon {
- font-size: 20px;
-}
-
-/* BANGS */
-.bangs-grid {
- display: flex;
- flex-wrap: wrap;
- gap: 6px;
-}
-
-.bang {
- padding: 6px 10px;
- border: 1px solid var(--border-thin-color);
- font-size: 10px;
- cursor: pointer;
- transition: all 0.1s;
-}
-
-.bang:hover {
- background: var(--fg);
- color: var(--bg);
-}
-
-/* CALCULATOR */
-.calc-display {
- background: var(--hover-bg);
- padding: 15px;
- margin-bottom: 15px;
- border: 1px solid var(--border-thin-color);
-}
-
-.calc-expr {
- font-size: 12px;
- color: var(--gray);
- min-height: 16px;
-}
-
-.calc-result {
- font-size: 28px;
- font-weight: 700;
-}
-
-.calc-grid {
- display: grid;
- grid-template-columns: repeat(4, 1fr);
- gap: 4px;
-}
-
-.calc-btn {
- padding: 12px;
- border: 1px solid var(--border-thin-color);
- background: transparent;
- color: var(--fg);
- font-family: inherit;
- font-size: 14px;
- font-weight: 600;
- cursor: pointer;
- transition: all 0.1s;
-}
-
-.calc-btn:hover {
- background: var(--fg);
- color: var(--bg);
-}
-
-.calc-btn.op {
- background: var(--hover-bg);
-}
-
-/* CLOCKS */
-.clocks-grid {
- display: grid;
- grid-template-columns: repeat(2, 1fr);
- gap: 10px;
-}
-
-.clock {
- padding: 12px;
- border: 1px solid var(--border-thin-color);
- text-align: center;
-}
-
-.clock-time {
- font-size: 16px;
- font-weight: 700;
- font-variant-numeric: tabular-nums;
-}
-
-.clock-label {
- font-size: 8px;
- text-transform: uppercase;
- letter-spacing: 2px;
- color: var(--gray);
- margin-top: 4px;
-}
-
-/* HISTORY */
-.history-item {
- padding: 10px 0;
- border-bottom: 1px solid var(--border-thin-color);
- display: flex;
- justify-content: space-between;
- align-items: center;
- font-size: 12px;
- cursor: pointer;
- color: var(--gray);
-}
-
-.history-item:hover {
- color: var(--fg);
-}
-
-.history-item:last-child {
- border-bottom: none;
-}
-
-.history-time {
- font-size: 9px;
-}
-
-/* SOURCES LIST */
-.sources-list {
- display: flex;
- flex-direction: column;
- gap: 4px;
-}
-
-.source-item {
- padding: 10px 12px;
- border: 1px solid var(--border-thin-color);
- display: flex;
- justify-content: space-between;
- align-items: center;
- font-size: 10px;
- letter-spacing: 1px;
- cursor: pointer;
- transition: all 0.1s;
-}
-
-.source-item:hover {
- border-color: var(--fg);
-}
-
-.source-item.active {
- background: var(--fg);
- color: var(--bg);
-}
-
-.source-count {
- font-weight: 700;
-}
-
-/* WATCHLIST (Editable) */
-.watchlist-input-row {
- display: flex;
- margin-bottom: 10px;
- border: 1px solid var(--border-thin-color);
-}
-
-#watchlist-input {
- flex: 1;
- background: transparent;
- border: none;
- color: var(--fg);
- font-family: inherit;
- font-size: 10px;
- padding: 8px;
- outline: none;
- text-transform: uppercase;
-}
-
-#watchlist-add-btn {
- padding: 0 10px;
- background: var(--hover-bg);
- border: none;
- border-left: 1px solid var(--border-thin-color);
- color: var(--fg);
- cursor: pointer;
- font-size: 14px;
-}
-
-#watchlist-add-btn:hover {
- background: var(--fg);
- color: var(--bg);
-}
-
-.watchlist-item-row {
- padding: 10px 12px;
- border: 1px solid var(--border-thin-color);
- display: flex;
- justify-content: space-between;
- align-items: center;
- font-size: 10px;
- letter-spacing: 1px;
- cursor: pointer;
- transition: all 0.1s;
- margin-bottom: 4px;
-}
-
-.watchlist-item-row:hover {
- border-color: var(--fg);
-}
-
-.watchlist-del-btn {
- color: var(--gray);
- padding: 0 5px;
- cursor: pointer;
- font-size: 14px;
-}
-
-.watchlist-del-btn:hover {
- color: var(--fg);
- font-weight: bold;
-}
-
-/* RESULTS */
-.results-section {
- min-height: 400px;
-}
-
-.results-header {
- display: flex;
- justify-content: space-between;
- padding: 15px 25px;
- border-bottom: var(--border-thin);
- font-size: 10px;
- text-transform: uppercase;
- letter-spacing: 2px;
- color: var(--gray);
-}
-
-.results-container {
- display: flex;
- flex-direction: column;
-}
-
-/* STOCK WIDGET */
-.stock-widget {
- border-bottom: var(--border);
- background: var(--panel);
-}
-
-.stock-header {
- padding: 30px;
- border-bottom: var(--border-thin);
- display: flex;
- justify-content: space-between;
- align-items: center;
-}
-
-.stock-info h2 {
- font-size: 32px;
- font-weight: 700;
- letter-spacing: -1px;
-}
-
-.stock-info .ticker {
- font-size: 12px;
- color: var(--gray);
- letter-spacing: 2px;
- margin-top: 5px;
-}
-
-.stock-actions-top {
- display: flex;
- gap: 10px;
-}
-
-.stock-btn {
- padding: 10px 20px;
- border: 2px solid var(--border-thin-color);
- background: transparent;
- color: var(--fg);
- font-family: inherit;
- font-size: 10px;
- letter-spacing: 1px;
- cursor: pointer;
- transition: all 0.1s;
-}
-
-.stock-btn:hover {
- background: var(--fg);
- color: var(--bg);
- border-color: var(--fg);
-}
-
-.tradingview-widget-container {
- height: 500px;
-}
-
-/* RESULT CARD */
-.result {
- border-bottom: var(--border-thin);
- display: grid;
- grid-template-columns: 50px 1fr;
- transition: background 0.1s;
-}
-
-.result:hover {
- background: var(--hover-bg);
-}
-
-.result-index {
- padding: 20px 15px;
- border-right: var(--border-thin);
- font-size: 11px;
- color: var(--gray);
- text-align: center;
- font-weight: 700;
-}
-
-.result-body {
- padding: 20px 25px;
-}
-
-.result-source {
- font-size: 9px;
- text-transform: uppercase;
- letter-spacing: 2px;
- color: var(--gray);
- margin-bottom: 8px;
-}
-
-.result-title {
- font-size: 16px;
- font-weight: 600;
- letter-spacing: -0.5px;
- margin-bottom: 8px;
- line-height: 1.4;
- cursor: pointer;
-}
-
-.result-title:hover {
- text-decoration: underline;
- text-underline-offset: 3px;
-}
-
-.result-url {
- font-size: 11px;
- color: var(--gray);
- margin-bottom: 10px;
- word-break: break-all;
-}
-
-.result-snippet {
- font-size: 12px;
- line-height: 1.7;
- color: var(--gray);
-}
-
-.result-snippet mark {
- background: var(--fg);
- color: var(--bg);
- padding: 0 2px;
-}
-
-.result-meta {
- display: flex;
- gap: 15px;
- margin-top: 12px;
- font-size: 10px;
- color: var(--gray);
- text-transform: uppercase;
- letter-spacing: 1px;
-}
-
-/* INSTANT ANSWER */
-.instant-box {
- border-bottom: var(--border);
- padding: 40px;
- background: var(--panel);
-}
-
-.instant-label {
- font-size: 9px;
- text-transform: uppercase;
- letter-spacing: 3px;
- color: var(--gray);
- margin-bottom: 20px;
- display: flex;
- align-items: center;
- gap: 10px;
-}
-
-.instant-label::before {
- content: "■";
- animation: blink 0.5s infinite;
-}
-
-.instant-title {
- font-size: 28px;
- font-weight: 700;
- letter-spacing: -1px;
- margin-bottom: 20px;
- line-height: 1.2;
-}
-
-.instant-content {
- font-size: 14px;
- line-height: 1.8;
- color: var(--gray);
- max-width: 700px;
-}
-
-.instant-content p {
- margin-bottom: 12px;
-}
-
-.instant-meta {
- margin-top: 25px;
- padding-top: 20px;
- border-top: var(--border-thin);
- display: flex;
- gap: 25px;
- font-size: 10px;
- text-transform: uppercase;
- letter-spacing: 1px;
- color: var(--gray);
-}
-
-.instant-meta a {
- border-bottom: 1px solid var(--gray);
-}
-
-.instant-meta a:hover {
- border-color: var(--fg);
- color: var(--fg);
-}
-
-/* EMPTY STATE */
-.empty-state {
- padding: 60px 30px;
- text-align: center;
-}
-
-.empty-title {
- font-size: 18px;
- font-weight: 700;
- margin-bottom: 15px;
- color: var(--gray);
-}
-
-.empty-text {
- color: var(--gray);
- font-size: 12px;
- line-height: 1.8;
-}
-
-/* LOADING */
-.loading-row {
- display: flex;
- padding: 25px;
- border-bottom: var(--border-thin);
- gap: 20px;
- align-items: center;
-}
-
-.loading-bar {
- height: 2px;
- background: var(--hover-bg);
- flex: 1;
- position: relative;
- overflow: hidden;
-}
-
-.loading-bar::after {
- content: "";
- position: absolute;
- left: -50%;
- width: 50%;
- height: 100%;
- background: var(--fg);
- animation: loading 1s infinite;
-}
-
-@keyframes loading {
- to {
- left: 150%;
- }
-}
-
-.loading-text {
- font-size: 10px;
- text-transform: uppercase;
- letter-spacing: 2px;
- color: var(--gray);
-}
-
-/* TOOL MODAL */
-.tool-modal {
- padding: 30px;
- background: var(--panel);
-}
-
-.tool-modal textarea {
- width: 100%;
- padding: 15px;
- background: var(--bg);
- border: 2px solid var(--border-thin-color);
- color: var(--fg);
- font-family: inherit;
- font-size: 13px;
- resize: vertical;
- min-height: 100px;
- margin: 15px 0;
-}
-
-.tool-modal textarea:focus {
- outline: none;
- border-color: var(--fg);
-}
-
-.tool-btn-row {
- display: flex;
- gap: 10px;
-}
-
-.tool-action {
- padding: 12px 25px;
- border: 2px solid var(--border-thin-color);
- background: transparent;
- color: var(--fg);
- font-family: inherit;
- font-size: 11px;
- text-transform: uppercase;
- letter-spacing: 2px;
- cursor: pointer;
-}
-
-.tool-action:hover {
- background: var(--fg);
- color: var(--bg);
-}
-
-.tool-output {
- margin-top: 20px;
- padding: 20px;
- background: var(--bg);
- border: 2px solid var(--border-thin-color);
- font-size: 12px;
- word-break: break-all;
-}
-
-/* TOAST */
-.toast-container {
- position: fixed;
- bottom: 20px;
- left: 50%;
- transform: translateX(-50%);
- z-index: 3000;
- display: flex;
- flex-direction: column;
- gap: 10px;
-}
-
-.toast {
- padding: 15px 30px;
- border: 3px solid var(--fg);
- background: var(--bg);
- font-size: 12px;
- letter-spacing: 2px;
- animation: toastIn 0.2s ease;
-}
-
-@keyframes toastIn {
- from {
- transform: translateY(20px);
- opacity: 0;
- }
- to {
- transform: translateY(0);
- opacity: 1;
- }
-}
-
-/* FOOTER */
-.footer {
- border-top: var(--border);
- padding: 20px 30px;
- display: flex;
- justify-content: center;
- align-items: center;
- gap: 40px;
- font-size: 10px;
- color: var(--gray);
- text-transform: uppercase;
- letter-spacing: 2px;
-}
-
-.theme-btn {
- background: transparent;
- border: 1px solid var(--gray);
- color: var(--gray);
- padding: 5px 10px;
- cursor: pointer;
- font-family: inherit;
- text-transform: uppercase;
- letter-spacing: 1px;
- font-size: 9px;
-}
-
-.theme-btn:hover {
- border-color: var(--fg);
- color: var(--fg);
-}
-
-/* SCROLLBAR */
-::-webkit-scrollbar {
- width: 8px;
- height: 8px;
-}
-
-::-webkit-scrollbar-track {
- background: var(--bg);
-}
-
-::-webkit-scrollbar-thumb {
- background: #222;
-}
-
-body.light-mode ::-webkit-scrollbar-thumb {
- background: #ccc;
-}
-
-::-webkit-scrollbar-thumb:hover {
- background: var(--gray);
-}
-
-/* RESPONSIVE */
-@media (max-width: 768px) {
- .logo-large {
- font-size: 48px;
- }
- .hero.compact .logo-large {
- display: none;
- }
- #search-input {
- font-size: 18px;
- padding: 20px;
- }
- .search-prefix {
- padding: 20px;
- font-size: 20px;
- }
- .main {
- grid-template-columns: 1fr;
- }
-}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2026-01-29 10:55:13 +0000