diff --git a/docs/Project SS PRD.md b/docs/Project SS PRD.md index f817c39..54dc25f 100644 --- a/docs/Project SS PRD.md +++ b/docs/Project SS PRD.md @@ -1,49 +1,32 @@ -# Project SS 제품 요구 사항 정의서 (PRD) ## 1. 프로젝트 개요 -- **프로젝트명:** Project SS (가제: 비밀 결사단) -- **장르:** 로그라이크 경영 시뮬레이션 / 엔진 빌딩 / 정치 스릴러 -- **타겟 유저:** * 'Reigns', 'Papers, Please' 류의 딜레마/내러티브 선택 게임 선호 유저 - - '윙스팬', '테라포밍 마스' 류의 시너지/엔진 빌딩 보드게임 선호 유저 -- **플랫폼:** 모바일 웹 (웹앱) 및 하이브리드 앱 환경 (Portrait 중심) -- **핵심 가치:** * **"선택의 딜레마와 기회비용"** (정답이 없는 차악의 선택) - - **"자산 시너지 빌드업"** (나만의 이득 창출 엔진 구축) - - **"정치적 표적 견제"** (플레이어의 엔진을 부수려는 의회의 현실적 압박) +- 프로젝트명: Project SS (가제: 비밀 결사단) +- 장르: 로그라이트 권력 시뮬레이션 / 엔진 빌딩 / 정치 스릴러 +- 플랫폼: 모바일 웹앱 및 하이브리드 앱 (세로 모드 전용) +- 핵심 가치 (Core Value): + 1. 원하는 자원과 태그를 수집하기 위한 [능동적 딜레마 스와이프] + 2. 모은 자원을 폭발시켜 미스터리를 해결하고 자산을 얻는 [엔진 빌딩] + 3. 사상적 우호도에 기반하여, 필요할 때만 권력을 개입시키는 [선택적 정치 공작] ## 2. 주요 기능 요구사항 (Functional Requirements) -### 2.1. 동적 데이터베이스 (Live DB) 연동 -- **Google Sheets 연동:** 하드코딩 없이 구글 시트(CSV)를 Fetch하여 게임 데이터로 사용. -- **데이터 정규화 (Smart Parsing):** 대소문자, 공백 등 기획자의 입력 오류를 방어하는 파싱 로직 구현. -- **오프라인 폴백 (Fallback):** 네트워크 통신 실패 시 내장된 기본 데이터로 자동 전환되어 게임 진행 보장. +### 2.1. 데이터 관리 (Live DB) +- Google Sheets Sync: 사건(결재 카드), 파벌, 자산, 미스터리 등 게임 내 모든 수치와 텍스트를 구글 시트에서 Fetch하여 로드하는 구조 필수. +- 상태 관리 (State Management): 세션 내 플레이어의 4대 속성, 획득한 태그, 파벌별 우호도 수치를 실시간으로 추적 및 업데이트해야 함. -### 2.2. 결재 상호작용 (Swipe Interface) -- **Tinder-like 스와이프:** 카드를 좌우로 드래그하여 거절(Left) / 승인(Right) 판정. -- **롱프레스 (Override):** 법안에 의해 잠긴(Lock) 카드를 0.8초 이상 길게 눌러 신임도(HP)를 대가로 '강제 돌파'. -- **예측 오버레이 (Prediction Feedback):** 카드를 드래그하는 동안 수치 증감(예산, 엔트로피, 신임도, 파벌 지분)을 화살표와 색상으로 미리 시각화. +### 2.2. [메인 화면] 결재 시스템 (A vs B Swipe) +- 기능: 메인 화면 중앙의 카드를 좌/우로 드래그하여 투입할 부서(대응 방식)를 선택. +- 오버레이 피드백: 드래그 중 화면 좌우측 및 상단에 예상되는 획득 자원과 태그 아이콘을 시각적으로 미리 표시(Preview). -### 2.3. 자산 시너지 엔진 (Asset Synergy Build) -- **자산 획득 및 인벤토리:** 사건 결재 보상으로 '태그(Tag)'가 부여된 자산 획득. -- **패시브 시너지 (Combo System):** 보유한 자산의 동일 태그(예: `군사`, `오컬트`)가 특정 개수 이상 모이면 콤보 스킬(Rule-bending, 예: 거절 패널티 무시) 발동. -- **자산 매각:** 자금을 즉시 확보하는 대신 의심도나 엔트로피가 급증하는 매각 리스크 로직 구현. - +### 2.3. [미스터리 모달] 미스터리 보드 시스템 (Mystery Dossier) +- 조건부 팝업: 조건(엔트로피 달성, 특정 태그 N개 누적 등) 만족 시 보드(별도 UI 모달)에 새로운 미스터리 항목 동적 생성. +- 상태 이상(디버프) 처리: 미결재 상태의 미스터리가 보드에 존재할 경우, 매 턴(스와이프)마다 지정된 디버프 수치(예: 신임도 -2) 자동 차감 로직 구현. +- 해결 및 보상 처리: 플레이어가 요구되는 '빌드업 태그'와 재화를 지불하고 '해결' 버튼 클릭 시, 디버프 제거 및 지정된 '자산(Asset)'을 인벤토리에 추가. -### 2.4. 의회 및 정치 시스템 (Parliament & Sabotage) -- **제로섬 라이벌리:** 특정 파벌 지분 상승 시, 적대 파벌의 지분이 즉시 하락하는 연결 로직. -- **표적 법안 (Targeted Sabotage):** 현재 플레이어가 가장 많이 보유한 '자산 태그'를 파악하여, 해당 빌드를 무력화하는 카운터 법안을 의회에서 최우선 상정. -- **로비 시스템:** 의회 투표(여당안 vs 야당안) 단계에서 비자금을 소모하여 소수 정당(Swing Voter)의 표를 매수하는 인터랙션. - -### 2.5. 자원 관리 모델 (Resource Management) -- **예산 칸막이:** 총 예산과 발신 부서 예산의 이중 체크. 부서 예산 부족 시 '적자' 상태(추후 패널티) 부여. -- **엔트로피의 역설:** 단순 (승인=해결/거절=위험)을 탈피하여, 각 카드 데이터에 설정된 비선형적 엔트로피 증감값 적용. -- **감사 의심도 & 비자금:** 횡령과 로비를 위한 이면 자원 시스템 관리. - -## 3. 비기능 요구사항 (Non-Functional Requirements) -- **UI 반응성:** 모바일 환경의 Safe Area를 고려하고, 기기 해상도(vh/vw)에 반응하여 카드가 화면을 벗어나지 않도록 제한 (`dvh` 사용 권장). -- **조작 피드백:** 롱프레스 성공, 카드 넘김, 법안 잠금 등 주요 액션 시 Haptic Feedback(진동) 적용. -- **접근성:** 시각적 효과뿐만 아니라 텍스트로도 현재 상황과 잠금 사유가 명확히 인지될 것. - -## 4. 마일스톤 및 페이즈 -- **Phase 1 (코어 루프):** DB 파싱, 스와이프 결재, 5대 자원 증감, 주간 결산 기본 루프 완성. -- **Phase 2 (엔진 빌딩 & 정치):** 자산 태그 시너지 로직 구현, 의회 2단계(선포 및 입법) + 로비 시스템 + 표적 법안 로직 구현. -- **Phase 3 (폴리싱):** UI 오버레이 연출 고도화, BGM/SFX 연동, 엔딩 및 Act 진행 조건 추가. +### 2.4. [주간 의회 모달] 정치 및 우호도 시스템 (Affinity & Parliament) +- 스펙트럼 로직: 플레이어의 '성향 태그'가 변경될 때마다 8개 파벌의 우호도 상태(5단계)를 자동 재계산 및 업데이트. +- 액션 개입 (Intervention): 주간 의회 페이즈 진입 시, 특정 조건(우호도)을 만족하는 파벌을 대상으로 '정치 자본'을 지불하여 액션(이면 계약, 블랙리스트)을 트리거하는 버튼 활성화. +- 카운터 입법: 적대 파벌은 플레이어가 가장 많이 보유한 '빌드업 태그'를 파악하여, 해당 기능을 정지시키는 카운터 법안을 상정하는 타겟팅 로직 필요. +## 3. UI/UX 및 비기능 요구사항 +- 뷰포트 최적화: 좁은 모바일 화면에서 카드 스와이프 영역(메인)과 스탯/로그 영역을 침범하지 않도록 dvh 기반의 레이아웃 설계. +- 조작 피드백: 미스터리 해결, 정치 액션 실행, 게임 오버 발생 시 강력한 햅틱 진동 및 사운드 효과 필수. diff --git a/docs/Project SS 기획서.md b/docs/Project SS 기획서.md index f0184c6..c35ed12 100644 --- a/docs/Project SS 기획서.md +++ b/docs/Project SS 기획서.md @@ -1,70 +1,88 @@ -# Project SS 게임 기획서 (GDD) -## 1. 게임 개요 -- **로그라인:** 얇아지는 현실의 장막 속, 초자연적 위협을 막아야 하는 비밀 결사단의 국장이 되어 관료제와 파벌 정치의 틈바구니에서 아슬아슬한 결재 서류에 도장을 찍는 게임. -- **핵심 재미 요소:** - 1. 무조건적인 선(善)이 없는 상황에서 자원과 정치를 맞바꾸는 **[고뇌의 스와이프]** - 2. 태그를 모아 강력한 콤보를 터뜨리는 **[자산 시너지 빌드업]** - 3. 나의 빌드업을 부수려고 달려드는 파벌들의 **[표적 정치 공세(입법)]** 방어 +## 코어 루프 (Core Game Loop) +게임은 다음 4개의 톱니바퀴가 반복되며 굴러가는 구조를 가집니다. +1. 사건 대응 (스와이프): 매 턴 사건 카드가 등장하며, 유저는 [어느 부서를 투입할지(A vs B)] 선택합니다. 이를 통해 재화와 태그를 획득합니다. +2. 빌드업 (미스터리 보드): 획득한 태그와 재화가 쌓이면 **[미스터리]**가 해금됩니다. 방치 시 페널티를 받으며, 재화를 소모해 해결하면 시너지를 내는 **[자산(엔진)]**을 획득합니다. +3. 정치적 반작용 (우호도 스펙트럼): 유저의 선택(성향)에 따라 파벌들이 자동적으로 우호/적대 상태로 재편성됩니다. +4. 난관 돌파 (주간 의회): 주말이 되면 적대 파벌이 유저의 엔진을 부수는 **[카운터 법안]**을 냅니다. 유저는 권력을 개입(이면 계약 등)시켜 이를 방어하고 다시 일상 업무로 돌아갑니다. +## 2. 속성 정의 (Attributes Definition) +이 게임의 모든 행동과 목표, 패배 조건은 다음 속성들에 의해 결정됩니다. -## 2. 코어 게임 루프 -### 2.1. Micro Loop (일일 업무: 평일 5턴) -1. **아침 브리핑:** 이번 주 아젠다/퀘스트 확인, 보유 자산의 패시브 효과(예산 수급 등) 적용. -2. **결재 (스와이프):** - - 결재 서류(카드) 등장. (부서/파벌/딜레마/잠금 여부 확인) - - 플레이어는 **승인(우측)**, **거절(좌측)**, 또는 신임도를 태워 쇠사슬을 끊는 **강행 돌파(롱프레스)** 중 선택. -3. **결과 반영:** 예산 소모, 엔트로피 증감, 파벌 지분 변동(라이벌 동반 하락). +### 2.1. 4대 핵심 재화 (자원) +- 🧬 변칙 데이터 (Anomaly Data): 연구/포획 시 획득. [미스터리 해결]에 소모되는 필수 성장 재화. +- 👑 정치 자본 (Political Clout): 은폐/통제 시 획득. [의회 액션]에 소모되는 필수 통제 재화. +- ⏱️ 엔트로피 (Entropy): 종말 척도 (0~100%). + - 효과: 일정 구간마다 시민 패닉 단계 상승 (게임 내 억까 이벤트 등장 확률 증가). + - 패배 조건: 100% 도달 시 즉시 [세계 멸망 엔딩 (Game Over)]. +- 🛡️ 신임도 (Trust): 대중과 기구의 지지율. (플레이어의 HP) + - 패배 조건: 0에 도달 시 즉시 [국장 숙청 엔딩 (Game Over)]. + -### 2.2. Macro Loop (주간 의회: 주말) -1. **지분 갱신:** 평일 동안 모인 배당금(코인)에 따라 8개 파벌의 지분율 재산정. -2. **Phase 1 (아젠다 선포):** 제1주주가 다음 한 주의 환경 변수(패시브 룰)와 퀘스트(목표) 강제 하달. -3. **Phase 2 (입법 전쟁):** * 플레이어의 빌드업을 저격하는 **여당안(A)**과 경쟁하는 **야당안(B)** 상정. - - 플레이어는 **[비자금]**을 소모해 소수 정당을 매수(로비). - - 50% 이상 지분을 얻은 법안이 가결되어 다음 주 결재의 **잠금(Lock) 제약**으로 작동. +### 3.2. 2대 태그 시스템 (결재 시 이중 획득) +- 🏷️ 빌드업 태그 (군사, 과학, 정보, 오컬트, 자본): 미스터리 해금 조건이자, 보유한 자산(엔진)의 시너지 발동 조건이 되는 실질적 재료. +- 🧭 성향 태그 (지배, 순응, 은폐, 혼돈): 파벌의 우호도를 결정짓고, 최종 엔딩의 분기를 나누는 사상적 나침반. -## 3. 핵심 시스템 기획 +### 3.3. 파벌 우호도 5단계 (성향 태그에 의해 자동 변경) +1. 👑 핵심 동맹: 태그 공명. 유저의 주력 빌드업 속도 가속화. +2. 🤝 우호: 주간 의회 시, 유저에게 유리한 버프 법안 자동 상정. +3. ⚖️ 중립: 아무 효과 없음. (이면 계약 액션의 타겟) +4. ⚔️ 적대: 주간 의회 시, 유저의 주력 태그를 박살 내는 카운터 법안 자동 상정. +5. 🔥 파국: 성향이 극악이거나 블랙리스트 지정 시 도달. 법안 대신 극단적 '사보타주 테러(강제 페널티)' 이벤트 발생. -### 3.1. 결재와 딜레마 (Approval & Dual-Lock) -- **엔트로피의 역설:** 위험한 마법을 허가해 사건을 해결하면 파벌 지분은 얻지만 세계관은 불안정해진다(엔트로피 상승). 사건을 무시하면 엔트로피가 폭등하지만 예산을 아낄 수 있다. 정답이 없는 딜레마의 연속. -- **양방향 잠금 (Dual-Lock):** 발효된 법안(예: _사살 금지법_) 태그가 안건 태그(`kill`)와 겹치면 승인 방향으로 드래그가 쇠사슬에 걸려 막힌다. -- **오버라이드 (강행 돌파):** 국가적 위기 시 0.8초간 카드를 꾹 눌러, 플레이어의 HP인 **[신임도 -20]**을 대가로 쇠사슬을 박살 내고 강제 승인한다. +## 4. UI 화면 중심 시스템 정의 +이 게임의 시스템은 크게 3개의 UI 화면을 중심으로 나뉘며, 각 화면에서 할 수 있는 행동이 곧 게임의 규칙입니다. -### 3.2. 엔진 빌딩: 자산 시너지 (Asset Synergy) -보드게임 '테라포밍 마스', '윙스팬'의 재미를 차용하여 단순 텍스트 게임의 한계를 돌파한다. -- **태그 수집:** 자산은 고유 태그(`군사`, `오컬트`, `자본` 등)를 가짐. -- **빌드업 (Combo):** 같은 태그를 모을수록 사기적인 능력이 발동됨. - - _군사 1개:_ 작전부 비용 -10% / _군사 3개:_ 강행 돌파 시 신임도 패널티 면제. -- **전략성:** 이번 판은 어떤 태그 조합(빌드)으로 갈지 유저 스스로 목표를 설정하게 됨. +### 4.1. [메인 집무실 화면] : 결재 및 태그 수집 시스템 +유저가 가장 많은 시간을 보내는 기본 화면입니다. +- UI 구조: 중앙에 틴더 형태의 스와이프 카드. 좌/우측에 대응 부서 아이콘 노출. +- 시스템 규칙: + - 카드는 '사건'을 의미하며, 좌우 스와이프는 '투입할 부서'를 의미합니다. + - 드래그 방향에 따라 명확히 어떤 자원(데이터, 자본, 신임도 등)과 태그(빌드업, 성향)를 획득/상실할지 미리 보여줍니다. (예산 제약 없음) + - 결재 완료 즉시 상단의 4대 재화 수치와 누적 태그 현황판이 업데이트됩니다. -### 3.3. 의회의 표적 견제 (Targeted Sabotage) -유저가 엔진 빌딩의 단맛을 볼 때쯤, 현실적인 정치 견제가 들어온다. -- **질투와 공포:** 유저가 `군사` 태그 자산을 모아 콤보를 터뜨리면, `군사`를 혐오하는 반대 파벌의 적대감이 극에 달한다. -- **저격 입법:** 주말 의회에서 의도적으로 **"모든 군사 자산 무효화 및 유지비 부과"** 같은 카운터 법안이 1순위로 상정된다. -- **로비의 필요성:** 유저는 공들여 쌓은 엔진이 박살 나는 것을 막기 위해, 비자금을 쏟아부어 로비하거나 싫어하는 정당의 비위(악성 안건 승인)를 맞춰 지분을 방어해야 하는 진흙탕 정치를 경험하게 된다. +### 3.2. [미스터리 결재판 화면] : 퀘스트 및 엔진 빌딩 시스템 +유저가 직접 진척도를 관리하고 보상을 수령하는 서브 모달 창입니다. +- UI 구조: 현재 해금된 미스터리 목록 리스트. 각 항목에 [해결 비용], [방치 페널티], [보상 자산] 명시. +- 시스템 규칙: + - 해금: 특정 빌드업 태그가 N개 모이거나, 엔트로피가 N%를 넘으면 새로운 미스터리가 리스트에 추가됩니다. + - 디버프: 리스트에 미스터리가 남아있는 동안, 메인 화면에서 결재를 1회 할 때마다 지속 페널티(예: 엔트로피 자동 +1)가 부과됩니다. + - 해결: 유저가 요구되는 '빌드업 태그'와 '변칙 데이터'를 소모해 버튼을 누르면 미스터리가 지워지며, 인벤토리에 **[자산(패시브 엔진)]**이 추가됩니다. + - 승리 조건: 세계관급 재앙인 **[종결 미스터리 3종]**을 이 화면에서 모두 해결하면, 누적된 성향에 따른 **[진엔딩]**이 출력되며 승리합니다. -## 4. 콘텐츠 스펙 -### 4.1. 4대 자원 및 게이지 -1. **총 예산 / 부서 예산:** 합법적 자금. 부서 예산 부족 시 '적자' 상태 돌입. -2. **비자금:** 그림자 경제로 획득. 로비 및 급전용. (사용 시 의심도 증가) -3. **신임도 (HP):** 플레이어의 정치 생명. 0% 달성 시 **탄핵 (Game Over)**. -4. **엔트로피:** 종말 타이머. 100% 달성 시 **세계 멸망 (Game Over)**. +### 3.3. [주간 의회 화면] : 파벌 정치 및 난관 돌파 시스템 +일정 턴(예: 7턴) 경과 시 강제로 진입하는 이벤트 화면입니다. +- UI 구조: + - 상단: 현재 상정된 법안의 내용과 상정 주체(적대 파벌). + - 중단: 8개 파벌의 현재 우호도 스펙트럼 현황. + - 하단: 유저가 개입할 수 있는 2개의 '액션 버튼(이면 계약, 블랙리스트)'. +- 시스템 규칙: + - 난관 발생: 적대 파벌은 유저 인벤토리에 가장 많은 '빌드업 태그'를 무력화하는 카운터 법안을 상정합니다. + - 능동적 방어 (액션): 유저는 상정된 법안을 막기 위해 아래의 선택을 할 수 있습니다. + 1. 액션 포기: 법안이 통과되어 자산이 정지되는 페널티를 그대로 수용합니다. + 2. [이면 계약] 실행: 정치 자본을 지불하고 우호도 [중립] 파벌을 선택합니다. 해당 파벌이 거부권을 행사해 법안이 즉시 무효화됩니다. + 3. [블랙리스트] 실행: 정치 자본 지불 없이 [적대] 파벌을 탄압합니다. 해당 파벌은 [🔥파국] 상태가 되어 테러를 준비하지만, 유저는 다음 주 동안 이 파벌의 안건을 부결시킬 때마다 대량의 신임도와 정치 자본을 보상으로 수확할 수 있습니다. -### 4.2. 8대 파벌 매트릭스 (라이벌 구조) -- **[무력]** 철의 수호당 (사살) ⚔️ 지식 보존당 (생포) -- **[순수]** 진화 미래당 (개조) ⚔️ 순수 인간당 (순혈) -- **[패권]** 세계 재건당 (양지화) ⚔️ 침묵의 장막당 (은폐) -- **[자본]** 차원 무역당 (상업) ⚔️ 고대 공존당 (숭배) -- _로직:_ 한 쪽의 지분이 상승하면 라이벌의 지분은 반드시 깎이는 제로섬 구조. +## 4. UI 텍스트 레이아웃 구조 (가이드라인) +AI 및 개발 단계를 위한 최소화된 텍스트 기반 레이아웃 구조입니다. +### [Header: 대시보드 영역] +- [🛡️ 신임도: 80%] [⏱️ 엔트로피: 45%] +- [🧬 변칙 데이터: 150] [👑 정치 자본: 30] +- 우측 상단 햄버거 메뉴: [인벤토리(자산) 및 성향 로그 보기] 버튼 -### 4.3. 시나리오 (진행도) -- **1막 (1~4주차):** 균열. 일상적 괴담과 횡령, 자산 빌드업 시작기. -- **2막 (5~8주차):** 붕괴. S급 위협 등장, 완성되어 가는 엔진과 의회의 본격적인 표적 견제. -- **3막 (9~12주차):** 혼란. 극단적 딜레마 요구, 아젠다의 폭주, 자산의 붕괴. -- **4막 (13주차~):** 심판. 현재 의회를 장악한 파벌에 따라 결말(멀티 엔딩) 결정. +### [Body: 스와이프 결재 영역 (메인)] +- (좌측 표시기): ⚔️ 작전부 투입 (군사 태그 / 신임도+ / 변칙 데이터-) +- [카드 UI]: <사건 타이틀> 및 <사건 설명 텍스트> +- (우측 표시기): 🔬 R&D부 투입 (과학 태그 / 변칙 데이터+ / 신임도-) -## 5. UI / UX 방향성 -- **시각 연출 (Diegetic):** 1인칭 국장 시점. 어두운 마호가니 데스크, 붉은색과 푸른색의 잉크 도장. 불길하게 깜빡이는 종말 시계. -- **예측 오버레이:** 조작 스트레스 방지를 위해, 카드 드래그 시 중앙에 팝업이 떠서 수치 증감과 라이벌 지분 하락을 색상별로 직관적으로 보여줌. -- **의회 연출:** 거대 양당의 법안(A/B)을 상단에 대치시키고, 하단에는 매수 가능한 소수 정당들을 뱃지(칩) 형태로 나열하여 터치 시 즉각적으로 표가 뒤집히는 애니메이션 제공. +### [Footer: 네비게이션 영역] +- [ 📁 미스터리 결재판 (🚨 1) ] 버튼 (알림 배지 표시) +- [ 🏛️ 이번 주 의회 동향 ] 버튼 +### [Modal: 주간 의회 팝업] +- [상정된 법안]: <과학 기술 통제법> (효과: 과학 자산 모두 무효화) +- [파벌 현황표]: (철의 수호당: 우호) / (순수 인간당: 적대) ... +- [개입 액션 패널]: + - [ 🤝 이면 계약 (비용: 👑 50) ] -> 터치 시 중립 파벌 목록 드롭다운 + - [ 🎯 블랙리스트 지정 (무료) ] -> 터치 시 적대 파벌 목록 드롭다운 + - [ ⏩ 개입 없이 법안 통과 (방관) ] diff --git a/src/index.html b/src/index.html index 8e54887..63b109c 100644 --- a/src/index.html +++ b/src/index.html @@ -16,43 +16,20 @@ --safe-top: env(safe-area-inset-top, 30px); } - /* [수정] dvh를 사용하여 모바일 주소창 영역 제외하고 완벽히 꽉 차게 변경. 스크롤 원천 차단 */ body { - background-color: #000; - display: flex; - justify-content: center; - align-items: center; - height: 100dvh; - margin: 0; - padding: 0; - font-family: 'Courier Prime', 'Nanum Myeongjo', serif; - overflow: hidden; - color: #eee; - user-select: none; - touch-action: none; + background-color: #000; display: flex; justify-content: center; align-items: center; + height: 100dvh; margin: 0; padding: 0; font-family: 'Courier Prime', 'Nanum Myeongjo', serif; + overflow: hidden; color: #eee; user-select: none; touch-action: none; } - /* [수정] 모바일에서는 화면을 꽉 채우도록 기본 설정 */ .phone-wrapper { - width: 100%; - height: 100%; - max-width: 420px; - background: #111; - position: relative; - overflow: hidden; - display: flex; - flex-direction: column; + width: 100%; height: 100%; max-width: 420px; background: #111; + position: relative; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 0 50px rgba(0,0,0,0.8); } - /* [수정] PC/태블릿처럼 화면이 넓고 높은 환경에서만 폰 모양 테두리 적용 (비율로 자동 크기 조절) */ @media (min-width: 450px) and (min-height: 700px) { - .phone-wrapper { - height: 90vh; /* 화면 높이의 90%만 차지하게 하여 상하단 안 잘림 */ - max-height: 850px; - border-radius: 35px; - border: 8px solid #333; - } + .phone-wrapper { height: 90vh; max-height: 850px; border-radius: 35px; border: 8px solid #333; } } .safe-area-top { width: 100%; height: var(--safe-top); min-height: 30px; background: #000; z-index: 1000; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 10px; color: #666; font-weight: bold; letter-spacing: 2px; } @@ -61,7 +38,6 @@ .reset-btn { position: absolute; top: env(safe-area-inset-top, 10px); right: 10px; background: #333; color: #aaa; font-size: 10px; padding: 4px 8px; border-radius: 4px; z-index: 2000; cursor: pointer; } - /* Loading Screen Styles */ .loading-screen { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; width: 100%; background: rgba(0,0,0,0.9); z-index: 5000; position: absolute; top: 0; left: 0; } .loader-spinner { border: 4px solid rgba(255,255,255,0.1); width: 40px; height: 40px; border-radius: 50%; border-left-color: #c92a2a; animation: spin 1s linear infinite; margin-bottom: 20px; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @@ -77,8 +53,6 @@ .res-row { display: flex; justify-content: space-between; gap: 4px; } .res-box { flex: 1; background: #333; border: 1px solid #555; border-radius: 4px; padding: 4px; display: flex; flex-direction: column; font-size: 9px; position: relative; justify-content: center; } .res-val { font-weight: bold; font-family: monospace; font-size: 11px; margin-top: 2px; } - .res-val.deficit { color: #ef4444; animation: pulse-red 1s infinite; } - @keyframes pulse-red { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } } .gauge-row { display: flex; justify-content: space-between; align-items: flex-end; padding-top: 2px; } .stat-item { width: 32%; display: flex; flex-direction: column; align-items: center; position: relative; cursor: pointer; } @@ -93,25 +67,12 @@ .desk-area { flex: 1; position: relative; display: flex; justify-content: center; align-items: center; perspective: 1000px; background: #2d1b14; touch-action: none; overflow: hidden; } - /* [수정] 카드의 크기를 유동적(비율)으로 설정하여 좁은 화면에서도 삐져나가지 않음 */ .doc-card { - width: 80%; - max-width: 300px; - height: 60vh; /* 화면 높이의 60%만 차지하게 설정 */ - max-height: 440px; - background: var(--paper); - color: var(--ink); - position: absolute; - box-shadow: 0 10px 25px rgba(0,0,0,0.6); - display: flex; - flex-direction: column; - padding: 15px; - border: 1px solid #cbb; - cursor: grab; - transform-origin: 50% 100%; - will-change: transform; - z-index: 10; - transition: border-color 0.2s; + width: 80%; max-width: 300px; height: 60vh; max-height: 440px; + background: var(--paper); color: var(--ink); position: absolute; + box-shadow: 0 10px 25px rgba(0,0,0,0.6); display: flex; flex-direction: column; + padding: 15px; border: 1px solid #cbb; cursor: grab; transform-origin: 50% 100%; + will-change: transform; z-index: 10; transition: border-color 0.2s; } .doc-card:active { cursor: grabbing; } @@ -120,12 +81,9 @@ .card-header { border-bottom: 2px solid #555; padding-bottom: 8px; margin-bottom: 8px; } .card-title { font-family: 'Black Han Sans', sans-serif; font-size: 1.1rem; line-height: 1.2; margin-bottom: 4px; } - .conflict-badge { background: #222; color: #fff; font-size: 9px; padding: 2px 4px; border-radius: 4px; display: inline-block; font-weight: bold; } - .asset-badge { background: #059669; color: #fff; font-size: 9px; padding: 2px 4px; border-radius: 4px; margin-left: 4px; display: inline-block; font-weight: bold; } + .tag-badge { background: #333; color: #fff; font-size: 9px; padding: 2px 4px; border-radius: 4px; display: inline-block; font-weight: bold; margin-right: 2px; } - /* 내용이 길 경우 스크롤 가능하게 처리 */ .card-body { font-size: 12px; line-height: 1.4; flex: 1; margin-top: 5px; overflow-y: auto; padding-right: 5px; } - /* 스크롤바 숨기기 */ .card-body::-webkit-scrollbar { width: 4px; } .card-body::-webkit-scrollbar-thumb { background: #bbb; border-radius: 4px; } @@ -150,10 +108,10 @@ .law-desc { font-size: 10px; } .predict-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 70; display: none; justify-content: center; align-items: center; } - .predict-box { background: rgba(0,0,0,0.95); color: #fff; padding: 12px; border-radius: 8px; font-size: 11px; display: flex; flex-direction: column; gap: 4px; box-shadow: 0 10px 30px rgba(0,0,0,0.8); border: 1px solid #555; width: 200px; } + .predict-box { background: rgba(0,0,0,0.95); color: #fff; padding: 12px; border-radius: 8px; font-size: 11px; display: flex; flex-direction: column; gap: 4px; box-shadow: 0 10px 30px rgba(0,0,0,0.8); border: 1px solid #555; width: 200px; text-align: center; } .p-row { display: flex; justify-content: space-between; } .p-up { color: #10b981; } .p-down { color: #ef4444; } - .desc-text { color: #aaa; font-size: 9px; margin-top: 2px; text-align: right; } + .desc-text { color: #aaa; font-size: 9px; margin-top: 2px; } .menu-btn-group { position: absolute; bottom: 15px; left: 15px; right: 15px; display: flex; gap: 10px; z-index: 50; } .menu-btn { flex: 1; background: #333; color: #ccc; border: 1px solid #555; padding: 10px; border-radius: 6px; font-size: 11px; display: flex; justify-content: center; gap: 5px; cursor: pointer; align-items: center; } @@ -197,14 +155,14 @@ .lobby-tag:active { background: #555; } .lobby-tag.active { border-color: #d4af37; color: #d4af37; } - .action-btn { margin-top: auto; width: 100%; background: #c92a2a; color: #fff; padding: 12px; font-weight: bold; border-radius: 8px; text-align: center; cursor: pointer; animation: pulse 2s infinite; font-size: 13px; flex-shrink: 0; } - .action-btn.secondary { background: #10b981; animation: none; margin-top: 10px; } + .action-btn { margin-top: auto; width: 100%; background: #c92a2a; color: #fff; padding: 12px; font-weight: bold; border-radius: 8px; text-align: center; cursor: pointer; font-size: 13px; flex-shrink: 0; } + .action-btn:active { background: #991b1b; } + .action-btn.secondary { background: #10b981; margin-top: 10px; }
-
데이터베이스 연동 중...
@@ -213,7 +171,6 @@
PROJECT SS
↻ RESTART
-
★ DEV 콤보 지급
@@ -229,11 +186,10 @@
퀘스트: 0/0
+
-
총 예산$500
-
부서 예산$100
-
비자금$20
-
감시0%
+
🧬 데이터 (자원)0
+
👑 정치 자본0
@@ -243,8 +199,8 @@
-
주력: 없음
-
연쇄 기믹 없음
+
누적 태그: 없음
+
연쇄 없음
@@ -257,7 +213,10 @@
Title
-
Sender
VS
+
+ Sender +
+
Body
@@ -267,12 +226,19 @@
-
예산:
엔트로피:
-
-
신임도:
+
+
데이터 획득:
+
정치 자본:
+
엔트로피:
+
신임도:
+
+
태그 & 우호도 변화:
+
+
-
승인
거절
+
승인
+
거절
@@ -280,8 +246,9 @@
-
자산 (0)
-
법안/규칙
+
미스터리
+
자산(0)
+
법안
@@ -294,7 +261,7 @@
-
제1주주 통치 선포
+
제1주주 통치 선포 (동맹 파벌)
Loading
CONFIRMED
금주의 아젠다
금주의 퀘스트
보상: 실패:
@@ -306,16 +273,16 @@
입법 전쟁
-
여당안 (A)
+
여당안 (동맹 파벌 제안)
VS
-
야당안 (B)
+
야당안 (적대 파벌 제안)
A 지지 (50%)B 지지 (50%)
A 찬성 파벌
B 찬성 파벌
-
소수 정당 로비 (비자금 -$10)
+
소수 정당 로비 (정치 자본 -10)
결과 확정 및 다음 주 시작
@@ -323,10 +290,17 @@
+ + +