/* ============================================================ КПК 134.0 — стеклянный AR-каркас (темы Явь / Навь). Стационарная версия AR-чипа. Тему ставит milc.js через data-theme на ; обои — data-wall (см. nav-fx.js). ============================================================ */ /* выдуманный язык (навий) — свой шрифт */ @font-face{ font-family:"Myfont"; src:url("fonts/Myfont-Regular.ttf") format("truetype"); font-display:swap; } /* ===== ТЕМЫ ===== */ :root,[data-theme="nav"]{ /* Навь · ч/б тёмная */ --milc-bg:#1c1e22; /* монолитный тёмный нейтральный */ --milc-screen:rgba(255,255,255,.08); --milc-ink:#eef0f4; --milc-ink-2:#ffffff; --milc-ink-soft:#a6adba; --milc-line:rgba(255,255,255,.20); --milc-line-soft:rgba(255,255,255,.10); --milc-halo:transparent; --milc-accent:#ff6a54; --milc-scan:transparent; --milc-menu-bg:rgba(30,33,40,.92); --milc-menu-ink:#eef0f4; --milc-menu-sub:rgba(230,235,245,.5); --milc-menu-border:rgba(255,255,255,.16); --glass-bg:rgba(255,255,255,.08); --glass-brd:rgba(255,255,255,.22); --glass-blur:14px; --tile-tint:#eef1f6; /* плитки светлые (ч/б) */ --navfx-blend:screen; --navfx-op:1; --navfx-innerblur:2px; --navfx-haze:1; } [data-theme="yav"]{ /* Явь · ч/б светлая */ --milc-bg:#f3f4f8; /* почти белый фон */ --milc-screen:rgba(22,25,32,.11); --milc-ink:#15181f; --milc-ink-2:#0a0c12; --milc-ink-soft:#565d6e; --milc-line:rgba(20,24,32,.22); --milc-line-soft:rgba(20,24,32,.12); --milc-halo:transparent; --milc-accent:#c0392b; --milc-scan:transparent; --milc-menu-bg:rgba(248,249,252,.95); --milc-menu-ink:#15181f; --milc-menu-sub:rgba(20,24,32,.55); --milc-menu-border:rgba(20,24,32,.2); --glass-bg:rgba(22,25,32,.11); --glass-brd:rgba(20,24,32,.20); --glass-blur:14px; /* панели — переходный серый */ --tile-tint:#14161c; /* плитки чёрные (ч/б) */ --navfx-blend:multiply; --navfx-op:.5; --navfx-innerblur:0px; --navfx-haze:0; } [data-theme="hvoya"]{ /* Хвоя · зелёная (сохранённая цветосхема) */ --milc-bg:#173a44; --milc-screen:rgba(255,255,255,.09); --milc-ink:#eef0ff; --milc-ink-2:#ffffff; --milc-ink-soft:#9fb6d6; --milc-line:rgba(255,255,255,.22); --milc-line-soft:rgba(255,255,255,.12); --milc-halo:transparent; --milc-accent:#ff7a7a; --milc-scan:transparent; --milc-menu-bg:rgba(18,22,38,.72); --milc-menu-ink:#eef0ff; --milc-menu-sub:rgba(230,235,255,.5); --milc-menu-border:rgba(255,255,255,.18); --glass-bg:rgba(255,255,255,.09); --glass-brd:rgba(255,255,255,.22); --glass-blur:14px; --tile-tint:#ffc98a; --navfx-blend:screen; --navfx-op:1; --navfx-innerblur:2px; --navfx-haze:1; } :root{ --milc-radius:20px; --milc-ui: system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --milc-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace; } *{ box-sizing:border-box; } html,body{ height:100%; } body{ margin:0; overflow:hidden; background:var(--milc-bg); color:var(--milc-ink); font-family:var(--milc-ui); padding:18px; } /* свой курсор рисует nav-fx.js — системный прячем только когда модуль включён */ body.navfx-on, body.navfx-on *{ cursor:none; } /* псевдоэлементы нативных ползунков (их не достаёт `*`) — тоже прячем системный курсор */ body.navfx-on input[type=range]::-webkit-slider-thumb{ cursor:none; } body.navfx-on input[type=range]::-webkit-slider-runnable-track{ cursor:none; } body.navfx-on input[type=range]::-moz-range-thumb{ cursor:none; } body.navfx-on input[type=range]::-moz-range-track{ cursor:none; } html[data-lang="xx"] body{ font-family:"Myfont",var(--milc-mono); } /* терминальные зоны — моноширинный */ .console, .power-boot{ font-family:var(--milc-mono); } /* …но в навий даже терминал говорит на навьем (Myfont перекрывает моно) */ html[data-lang="xx"] .console, html[data-lang="xx"] .power-boot, html[data-lang="xx"] .ctxmenu{ font-family:"Myfont",var(--milc-mono); } /* названия языков — автонимы, всегда в своём письме (не подхватывают Myfont). «навий» оставляем шрифтом Myfont инлайном — это его собственный автоним. */ #langRow .opt{ font-family:var(--milc-ui); } /* ===== ФОН-ОБОИ: только градиенты на одном элементе (без blur/blend/слоёв) — дёшево для GPU ===== */ #navfx-bg{ position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden; border-radius:inherit; } /* задник = один монолитный цвет темы */ .navfx-base{ position:absolute; inset:0; background:var(--milc-bg); } /* слой курсора-капли */ #navfx-trail{ position:fixed; top:0; left:0; z-index:10001; pointer-events:none; will-change:transform; } /* ===== рамка «монитора» ===== */ .frame{ position:relative; height:100%; border-radius:var(--milc-radius); background:transparent; color:var(--milc-ink); overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.4), inset 0 0 0 1px rgba(255,255,255,.08); } .frame::after{ content:none; } /* ===== содержимое экрана ===== */ .screen{ position:relative; z-index:1; height:100%; padding:18px; display:flex; flex-direction:column; gap:14px; } /* ===== шапка / статус — стеклянные полосы ===== */ .titlebar,.statusbar{ background:var(--glass-bg); border:1px solid var(--glass-brd); border-radius:14px; box-shadow:inset 0 1px 0 rgba(255,255,255,.18), 0 2px 8px rgba(0,0,0,.22); } .titlebar{ display:flex; justify-content:space-between; align-items:center; padding:12px 18px; font-size:13px; letter-spacing:2px; color:var(--milc-ink-soft); } .titlebar .os{ font-weight:bold; letter-spacing:4px; color:var(--milc-ink); } .statusbar{ display:flex; justify-content:space-between; align-items:center; padding:10px 18px; font-size:12px; color:var(--milc-ink-soft); } .navlinks{ display:flex; gap:18px; } .navlinks a{ color:var(--milc-ink-soft); text-decoration:none; font-weight:bold; } .navlinks a:hover,.navlinks a:focus{ color:var(--milc-ink); text-decoration:underline; outline:none; } /* ===== утилиты ===== */ ::selection { background: color-mix(in srgb, var(--milc-ink) 30%, transparent); } ::-moz-selection { background: color-mix(in srgb, var(--milc-ink) 30%, transparent); } .halo{ text-shadow:none; } .milc-scroll{ scrollbar-width:thin; scrollbar-color:var(--milc-line) transparent; } .milc-scroll::-webkit-scrollbar{ width:9px; height:9px; } .milc-scroll::-webkit-scrollbar-track{ background:transparent; } .milc-scroll::-webkit-scrollbar-thumb{ background:var(--milc-line); border-radius:6px; } .milc-scroll::-webkit-scrollbar-thumb:hover{ background:var(--milc-ink-soft); } /* ===== контекстное меню (стекло) ===== */ .ctxmenu{ position:fixed; z-index:10000; min-width:244px; margin:0; padding:7px; list-style:none; background:var(--milc-menu-bg); color:var(--milc-menu-ink); border:1px solid var(--glass-brd); border-radius:14px; box-shadow:0 18px 44px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.10); font-family:var(--milc-mono); font-size:14px; } .ctxmenu[hidden]{ display:none; } .ctxmenu li{ margin:0; } .ctxmenu .sep{ height:1px; background:var(--milc-line-soft); margin:6px 8px; } .ctxmenu button{ position:relative; display:flex; justify-content:space-between; gap:18px; align-items:center; width:100%; background:transparent; border:none; color:inherit; font:inherit; text-align:left; padding:9px 12px; border-radius:9px; cursor:inherit; transition:background .12s, color .12s; } /* последний span в кнопке — хоткей-чип / подпись */ .ctxmenu button > span:last-child{ color:var(--milc-menu-sub); font-size:11px; letter-spacing:.5px; padding:2px 7px; border-radius:6px; background:color-mix(in srgb, var(--milc-menu-ink) 8%, transparent); } .ctxmenu button:hover, .ctxmenu button:focus{ background:color-mix(in srgb, var(--milc-menu-ink) 12%, transparent); outline:none; } /* СОС — красный акцент, как одноимённая плитка */ .ctxmenu button[data-act="sos"]{ color:var(--milc-accent); font-weight:700; } .ctxmenu button[data-act="sos"]:hover{ background:color-mix(in srgb, var(--milc-accent) 16%, transparent); } /* ===== движение ===== */ @media (prefers-reduced-motion: reduce){ .navfx-blob,.navfx-neb{ animation:none; } } html[data-motion="off"] *, html[data-motion="off"] *::before, html[data-motion="off"] *::after{ animation:none !important; transition:none !important; } @media (max-width:760px){ body{ padding:10px; } .screen{ padding:14px; gap:10px; } }