From ae69ccd7678cd89fde3afc850373aecc1797beab Mon Sep 17 00:00:00 2001 From: Cytrogen Date: Wed, 4 Mar 2026 18:34:21 -0500 Subject: [PATCH] =?UTF-8?q?=E9=A2=86=E5=9C=B0=E5=9C=B0=E5=9B=BE=E4=B8=8A?= =?UTF-8?q?=E7=BA=BF=20cytrogen.icu?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 添加全部领地页面（地图、城堡、内部、卧室、工坊等 16 页） 扩展 realm.css 设计系统 添加 AGPL-3.0 开源许可证 更新 Caddy 参考配置至 Phase 4 --- .gitignore | 1 + CLAUDE.md | 88 -- LICENSE | 661 ++++++++++++++ caddy/phase1-redirect.example.Caddyfile | 51 -- caddy/phase4-live.example.Caddyfile | 50 ++ css/realm.css | 1048 ++++++++++++++++++++++- index.html | 303 +++++-- pages/about.html | 213 +++++ pages/announcement.html | 43 + pages/canon.html | 327 +++++++ pages/castle.html | 201 +++++ pages/colophon.html | 748 ++++++++++++++++ pages/contact.html | 185 +++- pages/death.html | 56 ++ pages/friends.html | 31 + pages/hosted.html | 214 +++++ pages/hotel.html | 215 +++++ pages/interior.html | 413 +++++++++ pages/map.html | 213 +++++ pages/neighbors.html | 189 ++++ pages/station.html | 60 ++ pages/uses.html | 925 ++++++++++++++++++++ 22 files changed, 5989 insertions(+), 246 deletions(-) delete mode 100644 CLAUDE.md create mode 100644 LICENSE delete mode 100644 caddy/phase1-redirect.example.Caddyfile create mode 100644 caddy/phase4-live.example.Caddyfile create mode 100644 pages/about.html create mode 100644 pages/announcement.html create mode 100644 pages/canon.html create mode 100644 pages/castle.html create mode 100644 pages/colophon.html create mode 100644 pages/death.html create mode 100644 pages/friends.html create mode 100644 pages/hosted.html create mode 100644 pages/hotel.html create mode 100644 pages/interior.html create mode 100644 pages/map.html create mode 100644 pages/neighbors.html create mode 100644 pages/station.html create mode 100644 pages/uses.html diff --git a/.gitignore b/.gitignore index 4c5f2067e39fc25d9553143dacc5f4c1aacac23c..2f7f63eb5bc82868cea158cc7e4a5739ed013ded 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ .claude/ +CLAUDE.md diff --git a/CLAUDE.md b/CLAUDE.md deleted file mode 100644 index b6ba8c9bd76e13bb4c83b88e33a8a5ac582244c0..0000000000000000000000000000000000000000 --- a/CLAUDE.md +++ /dev/null @@ -1,88 +0,0 @@ -# CLAUDE.md - -This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. - -## Project Overview - -Realm is the visual exploration portal for cytrogen.icu. It replaces the root domain's previous blog with a Castlevania-inspired territory map. The blog lives at blog.cytrogen.icu. - -**Design language**: Deep cold tones (oklch blues), high-saturation orange as the sole accent, flat geometry, no strokes, no gradients, large color blocks. - -**Tech stack**: Pure HTML + CSS. Zero JavaScript. All SVG is inline. No build tools, no bundler, no framework. - -## Deployment - -Push-to-deploy via bare repo on VPS (accessible as `ssh vps-user`): - -``` -git push origin main -``` - -The post-receive hook at `~/repos/realm.git/hooks/post-receive` performs: -1. Checkout to temp dir -2. rsync to `/var/www/realm` (excludes `.git`, `caddy/`, `CLAUDE.md`) -3. Push to local Sourcehut instance (`ssh://git@localhost:22222/~cytrogen/realm`) - -Caddy config lives at `/etc/caddy/Caddyfile` on the VPS (backup at `~/vps-deploy/Caddyfile`). Editing requires sudo. The `caddy/` directory in this repo contains reference snippets only. - -### VPS Infrastructure - -| Subdomain | Service | Backend | -|---|---|---| -| cytrogen.icu | Phase 1: 301 → blog.cytrogen.icu | Caddy redirect | -| blog.cytrogen.icu | Hexo blog (static) | `/var/www/blog.cytrogen.icu` | -| git.cytrogen.icu | Sourcehut git | localhost:5003 | -| meta.cytrogen.icu | Sourcehut meta | localhost:5001 | -| rss.cytrogen.icu | FreshRSS | localhost:8096 | -| status.cytrogen.icu | Beszel | localhost:8090 | -| mail.cytrogen.icu | Stalwart | localhost:8080 | - -Blog deploys via `~/repos/blog.git` → builds Hexo → `/var/www/blog.cytrogen.icu` → pushes to Sourcehut (`blog-local` + `blog-public`). - -## Architecture - -### CSS (`css/realm.css`) - -Single stylesheet using `@layer` for cascade control: -``` -@layer reset, tokens, base, layout, components, utilities; -``` - -- **tokens**: oklch color variables, spacing, typography scales, motion durations on `:root` -- **components**: SVG fill classes (`.svg-icon`, `.svg-interactive`), navigation, panels -- Typed `@property` declarations at file top enable smooth color transitions on SVG fills -- `prefers-reduced-motion` kills all transition durations globally - -Colors use oklch with relative color syntax (`oklch(from var(--accent) ...)`) for derived variants. - -### SVG Conventions - -All SVG assets are inline in the HTML DOM — never `` or ``. - -- Reusable shapes: `` in a hidden sprite block, referenced via `` -- Decorative SVG: `aria-hidden="true" focusable="false"` -- Informative SVG: `role="img" aria-labelledby="title-id"` with `` as first child -- Paths use CSS classes for fills — no inline `fill` attributes -- No `stroke` attributes anywhere. No gradients. Fill-only flat geometry. -- Use `viewBox` only — omit explicit `width`/`height` on `<symbol>` for responsive scaling - -### Page Structure - -- `index.html` — Realm entry, contains the SVG sprite `<defs>` block and navigation -- `pages/contact.html` — 领地联络处 (Contact) -- `caddy/` — Reference Caddyfile snippets (not deployed) - -## Migration Phases - -1. **Phase 1** (done): 301 redirect cytrogen.icu → blog.cytrogen.icu, blog files at `/var/www/blog.cytrogen.icu` -2. **Phase 2** (current): CSS/SVG design system established in `css/realm.css` -3. **Phase 3** (planned): Full scene layout — Castlevania-style layered environment or game-map navigation. CSS classes `.realm-scene`, `.realm-layer--far/mid/near` are pre-defined in the layout layer. -4. **Phase 4** (planned): Realm goes live at cytrogen.icu root (serve from `/var/www/realm`), remove 301 redirects - -## Design Constraints - -- No JavaScript unless absolutely unavoidable -- All interactivity via CSS (`:hover`, `:focus-visible`, transitions, `@property` animations) -- SVG complexity must degrade gracefully — use container queries or media queries to hide detail at small sizes -- Text-only fallback for terminals/Gemini-style access (planned: separate gopher/gemini protocol support) -- Accessibility: skip decorative SVG via `aria-hidden`, label informative SVG, respect `prefers-reduced-motion` diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000000000000000000000000000000000000..be3f7b28e564e7dd05eaf59d64adba1a4065ac0e --- /dev/null +++ b/LICENSE @@ -0,0 +1,661 @@ + GNU AFFERO GENERAL PUBLIC LICENSE + Version 3, 19 November 2007 + + Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/> + Everyone is permitted to copy and distribute verbatim copies + of this license document, but changing it is not allowed. + + Preamble + + The GNU Affero General Public License is a free, copyleft license for +software and other kinds of works, specifically designed to ensure +cooperation with the community in the case of network server software. + + The licenses for most software and other practical works are designed +to take away your freedom to share and change the works. By contrast, +our General Public Licenses are intended to guarantee your freedom to +share and change all versions of a program--to make sure it remains free +software for all its users. + + When we speak of free software, we are referring to freedom, not +price. Our General Public Licenses are designed to make sure that you +have the freedom to distribute copies of free software (and charge for +them if you wish), that you receive source code or can get it if you +want it, that you can change the software or use pieces of it in new +free programs, and that you know you can do these things. + + Developers that use our General Public Licenses protect your rights +with two steps: (1) assert copyright on the software, and (2) offer +you this License which gives you legal permission to copy, distribute +and/or modify the software. + + A secondary benefit of defending all users' freedom is that +improvements made in alternate versions of the program, if they +receive widespread use, become available for other developers to +incorporate. Many developers of free software are heartened and +encouraged by the resulting cooperation. However, in the case of +software used on network servers, this result may fail to come about. +The GNU General Public License permits making a modified version and +letting the public access it on a server without ever releasing its +source code to the public. + + The GNU Affero General Public License is designed specifically to +ensure that, in such cases, the modified source code becomes available +to the community. It requires the operator of a network server to +provide the source code of the modified version running there to the +users of that server. Therefore, public use of a modified version, on +a publicly accessible server, gives the public access to the source +code of the modified version. + + An older license, called the Affero General Public License and +published by Affero, was designed to accomplish similar goals. This is +a different license, not a version of the Affero GPL, but Affero has +released a new version of the Affero GPL which permits relicensing under +this license. + + The precise terms and conditions for copying, distribution and +modification follow. + + TERMS AND CONDITIONS + + 0. Definitions. + + "This License" refers to version 3 of the GNU Affero General Public License. + + "Copyright" also means copyright-like laws that apply to other kinds of +works, such as semiconductor masks. + + "The Program" refers to any copyrightable work licensed under this +License. Each licensee is addressed as "you". "Licensees" and +"recipients" may be individuals or organizations. + + To "modify" a work means to copy from or adapt all or part of the work +in a fashion requiring copyright permission, other than the making of an +exact copy. The resulting work is called a "modified version" of the +earlier work or a work "based on" the earlier work. + + A "covered work" means either the unmodified Program or a work based +on the Program. + + To "propagate" a work means to do anything with it that, without +permission, would make you directly or secondarily liable for +infringement under applicable copyright law, except executing it on a +computer or modifying a private copy. Propagation includes copying, +distribution (with or without modification), making available to the +public, and in some countries other activities as well. + + To "convey" a work means any kind of propagation that enables other +parties to make or receive copies. Mere interaction with a user through +a computer network, with no transfer of a copy, is not conveying. + + An interactive user interface displays "Appropriate Legal Notices" +to the extent that it includes a convenient and prominently visible +feature that (1) displays an appropriate copyright notice, and (2) +tells the user that there is no warranty for the work (except to the +extent that warranties are provided), that licensees may convey the +work under this License, and how to view a copy of this License. If +the interface presents a list of user commands or options, such as a +menu, a prominent item in the list meets this criterion. + + 1. Source Code. + + The "source code" for a work means the preferred form of the work +for making modifications to it. "Object code" means any non-source +form of a work. + + A "Standard Interface" means an interface that either is an official +standard defined by a recognized standards body, or, in the case of +interfaces specified for a particular programming language, one that +is widely used among developers working in that language. + + The "System Libraries" of an executable work include anything, other +than the work as a whole, that (a) is included in the normal form of +packaging a Major Component, but which is not part of that Major +Component, and (b) serves only to enable use of the work with that +Major Component, or to implement a Standard Interface for which an +implementation is available to the public in source code form. A +"Major Component", in this context, means a major essential component +(kernel, window system, and so on) of the specific operating system +(if any) on which the executable work runs, or a compiler used to +produce the work, or an object code interpreter used to run it. + + The "Corresponding Source" for a work in object code form means all +the source code needed to generate, install, and (for an executable +work) run the object code and to modify the work, including scripts to +control those activities. However, it does not include the work's +System Libraries, or general-purpose tools or generally available free +programs which are used unmodified in performing those activities but +which are not part of the work. For example, Corresponding Source +includes interface definition files associated with source files for +the work, and the source code for shared libraries and dynamically +linked subprograms that the work is specifically designed to require, +such as by intimate data communication or control flow between those +subprograms and other parts of the work. + + The Corresponding Source need not include anything that users +can regenerate automatically from other parts of the Corresponding +Source. + + The Corresponding Source for a work in source code form is that +same work. + + 2. Basic Permissions. + + All rights granted under this License are granted for the term of +copyright on the Program, and are irrevocable provided the stated +conditions are met. This License explicitly affirms your unlimited +permission to run the unmodified Program. The output from running a +covered work is covered by this License only if the output, given its +content, constitutes a covered work. This License acknowledges your +rights of fair use or other equivalent, as provided by copyright law. + + You may make, run and propagate covered works that you do not +convey, without conditions so long as your license otherwise remains +in force. You may convey covered works to others for the sole purpose +of having them make modifications exclusively for you, or provide you +with facilities for running those works, provided that you comply with +the terms of this License in conveying all material for which you do +not control copyright. Those thus making or running the covered works +for you must do so exclusively on your behalf, under your direction +and control, on terms that prohibit them from making any copies of +your copyrighted material outside their relationship with you. + + Conveying under any other circumstances is permitted solely under +the conditions stated below. Sublicensing is not allowed; section 10 +makes it unnecessary. + + 3. Protecting Users' Legal Rights From Anti-Circumvention Law. + + No covered work shall be deemed part of an effective technological +measure under any applicable law fulfilling obligations under article +11 of the WIPO copyright treaty adopted on 20 December 1996, or +similar laws prohibiting or restricting circumvention of such +measures. + + When you convey a covered work, you waive any legal power to forbid +circumvention of technological measures to the extent such circumvention +is effected by exercising rights under this License with respect to +the covered work, and you disclaim any intention to limit operation or +modification of the work as a means of enforcing, against the work's +users, your or third parties' legal rights to forbid circumvention of +technological measures. + + 4. Conveying Verbatim Copies. + + You may convey verbatim copies of the Program's source code as you +receive it, in any medium, provided that you conspicuously and +appropriately publish on each copy an appropriate copyright notice; +keep intact all notices stating that this License and any +non-permissive terms added in accord with section 7 apply to the code; +keep intact all notices of the absence of any warranty; and give all +recipients a copy of this License along with the Program. + + You may charge any price or no price for each copy that you convey, +and you may offer support or warranty protection for a fee. + + 5. Conveying Modified Source Versions. + + You may convey a work based on the Program, or the modifications to +produce it from the Program, in the form of source code under the +terms of section 4, provided that you also meet all of these conditions: + + a) The work must carry prominent notices stating that you modified + it, and giving a relevant date. + + b) The work must carry prominent notices stating that it is + released under this License and any conditions added under section + 7. This requirement modifies the requirement in section 4 to + "keep intact all notices". + + c) You must license the entire work, as a whole, under this + License to anyone who comes into possession of a copy. This + License will therefore apply, along with any applicable section 7 + additional terms, to the whole of the work, and all its parts, + regardless of how they are packaged. This License gives no + permission to license the work in any other way, but it does not + invalidate such permission if you have separately received it. + + d) If the work has interactive user interfaces, each must display + Appropriate Legal Notices; however, if the Program has interactive + interfaces that do not display Appropriate Legal Notices, your + work need not make them do so. + + A compilation of a covered work with other separate and independent +works, which are not by their nature extensions of the covered work, +and which are not combined with it such as to form a larger program, +in or on a volume of a storage or distribution medium, is called an +"aggregate" if the compilation and its resulting copyright are not +used to limit the access or legal rights of the compilation's users +beyond what the individual works permit. Inclusion of a covered work +in an aggregate does not cause this License to apply to the other +parts of the aggregate. + + 6. Conveying Non-Source Forms. + + You may convey a covered work in object code form under the terms +of sections 4 and 5, provided that you also convey the +machine-readable Corresponding Source under the terms of this License, +in one of these ways: + + a) Convey the object code in, or embodied in, a physical product + (including a physical distribution medium), accompanied by the + Corresponding Source fixed on a durable physical medium + customarily used for software interchange. + + b) Convey the object code in, or embodied in, a physical product + (including a physical distribution medium), accompanied by a + written offer, valid for at least three years and valid for as + long as you offer spare parts or customer support for that product + model, to give anyone who possesses the object code either (1) a + copy of the Corresponding Source for all the software in the + product that is covered by this License, on a durable physical + medium customarily used for software interchange, for a price no + more than your reasonable cost of physically performing this + conveying of source, or (2) access to copy the + Corresponding Source from a network server at no charge. + + c) Convey individual copies of the object code with a copy of the + written offer to provide the Corresponding Source. This + alternative is allowed only occasionally and noncommercially, and + only if you received the object code with such an offer, in accord + with subsection 6b. + + d) Convey the object code by offering access from a designated + place (gratis or for a charge), and offer equivalent access to the + Corresponding Source in the same way through the same place at no + further charge. You need not require recipients to copy the + Corresponding Source along with the object code. If the place to + copy the object code is a network server, the Corresponding Source + may be on a different server (operated by you or a third party) + that supports equivalent copying facilities, provided you maintain + clear directions next to the object code saying where to find the + Corresponding Source. Regardless of what server hosts the + Corresponding Source, you remain obligated to ensure that it is + available for as long as needed to satisfy these requirements. + + e) Convey the object code using peer-to-peer transmission, provided + you inform other peers where the object code and Corresponding + Source of the work are being offered to the general public at no + charge under subsection 6d. + + A separable portion of the object code, whose source code is excluded +from the Corresponding Source as a System Library, need not be +included in conveying the object code work. + + A "User Product" is either (1) a "consumer product", which means any +tangible personal property which is normally used for personal, family, +or household purposes, or (2) anything designed or sold for incorporation +into a dwelling. In determining whether a product is a consumer product, +doubtful cases shall be resolved in favor of coverage. For a particular +product received by a particular user, "normally used" refers to a +typical or common use of that class of product, regardless of the status +of the particular user or of the way in which the particular user +actually uses, or expects or is expected to use, the product. A product +is a consumer product regardless of whether the product has substantial +commercial, industrial or non-consumer uses, unless such uses represent +the only significant mode of use of the product. + + "Installation Information" for a User Product means any methods, +procedures, authorization keys, or other information required to install +and execute modified versions of a covered work in that User Product from +a modified version of its Corresponding Source. The information must +suffice to ensure that the continued functioning of the modified object +code is in no case prevented or interfered with solely because +modification has been made. + + If you convey an object code work under this section in, or with, or +specifically for use in, a User Product, and the conveying occurs as +part of a transaction in which the right of possession and use of the +User Product is transferred to the recipient in perpetuity or for a +fixed term (regardless of how the transaction is characterized), the +Corresponding Source conveyed under this section must be accompanied +by the Installation Information. But this requirement does not apply +if neither you nor any third party retains the ability to install +modified object code on the User Product (for example, the work has +been installed in ROM). + + The requirement to provide Installation Information does not include a +requirement to continue to provide support service, warranty, or updates +for a work that has been modified or installed by the recipient, or for +the User Product in which it has been modified or installed. Access to a +network may be denied when the modification itself materially and +adversely affects the operation of the network or violates the rules and +protocols for communication across the network. + + Corresponding Source conveyed, and Installation Information provided, +in accord with this section must be in a format that is publicly +documented (and with an implementation available to the public in +source code form), and must require no special password or key for +unpacking, reading or copying. + + 7. Additional Terms. + + "Additional permissions" are terms that supplement the terms of this +License by making exceptions from one or more of its conditions. +Additional permissions that are applicable to the entire Program shall +be treated as though they were included in this License, to the extent +that they are valid under applicable law. If additional permissions +apply only to part of the Program, that part may be used separately +under those permissions, but the entire Program remains governed by +this License without regard to the additional permissions. + + When you convey a copy of a covered work, you may at your option +remove any additional permissions from that copy, or from any part of +it. (Additional permissions may be written to require their own +removal in certain cases when you modify the work.) You may place +additional permissions on material, added by you to a covered work, +for which you have or can give appropriate copyright permission. + + Notwithstanding any other provision of this License, for material you +add to a covered work, you may (if authorized by the copyright holders of +that material) supplement the terms of this License with terms: + + a) Disclaiming warranty or limiting liability differently from the + terms of sections 15 and 16 of this License; or + + b) Requiring preservation of specified reasonable legal notices or + author attributions in that material or in the Appropriate Legal + Notices displayed by works containing it; or + + c) Prohibiting misrepresentation of the origin of that material, or + requiring that modified versions of such material be marked in + reasonable ways as different from the original version; or + + d) Limiting the use for publicity purposes of names of licensors or + authors of the material; or + + e) Declining to grant rights under trademark law for use of some + trade names, trademarks, or service marks; or + + f) Requiring indemnification of licensors and authors of that + material by anyone who conveys the material (or modified versions of + it) with contractual assumptions of liability to the recipient, for + any liability that these contractual assumptions directly impose on + those licensors and authors. + + All other non-permissive additional terms are considered "further +restrictions" within the meaning of section 10. If the Program as you +received it, or any part of it, contains a notice stating that it is +governed by this License along with a term that is a further +restriction, you may remove that term. If a license document contains +a further restriction but permits relicensing or conveying under this +License, you may add to a covered work material governed by the terms +of that license document, provided that the further restriction does +not survive such relicensing or conveying. + + If you add terms to a covered work in accord with this section, you +must place, in the relevant source files, a statement of the +additional terms that apply to those files, or a notice indicating +where to find the applicable terms. + + Additional terms, permissive or non-permissive, may be stated in the +form of a separately written license, or stated as exceptions; +the above requirements apply either way. + + 8. Termination. + + You may not propagate or modify a covered work except as expressly +provided under this License. Any attempt otherwise to propagate or +modify it is void, and will automatically terminate your rights under +this License (including any patent licenses granted under the third +paragraph of section 11). + + However, if you cease all violation of this License, then your +license from a particular copyright holder is reinstated (a) +provisionally, unless and until the copyright holder explicitly and +finally terminates your license, and (b) permanently, if the copyright +holder fails to notify you of the violation by some reasonable means +prior to 60 days after the cessation. + + Moreover, your license from a particular copyright holder is +reinstated permanently if the copyright holder notifies you of the +violation by some reasonable means, this is the first time you have +received notice of violation of this License (for any work) from that +copyright holder, and you cure the violation prior to 30 days after +your receipt of the notice. + + Termination of your rights under this section does not terminate the +licenses of parties who have received copies or rights from you under +this License. If your rights have been terminated and not permanently +reinstated, you do not qualify to receive new licenses for the same +material under section 10. + + 9. Acceptance Not Required for Having Copies. + + You are not required to accept this License in order to receive or +run a copy of the Program. Ancillary propagation of a covered work +occurring solely as a consequence of using peer-to-peer transmission +to receive a copy likewise does not require acceptance. However, +nothing other than this License grants you permission to propagate or +modify any covered work. These actions infringe copyright if you do +not accept this License. Therefore, by modifying or propagating a +covered work, you indicate your acceptance of this License to do so. + + 10. Automatic Licensing of Downstream Recipients. + + Each time you convey a covered work, the recipient automatically +receives a license from the original licensors, to run, modify and +propagate that work, subject to this License. You are not responsible +for enforcing compliance by third parties with this License. + + An "entity transaction" is a transaction transferring control of an +organization, or substantially all assets of one, or subdividing an +organization, or merging organizations. If propagation of a covered +work results from an entity transaction, each party to that +transaction who receives a copy of the work also receives whatever +licenses to the work the party's predecessor in interest had or could +give under the previous paragraph, plus a right to possession of the +Corresponding Source of the work from the predecessor in interest, if +the predecessor has it or can get it with reasonable efforts. + + You may not impose any further restrictions on the exercise of the +rights granted or affirmed under this License. For example, you may +not impose a license fee, royalty, or other charge for exercise of +rights granted under this License, and you may not initiate litigation +(including a cross-claim or counterclaim in a lawsuit) alleging that +any patent claim is infringed by making, using, selling, offering for +sale, or importing the Program or any portion of it. + + 11. Patents. + + A "contributor" is a copyright holder who authorizes use under this +License of the Program or a work on which the Program is based. The +work thus licensed is called the contributor's "contributor version". + + A contributor's "essential patent claims" are all patent claims +owned or controlled by the contributor, whether already acquired or +hereafter acquired, that would be infringed by some manner, permitted +by this License, of making, using, or selling its contributor version, +but do not include claims that would be infringed only as a +consequence of further modification of the contributor version. For +purposes of this definition, "control" includes the right to grant +patent sublicenses in a manner consistent with the requirements of +this License. + + Each contributor grants you a non-exclusive, worldwide, royalty-free +patent license under the contributor's essential patent claims, to +make, use, sell, offer for sale, import and otherwise run, modify and +propagate the contents of its contributor version. + + In the following three paragraphs, a "patent license" is any express +agreement or commitment, however denominated, not to enforce a patent +(such as an express permission to practice a patent or covenant not to +sue for patent infringement). To "grant" such a patent license to a +party means to make such an agreement or commitment not to enforce a +patent against the party. + + If you convey a covered work, knowingly relying on a patent license, +and the Corresponding Source of the work is not available for anyone +to copy, free of charge and under the terms of this License, through a +publicly available network server or other readily accessible means, +then you must either (1) cause the Corresponding Source to be so +available, or (2) arrange to deprive yourself of the benefit of the +patent license for this particular work, or (3) arrange, in a manner +consistent with the requirements of this License, to extend the patent +license to downstream recipients. "Knowingly relying" means you have +actual knowledge that, but for the patent license, your conveying the +covered work in a country, or your recipient's use of the covered work +in a country, would infringe one or more identifiable patents in that +country that you have reason to believe are valid. + + If, pursuant to or in connection with a single transaction or +arrangement, you convey, or propagate by procuring conveyance of, a +covered work, and grant a patent license to some of the parties +receiving the covered work authorizing them to use, propagate, modify +or convey a specific copy of the covered work, then the patent license +you grant is automatically extended to all recipients of the covered +work and works based on it. + + A patent license is "discriminatory" if it does not include within +the scope of its coverage, prohibits the exercise of, or is +conditioned on the non-exercise of one or more of the rights that are +specifically granted under this License. You may not convey a covered +work if you are a party to an arrangement with a third party that is +in the business of distributing software, under which you make payment +to the third party based on the extent of your activity of conveying +the work, and under which the third party grants, to any of the +parties who would receive the covered work from you, a discriminatory +patent license (a) in connection with copies of the covered work +conveyed by you (or copies made from those copies), or (b) primarily +for and in connection with specific products or compilations that +contain the covered work, unless you entered into that arrangement, +or that patent license was granted, prior to 28 March 2007. + + Nothing in this License shall be construed as excluding or limiting +any implied license or other defenses to infringement that may +otherwise be available to you under applicable patent law. + + 12. No Surrender of Others' Freedom. + + If conditions are imposed on you (whether by court order, agreement or +otherwise) that contradict the conditions of this License, they do not +excuse you from the conditions of this License. If you cannot convey a +covered work so as to satisfy simultaneously your obligations under this +License and any other pertinent obligations, then as a consequence you may +not convey it at all. For example, if you agree to terms that obligate you +to collect a royalty for further conveying from those to whom you convey +the Program, the only way you could satisfy both those terms and this +License would be to refrain entirely from conveying the Program. + + 13. Remote Network Interaction; Use with the GNU General Public License. + + Notwithstanding any other provision of this License, if you modify the +Program, your modified version must prominently offer all users +interacting with it remotely through a computer network (if your version +supports such interaction) an opportunity to receive the Corresponding +Source of your version by providing access to the Corresponding Source +from a network server at no charge, through some standard or customary +means of facilitating copying of software. This Corresponding Source +shall include the Corresponding Source for any work covered by version 3 +of the GNU General Public License that is incorporated pursuant to the +following paragraph. + + Notwithstanding any other provision of this License, you have +permission to link or combine any covered work with a work licensed +under version 3 of the GNU General Public License into a single +combined work, and to convey the resulting work. The terms of this +License will continue to apply to the part which is the covered work, +but the work with which it is combined will remain governed by version +3 of the GNU General Public License. + + 14. Revised Versions of this License. + + The Free Software Foundation may publish revised and/or new versions of +the GNU Affero General Public License from time to time. Such new versions +will be similar in spirit to the present version, but may differ in detail to +address new problems or concerns. + + Each version is given a distinguishing version number. If the +Program specifies that a certain numbered version of the GNU Affero General +Public License "or any later version" applies to it, you have the +option of following the terms and conditions either of that numbered +version or of any later version published by the Free Software +Foundation. If the Program does not specify a version number of the +GNU Affero General Public License, you may choose any version ever published +by the Free Software Foundation. + + If the Program specifies that a proxy can decide which future +versions of the GNU Affero General Public License can be used, that proxy's +public statement of acceptance of a version permanently authorizes you +to choose that version for the Program. + + Later license versions may give you additional or different +permissions. However, no additional obligations are imposed on any +author or copyright holder as a result of your choosing to follow a +later version. + + 15. Disclaimer of Warranty. + + THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY +APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT +HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY +OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, +THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR +PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM +IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF +ALL NECESSARY SERVICING, REPAIR OR CORRECTION. + + 16. Limitation of Liability. + + IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING +WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS +THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY +GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE +USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF +DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD +PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS), +EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF +SUCH DAMAGES. + + 17. Interpretation of Sections 15 and 16. + + If the disclaimer of warranty and limitation of liability provided +above cannot be given local legal effect according to their terms, +reviewing courts shall apply local law that most closely approximates +an absolute waiver of all civil liability in connection with the +Program, unless a warranty or assumption of liability accompanies a +copy of the Program in return for a fee. + + END OF TERMS AND CONDITIONS + + How to Apply These Terms to Your New Programs + + If you develop a new program, and you want it to be of the greatest +possible use to the public, the best way to achieve this is to make it +free software which everyone can redistribute and change under these terms. + + To do so, attach the following notices to the program. It is safest +to attach them to the start of each source file to most effectively +state the exclusion of warranty; and each file should have at least +the "copyright" line and a pointer to where the full notice is found. + + <one line to give the program's name and a brief idea of what it does.> + Copyright (C) <year> <name of author> + + This program is free software: you can redistribute it and/or modify + it under the terms of the GNU Affero General Public License as published by + the Free Software Foundation, either version 3 of the License, or + (at your option) any later version. + + This program is distributed in the hope that it will be useful, + but WITHOUT ANY WARRANTY; without even the implied warranty of + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + GNU Affero General Public License for more details. + + You should have received a copy of the GNU Affero General Public License + along with this program. If not, see <https://www.gnu.org/licenses/>. + +Also add information on how to contact you by electronic and paper mail. + + If your software can interact with users remotely through a computer +network, you should also make sure that it provides a way for users to +get its source. For example, if your program is a web application, its +interface could display a "Source" link that leads users to an archive +of the code. There are many ways you could offer source, and different +solutions will be better for different programs; see section 13 for the +specific requirements. + + You should also get your employer (if you work as a programmer) or school, +if any, to sign a "copyright disclaimer" for the program, if necessary. +For more information on this, and how to apply and follow the GNU AGPL, see +<https://www.gnu.org/licenses/>. diff --git a/caddy/phase1-redirect.example.Caddyfile b/caddy/phase1-redirect.example.Caddyfile deleted file mode 100644 index 9658d69e1afd29bb283f065f9b3b1915eb4b6632..0000000000000000000000000000000000000000 --- a/caddy/phase1-redirect.example.Caddyfile +++ /dev/null @@ -1,51 +0,0 @@ -# Phase 1: Blog migration — cytrogen.icu → blog.cytrogen.icu -# -# This is a reference copy of the redirect blocks deployed to /etc/caddy/Caddyfile. -# The production Caddyfile also includes blocks for sourcehut, beszel, freshrss, -# stalwart, etc. — only the realm-relevant portions are shown here. -# -# Status: DEPLOYED 2026-02-27 - -# Blog now served from /var/www/blog.cytrogen.icu -blog.cytrogen.icu { - root * /var/www/blog.cytrogen.icu - file_server - encode gzip - - @static path *.css *.js *.jpg *.jpeg *.png *.gif *.ico *.svg *.webp *.woff *.woff2 *.ttf *.eot - header @static Cache-Control "public, max-age=2592000, immutable" - - @html path *.html - header @html Cache-Control "public, max-age=3600, must-revalidate" - - handle_errors { - @4xx expression `{err.status_code} >= 400 && {err.status_code} < 500` - handle @4xx { - rewrite * /{err.status_code}.html - file_server - } - @5xx expression `{err.status_code} >= 500` - handle @5xx { - rewrite * /{err.status_code}.html - file_server - } - } - - try_files {path} {path}/ {path}.html -} - -# 301 permanent redirect — root domain to blog subdomain -cytrogen.icu, www.cytrogen.icu { - header Link `<https://blog.cytrogen.icu{uri}>; rel="canonical"` - header X-Robots-Tag "noindex, nofollow" - redir https://blog.cytrogen.icu{uri} permanent -} - -# Phase 4: Replace the redirect block above with: -# -# cytrogen.icu, www.cytrogen.icu { -# root * /var/www/realm -# file_server -# encode gzip -# try_files {path} {path}/ {path}.html -# } diff --git a/caddy/phase4-live.example.Caddyfile b/caddy/phase4-live.example.Caddyfile new file mode 100644 index 0000000000000000000000000000000000000000..a63453171391761ccd76f6f75badc71bfd4e2f75 --- /dev/null +++ b/caddy/phase4-live.example.Caddyfile @@ -0,0 +1,50 @@ +# Phase 4: Realm live — cytrogen.icu serves /var/www/cytrogen.icu +# +# This is a reference copy of the realm-relevant Caddy blocks deployed +# to /etc/caddy/Caddyfile. The production Caddyfile also includes blocks +# for sourcehut, beszel, freshrss, stalwart, etc. +# +# Status: DEPLOYED 2026-03-04 + +# Realm portal +cytrogen.icu, www.cytrogen.icu { + root * /var/www/cytrogen.icu + file_server + encode gzip + + @static path *.css *.js *.jpg *.jpeg *.png *.gif *.ico *.svg *.webp *.woff *.woff2 *.ttf *.eot + header @static Cache-Control "public, max-age=2592000, immutable" + + @html path *.html / + header @html Cache-Control "public, max-age=3600, must-revalidate" + + try_files {path} {path}/ {path}.html +} + +# Blog (unchanged from Phase 1) +blog.cytrogen.icu { + root * /var/www/blog.cytrogen.icu + file_server + encode gzip + + @static path *.css *.js *.jpg *.jpeg *.png *.gif *.ico *.svg *.webp *.woff *.woff2 *.ttf *.eot + header @static Cache-Control "public, max-age=2592000, immutable" + + @html path *.html + header @html Cache-Control "public, max-age=3600, must-revalidate" + + handle_errors { + @4xx expression `{err.status_code} >= 400 && {err.status_code} < 500` + handle @4xx { + rewrite * /{err.status_code}.html + file_server + } + @5xx expression `{err.status_code} >= 500` + handle @5xx { + rewrite * /{err.status_code}.html + file_server + } + } + + try_files {path} {path}/ {path}.html +} diff --git a/css/realm.css b/css/realm.css index 021f949b9c7f7f243409b87aa16ba607abc8927e..5f96cc637748f8b074a4bf9c0abbbbfeef599008 100644 --- a/css/realm.css +++ b/css/realm.css @@ -16,7 +16,7 @@ @property --fill-current { syntax: "<color>"; inherits: true; - initial-value: oklch(0.85 0.02 240); + initial-value: oklch(0.85 0.02 280); } @property --fill-accent { @@ -25,6 +25,48 @@ initial-value: oklch(0.72 0.18 55); } +/* ================================================================ + KEYFRAMES — skull opening animation + ================================================================ */ + +@keyframes skull-split-up { + 0%, 30% { transform: translateY(0); } + 100% { transform: translateY(-110%); } +} + +@keyframes skull-split-down { + 0%, 30% { transform: translateY(0); } + 100% { transform: translateY(110%); } +} + +@keyframes wall-fade { + 0%, 99% { visibility: visible; } + 100% { visibility: hidden; } +} + +@keyframes lock-shake { + 0%, 100% { transform: rotate(0deg); } + 15% { transform: rotate(-10deg); } + 30% { transform: rotate(10deg); } + 45% { transform: rotate(-7deg); } + 60% { transform: rotate(7deg); } + 75% { transform: rotate(-3deg); } + 90% { transform: rotate(3deg); } +} + +@keyframes lock-text-appear { + 0% { opacity: 0; transform: translateY(0); } + 12% { opacity: 1; transform: translateY(-8px); } + 65% { opacity: 1; transform: translateY(-8px); } + 100% { opacity: 0; transform: translateY(-14px); } +} + +@keyframes forge-pulse { + 0%, 100% { opacity: 0.25; } + 50% { opacity: 0.4; } +} + + /* ================================================================ RESET ================================================================ */ @@ -67,16 +109,16 @@ @layer tokens { :root { /* === Background scale (deep cold) === */ - --bg-abyss: oklch(0.10 0.02 260); - --bg-deep: oklch(0.15 0.03 255); - --bg-mid: oklch(0.22 0.04 250); - --bg-surface: oklch(0.28 0.04 245); - --bg-elevated: oklch(0.35 0.04 240); + --bg-abyss: oklch(0.10 0.02 290); + --bg-deep: oklch(0.15 0.03 285); + --bg-mid: oklch(0.22 0.04 280); + --bg-surface: oklch(0.28 0.04 278); + --bg-elevated: oklch(0.35 0.04 275); /* === Text scale === */ - --text-primary: oklch(0.85 0.02 240); - --text-secondary: oklch(0.60 0.03 250); - --text-dim: oklch(0.42 0.03 255); + --text-primary: oklch(0.85 0.02 280); + --text-secondary: oklch(0.60 0.03 280); + --text-dim: oklch(0.42 0.03 285); /* === Accent: high-saturation orange (sole emphasis) === */ --accent: oklch(0.72 0.18 55); @@ -166,13 +208,25 @@ ================================================================ */ @layer layout { + /* --- Page-level layout (used on sub-pages) --- */ .realm { - display: grid; - place-items: center; + display: flex; + flex-direction: column; + align-items: center; min-height: 100dvh; padding: var(--space-lg); } + /* --- Folder layout (index page) --- */ + .realm-folder { + width: 100%; + margin-inline: auto; + height: 100dvh; + overflow: hidden; + display: flex; + flex-direction: column; + } + .realm-container { width: 100%; max-width: 72rem; @@ -180,15 +234,54 @@ padding-inline: var(--space-md); } - /* Phase 3 scene viewport — reserves full-screen space */ - .realm-scene { - position: relative; + /* --- Skull overlay --- */ + .skull-overlay { + position: fixed; + inset: 0; + z-index: 100; + display: flex; + align-items: center; + justify-content: center; + background: transparent; + pointer-events: none; + animation: wall-fade 2.5s var(--ease-out) forwards; + } + + .skull-overlay .skull { width: 100%; - min-height: 100dvh; + height: 100%; + } + + .skull-top { + animation: skull-split-up 2.5s var(--ease-out) forwards; + } + + .skull-bottom { + animation: skull-split-down 2.5s var(--ease-out) forwards; + } + + @media (prefers-reduced-motion: reduce) { + .skull-overlay { + display: none; + } + } + + /* --- Folder content area --- */ + .folder-content { + flex: 1; + background: var(--bg-deep); + min-height: 0; overflow: hidden; + container-type: inline-size; } - /* Scene depth layers (Phase 3) */ + /* --- Scene SVG --- */ + .folder-content svg { + width: 100%; + height: 100%; + } + + /* --- Scene depth layers (compositing within a scene) --- */ .realm-layer { position: absolute; inset: 0; @@ -200,6 +293,50 @@ .realm-layer--mid { z-index: 2; } .realm-layer--near { z-index: 3; } .realm-layer--ui { z-index: 10; } + + /* --- Scene container (close-up pages: unified viewport lock) --- */ + + .realm-scene { + width: 100%; + height: 100dvh; + overflow: hidden; + display: flex; + flex-direction: column; + align-items: center; + background: var(--bg-abyss); + } + + .realm-scene__content { + flex: 1; + min-height: 0; + width: 100%; + max-width: var(--scene-max-width, 56rem); + display: flex; + align-items: center; + justify-content: center; + padding-inline: var(--space-lg); + } + + .realm-scene__backdrop { + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: center; + background: var(--scene-bg, var(--bg-abyss)); + } + + .realm-scene__backdrop > svg { + max-width: 100%; + max-height: 100%; + width: auto; + height: auto; + } + + .realm-scene__nav { + flex-shrink: 0; + padding-block: var(--space-md); + } } /* ================================================================ @@ -305,17 +442,884 @@ fill: var(--text-dim); } - /* --- Card / Panel --- */ + /* --- Scene Hotspots --- */ + + .hotspot { + cursor: pointer; + } + + .hotspot .hotspot-shape { + fill: var(--bg-surface); + transition: fill var(--duration-normal) var(--ease-default); + } + + .hotspot .fill-path { + fill: oklch(0.20 0.03 275); + } + + .hotspot:hover .hotspot-shape, + .hotspot:focus-visible .hotspot-shape { + fill: var(--accent); + } + + .hotspot .hotspot-icon { + fill: var(--text-dim); + transition: fill var(--duration-normal) var(--ease-default); + } + + .hotspot:hover .hotspot-icon, + .hotspot:focus-visible .hotspot-icon { + fill: var(--bg-abyss); + } + + .hotspot:focus-visible { + outline: 2px solid var(--accent); + outline-offset: 2px; + } + + /* Hotspot tooltip via CSS */ + .hotspot .hotspot-label { + fill: var(--text-dim); + font-family: var(--font-body); + font-size: 11px; + opacity: 0; + transition: opacity var(--duration-normal) var(--ease-default); + } + + .hotspot:hover .hotspot-label, + .hotspot:focus-visible .hotspot-label { + opacity: 1; + fill: var(--accent-bright); + } + + /* Map-board labels: always visible (no tooltip opacity) */ + .hotspot .map-label { + fill: var(--text-dim); + font-family: var(--font-body); + font-size: 11px; + transition: fill var(--duration-normal) var(--ease-default); + } + + .hotspot:hover .map-label, + .hotspot:focus-visible .map-label { + fill: var(--accent-bright); + } + + /* --- Scene fill classes --- */ + + .fill-sky { fill: oklch(0.12 0.03 290); } + .fill-mountain { fill: oklch(0.16 0.03 285); } + .fill-mountain-far { fill: oklch(0.13 0.025 288); } + .fill-ground { fill: oklch(0.18 0.035 280); } + .fill-wall { fill: oklch(0.25 0.04 278); } + .fill-wall-dark { fill: oklch(0.20 0.035 280); } + .fill-wall-light { fill: oklch(0.30 0.04 275); } + .fill-roof { fill: oklch(0.18 0.04 282); } + .fill-window { fill: oklch(from var(--accent) l c h / 0.5); } + .fill-window-glow { fill: oklch(from var(--accent) l c h / 0.25); } + .fill-door { fill: oklch(0.08 0.02 290); } + .fill-moon { fill: oklch(0.85 0.02 280); } + .fill-star { fill: oklch(0.70 0.02 280); } + .fill-path { fill: oklch(0.20 0.03 275); } + .fill-tree { fill: oklch(0.14 0.04 285); } + .fill-board { fill: var(--bg-elevated); } + .fill-accent-shape { fill: var(--accent); } + .fill-accent-dim { fill: var(--accent-dim); } + + /* --- Skull SVG fills --- */ + .fill-skull { fill: oklch(0.25 0.04 280); } + .fill-skull-eye { fill: var(--accent); } + + /* --- Scene title text --- */ + .scene-title { + fill: var(--text-dim); + font-family: var(--font-body); + font-size: 14px; + letter-spacing: 0.1em; + } + + /* --- Notice Board --- */ + + .notice-board { + display: flex; + flex-direction: column; + align-items: center; + max-width: 56rem; + width: 100%; + margin-inline: auto; + margin-block-end: var(--space-lg); + } + + .notice-board__frame { + background: var(--bg-elevated); + padding: var(--space-md); + width: 100%; + } + + .notice-board__title { + font-size: var(--text-lg); + letter-spacing: 0.1em; + color: var(--accent); + text-align: center; + padding-block-end: var(--space-md); + } + + .notice-board__surface { + background: var(--bg-mid); + padding: var(--space-lg); + max-height: 60vh; + overflow-y: auto; + } + + .notice-board__surface h2 { + font-size: var(--text-base); + color: var(--accent-dim); + margin-block: var(--space-lg) var(--space-sm); + } + + .notice-board__surface h2:first-child { + margin-block-start: 0; + } + + .notice-board__surface p { + margin-block-end: var(--space-md); + } + + .notice-board__surface ul { + margin-block-end: var(--space-md); + padding-inline-start: var(--space-lg); + list-style: disc; + color: var(--text-secondary); + } + + .notice-board__surface li { + margin-block-end: var(--space-xs); + } + + .notice-board__post { + width: 4rem; + height: 12rem; + background: var(--bg-elevated); + } + + .notice-board__ground { + width: 100%; + margin-block-start: -1rem; + } + + .notice-board__ground svg { + display: block; + width: 100%; + height: auto; + } + + .notice-board__surface::-webkit-scrollbar { + width: 6px; + } - .realm-panel { + .notice-board__surface::-webkit-scrollbar-track { + background: var(--bg-deep); + } + + .notice-board__surface::-webkit-scrollbar-thumb { background: var(--bg-surface); + } + + /* --- Scroll (卷轴) --- */ + + .scroll { + display: flex; + flex-direction: column; + align-items: center; + max-width: 56rem; + width: 100%; + margin-inline: auto; + } + + .scroll__rod { + width: calc(100% + 2rem); + height: 0.75rem; + background: var(--bg-elevated); + border-radius: 0.375rem; + position: relative; + flex-shrink: 0; + } + + .scroll__rod::before, + .scroll__rod::after { + content: ''; + position: absolute; + top: 50%; + translate: 0 -50%; + width: 1.25rem; + height: 1.25rem; + background: var(--bg-elevated); + border-radius: 50%; + } + + .scroll__rod::before { left: -0.375rem; } + .scroll__rod::after { right: -0.375rem; } + + .scroll__body { padding: var(--space-lg); - container-type: inline-size; + max-height: 60vh; + overflow-y: auto; + width: 100%; + background: var(--bg-surface); + } + + .scroll__title { + font-size: var(--text-lg); + letter-spacing: 0.1em; + color: var(--accent); + text-align: center; + padding-block-end: var(--space-md); + } + + .scroll__body h2 { + font-size: var(--text-base); + color: var(--accent-dim); + margin-block: var(--space-lg) var(--space-sm); + } + + .scroll__body h2:first-of-type { + margin-block-start: 0; + } + + .scroll__body p { + margin-block-end: var(--space-md); + } + + .scroll__body ul { + margin-block-end: var(--space-md); + padding-inline-start: var(--space-lg); + list-style: disc; + color: var(--text-secondary); + } + + .scroll__body li { + margin-block-end: var(--space-xs); + } + + .scroll__body::-webkit-scrollbar { + width: 6px; + } + + .scroll__body::-webkit-scrollbar-track { + background: transparent; + } + + .scroll__body::-webkit-scrollbar-thumb { + background: var(--bg-surface); + } + + /* --- Card / Panel --- */ + + .realm-content { + max-width: 40rem; + width: 100%; + } + + /* --- Capsule Panel (:target overlay) --- */ + + .capsule-panel { + position: fixed; + inset: 0; + z-index: 10; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background: oklch(0.05 0.02 290 / 0.92); + opacity: 0; + visibility: hidden; + transition: + opacity var(--duration-normal) var(--ease-default), + visibility var(--duration-normal) var(--ease-default); + } + + .capsule-panel:target { + opacity: 1; + visibility: visible; } - @container (min-width: 30rem) { - .realm-panel { - padding: var(--space-xl); + .capsule-panel .notice-board { + max-height: 80vh; + overflow-y: auto; + } + + .capsule-panel .scroll { + max-width: min(90vw, 56rem); + padding-inline: var(--space-md); + } + + .capsule-panel__close { + margin-block-start: var(--space-md); + color: var(--text-secondary); + font-size: var(--text-sm); + text-decoration: none; + transition: color var(--duration-normal) var(--ease-default); + min-width: 44px; + min-height: 44px; + display: inline-flex; + align-items: center; + justify-content: center; + } + + .capsule-panel__close:hover, + .capsule-panel__close:focus-visible { + color: var(--accent); + } + + /* --- Close-up SVG panels (colophon :has(:target)) --- */ + + /* Keep panel visible when a descendant is :target */ + .capsule-panel:has(:target) { + opacity: 1; + visibility: visible; + } + + /* Close-up SVG sizing */ + .closeup { + width: min(90vw, 56rem); + max-height: 80vh; + display: block; + } + + /* Interactive items within close-up */ + .closeup-item { cursor: pointer; } + + .closeup-item__shape { + fill: var(--bg-surface); + transition: fill var(--duration-normal) var(--ease-default); + } + .closeup-item:hover .closeup-item__shape { fill: var(--accent); } + .closeup-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; } + + .closeup-item__name { + fill: var(--text-dim); + font-family: var(--font-body); + font-size: 12px; + transition: fill var(--duration-normal) var(--ease-default); + } + .closeup-item:hover .closeup-item__name { fill: var(--accent-bright); } + + /* Description card — hidden by default, shown when parent <g> is :target */ + .closeup-desc { + opacity: 0; + transition: opacity var(--duration-normal) var(--ease-default); + pointer-events: none; + } + :target > .closeup-desc { + opacity: 1; + pointer-events: auto; + } + + .closeup-desc__bg { fill: var(--bg-deep); } + .closeup-desc__label { fill: var(--accent); font-family: var(--font-body); font-size: 14px; } + .closeup-desc__text { fill: var(--text-secondary); font-family: var(--font-body); font-size: 13px; } + + /* Panel header text inside SVG */ + .closeup-title { fill: var(--accent); font-family: var(--font-body); font-size: 18px; letter-spacing: 0.1em; } + + /* Forge: dim non-targeted flames when one is selected */ + .closeup--forge .closeup-item { + transition: opacity var(--duration-normal) var(--ease-default); + } + .closeup--forge:has(:target) .closeup-item:not(:target) { + opacity: 0.15; + } + + /* Fire depth fills — graduated brightness (front=bright, back=dim) */ + /* Layer 1 (front): reuses fill-window-glow / fill-window / fill-accent-shape */ + .fill-fire-2-glow { fill: oklch(from var(--accent) calc(l - 0.06) c h / 0.2); } + .fill-fire-2-body { fill: oklch(from var(--accent) calc(l - 0.06) c h / 0.4); } + .fill-fire-2-core { fill: oklch(from var(--accent) calc(l - 0.06) c h); } + .fill-fire-3-glow { fill: oklch(from var(--accent) calc(l - 0.12) c h / 0.15); } + .fill-fire-3-body { fill: oklch(from var(--accent) calc(l - 0.12) c h / 0.3); } + .fill-fire-3-core { fill: oklch(from var(--accent) calc(l - 0.12) c h); } + .fill-fire-4-glow { fill: oklch(from var(--accent) calc(l - 0.2) c h / 0.1); } + .fill-fire-4-body { fill: oklch(from var(--accent) calc(l - 0.2) c h / 0.2); } + .fill-fire-4-core { fill: oklch(from var(--accent) calc(l - 0.2) c h); } + + /* --- Capsule Lock (room padlock animation) --- */ + + .capsule-lock { + transform-box: fill-box; + transform-origin: center bottom; + } + + .capsule-lock-text { + fill: var(--accent); + font-family: var(--font-body); + font-size: 11px; + opacity: 0; + } + + :target > .capsule-lock { + animation: lock-shake 0.6s var(--ease-default); + } + + :target > .capsule-lock-text { + animation: lock-text-appear 3s var(--ease-default) forwards; + } + + @media (prefers-reduced-motion: reduce) { + :target > .capsule-lock { + animation: none; + } + :target > .capsule-lock-text { + animation: none; + opacity: 1; + } + } + + /* --- Forge Glow (工坊炉火) --- */ + + .forge-glow { + animation: forge-pulse 3s var(--ease-default) infinite; + } + + @media (prefers-reduced-motion: reduce) { + .forge-glow { animation: none; } + } + + /* --- Phone Scene (联络处场景容器) --- */ + + .phone-scene { + background: oklch(0.25 0.04 278); + width: min(95%, 56rem); + min-height: 80dvh; + margin-inline: auto; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: var(--space-xl) var(--space-lg); + } + + /* --- Phone Booth (联络处) --- */ + + .phone-booth { + display: flex; + align-items: center; + justify-content: center; + gap: var(--space-lg); + flex-wrap: wrap; + } + + /* Note stack: two stacked notes */ + + .phone-note-stack { + position: relative; + display: flex; + flex-direction: column; + align-items: center; + align-self: flex-start; + clip-path: inset(0 -2rem -200vh -2rem); + padding-block-end: var(--space-md); + } + + /* Dial guide note */ + + .phone-note { + background: var(--bg-surface); + padding: var(--space-md) var(--space-lg); + width: 18rem; + position: relative; + z-index: 2; + } + + .phone-note__title { + color: var(--accent); + font-size: var(--text-base); + letter-spacing: 0.05em; + margin-block-end: var(--space-sm); + } + + .phone-note__list { + display: grid; + grid-template-columns: auto 1fr; + gap: var(--space-xs) var(--space-sm); + } + + .phone-note__list dt { + color: var(--accent-bright); + font-family: var(--font-mono); + font-size: var(--text-base); + } + + .phone-note__list dd { + color: var(--text-secondary); + font-size: var(--text-base); + } + + /* Hidden hint note (checkbox hack) */ + + .phone-hint-toggle { + position: absolute; + opacity: 0; + pointer-events: none; + } + + .phone-hint { + background: var(--bg-elevated); + padding: var(--space-xs) var(--space-md); + width: 11rem; + margin-block-start: -14rem; + transform: rotate(5deg); + position: relative; + z-index: 1; + transition: transform var(--duration-slow) var(--ease-out); + } + + .phone-hint__tab { + display: block; + cursor: pointer; + color: var(--accent); + font-size: var(--text-sm); + text-align: center; + line-height: 2rem; + user-select: none; + } + + .phone-hint__tab:hover { + color: var(--accent-bright); + } + + .phone-hint__body { + padding-block-start: var(--space-sm); + color: var(--text-secondary); + font-size: var(--text-sm); + line-height: 1.8; + } + + .phone-hint__body ol { + list-style: decimal; + padding-inline-start: var(--space-md); + } + + .phone-hint__body li { + margin-block-end: var(--space-xs); + } + + .phone-hint-toggle:checked ~ .phone-hint { + transform: translateY(calc(14rem + var(--space-xs))) rotate(5deg); + } + + .phone-hint-toggle:focus-visible ~ .phone-hint .phone-hint__tab { + outline: 2px solid var(--accent); + outline-offset: 2px; + } + + @media (prefers-reduced-motion: reduce) { + .phone-hint { + transition: none; + } + } + + /* Phone unit */ + + .phone { + position: relative; + display: flex; + flex-direction: column; + width: clamp(18rem, 50vw, 24rem); + } + + /* Hood (canopy) */ + .phone-hood { + background: var(--text-dim); + height: 1.25rem; + margin-inline: calc(-1 * var(--space-md)); + position: relative; + } + + .phone-hood::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + right: 0; + height: 3px; + background: var(--bg-elevated); + } + + /* Body */ + .phone-body { + position: relative; + background: var(--bg-surface); + padding: var(--space-md); + padding-inline-start: calc(var(--space-md) + 3rem); + } + + /* Shelf */ + .phone-shelf { + background: var(--text-dim); + height: 0.75rem; + margin-inline: calc(-1 * var(--space-md)); + position: relative; + } + + .phone-shelf::before { + content: ''; + position: absolute; + left: 50%; + translate: -50% 0; + bottom: 100%; + width: 0; + height: 0; + border-left: 0.5rem solid transparent; + border-right: 0.5rem solid transparent; + border-bottom: 0.5rem solid var(--text-dim); + } + + /* Coin slot */ + .phone-coin { + width: 50%; + margin-inline: auto; + margin-block: var(--space-sm); + height: 0.5rem; + background: var(--bg-deep); + border-top: 2px solid var(--bg-mid); + border-bottom: 2px solid var(--bg-mid); + } + + /* Handset */ + .phone-handset { + position: absolute; + left: var(--space-sm); + top: calc(var(--space-md) - 1rem); + width: 1.5rem; + height: 3.5rem; + background: var(--text-dim); + border: none; + cursor: pointer; + z-index: 1; + transition: transform var(--duration-normal) var(--ease-out); + } + + /* T-shape: earpiece */ + .phone-handset::before { + content: ''; + position: absolute; + top: -0.25rem; + left: -0.375rem; + width: 2.25rem; + height: 0.75rem; + background: var(--text-dim); + border-radius: 0.25rem 0.25rem 0 0; + } + + /* T-shape: mouthpiece */ + .phone-handset::after { + content: ''; + position: absolute; + bottom: -0.25rem; + left: -0.375rem; + width: 2.25rem; + height: 0.75rem; + background: var(--text-dim); + border-radius: 0 0 0.25rem 0.25rem; + } + + .phone-handset:focus-visible { + outline: 2px solid var(--accent); + outline-offset: 2px; + } + + .phone[data-state="idle"] .phone-handset { + transform: none; + } + + .phone:not([data-state="idle"]) .phone-handset { + transform: translateY(-2rem) rotate(-15deg); + } + + /* Keypad */ + .phone-keypad { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 3px; + transition: opacity var(--duration-normal) var(--ease-default); + } + + .phone-key { + background: var(--bg-elevated); + border: none; + color: var(--text-primary); + font-family: var(--font-mono); + font-size: var(--text-base); + padding: var(--space-sm) 0; + cursor: pointer; + transition: background var(--duration-fast) var(--ease-default); + } + + .phone-key:hover { + background: var(--accent-dim); + } + + .phone-key:active { + background: var(--accent); + } + + .phone-key:focus-visible { + outline: 2px solid var(--accent); + outline-offset: -2px; + } + + /* Keypad state: disabled when not ready */ + .phone[data-state="idle"] .phone-keypad, + .phone[data-state="connecting"] .phone-keypad, + .phone[data-state="connected"] .phone-keypad, + .phone[data-state="error"] .phone-keypad { + pointer-events: none; + opacity: 0.3; + } + + .phone[data-state="ready"] .phone-keypad { + pointer-events: auto; + opacity: 1; + } + + /* Display */ + .phone-display { + background: var(--bg-abyss); + color: var(--accent); + font-family: var(--font-mono); + padding: var(--space-sm) var(--space-md); + display: flex; + flex-direction: column; + gap: 2px; + min-height: 5.5rem; + box-shadow: inset 0 0 0 2px var(--bg-deep); + } + + .phone-display__digits { + font-size: var(--text-lg); + letter-spacing: 0.2em; + min-height: 1.4em; + } + + .phone-display__status { + font-size: var(--text-sm); + color: var(--text-dim); + } + + /* Result (shown inside display) */ + .phone-result { + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + } + + .phone-result__link { + color: var(--accent-bright); + font-family: var(--font-mono); + font-size: var(--text-sm); + } + + .phone-result__link:hover, + .phone-result__link:focus-visible { + color: var(--accent); + text-decoration: underline; + } + + /* --- Skip Link (keyboard/screen reader shortcut) --- */ + + .skip-link { + position: absolute; + width: 1px; height: 1px; + padding: 0; margin: -1px; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; border: 0; + z-index: 200; + background: var(--bg-abyss); + color: var(--accent); + font-size: var(--text-base); + text-decoration: none; + } + + .skip-link:focus { + position: fixed; + top: var(--space-sm); left: var(--space-sm); + width: auto; height: auto; + padding: var(--space-sm) var(--space-md); + clip: auto; overflow: visible; + outline: 2px solid var(--accent); + outline-offset: 2px; + } + + /* --- Screen Reader Navigation (always visually hidden) --- */ + + .scene-nav { + position: absolute; + width: 1px; height: 1px; + padding: 0; margin: -1px; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; border: 0; + } + + .scene-nav__list { + list-style: none; + padding: 0; margin: 0; + } + + .scene-nav__link { + display: block; + padding: var(--space-xs); + color: var(--text-secondary); + } + + a.scene-nav__link:focus-visible { + outline: 2px solid var(--accent); + outline-offset: 2px; + } + + .scene-nav__link--locked { + color: var(--text-dim); + } + + /* --- Touch Hitarea Expansion --- */ + + .hotspot-hitarea { + fill-opacity: 0; + pointer-events: all; + } + + /* --- realm-scene context overrides --- */ + + .realm-scene .phone-scene { + width: 100%; + min-height: 0; + height: 100%; + } + + .realm-scene .notice-board { + max-height: 100%; + overflow: hidden; + } + + .realm-scene .notice-board__frame { + flex: 1; + min-height: 0; + display: flex; + flex-direction: column; + } + + .realm-scene .notice-board__surface { + max-height: none; + flex: 1; + min-height: 0; + } + + /* --- Responsive scene rules --- */ + + @container (max-width: 25rem) { + .scene-detail { + display: none; } } } diff --git a/index.html b/index.html index e728562ee7273ab028b1280d5ed9844c284fe839..82defc9fe3b8efe675664b8700b3418f47b6eb7e 100644 --- a/index.html +++ b/index.html @@ -1,93 +1,254 @@ <!DOCTYPE html> -<html lang="en"> +<html lang="zh-Hans"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Realm — cytrogen.icu - + + + - - -
- -
- - Realm sigil — a castle tower - - -

Realm

-

cytrogen.icu

-
- - - + - - - - + + +
diff --git a/pages/about.html b/pages/about.html new file mode 100644 index 0000000000000000000000000000000000000000..5374a6d3ae780bc538c9569ddd826e8c6e44c818 --- /dev/null +++ b/pages/about.html @@ -0,0 +1,213 @@ + + + + + + 卧室 — Realm + + + + + + + + +
+

卧室

+ +
+ + + 卧室 — An empty bedroom with moving boxes and a book on the floor + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 书 — 关于领主 + + + + + + + + + 书 + + + + + 返回城堡 — Return to castle interior + + 返回城堡 + + + +
+ + + + +
+
+
+

关于领主

+
+

关于领主

+

关于我的事情，要从何说起呢…… 卖关子。

+

人是分为现实和虚拟两个身份的。在虚拟的世界，或者说互联网上，我是这片领地的领主 Cytrogen——「领地」并不单单意味着该站。

+

不过我想，你会来到这里，是想要知道我现实中的身份吧。

+ +

身世

+

我是 00 后，山东人。大了后随着父母来到了纽约市居住，现在满打满算也至少在这里待了十多年了。

+

小时候就来了美国的人，几乎逃不开「身份问题」—— 到底是中国人还是美国人？我肯定是中国人没跑了，毕竟不是美国出生的，但对中国的很多地方也觉得陌生。较为直观的是，我的中文水平并没有那么好，让我很是惭愧。为了补足这一点，我会写博客文章，也会上中文课。

+

除了中文，我也在学习日语，说得并不好就是了…… 最初会学习日语，其实是为了和室友对话。

+ +

创作

+

我自童年时期开始，就喜欢画画和创作。不过种种原因让我没有继续这个爱好。结果，我的绘画水平大幅度降低…… 现在只能画些简单的小涂鸦和小动物。

+ +

音乐

+

音乐喜欢听 ボカロ、台湾摇滚和日语流行乐：

+
    +
  • 最喜欢的 ボカロ P 主是 sasakure.UK
    • +
  • 最喜欢的 ボカロ 歌曲是 《春嵐》
    • +
  • 台湾摇滚中很难说喜欢谁……
    • +
  • 但是日语流行乐我可以说我很中意 sakanaction
    • +
+

我并不会唱歌，也不会弹奏任何乐器。

+ +

游戏与硬件

+

游戏方面，我喜欢玩沙盒、休闲、模拟经营游戏，例如《泰拉瑞亚》。我只会玩一款音乐游戏，也就是《舞萌 DX》。

+

我对硬件有一点兴趣，喜欢组装电脑，也喜欢跟着网上的视频组装一些小东西比如蓝牙音响，但是涉及的范围不广、反而非常狭隘。

+ +

尾声

+

我能说的关于自己的事情，也就这些了。我认为，想要了解一个人更多是从行动上观察来的，所以想要更多了解我的话，还请从我在网络上留下的痕迹中拼凑出一个大概的画像吧。

+
+
+
+ 合上 +
+ +
+ + + diff --git a/pages/announcement.html b/pages/announcement.html new file mode 100644 index 0000000000000000000000000000000000000000..698b9d4753b4511ec6426d9bc68df449c61d6ccd --- /dev/null +++ b/pages/announcement.html @@ -0,0 +1,43 @@ + + + + + + 领地公告 — Realm + + + + + + + + +
+
+
+
+

领地公告

+
+

+

你现在所看到的领地，是它的第一个版本。

+

作为初版，难免会有不少粗糙之处——无论是显示上的问题、交互上的不便、还是内容上的疏漏，都有可能存在。如果你在探索途中发现了任何异常，希望能通过联络处告知于我，我会尽快修缮。

+

当然，若你对领地的建设有任何想法或建议，也欢迎一并告诉我。

+
+
+
+
+ +
+
+
+ + +
+ + + diff --git a/pages/canon.html b/pages/canon.html new file mode 100644 index 0000000000000000000000000000000000000000..ea968914d635275c85adfef58b293427ea1c5928 --- /dev/null +++ b/pages/canon.html @@ -0,0 +1,327 @@ + + + + + + 典籍室 — Realm + + + + + + + + +
+

典籍室

+ +
+ + + 典籍室 — 古典书斋，内有书架、地图、留声机、棋盘与旅行日志 + + + + + + + + + + + + + + + + + + + + + + + + + + + + 此处记载着滋养这片领地的源头 + + + + + + + + + + 书架 — Books + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 书架 + + + + + 地图 — Places + + + + + + + + + + + + 地图 + + + + + + 视听 — 尚未记载 + + + + + + + + + + + + + + + + 视听 + + + 尚未记载 + + + + + + 游戏 — 尚未记载 + + + + + + + + + + + + + + + + + + + 游戏 + + + 尚未记载 + + + + + + 经历 — 尚未记载 + + + + + + + + + + + + + + + 经历 + + + 尚未记载 + + + + + 返回城堡 — Return to castle interior + + 返回城堡 + + + +
+ + + + + +
+
+ +
+

书籍

+

《不原谅也没关系》

+

这本书改变了我看人的角度。通常来说，将人视为天生且不会改变的是很便利的做法。实际上，许多被我们归结为固有性格特质的行为是个体在长期创伤环境中形成的防御机制，也就是所谓的 4F 反应。我理解到，他人的许多地方都可以通过他们所处的环境来推测出来。借此，我暗自分析了身边的许多人，也了解了他们许多。站在这种角度去看，会发现自己能够理解原先不可理喻的蠢人或者坏人们。但这也不意味着我需要无底线包容他们的越界行为。

+

不过，我对这种概念还在缓慢消化中。生气的时候还是会偷偷将对方视为「一辈子的恶人」来数落。

+
+ +
+ 关闭 +
+ +
+
+ +
+

地点

+

我是南北家庭出身，但是在北方（山东）居住的时间更长久，也更融入到当地的文化中。因为小时候在福建的生活并不快乐，所以我对那个地方带有一些自己的小偏见。

+

在中国生活了十一年后，我随着父母搬来纽约定居。无论是新生活带来的压力和恐惧、同父母之间每日每夜的争执，还是日后难以融入当地的人群中，都让我倍受折磨，也构成了我青少年时期的底色。上高中时，我已然是一个对社交感到恐惧且自负的人，这也导致了未来一系列糟糕的事情。

+

尽管在高中期间我离开了家，不再需要每天和父母产生摩擦，但也让我陷入了另一个泥潭，也就是和室友之间的爱恨情仇。我们之间发生了很多，也改变了彼此很多。毫无疑问的是，我们互相是对方最亲密的人，至今也是。

+

在美国的这十几年，我从未回到中国去，导致我对中国的认知严重脱节。不过也正因此，你会在本站看到更多与美国境内相关的内容。

+
+ +
+ 关闭 +
+ +
+ + + diff --git a/pages/castle.html b/pages/castle.html new file mode 100644 index 0000000000000000000000000000000000000000..8486203eb4eb5de7d54ca9bf52279eeedf612965 --- /dev/null +++ b/pages/castle.html @@ -0,0 +1,201 @@ + + + + + + Realm — cytrogen.icu + + + + + + + + + +
+

城堡外观

+ + +
+ + + + 城堡外观 — Castle exterior scene with gate, contact phone, notice board, and grave + + + + + + + + + + + + + + + + + + + + + 邻邦 — Neighboring lands + + 走 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 大门 — Enter the castle interior + + + + + + + + 大门 + + + + + 联络处 — Contact + + + + + + + + + + + + + + + 联络处 + + + + + 领地公告 — Announcement + + + + + + + + + + + 公告 + + + + + 遗言 — Death + + + + + + + 遗言 + + + + + + +
+ + +
+ + + diff --git a/pages/colophon.html b/pages/colophon.html new file mode 100644 index 0000000000000000000000000000000000000000..b66994474ffa173027ee2809a936c387b515736c --- /dev/null +++ b/pages/colophon.html @@ -0,0 +1,748 @@ + + + + + + 工坊 — Realm + + + + + + + + +
+

工坊

+ +
+ + + 工坊 — Workshop interior with forge, workbench, tool rack, and blueprints + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 工具 — Tools + + + + + + + + + + + + + + + + + + + + + + 工具 + + + + + 蓝图 — Blueprint + + + + + + + + + + + + + + + 蓝图 + + + + + + + + 锻造 — Forging + + + + + + + + + + + + + + + + + + + + + + + + + + + + 锻造 + + + + + + + + 技法 — Techniques + + + + + + + + + + + + + + + 技法 + + + + + 材料 — Materials + + + + + + + + + + + + + + + + + + 材料 + + + + + 返回城堡 — Return to castle interior + + 返回城堡 + + + +
+ + + + + + +
+ + 工具架特写 + + + + + + + + + + + + + + + + 工具 + + + + + Git — 版本控制与部署触发 + + + + + Git + + + + Git + 版本控制与部署触发 + + + + + + + Caddy — Web 服务器与反向代理 + + + + Caddy + + + + Caddy + Web 服务器与反向代理 + + + + + + + Sourcehut — 自建 Git 托管 + + + + + + Sourcehut + + + + Sourcehut + 自建 Git 托管 + + + + + + + Hexo — 博客静态生成器 + + + + + + Hexo + + + + Hexo + 博客静态生成器 + + + + 关闭 +
+ + +
+ + 材料箱特写 + + + + + + 材料 + + + + + + + + + + + + + + + + 纯 HTML + CSS，极少 JavaScript + + + + HTML + CSS + + + + 纯 HTML + CSS，极少 JavaScript + + + + + + + 所有 SVG 直接内联于 DOM + + + + Inline SVG + + + + 所有 SVG 直接内联于 DOM + + + + + + + :target · :hover · checkbox hack + + + + + + CSS 交互 + + + + :target · :hover · checkbox hack + + + + + + + 无构建工具、无打包器 + + + + + + 零构建 + + + + 无构建工具、无打包器 + + + + 关闭 +
+ + +
+ + 工作台特写 + + + + + + + + + + + 技法 + + + + + 深冷色调背景与橙色强调 + + + + + + + oklch 色彩 + + + + oklch + 深冷色调背景与橙色强调 + + + + + + + 纯填充，无描边无渐变 + + + + + + + 扁平几何 + + + + 扁平几何 + 纯填充，无描边无渐变 + + + + + + + 辉光→半透明→实色核心 + + + + + + 三层火焰 + + + + 三层火焰 + 辉光 → 半透明 → 实色核心 + + + + + + + prefers-reduced-motion + aria + + + + + + 无障碍 + + + + 无障碍 + prefers-reduced-motion + aria + + + + 关闭 +
+ + +
+ + 锻造流程特写 + + + + + + + + + + + + + + + 锻造 + + + + + + + 推送至 Sourcehut 镜像 + + + + + + + 镜像 + + + + Sourcehut + 推送至 Sourcehut 镜像 + + + + + + + rsync 至 /var/www/realm + + + + rsync + + + + rsync + 同步至 /var/www/realm + + + + + + + post-receive 检出与构建 + + + + post-receive + + + + post-receive + 检出与构建 + + + + + + + git push 推送至裸仓库 + + + + git push + + + + git push + 推送至裸仓库 + + + + 关闭 +
+ + +
+ + 蓝图特写 + + + + + + + + + + + + + 蓝图 + + + + + + + + + @layer 级联控制层顺序 + + + + + + + @layer + + + + @layer + 级联控制层顺序 + + + + + + + @property oklch 颜色插值 + + + + + + + + @property + + + + @property + oklch 颜色插值 + + + + + + + symbol + use 响应式复用 + + + + + + + + symbol + use + + + + symbol + use + 响应式复用 + + + + + + + hotspot + panel 交互系统 + + + + + + + + hotspot + panel + + + + 交互系统 + hotspot + panel 交互系统 + + + + 关闭 +
+ +
+ + + diff --git a/pages/contact.html b/pages/contact.html index 46ccfb74084f643a0630be32cff6a490d75d660c..6ee4680780584aa0a8837e6c348bde4bc93c8068 100644 --- a/pages/contact.html +++ b/pages/contact.html @@ -1,32 +1,189 @@ - + Contact — Realm - + -
-
-

领地联络处

-

Contact

-
+ -
-

Reach out via the channels listed below.

- +
+

联络处

+
+
+
+ +
+ + + + + +
+
+

这种电话是需要将听筒拿起来才能拨号的。

+
    +
  1. 拿起左侧听筒（点击听筒按钮）
    2. +
  2. 听到提示音后，按键盘上的数字
    3. +
  3. 拨满三位后等待接通
    4. +
  4. 打完电话记得挂回听筒
    5. +
+
+ +
+
+ + +
+ +
+ + +
+ + + + +
+ + + + +
+ + +
+ + + + + + + + + + + + +
+ + +
+
+ + +
+
+
+
-
+ + diff --git a/pages/death.html b/pages/death.html new file mode 100644 index 0000000000000000000000000000000000000000..558fc0a0316b154c36f4d8d0a4974c686de227a5 --- /dev/null +++ b/pages/death.html @@ -0,0 +1,56 @@ + + + + + + 遗言 — Realm + + + + + + + + +
+

遗言

+
+
+ + 遗言 — 墓碑 + + + + + + + + + + + + + 冒险模式 LEVEL 1-1 + 玩玩小游戏 + 解密模式 + 生存模式 + + + + + +
+
+ + +
+ + + diff --git a/pages/friends.html b/pages/friends.html new file mode 100644 index 0000000000000000000000000000000000000000..386a27fcfeb345aa80760aec32fa6a0a1e627438 --- /dev/null +++ b/pages/friends.html @@ -0,0 +1,31 @@ + + + + + + 友邻 — Realm + + + + + + + + +
+
+

友邻

+

Friends

+
+ +
+

Allies and neighbors of the realm.

+
+ + +
+ + + diff --git a/pages/hosted.html b/pages/hosted.html new file mode 100644 index 0000000000000000000000000000000000000000..595bf28ce73c8c9f36726f788ca6b52240bc93d8 --- /dev/null +++ b/pages/hosted.html @@ -0,0 +1,214 @@ + + + + + + 属地 — Realm + + + + + + + + +
+

属地

+ +
+ + + 属地 — Walled manor with code repository, monitoring tower, and post office + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 代码库 — Sourcehut + + + + + + + + + + + + + + 代码库 + + + + + 监控塔 — Beszel + + + + + + + + + + + + + + 监控塔 + + + + + 邮局 — Stalwart + + + + + + + + + + + + + + + + 邮局 + + + + + + + + 邻邦 — Neighboring lands + + 邻邦 + + + + +
+ + +
+ + + diff --git a/pages/hotel.html b/pages/hotel.html new file mode 100644 index 0000000000000000000000000000000000000000..19286f3ed54ac862bcad4b8664775b60d7861e64 --- /dev/null +++ b/pages/hotel.html @@ -0,0 +1,215 @@ + + + + + + 胶囊旅馆 — Realm + + + + + + + + +
+

胶囊旅馆

+ +
+ + + 胶囊旅馆内部 — Capsule hotel interior with front desk and capsule rooms + + + + + + + + + + + + + + + + + + + + + 出口 — Return to neighbors + + + + + + + + 出口 + + + + + 前台 — Front desk + + + + + + + + + + + + 前台 + + + + + + 101号房 — Room 101 + + + + + + 101 + + + + + 该房间还未开放 + + + + + + 102号房 — Room 102 + + + + + + 102 + + + + + 该房间还未开放 + + + + + + 103号房 — Room 103 + + + + + + 103 + + + + + 该房间还未开放 + + + + + + + +
+ + + + + +
+
+ +
+

前台

+

什么是 Gemini

+

Gemini 是一种轻量级互联网协议，介于 Gopher 的极简和 HTTP 的臃肿之间。

+

它使用专用的 Gemtext 标记语言，只支持标题、列表、引用、链接等基础格式。链接必须独占一行，不能嵌入段落中。

+ +

为什么推荐

+
    +
  • 强制 TLS 加密，无明文传输
    • +
  • 没有 cookie、没有客户端脚本、没有追踪器、没有广告
    • +
  • 纯文字体验，让你更贴近内容本身
    • +
  • 单次请求-响应模型，连接即关闭，简洁高效
    • +
+ +

如何访问

+

领主的胶囊地址：gemini://cytrogen.icu

+

需要 Gemini 浏览器（如 Lagrange、Kristall）或 Emacs 的 Elpher 插件。

+
+ +
+ 关闭 +
+ +
+ + + diff --git a/pages/interior.html b/pages/interior.html new file mode 100644 index 0000000000000000000000000000000000000000..dd63d55a2689640ace2b541b6cd9ac5084870b56 --- /dev/null +++ b/pages/interior.html @@ -0,0 +1,413 @@ + + + + + + 城堡内部 — Realm + + + + + + + + +
+

城堡内部

+ +
+ + + 城堡内部 — Two-story castle interior with perspective view + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 卧室 — 关于领主 + + + 卧室 + + + + + + + 祭堂 — Ritual room (locked) + + + + + 该房间还未开放 + + + + + + 未知房间 — Unknown room (locked) + + + + + 该房间还未开放 + + + + + + 未知房间 — Unknown room (locked) + + + + + 该房间还未开放 + + + + + + + + + + 图书馆 — Blog + + + + + + + + + + 图书馆 + + + + + 工坊 — Colophon + + + + + + + + + + + 工坊 + + + + + 兵器库 — Uses + + + + + + + + 兵器库 + + + + + 典籍室 — Canon + + + + + + + + + 典籍室 + + + + + + + + 城门 — Return to castle exterior + + 城门 + + + +
+ + +
+ + + diff --git a/pages/map.html b/pages/map.html new file mode 100644 index 0000000000000000000000000000000000000000..63f9a33f4d88d044c394d7af18dfa3c22cd17e48 --- /dev/null +++ b/pages/map.html @@ -0,0 +1,213 @@ + + + + + + 领地总览 — Realm + + + + + + + + +
+

领地总览

+ +
+
+ + + 领地总览 — Map board showing neighbors, castle, and interior zones + + + + + + + + + + + + + + + + + + + + + + + + + + 邻邦 — Neighboring lands + + 邻 邦 + + + + + 城堡 — Castle + + 城 堡 + + + + + 城堡内部 — Castle interior + + 内 部 + + + + + + + 友邻 — Friends + + 友邻 + + + + + 属地 — Hosted + + 属地 + + + + + 胶囊旅馆 — Gemini + + 旅馆 + + + + + 驿站 — Relay station + + 驿站 + + + + + + + 图书馆 — Blog + + 图书馆 + + + + + 工坊 — Colophon + + 工坊 + + + + + 兵器库 — Uses + + 兵器库 + + + + + 典籍室 — Canon + + 典籍室 + + + + + + + 联络处 — Contact + + 联络处 + + + + + 领地公告 — Announcement + + 公告 + + + + + 遗言 — Death + + 遗言 + + + + + + + + + + 返回 — Return to neighbors + + ◁ 返回 + + + + 领 地 总 览 + + +
+
+ + + + +
+ + + diff --git a/pages/neighbors.html b/pages/neighbors.html new file mode 100644 index 0000000000000000000000000000000000000000..cfb763990baf62243123a35ffdd9538929608b6d --- /dev/null +++ b/pages/neighbors.html @@ -0,0 +1,189 @@ + + + + + + 邻邦 — Realm + + + + + + + + +
+

邻邦

+ +
+ + + 邻邦 — Neighboring lands with friends pavilion, map board, estates, capsule inn, and relay station + + + + + + + + + + + + + + + + + + + + 友邻 — Friends + + + + + + + + + + + + + + + + + + 友邻 + + + + + 地图 — Map overview + + + + + + + + + + + + + + + + + + + + + + + 地图 + + + + + 属地 — Hosted + + + + + + + + + + + + + + + 属地 + + + + + 胶囊旅馆 — Gemini + + + + + + + + 旅馆 + + + + + 驿站 — Relay station + + + + + + + + + + + + + + 驿站 + + + + + + + + 城堡 — Return to castle + + 城堡 + + + +
+ + +
+ + + diff --git a/pages/station.html b/pages/station.html new file mode 100644 index 0000000000000000000000000000000000000000..e0816fd7a65d4e9b325287f734cec2137e666792 --- /dev/null +++ b/pages/station.html @@ -0,0 +1,60 @@ + + + + + + 驿站 — Realm + + + + + + + + +
+

驿站

+
+
+ + 驿站 — 驿站正门 + + + + + + + + + + + + + + + + + 驿站还未开放 + Not Yet Open + + + + + + + + +
+
+ + +
+ + + diff --git a/pages/uses.html b/pages/uses.html new file mode 100644 index 0000000000000000000000000000000000000000..5310c0000bb5f3a58e02b0e6244b533425aabcd7 --- /dev/null +++ b/pages/uses.html @@ -0,0 +1,925 @@ + + + + + + 兵器库 — Realm + + + + + + + + +
+

兵器库

+ +
+ + + 兵器库 — Stone chamber displaying weapons, artifacts, scrolls, and treasures + + + + + + + + + + + + + + + + + + + + + + + + + + + 铁甲 — Hardware + + + + + + + + + + + + + + + + + + 铁甲 + + + + + 法器 — Software + + + + + + + + + + + + + + + + + + + + + 法器 + + + + + 信物 — Communications + + + + + + + + + + + + + + + + + + + 信物 + + + + + 契约 — Services + + + + + + + + + + + + + + + 契约 + + + + + 佩饰 — Other + + + + + + + + + + 佩饰 + + + + + 返回城堡 — Return to castle interior + + 返回城堡 + + + +
+ + + + + + +
+ + 铁甲架特写 — Hardware closeup + + + + + + + + + + + 铁甲 + + + + + + + 台式电脑（主力）— Ryzen 5 5600 · GTX 750Ti · 32GB DDR4 + + + + + + 主力台式 + + + + 台式电脑（主力） + Ryzen 5 5600 · GTX 750Ti · 32GB + + + + + + + 台式电脑（空虚）— i3-2100 · P8H61-M LX3 PLUS + + + + + + + 空虚台式 + + + + 台式电脑（空虚） + i3-2100 · P8H61-M LX3 PLUS + + + + + + + 台式电脑（迷失）— 配置已失传…… + + + + + + 迷失台式 + + + + 台式电脑（迷失） + 配置已失传…… + + + + + + + 笔记本 — Lenovo IdeaPad Flex 5 15 + + + + + + 笔记本 + + + + 笔记本 + Lenovo IdeaPad Flex 5 15 + + + + + + + + + 手机 — Motorola Razr+ 2024 + + + + + + + 手机 + + + + 手机 + Motorola Razr+ 2024 + + + + + + + 平板 — iPad Pro 11 寸 + + + + + + + + 平板 + + + + 平板 + iPad Pro 11 寸 + + + + + + + 耳机 — Soundcore Liberty 4 NC + + + + + + + 耳机 + + + + 耳机 + Soundcore Liberty 4 NC + + + + 关闭 +
+ + +
+ + 法器柜特写 — Software closeup + + + + + + + + + + 法器 + + + + + + + 操作系统 — EndeavourOS + i3wm / Windows 10 + + + + + + + + + 操作系统 + + + + 操作系统 + EndeavourOS + i3wm / Win 10 + + + + + + + 编辑器 — PyCharm · WebStorm · VS Code + + + + + + + 编辑器 + + + + 编辑器 + PyCharm · WebStorm · VS Code + + + + + + + 终端 — zsh / Windows Terminal + + + + + + + + 终端 + + + + 终端 + zsh / Windows Terminal + + + + + + + 浏览器 — Floorp / Firefox + + + + + + + 浏览器 + + + + 浏览器 + Floorp / Firefox + + + + + + + + + 笔记 — Emacs · Typora（渐弃） + + + + + + + 笔记 + + + + 笔记 + Emacs · Typora（渐弃） + + + + + + + 音乐 — Navidrome + Tempo / ytmdesktop + + + + + + + + + + 音乐 + + + + 音乐 + Navidrome + Tempo / ytmdesktop + + + + + + + 截图 — FastStone Capture / Flameshot + + + + + + + + + + + + + 截图 + + + + 截图 + FastStone Capture / Flameshot + + + + 关闭 +
+ + +
+ + 信鸽笼特写 — Communications closeup + + + + + + + + + + 信物 + + + + + + + 近交 — 微信 · QQ · 贴吧 · 小红书 + + + + + + + + + + + 近交 + + + + 近交 + 微信 · QQ · 贴吧 · 小红书 + + + + + + + 远交 — Instagram · WhatsApp · LinkedIn · GitHub + + + + + + + + + + + + 远交 + + + + 远交 + IG · WhatsApp · LinkedIn · GitHub + + + + + + + + + 密通 — Signal · Matrix · 短信 · 邮件 + + + + + + + 密通 + + + + 密通 + Signal · Matrix · 短信 · 邮件 + + + + + + + 广播 — Mastodon · Pixelfed · 推特 · Facebook + + + + + + 广播 + + + + 广播 + Mastodon · Pixelfed · 推特 · FB + + + + 关闭 +
+ + +
+ + 契书台特写 — Services closeup + + + + + + + + + + 契约 + + + + + + + 购物 — Amazon Prime + + + + + + 购物 + + + + 购物 + Amazon Prime + + + + + + + AI — Claude · Claude Code · Gemini + + + + + + + + + + + + AI + + + + AI + Claude · Claude Code · Gemini + + + + + + + 开发 — GitHub Pro · GitKraken + + + + + + + + + + + 开发 + + + + 开发 + GitHub Pro · GitKraken + + + + + + + 存储 — Google Drive · OneDrive + + + + + + + 存储 + + + + 存储 + Google Drive · OneDrive + + + + + + + + + 域名·VPS — IONOS · Vultr + + + + + + + + + + 域名·VPS + + + + IONOS · Vultr + + + + + + + 电影 — AMC Stubs Premiere + + + + + + + + 电影 + + + + AMC Stubs Premiere + + + + + + + 搜索 — Kagi Search + + + + + + + + + + 搜索 + + + + Kagi Search + + + + + + + 打印 — HP Instant Ink + + + + + + 打印 + + + + HP Instant Ink + + + + 关闭 +
+ + +
+ + 佩饰匣特写 — Other accessories closeup + + + + + + + 佩饰 + + + + + + + 文具 — Pilot 88G 钢笔 + + + + + + + 文具 + + + + 文具 + Pilot 88G 钢笔 + + + + + + + 手表 — CASIO PIKACHU × BABY-G 5338 + + + + + + + + + + + + 手表 + + + + 手表 + CASIO PIKACHU × BABY-G 5338 + + + + + + + 眼镜 — Vera Wang V906 BK 53-16-137 + + + + + + + + + + 眼镜 + + + + 眼镜 + Vera Wang V906 BK + + + + 关闭 +
+ +
+ + +